:root{color-scheme:dark;--bg: #050711;--panel: rgba(8, 13, 30, .66);--panel-strong: rgba(10, 17, 40, .82);--cyan: #37f5ff;--cyan-soft: rgba(55, 245, 255, .22);--blue: #3684ff;--purple: #8a48ff;--magenta: #ff3bd4;--red: #ff3c58;--orange: #ff9a3c;--green: #42ffae;--text: #f6fbff;--muted: #a9b4c9;--line: rgba(130, 224, 255, .22);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0}body{min-width:320px;min-height:100svh;overflow-x:hidden;color:var(--text);background:radial-gradient(circle at 50% 20%,rgba(55,245,255,.13),transparent 28rem),radial-gradient(circle at 84% 72%,rgba(255,59,212,.13),transparent 22rem),var(--bg)}button,input{font:inherit}button{border:0}button:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}.app-shell{position:relative;min-height:100vh;min-height:100svh;min-width:0;isolation:isolate;overflow-x:clip}.app-shell:before{position:fixed;inset:0;z-index:-2;content:"";background:linear-gradient(115deg,rgba(55,245,255,.09),transparent 32%),linear-gradient(250deg,rgba(255,59,212,.11),transparent 40%),linear-gradient(180deg,#0b142c00,#040510d1);background-size:180% 180%;animation:gradientDrift 12s ease-in-out infinite alternate}.app-shell:after{position:fixed;inset:0;z-index:-1;pointer-events:none;content:"";background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px);background-size:54px 54px;-webkit-mask-image:linear-gradient(to bottom,transparent,black 18%,black 76%,transparent);mask-image:linear-gradient(to bottom,transparent,black 18%,black 76%,transparent)}.screen{position:relative;display:grid;width:100%;min-width:0;min-height:100vh;min-height:100svh;padding:clamp(1rem,3vw,2rem);animation:screenIn .43s ease both}.glass-panel{min-width:0;max-width:100%;border:1px solid var(--line);border-radius:8px;background:linear-gradient(145deg,#ffffff17,#ffffff08),var(--panel);box-shadow:0 24px 90px #0006,inset 0 1px #ffffff26;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.eyebrow{margin:0 0 .8rem;color:var(--cyan);font-size:.78rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}h1,h2,p{margin-top:0}h1{margin-bottom:1rem;font-size:clamp(2.7rem,8vw,7.4rem);line-height:.88;letter-spacing:0;overflow-wrap:anywhere;text-transform:uppercase;text-shadow:0 0 18px rgba(55,245,255,.48),0 0 46px rgba(138,72,255,.35)}h2{margin-bottom:0;font-size:clamp(1.5rem,3vw,2.2rem)}.intro-copy{max-width:56rem;margin-bottom:0;color:var(--muted);font-size:clamp(1rem,2vw,1.2rem);line-height:1.65}.primary-button,.ghost-button,.text-button{max-width:100%;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease,color .18s ease}.primary-button{position:relative;min-height:3.45rem;padding:0 1.45rem;min-width:0;overflow:hidden;color:#03101c;font-weight:950;letter-spacing:.08em;text-transform:uppercase;border-radius:8px;background:linear-gradient(90deg,var(--cyan),#7cfffa 44%,var(--magenta)),var(--cyan);box-shadow:0 0 24px #37f5ff8a,0 0 60px #ff3bd442}.primary-button:before{position:absolute;inset:0;content:"";background:linear-gradient(100deg,transparent 0 24%,rgba(255,255,255,.72) 45%,transparent 62%);transform:translate(-120%);transition:transform .52s ease}.primary-button:hover{transform:translateY(-2px) scale(1.012);box-shadow:0 0 34px #37f5ffb8,0 0 78px #ff3bd452}.primary-button:hover:before{transform:translate(120%)}.primary-button:active,.ghost-button:active,.text-button:active{transform:translateY(1px) scale(.98)}.primary-button--wide{width:100%}.ghost-button{min-height:3.1rem;padding:0 1.25rem;min-width:0;color:var(--text);font-weight:850;letter-spacing:.05em;text-transform:uppercase;border:1px solid rgba(55,245,255,.42);border-radius:8px;background:#37f5ff14;box-shadow:inset 0 0 24px #37f5ff14}.ghost-button:hover{border-color:#37f5ffd1;background:#37f5ff26;box-shadow:inset 0 0 28px #37f5ff1c,0 0 30px #37f5ff3d}.ghost-button--small{min-height:2.55rem}.text-button{width:fit-content;padding:.45rem 0;color:var(--muted);font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:transparent}.text-button:hover{color:var(--cyan)}.particle-background{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}.aurora{position:absolute;width:46rem;max-width:100vw;aspect-ratio:1;filter:blur(72px);opacity:.42;mix-blend-mode:screen;animation:auroraFloat 14s ease-in-out infinite alternate}.aurora--one{top:-14rem;left:-9rem;background:#37f5ff6b}.aurora--two{right:-14rem;bottom:-15rem;background:#ff3bd459;animation-delay:-5s}.aurora--three{top:36%;left:42%;width:28rem;background:#3684ff47;animation-delay:-8s}.atmosphere-particle{position:absolute;left:var(--left);top:var(--top);width:var(--size);height:var(--size);border-radius:999px;background:currentColor;color:#7ef5ffb8;box-shadow:0 0 12px currentColor,0 0 24px #ff3bd447;animation:particleDrift var(--duration) linear var(--delay) infinite}.username-screen,.leaderboard-screen{place-items:center}.username-panel{width:min(100%,34rem);max-width:100%;padding:clamp(1.4rem,4vw,2.4rem)}.username-form{display:grid;gap:.9rem;margin-top:2rem}.username-form label{color:var(--muted);font-size:.82rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.username-form input{width:100%;min-height:4rem;padding:0 1.1rem;color:var(--text);font-size:1.3rem;font-weight:850;border:1px solid rgba(55,245,255,.34);border-radius:8px;background:#030918ad;box-shadow:inset 0 0 22px #37f5ff12,0 0 20px #37f5ff0f}.username-form input::placeholder{color:#a9b4c980}.validation-message{margin:-.25rem 0 0;color:#ff8da0;font-size:.92rem}.menu-screen{align-items:center}.menu-shell{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(20rem,.75fr);gap:clamp(1rem,5vw,4rem);width:min(100%,72rem);min-width:0;max-width:72rem;margin:0 auto;align-items:center}.title-stack{padding-top:clamp(0rem,4vw,3rem)}.menu-card{display:grid;min-width:0;gap:1.3rem;padding:clamp(1.15rem,3vw,1.8rem)}.pilot-chip{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.9rem 1rem;border:1px solid rgba(55,245,255,.22);border-radius:8px;background:#ffffff0b}.pilot-chip span{color:var(--muted);font-size:.76rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.pilot-chip strong{overflow-wrap:anywhere;font-size:1.1rem;text-align:right}.pilot-chip--small{min-width:min(16rem,42vw)}.menu-instructions{display:grid;gap:.75rem}.menu-instructions div{display:flex;gap:.8rem;align-items:center;color:var(--text);line-height:1.4}.instruction-number{color:var(--magenta);font-size:.74rem;font-weight:950}.precision-toggle{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;align-items:center;padding:.8rem;border:1px solid rgba(138,72,255,.24);border-radius:8px;background:#8a48ff14}.precision-toggle__label{color:var(--muted);font-size:.78rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.precision-toggle__buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem;min-width:0}.precision-toggle button{min-width:2.6rem;min-height:2.25rem;color:var(--text);font-weight:950;border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#ffffff0f;cursor:pointer;transition:background .16s ease,box-shadow .16s ease,transform .16s ease}.precision-toggle button:hover,.precision-toggle button.is-active{color:#06111d;background:var(--cyan);box-shadow:0 0 22px #37f5ff70}.precision-toggle button:active{transform:scale(.94)}.precision-toggle--compact{padding:.5rem}.precision-toggle--compact .precision-toggle__label{display:none}.precision-toggle--compact button{min-width:2.35rem;min-height:2.05rem}.menu-actions{display:grid;gap:.75rem}.game-screen{align-items:stretch}.game-topbar{position:relative;z-index:2;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;width:min(100%,78rem);min-width:0;margin:0 auto;align-items:start}.game-topbar .precision-toggle{margin-left:auto}.countdown-stage,.strike-stage{display:grid;width:100%;min-width:0;place-items:center;align-content:center;min-height:max(30rem,calc(100svh - 7rem))}.countdown-target{display:grid;gap:.25rem;min-width:min(100%,16rem);margin-bottom:clamp(.8rem,3vh,1.5rem);padding:.8rem 1rem;text-align:center;border:1px solid rgba(55,245,255,.34);border-radius:8px;background:#37f5ff14;box-shadow:inset 0 0 24px #37f5ff14,0 0 36px #37f5ff24}.countdown-target span,.result-time-label{color:var(--muted);font-size:.74rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.countdown-target strong{font-size:clamp(1.6rem,5vw,2.4rem);font-variant-numeric:tabular-nums;text-shadow:0 0 20px rgba(55,245,255,.6)}.countdown-number{font-size:clamp(6rem,22vw,17rem);font-weight:1000;line-height:.9;color:var(--text);font-variant-numeric:tabular-nums;text-shadow:0 0 32px rgba(55,245,255,.8),0 0 100px rgba(255,59,212,.5);animation:countdownPop .82s cubic-bezier(.2,.95,.2,1) both}.strike-stage{position:relative;gap:clamp(1.1rem,3vh,2rem);max-width:100%;text-align:center}.target-ring{position:absolute;width:min(86vw,38rem);max-width:100%;aspect-ratio:1;border:1px solid rgba(55,245,255,calc(.12 + var(--timer-intensity) * .4));border-radius:999px;box-shadow:0 0 calc(40px + var(--timer-intensity) * 70px) rgba(55,245,255,calc(.08 + var(--timer-intensity) * .28)),inset 0 0 calc(24px + var(--timer-intensity) * 54px) rgba(255,59,212,calc(.04 + var(--timer-intensity) * .18));opacity:calc(.42 + var(--timer-intensity) * .45);transform:scale(calc(.9 + var(--timer-intensity) * .15));animation:ringPulse 1.1s ease-in-out infinite alternate}.target-label{position:relative;z-index:1;margin-bottom:-.4rem;color:var(--muted);font-size:clamp(.9rem,2vw,1.05rem);font-weight:850;letter-spacing:.14em;text-transform:uppercase}.timer-display{position:relative;z-index:1;width:100%;max-width:100%;color:var(--text);font-size:clamp(3.5rem,13vw,11rem);font-weight:1000;line-height:.9;letter-spacing:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums;text-shadow:0 0 calc(18px + var(--timer-intensity) * 28px) rgba(55,245,255,calc(.45 + var(--timer-intensity) * .4)),0 0 calc(50px + var(--timer-intensity) * 84px) rgba(138,72,255,calc(.25 + var(--timer-intensity) * .3)),0 0 calc(70px + var(--timer-intensity) * 120px) rgba(255,59,212,calc(var(--timer-intensity) * .25));transform:scale(calc(1 + var(--timer-intensity) * .025));transition:transform .1s linear,text-shadow .1s linear}.game-screen--stopped .timer-display{animation:timerFreeze .76s cubic-bezier(.13,1.35,.22,1) both}.strike-button{position:relative;z-index:1;display:grid;place-items:center;width:min(100%,25rem);min-height:clamp(6rem,18vw,10.5rem);padding:clamp(.9rem,3vw,1.2rem);overflow:hidden;color:var(--text);border:2px solid rgba(55,245,255,.72);border-radius:8px;background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.22),transparent 42%),linear-gradient(145deg,#ff3bd447,#37f5ff33),#050c1ce0;box-shadow:0 0 22px #37f5ff7a,0 0 70px #ff3bd447,inset 0 0 40px #37f5ff2e;cursor:pointer;animation:strikePulse 1.45s ease-in-out infinite;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,filter .18s ease;touch-action:manipulation}.strike-button span{font-size:clamp(2.3rem,8vw,4.6rem);font-weight:1000;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 0 16px rgba(55,245,255,.74),0 0 42px rgba(255,59,212,.46)}.strike-button small{color:var(--muted);font-size:clamp(.78rem,2vw,.95rem);font-weight:850;letter-spacing:.1em;text-transform:uppercase}.strike-button:hover:not(:disabled){transform:translateY(-4px) scale(1.03);border-color:var(--cyan);box-shadow:0 0 32px #37f5ffc7,0 0 92px #ff3bd46b,inset 0 0 54px #37f5ff3d}.strike-button:active:not(:disabled){transform:translateY(3px) scale(.97);filter:saturate(1.35)}.strike-button:disabled{cursor:default;filter:grayscale(.25);opacity:.82}.button-ripple{position:absolute;left:var(--x);top:var(--y);width:1rem;height:1rem;pointer-events:none;border-radius:999px;background:#ffffffb8;box-shadow:0 0 28px #37f5ffe6;transform:translate(-50%,-50%);animation:rippleBurst .64s ease-out both}.result-screen{place-items:center}.result-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(22rem,1.08fr);gap:clamp(1rem,3vw,1.5rem);width:min(100%,82rem);min-width:0;align-items:stretch}.result-card,.leaderboard-card{min-width:0;max-width:100%;padding:clamp(1.1rem,3vw,1.7rem)}.result-card{position:relative;overflow:hidden}.result-card:before{position:absolute;inset:0;pointer-events:none;content:"";background:radial-gradient(circle at 50% 0%,rgba(55,245,255,.2),transparent 46%);opacity:.85}.result-card>*{position:relative}.rating-title{margin-bottom:.5rem;font-size:clamp(2rem,5vw,4rem);line-height:.95}.timing-status{display:inline-flex;margin-bottom:1rem;padding:.45rem .7rem;font-size:.78rem;font-weight:950;letter-spacing:.12em;border:1px solid currentColor;border-radius:8px;text-transform:uppercase;background:#ffffff0f}.timing-status--perfect{color:var(--green);box-shadow:0 0 26px #42ffae40}.timing-status--early{color:var(--cyan)}.timing-status--late{color:var(--orange)}.result-time{margin:.1rem 0 1.1rem;font-size:clamp(3.2rem,9vw,7rem);font-weight:1000;line-height:.95;letter-spacing:0;font-variant-numeric:tabular-nums;text-shadow:0 0 26px rgba(55,245,255,.7),0 0 76px rgba(255,59,212,.38)}.result-time-label{margin:0 0 .25rem}.result-screen--late .result-card,.result-screen--early .result-card{animation:resultShake .42s ease both}.result-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(12rem,100%),1fr));gap:.75rem}.result-stats div,.personal-best{display:grid;gap:.25rem;padding:.9rem;border:1px solid rgba(255,255,255,.09);border-radius:8px;background:#ffffff0d}.result-stats span,.personal-best span{color:var(--muted);font-size:.74rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.result-stats strong,.personal-best strong{overflow-wrap:anywhere;font-size:clamp(1.05rem,2.6vw,1.35rem)}.personal-best{margin-top:.75rem}.result-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(10rem,100%),1fr));gap:.7rem;margin-top:1rem}.result-actions .text-button{justify-self:start}.leaderboard{display:grid;min-width:0;gap:1rem}.leaderboard__header{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;align-items:start}.leaderboard-table{display:grid;gap:.5rem;width:100%;min-width:0;overflow-x:auto;padding-bottom:.3rem;overscroll-behavior-x:contain}.leaderboard-row{display:grid;grid-template-columns:.5fr 1.1fr .9fr .9fr 1.2fr .82fr;gap:.55rem;align-items:center;min-width:44rem;min-height:3rem;padding:.55rem .7rem;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:#ffffff0b;color:#dfe8ff;font-size:clamp(.78rem,1.5vw,.95rem);animation:rowIn .42s ease both;animation-delay:var(--row-delay)}.leaderboard-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}.leaderboard-row--head{min-height:2.35rem;color:var(--muted);font-size:.7rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;background:#37f5ff12;animation:none}.leaderboard-row.is-current{border-color:#42ffaeb8;background:#42ffae1f;box-shadow:0 0 30px #42ffae2b}.rank{color:var(--cyan);font-weight:950}.empty-state{margin-bottom:0;color:var(--muted);line-height:1.6}.leaderboard-card--standalone{width:min(100%,68rem);min-width:0}.celebration{position:fixed;inset:0;z-index:4;overflow:hidden;pointer-events:none}.spark{position:absolute;left:50%;top:35%;width:.55rem;height:1.55rem;border-radius:999px;background:linear-gradient(var(--cyan),var(--magenta));box-shadow:0 0 18px #37f5ffcc,0 0 34px #ff3bd473;transform:rotate(var(--spark-angle)) translateY(0);animation:sparkBurst 1.1s ease-out var(--spark-delay) both}.celebration--perfect .spark{background:linear-gradient(var(--green),var(--cyan),white);box-shadow:0 0 22px #42ffaef2,0 0 44px #37f5ffa6}.danger-flash{position:fixed;inset:0;z-index:3;pointer-events:none;background:radial-gradient(circle,rgba(255,60,88,.22),rgba(255,60,88,.02) 52%,transparent);animation:dangerFlash .78s ease-out both}@keyframes screenIn{0%{opacity:0;transform:translateY(14px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes gradientDrift{0%{background-position:0% 35%}to{background-position:100% 65%}}@keyframes auroraFloat{0%{transform:translate3d(-2%,1%,0) scale(1)}to{transform:translate3d(4%,-3%,0) scale(1.08)}}@keyframes particleDrift{0%{opacity:0;transform:translate3d(0,2rem,0) scale(.6)}12%,82%{opacity:.72}to{opacity:0;transform:translate3d(3rem,-12rem,0) scale(1.12)}}@keyframes countdownPop{0%{opacity:0;transform:scale(.52) rotate(-3deg)}45%{opacity:1;transform:scale(1.08) rotate(1deg)}to{opacity:0;transform:scale(.9) rotate(0)}}@keyframes ringPulse{0%{filter:saturate(.9)}to{filter:saturate(1.55) brightness(1.15)}}@keyframes strikePulse{0%,to{box-shadow:0 0 22px #37f5ff73,0 0 70px #ff3bd440,inset 0 0 40px #37f5ff2b}50%{box-shadow:0 0 34px #37f5ffad,0 0 94px #ff3bd45c,inset 0 0 54px #37f5ff3b}}@keyframes rippleBurst{to{opacity:0;transform:translate(-50%,-50%) scale(38)}}@keyframes timerFreeze{0%{transform:scale(1);filter:brightness(1)}46%{transform:scale(1.08);filter:brightness(1.7)}to{transform:scale(1);filter:brightness(1.15)}}@keyframes resultShake{0%,to{transform:translate(0)}18%{transform:translate(-8px)}38%{transform:translate(7px)}58%{transform:translate(-4px)}78%{transform:translate(3px)}}@keyframes rowIn{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:translate(0)}}@keyframes sparkBurst{0%{opacity:0;transform:rotate(var(--spark-angle)) translateY(0) scale(.4)}12%{opacity:1}to{opacity:0;transform:rotate(var(--spark-angle)) translateY(calc(-1 * var(--spark-distance))) scale(1)}}@keyframes dangerFlash{0%{opacity:0}25%{opacity:1}to{opacity:0}}@media(max-width:940px){.menu-shell,.result-grid{grid-template-columns:1fr}.menu-shell{align-content:center}.game-topbar{justify-content:flex-start}.game-topbar .precision-toggle{margin-left:0}}@media(max-width:640px){.screen{padding:clamp(.75rem,3vw,1rem)}.username-panel,.menu-card,.result-card,.leaderboard-card{padding:1rem}.result-stats,.result-actions{grid-template-columns:1fr}.leaderboard-row{gap:.35rem;min-width:41rem;padding-inline:.5rem}.leaderboard--compact .leaderboard-row{min-width:40rem;font-size:.75rem}.precision-toggle{align-items:stretch;flex-direction:column}.precision-toggle--compact{flex-direction:row}.pilot-chip{align-items:flex-start;flex-direction:column}.pilot-chip strong{text-align:left}}@media(max-width:430px){.timer-display{font-size:clamp(3.5rem,13vw,11rem)}.strike-button{width:100%}.strike-button span{font-size:clamp(2rem,12vw,3.3rem)}.result-time{font-size:clamp(2.7rem,17vw,5rem)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}