@font-face{font-family:Space Grotesk Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/assets/space-grotesk-vietnamese-wght-normal-D0rl6rjA.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Space Grotesk Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/assets/space-grotesk-latin-ext-wght-normal-D9tNdqV9.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Space Grotesk Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/assets/space-grotesk-latin-wght-normal-BhU9QXUp.woff2)format("woff2-variations");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}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-mono-cyrillic-ext-400-normal-xuaO2J-f.woff2)format("woff2"),url(/assets/ibm-plex-mono-cyrillic-ext-400-normal-DMdlQ8Kv.woff)format("woff");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-mono-cyrillic-400-normal-BSMlKf0J.woff2)format("woff2"),url(/assets/ibm-plex-mono-cyrillic-400-normal-CEL4l2ZJ.woff)format("woff");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-mono-vietnamese-400-normal-BulugwFq.woff2)format("woff2"),url(/assets/ibm-plex-mono-vietnamese-400-normal-DDuiU_S-.woff)format("woff");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-mono-latin-ext-400-normal-BmRBH3aV.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-ext-400-normal-D3D2R8hC.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-mono-latin-400-normal-DMJ8VG8y.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-400-normal-CvHOgSBP.woff)format("woff");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}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/ibm-plex-mono-cyrillic-ext-600-normal-V-xxqcpd.woff2)format("woff2"),url(/assets/ibm-plex-mono-cyrillic-ext-600-normal-9HEixskS.woff)format("woff");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/ibm-plex-mono-cyrillic-600-normal-CTOM6hUh.woff2)format("woff2"),url(/assets/ibm-plex-mono-cyrillic-600-normal-fLZuRloM.woff)format("woff");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/ibm-plex-mono-vietnamese-600-normal-D2EvbN8M.woff2)format("woff2"),url(/assets/ibm-plex-mono-vietnamese-600-normal-iLQfcSjf.woff)format("woff");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/ibm-plex-mono-latin-ext-600-normal-D38SheWl.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-ext-600-normal-DmB0ttJJ.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/ibm-plex-mono-latin-600-normal-BgSNZQsw.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-600-normal-DWFSQ4vo.woff)format("woff");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{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--void:#080b10;--glass:#0e131bb8;--glass-heavy:#080b10f0;--line:#dae4f124;--line-hot:#e5edf757;--white:#f1f3f5;--muted:#8e98a7;--cyan:#78d9ea;--pink:#d783ba;--red:#ff584f;--blue:#4b8fff;--yellow:#f3c34e;--green:#57cf78;--display:"Space Grotesk Variable", "Arial Narrow", sans-serif;--mono:"IBM Plex Mono", ui-monospace, monospace;font-family:var(--display);font-synthesis:none;text-rendering:geometricprecision}*{box-sizing:border-box}html,body{background:var(--void);min-width:320px;min-height:100%;margin:0}body{min-height:100dvh;color:var(--white);overflow:hidden}button{color:inherit;font:inherit}button:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}[hidden]{display:none!important}#background{z-index:0;background:radial-gradient(circle at 50% 45%,#28425b1c,#0000 48%),#080b10;width:100%;height:100%;position:fixed;inset:0}.screen-texture{z-index:1;pointer-events:none;background:linear-gradient(110deg,#ffffff02,#0000 38%,#82aed302),radial-gradient(#0000 32%,#0204078f 100%);position:fixed;inset:0}.app{z-index:2;grid-template-rows:auto minmax(0,1fr) auto;min-height:100dvh;display:grid;position:relative}.topbar{min-height:72px;padding-top:env(safe-area-inset-top,0px);padding-inline:env(safe-area-inset-left,0px) env(safe-area-inset-right,0px);border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(22px)saturate(105%);backdrop-filter:blur(22px)saturate(105%);background:#05080c8f;grid-template-columns:minmax(190px,1fr) auto minmax(190px,1fr);display:grid}.logo{letter-spacing:.17em;cursor:pointer;background:0 0;border:0;align-items:center;gap:12px;width:max-content;padding:0 24px;font-size:16px;font-weight:640;display:flex}.logo-mark{width:32px;height:32px;position:relative}.logo-mark i{box-shadow:none;border:1px solid #78d9eae6;border-radius:50%;position:absolute;inset:1px 8px}.logo-mark i:last-child{border-color:#d783bae0;border-radius:50%;inset:8px 1px}.run-stats{border-inline:1px solid var(--line);display:flex}.run-stats>div{border-right:1px solid var(--line);min-width:112px;padding:13px 22px 10px;display:grid}.run-stats>div:last-child{border-right:0}.run-stats span,.mode-indicator span,.menu-copy>p,.game-instruction>span,.board-core span,.board-core em,.mode-number,.game-over-view>p,.game-over-stats span{font-family:var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--muted);font-size:10px;font-style:normal}.run-stats strong{font-family:var(--mono);align-self:end;font-size:21px;font-weight:500;line-height:1}.top-actions{justify-content:flex-end;align-items:center;gap:10px;padding:0 20px;display:flex}.mode-indicator{border:1px solid var(--line);text-align:left;cursor:pointer;background:#10161e7a;border-radius:1px;gap:3px;padding:8px 13px;display:grid}.mode-indicator strong{font-family:var(--mono);letter-spacing:.08em;color:var(--cyan);font-size:12px}.icon-button{border:1px solid var(--line);cursor:pointer;background:#10161e7a;border-radius:50%;place-items:center;width:38px;height:38px;display:grid}.icon-button:hover,.mode-indicator:hover{border-color:var(--line-hot);background:#19212cb8}.icon-button svg{width:17px;fill:var(--white)}.icon-button svg .sound-wave{fill:none;stroke:var(--white);stroke-linecap:round;stroke-width:1.6px}body.is-muted .sound-wave{opacity:.15}main{min-height:0;position:relative}footer{min-height:30px;padding:0 22px env(safe-area-inset-bottom,0px);border-top:1px solid var(--line);font-family:var(--mono);letter-spacing:.11em;text-transform:uppercase;color:#95a9ca94;background:#05080c7a;justify-content:space-between;align-items:center;font-size:9px;display:flex}.menu-view{isolation:isolate;grid-template-rows:auto minmax(0,1fr);gap:clamp(18px,3vh,30px);width:min(1320px,100%);height:100%;margin:0 auto;padding:clamp(22px,4vh,44px) clamp(24px,5vw,72px) 34px;display:grid;position:relative}.menu-view:before{z-index:-1;content:"";pointer-events:none;filter:blur(30px);background:radial-gradient(at 10% 62%,#78d9ea0d,#0000 32%),radial-gradient(at 30% 62%,#d783ba0d,#0000 32%),radial-gradient(at 50% 62%,#f3c34e0a,#0000 32%),radial-gradient(at 70% 62%,#57cf780a,#0000 32%),radial-gradient(at 90% 62%,#f1f3f508,#0000 32%);position:absolute;inset:10% 2% 4%}.menu-copy{grid-template-columns:1fr auto;align-items:end;gap:24px;display:grid}.menu-copy>p{color:#78d9eae6;grid-column:1/-1;margin:0 0 6px;font-size:12px}.menu-copy h1{letter-spacing:-.045em;margin:0;font-size:clamp(26px,3vw,42px);font-weight:610;line-height:1.05}.menu-copy>span{color:#a2aab5;max-width:280px;padding-bottom:4px;font-size:14px;line-height:1.45}.mode-choices{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;min-height:0;display:grid}.mode-card{isolation:isolate;border:1px solid color-mix(in srgb, var(--card-line), transparent 45%);text-align:left;cursor:pointer;min-height:0;box-shadow:0 22px 72px #0000003d, 0 0 30px var(--card-shadow);-webkit-tap-highlight-color:transparent;background:linear-gradient(145deg,#151b24c7,#080b10db),#080b10d6;border-radius:18px;grid-template-rows:auto 1fr auto auto auto;padding:20px;transition:transform .22s cubic-bezier(.2,.8,.2,1),border-color .22s,box-shadow .22s;animation:.46s cubic-bezier(.16,1,.3,1) backwards cardRise;display:grid;position:relative;overflow:hidden;transform:translateZ(0)}.mode-card:first-child{animation-delay:40ms}.mode-card:nth-child(2){animation-delay:90ms}.mode-card:nth-child(3){animation-delay:.14s}.mode-card:nth-child(4){animation-delay:.19s}.mode-card:nth-child(5){animation-delay:.24s}.mode-card:before{z-index:-1;content:"";opacity:.5;background:radial-gradient(circle at 50% 37%, var(--card-glow), transparent 62%);transition:opacity .22s;position:absolute;inset:0}.mode-card:hover{border-color:var(--card-line);box-shadow:0 28px 90px #00000061, 0 0 38px var(--card-shadow);transform:translateY(-4px)}.mode-card:hover:before{opacity:1}.mode-card:active{border-color:var(--card-line);box-shadow:0 12px 44px #00000057, 0 0 42px var(--card-shadow);transition-duration:90ms;transform:scale(.97)}.mode-card:active:before{opacity:1}.classic-card{--card-glow:#4b8fff1b;--card-line:#78d9ea75;--card-shadow:#78d9ea0d;--card-accent:var(--cyan)}.confusion-card{--card-glow:#ff584f1c;--card-line:#d783ba73;--card-shadow:#d783ba0d;--card-accent:var(--pink)}.distraction-card{--card-glow:#f3c34e16;--card-line:#f3c34e6b;--card-shadow:#f3c34e0b;--card-accent:var(--yellow)}.reverse-card{--card-glow:#57cf7816;--card-line:#57cf786b;--card-shadow:#57cf780b;--card-accent:var(--green)}.echo-card{--card-glow:#f1f3f512;--card-line:#f1f3f566;--card-shadow:#f1f3f50d;--card-accent:var(--white)}.mode-number{color:var(--card-accent);justify-self:end}.mode-card>strong{letter-spacing:-.055em;margin-top:11px;font-size:clamp(25px,2.6vw,40px);font-weight:610;line-height:1}.mode-card>span:not(.mode-number,.mini-board,.confusion-preview,.distraction-preview,.reverse-preview,.echo-preview){color:#9ca5b1;margin-top:8px;font-size:13px;line-height:1.35}.mode-card>b{border-top:1px solid var(--line);font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;justify-content:space-between;margin-top:18px;padding-top:13px;font-size:9px;font-weight:600;display:flex}.mode-card>b i{color:var(--card-accent);font-size:14px;font-style:normal;transition:transform .18s}.mode-card:hover>b i{transform:translate(5px)}.mini-board,.confusion-preview,.distraction-preview,.reverse-preview,.echo-preview{aspect-ratio:1;place-self:center;width:min(24vh,200px);position:relative}.mini-board{aspect-ratio:1}.mini-board i{aspect-ratio:1;opacity:.92;background:color-mix(in srgb, currentColor, transparent 56%);width:42%;box-shadow:0 0 16px color-mix(in srgb, currentColor, transparent 46%);border:1px solid;border-radius:50%;position:absolute}.mini-board i:first-child{color:var(--red);top:4%;left:4%}.mini-board i:nth-child(2){color:var(--blue);top:4%;right:4%}.mini-board i:nth-child(3){color:var(--yellow);bottom:4%;right:4%}.mini-board i:nth-child(4){color:var(--green);bottom:4%;left:4%}.confusion-preview{border:1px solid var(--red);background:color-mix(in srgb, var(--red), transparent 62%);color:#f1f3f5f5;letter-spacing:-.075em;text-shadow:2px 0 #4b8fff57,-2px 0 #f3c34e38;box-shadow:0 0 30px color-mix(in srgb, var(--red), transparent 50%);border-radius:50%;place-items:center;font-size:min(6.7vh,54px);font-weight:790;display:grid;scale:.88}.distraction-preview{border:1px solid #cfe9ff29;border-radius:50%}.distraction-preview:before{content:"";border:1px solid var(--blue);background:color-mix(in srgb, var(--blue), transparent 56%);box-shadow:0 0 20px color-mix(in srgb, var(--blue), transparent 46%);border-radius:50%;position:absolute;inset:29%}.distraction-preview i{aspect-ratio:1;border:2px solid color-mix(in srgb, currentColor, transparent 22%);width:13%;box-shadow:0 0 9px 1.5px color-mix(in srgb, currentColor, transparent 30%), 0 0 2px color-mix(in srgb, currentColor, transparent 40%) inset;position:absolute}.distraction-preview i:first-child{color:var(--red);border-radius:50%;top:1%;left:26%}.distraction-preview i:nth-child(2){color:var(--blue);top:26%;right:-1%;transform:rotate(35deg)}.distraction-preview i:nth-child(3){color:var(--yellow);border-radius:50%;bottom:0;left:44%}.distraction-preview i:nth-child(4){color:var(--green);top:42%;left:-2%;transform:rotate(70deg)}.reverse-preview{justify-content:center;align-items:center;gap:6%;padding-bottom:16%;display:flex}.reverse-preview:after{content:"←";font-family:var(--mono);text-align:center;color:var(--green);text-shadow:0 0 12px #57cf7873;font-size:min(4vh,33px);line-height:1;position:absolute;bottom:21%;left:17%;right:17%}.reverse-preview i{aspect-ratio:1;background:color-mix(in srgb, currentColor, transparent 56%);width:27%;box-shadow:0 0 13px color-mix(in srgb, currentColor, transparent 45%);border:1px solid;border-radius:50%}.reverse-preview i:first-child{color:var(--blue)}.reverse-preview i:nth-child(2){color:var(--green)}.reverse-preview i:nth-child(3){color:var(--yellow)}.echo-preview i{border:1px solid #f1f3f51f;border-radius:50%;position:absolute}.echo-preview i:first-child{inset:4%}.echo-preview i:nth-child(2){border-color:#f1f3f542;inset:18%}.echo-preview i:nth-child(3){border-color:#f1f3f580;inset:33%}.echo-preview b{aspect-ratio:1;background:#f1f3f5eb;border-radius:50%;width:9%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 16px #f1f3f599}.game-view{grid-template-rows:auto minmax(0,1fr) auto;justify-items:center;height:100%;padding:20px 24px 16px;display:grid;position:relative;overflow:clip}.game-instruction{z-index:4;justify-items:center;gap:5px;display:grid;position:relative}.game-instruction>span{color:var(--cyan)}.game-instruction>strong{letter-spacing:-.015em;font-size:18px;font-weight:430}.board{z-index:3;aspect-ratio:1;filter:drop-shadow(0 32px 72px #0000004d);align-self:center;width:min(610px,72vw,76vh);height:auto;margin-bottom:40px;position:relative}.board:before,.board:after{z-index:-2;content:"";pointer-events:none;position:absolute;inset:3% 1%}.board:before{filter:blur(28px);background:radial-gradient(at 22% 25%,#ff584f0b,#0000 29%),radial-gradient(at 78% 27%,#4b8fff0b,#0000 29%),radial-gradient(at 22% 76%,#f3c34e0a,#0000 29%),radial-gradient(at 78% 74%,#57cf780a,#0000 29%)}.board:after{z-index:-1;background:0 0;border:1px solid #a7bcd30e;border-radius:50%;height:auto;inset:-3% -1%;box-shadow:inset 0 0 80px #33526f06}.board-aura{z-index:-3;filter:blur(.5px);background:radial-gradient(#344c620e,#0000 65%);position:absolute;inset:-8% -5%}.listen-pulse{z-index:2;pointer-events:none;display:none;position:absolute;inset:0}.board.is-listening .listen-pulse{display:block}.board.is-listening .pad{border-color:rgba(var(--pad-rgb), .2);box-shadow:none}.board.is-listening .pad:after{opacity:.25;box-shadow:none}.listen-pulse i{aspect-ratio:1;border:1px solid #f1f3f51f;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.listen-pulse i:first-child{width:55%}.listen-pulse i:nth-child(2){border-color:#f1f3f53d;width:37.5%}.listen-pulse i:nth-child(3){border-color:#f1f3f56b;width:20%}.listen-pulse b{background:#f1f3f5f2;border-radius:50%;width:10px;height:10px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 16px #f1f3f58c}.listen-pulse span{aspect-ratio:1;opacity:0;border:1.5px solid #f1f3f5b3;border-radius:50%;width:55%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.22)}.pad-orbit{z-index:0;transform-origin:50%;will-change:transform;position:absolute;inset:0;transform:rotate(0)}.pad-slot,.pad-orient{aspect-ratio:1;position:absolute}.pad-slot{width:35%}.pad-orient{transform-origin:50%;will-change:transform;inset:0;transform:rotate(0)}.pad-slot-red{top:4%;left:4%}.pad-slot-blue{top:4%;right:4%}.pad-slot-yellow{bottom:4%;right:4%}.pad-slot-green{bottom:4%;left:4%}.pad-slot .pad{width:100%;height:100%;inset:0}body[data-mode=distraction] .pad-orbit{width:auto;margin-left:0;inset:0}body[data-mode=distraction] .pad-slot{width:44%}body[data-mode=distraction] .pad-slot-red{top:4%;left:4%}body[data-mode=distraction] .pad-slot-blue{top:4%;right:4%}body[data-mode=distraction] .pad-slot-yellow{bottom:4%;right:4%}body[data-mode=distraction] .pad-slot-green{bottom:4%;left:4%}.pad{--pad-color:white;--pad-rgb:255, 255, 255;aspect-ratio:1;border:1.5px solid rgba(var(--pad-rgb), .74);background:radial-gradient(circle at 50% 42%, #ffffff08, transparent 34%), radial-gradient(circle at 50% 55%, rgba(var(--pad-rgb), .11), #0c0f14ed 74%), #0a0d12f0;cursor:default;width:35%;height:auto;box-shadow:0 0 0 1px #ffffff05 inset, 0 24px 55px #00000040, 0 0 42px rgba(var(--pad-rgb), .07) inset;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border-radius:50%;padding:0;transition:border-color .1s,box-shadow .12s,filter .12s,transform .12s cubic-bezier(.2,.9,.2,1.2);position:absolute;overflow:hidden;transform:translateZ(0)}.pad:before{z-index:1;content:"";opacity:.34;mix-blend-mode:screen;background:linear-gradient(128deg,#0000 19%,#ffffff13 32%,#0000 47%),radial-gradient(circle at 50% 48%,#0000 0 63%,#ffffff06 64%,#0000 66%);position:absolute;inset:0}.pad:after{z-index:3;content:"";background:var(--pad-color);opacity:.72;width:5px;height:5px;box-shadow:0 0 9px color-mix(in srgb, var(--pad-color), transparent 28%);border:0;border-radius:50%;position:absolute}.pad-red{--pad-color:var(--red);--pad-rgb:255, 61, 104;top:0;left:12%}.pad-red:after{top:15px;left:50%;transform:translate(-50%)}.pad-blue{--pad-color:var(--blue);--pad-rgb:55, 168, 255;top:0;right:12%}.pad-blue:after{top:15px;left:50%;transform:translate(-50%)}.pad-yellow{--pad-color:var(--yellow);--pad-rgb:255, 216, 74;bottom:0;right:12%}.pad-yellow:after{top:15px;left:50%;transform:translate(-50%)}.pad-green{--pad-color:var(--green);--pad-rgb:67, 229, 140;bottom:0;left:12%}.pad-green:after{top:15px;left:50%;transform:translate(-50%)}.pad-surface{z-index:0;border-radius:inherit;opacity:0;background:radial-gradient(circle at 50% 48%, #ffffff2e 0 1%, transparent 23%), radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--pad-color), white 4%) 0, var(--pad-color) 52%, color-mix(in srgb, var(--pad-color), black 39%) 100%);box-shadow:0 0 85px rgba(var(--pad-rgb), .42) inset;transition:opacity .11s;position:absolute;inset:0}.pad kbd{z-index:4;opacity:.5;font-family:var(--mono);color:var(--white);font-size:9px;font-weight:400;position:absolute;top:28px;left:50%;transform:translate(-50%)}.pad-word{z-index:5;opacity:0;color:#050814e0;letter-spacing:-.075em;text-align:center;text-shadow:1px 1px #ffffff29;width:100%;font-size:clamp(35px,5.2vw,76px);font-weight:800;line-height:.8;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scaleX(.65)}.pad.is-lit{z-index:4;border-color:color-mix(in srgb, var(--pad-color), white 18%);box-shadow:0 0 0 1px #ffffff1a inset, 0 0 30px rgba(var(--pad-rgb), .42), 0 0 76px rgba(var(--pad-rgb), .13);filter:saturate(108%)brightness(1.02);transform:rotate(0)scale(1.035)}.pad.is-lit .pad-surface{opacity:1;animation:1.15s ease-in-out infinite alternate surfaceFlow}.pad.is-lit .pad-word:not(:empty){animation:.44s cubic-bezier(.16,1,.3,1) both wordStrike}.pad.is-pressed{transform:rotate(0)scale(.965)}.pad.is-expected{animation:.48s ease-in-out infinite alternate expectedPulse}.board.is-playable .pad{cursor:pointer}.board.is-playable .pad:not(.is-lit):hover{z-index:2;border-color:rgba(var(--pad-rgb), .52);box-shadow:0 0 28px rgba(var(--pad-rgb), .09), 0 0 0 1px rgba(var(--pad-rgb), .08) inset;transform:rotate(0)scale(1.018)}.board-core{z-index:8;width:min(340px,48%);min-height:38px;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:none;background:0 0;border:0;border-radius:0;grid-template-columns:auto auto auto;justify-content:center;align-items:baseline;gap:7px;padding:7px 12px 13px;display:grid;position:absolute;bottom:-34px;left:50%;transform:translate(-50%)}.board-core:before{content:"";background:#cddbea29;border:0;width:auto;height:1px;position:absolute;bottom:4px;left:8%;right:8%}.board-core span{color:#78d9eaeb;position:relative}.board-core strong{font-family:var(--mono);margin:0;font-size:19px;font-weight:500;line-height:1;position:relative}.board-core em{position:relative}.progress-marks{justify-content:center;gap:8px;display:flex;position:absolute;bottom:1px;left:18px;right:18px}.progress-marks i{background:#c4d3e357;border-radius:99px;flex:0 34px;width:34px;min-width:4px;max-width:34px;height:3px;transform:none}.progress-marks i.is-active{background:var(--white);box-shadow:0 0 7px #f1f3f573}.progress-marks i.is-complete{background:var(--cyan);box-shadow:0 0 6px #78d9ea6b}.quit-button{z-index:4;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#a0a8b3;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #b6d8f63b;padding:13px 18px;font-size:11px;position:relative}.quit-button:hover{border-bottom-color:var(--cyan);color:var(--white)}.board.is-wrong{animation:.42s steps(2,end) both boardWrong}.board.is-clear .pad{border-color:#ffffff80;animation:.72s ease-out both clearRing;box-shadow:0 0 35px #6ef3ff1f}.distraction-field{z-index:2;pointer-events:none;display:none;position:fixed;inset:72px 0 30px;overflow:hidden;-webkit-mask-image:radial-gradient(51% 61%,#0000 0 35%,#000000a8 49%,#000 66%);mask-image:radial-gradient(51% 61%,#0000 0 35%,#000000a8 49%,#000 66%)}body[data-mode=distraction] .distraction-field{animation:.7s ease-out both fieldFade;display:block}@keyframes fieldFade{0%{opacity:0}}.decoy{--size:18px;--color:var(--cyan);--duration:6s;--delay:0s;width:var(--size);height:var(--size);color:var(--color);opacity:0;filter:blur(clamp(5px, calc(var(--size) * .045), 12px)) saturate(150%) brightness(1.15);mix-blend-mode:screen;animation-duration:var(--duration);animation-delay:var(--delay);animation-timing-function:linear;animation-iteration-count:infinite;position:absolute}.decoy b{opacity:.84;width:100%;height:100%;box-shadow:0 0 calc(var(--size) * .55) color-mix(in srgb, currentColor, transparent 15%);background:currentColor;border:0;display:block}.decoy-arc b{border:max(5px, calc(var(--size) * .07)) solid currentColor;background:0 0;border-bottom-color:#0000;border-right-color:#0000;border-radius:50%}.decoy-streak{height:clamp(11px, calc(var(--size) * .12), 24px)}.decoy-streak b{border-radius:999px}.edge-0{top:-5%;left:var(--pos);animation-name:driftDown}.edge-1{top:var(--pos);animation-name:driftLeft;right:-4%}.edge-2{bottom:-5%;left:var(--pos);animation-name:driftUp}.edge-3{top:var(--pos);animation-name:driftRight;left:-4%}.round-overlay{z-index:20;pointer-events:none;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#04060961;place-items:center;position:fixed;inset:0}.round-overlay:not([hidden]){place-content:center;justify-items:center;row-gap:clamp(14px,2.6vh,24px);display:grid}.round-overlay:before,.round-overlay:after{aspect-ratio:1;content:"";border:1px solid #f1f3f585;border-radius:50%;width:35vmin;animation:.9s ease-out both resultRing;position:absolute;top:50%;left:50%}.round-overlay:after{border-color:#78d9ea80;animation-delay:90ms}.round-overlay strong,.round-overlay span{z-index:2;position:relative}.round-overlay strong{letter-spacing:-.065em;text-shadow:0 0 28px #78d9ea1f;font-size:clamp(58px,11vw,150px);font-weight:610;line-height:.82}.round-overlay span{font-family:var(--mono);letter-spacing:.14em;color:var(--cyan);font-size:13px}.game-over-view{height:100%;padding:30px 20px calc(30px + env(safe-area-inset-bottom,0px));text-align:center;align-content:center;justify-items:center;display:grid}.game-over-view>p{color:var(--cyan);margin:0 0 12px}.game-over-view h2{letter-spacing:-.085em;justify-items:center;gap:14px;margin:0;font-size:clamp(76px,13vw,180px);font-weight:610;line-height:.8;display:grid}.game-over-view h2 small{letter-spacing:.34em;text-indent:.34em;color:#d6e2f09e;font-size:clamp(14px,1.6vw,17px);font-weight:520}.game-over-view h2 span{color:var(--white);text-shadow:0 0 36px #78d9ea47,0 0 110px #78d9ea24}.game-over-stats{border-block:1px solid var(--line);grid-template-columns:repeat(2,1fr);width:min(460px,90vw);margin:38px 0 25px;display:grid}.game-over-stats>div{border-right:1px solid var(--line);gap:5px;padding:14px 20px;display:grid}.game-over-stats>div:last-child{border-right:0}.game-over-stats strong{font-family:var(--mono);font-size:18px}.game-over-actions{gap:10px;display:flex}.primary-button,.secondary-button{cursor:pointer;border-radius:3px;min-width:190px;min-height:52px;padding:0 18px}.primary-button{background:var(--cyan);color:#041018;border:1px solid #bef0fa80;justify-content:space-between;align-items:center;font-weight:660;display:flex;box-shadow:0 10px 34px #78d9ea29}.primary-button:hover{background:#8ce2f1}.primary-button kbd{font-family:var(--mono);color:#04101894;font-size:9px}.secondary-button{border:1px solid var(--line);color:var(--muted);background:#0f141bb8}@keyframes boardHalo{to{transform:rotate(360deg)}}@keyframes cardRise{0%{opacity:0;transform:translateY(16px)}}@keyframes coreTurn{to{transform:rotate(360deg)}}@keyframes wordStrike{0%{opacity:0;filter:blur(8px);transform:translate(-50%,-50%)scaleX(.5)scaleY(1.35)}55%{opacity:1;filter:blur();transform:translate(-50%,-50%)scaleX(1.08)scaleY(.96)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}@keyframes surfaceFlow{0%{filter:saturate()brightness(.96);transform:scale(1)}to{filter:saturate(112%)brightness(1.04);transform:scale(1.018)}}@keyframes expectedPulse{to{filter:saturate(120%)brightness(1.18)}}@keyframes boardWrong{0%,to{filter:none;transform:translate(0)}25%{filter:hue-rotate(35deg);transform:translate(-9px)}50%{filter:hue-rotate(-35deg);transform:translate(8px)}75%{transform:translate(-4px)}}@keyframes clearRing{0%,to{filter:brightness()}42%{filter:brightness(1.35)saturate(118%)}}@keyframes driftDown{0%{opacity:0;transform:translateY(-10vh)rotate(0)}12%,82%{opacity:.94}to{opacity:0;transform:translate(12vw,115vh)rotate(260deg)}}@keyframes driftLeft{0%{opacity:0;transform:translate(8vw)rotate(0)}12%,82%{opacity:.94}to{opacity:0;transform:translate(-112vw,-12vh)rotate(310deg)}}@keyframes driftUp{0%{opacity:0;transform:translateY(10vh)rotate(0)}12%,82%{opacity:.94}to{opacity:0;transform:translate(-10vw,-115vh)rotate(280deg)}}@keyframes driftRight{0%{opacity:0;transform:translate(-8vw)rotate(0)}12%,82%{opacity:.94}to{opacity:0;transform:translate(112vw,14vh)rotate(330deg)}}@keyframes resultRing{0%{opacity:0;transform:translate(-50%,-50%)scale(.2)}20%{opacity:.9}to{opacity:0;transform:translate(-50%,-50%)scale(2.8)}}@media (width<=920px){.topbar{grid-template-columns:auto 1fr auto}.run-stats>div{min-width:88px;padding-inline:14px}.mode-choices{gap:10px}.mode-card{padding:15px}}@media (width<=700px){body{overflow-y:auto}.app{grid-template-rows:auto minmax(0,1fr)}.topbar{grid-template-columns:1fr auto;min-height:58px}.logo{padding-inline:14px;font-size:14px}.logo-mark{width:27px;height:27px}.run-stats{border-top:1px solid var(--line);border-inline:0;grid-area:2/1/auto/-1}.run-stats>div{flex:1;min-width:0;padding:10px 14px 9px}.run-stats strong{font-size:18px}body:not([data-mode]){overflow:hidden}body:not([data-mode]) .run-stats{display:none}.top-actions{padding-inline:12px}.mode-indicator{padding:8px 12px}footer{display:none}.menu-view{width:100%;height:calc(100dvh - 58px - env(safe-area-inset-top,0px));min-height:0;padding:clamp(16px, 2.4dvh, 22px) 14px calc(14px + env(safe-area-inset-bottom,0px));grid-template-rows:auto minmax(0,1fr);align-content:start;gap:14px;display:grid;overflow:hidden}.menu-view:before{background:radial-gradient(at 18% 10%,#78d9ea0d,#0000 32%),radial-gradient(at 22% 30%,#d783ba0d,#0000 32%),radial-gradient(at 18%,#f3c34e0a,#0000 32%),radial-gradient(at 22% 70%,#57cf780a,#0000 32%),radial-gradient(at 18% 90%,#f1f3f508,#0000 32%);inset:8% 0 2%}.menu-copy{display:block}.menu-copy>p{margin:0 0 7px}.menu-copy h1{font-size:clamp(21px,6vw,25px);line-height:1.1}.menu-copy>span{display:none}.mode-choices{grid-template-rows:repeat(5,minmax(0,1fr));grid-template-columns:minmax(0,1fr);gap:9px;width:100%;height:auto;min-height:0;margin-top:0}.mode-card{border-radius:16px;grid-template-rows:auto auto;grid-template-columns:min(19vw,88px) minmax(0,1fr);align-content:center;column-gap:16px;min-width:0;min-height:0;padding:12px 14px}.mode-card:before{opacity:.7;background:radial-gradient(circle at 15% 50%, var(--card-glow), transparent 58%)}.mode-number{font-size:10px;position:absolute;top:10px;right:12px}.mini-board,.confusion-preview,.distraction-preview,.reverse-preview,.echo-preview{grid-area:1/1/span 2;place-self:center;width:min(19vw,88px)}.confusion-preview{font-size:min(5.4vw,25px)}.mode-card>strong{letter-spacing:-.055em;grid-area:1/2;align-self:end;margin-top:0;font-size:clamp(21px,6vw,25px)}.mode-card>span:not(.mode-number,.mini-board,.confusion-preview,.distraction-preview,.reverse-preview,.echo-preview){grid-area:2/2;max-width:30ch;margin-top:5px;font-size:clamp(11px,3vw,13px);line-height:1.3}.mode-card>b{border-top:0;margin-top:0;padding-top:0;font-size:0;position:absolute;bottom:11px;right:14px}.mode-card>b i{font-size:16px}.reverse-preview{padding-bottom:14%}.reverse-preview:after{font-size:min(3.4vw,15px);bottom:16%}.game-view{min-height:calc(100dvh - 109px - env(safe-area-inset-top,0px));padding:24px 10px calc(20px + env(safe-area-inset-bottom,0px));grid-template-rows:auto minmax(0,1fr) auto}.game-instruction{gap:4px}.game-instruction>strong{font-size:clamp(18px,5vw,21px)}.board{aspect-ratio:1;align-self:center;width:min(92vw,380px,50vh);height:auto;margin-bottom:56px}.board:after{display:none}.pad{aspect-ratio:1;width:44%;height:auto;inset:auto}.pad-slot{width:44%}.pad-slot-red{top:4%;left:4%}.pad-slot-blue{top:4%;right:4%}.pad-slot-yellow{bottom:4%;right:4%}.pad-slot-green{bottom:4%;left:4%}body[data-mode=distraction] .pad-orbit{width:100%;margin-left:0;left:0;right:0}body[data-mode=distraction] .pad-slot-red{top:4%;left:4%}body[data-mode=distraction] .pad-slot-blue{top:4%;right:4%}body[data-mode=distraction] .pad-slot-yellow{bottom:4%;right:4%}body[data-mode=distraction] .pad-slot-green{bottom:4%;left:4%}.pad:after{width:4px;inset:11px auto auto 50%;transform:translate(-50%)}.pad-red{top:4%;left:4%}.pad-blue{top:4%;right:4%}.pad-yellow{bottom:4%;right:4%}.pad-green{bottom:4%;left:4%}.pad kbd{display:none}.pad-word{letter-spacing:-.06em;padding-inline:3px;font-size:clamp(24px,8vw,38px)}.board-core{width:min(250px,72%);padding-inline:14px;bottom:-50px}.board-core span,.board-core em{display:none}.board-core{grid-template-columns:auto}.board-core strong{font-size:18px}.distraction-field{inset:calc(113px + env(safe-area-inset-top,0px)) 0 0;-webkit-mask-image:radial-gradient(50% 44%,#0000 0 34%,#000000ad 47%,#000 64%);mask-image:radial-gradient(50% 44%,#0000 0 34%,#000000ad 47%,#000 64%)}.game-over-view{min-height:calc(100dvh - 109px - env(safe-area-inset-top,0px))}.game-over-actions{flex-direction:column;width:min(420px,100%)}.primary-button,.secondary-button{width:100%}}@media (width<=700px) and (height>=760px){.game-view{padding-top:30px;padding-bottom:calc(30px + env(safe-area-inset-bottom,0px))}.board{width:min(92vw,380px,48vh)}}@media (hover:none){.mode-card>b{border-top:0;justify-content:flex-end;margin-top:6px;padding-top:0;font-size:0}.mode-card>b i{font-size:16px}}@media (orientation:landscape) and (height<=610px) and (width>=680px){.app{grid-template-rows:auto minmax(0,1fr)}.topbar{min-height:54px}.logo{padding-inline:14px}.run-stats>div{min-width:82px;padding:8px 12px}.run-stats strong{font-size:15px}footer{display:none}.menu-view{padding:20px calc(32px + env(safe-area-inset-right,0px)) 20px calc(32px + env(safe-area-inset-left,0px));grid-template-rows:1fr;grid-template-columns:.65fr 1.35fr;align-items:center;gap:32px}.menu-copy{display:block}.menu-copy>p{margin:0 0 14px}.menu-copy h1{font-size:clamp(22px,5vh,32px)}.menu-copy>span{margin-top:20px;display:block}.mode-choices{grid-template-rows:repeat(3,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr));height:min(72vh,400px)}.echo-card{grid-column:1/-1}.mode-card{padding:10px 13px}.mode-number{position:absolute;top:8px;right:10px}.mode-card>b{border-top:0;margin-top:0;padding-top:0;position:absolute;bottom:8px;right:12px}.mini-board,.confusion-preview,.distraction-preview,.reverse-preview,.echo-preview{width:min(11vh,52px)}.confusion-preview{font-size:min(3.1vh,15px)}.reverse-preview:after{font-size:min(2.4vh,12px);bottom:14%}.mode-card>strong{margin-top:4px;font-size:clamp(14px,3.2vh,19px)}.mode-card>span:not(.mode-number,.mini-board,.confusion-preview,.distraction-preview,.reverse-preview,.echo-preview){display:none}.game-view{padding:8px calc(16px + env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) calc(16px + env(safe-area-inset-left,0px));grid-template-rows:1fr;grid-template-columns:180px minmax(0,1fr) 120px;align-items:center}.game-instruction{grid-column:1;align-self:center}.board{aspect-ratio:1.28;grid-column:2;width:min(100%,575px,86vh);height:auto;margin-bottom:34px}body[data-mode=distraction] .board{aspect-ratio:1;width:min(66vh,320px)}.quit-button{grid-column:3;justify-self:center}.distraction-field{inset:calc(54px + env(safe-area-inset-top,0px)) 0 0}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}
