:root{--bg0:#070a1a;--bg1:#0d1230;--panel:#ffffff0b;--panel-2:#ffffff13;--stroke:#ffffff17;--line:#becdff29;--text:#eef1ff;--muted:#9aa3c7;--x1:#3ee6ff;--x2:#5b7cff;--o1:#ff4f9a;--o2:#ffae42;--x-glow:#3ee6ff8c;--o-glow:#ff4f9a8c;--radius:22px;--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-back:cubic-bezier(.34, 1.56, .64, 1);color:var(--text);background:var(--bg0);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;font-family:Outfit,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{background:var(--bg0);overscroll-behavior:none;min-height:100%;margin:0}body{-webkit-user-select:none;user-select:none}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0}button:focus-visible{outline-offset:2px;outline:2px solid #fffc}svg{display:block}.app{--ad-h:0px;--safe-top:env(safe-area-inset-top);flex-direction:column;height:100dvh;display:flex;position:relative;overflow:hidden}.app.has-ads{--ad-h:50px;--safe-top:0px}.ad-strip{z-index:2;box-sizing:content-box;height:50px;padding-top:env(safe-area-inset-top);border-bottom:1px solid var(--stroke);background:#03050ebf;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}@media (width>=768px){.app.has-ads{--ad-h:90px}.ad-strip{height:90px}}.stage{z-index:1;overscroll-behavior:contain;flex:1;min-height:0;position:relative;overflow:hidden auto}.bg{background:radial-gradient(120% 80% at 50% 0%, var(--bg1), var(--bg0) 70%);z-index:0;position:fixed;inset:0;overflow:hidden}.blob{filter:blur(70px);opacity:.35;will-change:transform;border-radius:50%;width:60vmax;height:60vmax;position:absolute}.b1{background:radial-gradient(circle,#2b55ff,#0000 65%);animation:22s ease-in-out infinite alternate float1;top:-25vmax;left:-20vmax}.b2{opacity:.28;background:radial-gradient(circle,#ff3d8b,#0000 65%);animation:26s ease-in-out infinite alternate float2;bottom:-30vmax;right:-22vmax}.b3{opacity:.14;background:radial-gradient(circle,#18c7e8,#0000 65%);width:40vmax;height:40vmax;animation:30s ease-in-out infinite alternate-reverse float1;top:30%;left:40%}.bg-grid{background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:44px 44px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(at 50% 40%,#000 20%,#0000 75%);mask-image:radial-gradient(at 50% 40%,#000 20%,#0000 75%)}@keyframes float1{to{transform:translate(12vmax,8vmax)scale(1.1)}}@keyframes float2{to{transform:translate(-10vmax,-12vmax)scale(1.15)}}.screen{z-index:1;position:relative}.icon-btn{background:var(--panel);border:1px solid var(--stroke);width:44px;height:44px;color:var(--muted);transition:background .2s, color .2s, transform .15s var(--ease-back);border-radius:14px;place-items:center;display:grid}.icon-btn svg{width:21px;height:21px}.icon-btn:hover{background:var(--panel-2);color:var(--text)}.icon-btn:active{transform:scale(.92)}.icon-btn.on{color:var(--text);background:linear-gradient(135deg,#3ee6ff2e,#5b7cff2e);border-color:#78aaff59}.audio-toggles{gap:8px;display:flex}.btn{letter-spacing:.01em;white-space:nowrap;background:var(--panel);border:1px solid var(--stroke);height:48px;transition:background .2s, transform .15s var(--ease-back), opacity .2s;border-radius:16px;justify-content:center;align-items:center;gap:8px;padding:0 20px;font-size:15px;font-weight:600;display:inline-flex}.btn svg{width:18px;height:18px}.btn:hover:not(:disabled){background:var(--panel-2)}.btn:active:not(:disabled){transform:scale(.95)}.btn:disabled{opacity:.35;cursor:default}.btn.primary{background:linear-gradient(135deg, var(--x1), var(--x2));color:#051026;box-shadow:0 8px 28px -8px var(--x-glow);border:0}.btn.primary:hover{filter:brightness(1.08);background:linear-gradient(135deg, var(--x1), var(--x2))}.mark{width:100%;height:100%;overflow:visible}.mark .stroke{fill:none;stroke-width:13px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px;animation:draw .3s var(--ease-out) forwards}.mark-x .stroke{stroke:url(#grad-x)}.mark-o .stroke{stroke:url(#grad-o)}.mark-x{filter:drop-shadow(0 0 6px var(--x-glow))}.mark-o{filter:drop-shadow(0 0 6px var(--o-glow))}.mark-x .s2{animation-delay:.12s}.mark-o .s1{animation-duration:.4s}.mark.still .stroke{stroke-dashoffset:0;animation:none}@keyframes draw{to{stroke-dashoffset:0}}.menu{max-width:760px;padding:calc(14px + var(--safe-top)) max(18px, env(safe-area-inset-right)) 0 max(18px, env(safe-area-inset-left));flex-direction:column;min-height:100%;margin:0 auto;display:flex}.menu-top{justify-content:space-between;align-items:center;display:flex}.client-logo{object-fit:contain;visibility:hidden;max-width:45%;height:40px}.client-logo.loaded{visibility:visible}.logo{flex-direction:column;align-items:center;margin:4px 0 26px;display:flex}.logo-marks{gap:4px;margin-bottom:4px;display:flex}.logo-marks .mark{width:64px;height:64px}.logo-marks .mark-x .stroke{animation-delay:.15s}.logo-marks .mark-x .s2{animation-delay:.3s}.logo-marks .mark-o .stroke{animation-duration:.55s;animation-delay:.45s}.logo-marks .mark-x{animation:4s ease-in-out infinite bob}.logo-marks .mark-o{animation:4s ease-in-out -2s infinite bob}@keyframes bob{50%{transform:translateY(-6px)rotate(4deg)}}.logo h1{letter-spacing:-.03em;gap:.28em;margin:0;font-size:clamp(38px,10vw,64px);font-weight:800;line-height:1;display:flex}.logo h1 span{background:linear-gradient(#fff 30%,#a9b4e8);color:#0000;opacity:0;animation:rise .6s var(--ease-out) forwards;-webkit-background-clip:text;background-clip:text}.logo h1 span:first-child{background-image:linear-gradient(180deg, #fff 10%, var(--x1));animation-delay:50ms}.logo h1 span:nth-child(2){animation-delay:.15s}.logo h1 span:nth-child(3){background-image:linear-gradient(180deg, #fff 10%, var(--o1));animation-delay:.25s}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.menu-section{animation:rise .6s var(--ease-out) both;margin-bottom:22px}.menu-section:nth-of-type(2){animation-delay:.1s}.menu-section:nth-of-type(3){animation-delay:.16s}.menu-section:nth-of-type(4){animation-delay:.22s}.menu-section h2{letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 10px 4px;font-size:12px;font-weight:600}.difficulty-section{transition:opacity .25s, max-height .35s var(--ease-out), margin .35s var(--ease-out);max-height:120px}.difficulty-section.hidden{opacity:0;pointer-events:none;max-height:0;margin-bottom:0;overflow:hidden}.segmented{background:var(--panel);border:1px solid var(--stroke);border-radius:20px;grid-template-columns:1fr 1fr;gap:6px;padding:6px;display:grid}.segmented button{height:50px;color:var(--muted);border-radius:14px;justify-content:center;align-items:center;gap:10px;font-size:16px;font-weight:600;transition:background .25s,color .25s,box-shadow .25s;display:flex}.segmented button svg{width:22px;height:22px}.segmented button.active{color:var(--text);box-shadow:inset 0 0 0 1px #78b4ff66, 0 6px 20px -10px var(--x-glow);background:linear-gradient(135deg,#3ee6ff33,#5b7cff3d)}.pills{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.pill{--c:#7bf1a8;height:46px;color:var(--muted);background:var(--panel);border:1px solid var(--stroke);border-radius:14px;font-size:15px;font-weight:600;transition:all .22s}.diff-medium{--c:#ffd84d}.diff-hard{--c:#ff9447}.diff-impossible{--c:#ff4f6d}.pill:hover{color:var(--text)}.pill.active{color:var(--c);border-color:color-mix(in srgb, var(--c) 55%, transparent);background:color-mix(in srgb, var(--c) 12%, transparent);box-shadow:0 0 22px -8px var(--c)}.modes{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.mode-card{text-align:left;background:var(--panel);border:1px solid var(--stroke);transition:transform .2s var(--ease-back), background .2s, border-color .2s, box-shadow .2s;border-radius:18px;align-items:center;gap:12px;min-width:0;padding:12px;display:flex}.mode-card:hover{background:var(--panel-2);transform:translateY(-2px)}.mode-card:active{transform:scale(.97)}.mode-card.active{box-shadow:0 10px 30px -14px var(--x-glow);background:linear-gradient(145deg,#3ee6ff1f,#ff4f9a14);border-color:#78b4ff80}.thumb{background:#00000038;border-radius:14px;flex:none;width:54px;height:54px;padding:2px}.thumb .mark{filter:none}.thumb .mark .stroke{stroke-width:14px}.thumb-line{stroke:#ffffff2e;stroke-width:1.2px}.thumb-line.thick{stroke:#fff6;stroke-width:1.8px}.mode.mega .thumb-line,.thumb.mega .thumb-line{stroke-width:.8px}.fading-static{opacity:.35}.mode-text{flex-direction:column;min-width:0;display:flex}.mode-name{font-size:17px;font-weight:700}.mode-badge{color:var(--x1);margin-top:1px;font-size:12px;font-weight:600}.mode-card.active .mode-badge{color:#8ff3ff}.mode-blurb{color:var(--muted);margin-top:3px;font-size:12.5px;line-height:1.3}.play-dock{width:100vw;padding:26px 18px calc(18px + env(safe-area-inset-bottom));background:linear-gradient(#070a1a00,#070a1a8c 45%,#070a1ae0);justify-content:center;margin-top:auto;margin-left:calc(50% - 50vw);display:flex;position:sticky;bottom:0}.play-btn{color:#061026;background:linear-gradient(120deg, var(--x1), var(--x2) 50%, var(--o1));width:min(100%,360px);height:60px;transition:transform .2s var(--ease-back);background-size:200% 100%;border-radius:20px;justify-content:center;align-items:center;gap:10px;font-size:20px;font-weight:700;animation:6s ease-in-out infinite shimmer;display:flex;box-shadow:0 14px 40px -12px #5b7cffcc,inset 0 1px #fff6}.play-btn svg{width:20px;height:20px}.play-btn:hover{transform:translateY(-2px)scale(1.02)}.play-btn:active{transform:scale(.96)}@keyframes shimmer{50%{background-position:100% 0}}@media (width>=640px){.modes{grid-template-columns:repeat(4,1fr)}.mode-card{flex-direction:column;align-items:flex-start;padding:14px}.thumb{width:64px;height:64px;margin-bottom:4px}.logo{margin:-8px 0 22px}.logo-marks .mark{width:64px;height:64px}.menu-section{margin-bottom:18px}.play-dock{padding-top:14px}}.game{max-width:720px;height:100%;padding:calc(10px + var(--safe-top)) max(14px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));grid-template:"top""score""status""board""hint""actions"/1fr;align-content:center;gap:10px;margin:0 auto;display:grid;overflow:hidden}.game-top{grid-area:top;align-items:center;gap:10px;display:flex}.game-title{flex-direction:column;flex:1;align-items:center;min-width:0;line-height:1.15;display:flex}.gt-name{font-size:18px;font-weight:700}.gt-sub{color:var(--muted);white-space:nowrap;font-size:12.5px}.scoreboard{grid-area:score;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:8px;display:grid}.player-chip{--c:var(--x1);--g:var(--x-glow);background:var(--panel);border:1px solid var(--stroke);transition:border-color .3s, box-shadow .3s, background .3s, transform .3s var(--ease-back);border-radius:18px;align-items:center;gap:10px;min-width:0;padding:8px 12px;display:flex}.player-chip.po{--c:var(--o1);--g:var(--o-glow);text-align:right;justify-content:flex-end}.player-chip.active{border-color:color-mix(in srgb, var(--c) 60%, transparent);background:color-mix(in srgb, var(--c) 9%, transparent);box-shadow:0 0 26px -10px var(--g)}.player-chip.winner{border-color:var(--c);box-shadow:0 0 34px -6px var(--g);transform:scale(1.03)}.chip-mark{flex:none;width:26px;height:26px}.chip-mark .mark .stroke{stroke-width:15px}.chip-name{min-width:0;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;flex:1;align-items:center;gap:6px;font-size:14px;font-weight:600;display:flex;overflow:hidden}.po .chip-name{justify-content:flex-end}.player-chip.active .chip-name{color:var(--text)}.chip-score{font-variant-numeric:tabular-nums;font-size:26px;font-weight:800;line-height:1}.draws{color:var(--muted);border-radius:16px;flex-direction:column;justify-content:center;align-items:center;min-width:58px;padding:0 10px;transition:background .2s;display:flex}.draws:hover{background:var(--panel)}.draws-n{color:var(--text);font-variant-numeric:tabular-nums;font-size:20px;font-weight:700}.draws-l{letter-spacing:.08em;text-transform:uppercase;font-size:11px}.dots{gap:3px;display:inline-flex}.dots i{background:var(--o1);border-radius:50%;width:4px;height:4px;animation:1s ease-in-out infinite dot}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}@keyframes dot{50%{opacity:.4;transform:translateY(-4px)}}.status{text-align:center;color:var(--muted);grid-area:status;min-height:22px;font-size:15px;font-weight:600;transition:color .3s}.status.sx{color:#9ef4ff}.status.so{color:#ffa3c9}.status.done{color:var(--text)}.board-wrap{min-width:0;min-height:0;height:min(calc(100vw - 28px), calc(100dvh - 300px - var(--ad-h) - env(safe-area-inset-top) - env(safe-area-inset-bottom)), 660px);grid-area:board;place-items:center;display:grid;position:relative;container-type:size}.hint{text-align:center;color:var(--muted);opacity:.85;grid-area:hint;margin:0;font-size:13px}.game-actions{grid-area:actions;grid-template-columns:1fr 1fr;gap:10px;width:100%;max-width:420px;margin:0 auto;display:grid}.board{aspect-ratio:1;border-radius:calc(var(--radius) + 4px);border:1px solid var(--stroke);width:min(100cqw,100cqh,640px);animation:boardIn .5s var(--ease-out);background:linear-gradient(160deg,#ffffff12,#ffffff05);padding:3.2%;box-shadow:0 30px 80px -30px #000c,inset 0 1px #ffffff0f}@keyframes boardIn{0%{opacity:0;transform:scale(.94)}}.cells{width:100%;height:100%;position:relative}.grid-board .cells{grid-template-columns:repeat(var(--n), 1fr);grid-template-rows:repeat(var(--n), 1fr);display:grid}.cell{border-right:2px solid var(--line);border-bottom:2px solid var(--line);place-items:center;min-width:0;min-height:0;padding:0;transition:background .2s;display:grid;position:relative}.n3 .cell{border-width:3px}.cell.er{border-right-color:#0000}.cell.eb{border-bottom-color:#0000}.cell .mark{width:74%;height:74%}.n9 .cell .mark{width:82%;height:82%}.n9 .cell .mark .stroke{stroke-width:15px}.cell[aria-disabled=true]{cursor:default}.cell .ghost{opacity:0;filter:none;pointer-events:none;transition:opacity .15s;position:absolute}@media (hover:hover){.board:not(.locked):not(.over) .cell:not(.filled):hover .ghost{opacity:.22}.board:not(.locked):not(.over) .cell:not(.filled):hover{background:#ffffff08}}.board:not(.locked):not(.over) .cell:not(.filled):focus-visible .ghost{opacity:.3}.cell:focus-visible{outline-offset:-4px;border-radius:8px}.cell.last:before{content:"";background:#ffffff0b;border-radius:22%;animation:.3s fadeIn;position:absolute;inset:12%}@keyframes fadeIn{0%{opacity:0}}.cell .mark:not(.ghost){animation:pop .35s var(--ease-back)}.cell .mark.still:not(.ghost){animation:none}@keyframes pop{0%{transform:scale(.6)}}.cell .mark.fading{opacity:.32;animation:1.6s ease-in-out infinite fadePulse}@keyframes fadePulse{50%{opacity:.18;transform:scale(.9)}}.vanish-ghost{width:calc(100% / var(--n));height:calc(100% / var(--n));left:calc(var(--c) * 100% / var(--n));top:calc(var(--r) * 100% / var(--n));pointer-events:none;animation:vanish .55s var(--ease-out) forwards;place-items:center;display:grid;position:absolute}.vanish-ghost .mark{width:74%;height:74%}@keyframes vanish{0%{opacity:.5;filter:blur();transform:scale(1)}to{opacity:0;filter:blur(6px);transform:scale(1.4)rotate(12deg)}}.board.over .cell.dim .mark{opacity:.28;transition:opacity .5s .3s}.cell.in-line .mark{animation:winPop .6s var(--ease-back) .25s both}@keyframes winPop{40%{transform:scale(1.18)}}.winline{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.winline line{stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px;animation:draw .45s var(--ease-out) .15s forwards}.wl-x line{stroke:#c9fbff;filter:drop-shadow(0 0 8px var(--x1)) drop-shadow(0 0 2px var(--x1))}.wl-o line{stroke:#ffd6e8;filter:drop-shadow(0 0 8px var(--o1)) drop-shadow(0 0 2px var(--o1))}.ult-board{padding:2.4%}.ult-board .cells{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);gap:2.4%;display:grid}.mini{background:#ffffff08;border:1px solid #ffffff0d;border-radius:12px;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);min-width:0;min-height:0;padding:4%;transition:opacity .3s,background .3s,border-color .3s,box-shadow .3s;display:grid;position:relative}.mini .cell{border-width:1.5px}.mini .cell .mark{width:70%;height:70%}.mini .cell .mark .stroke{stroke-width:16px}.mini .cell .mark-x,.mini .cell .mark-o{filter:none}.ult-board:not(.over) .mini:not(.open){opacity:.45}.ult-board.turn-x:not(.over) .mini.open{box-shadow:0 0 20px -8px var(--x-glow);background:#3ee6ff12;border-color:#3ee6ff80}.ult-board.turn-o:not(.over) .mini.open{box-shadow:0 0 20px -8px var(--o-glow);background:#ff4f9a12;border-color:#ff4f9a80}.ult-board.locked .mini.open{box-shadow:none}.mini.won-x .cell .mark,.mini.won-o .cell .mark,.mini.won-draw .cell .mark{opacity:.18}.mini.won-x,.mini.won-o,.mini.won-draw{opacity:1!important}.mini-owner{pointer-events:none;animation:ownerIn .5s var(--ease-back);position:absolute;inset:8%}.mini-owner .mark .stroke{stroke-width:11px}@keyframes ownerIn{0%{opacity:0;transform:scale(.4)}}.ult-board.over .mini:not(.in-line) .mini-owner{opacity:.4;transition:opacity .5s .3s}.result{z-index:5;place-items:center;padding:10px;animation:.3s fadeIn;display:grid;position:absolute;inset:0}.result-card{--c:var(--x1);text-align:center;border:1px solid color-mix(in srgb, var(--c) 40%, transparent);width:min(340px,100%);box-shadow:0 30px 80px -20px #000000e6, 0 0 60px -20px var(--c);-webkit-backdrop-filter:blur(18px);animation:cardIn .5s var(--ease-back);background:#0e122cd1;border-radius:26px;padding:24px 22px 20px}.result-card.ro{--c:var(--o1)}.result-card.rd{--c:#b9a6ff}@keyframes cardIn{0%{opacity:0;transform:translateY(18px)scale(.9)}}.result-marks{justify-content:center;gap:4px;height:64px;margin-bottom:8px;display:flex}.result-marks .mark{width:64px;height:64px}.result-card h2{letter-spacing:-.02em;margin:0;font-size:32px;font-weight:800}.result-card p{color:var(--muted);margin:6px 0 20px;font-size:15px}.result-actions{grid-template-columns:1.4fr 1fr;gap:10px;display:grid}.ghost-btn{background:0 0}.confetti{pointer-events:none;z-index:50;width:100%;height:100%;position:fixed;inset:0}@media (width<=380px){.chip-name{font-size:13px}.chip-score{font-size:22px}.player-chip{gap:7px;padding:8px 10px}.draws{min-width:48px;padding:0 4px}.mode-blurb{display:none}.btn{padding:0 12px;font-size:14px}}@media (orientation:landscape) and (height<=560px){.game{max-width:980px;padding-top:calc(8px + var(--safe-top));padding-bottom:calc(8px + env(safe-area-inset-bottom));grid-template:"board top""board score""board status""board hint"1fr"board actions"/minmax(0,1fr) minmax(230px,320px);align-content:stretch;column-gap:18px}.board-wrap{height:auto}.hint{align-self:end}.scoreboard{grid-template-columns:1fr 1fr}.draws{display:none}.player-chip{padding:6px 10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}