*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--asphalt: #0e0e12;--asphalt2: #13131a;--asphalt3: #1c1c26;--lane: #f0f0f0;--neon: #f7c015;--neon2: #ff6b1a;--neon3: #00e5ff;--red: #ff2d55;--green: #1eff8e;--muted: #5a5a70;--text: #e8e8f0;--text2: #a0a0b8;--font-head: "Barlow Condensed", sans-serif;--font-body: "Rajdhani", sans-serif;--font-mono: "Share Tech Mono", monospace}html{scroll-behavior:smooth}body{background:var(--asphalt);color:var(--text);font-family:var(--font-body);overflow-x:hidden;cursor:default}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--asphalt2)}::-webkit-scrollbar-thumb{background:var(--neon);border-radius:3px}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.035'/%3E%3C/svg%3E");pointer-events:none;z-index:9999;opacity:.6}.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 2.5rem;height:64px;background:#0e0e12d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgba(247,192,21,.15)}.nav-logo{font-family:var(--font-head);font-size:1.7rem;font-weight:900;letter-spacing:.08em;color:var(--neon);text-transform:uppercase;display:flex;align-items:center;gap:.5rem}.nav-logo span{color:var(--text)}.nav-logo .dot{color:var(--neon2)}.nav-links{display:flex;gap:2rem;list-style:none}.nav-links a{font-family:var(--font-head);font-weight:700;font-size:.9rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text2);text-decoration:none;transition:color .2s;position:relative}.nav-links a:after{content:"";position:absolute;bottom:-3px;left:0;width:0;height:2px;background:var(--neon);transition:width .25s ease}.nav-links a:hover{color:var(--neon)}.nav-links a:hover:after{width:100%}.nav-badge{font-family:var(--font-mono);font-size:.78rem;background:var(--neon);color:var(--asphalt);padding:.35rem .9rem;font-weight:700;letter-spacing:.05em;clip-path:polygon(6px 0%,100% 0%,calc(100% - 6px) 100%,0% 100%)}.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:80px 2rem 2rem}.hero-road{position:absolute;top:0;right:0;bottom:0;left:0;background:url(/road-bg.jpg) center/cover no-repeat;filter:brightness(.25) saturate(1.4);transform:scale(1.04)}.hero-vignette{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,transparent 30%,rgba(14,14,18,.95) 90%)}.speed-lines{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.speed-line{position:absolute;left:50%;width:2px;background:linear-gradient(to bottom,transparent,var(--neon),transparent);opacity:0;animation:speedLine 2s ease-in-out infinite;transform-origin:top center}@keyframes speedLine{0%{opacity:0;transform:translateY(-100%) scaleY(.5)}30%{opacity:.6}to{opacity:0;transform:translateY(110vh) scaleY(1.5)}}.hero-content{position:relative;z-index:2;text-align:center;max-width:900px}.hero-eyebrow{font-family:var(--font-mono);font-size:.8rem;letter-spacing:.3em;color:var(--neon2);text-transform:uppercase;margin-bottom:1.2rem;animation:fadeUp .8s ease both}.hero-title{font-family:var(--font-head);font-size:clamp(4rem,12vw,9rem);font-weight:900;line-height:.92;text-transform:uppercase;letter-spacing:-.02em;animation:fadeUp .8s .1s ease both;color:var(--text)}.hero-title .accent{color:var(--neon);display:block}.hero-title .accent2{color:var(--neon2)}.hero-sub{font-family:var(--font-head);font-size:clamp(1rem,2.5vw,1.5rem);font-weight:300;letter-spacing:.15em;color:var(--text2);margin:1.5rem auto 2.5rem;max-width:600px;text-transform:uppercase;animation:fadeUp .8s .2s ease both}.hero-ctas{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;animation:fadeUp .8s .3s ease both}.btn-primary{font-family:var(--font-head);font-weight:800;font-size:1.1rem;letter-spacing:.12em;text-transform:uppercase;padding:1rem 2.5rem;background:var(--neon);color:var(--asphalt);border:none;cursor:pointer;clip-path:polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%);transition:all .2s;position:relative;overflow:hidden}.btn-primary:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;opacity:0;transition:opacity .15s}.btn-primary:hover{transform:scale(1.04);box-shadow:0 0 30px #f7c01580}.btn-primary:hover:after{opacity:.1}.btn-primary:active{transform:scale(.98)}.btn-secondary{font-family:var(--font-head);font-weight:700;font-size:1.1rem;letter-spacing:.12em;text-transform:uppercase;padding:1rem 2.5rem;background:transparent;color:var(--text);border:2px solid rgba(255,255,255,.2);cursor:pointer;clip-path:polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%);transition:all .2s}.btn-secondary:hover{border-color:var(--neon3);color:var(--neon3);box-shadow:0 0 20px #00e5ff33}.hero-stats{display:flex;gap:3rem;justify-content:center;margin-top:4rem;animation:fadeUp .8s .4s ease both}.hero-stat{text-align:center}.hero-stat-num{font-family:var(--font-head);font-size:2.5rem;font-weight:900;color:var(--neon);display:block;line-height:1}.hero-stat-label{font-family:var(--font-mono);font-size:.65rem;letter-spacing:.2em;color:var(--muted);text-transform:uppercase;margin-top:.3rem}@keyframes fadeUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.scroll-ind{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:.4rem;animation:fadeUp 1s 1s ease both;z-index:2}.scroll-ind-text{font-family:var(--font-mono);font-size:.65rem;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}.scroll-ind-arrow{width:1px;height:40px;background:linear-gradient(to bottom,var(--muted),transparent);animation:scrollPulse 1.5s ease-in-out infinite}@keyframes scrollPulse{0%,to{opacity:.4;transform:scaleY(1)}50%{opacity:1;transform:scaleY(1.3)}}.section{padding:6rem 2rem;max-width:1200px;margin:0 auto}.section-full{padding:6rem 2rem;position:relative}.section-label{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.3em;color:var(--neon2);text-transform:uppercase;margin-bottom:.8rem;display:flex;align-items:center;gap:.8rem}.section-label:before{content:"";display:inline-block;width:24px;height:2px;background:var(--neon2)}.section-title{font-family:var(--font-head);font-size:clamp(2.5rem,5vw,4rem);font-weight:900;text-transform:uppercase;line-height:1;letter-spacing:.02em;color:var(--text)}.section-title .hi{color:var(--neon)}.game-section{background:var(--asphalt2);border-top:1px solid rgba(247,192,21,.1);border-bottom:1px solid rgba(247,192,21,.1)}.game-wrapper{max-width:1100px;margin:0 auto;padding:5rem 2rem}.game-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:2.5rem;flex-wrap:wrap;gap:1rem}.game-meta{display:flex;gap:1.5rem;align-items:center}.game-badge{font-family:var(--font-mono);font-size:.72rem;padding:.3rem .8rem;border:1px solid var(--muted);color:var(--muted);letter-spacing:.1em;text-transform:uppercase}.game-badge.active{border-color:var(--green);color:var(--green)}.canvas-container{position:relative;background:#070710;border:1px solid rgba(247,192,21,.2);overflow:hidden}#gameCanvas{display:block;width:100%;max-width:700px;margin:0 auto;cursor:crosshair}.canvas-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#070710eb;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:opacity .4s,visibility .4s;z-index:10}.canvas-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}.overlay-icon{font-size:4rem;margin-bottom:1rem;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.overlay-title{font-family:var(--font-head);font-size:clamp(2rem,6vw,3.5rem);font-weight:900;text-transform:uppercase;letter-spacing:.05em;color:var(--neon);text-align:center;margin-bottom:.5rem}.overlay-sub{font-family:var(--font-body);font-size:1rem;color:var(--text2);text-align:center;max-width:340px;margin-bottom:1.5rem;line-height:1.6}.overlay-score{font-family:var(--font-mono);font-size:1.1rem;color:var(--text);margin-bottom:.4rem}.overlay-score span{color:var(--neon);font-size:1.5rem}.overlay-controls{margin-top:.5rem;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.1em;color:var(--muted);text-transform:uppercase;text-align:center;line-height:2}.hud{display:flex;align-items:stretch;justify-content:space-between;background:#070710cc;border:1px solid rgba(247,192,21,.15);border-top:none;padding:.6rem 1.5rem;gap:1rem;flex-wrap:wrap}.hud-item{display:flex;flex-direction:column;align-items:center}.hud-label{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}.hud-value{font-family:var(--font-head);font-size:1.5rem;font-weight:900;color:var(--text);line-height:1.1}.hud-value.yellow{color:var(--neon)}.hud-value.orange{color:var(--neon2)}.hud-value.cyan{color:var(--neon3)}.hud-value.green{color:var(--green)}.hud-value.red{color:var(--red)}.hud-sep{width:1px;background:#ffffff12;align-self:stretch}.hud-progress-bar{flex:1;min-width:120px;display:flex;flex-direction:column;gap:.3rem;justify-content:center}.progress-track{width:100%;height:6px;background:#ffffff14;border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--neon2),var(--neon));border-radius:3px;transition:width .3s ease;width:0%}.mobile-controls{display:none;gap:.8rem;margin-top:1rem;justify-content:center}.mc-btn{width:70px;height:60px;background:#f7c0151a;border:2px solid rgba(247,192,21,.3);color:var(--neon);font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;clip-path:polygon(6px 0%,100% 0%,calc(100% - 6px) 100%,0% 100%);transition:background .15s;touch-action:manipulation;-webkit-user-select:none;user-select:none}.mc-btn:active{background:#f7c01540}@media (max-width: 600px){.mobile-controls{display:flex}}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5px;margin-top:3rem;background:#f7c01514;border:1px solid rgba(247,192,21,.08)}.feature-card{background:var(--asphalt2);padding:2.5rem 2rem;position:relative;overflow:hidden;transition:background .25s}.feature-card:before{content:"";position:absolute;top:0;left:0;width:3px;height:0;background:var(--neon);transition:height .35s ease}.feature-card:hover{background:var(--asphalt3)}.feature-card:hover:before{height:100%}.feature-icon{font-size:2.2rem;margin-bottom:1rem;display:block;filter:drop-shadow(0 0 8px currentColor)}.feature-title{font-family:var(--font-head);font-size:1.3rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--text);margin-bottom:.6rem}.feature-desc{font-size:.95rem;color:var(--text2);line-height:1.65}.feature-tag{display:inline-block;margin-top:1rem;font-family:var(--font-mono);font-size:.65rem;letter-spacing:.15em;color:var(--neon2);text-transform:uppercase}.howto-section{background:var(--asphalt)}.steps-timeline{position:relative;margin-top:3.5rem;display:flex;flex-direction:column;gap:0}.step{display:grid;grid-template-columns:80px 1fr;gap:2rem;position:relative;padding-bottom:3rem}.step:last-child{padding-bottom:0}.step-num-wrap{display:flex;flex-direction:column;align-items:center}.step-num{font-family:var(--font-head);font-size:3.5rem;font-weight:900;color:transparent;-webkit-text-stroke:2px var(--neon);line-height:1;min-width:60px;text-align:center}.step-line{flex:1;width:2px;background:linear-gradient(to bottom,var(--neon),transparent);margin-top:.5rem}.step:last-child .step-line{display:none}.step-body{padding-top:.4rem}.step-title{font-family:var(--font-head);font-size:1.5rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--text);margin-bottom:.5rem}.step-desc{color:var(--text2);line-height:1.7;font-size:1rem}.step-keys{display:flex;gap:.5rem;margin-top:.8rem;flex-wrap:wrap}.key{font-family:var(--font-mono);font-size:.75rem;padding:.3rem .7rem;border:1px solid var(--muted);color:var(--text);background:#ffffff0a;letter-spacing:.1em;text-transform:uppercase;border-radius:2px}.key.neon{border-color:var(--neon);color:var(--neon)}.leaderboard-section{background:var(--asphalt2)}.leaderboard-wrap{max-width:700px}.lb-table{margin-top:2.5rem;width:100%;border-collapse:collapse}.lb-table thead tr{border-bottom:1px solid rgba(247,192,21,.2)}.lb-table th{font-family:var(--font-mono);font-size:.65rem;letter-spacing:.2em;color:var(--muted);text-transform:uppercase;padding:.5rem 1rem;text-align:left}.lb-table tbody tr{border-bottom:1px solid rgba(255,255,255,.04);transition:background .2s}.lb-table tbody tr:hover{background:#f7c0150a}.lb-table td{padding:.9rem 1rem;font-family:var(--font-body);font-size:1rem;color:var(--text)}.lb-rank{font-family:var(--font-head);font-weight:900;font-size:1.4rem;color:var(--muted)}.lb-rank.gold{color:var(--neon)}.lb-rank.silver{color:#ccc}.lb-rank.bronze{color:#cd7f32}.lb-name{font-weight:600}.lb-score{font-family:var(--font-mono);color:var(--neon);font-size:1rem}.lb-level{font-family:var(--font-mono);font-size:.75rem;padding:.2rem .6rem;border-radius:1px;text-transform:uppercase;letter-spacing:.1em}.lb-level.lv1{background:#1eff8e1a;color:var(--green)}.lb-level.lv2{background:#f7c0151a;color:var(--neon)}.lb-level.lv3{background:#ff6b1a1a;color:var(--neon2)}.lb-level.lv4{background:#ff2d551a;color:var(--red)}.lb-trophy{font-size:1.1rem}.ticker-wrap{background:var(--neon);overflow:hidden;padding:.7rem 0;position:relative}.ticker-wrap:before,.ticker-wrap:after{content:"";position:absolute;top:0;bottom:0;width:80px;z-index:2}.ticker-wrap:before{left:0;background:linear-gradient(90deg,var(--neon),transparent)}.ticker-wrap:after{right:0;background:linear-gradient(-90deg,var(--neon),transparent)}.ticker-track{display:flex;white-space:nowrap;animation:tickerScroll 30s linear infinite}.ticker-item{font-family:var(--font-head);font-size:.85rem;font-weight:800;text-transform:uppercase;letter-spacing:.15em;color:var(--asphalt);padding:0 2.5rem;display:flex;align-items:center;gap:1rem}.ticker-item:before{content:"◆";font-size:.5rem}@keyframes tickerScroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.modes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;margin-top:3rem}.mode-card{border:1px solid rgba(255,255,255,.07);background:linear-gradient(145deg,var(--asphalt2),var(--asphalt3));padding:2rem 1.5rem;position:relative;overflow:hidden;cursor:pointer;transition:transform .25s,border-color .25s}.mode-card:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--card-accent, var(--neon));transform:scaleX(0);transform-origin:left;transition:transform .35s ease}.mode-card:hover{transform:translateY(-4px);border-color:#ffffff26}.mode-card:hover:after{transform:scaleX(1)}.mode-card.c1{--card-accent: var(--green)}.mode-card.c2{--card-accent: var(--neon)}.mode-card.c3{--card-accent: var(--neon2)}.mode-card.c4{--card-accent: var(--red)}.mode-icon{font-size:2.5rem;margin-bottom:1rem;display:block}.mode-name{font-family:var(--font-head);font-size:1.4rem;font-weight:900;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.4rem}.mode-desc{color:var(--text2);font-size:.9rem;line-height:1.6}.mode-diff{display:flex;gap:4px;margin-top:1rem}.diff-dot{width:8px;height:8px;border-radius:50%;background:#ffffff26}.diff-dot.on{background:var(--card-accent, var(--neon))}footer{background:var(--asphalt);border-top:1px solid rgba(247,192,21,.1);padding:3rem 2rem}.footer-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1.5rem}.footer-logo{font-family:var(--font-head);font-size:1.4rem;font-weight:900;color:var(--neon);letter-spacing:.08em;text-transform:uppercase}.footer-copy{font-family:var(--font-mono);font-size:.7rem;color:var(--muted);letter-spacing:.1em}.footer-links{display:flex;gap:1.5rem;list-style:none}.footer-links a{font-family:var(--font-mono);font-size:.7rem;color:var(--muted);text-decoration:none;letter-spacing:.1em;text-transform:uppercase;transition:color .2s}.footer-links a:hover,.text-neon{color:var(--neon)}.text-neon2{color:var(--neon2)}.text-neon3{color:var(--neon3)}.divider{height:1px;background:linear-gradient(90deg,transparent,rgba(247,192,21,.2),transparent);margin:0}.route-modal{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#070710d9;z-index:20;opacity:0;visibility:hidden;transition:opacity .3s}.route-modal.visible{opacity:1;visibility:visible}.route-choice-box{text-align:center;padding:2rem}.route-choice-title{font-family:var(--font-head);font-size:1.8rem;font-weight:900;text-transform:uppercase;color:var(--neon3);margin-bottom:.5rem;letter-spacing:.05em}.route-choice-sub{font-family:var(--font-mono);font-size:.72rem;color:var(--muted);letter-spacing:.15em;text-transform:uppercase;margin-bottom:1.5rem}.route-timer{font-family:var(--font-mono);font-size:2rem;color:var(--red);margin-bottom:1.5rem;animation:routeBlink .5s ease-in-out infinite alternate}@keyframes routeBlink{0%{opacity:.6}to{opacity:1}}.route-buttons{display:flex;gap:1rem;justify-content:center}.route-btn{font-family:var(--font-head);font-weight:800;font-size:1rem;letter-spacing:.1em;text-transform:uppercase;padding:.9rem 1.8rem;cursor:pointer;border:2px solid;background:transparent;clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);transition:all .2s}.route-btn.left{border-color:var(--neon3);color:var(--neon3)}.route-btn.right{border-color:var(--neon2);color:var(--neon2)}.route-btn.left:hover{background:#00e5ff26}.route-btn.right:hover{background:#ff6b1a26}.flash{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:15;opacity:0}.flash.red-flash{background:#ff2d5559}.flash.green-flash{background:#1eff8e40}@keyframes flashAnim{0%{opacity:1}to{opacity:0}}.flash.active{animation:flashAnim .35s ease forwards}@media (max-width: 768px){.nav-links{display:none}.hero-stats{gap:1.5rem}.step{grid-template-columns:50px 1fr;gap:1rem}.step-num{font-size:2.5rem}.hud{padding:.5rem .8rem;gap:.5rem}.hud-value{font-size:1.1rem}}@media (max-width: 480px){.hero-stats{gap:1rem}.hero-stat-num{font-size:1.8rem}.game-header{flex-direction:column;align-items:flex-start}}