:root{--bg:#f6f7f9;--surface:#fff;--text:#16181d;--muted:#6b7180;--line:#d5d9e0;--field:#fff;--field-stroke:#b8bec9;--barricade:#2b2f38;--accent:#16181d;--target:#f5a524;--p0:#e5484d;--p1:#30a46c;--p2:#f5b301;--p3:#3e63dd;--radius:14px;--ease:cubic-bezier(.2, .8, .2, 1);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:ui-rounded,SF Pro Rounded,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#111318;--surface:#1b1e25;--text:#eef0f4;--muted:#9298a6;--line:#353a45;--field:#232731;--field-stroke:#4a505e;--barricade:#eef0f4;--accent:#eef0f4}}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent;margin:0}button{font:inherit;color:inherit;cursor:pointer}.app{max-width:720px;min-height:100dvh;padding:max(12px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));margin:0 auto;position:relative}.top-right{top:max(12px, env(safe-area-inset-top));z-index:2;position:absolute;right:16px}.lang{background:var(--surface);border:1px solid var(--line);border-radius:999px;gap:2px;padding:3px;display:flex}.lang button{color:var(--muted);background:0 0;border:0;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:700}.lang button.active{background:var(--accent);color:var(--bg)}.setup{text-align:center;flex-direction:column;align-items:center;gap:20px;padding-top:18vh;display:flex}.logo{letter-spacing:-.04em;margin:0;font-size:clamp(48px,14vw,80px);line-height:1}.logo:after{content:"";background:var(--p0);border-radius:.06em;width:.28em;height:.28em;margin-left:.06em;display:inline-block}.tagline{color:var(--muted);margin:-8px 0 8px}.bots{border:0;gap:8px;margin:0;padding:0;display:flex}.bots legend{width:100%;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;font-size:13px;font-weight:600}.bots button{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);min-width:84px;padding:12px 14px}.bots button.active{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);font-weight:700}.primary{background:var(--accent);min-width:220px;color:var(--bg);transition:transform .15s var(--ease);border:0;border-radius:999px;padding:16px 28px;font-size:17px;font-weight:700}.primary:active{transform:scale(.97)}.ghost{color:var(--muted);background:0 0;border:0;padding:8px 4px;font-weight:600}.howto{max-width:420px;color:var(--muted);font-size:14px;line-height:1.5}.game{flex-direction:column;gap:12px;display:flex}.game-bar{flex-direction:column;gap:8px;padding-right:130px;display:flex}.game-bar .ghost{align-self:flex-start}.players{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.chip{background:var(--surface);border:1px solid var(--line);opacity:.6;border-radius:999px;align-items:center;gap:6px;padding:5px 10px 5px 8px;font-size:13px;font-weight:600;transition:opacity .2s;display:flex}.chip:before{content:"";background:var(--seat);border-radius:50%;width:10px;height:10px}.chip.active{opacity:1;border-color:var(--seat)}.pawns-out{color:var(--muted);font-weight:500}.seat-0{--seat:var(--p0)}.seat-1{--seat:var(--p1)}.seat-2{--seat:var(--p2)}.seat-3{--seat:var(--p3)}.board{-webkit-user-select:none;user-select:none;touch-action:manipulation;width:100%;height:auto;max-height:72dvh}.edge{stroke:var(--line);stroke-width:.12px}.field{fill:var(--field);stroke:var(--field-stroke);stroke-width:.06px}.field.goal{fill:var(--target);stroke:none}.barricade{fill:var(--barricade)}.target{cursor:pointer}.target-ring{fill:color-mix(in srgb, var(--target) 25%, transparent);stroke:var(--target);stroke-width:.08px;animation:pulse 1s var(--ease) infinite alternate;transform-box:fill-box;transform-origin:50%}.house{fill:color-mix(in srgb, var(--seat) 14%, transparent);stroke:color-mix(in srgb, var(--seat) 50%, transparent);stroke-width:.05px}.house.active{cursor:pointer;stroke:var(--seat);stroke-width:.08px}.pawn{fill:var(--seat);stroke:color-mix(in srgb, var(--seat) 60%, black);stroke-width:.06px;transition:cx .25s var(--ease), cy .25s var(--ease)}.pawn.movable{cursor:pointer;stroke:var(--accent);stroke-width:.1px}.pawn.selected{stroke:var(--target);stroke-width:.14px}.controls{align-items:center;gap:16px;min-height:84px;display:flex}.messages{flex:1}.status{margin:0;font-size:17px;font-weight:700}.notice{color:var(--muted);margin:4px 0 0;font-size:14px}.dice{background:0 0;border:0;flex:none;width:72px;height:72px;padding:0;position:relative}.dice svg{filter:drop-shadow(0 3px 6px #00000026);width:100%;height:100%}.dice-face{fill:var(--surface);stroke:var(--seat);stroke-width:1.5px}.pip{fill:var(--text)}.dice.ready .dice-face{fill:var(--seat)}.dice.ready svg{animation:bob 1.2s var(--ease) infinite}.dice-label{color:#fff;place-items:center;font-size:14px;font-weight:800;display:grid;position:absolute;inset:0}.dice.rolling svg{animation:roll .6s var(--ease)}.dice:disabled{cursor:default}.overlay{z-index:10;background:#00000073;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--surface);animation:pop .3s var(--ease);border-radius:24px;flex-direction:column;align-items:center;gap:12px;padding:28px 24px;display:flex}.modal h2{margin:0 0 8px;font-size:28px}@keyframes roll{0%{transform:rotate(0)scale(1)}50%{transform:rotate(200deg)scale(.85)}to{transform:rotate(360deg)scale(1)}}@keyframes bob{50%{transform:translateY(-3px)}}@keyframes pulse{to{transform:scale(1.15)}}@keyframes pop{0%{opacity:0;transform:scale(.9)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}@media (width>=900px){.app{max-width:1040px}.game{grid-template-columns:1fr 260px;grid-template-areas:"bar bar""board controls";align-items:start;display:grid}.game-bar{grid-area:bar}.board{grid-area:board;max-height:82dvh}.controls{flex-direction:column;grid-area:controls;align-items:flex-start;padding-top:24px}.dice{width:96px;height:96px}}.hit{fill:#0000;pointer-events:fill}.board [role=button]{outline:none}.board [role=button]:focus-visible .field,.board [role=button]:focus-visible .pawn{stroke:var(--target);stroke-width:.16px}
