:root{--bg: #f3efe6;--card: #fffdf8;--text: #1f2a24;--muted: #6b726c;--line: #ddd5c4;--accent: #2f6b4f;--accent-text: #ffffff;--bad: #b3261e;--board: #5d7f68;--square: #ece3cd;--square-goal-0: #f3d4a4;--square-goal-1: #c6d5ec;--wall: #3a210f;--wall-pip: #6b4223;--last: #c2410c;--target: rgba(31, 90, 62, .75);--p0: #d9731a;--p1: #3566b0;--pawn-edge: rgba(0, 0, 0, .5);--p-ring: rgba(255, 255, 255, .85);color-scheme:light dark}@media(prefers-color-scheme:dark){:root{--bg: #121714;--card: #1c241f;--text: #eef2ee;--muted: #aab4ac;--line: #46544b;--accent: #5cae84;--accent-text: #0e1611;--bad: #ff8a80;--board: #4f6b58;--square: #d8ccb0;--square-goal-0: #e2bf88;--square-goal-1: #b3c4de;--wall: #26140a;--wall-pip: #c08a58;--last: #ffb454;--target: rgba(24, 78, 52, .8)}}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}.screen{max-width:560px;margin:0 auto;padding:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:14px}h1{margin:4px 0 0;font-size:2.2rem;letter-spacing:.02em}.hero{text-align:center;padding-top:16px}.logo{width:72px;height:72px}.tagline{margin:6px 0 0;color:var(--muted)}.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px}.row{display:flex;gap:8px;flex-wrap:wrap}.row>button{flex:1}button{font:inherit;font-weight:600;padding:10px 16px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--text);cursor:pointer}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}button.big{padding:14px 16px;font-size:1.1rem}button.link,button.quiet{background:none;border:none;padding:6px 0;color:var(--muted)}button.quiet{text-decoration:underline}.field{display:flex;flex-direction:column;gap:6px;font-weight:600}input{font:inherit;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--text)}.muted{color:var(--muted);margin:0}.small{font-size:.9rem}.center{text-align:center}.notice{margin:0;padding:10px 14px;border-radius:10px;background:var(--card);border:1px solid var(--line)}.notice.bad{color:var(--bad)}.rules summary{font-weight:600;cursor:pointer}.rules ul{margin:0;padding-left:1.2em;display:flex;flex-direction:column;gap:6px}footer{text-align:center}.build-info{color:var(--muted);font-size:.8rem;margin:8px 0 0}.game-header{display:flex;justify-content:space-between;align-items:center}.conn{color:var(--muted);font-size:.9rem}.conn-closed{color:var(--bad)}.code{font-size:2.4rem;font-weight:700;letter-spacing:.18em;margin:0;font-variant-numeric:tabular-nums}.seat,.player{display:flex;align-items:center;gap:10px}.seat-name,.player-name{font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seat-state,.away{color:var(--muted);font-size:.9rem}.dot{width:14px;height:14px;border-radius:50%;flex:none}.pawn-dot-0{background:var(--p0)}.pawn-dot-1{background:var(--p1)}.player{padding:8px 12px;border-radius:12px;border:2px solid transparent}.player.to-move{border-color:var(--line);background:var(--card)}.walls-left{display:flex;gap:3px}.walls-left i{width:5px;height:16px;border-radius:2px;background:var(--line)}.walls-left i.full{background:var(--wall-pip)}.status-row{display:flex;justify-content:space-between;align-items:center}.turn{margin:0;font-weight:700;font-size:1.1rem}.result{text-align:center}.result-line{margin:0;font-size:1.4rem;font-weight:700}.board-wrap{display:flex;flex-direction:column;gap:10px}.board{width:100%;height:auto;display:block;touch-action:manipulation;-webkit-user-select:none;user-select:none}.board-bg{fill:var(--board)}.square{fill:var(--square)}.square.goal-0{fill:var(--square-goal-0)}.square.goal-1{fill:var(--square-goal-1)}.square.last{stroke:var(--last);stroke-width:3}.board.can-act.mode-step .square,.board.can-act.mode-wall{cursor:pointer}.target{fill:var(--target);pointer-events:none}.wall{fill:var(--wall)}.wall.last{stroke:var(--last);stroke-width:2}.wall.ghost{fill:var(--wall);opacity:.5;pointer-events:none}.wall.ghost.bad{fill:var(--bad)}.pawn circle{transition:none}.pawn>circle:first-child{stroke:var(--pawn-edge);stroke-width:1.5}.pawn-0>circle:first-child{fill:var(--p0)}.pawn-1>circle:first-child{fill:var(--p1)}.pawn{filter:drop-shadow(0 2px 2px rgba(0,0,0,.35));pointer-events:none}.pawn-ring{fill:none;stroke:var(--p-ring);stroke-width:2.5}.board-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.segmented{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}.segmented button{border:none;border-radius:0}.segmented button.on{background:var(--accent);color:var(--accent-text)}.hint{margin:0;color:var(--muted);font-size:.9rem;min-height:1.2em}.hint.bad{color:var(--bad)}@media(orientation:landscape)and (max-height:520px){.screen.play{max-width:none;display:grid;grid-template-columns:min(92vh,60vw) 1fr;grid-auto-rows:min-content;column-gap:20px}.screen.play .board-wrap{grid-column:1;grid-row:1 / span 8}.screen.play>:not(.board-wrap){grid-column:2}}
