:root{--cell: 72px;--board-gap: 2px;--rotate-size: 1.75rem;--rotate-gap: 4px;--board-gutter: 2rem;--board-border: 6px;color:#1c2416;background:#e7efe0;font-family:Iowan Old Style,Palatino,Palatino Linotype,serif;line-height:1.4}body{margin:0}.app-frame{height:100dvh;display:flex;flex-direction:column}.top-nav{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;flex-shrink:0;padding:.55rem 1.5rem;background:#24351f;color:#f4f7ef}.top-nav a{color:#f4f7ef;text-decoration:none}.top-nav .brand{margin-right:auto;font-weight:700}.top-nav button{background:transparent;color:#f4f7ef;border:1px solid rgba(244,247,239,.7);padding:.2rem .55rem}button,input{font:inherit}.button,button{background:#2f4a28;color:#f4f7ef;border:0;border-radius:4px;padding:.45rem .8rem;cursor:pointer;text-decoration:none}.button.danger,button.danger{background:#8a1f1f;color:#f4f7ef}button:disabled{opacity:.5;cursor:not-allowed}a{color:#1f4d78}.shell{max-width:1100px;margin:0 auto;padding:1.5rem}main.shell{flex:1;width:100%;min-height:0;overflow:auto;box-sizing:border-box}.room-shell{display:flex;flex-direction:column}main.room-shell{overflow:hidden}.row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}.rooms{list-style:none;padding:0}.rooms li{display:flex;gap:1rem;align-items:baseline;padding:.4rem 0;border-bottom:1px solid #c9d4bf}.error{color:#8a1f1f}.room-layout{display:grid;grid-template-columns:220px 1fr;gap:1rem;align-items:stretch;flex:1;min-height:0}.room-layout.seats-collapsed{grid-template-columns:max-content 1fr}.room-board{display:flex;flex-direction:column;gap:1rem;min-width:0;min-height:0}.auth-form{display:flex;flex-direction:column;gap:.75rem;max-width:24rem}.auth-form label{display:flex;flex-direction:column;gap:.25rem}.auth-form label.check{flex-direction:row;align-items:center}.with-unit{display:flex;align-items:stretch}.with-unit input{flex:1;min-width:0;border:1px solid #8ea384;border-right:0;border-radius:4px 0 0 4px;padding:.4rem .55rem;background:#fff}.with-unit>span{display:flex;align-items:center;padding:.4rem .7rem;border:1px solid #8ea384;border-radius:0 4px 4px 0;background:#f7faf3;white-space:nowrap}.auth-form fieldset{display:flex;flex-direction:column;gap:.75rem;margin:0;border:1px solid #c9d4bf;border-radius:6px;padding:.75rem}.row label.check{display:flex;flex-direction:row;align-items:center;gap:.35rem}.seats{display:flex;flex-direction:column;gap:.75rem;background:#f7faf3;border:1px solid #c9d4bf;border-radius:6px;padding:.75rem;overflow:hidden;min-height:0}.seats.collapsed{max-width:16rem;overflow:auto}.seats-bar,.hand{display:flex;align-items:center;gap:.6rem;min-width:0}.seats-bar{flex-wrap:wrap}.seats-toggle{width:2rem;height:2rem;padding:.3rem;flex-shrink:0}.seats-toggle svg{display:block;width:100%;height:100%}.seats-toggle[aria-expanded=true] svg{transform:rotate(90deg)}.hand h2,.hand p{margin:0}.hand h2{font-size:.95rem}.seat-list{overflow:auto;min-height:0}.seat-summary{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem}.seat-summary li{display:flex;gap:.4rem;align-items:baseline;flex-wrap:wrap}.seat{margin-bottom:.6rem}.seat-meeple{width:1.25rem;height:1.25rem;display:inline-block;margin-top:.15rem}.seat-tile{width:3rem;height:3rem;margin-top:.35rem}.swatch{width:.8rem;height:.8rem;border-radius:50%;margin-top:.25rem}.swatch.preview{width:1.5rem;height:1.5rem;margin-top:0;flex:none;border:1px solid #c9d4bf}.color-field{display:flex;gap:.5rem;align-items:center}.skin-list{display:flex;gap:.75rem;margin:.5rem 0 1rem}.skin-row,.skin-form{display:flex;flex-direction:column;gap:.75rem;align-items:center}.skin-form{flex-direction:column;align-items:stretch}.skin-preview{width:3.5rem;height:3.5rem}.skin-editor .actions{display:flex;flex-direction:column;gap:.5rem;font-size:.75rem}.tabs{display:flex;gap:.5rem;margin:1rem 0}.tabs button[aria-selected=true]{outline:2px solid #1c2416}.note{margin:0;color:#3d4a34}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:.75rem;margin:1rem 0}.stats div{background:#f7faf3;border:1px solid #c9d4bf;border-radius:6px;padding:.75rem}.stats dt{color:#3d4a34}.stats dd{margin:.2rem 0 0;font-size:1.4rem}.board-wrap{position:relative;flex:1;min-height:0;overflow:hidden;background:#314028;border-radius:6px}.board-view{position:absolute;inset:var(--board-gutter);overflow:hidden;touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;cursor:grab}.board-view.panning{cursor:grabbing}.compass{position:absolute;z-index:2;right:.35rem;bottom:.35rem;display:grid;grid-template-columns:repeat(3,1.7rem);grid-template-rows:repeat(3,1.7rem);gap:2px;pointer-events:none}.compass button{pointer-events:auto;width:1.7rem;height:1.7rem;padding:.2rem;border-radius:4px;background:#142010d1;color:#f4f7ef}.compass .pan-n{grid-column:2;grid-row:1}.compass .pan-w{grid-column:1;grid-row:2}.compass .recenter{grid-column:2;grid-row:2}.compass .pan-e{grid-column:3;grid-row:2}.compass .pan-s{grid-column:2;grid-row:3}.compass button svg{display:block;width:100%;height:100%}.board-stage{position:absolute;top:0;left:0;transform-origin:0 0}.board{display:grid;gap:var(--board-gap);outline:var(--board-border) solid #f4f7ef;outline-offset:0}.board-labels{position:absolute;inset:0;pointer-events:none}.board-label{position:absolute;color:#d5e0cc;font-family:ui-sans-serif,system-ui,sans-serif;font-size:.7rem;line-height:1;pointer-events:none;white-space:nowrap;z-index:1;transform:translate(-50%,-50%)}.board-label.origin{color:#f4d678;font-weight:700}.cell{width:var(--cell);height:var(--cell);position:relative}.cell .empty{width:100%;height:100%;background:transparent;border:1px dashed transparent;padding:0}.cell.placing{z-index:1}.cell .ghost{width:100%;height:100%;outline:2px solid #f4d678;outline-offset:-2px}button.rotate{position:absolute;left:100%;top:50%;z-index:1;width:var(--rotate-size);height:var(--rotate-size);margin-left:var(--rotate-gap);padding:.2rem;transform:translateY(-50%);border-radius:50%;background:#f4d678;color:#24301c}button.rotate svg{display:block;width:100%;height:100%}.cell button.legal{background:#f4d67859;border:1px dashed #f4d678;width:100%;height:100%}.tile-svg.ghost .tile-art{opacity:.55}.tile-svg{width:100%;height:100%;display:block}.hand-preview{width:var(--cell);height:var(--cell);flex-shrink:0}.hand-message{font-size:.75rem}.meeple-target{cursor:pointer;stroke:#1b1b1b;stroke-width:1.5;opacity:.5}.meeple-target:hover,.meeple-target:focus-visible{stroke:#f4d678;stroke-width:3}.meeple-target[aria-disabled=true]{cursor:not-allowed}@media(max-width:800px){.room-layout,.room-layout.seats-collapsed{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);overflow:hidden}.seats:not(.collapsed){max-height:40vh}.seats.collapsed{flex-direction:row;align-items:center;max-width:none;overflow-x:auto}.seats.collapsed .seat-summary li{flex-wrap:nowrap;white-space:nowrap}.board-wrap{min-height:0}}