:is(#screen-menu .brand>h1.logo){background:url(./logo-DAeS1qe2.webp) center / contain no-repeat!important;position:relative;width:min(72vw,340px)!important;height:min(24svh,200px)!important;min-height:100px;max-width:100%;margin:0 auto 12px!important;padding:0!important;font-size:0!important;line-height:0!important;color:transparent!important;text-shadow:none!important;min-width:0;flex-shrink:1;transform:none!important;animation:none!important}:is(#screen-menu .brand>h1.logo)>*{position:absolute!important;opacity:0!important;pointer-events:none}:root{--bg-0: #060a18;--bg-1: #0d1532;--bg-2: #18244d;--panel: rgba(17, 26, 56, .78);--panel-solid: #121b3b;--panel-border: rgba(170, 190, 255, .12);--text: #eef2ff;--muted: #9aa7cc;--x: #ff6a4d;--x-soft: rgba(255, 106, 77, .16);--o: #22d3c5;--o-soft: rgba(34, 211, 197, .16);--accent: #7c9bff;--focus: #f5f7ff;--danger: #ff8a80;--radius: 18px;--radius-sm: 12px;--tap: 48px;--sat: env(safe-area-inset-top, 0px);--sar: env(safe-area-inset-right, 0px);--sab: env(safe-area-inset-bottom, 0px);--sal: env(safe-area-inset-left, 0px);--ease: cubic-bezier(.2, .8, .2, 1);--dur: .26s;font-family:Inter,Segoe UI Variable,Segoe UI,system-ui,-apple-system,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--text);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;color-scheme:dark}.reduced-motion{--dur: 1ms}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none}body{background:radial-gradient(120% 80% at 50% 38%,var(--bg-2) 0%,var(--bg-1) 45%,var(--bg-0) 100%),var(--bg-0);-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}button,input{font:inherit;color:inherit}#app{position:fixed;top:0;right:0;bottom:0;left:0}#stage{position:absolute;top:0;right:0;bottom:0;left:0}#scene{display:block;width:100%;height:100%;touch-action:none;outline:none}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.screen{position:absolute;top:0;right:0;bottom:0;left:0;padding:calc(var(--sat) + 16px) calc(var(--sar) + 16px) calc(var(--sab) + 16px) calc(var(--sal) + 16px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--dur) var(--ease),visibility 0s linear var(--dur)}.screen.active{opacity:1;visibility:visible;transition:opacity var(--dur) var(--ease),visibility 0s}.screen.active>*{pointer-events:auto}.board-slot{pointer-events:none!important;min-height:0;min-width:0}.screen-menu{display:grid;grid-template-rows:auto minmax(120px,1fr) auto;grid-template-areas:"brand" "board" "panel";justify-items:center;gap:8px}.brand{grid-area:brand;text-align:center;padding-top:clamp(4px,3vh,32px)}.logo{margin:0;display:inline-flex;align-items:baseline;gap:.06em;font-size:clamp(44px,11vw,76px);font-weight:900;letter-spacing:-.02em;line-height:1}.logo-x{color:var(--x);text-shadow:0 0 28px rgba(255,106,77,.45)}.logo-o{color:var(--o);text-shadow:0 0 28px rgba(34,211,197,.45)}.logo-word{margin-left:.22em;font-size:.42em;font-weight:800;letter-spacing:.32em;color:var(--text);opacity:.92}.tagline{margin:10px 0 0;color:var(--muted);font-size:15px;letter-spacing:.01em}.screen-menu .board-slot{grid-area:board;width:100%}.menu-panel{grid-area:panel;width:min(100%,420px);display:grid;gap:12px;padding:16px;border-radius:24px;background:var(--panel);border:1px solid var(--panel-border);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);box-shadow:0 24px 60px #00000059;transform:translateY(0);transition:transform var(--dur) var(--ease)}.screen-menu:not(.active) .menu-panel{transform:translateY(16px)}.menu-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(orientation:landscape)and (min-width:820px){.screen-menu{grid-template-columns:minmax(340px,420px) 1fr;grid-template-rows:1fr auto auto 1fr;grid-template-areas:". board" "brand board" "panel board" ". board";column-gap:clamp(16px,4vw,64px);padding-left:calc(var(--sal) + clamp(24px,6vw,96px))}.brand{text-align:left;justify-self:stretch;padding:0 0 12px 4px}.screen-menu .board-slot{height:100%}}@media(orientation:landscape)and (max-height:520px){.screen-menu{grid-template-columns:minmax(260px,46%) 1fr;grid-template-rows:1fr auto auto 1fr;grid-template-areas:". board" "brand board" "panel board" ". board";column-gap:12px}.brand{text-align:left;justify-self:stretch;padding:0 0 8px 4px}.logo{font-size:40px}.tagline{display:none}.menu-panel{padding:12px;gap:8px}.screen-menu .board-slot{height:100%}}.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:var(--tap);min-width:44px;padding:10px 20px;border-radius:var(--radius-sm);border:1px solid transparent;background:#ffffff0f;font-size:16px;font-weight:650;letter-spacing:.01em;cursor:pointer;touch-action:manipulation;transition:transform .12s var(--ease),background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}.btn:active{transform:scale(.97)}.btn-lg{min-height:60px;font-size:18px;justify-content:flex-start;padding-left:18px}.btn-primary{background:linear-gradient(180deg,#ff7c5f,#f2553a);color:#1b0a05;box-shadow:0 10px 24px #ff6a4d47,inset 0 1px #ffffff59}.btn-secondary{background:linear-gradient(180deg,#2fe0d1,#18b5a9);color:#02201d;box-shadow:0 10px 24px #22d3c538,inset 0 1px #ffffff59}.btn-ghost{background:#ffffff0d;border-color:var(--panel-border)}.btn-danger-ghost{background:transparent;border-color:#ff8a8059;color:var(--danger)}@media(hover:hover){.btn-ghost:hover,.icon-btn:hover{background:#ffffff1a}.btn-primary:hover,.btn-secondary:hover{filter:brightness(1.06)}}:focus{outline:none}:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.btn-glyph{display:inline-flex;width:34px;height:34px;border-radius:10px;align-items:center;justify-content:center;background:#00000029}.btn-glyph svg{width:22px;height:22px}.glyph svg{display:block;width:100%;height:100%}.glyph-x{stroke:var(--x)}.glyph-o{stroke:var(--o)}.on-color .glyph-x,.on-color .glyph-o{stroke:currentColor}.screen-sheet{display:grid;place-items:center;overflow-y:auto;background:#0408148c;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.sheet{width:min(100%,460px);padding:22px;border-radius:24px;background:var(--panel-solid);border:1px solid var(--panel-border);box-shadow:0 30px 80px #00000073;transform:translateY(12px) scale(.98);transition:transform var(--dur) var(--ease);margin:auto}.sheet-wide{width:min(100%,560px)}.screen.active .sheet{transform:none}.sheet-title:focus,.result-title:focus{outline:none}.sheet-title{margin:0 0 16px;font-size:24px;font-weight:800;letter-spacing:-.01em}.field{border:0;margin:0 0 16px;padding:0;min-width:0}.field legend{padding:0;margin-bottom:8px;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.hint{margin:8px 2px 0;font-size:13px;color:var(--muted);line-height:1.4}.segmented{display:grid;grid-auto-columns:1fr;grid-auto-flow:column;gap:4px;padding:4px;border-radius:14px;background:#00000040;border:1px solid var(--panel-border)}.segmented label{position:relative;display:flex;min-height:44px;cursor:pointer}.segmented input,.symbol-card input{position:absolute;opacity:0;top:0;right:0;bottom:0;left:0;margin:0;cursor:pointer}.segmented span{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;padding:6px 8px;border-radius:10px;font-weight:650;font-size:15px;color:var(--muted);transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease)}.segmented input:checked+span{background:#7c9bff38;color:var(--text);box-shadow:inset 0 0 0 1px #7c9bff80}.segmented input:focus-visible+span,.symbol-card input:focus-visible~.symbol-name{outline:3px solid var(--focus);outline-offset:2px}.symbol-pick{display:grid;grid-template-columns:1fr 1fr;gap:12px}.symbol-card{position:relative;display:flex;align-items:center;gap:12px;min-height:72px;padding:12px 16px;border-radius:16px;background:#00000038;border:2px solid var(--panel-border);cursor:pointer;transition:border-color var(--dur) var(--ease),background-color var(--dur) var(--ease)}.symbol-card .glyph{width:40px;height:40px}.symbol-name{font-size:22px;font-weight:800;border-radius:6px;padding:0 4px}.symbol-card.mark-x:has(input:checked){border-color:var(--x);background:var(--x-soft)}.symbol-card.mark-o:has(input:checked){border-color:var(--o);background:var(--o-soft)}.name-field{display:flex;align-items:center;gap:12px;margin-bottom:10px;padding:0 0 0 14px;border-radius:14px;background:#00000040;border:2px solid var(--panel-border);transition:border-color var(--dur) var(--ease)}.name-field.mark-x:focus-within{border-color:var(--x)}.name-field.mark-o:focus-within{border-color:var(--o)}.glyph.small{width:24px;height:24px;flex:none}.name-field input{flex:1;min-width:0;min-height:52px;border:0;background:transparent;font-size:17px;font-weight:600;user-select:text;-webkit-user-select:text}.name-field input::placeholder{color:#9aa7ccb3}.name-field input:focus-visible{outline:none}.sheet-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:8px;flex-wrap:wrap}.sheet-actions .btn{flex:1 1 140px}.setting{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--panel-border);margin-bottom:4px}.setting-label{display:grid;gap:2px;font-weight:650}.setting-label .hint{margin:0;font-weight:400}.setting+.field{margin-top:16px}.switch{position:relative;flex:none;width:60px;height:44px;border:0;background:transparent;cursor:pointer;padding:0}.switch:before{content:"";position:absolute;left:4px;right:4px;top:8px;bottom:8px;border-radius:999px;background:#ffffff24;transition:background-color var(--dur) var(--ease)}.switch-knob{position:absolute;top:11px;left:7px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 6px #00000059;transition:transform var(--dur) var(--ease)}.switch[aria-checked=true]:before{background:var(--o)}.switch[aria-checked=true] .switch-knob{transform:translate(24px)}.stats-section h3{margin:4px 0 8px;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.stats-table{width:100%;border-collapse:collapse;margin-bottom:18px;font-variant-numeric:tabular-nums}.stats-table th,.stats-table td{padding:10px 6px;text-align:center;border-bottom:1px solid var(--panel-border);font-size:15px}.stats-table th{font-size:12px;font-weight:700;color:var(--muted)}.stats-table th[scope=row]{text-align:left;font-size:15px;color:var(--text)}.stats-table td.w{color:var(--o);font-weight:700}.stats-table td.l{color:var(--x);font-weight:700}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:8px;margin-bottom:18px}.stat-tile{padding:12px;border-radius:14px;background:#00000038;border:1px solid var(--panel-border)}.stat-tile b{display:block;font-size:24px;font-variant-numeric:tabular-nums}.stat-tile span{font-size:12px;color:var(--muted)}.stats-empty{color:var(--muted);margin:-6px 0 16px;font-size:14px}.screen-game{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr) minmax(0,340px);grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"p0 series p1" "board board board" "turn turn ctl";gap:10px;align-items:center}.screen-game>[data-area=p0]{grid-area:p0}.screen-game>[data-area=p1]{grid-area:p1}.screen-game>[data-area=series]{grid-area:series}.screen-game>[data-area=turn]{grid-area:turn}.screen-game>[data-area=ctl]{grid-area:ctl}.screen-game>.board-slot{grid-area:board;align-self:stretch;justify-self:stretch}.player-card{--mark: var(--x);position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;min-width:0;min-height:64px;padding:10px 12px;border-radius:16px;background:var(--panel);border:1px solid var(--panel-border);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease)}.player-card.mark-o{--mark: var(--o)}.player-card:before{content:"";position:absolute;left:12px;right:12px;top:-1px;height:3px;border-radius:0 0 3px 3px;background:var(--mark);opacity:0;transition:opacity var(--dur) var(--ease)}.player-card.active{border-color:color-mix(in srgb,var(--mark) 70%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--mark) 40%,transparent),0 8px 28px color-mix(in srgb,var(--mark) 22%,transparent)}.player-card.active:before{opacity:1}.player-card.thinking .card-glyph{animation:pulse .9s ease-in-out infinite}.card-glyph{width:30px;height:30px}.card-text{display:grid;min-width:0}.card-name{font-weight:750;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-sub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-score{font-size:28px;font-weight:850;font-variant-numeric:tabular-nums;min-width:1ch;text-align:right}.card-score.bump{animation:bump .42s var(--ease)}.screen-game>.series-chip{justify-self:center}.series-chip{display:grid;justify-items:center;gap:2px;padding:6px 10px;text-align:center;font-size:12px;color:var(--muted);white-space:nowrap}.series-label{font-weight:700;color:var(--text);letter-spacing:.02em}.turn-pill{--mark: var(--x);display:flex;align-items:center;gap:10px;min-height:var(--tap);min-width:0;padding:8px 16px 8px 10px;border-radius:999px;background:var(--panel);border:1px solid color-mix(in srgb,var(--mark) 55%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-weight:700;font-size:16px;justify-self:start;max-width:100%;transition:border-color var(--dur) var(--ease)}.turn-pill.mark-o{--mark: var(--o)}.turn-pill.neutral{border-color:var(--panel-border)}.turn-glyph{flex:none;width:28px;height:28px}.turn-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.thinking-dots{display:none;gap:4px}.turn-pill.thinking .thinking-dots{display:inline-flex}.thinking-dots i{width:6px;height:6px;border-radius:50%;background:var(--mark);animation:dot 1s ease-in-out infinite}.thinking-dots i:nth-child(2){animation-delay:.15s}.thinking-dots i:nth-child(3){animation-delay:.3s}.hud-controls{display:flex;gap:8px;justify-self:end}.icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:var(--tap);min-height:var(--tap);padding:0 12px;border-radius:14px;border:1px solid var(--panel-border);background:var(--panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);cursor:pointer;font-weight:650;touch-action:manipulation}.icon-btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.icon-btn .spk{fill:currentColor;stroke:none}.icon-btn .mute,.icon-btn.muted .wave{display:none}.icon-btn.muted .mute{display:inline}@media(max-width:420px){.screen-game{gap:8px;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:auto auto minmax(0,1fr) auto;grid-template-areas:"p0 p0 p0 p1 p1 p1" "series series series series series series" "board board board board board board" "turn turn turn turn ctl ctl"}.player-card{grid-template-columns:auto 1fr auto;padding:8px 10px;gap:8px;min-height:58px}.card-glyph{width:24px;height:24px}.card-name{font-size:15px}.card-score{font-size:24px}.series-chip{grid-auto-flow:column;gap:8px;padding:0}.icon-btn-label span{display:none}}@media(orientation:landscape)and (max-height:520px){.screen-game{padding-top:calc(var(--sat) + 10px);padding-bottom:calc(var(--sab) + 10px);grid-template-columns:minmax(150px,24%) minmax(0,1fr) minmax(150px,24%);grid-template-rows:auto auto minmax(0,1fr) auto;grid-template-areas:"p0 board p1" "series board ." ". board ." "turn board ctl";gap:8px 12px;align-items:start}.screen-game>.board-slot{grid-row:1 / -1}.player-card{min-height:56px;padding:8px 10px}.card-score{font-size:24px}.turn-pill{align-self:end;font-size:14px;padding-right:12px}.hud-controls{align-self:end}.icon-btn-label span{display:none}}.result{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;align-items:end;justify-items:center;padding:calc(var(--sat) + 16px) calc(var(--sar) + 16px) calc(var(--sab) + 16px) calc(var(--sal) + 16px);background:linear-gradient(to top,#050916c7,#05091659 45%,#05091600 75%);opacity:0;visibility:hidden;pointer-events:none!important;transition:opacity var(--dur) var(--ease),visibility 0s linear var(--dur);z-index:5}.result.open{opacity:1;visibility:visible;pointer-events:auto!important;transition:opacity var(--dur) var(--ease),visibility 0s}.result-card{--mark: var(--accent);display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:14px;width:min(100%,520px);max-height:100%;overflow-y:auto;padding:18px 18px 16px;border-radius:24px;background:var(--panel-solid);border:1px solid color-mix(in srgb,var(--mark) 45%,transparent);box-shadow:0 30px 80px #00000080,0 0 60px color-mix(in srgb,var(--mark) 20%,transparent);transform:translateY(24px);transition:transform var(--dur) var(--ease)}.result.open .result-card{transform:none}.result-card.mark-x{--mark: var(--x)}.result-card.mark-o{--mark: var(--o)}.result-glyph{grid-row:1 / span 3;align-self:start;width:52px;height:52px;padding:6px;border-radius:16px;background:color-mix(in srgb,var(--mark) 14%,transparent)}.result-glyph.draw-glyph{display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:10px 6px}.result-title{margin:0;font-size:clamp(24px,6.4vw,30px);font-weight:900;letter-spacing:-.01em;line-height:1.1}.result-score{margin:4px 0 0;font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}.result-score:empty,.result-note:empty{display:none}.result-note{margin:2px 0 0;color:var(--muted);font-size:13px;line-height:1.35}.result-actions{grid-column:1 / -1;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:10px;margin-top:14px}@media(orientation:landscape)and (max-height:520px){.result{padding-bottom:calc(var(--sab) + 10px)}.result-card{padding:12px 14px;width:min(100%,560px)}.result-glyph{width:40px;height:40px}.result-title{font-size:22px}.result-actions{margin-top:10px}}.board-a11y{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);pointer-events:none!important}.screen-error{display:grid;place-items:center}.error-body{color:var(--muted);line-height:1.5;margin:0 0 12px}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(.86);opacity:.6}}@keyframes dot{0%,to{transform:translateY(0);opacity:.4}40%{transform:translateY(-4px);opacity:1}}@keyframes bump{0%{transform:scale(1)}35%{transform:scale(1.35);color:var(--mark)}to{transform:scale(1)}}.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{animation-duration:1ms!important;animation-iteration-count:1!important}.reduced-motion .thinking-dots i{animation:none;opacity:1}