:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--safe-area-top:env(safe-area-inset-top,0px);--safe-area-right:env(safe-area-inset-right,0px);--safe-area-bottom:env(safe-area-inset-bottom,0px);--safe-area-left:env(safe-area-inset-left,0px);--color-page:#f6f8fc;--color-panel:#e7edf6;--color-cell:#fff;--color-cell-hover:#e5f4fa;--color-text:#152033;--color-muted:#53627a;--color-border-strong:#25334a;--color-border-medium:#64748b;--color-border-subtle:#7a899f;--color-x:#c0267e;--color-o:#007f9e;--color-draw:#946200;--color-mini-open:#f4f7fb;--color-active-board:#e4f7fb;--color-x-surface:#fdeaf5;--color-o-surface:#e4f6fa;--color-draw-surface:#fff4d6;--color-x-won:#f9dcea;--color-focus:#6d28d9;--bg:var(--color-page);--bg-accent:var(--color-panel);--surface:var(--color-cell);--surface-raised:var(--color-cell);--surface-hover:var(--color-cell-hover);--text:var(--color-text);--muted:var(--color-muted);--border:var(--color-border-medium);--border-strong:var(--color-border-strong);--border-subtle:var(--color-border-subtle);--primary:#25334a;--primary-hover:#152033;--on-primary:#fff;--x:var(--color-x);--x-soft:var(--color-x-surface);--o:var(--color-o);--o-soft:var(--color-o-surface);--draw:var(--color-draw);--draw-soft:var(--color-draw-surface);--focus:var(--color-focus);--win:#087247;--danger:#a0212d;--danger-hover:#751824;--on-danger:#fff;--shadow:0 1.2rem 3rem #25334a24;--board-glow:#25334a17;--radius:1.25rem;--font:ui-rounded, "SF Pro Rounded", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-display:var(--font);--font-label:ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--color-page:#070b17;--color-panel:#0e1628;--color-cell:#111c32;--color-cell-hover:#1b3150;--color-text:#f7f9ff;--color-muted:#9aa7be;--color-border-strong:#d7e6ff;--color-border-medium:#7185a6;--color-border-subtle:#2c3b56;--color-x:#ff70c8;--color-o:#4de7ff;--color-draw:#f2c36b;--color-mini-open:#101b30;--color-active-board:#10263a;--color-x-surface:#2a1733;--color-o-surface:#102d3b;--color-draw-surface:#2a261b;--color-x-won:#35183d;--color-focus:#f2c36b;--surface-raised:#111c32;--surface-hover:var(--color-cell-hover);--primary:#d7e6ff;--primary-hover:#fff;--on-primary:#070b17;--win:#70efb3;--danger:#ff9aa5;--danger-hover:#ffc1c7;--on-danger:#070b17;--shadow:0 1.2rem 3rem #00000057;--board-glow:#4de7ff1f}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--color-page:#070b17;--color-panel:#0e1628;--color-cell:#111c32;--color-cell-hover:#1b3150;--color-text:#f7f9ff;--color-muted:#9aa7be;--color-border-strong:#d7e6ff;--color-border-medium:#7185a6;--color-border-subtle:#2c3b56;--color-x:#ff70c8;--color-o:#4de7ff;--color-draw:#f2c36b;--color-mini-open:#101b30;--color-active-board:#10263a;--color-x-surface:#2a1733;--color-o-surface:#102d3b;--color-draw-surface:#2a261b;--color-x-won:#35183d;--color-focus:#f2c36b;--surface-raised:#111c32;--surface-hover:var(--color-cell-hover);--primary:#d7e6ff;--primary-hover:#fff;--on-primary:#070b17;--win:#70efb3;--danger:#ff9aa5;--danger-hover:#ffc1c7;--on-danger:#070b17;--shadow:0 1.2rem 3rem #00000057;--board-glow:#4de7ff1f}}*{box-sizing:border-box}html{background:var(--bg);min-width:20rem;min-height:100%;font-family:var(--font);scroll-behavior:smooth}body{min-height:100dvh;padding-block:var(--safe-area-top) var(--safe-area-bottom);padding-inline:var(--safe-area-left) var(--safe-area-right);color:var(--text);background-color:var(--bg);background-image:radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--x) 11%, transparent), transparent 28rem), radial-gradient(circle at 100% 15%, color-mix(in srgb, var(--o) 9%, transparent), transparent 30rem), linear-gradient(145deg, var(--bg), var(--bg-accent));margin:0}button,select,input,summary{font:inherit}button,summary,select,a{-webkit-tap-highlight-color:transparent}a{color:inherit}button:focus-visible,summary:focus-visible,select:focus-visible,a:focus-visible,[role=gridcell]:focus-visible{outline:.22rem solid var(--focus);outline-offset:.18rem}.skip-link{z-index:100;inset:calc(.5rem + var(--safe-area-top)) auto auto calc(.5rem + var(--safe-area-left));color:var(--on-primary);background:var(--primary);border-radius:.6rem;padding:.75rem 1rem;position:fixed}.skip-link:where(:not(:focus,:active)){clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;padding:0;overflow:hidden}.site-header{z-index:10;justify-content:space-between;align-items:center;gap:1rem;width:min(100% - 1.5rem,72rem);min-height:4.75rem;margin-inline:auto;display:flex;position:relative}.brand{min-height:2.75rem;color:var(--text);letter-spacing:.08em;align-items:center;gap:.15rem;font-size:1.05rem;font-weight:900;text-decoration:none;display:inline-flex}.brand-x{color:var(--x);font-size:1.55rem;line-height:1}.brand-x-small{color:var(--o);font-size:.95rem;translate:-.15rem -.45rem}.brand-ring{aspect-ratio:1;border:.22rem solid var(--o);border-radius:50%;width:1.15rem}.brand-name{margin-inline-start:.35rem}.button,.button-link{cursor:pointer;border:0;border-radius:.8rem;min-height:2.75rem;font-weight:800}.button{color:var(--on-primary);background:var(--primary);box-shadow:0 .35rem 0 color-mix(in srgb, var(--primary) 72%, black);justify-content:center;align-items:center;padding:.72rem 1rem;text-decoration:none;transition:translate .14s,box-shadow .14s;display:inline-flex}.button:hover{background:var(--primary-hover)}.button:active{box-shadow:0 .15rem 0 color-mix(in srgb, var(--primary) 72%, black);translate:0 .2rem}.button-quiet{color:var(--text);background:var(--surface);border:.1rem solid var(--border);box-shadow:none}.button-quiet:hover{background:var(--surface-hover)}.button-small{min-height:2.4rem;box-shadow:none;padding:.55rem .8rem;font-size:.9rem}.button-link{color:var(--text);text-underline-offset:.2em;background:0 0;padding:.6rem;text-decoration:underline}.settings{position:relative}.settings>summary{list-style:none}.settings>summary::-webkit-details-marker{display:none}.settings-panel{z-index:30;width:min(22rem,100vw - 1.5rem);color:var(--text);background:var(--surface-raised);border:.1rem solid var(--border);box-shadow:var(--shadow);border-radius:1rem;margin:.65rem 0 0 auto;padding:1rem}.settings:not([data-enhanced]) .settings-panel{position:absolute;inset-inline-end:0}.settings-panel:popover-open{inset:calc(4rem + var(--safe-area-top)) max(calc(.75rem + var(--safe-area-right)), calc((100vw - 72rem) / 2)) auto auto;margin:0;position:fixed}.settings-group,.settings-field,.switch-row{gap:.45rem;display:grid}.settings-field,.switch-row{margin-block-start:1rem}.settings-label{font-weight:800;display:block}.segmented{border:.1rem solid var(--border);border-radius:.75rem;grid-template-columns:1fr 1fr;gap:.3rem;padding:.25rem;display:grid}.segmented a{text-align:center;border-radius:.52rem;min-height:2.5rem;padding:.55rem;text-decoration:none}.segmented a[aria-current=page]{color:var(--on-primary);background:var(--primary);font-weight:800}.settings select{min-height:2.75rem;color:var(--text);background:var(--surface);border:.1rem solid var(--border-strong);border-radius:.65rem;padding-inline:.7rem}.switch-row{grid-template-columns:1fr auto;align-items:center;gap:1rem}.switch-row small{color:var(--muted);margin-block-start:.2rem;line-height:1.35;display:block}.switch-row input{width:1.55rem;height:1.55rem;accent-color:var(--primary)}main{width:min(100% - 1.5rem,72rem);margin-inline:auto;padding-block:clamp(1.5rem,5vw,4.5rem) 4rem}.app-notices{width:min(100% - 1.5rem,72rem);margin-inline:auto}.notice{color:var(--text);background:var(--surface-raised);border:.12rem solid var(--border-strong);border-inline-start:.38rem solid var(--focus);box-shadow:var(--shadow);border-radius:.8rem;justify-content:space-between;align-items:center;gap:1rem;margin-block:.5rem;padding:.8rem 1rem;display:flex}.notice[hidden]{display:none}.notice p{margin:.25rem 0 0}.notice-actions{align-items:center;gap:.35rem;display:flex}.hero{gap:.7rem;max-width:48rem;margin-block-end:clamp(1.75rem,5vw,3.5rem);display:grid}.eyebrow{color:var(--x);letter-spacing:.15em;text-transform:uppercase;margin:0;font-size:.82rem;font-weight:900}h1,h2,p{text-wrap:pretty}h1{letter-spacing:-.055em;max-width:15ch;margin:0;font-size:clamp(2.25rem,9vw,5.5rem);line-height:.98}.hero-lead{max-width:42rem;color:var(--muted);margin:0;font-size:clamp(1.08rem,2.5vw,1.35rem);line-height:1.55}.player-note{color:var(--text);margin:.4rem 0 0;font-weight:750}.variant-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr));gap:1rem;display:grid}.variant-card{background:var(--surface);border:.11rem solid var(--border);border-radius:var(--radius);min-height:18rem;box-shadow:var(--shadow);gap:.85rem;padding:1.25rem;display:grid;position:relative;overflow:hidden}.variant-card:before{content:"";background:linear-gradient(90deg, var(--x), var(--o));height:.4rem;position:absolute;inset:0 0 auto}.variant-card h2{margin:.3rem 0 0;font-size:1.6rem}.variant-card p{color:var(--muted);margin:0;line-height:1.55}.variant-card .button{place-self:end start}.variant-glyph{aspect-ratio:1;grid-template-columns:repeat(3,1fr);gap:.2rem;width:5rem;display:grid;rotate:-3deg}.variant-glyph span{color:var(--x);background:var(--bg-accent);border-radius:.2rem;place-items:center;font-weight:900;display:grid}.variant-card[data-variant=ultimate] .variant-glyph{gap:.3rem}.variant-card[data-variant=ultimate] .variant-glyph span{border:.1rem solid var(--border-strong);background:0 0}.variant-card[data-variant=vanishing] .variant-glyph span:first-child{border:.14rem dashed var(--o);opacity:.65}.continue-card{background:color-mix(in srgb, var(--x-soft) 65%, var(--surface));border:.13rem solid var(--x);border-radius:1rem;justify-content:space-between;align-items:center;gap:1rem;margin-block:-1rem 2rem;padding:1rem;display:flex}.continue-card[hidden]{display:none}.continue-card strong{font-size:1.08rem}.game-shell{justify-items:center;gap:1rem;display:grid}.game-topbar{justify-content:space-between;align-items:center;gap:.7rem;width:min(100%,45rem);display:flex}.game-title{margin:0;font-size:clamp(1.55rem,5vw,2.35rem)}.game-actions{gap:.5rem;display:flex}.game-status{text-align:center;justify-items:center;gap:.3rem;min-height:4.2rem;display:grid}.turn-status{margin:0;font-size:clamp(1.1rem,3vw,1.35rem);font-weight:900}.turn-status[data-player=X] strong{color:var(--x)}.turn-status[data-player=O] strong{color:var(--o)}.board-guidance,.keyboard-help{color:var(--muted);margin:0}.keyboard-help{text-align:center;max-width:42rem;font-size:.88rem}.board{aspect-ratio:1;background:var(--color-panel);border:.12rem solid var(--border-strong);width:min(100%,34rem);box-shadow:var(--shadow);isolation:isolate;border-radius:clamp(1rem,4vw,1.6rem);padding:clamp(.55rem,2vw,.9rem)}.board-classic,.board-vanishing{grid-template-rows:repeat(3,minmax(0,1fr));grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.45rem,2vw,.8rem);display:grid}.grid-row{display:contents}.board-ultimate{--cell-gap:clamp(.11rem, .62vw, .42rem);--small-board-gap:clamp(.32rem, 1.6vw, .9rem);--small-board-inset:clamp(.14rem, .55vw, .38rem);--small-board-stroke:clamp(.125rem, .35vw, .19rem);--cell-track:minmax(0, 1fr);--small-board-tracks:var(--small-board-inset) var(--cell-track) var(--cell-gap) var(--cell-track) var(--cell-gap) var(--cell-track) var(--small-board-inset);--turn-color:var(--o);grid-template-columns:var(--small-board-tracks) var(--small-board-gap) var(--small-board-tracks) var(--small-board-gap) var(--small-board-tracks);grid-template-rows:var(--small-board-tracks) var(--small-board-gap) var(--small-board-tracks) var(--small-board-gap) var(--small-board-tracks);background:var(--color-panel);border:clamp(.2rem, .48vw, .3rem) solid var(--border-strong);width:min(100%,43rem);box-shadow:0 0 .1rem var(--border-strong), 0 1.5rem 3.5rem var(--board-glow);border-radius:clamp(.65rem,2vw,1rem);padding:clamp(.42rem,1.5vw,.9rem);display:grid;position:relative;container-type:inline-size}.board-ultimate[data-player=X]{--turn-color:var(--x)}.board-ultimate[data-player=O]{--turn-color:var(--o)}.small-board-frame,.small-board-result{min-width:0;min-height:0}.small-board-frame{z-index:0;background:var(--color-mini-open);border:var(--small-board-stroke) solid var(--border);box-shadow:inset 0 0 0 .06rem color-mix(in oklab, var(--border) 42%, transparent);pointer-events:none;border-radius:clamp(.32rem,1vw,.64rem);transition:border-color .16s,background-color .16s,opacity .16s}.small-board-frame.is-unavailable{border-width:clamp(.08rem,.2vw,.13rem);border-color:var(--border-subtle);opacity:.58}.small-board-frame.is-required{z-index:0;background:var(--color-active-board);border-color:var(--turn-color);box-shadow:inset 0 0 0 .08rem color-mix(in oklab, var(--turn-color) 45%, transparent), 0 0 1rem color-mix(in oklab, var(--turn-color) 28%, transparent);border-width:clamp(.18rem,.42vw,.27rem)}.small-board-frame.is-resolved[data-player=X]{background:var(--color-x-won);border-color:var(--x)}.small-board-frame.is-resolved[data-player=O]{background:var(--color-o-surface);border-color:var(--o)}.small-board-frame.is-resolved[data-result=draw]{background:var(--draw-soft);border-color:var(--draw)}.small-board-frame.is-meta-win{z-index:1;box-shadow:inset 0 0 0 .1rem var(--surface), 0 0 1.25rem color-mix(in oklab, var(--turn-color) 45%, transparent);border-width:clamp(.2rem,.48vw,.3rem)}.small-board-result{z-index:4;min-width:0;min-height:0;margin:calc(var(--small-board-inset) + var(--small-board-stroke));pointer-events:none;color:var(--text);background:color-mix(in oklab, var(--color-mini-open) 92%, transparent);text-align:center;border-radius:clamp(.18rem,.7vw,.45rem);place-content:center;place-items:center;gap:clamp(.1rem,.45vw,.3rem);display:grid;overflow:hidden}.small-board-result strong{font-family:var(--font-display);font-size:clamp(1.8rem,10cqi,5.2rem);font-weight:900;line-height:.82}.small-board-result>span{font-family:var(--font-label);letter-spacing:.12em;font-size:clamp(.42rem,1.8cqi,.75rem);font-weight:800;line-height:1}.small-board-result[data-player=X]{color:var(--x)}.small-board-result[data-player=O]{color:var(--o)}.small-board-result[data-result=draw]{color:var(--draw)}.small-board-result.is-meta-win{background:color-mix(in oklab, var(--color-mini-open) 76%, transparent);outline-offset:calc(var(--small-board-inset) * -.7);outline:clamp(.13rem,.32vw,.22rem) solid}.cell{min-width:0;min-height:0;color:var(--text);background:var(--surface);border:.1rem solid var(--border);cursor:default;border-radius:clamp(.35rem,1.5vw,.75rem);place-items:center;padding:0;font-size:clamp(2.2rem,15vw,6.4rem);font-weight:950;line-height:1;transition:border-color .12s,background-color .12s,scale .12s;display:grid;position:relative}.board-ultimate .cell{z-index:2;aspect-ratio:1;border-width:clamp(.055rem,.15vw,.08rem);border-color:var(--border-subtle);border-radius:clamp(.12rem,.55vw,.38rem);font-size:clamp(.68rem,4.2vw,2rem)}.board-ultimate .cell.is-required-board.is-legal{border-color:color-mix(in oklab, var(--turn-color) 62%, var(--border-subtle))}.board-ultimate .cell.is-closed-board{color:#0000;opacity:0;background:0 0;border-color:#0000}.board-ultimate .cell.is-closed-board:focus-visible{z-index:6;opacity:1;outline-color:var(--focus);background:0 0}.cell[data-player=X]{color:var(--x);background:color-mix(in srgb, var(--x-soft) 48%, var(--surface))}.cell[data-player=O]{color:var(--o);background:color-mix(in srgb, var(--o-soft) 48%, var(--surface))}.cell.is-legal{cursor:pointer;border-color:var(--border-strong)}.move-preview{color:var(--turn-color,var(--text));font:inherit;opacity:0;place-items:center;transition:opacity .12s,scale .12s;display:grid;position:absolute;inset:0;scale:.68}.move-preview[data-player=X]{color:var(--x)}.move-preview[data-player=O]{color:var(--o)}.cell.is-legal:where(:hover,:focus-visible){z-index:3;border-style:solid;border-color:var(--turn-color,var(--focus));background:var(--color-cell-hover);border-width:clamp(.13rem,.35vw,.2rem);scale:.96}.cell.is-legal:where(:hover,:focus-visible) .move-preview{opacity:.42;scale:1}.board-ultimate[data-state=directed] .cell.is-unavailable:not(.is-closed-board){opacity:.58}.cell.is-winning{border:.24rem solid var(--win);box-shadow:inset 0 0 0 .14rem var(--surface)}.cell.is-expiring{opacity:.78;border:.22rem dashed;animation:1.1s ease-in-out infinite alternate expiry}.expiry-indicator{aspect-ratio:1;width:1.1rem;color:var(--surface);background:var(--text);border-radius:50%;place-items:center;font-size:.75rem;display:grid;position:absolute;inset:.16rem .22rem auto auto}.move-enter{animation:.17s ease-out mark-in}.result-panel{background:var(--surface-raised);border:.16rem solid var(--win);width:min(100%,34rem);box-shadow:var(--shadow);text-align:center;border-radius:1rem;padding:1.1rem;animation:.22s ease-out result-in}.result-panel[hidden]{display:none}.result-panel h2{margin:0 0 .85rem;font-size:clamp(1.45rem,5vw,2rem)}.result-actions{flex-wrap:wrap;justify-content:center;gap:.7rem;display:flex}dialog{width:min(32rem,100% - 1.5rem);color:var(--text);background:var(--surface-raised);border:.11rem solid var(--border-strong);box-shadow:var(--shadow);border-radius:1rem;padding:0}dialog::backdrop{-webkit-backdrop-filter:blur(.18rem);backdrop-filter:blur(.18rem);background:#030610b8}.dialog-content{gap:1rem;padding:1.25rem;display:grid}.dialog-content h2,.dialog-content p{margin:0}.dialog-content p{color:var(--muted);line-height:1.6}.dialog-actions{flex-wrap:wrap;justify-content:flex-end;gap:.65rem;display:flex}.button-danger{color:var(--on-danger);background:var(--danger);box-shadow:none}.button-danger:hover{background:var(--danger-hover)}@keyframes mark-in{0%{opacity:0;scale:.55}}@keyframes result-in{0%{opacity:0;translate:0 .6rem}}@keyframes expiry{to{opacity:1}}@media (max-width:38rem){.site-header,main,.app-notices{width:min(100% - 1rem,72rem)}.game-topbar{align-items:flex-start}.game-actions .button{padding-inline:.7rem;font-size:.88rem}.continue-card,.notice{flex-direction:column;align-items:stretch}.notice-actions{justify-content:flex-end}}@media (min-width:50rem){.board-classic,.board-vanishing{width:min(58vh,36rem)}.board-ultimate{width:min(72vh,43rem)}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.cell,.small-board-frame,.move-preview{transition:none}.cell.is-expiring,.move-enter,.result-panel{animation:none}}@media (forced-colors:active){.board,.small-board-frame,.cell,.small-board-result{box-shadow:none;border-color:canvastext}.small-board-frame.is-required,.small-board-frame.is-meta-win,.cell.is-legal:where(:hover,:focus-visible){outline-offset:-.2rem;outline:.2rem solid highlight}}@supports not (color:color-mix(in srgb, black, white)){body{background-image:none}.variant-card,.board,.cell,.small-board-result{background:var(--surface)}}