:root{--bg:#f3efe4;--surface:#fffdf7;--ink:#2b2a26;--muted:#77736a;--line:#ddd6c4;--accent:#4f7a33;--accent-ink:#fff;--danger:#b83227;--move:#2e86de;--place:#2ea043;--clean:#d18b00;--radius:10px;color:var(--ink);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}*{box-sizing:border-box}body{background:var(--bg);margin:0}button{font:inherit;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;border-radius:8px;padding:6px 12px}button:hover:not(:disabled){border-color:#b9b09a}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}button.active{outline:3px solid var(--move);outline-offset:1px}button.link{color:var(--muted);background:0 0;border:none;padding:4px;text-decoration:underline}input,select{font:inherit;border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 8px}input[type=number]{width:56px;margin-left:6px}a{color:var(--accent)}.muted{color:var(--muted)}.small{font-size:13px}.error{color:var(--danger)}.row{align-items:center;gap:8px;margin:6px 0;display:flex}.row.wrap{flex-wrap:wrap}.spacer{flex:1}.tag{color:var(--muted);background:#ece6d6;border-radius:99px;padding:1px 8px;font-size:11px}.tag.off{color:var(--danger);background:#f6d9d5}.dot{border-radius:50%;flex:none;width:12px;height:12px;display:inline-block}.offline{z-index:50;background:var(--danger);color:#fff;text-align:center;padding:4px;font-size:14px;position:fixed;top:0;left:0;right:0}.home{place-items:center;min-height:100vh;padding:16px;display:grid}.home-card{background:var(--surface);border:1px solid var(--line);text-align:center;border-radius:16px;flex-direction:column;align-items:stretch;gap:12px;width:min(380px,100%);padding:28px;display:flex}.home-card img{align-self:center}.home-card h1{letter-spacing:.5px;margin:0;font-size:32px}.home-card p{margin:0}.home-card label{text-align:left;color:var(--muted);flex-direction:column;gap:4px;font-size:14px;display:flex}.or{color:var(--muted);font-size:13px}.join-row{gap:8px;display:flex}.code-input{text-transform:uppercase;letter-spacing:4px;text-align:center;flex:1;font-weight:600}.big-code{letter-spacing:8px;font-size:44px;font-weight:700}.members{text-align:left;margin:4px 0;padding:0;list-style:none}.members li{border-bottom:1px solid var(--line);align-items:center;gap:8px;padding:8px;display:flex}.members li.empty{color:var(--muted);font-style:italic}.game{flex-direction:column;height:100vh;display:flex}.topbar{border-bottom:1px solid var(--line);background:var(--surface);flex-wrap:wrap;align-items:center;gap:8px;padding:8px 14px;display:flex}.brand{margin-right:6px;font-size:18px}.pill{background:#efe9da;border-radius:99px;padding:3px 10px;font-size:13px}.layout{flex:1;grid-template-columns:minmax(0,1fr) 400px;min-height:0;display:grid}.board-wrap{flex-direction:column;min-width:0;min-height:0;display:flex;position:relative}.board-tools{z-index:2;gap:4px;display:flex;position:absolute;top:10px;left:10px}.board-tools button{padding:3px 10px}.board-scroll{flex:1;min-height:0;padding:8px;overflow:auto}.board{-webkit-user-select:none;user-select:none;margin:0 auto;display:block}.hint{border-top:1px solid var(--line);background:var(--surface);min-height:38px;padding:8px 14px;font-size:14px}.side{border-left:1px solid var(--line);flex-direction:column;gap:10px;padding:10px;display:flex;overflow-y:auto}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px}.panel h3{align-items:center;gap:8px;margin:0 0 6px;font-size:15px;display:flex}.panel h4{color:var(--muted);margin:10px 0 4px;font-size:13px;font-weight:600}.notice{background:#e8f1fb;border-radius:6px;padding:6px 8px}.turn{border-radius:var(--radius);background:#e9e3d3;padding:10px 12px}.turn.mine{box-shadow:inset 0 0 0 2px var(--accent);background:#dcebd0}.turn-title{font-size:16px;font-weight:700}.phases{counter-reset:ph;gap:4px;margin:8px 0 0;padding:0;list-style:none;display:flex}.phases li{text-align:center;color:var(--muted);background:#ffffff80;border-radius:6px;flex:1;padding:4px;font-size:12px}.phases li.on{background:var(--surface);color:var(--ink);font-weight:600}.tokens{flex-wrap:wrap;gap:6px;display:flex}.token{align-items:center;gap:3px;font-size:15px;font-weight:600;display:inline-flex}.token img{width:24px;height:24px}.token.zero{opacity:.35}.tokens.compact .token{font-size:12px}.tokens.compact .token img{width:16px;height:16px}.river{flex-wrap:wrap;gap:6px;display:flex}.tile-btn{border-radius:8px;padding:3px;line-height:0}.thumb{display:block}.selected-opts{background:#f1ede1;border-radius:8px;padding:6px}.objs{flex-wrap:wrap;gap:8px;display:flex}.obj{border-radius:8px;flex-direction:column;align-items:stretch;gap:4px;width:108px;display:flex}.obj img{width:108px;height:auto;display:block}.obj.clickable{cursor:pointer}.obj.clickable:hover img{outline:3px solid var(--move);border-radius:8px}.obj.active img{outline:3px solid var(--accent);border-radius:8px}.obj button{padding:4px;font-size:13px}.obj-why{color:var(--muted);font-size:11px;line-height:1.25}.end-turn{flex-direction:column;align-items:stretch;gap:4px;display:flex}.end-turn button{padding:10px;font-size:15px}.players{margin:0;padding:0;list-style:none}.players li{border-bottom:1px solid var(--line);padding:8px 6px}.players li:last-child{border-bottom:none}.players li.current{background:#f1f6ea;border-radius:6px}.players .row{margin:0 0 4px}.pv{font-weight:700}.ok{color:var(--place)}.ko{color:var(--danger)}.log{max-height:220px;margin:0;padding:0;font-size:12.5px;list-style:none;overflow-y:auto}.log li{border-bottom:1px dotted var(--line);padding:2px 0}.log li.round{padding-top:6px;font-weight:700}.toggle{align-items:center;gap:6px;font-size:14px;display:inline-flex}.toggle.disabled{opacity:.45}.toast{z-index:40;color:#fff;cursor:pointer;background:#2b2a26;border-radius:10px;max-width:min(560px,90vw);padding:10px 16px;font-size:14px;position:fixed;bottom:60px;left:50%;transform:translate(-50%);box-shadow:0 6px 24px #00000040}.modal-bg{z-index:60;background:#1e1c1473;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--surface);border-radius:16px;flex-direction:column;gap:10px;width:min(420px,100%);padding:24px;display:flex}.modal h2{margin:0}.ranking{padding-left:20px}.ranking li{align-items:center;gap:8px;padding:4px 0;display:flex}.cell .slot{fill:#ffffff73;stroke:#d3cbb4;stroke-width:1.5px;stroke-dasharray:5 4}.cell .coord{fill:#c3baa2;text-anchor:middle;font-size:15px;font-weight:600}.cell.hl{cursor:pointer}.hl-rect{fill-opacity:.18;stroke-width:5px;pointer-events:none}.hl-place .hl-rect{fill:var(--place);stroke:var(--place)}.hl-move .hl-rect{fill:var(--move);stroke:var(--move)}.hl-red .hl-rect{fill:var(--danger);stroke:var(--danger)}.hl-clean .hl-rect{fill:var(--clean);stroke:var(--clean)}.cell.hl:hover .hl-rect{fill-opacity:.38}.hl-flash{cursor:default}.hl-flash .hl-rect{fill:#ffd84d;stroke:#e1a82c;fill-opacity:.3;animation:1.8s ease-out forwards flash}@keyframes flash{0%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.hl-flash .hl-rect{animation:none}}.ghost{opacity:.8;pointer-events:none}.frontier{stroke:#e1a82c;stroke-width:7px;stroke-linecap:round;opacity:.85;pointer-events:none}.player-label{font-size:34px;font-weight:700}.player-label.current{text-decoration:underline}.player-sub{fill:var(--muted);font-size:26px}.pawn-halo{fill:#fff6b0;stroke:#e1a82c;stroke-width:3px}@media (width<=900px){.game{height:auto;min-height:100vh}.layout{grid-template-columns:1fr}.board-scroll{height:70vh}.side{border-left:none}}.demo-box{border-top:1px solid var(--line);flex-direction:column;gap:8px;margin-top:4px;padding-top:12px;display:flex}.demo-box select{flex:1}