@import "https://fonts.googleapis.com/css2?family=Inter+Tight:wght@900&family=Inter:wght@300;400&family=JetBrains+Mono:wght@500;700&display=swap";:root{--font-display:"Inter Tight", "Space Grotesk", system-ui, sans-serif;--font-body:"Inter", system-ui, sans-serif;--font-mono:"JetBrains Mono", "IBM Plex Mono", ui-monospace, monospace;--font-headline:var(--font-display);--font-data:var(--font-mono);--text-xs:.625rem;--text-sm:.75rem;--text-base:.875rem;--text-lg:1.125rem;--text-xl:1.5rem;--text-2xl:2rem;--text-3xl:3rem;--text-4xl:4rem;--color-bg:#000;--color-fg:#f0f0f0;--color-fg-dim:#f0f0f080;--color-fg-faint:#f0f0f033;--color-hairline:#f0f0f01f;--color-surface:#f0f0f00a;--color-surface-hover:#f0f0f014;--color-selected:#f0f0f026;--color-hinted:#ffa44a29;--color-warning:#f0f0f0cc;--bg-color:var(--color-bg);--fg-color:var(--color-fg);--hairline:var(--color-hairline);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--size-btn-sm:2.75rem;--size-btn-md:3.4rem;--size-btn-lg:4.5rem;--size-combo-gauge:.75rem;--radius-sm:.375rem;--radius-md:.75rem;--radius-pill:9999px;--radius-board:.5rem;--shadow-subtle:0 1px 2px #0000004d;--shadow-elevated:0 4px 12px #00000080;--transition-fast:.1s;--transition-base:.2s;--transition-slow:.4s;--opacity-disabled:.3;--opacity-dim:.5;--opacity-faint:.2;--opacity-semi:.75;--opacity-surface:.8;--opacity-full:1;--border-width-hairline:.5px;--border-width-base:1px;--focus-outline-width:1px;--focus-outline-offset:2px;--letter-tighter:-.06em;--letter-tight:-.02em;--letter-std:.05em;--letter-wide:.1em;--letter-wider:.3em;--max-width-board:calc(42rem + 1px);--rail-width-landscape:4.75rem;--rail-width-landscape-stress:4.15rem}*{box-sizing:border-box;margin:0;padding:0}html,body{background-color:var(--color-bg);color:var(--color-fg);font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-user-select:none;user-select:none;touch-action:none;overscroll-behavior:none;width:100%;height:100%;position:fixed;overflow:hidden}.noise-overlay{display:none}button{color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;outline:none}.pill-button{border:var(--border-width-base) solid var(--color-fg);border-radius:var(--radius-pill);min-height:var(--size-btn-sm);padding:var(--space-2) var(--space-6);font-family:var(--font-mono);font-size:var(--text-base);text-transform:uppercase;letter-spacing:var(--letter-std);transition:background-color var(--transition-slow), color var(--transition-slow), transform var(--transition-fast) ease-out}.pill-button:hover:not(:disabled){background-color:var(--color-fg);color:var(--color-bg)}.pill-button:focus-visible{outline:var(--focus-outline-width) solid var(--color-fg);outline-offset:var(--focus-outline-offset)}.pill-button:active:not(:disabled){transform:scale(.96)}.pill-button:disabled{opacity:var(--opacity-disabled);cursor:not-allowed}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-container{width:100vw;height:100vh;padding:var(--space-2);flex-direction:column;display:flex;overflow:hidden}.sound-toggle{min-width:var(--size-btn-md);min-height:var(--size-btn-sm);height:var(--size-btn-sm);flex:0 0 var(--size-btn-md);padding:0 var(--space-2);border:var(--border-width-hairline) solid var(--color-fg-dim);border-radius:var(--radius-pill);background:var(--color-surface);color:var(--color-fg);font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.08em;opacity:var(--opacity-dim);cursor:pointer;transition:opacity var(--transition-fast) linear, background-color var(--transition-fast) linear, color var(--transition-fast) linear, border-color var(--transition-fast) linear, transform var(--transition-fast) ease-out;justify-content:center;align-items:center;line-height:1;display:inline-flex}.sound-toggle:hover,.sound-toggle:focus-visible{opacity:var(--opacity-full);background-color:var(--color-fg);color:var(--color-bg);border-color:var(--color-fg)}.sound-toggle:focus-visible{outline:var(--focus-outline-width) solid var(--color-fg);outline-offset:var(--focus-outline-offset)}.sound-toggle:active{transform:scale(.95)}.app-container[data-sound=off] .sound-toggle{opacity:var(--opacity-disabled)}.sound-toggle-readout{display:inline-block;transform:translateY(.03em)}.start-sound-toggle{min-width:var(--size-btn-lg);min-height:var(--size-btn-sm);height:var(--size-btn-sm);margin-top:calc(-1 * var(--space-3));opacity:var(--opacity-semi);flex:none}@supports (height:100svh){.app-container{height:100svh}}.app-header{width:100%;max-width:var(--max-width-board);margin-left:auto;margin-right:auto;margin-bottom:var(--space-4);border-bottom:var(--border-width-hairline) solid var(--color-hairline);padding-bottom:var(--space-2)}.title-row{justify-content:space-between;align-items:center;gap:var(--space-3);width:100%;display:flex}.title-controls{justify-content:flex-end;align-items:center;gap:var(--space-1);flex:none;margin-right:1px;display:inline-flex}.title-controls .title-toggle-button{min-width:var(--size-btn-md);width:var(--size-btn-md);min-height:var(--size-btn-sm);height:var(--size-btn-sm);flex:0 0 var(--size-btn-md);border-color:var(--color-fg-dim);background:var(--color-surface);color:var(--color-fg);font-size:var(--text-xs);letter-spacing:.06em;opacity:var(--opacity-dim);padding:0 .35rem}.title-toggle-button:hover,.title-toggle-button:focus-visible{opacity:var(--opacity-full);background-color:var(--color-fg);color:var(--color-bg);border-color:var(--color-fg)}.title-toggle-button:focus-visible{outline:var(--focus-outline-width) solid var(--color-fg);outline-offset:var(--focus-outline-offset)}.title-toggle-button:active{transform:scale(.95)}.app-container[data-sound=off] .title-controls .sound-toggle{opacity:var(--opacity-disabled)}.game-title{font-family:var(--font-display);letter-spacing:var(--letter-tight);text-transform:uppercase;flex:auto;min-width:0;font-size:clamp(1.5rem,4vw,3rem);font-weight:900;line-height:1}.game-area{align-items:center;gap:var(--space-2);flex-direction:column;flex:1;min-height:0;display:flex}.grid-wrapper{flex:1;justify-content:center;align-items:center;width:100%;min-height:0;display:flex;position:relative}.three-board-container{width:100%;height:100%;position:absolute;inset:0}.three-board-container canvas{transition:filter var(--transition-fast) ease-out;display:block;width:100%!important;height:100%!important}.three-board-container:active canvas{filter:brightness(1.06)}.three-board-loading{border:var(--border-width-hairline) solid var(--color-hairline);color:var(--color-fg);font-family:var(--font-display);letter-spacing:var(--letter-wide);text-transform:uppercase;background:var(--color-bg);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.hud-container{width:100%;max-width:var(--max-width-board);border-bottom:var(--border-width-hairline) solid var(--color-hairline);padding-bottom:var(--space-2);justify-content:space-between;align-items:flex-end;gap:var(--space-2);display:flex}.hud-section-actions{justify-content:flex-end;align-items:center;gap:var(--space-1);flex-direction:row;margin-right:1px;display:flex}.hud-section{gap:var(--space-1);flex-direction:column;display:flex}.hud-label{letter-spacing:.1em;color:var(--color-fg-dim);text-transform:uppercase;white-space:nowrap;align-items:center;gap:var(--space-1);font-size:clamp(.5rem,1.2vw,.75rem);display:flex}.hud-value{font-family:var(--font-mono);font-size:clamp(1rem,2.5vw,1.5rem);line-height:1}.hint-button{padding:var(--space-2) var(--space-3);white-space:nowrap}.view-button{width:var(--size-btn-md);height:var(--size-btn-sm);flex:0 0 var(--size-btn-md);font-size:var(--text-xs);letter-spacing:.06em;border-color:var(--color-fg-dim);background:var(--color-surface);color:var(--color-fg);opacity:var(--opacity-semi);transition:transform var(--transition-fast) ease-out;justify-content:center;align-items:center;padding:0 .35rem;line-height:1;display:inline-flex;position:relative}.view-button:active{transform:scale(.92)}.view-angled{background:var(--color-surface);color:var(--color-fg);border-color:var(--color-fg-dim)}.view-top{background:var(--color-fg);color:var(--color-bg);border-color:var(--color-fg)}.combo-section{padding-right:var(--space-3);position:relative}.combo-indicator{width:var(--size-combo-gauge);height:100%;color:var(--color-fg);flex-shrink:0;display:block;position:absolute;top:0;right:0;overflow:visible}.combo-indicator-hidden{visibility:hidden}.combo-countdown-track{fill:#ffffff2e}.combo-countdown-fill{fill:var(--color-fg);transform-box:fill-box;transform-origin:bottom;animation:1.5s linear forwards comboCountdownDrain}@keyframes comboCountdownDrain{0%{transform:scaleY(1)}to{transform:scaleY(0)}}.timer-shake{color:var(--color-warning);animation:.5s cubic-bezier(.36,.07,.19,.97) infinite both shake}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-2px)}40%,60%{transform:translate(2px)}}.combo-notification{pointer-events:none;z-index:10;flex-direction:column;align-items:center;animation:.5s cubic-bezier(.1,.9,.2,1) forwards floatUp;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.combo-text{font-family:var(--font-display);font-size:var(--text-4xl);color:var(--color-fg);-webkit-text-stroke:1.5px var(--color-bg);font-weight:700;line-height:1}@keyframes floatUp{0%{opacity:0;transform:translate(-50%,-30%)scale(.8)}20%{opacity:var(--opacity-full);transform:translate(-50%,-50%)scale(1.1)}30%{transform:translate(-50%,-50%)scale(1)}80%{opacity:var(--opacity-full);transform:translate(-50%,-70%)scale(1)}to{opacity:0;transform:translate(-50%,-80%)scale(.9)}}.start-screen{justify-content:center;align-items:center;gap:var(--space-8);min-height:60vh;width:min(100%, var(--max-width-board));isolation:isolate;flex-direction:column;display:flex;position:relative}.start-screen:before,.start-screen:after{display:none}.start-screen:before{border:var(--border-width-hairline) solid var(--color-hairline);background:linear-gradient(90deg, transparent 0, transparent calc(100% - 1px), var(--color-hairline) 100%) 0 0 / 3.2rem 100%, linear-gradient(0deg, transparent 0, transparent calc(100% - 1px), var(--color-hairline) 100%) 0 0 / 100% 3.2rem, var(--color-surface);height:min(52vh,28rem);opacity:var(--opacity-dim);top:50%}.start-screen:after{top:calc(50% + var(--space-3));border:var(--border-width-hairline) solid var(--color-fg-faint);height:min(52vh,28rem)}.start-panel{width:min(92vw,42rem);padding:var(--space-2) var(--space-3);border-bottom:var(--border-width-hairline) solid transparent;color:var(--color-fg-dim);font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--letter-wide);justify-content:space-between;display:flex;position:absolute;top:calc(50% - min(26vh,14rem));left:50%;transform:translate(-50%)}.start-kicker,.game-over-kicker{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--letter-wider);color:var(--color-fg-dim);text-transform:uppercase}.start-title{font-family:var(--font-display);letter-spacing:var(--letter-tighter);text-transform:uppercase;text-align:center;font-size:clamp(3rem,10vw,8rem);line-height:1}.start-subtitle{font-family:var(--font-mono);font-size:var(--text-xl);letter-spacing:var(--letter-wider);color:var(--color-fg-dim);margin-top:calc(-1 * var(--space-4));text-align:center}.start-actions{align-items:center;gap:var(--space-3);margin-top:var(--space-8);flex-direction:column;display:flex}.start-button{font-size:var(--text-xl);padding:var(--space-6) var(--space-16);min-height:3.75rem;box-shadow:inset 0 0 0 var(--border-width-hairline) var(--color-fg-faint), var(--shadow-elevated);animation:2s ease-in-out infinite pulse;position:relative}.start-tutorial-button{min-height:2rem;padding:var(--space-1) var(--space-4);border-color:var(--color-fg-faint);color:var(--color-fg-dim);font-size:var(--text-xs);letter-spacing:var(--letter-wide)}.start-button:before,.restart-button:before{content:"";inset:var(--space-1);border:var(--border-width-hairline) solid var(--color-fg-faint);border-radius:inherit;pointer-events:none;position:absolute}.start-copyright{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.08em;color:#ffffff59;margin-top:var(--space-4);text-align:center}.start-notice{color:var(--color-fg)}.tutorial-screen{justify-content:center;align-items:stretch;gap:var(--space-3);width:min(calc(100vw - var(--space-8)), 64rem);isolation:isolate;flex-direction:column;min-height:68vh;padding:0;display:flex;position:relative}.tutorial-card{justify-content:center;align-items:center;width:100%;min-width:0;display:flex}.tutorial-card img{aspect-ratio:16/9;object-fit:cover;background:var(--color-bg);width:100%;display:block}.tutorial-play-button{min-height:2rem;padding:var(--space-1) var(--space-4);font-size:var(--text-xs);letter-spacing:var(--letter-wide);text-align:center;white-space:nowrap;align-self:flex-start;margin:0 0 0 5.5%}.e2e-controls{left:var(--space-2);bottom:var(--space-2);z-index:1000;gap:var(--space-1);max-width:calc(100% - var(--space-4));opacity:.35;display:inline-flex;position:absolute}.e2e-controls button{border:var(--border-width-hairline) solid var(--color-fg-faint);color:var(--color-fg-dim);font-family:var(--font-mono);font-size:var(--text-xs);min-height:1.5rem;padding:var(--space-1) var(--space-2);background:#000000ad;line-height:1}.e2e-controls:focus-within,.e2e-controls:hover{opacity:var(--opacity-full)}@keyframes pulse{0%,to{opacity:var(--opacity-full)}50%{opacity:var(--opacity-dim)}}.game-over-overlay{z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:radial-gradient(circle at 50% 45%,#f0f0f014,#0000 32rem),#000000d6;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.game-over-modal{border:var(--border-width-base) solid var(--color-fg);background:linear-gradient(90deg, transparent 0, transparent calc(100% - 1px), var(--color-hairline) 100%) 0 0 / 2.75rem 100%, linear-gradient(0deg, transparent 0, transparent calc(100% - 1px), var(--color-hairline) 100%) 0 0 / 100% 2.75rem, var(--color-bg);padding:var(--space-16);align-items:center;gap:var(--space-8);width:min(calc(100vw - var(--space-8)), 30rem);box-shadow:var(--shadow-elevated);flex-direction:column;display:flex;position:relative}.game-over-modal:before,.game-over-modal:after{content:"";width:var(--space-8);height:var(--space-8);border-color:var(--color-fg);pointer-events:none;position:absolute}.game-over-modal:before{top:var(--space-3);left:var(--space-3);border-top:var(--border-width-base) solid;border-left:var(--border-width-base) solid}.game-over-modal:after{right:var(--space-3);bottom:var(--space-3);border-right:var(--border-width-base) solid;border-bottom:var(--border-width-base) solid}.game-over-modal h2{font-family:var(--font-display);font-size:clamp(1.25rem, 3vw, var(--text-3xl));letter-spacing:var(--letter-tight);white-space:nowrap;text-align:center;width:100%}.final-score{font-family:var(--font-mono);font-size:var(--text-2xl);letter-spacing:.02em}.game-over-description{max-width:20rem;color:var(--color-fg-dim);font-family:var(--font-mono);font-size:var(--text-sm);text-align:center;text-transform:uppercase;line-height:1.6}.restart-button{margin-top:var(--space-4);font-size:var(--text-base);padding:var(--space-4) var(--space-12);position:relative}@media (prefers-reduced-motion:reduce){.app-container:not([data-effects=full]) *,.app-container:not([data-effects=full]) :before,.app-container:not([data-effects=full]) :after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.app-container:not([data-effects=full]) .timer-shake{animation:none}.app-container:not([data-effects=full]) .combo-notification{opacity:var(--opacity-full);transform:translate(-50%,-50%)scale(1);animation:none!important}.app-container:not([data-effects=full]) .combo-countdown-fill{opacity:.65;animation:none!important;transform:scaleY(1)!important}}.app-container[data-effects=safe] *,.app-container[data-effects=safe] :before,.app-container[data-effects=safe] :after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.app-container[data-effects=safe] .timer-shake{animation:none!important}.app-container[data-effects=safe] .combo-notification{opacity:var(--opacity-full)!important;animation:none!important;transform:translate(-50%,-50%)scale(1)!important}.app-container[data-effects=safe] .combo-countdown-fill{opacity:.65!important;animation:none!important;transform:scaleY(1)!important}@media (height<=500px) and (orientation:landscape){.app-container{grid-template-columns:var(--rail-width-landscape) minmax(0, 1fr);grid-template-rows:auto minmax(0,1fr);padding:0;height:100vh!important;display:grid!important}.app-header{z-index:2;padding:var(--space-1);align-items:stretch;gap:var(--space-1);border-bottom:none;flex-direction:column;grid-area:1/1;margin-bottom:0;display:flex;overflow:hidden}.title-row{align-items:stretch;gap:var(--space-1);flex-direction:column;width:100%}.game-title{font-size:var(--text-xs);letter-spacing:var(--letter-wide);white-space:nowrap;text-overflow:ellipsis;flex:none;min-width:0;font-weight:900;overflow:hidden}.title-controls{gap:var(--space-1);flex-direction:column;align-items:stretch;width:100%}.title-controls .title-toggle-button{min-width:calc(var(--rail-width-landscape) - var(--space-3));width:calc(var(--rail-width-landscape) - var(--space-3));height:1.5rem;min-height:1.5rem;padding:0 var(--space-1);font-size:var(--text-xs);flex:0 0 1.5rem}.game-area{display:contents!important}.hud-container{align-items:stretch;gap:var(--space-1);max-width:none;padding:var(--space-1);border-bottom:none;border-right:var(--border-width-hairline) solid var(--color-hairline);flex-direction:column;grid-area:2/1;align-self:stretch;width:100%;overflow:hidden}.hud-section{align-items:center;gap:var(--space-1);flex-direction:row;width:100%}.hud-label{font-size:var(--text-xs);flex:none;min-width:2rem}.hud-value{font-size:var(--text-xs);text-align:right;flex:auto}.combo-section{padding-right:0}.combo-indicator{display:none}.hud-section-actions{flex-direction:row;justify-content:flex-start;width:100%}.hint-button{padding:var(--space-1) var(--space-2);font-size:var(--text-xs);text-align:center;width:100%}.combo-text{font-size:var(--text-2xl);-webkit-text-stroke:var(--border-width-base) var(--color-bg)}.grid-wrapper{grid-area:1/2/-1;width:100%;min-width:0;height:100%;min-height:0}.start-screen{gap:var(--space-3);min-height:40vh}.tutorial-screen{gap:var(--space-1);width:min(100%,177.778vh - 5.33333rem);min-height:100%}.tutorial-card img{width:auto;max-width:100%;max-height:calc(100vh - 3rem)}.tutorial-play-button{min-height:2.25rem;padding:var(--space-1) var(--space-2);font-size:var(--text-xs);margin-left:5%}.start-title{font-size:clamp(1.5rem,5vw,3rem)}.start-subtitle{font-size:var(--text-sm)}.start-button{font-size:var(--text-sm);padding:var(--space-2) var(--space-3)}.start-actions{margin-top:var(--space-3)}.game-over-modal{max-height:calc(100svh - var(--space-2));padding:var(--space-5) var(--space-8);gap:var(--space-2);overflow:hidden}.game-over-modal h2{font-size:var(--text-xl)}.game-over-description{max-width:18rem;font-size:var(--text-xs);line-height:1.35}.final-score{font-size:var(--text-base)}.restart-button{margin-top:var(--space-1);padding:var(--space-2) var(--space-8)}}@media (height<=360px) and (orientation:landscape){.app-container{grid-template-columns:var(--rail-width-landscape-stress) minmax(0, 1fr)}.app-header{padding:var(--space-1);grid-area:1/1;overflow:hidden}.game-title{max-width:3.5rem;font-size:.5rem}.hud-container{grid-area:2/1;overflow:hidden}.title-controls .title-toggle-button{min-width:calc(var(--rail-width-landscape-stress) - var(--space-3));width:calc(var(--rail-width-landscape-stress) - var(--space-3))}}@media (width<=768px){.app-container{padding:var(--space-1)}.app-header{margin-bottom:var(--space-2);padding-bottom:var(--space-1)}.game-title{font-size:var(--text-xl)}.game-area{gap:var(--space-2)}.hud-container{padding-bottom:var(--space-1);gap:var(--space-1)}.hud-section-actions{gap:var(--space-1)}.hud-label{font-size:var(--text-xs)}.hud-value{font-size:var(--text-base)}.combo-text{font-size:var(--text-xl);-webkit-text-stroke:var(--border-width-base) var(--color-bg)}.hint-button{padding:var(--space-2) var(--space-2);font-size:var(--text-sm)}.title-row{gap:var(--space-3)}.title-controls{gap:var(--space-1)}.title-controls .title-toggle-button{width:3.05rem;min-width:3.05rem;min-height:var(--size-btn-sm);height:var(--size-btn-sm);padding:0 var(--space-1);font-size:var(--text-xs);flex-basis:3.05rem}.grid-wrapper{padding:0}.start-screen{gap:var(--space-4);min-height:50vh}.tutorial-screen{width:min(100%,34rem);min-height:58vh}.tutorial-play-button{min-height:2.25rem;padding:var(--space-1) var(--space-3);margin-left:5%}.start-title{font-size:clamp(2rem,8vw,4rem)}.start-subtitle{font-size:var(--text-base)}.start-button{font-size:var(--text-base);padding:var(--space-4) var(--space-8)}.start-actions{margin-top:var(--space-5)}.start-sound-toggle{margin-top:var(--space-2)}.game-over-modal{padding:var(--space-8);gap:var(--space-4)}.game-over-modal h2{font-size:var(--text-xl)}.final-score{font-size:var(--text-lg)}.restart-button{font-size:var(--text-base);padding:var(--space-4) var(--space-8)}}