@font-face{font-family:Space Grotesk;font-style:normal;font-weight:500 700;font-display:swap;src:url(./space-grotesk-latin-BhU9QXUp.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--p1:#4fd8ff;--p2:#ff8a4c;--text:#e9efff;--muted:#d2deff99;--glass:#0609148c;--line:#a0beff24;font-family:Space Grotesk,system-ui,-apple-system,Segoe UI,sans-serif}html,body{height:100%;color:var(--text);overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;background:#03050d;margin:0;overflow:hidden}.stage{--pad:clamp(6px, 1.4vmax, 12px);position:fixed;inset:0}#game-container{position:absolute;inset:0}canvas{display:block}.hud{pointer-events:none;position:absolute;inset:0}.pill{--pc:var(--p1);top:max(var(--pad), env(safe-area-inset-top));background:var(--glass);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--line);opacity:.55;border-radius:10px;width:clamp(110px,17%,190px);padding:7px 10px;transition:opacity .25s,border-color .25s,box-shadow .25s;position:absolute}.pill[data-player="1"]{left:max(var(--pad), env(safe-area-inset-left))}.pill[data-player="2"]{--pc:var(--p2);right:max(var(--pad), env(safe-area-inset-right))}@media (orientation:portrait){.pill{width:clamp(96px,32%,190px)}.pill[data-player="1"]{top:auto;bottom:max(var(--pad), env(safe-area-inset-bottom))}}.pill.active{opacity:1;border-color:color-mix(in srgb, var(--pc) 60%, transparent);box-shadow:0 0 18px color-mix(in srgb, var(--pc) 28%, transparent)}.pill-row{white-space:nowrap;align-items:center;gap:6px;font-size:clamp(10px,1.3vmax,13px);font-weight:600;display:flex}.pill[data-player="2"] .pill-row{flex-direction:row-reverse}.dot{background:var(--pc);width:7px;height:7px;box-shadow:0 0 8px var(--pc);border-radius:50%;flex:none}.pips{gap:5px;margin-left:auto;display:flex}.pill[data-player="2"] .pips{flex-direction:row-reverse;margin-left:0;margin-right:auto}.pips i{border:1.5px solid color-mix(in srgb, var(--pc) 70%, transparent);border-radius:50%;width:9px;height:9px;transition:background .3s,box-shadow .3s,transform .3s}.pips i.won{background:var(--pc);box-shadow:0 0 10px var(--pc);transform:scale(1.1)}.pips .shots{color:var(--muted);font-weight:500}.timer{border-radius:999px;height:2px;margin-top:5px;overflow:hidden}.timer i{border-radius:inherit;background:var(--pc);transform-origin:0;height:100%;display:block;transform:scaleX(0)}.pill[data-player="2"] .timer i{transform-origin:100%}.timer i.low{background:#ff5a5a;box-shadow:0 0 6px #ff5a5a}.fire-button{--fc:var(--p1);right:max(var(--pad), env(safe-area-inset-right));bottom:max(calc(var(--pad) + 4px), env(safe-area-inset-bottom));border:2px solid var(--fc);background:color-mix(in srgb, var(--fc) 22%, #06091499);width:76px;height:76px;box-shadow:0 0 18px color-mix(in srgb, var(--fc) 35%, transparent);color:#fff;letter-spacing:.12em;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:50%;place-items:center;padding:0;font:700 15px/1 Space Grotesk,system-ui,sans-serif;transition:opacity .2s,transform 80ms,border-color .25s,background .25s;display:none;position:absolute}body[data-turn="2"] .fire-button{--fc:var(--p2)}@media (any-pointer:coarse){.fire-button{display:grid}}@media (orientation:portrait){.fire-button{right:auto;left:max(var(--pad), env(safe-area-inset-left));bottom:calc(max(var(--pad), env(safe-area-inset-bottom)) + 60px)}}.fire-button:active:not(:disabled){transform:scale(.92)}.fire-button:disabled{opacity:.22;box-shadow:none}.turns[hidden]{display:none}.turns{left:50%;bottom:max(var(--pad), env(safe-area-inset-bottom));pointer-events:none;background:#06091459;border-radius:999px;gap:6px;padding:5px 8px;display:flex;position:absolute;transform:translate(-50%)}@media (orientation:portrait){.turns{left:auto;right:max(var(--pad), env(safe-area-inset-right));transform:none}}.turns i{border:1.5px solid #d2deff59;border-radius:50%;width:7px;height:7px;transition:background .3s,border-color .3s,box-shadow .3s}.turns i.left{background:#d2deff38;border-color:#0000}.turns i.half.p1{background:color-mix(in srgb, var(--p1) 45%, transparent);box-shadow:0 0 5px color-mix(in srgb, var(--p1) 30%, transparent);border-color:#0000}.turns i.half.p2{background:color-mix(in srgb, var(--p2) 45%, transparent);box-shadow:0 0 5px color-mix(in srgb, var(--p2) 30%, transparent);border-color:#0000}.round-clock{left:50%;bottom:max(var(--pad), env(safe-area-inset-bottom));color:#d2deffb3;font-variant-numeric:tabular-nums;letter-spacing:.04em;pointer-events:none;background:#06091459;border-radius:999px;padding:4px 10px;font-size:13px;font-weight:600;transition:color .3s;position:absolute;transform:translate(-50%)}.round-clock[hidden]{display:none}.round-clock.low{color:#ff6b6b}.turns:not([hidden])~.round-clock{bottom:calc(max(var(--pad), env(safe-area-inset-bottom)) + 26px)}@media (orientation:portrait){.round-clock{left:auto;right:max(var(--pad), env(safe-area-inset-right));transform:none}}.fire-status{left:50%;bottom:calc(max(var(--pad), env(safe-area-inset-bottom)) + 30px);color:#d2deff73;letter-spacing:.14em;white-space:nowrap;pointer-events:none;background:#06091459;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:700;transition:color .2s;position:absolute;transform:translate(-50%)}.fire-status[hidden]{display:none}body[data-turn="1"] .fire-status.ready{color:var(--p1)}body[data-turn="2"] .fire-status.ready{color:var(--p2)}@media (orientation:portrait){.fire-status{left:auto;right:max(var(--pad), env(safe-area-inset-right));transform:none}}.buttons{top:max(var(--pad), env(safe-area-inset-top));pointer-events:auto;gap:6px;display:flex;position:absolute;left:50%;transform:translate(-50%)}@media (orientation:portrait){.buttons{left:max(var(--pad), env(safe-area-inset-left));transform:none}}.icon-btn{border:1px solid var(--line);background:var(--glass);width:clamp(30px,3.6vmax,38px);height:clamp(30px,3.6vmax,38px);color:var(--muted);cursor:pointer;touch-action:manipulation;border-radius:50%;place-items:center;padding:0;transition:color .15s,background .15s;display:grid}.icon-btn:hover{color:var(--text);background:#ffffff1f}.icon-btn svg{width:52%;height:52%}.icon-btn[hidden],.mute-button .sound-off,.mute-button[aria-pressed=true] .sound-on{display:none}.mute-button[aria-pressed=true] .sound-off{display:inline}button:focus-visible{outline:2px solid var(--p1);outline-offset:2px}body.in-menu .hud{display:none}.start-menu{padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));z-index:5;background:radial-gradient(60% 60%,#03050d8c,#03050d00 70%);place-items:center;display:grid;position:fixed;inset:0}.start-menu[hidden]{display:none}.start-menu:not([hidden]){animation:.4s ease-out menu-in}@keyframes menu-in{0%{opacity:0}}.menu-corner{top:max(10px, env(safe-area-inset-top));right:max(10px, env(safe-area-inset-right));opacity:.7;gap:6px;display:flex;position:absolute}.menu-corner .icon-btn,.hud .buttons .icon-btn{font:700 16px/1 Space Grotesk,system-ui,sans-serif}.menu-corner .icon-btn:disabled{cursor:default}.menu-body{flex-direction:column;align-items:stretch;gap:clamp(16px,4vh,32px);width:min(100%,420px);display:flex}.menu-title{text-align:center;letter-spacing:.08em;color:var(--text);text-shadow:0 0 30px #4fd8ff59;margin:0;font-size:clamp(30px,8vmin,54px);font-weight:700;line-height:.95}.menu-title span{color:var(--p1);display:block}.menu-tagline{text-align:center;letter-spacing:.08em;color:var(--muted);margin:10px 0 0;font-size:13px}.menu-options{flex-direction:column;gap:10px;display:flex}.menu-option{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);width:100%;color:var(--text);text-align:left;cursor:pointer;touch-action:manipulation;border-radius:14px;flex-direction:column;align-items:flex-start;gap:3px;padding:14px 18px;transition:border-color .15s,background .15s,transform .1s,box-shadow .15s,opacity .3s;display:flex;position:relative}.menu-option:not(:disabled):is(:hover,.selected){border-color:var(--p1);box-shadow:0 0 0 1px color-mix(in srgb, var(--p1) 40%, transparent), 0 0 26px color-mix(in srgb, var(--p1) 35%, transparent);background:#1c3054d9}.menu-option:focus-visible{outline:none}.menu-option:active:not(:disabled){transform:scale(.985)}.option-title{letter-spacing:.1em;font:700 17px/1.1 Space Grotesk,system-ui,sans-serif}.option-sub{color:var(--muted);font:500 13px/1.3 Space Grotesk,system-ui,sans-serif}.menu-option.primary{border-color:color-mix(in srgb, var(--p1) 45%, transparent);background:linear-gradient(135deg,#4fd8ff38,#4fd8ff0f)}.menu-option:disabled,.menu-option.primary:disabled{cursor:default;opacity:.5;border-color:var(--line);background:var(--glass)}.soon{border:1px solid var(--line);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-radius:999px;padding:3px 8px;font:700 10px/1 Space Grotesk,system-ui,sans-serif;position:absolute;top:50%;right:14px;transform:translateY(-50%)}.menu-option:not(:disabled) .soon{display:none}body.loading .menu-option,body.loading .menu-corner{pointer-events:none}body.loading .menu-option{opacity:.5}.menu-loading{left:0;right:0;bottom:max(18px, env(safe-area-inset-bottom));text-align:center;letter-spacing:.3em;text-transform:uppercase;color:var(--muted);margin:0;font-size:11px;font-weight:700;animation:1.4s ease-in-out infinite loading-pulse;position:absolute}body:not(.loading) .menu-loading{display:none}@keyframes loading-pulse{50%{opacity:.35}}@media (orientation:landscape) and (height<=520px){.menu-body{grid-template-columns:1fr 1.2fr;align-items:center;gap:24px;width:min(100%,760px);display:grid}.menu-options{gap:7px}.menu-option{padding:9px 14px}.option-sub{font-size:12px}}@media (orientation:landscape) and (height<=400px){.menu-corner{right:auto;left:max(10px, env(safe-area-inset-left))}.menu-options{gap:5px}.menu-option{gap:1px;padding:6px 14px}.option-title{font-size:15px}.option-sub{font-size:11px}}@media (orientation:portrait) and (height<=620px){.menu-body{gap:14px}.menu-options{gap:7px}.menu-option{padding:9px 16px}}.help-sheet{width:min(100%,520px);padding:22px 24px 18px;font-size:14px;line-height:1.5}.help-intro{color:var(--text);margin:0 0 16px}.help-sheet h3{letter-spacing:.16em;text-transform:uppercase;color:var(--p1);margin:18px 0 6px;font-size:11px;font-weight:700}.help-sheet h4{color:var(--text);margin:10px 0 4px;font-size:13px;font-weight:700}.help-sheet ul{color:#e1e9ffdb;margin:0;padding-left:18px}.help-sheet li{margin:3px 0}.help-sheet strong{color:var(--text)}.help-sheet kbd{border:1px solid var(--line);text-align:center;background:#ffffff12;border-radius:5px;min-width:1.6em;padding:0 5px;font:600 12px/1.5 Space Grotesk,system-ui,sans-serif;display:inline-block}.help-diagram{width:100%;max-width:360px;height:auto;margin:8px auto 4px;display:block}.touch-help{display:none}@media (any-pointer:coarse){.touch-help{display:block}}@media (hover:none) and (pointer:coarse){.keyboard-help,.mouse-help{display:none}}.modal{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:10;background:#02030a99;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal[hidden]{display:none}.sheet{border:1px solid var(--line);-webkit-user-select:auto;user-select:auto;touch-action:pan-y;overscroll-behavior:contain;background:#0a0e1ef0;border-radius:16px;width:min(100%,380px);max-height:calc(100dvh - 32px);padding:20px;overflow-y:auto;box-shadow:0 24px 60px #0009}.sheet h2{letter-spacing:.04em;margin:0 0 14px;font-size:18px;font-weight:700}.field{border:0;margin:0 0 16px;padding:0}.field legend{letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;padding:0;font-size:11px;font-weight:700}.segmented{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.segmented label{cursor:pointer;position:relative}.segmented input{opacity:0;pointer-events:none;position:absolute}.segmented span{border:1px solid var(--line);height:40px;color:var(--muted);background:#ffffff0a;border-radius:10px;place-items:center;font-size:14px;font-weight:600;transition:background .15s,border-color .15s,color .15s;display:grid}.segmented label:hover span{color:var(--text);background:#ffffff14}.segmented input:checked+span{color:#04070f;background:var(--p1);border-color:var(--p1)}.segmented input:focus-visible+span{outline:2px solid var(--p1);outline-offset:2px}.hint{color:var(--muted);margin:6px 2px 0;font-size:12px}.note{color:var(--text);background:#ffffff0d;border-radius:8px;margin:0 0 14px;padding:8px 10px;font-size:12px}.note[hidden]{display:none}.actions{justify-content:flex-end;gap:8px;display:flex}.btn{letter-spacing:.06em;cursor:pointer;touch-action:manipulation;border-radius:999px;height:40px;padding:0 18px;font:700 13px Space Grotesk,system-ui,sans-serif}.btn.primary{background:var(--p1);color:#04070f;border:none}.btn.secondary{border:1px solid var(--line);color:var(--text);background:0 0;font-weight:500}.settings-group{margin:0}.settings-group+.settings-group{border-top:1px solid var(--line);margin-top:18px;padding-top:16px}.settings-group[hidden]{display:none}.group-title{letter-spacing:.08em;text-transform:uppercase;color:var(--text);margin:0 0 10px;font-size:13px;font-weight:700}.group-hint{margin:-4px 2px 14px}.audio-row{grid-template-columns:9.5em 1fr 2.8em;align-items:center;gap:12px;min-height:44px;display:grid}.switch{cursor:pointer;align-items:center;gap:10px;font-size:14px;font-weight:600;display:flex;position:relative}.switch input{opacity:0;pointer-events:none;position:absolute}.switch-track{border:1px solid var(--line);background:#ffffff1a;border-radius:999px;flex:none;width:36px;height:20px;transition:background .15s,border-color .15s;position:relative}.switch-track:after{content:"";background:var(--muted);border-radius:50%;width:14px;height:14px;transition:transform .15s,background .15s;position:absolute;top:2px;left:2px}.switch input:checked+.switch-track{background:var(--p1);border-color:var(--p1)}.switch input:checked+.switch-track:after{background:#04070f;transform:translate(16px)}.switch input:focus-visible+.switch-track{outline:2px solid var(--p1);outline-offset:2px}.volume{width:100%;height:28px;accent-color:var(--p1);cursor:pointer;margin:0}.volume:disabled{opacity:.3;cursor:default}.volume-value{text-align:right;font-variant-numeric:tabular-nums;color:var(--muted);font-size:12px}.link-btn{font:inherit;color:var(--p1);cursor:pointer;background:0 0;border:none;padding:0;font-weight:700;text-decoration:underline}.tip-sheet{width:min(100%,400px);font-size:14px;line-height:1.5}.tip-sheet ul{color:#e1e9ffdb;margin:0 0 12px;padding-left:18px}.tip-sheet li{margin:4px 0}.tip-sheet strong{color:var(--text)}.tip-sheet kbd{border:1px solid var(--line);text-align:center;background:#ffffff12;border-radius:5px;min-width:1.6em;padding:0 5px;font:600 12px/1.5 Space Grotesk,system-ui,sans-serif;display:inline-block}.tip-footnote{color:var(--muted);margin:0 0 16px;font-size:12px}.tip-touch{display:none}@media (pointer:coarse){.tip-touch{display:block}.tip-mouse{display:none}}.prompt-sheet{width:min(100%,340px)}.prompt-text{color:#e1e9ffdb;margin:0 0 18px;font-size:14px;line-height:1.5}.btn:hover{filter:brightness(1.1)}.opponent-notice{top:calc(max(var(--pad), env(safe-area-inset-top)) + 50px);border:1px solid color-mix(in srgb, var(--p2) 45%, transparent);background:var(--glass);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-align:center;max-width:calc(100% - 32px);color:var(--text);border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600;position:absolute;left:50%;transform:translate(-50%)}.opponent-notice[hidden]{display:none}.matchmaking-sheet{text-align:center}.matchmaking-sheet .actions{justify-content:center}.matchmaking-detail{font-variant-numeric:tabular-nums;margin:-8px 0 18px}.matchmaking-detail[hidden],.search-pulse[hidden]{display:none}.search-pulse{background:var(--p1);width:14px;height:14px;box-shadow:0 0 12px var(--p1);border-radius:50%;margin:18px auto 30px;position:relative}.search-pulse:before,.search-pulse:after{content:"";border:1.5px solid var(--p1);border-radius:50%;animation:1.8s ease-out infinite search-ring;position:absolute;inset:0}.search-pulse:after{animation-delay:.9s}@keyframes search-ring{0%{opacity:.8;transform:scale(1)}to{opacity:0;transform:scale(4.2)}}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}
