:root{color:#18201c;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f6f4ef;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.58}#app,.public-shell,.shell{min-height:100vh}.topbar{background:#f6f4efeb;border-bottom:1px solid #ded8ca;justify-content:space-between;align-items:center;min-height:72px;padding:0 32px;display:flex}.topbar.public{z-index:2;position:sticky;top:0}.topbar nav,.session,.button-row,.hero-actions,.game-actions{align-items:center;gap:12px;display:flex}.brand{color:#17221c;background:0 0;border:0;align-items:center;gap:10px;padding:0;font-weight:800;display:inline-flex}.brand-mark{color:#f9f6ef;background:#17221c;border-radius:6px;place-items:center;width:36px;height:36px;display:grid}.primary,.secondary,.ghost,.text-button{border:0;border-radius:6px;min-height:42px;padding:0 16px;font-weight:750}.primary{color:#fffaf1;background:#11684f}.primary:hover{background:#0b533f}.primary.small{min-height:38px}.secondary{color:#17221c;background:#e6dfd0}.secondary:hover,.ghost:hover,.text-button:hover{background:#ddd4c2}.ghost,.text-button{color:#314139;background:0 0}.hero{grid-template-columns:minmax(0,.95fr) minmax(360px,1.05fr);align-items:center;gap:48px;width:min(1120px,100% - 48px);min-height:calc(100vh - 72px);margin:0 auto;padding:48px 0;display:grid}.hero-copy p,.page-heading p,.auth-panel p{color:#66746d;text-transform:uppercase;margin:0 0 10px;font-size:.9rem;font-weight:800}.hero h1,.auth-panel h1,.page-heading h1{color:#17221c;letter-spacing:0;margin:0;line-height:1.02}.hero h1{max-width:760px;font-size:clamp(3.1rem,7vw,6.9rem)}.hero-actions{margin-top:30px}.board-preview{grid-template-columns:repeat(5,minmax(48px,1fr));gap:10px;display:grid;transform:rotate(-4deg)}.board-preview span{aspect-ratio:1;clip-path:polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%);background:#f7f1df;border:2px solid #17221c;box-shadow:0 16px 32px #17221c24}.board-preview span.dark{background:#17221c}.board-preview span.gold{background:#d5a53c}.auth-view{place-items:center;min-height:calc(100vh - 72px);padding:32px 20px;display:grid}.auth-panel,.panel,.empty-state,.game-card{background:#fffaf1;border:1px solid #ded8ca;border-radius:8px}.auth-panel{gap:18px;width:min(440px,100%);padding:28px;display:grid}.auth-panel h1,.page-heading h1{font-size:2.4rem}.field{color:#314139;gap:8px;font-weight:750;display:grid}.field input{color:#17221c;background:#fffef9;border:1px solid #d6cfbf;border-radius:6px;width:100%;height:46px;padding:0 12px}.field input:focus{border-color:#11684f;outline:3px solid #11684f2e}.workspace{width:min(1180px,100% - 48px);margin:0 auto;padding:36px 0 56px}.page-heading{margin-bottom:24px}.dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.panel{align-content:start;gap:18px;padding:22px;display:grid}.panel-heading,.section-heading{justify-content:space-between;align-items:center;gap:16px;display:flex}.panel-heading h2,.section-heading h2,.game-card h3,.empty-state h3{color:#17221c;margin:0}.panel-heading span,.section-heading span,.game-card p{color:#66746d}.segmented{background:#e8e1d2;border-radius:8px;grid-template-columns:repeat(2,1fr);min-height:44px;padding:4px;display:grid}.segmented button{color:#536259;background:0 0;border:0;border-radius:6px;font-weight:800}.segmented button.active{color:#17221c;background:#fffaf1;box-shadow:0 1px 5px #17221c21}.toggles{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.toggles label{color:#314139;background:#fffef9;border:1px solid #ded8ca;border-radius:6px;align-items:center;gap:8px;min-height:42px;padding:0 10px;font-weight:700;display:flex}.invite-preview{background:#edf4ed;border-radius:6px;justify-content:space-between;align-items:center;gap:12px;padding:14px;display:flex}.lobby-status{color:#66746d;margin:-4px 0 0;font-size:.9rem;font-weight:750}.games-section{margin-top:28px}.empty-state{margin-top:14px;padding:28px}.empty-state p,.game-card p{margin:6px 0 0}.game-list{gap:12px;margin-top:14px;display:grid}.game-card{justify-content:space-between;align-items:center;gap:16px;padding:18px;display:flex}.play-shell{background:#eeece5}.play-layout{grid-template-columns:320px minmax(0,1fr);min-height:calc(100vh - 72px);display:grid}.play-panel{background:#fffaf1;border-right:1px solid #d7d1c3;align-content:start;gap:20px;padding:24px;display:grid}.eyebrow{color:#66746d;text-transform:uppercase;margin:0 0 6px;font-size:.82rem;font-weight:850}.play-panel h1{color:#17221c;text-transform:capitalize;margin:0;font-size:1.55rem;line-height:1.15}.turn-grid{border:1px solid #ded8ca;border-radius:8px;grid-template-columns:repeat(2,minmax(0,1fr));display:grid;overflow:hidden}.turn-grid div{background:#fffef9;border-bottom:1px solid #ded8ca;border-right:1px solid #ded8ca;gap:4px;min-height:68px;padding:12px;display:grid}.turn-grid div:nth-child(2n){border-right:0}.turn-grid div:nth-last-child(-n+2){border-bottom:0}.turn-grid span,.panel-heading.tight span,.history-list span{color:#66746d;text-transform:uppercase;font-size:.78rem;font-weight:800}.turn-grid strong{color:#17221c;text-transform:capitalize;font-size:1rem}.hand-panel{gap:12px;display:grid}.panel-heading.tight h2{font-size:1rem}.hand-inventories{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.inventory-column{background:#fbf8f0;border:1px solid #ded8ca;border-radius:8px;align-content:start;gap:8px;min-width:0;padding:10px;display:grid}.inventory-column.playable{border-color:#11684f;box-shadow:0 0 0 3px #11684f1f}.inventory-heading{justify-content:space-between;align-items:center;gap:8px;min-height:24px;display:flex}.inventory-heading strong{color:#17221c;text-transform:capitalize;font-size:.88rem}.inventory-heading span{color:#66746d;text-transform:uppercase;font-size:.72rem;font-weight:800}.inventory-column.owner-black{background:#f2f3f1}.hand-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;display:grid}.hand-grid button{aspect-ratio:1;color:#17221c;background:#fffef9;border:1px solid #d6cfbf;border-radius:7px;place-items:center;gap:3px;display:grid}.hand-grid button.active{border-color:#11684f;outline:3px solid #11684f2e}.hand-grid button.empty{color:#8d978f;background:#f2eee5}.hand-grid button img{object-fit:contain;pointer-events:none;width:40px;height:45px}.hand-grid button strong{font-size:.78rem}.history-list{background:#fffef9;border:1px solid #ded8ca;border-radius:8px;max-height:220px;display:grid;overflow:auto}.history-list.full{max-height:min(60vh,520px)}.history-list div{border-bottom:1px solid #ede7da;justify-content:space-between;align-items:center;gap:10px;min-height:38px;padding:0 12px;display:flex}.history-list div:last-child{border-bottom:0}.history-list strong,.history-list span{text-transform:capitalize}.history-button{justify-content:space-between;align-items:center;gap:12px;display:flex}.history-button span,.coordinate-toggle span{color:#fffaf1;background:#17221c;border-radius:999px;place-items:center;min-width:28px;height:28px;font-size:.82rem;display:grid}.coordinate-toggle{justify-content:space-between;align-items:center;gap:12px;display:flex}.coordinate-toggle.active{color:#fffaf1;background:#11684f}.coordinate-toggle.active span{color:#17221c;background:#fffaf1}.modal-backdrop{z-index:20;background:#17221c75;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.modal-panel{background:#fffaf1;border:1px solid #d7d1c3;border-radius:8px;width:min(520px,100%);max-height:calc(100vh - 48px);overflow:auto;box-shadow:0 24px 80px #17221c40}.history-modal{gap:16px;padding:22px;display:grid}.result-modal{gap:16px;padding:28px;display:grid}.result-modal h2,.modal-heading h2{color:#17221c;margin:0}.result-modal h2{font-size:2.1rem}.result-modal p:not(.eyebrow){color:#314139;margin:0;font-size:1.05rem;font-weight:700}.modal-heading{justify-content:space-between;align-items:center;gap:16px;display:flex}.board-stage{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;background:#eeece5;min-height:calc(100vh - 72px);position:relative;overflow:hidden}.board-stage.panning{cursor:grabbing}.board-controls{z-index:4;background:#fffaf1eb;border:1px solid #d7d1c3;border-radius:8px;align-items:center;gap:8px;padding:6px;display:flex;position:absolute;top:18px;right:18px;box-shadow:0 10px 30px #17221c1f}.board-controls button{color:#17221c;background:#e6dfd0;border:0;border-radius:6px;place-items:center;min-width:38px;min-height:36px;font-weight:850;display:grid}.board-controls button:hover{background:#d8cfbd}.board-stage svg{width:100%;height:calc(100vh - 72px);min-height:520px;display:block}.hex-cell{cursor:pointer}.hex-cell polygon{fill:#f7f1df;stroke:#c9bfae;stroke-width:3px;transition:fill .14s,stroke .14s,stroke-width .14s}.hex-cell.occupied polygon{stroke:#7d7466;stroke-width:4px}.hex-cell.occupied.owner-white polygon{fill:#fffaf1}.hex-cell.occupied.owner-black polygon{fill:#17221c}.hex-cell.highlighted polygon{stroke:#11684f;stroke-width:6px}.hex-cell.selected polygon{stroke:#9b741a;stroke-width:6px}.coordinate-labels{pointer-events:none}.coordinate-labels text{fill:#1e1e1e;font-size:11px;font-weight:850}.coordinate-labels.on-black text{fill:#e8e8e8}.piece-token{pointer-events:none}.piece-token image{overflow:visible}.hex-cell .stack-count{fill:#8f2626;pointer-events:none;font-size:13px;font-weight:900}code,.pill{color:#17221c;background:#e8e1d2;border-radius:999px;padding:6px 10px;font-size:.9rem;font-weight:800}.error{color:#8f2626;margin:12px 0 0;font-weight:750}@media (width<=820px){.topbar{padding:0 18px}.hero,.dashboard-grid{grid-template-columns:1fr}.hero{gap:34px;width:min(100% - 32px,680px)}.board-preview{grid-template-columns:repeat(5,minmax(34px,1fr))}.workspace{width:min(100% - 32px,680px)}.toggles{grid-template-columns:1fr}.game-card,.panel-heading,.section-heading{flex-direction:column;align-items:flex-start}.game-actions{flex-wrap:wrap}.play-layout{grid-template-columns:1fr}.play-panel{border-bottom:1px solid #d7d1c3;border-right:0}.board-stage,.board-stage svg{height:58vh;min-height:460px}}