:root{--bg-dark:#1a1a2e;--bg-darker:#0d0d1a;--bg-card:#232342;--bg-input:#2a2a4a;--accent:#53a8ff;--accent-hover:#3d8ce0;--accent-glow:#53a8ff4d;--green:#4ade80;--red:#f87171;--yellow:#fbbf24;--text:#e2e8f0;--text-dim:#94a3b8;--text-muted:#64748b;--border:#334155;--radius:8px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-dark);color:var(--text);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.site-header{background:var(--bg-darker);border-bottom:1px solid var(--border);z-index:100;justify-content:space-between;align-items:center;height:56px;padding:0 24px;display:flex;position:sticky;top:0}.site-logo{color:var(--accent);letter-spacing:-.5px;font-size:20px;font-weight:700}.site-logo span{color:var(--text);font-weight:400}.nav-links{align-items:center;gap:16px;display:flex}.nav-links a{color:var(--text-dim);border-radius:var(--radius);padding:6px 12px;font-size:14px;transition:color .15s,background .15s}.nav-links a:hover{color:var(--text);background:var(--bg-card);text-decoration:none}.btn{border-radius:var(--radius);cursor:pointer;border:none;justify-content:center;align-items:center;padding:10px 20px;font-size:14px;font-weight:600;text-decoration:none;transition:background .15s,transform .1s;display:inline-flex}.btn:hover{text-decoration:none;transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);color:#fff}.btn-secondary{background:var(--bg-card);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background:var(--bg-input)}.btn-danger{background:var(--red);color:#fff}.btn-sm{padding:6px 12px;font-size:13px}.btn-lg{padding:14px 32px;font-size:16px}.btn-group{gap:2px;display:inline-flex}.btn-group .btn-toggle{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);color:var(--text-dim);cursor:pointer;padding:4px 10px;font-size:12px;transition:background .15s,color .15s,border-color .15s}.btn-group .btn-toggle:hover{color:var(--text);border-color:var(--accent)}.btn-group .btn-toggle.active{background:var(--accent);color:#fff;border-color:var(--accent)}.form-group{margin-bottom:16px}.form-group label{color:var(--text-dim);margin-bottom:6px;font-size:13px;display:block}.form-group input,.form-group textarea{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text);outline:none;padding:10px 14px;font-size:14px;transition:border-color .15s}.form-group input:focus,.form-group textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.form-error{color:var(--red);margin-top:8px;font-size:13px}.field-hint{margin-top:4px;font-size:12px;display:block}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:20px}.track-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;padding:24px;display:grid}.track-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;flex-direction:column;padding:0;transition:border-color .15s,transform .15s;display:flex;overflow:hidden}.track-card-preview{object-fit:cover;background:#1a1a2e;width:100%;height:160px;display:block}.track-card-no-preview{color:var(--text-muted);justify-content:center;align-items:center;font-size:13px;display:flex}.track-card-title,.track-card-meta,.track-card-desc,.track-card-stats{padding-left:16px;padding-right:16px}.track-card:hover{border-color:var(--accent);transform:translateY(-2px)}.track-card-title{margin-bottom:6px;padding-top:12px;font-size:16px;font-weight:600}.track-card-meta{color:var(--text-dim);gap:12px;margin-bottom:8px;font-size:13px;display:flex}.track-card-desc{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;margin-bottom:12px;font-size:13px;overflow:hidden}.track-card-stats{color:var(--text-dim);gap:16px;padding-bottom:14px;font-size:13px;display:flex}.stat-plays{color:var(--accent)}.stat-votes{color:var(--yellow)}.track-badges{flex-wrap:wrap;gap:5px;padding:0 16px 10px;display:flex}.track-badge{letter-spacing:.5px;text-transform:uppercase;border-radius:4px;padding:2px 7px;font-size:10px;font-weight:700;line-height:1.4}.track-badge-ice{color:#7fdbff;background:#1a3a5c;border:1px solid #3a6a9c}.track-badge-offroad{color:#e8a43a;background:#3a2a10;border:1px solid #7a5a20}.track-badge-night{color:#b08aff;background:#1a1040;border:1px solid #4a3080}.track-badge-dirt{color:#c49a6c;background:#3a2a18;border:1px solid #6a4a28}.sort-tabs{gap:4px;padding:16px 24px 0;display:flex}.sort-tab{border-radius:var(--radius)var(--radius)0 0;color:var(--text-dim);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;padding:8px 16px;font-size:14px;transition:color .15s,border-color .15s}.sort-tab:hover{color:var(--text)}.sort-tab.active{color:var(--accent);border-bottom-color:var(--accent)}.pagination{justify-content:center;gap:8px;padding:24px;display:flex}.pagination button{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);cursor:pointer;padding:8px 14px;font-size:14px}.pagination button:hover{border-color:var(--accent)}.pagination button:disabled{opacity:.4;cursor:default}.page-center{max-width:480px;margin:60px auto;padding:0 24px}.page-wide{max-width:1200px;margin:0 auto}.page-title{margin-bottom:24px;font-size:28px;font-weight:700}.hero{text-align:center;padding:80px 24px 60px}.hero h1{background:linear-gradient(135deg,var(--accent),#a78bfa);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:16px;font-size:48px;font-weight:800}.hero p{color:var(--text-dim);max-width:560px;margin-bottom:32px;margin-left:auto;margin-right:auto;font-size:18px}.hero-buttons{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.game-container{background:#0d0d14;flex:1;width:100%;min-height:0;position:relative;overflow:hidden}.game-container canvas{touch-action:none;display:block;width:100%!important;height:100%!important}.game-page{flex-direction:column;height:calc(100vh - 56px);display:flex;overflow:hidden}.leaderboard{border-collapse:collapse;width:100%}.leaderboard th,.leaderboard td{text-align:left;padding:8px 12px;font-size:14px}.leaderboard th{color:var(--text-dim);border-bottom:1px solid var(--border)}.leaderboard td{border-bottom:1px solid var(--bg-input)}.leaderboard tr:hover td{background:var(--bg-input)}.leaderboard tr.lb-me td{color:#60a5fa;background:#3b82f626;font-weight:600}.vote-buttons{align-items:center;gap:8px;display:flex}.vote-btn{border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;color:var(--text-dim);background:0 0;padding:4px 10px;font-size:18px;transition:color .15s,border-color .15s}.vote-btn:hover{border-color:var(--accent);color:var(--text)}.vote-btn.active-up{color:var(--green);border-color:var(--green)}.vote-btn.active-down{color:var(--red);border-color:var(--red)}.vote-score{text-align:center;min-width:24px;font-size:16px;font-weight:600}.track-detail{max-width:800px;margin:0 auto;padding-bottom:48px}.track-detail-preview{background:var(--bg-darker);width:100%;max-height:340px;overflow:hidden}.track-detail-preview img{object-fit:cover;width:100%;height:340px;display:block}.track-detail-no-preview{height:200px;color:var(--text-muted);justify-content:center;align-items:center;font-size:14px;display:flex}.track-detail-content{padding:0 24px}.track-detail-header{padding:24px 0 16px}.track-detail-title{margin-bottom:4px;font-size:28px;font-weight:700}.track-detail-meta{color:var(--text-dim);font-size:14px}.track-detail-stats{border-bottom:1px solid var(--border);align-items:center;gap:24px;margin-bottom:20px;padding:12px 0 20px;display:flex}.track-detail-desc{margin-bottom:20px}.track-detail-desc p{color:var(--text-dim);font-size:14px;line-height:1.6}.track-detail-leaderboard{margin-bottom:24px}.track-detail-actions{gap:12px;padding-top:8px;display:flex}.challenge-landing{text-align:center;max-width:400px;margin:0 auto}.challenge-info{flex-direction:column;gap:12px;padding:16px 0;display:flex}.challenge-info>div{flex-direction:column;gap:2px;display:flex}.challenge-comparison{flex-direction:column;gap:8px;margin:16px 0 0;display:flex}.challenge-comparison-row{justify-content:space-between;align-items:center;display:flex}.daily-featured{padding:0 24px}.daily-featured-content{grid-template-columns:1fr 1fr;gap:16px;display:grid}@media (max-width:640px){.daily-featured-content{grid-template-columns:1fr}}.comment{border-bottom:1px solid var(--border);padding:12px 0}.comment:last-child{border-bottom:none}.comment-header{align-items:center;margin-bottom:4px;font-size:14px;display:flex}.comment-body{color:var(--text-dim);white-space:pre-wrap;word-break:break-word;font-size:14px;line-height:1.5}.overlay{z-index:200;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.overlay-panel{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;width:100%;max-width:420px;padding:32px}.overlay-panel h2{margin-bottom:20px}.profile-header{border-bottom:1px solid var(--border);padding:32px 24px}.profile-header h1{font-size:24px}.profile-stats{color:var(--text-dim);gap:24px;margin-top:8px;font-size:14px;display:flex}.profile-stats-grid{grid-template-columns:repeat(4,1fr);gap:12px;padding:24px;display:grid}@media (max-width:640px){.profile-stats-grid{grid-template-columns:repeat(2,1fr)}}.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);text-align:center;padding:20px}.stat-value{color:var(--accent);margin-bottom:4px;font-size:28px;font-weight:700}.stat-label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;font-size:13px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse-rec{0%,to{opacity:1}50%{opacity:.3}}.spinner{border:2px solid var(--border);border-top-color:var(--accent);vertical-align:middle;border-radius:50%;width:20px;height:20px;animation:.6s linear infinite spin;display:inline-block}.spinner-lg{border-width:3px;width:32px;height:32px}.loading-state{flex-direction:column;align-items:center;gap:12px;padding:32px;display:flex}@keyframes confetti-fall{0%{opacity:1;transform:translateY(0)rotate(0)}to{opacity:0;transform:translateY(400px)rotate(720deg)}}.confetti-particle{pointer-events:none;z-index:9999;border-radius:2px;width:8px;height:8px;animation:2.5s ease-in forwards confetti-fall;position:fixed}.hidden{display:none!important}.mt-8{margin-top:8px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}.text-center{text-align:center}.text-dim{color:var(--text-dim)}.text-sm{font-size:13px}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.mobile-controls-touch{z-index:50;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px);display:none;position:absolute;inset:0}@media (pointer:coarse){.mobile-controls-touch{display:block}}.zone-label{pointer-events:none;border:1px solid #ffffff0f;justify-content:center;align-items:center;transition:background 80ms,border-color 80ms;display:flex;position:absolute}.zone-label-text{letter-spacing:1px;text-transform:uppercase;color:#ffffff26;font-size:16px;font-weight:700;transition:color 80ms}.zone-active .zone-label-text{color:#53a8ff99}.zone-active{background:#53a8ff1a;border-color:#53a8ff40}.zone-active-green{background:#4ade801a;border-color:#4ade8040}.zone-active-green .zone-label-text{color:#4ade8099}.zone-active-drift{background:#ffa5001f;border-color:#ffa5004d}.zone-active-drift .zone-label-text{color:#ffa500b3}.zone-label-steer{width:50%;height:100%;top:0;left:0}.zone-label-drift{border-bottom:1px solid #ffffff14;width:50%;height:50%;top:0;right:0}.zone-label-brake{width:50%;height:50%;bottom:0;right:0}.zone-active-brake{background:#f871711f;border-color:#f871714d}.zone-active-brake .zone-label-text{color:#f87171b3}.joystick-base{pointer-events:none;background:#ffffff0a;border:2px solid #ffffff26;border-radius:50%;width:140px;height:140px;position:absolute;transform:translate(-50%,-50%)}.joystick-thumb{pointer-events:none;background:#53a8ff80;border:2px solid #53a8ffb3;border-radius:50%;width:52px;height:52px;position:absolute;transform:translate(-50%,-50%)}.touch-zone-action{background:#53a8ff26;border:1px solid #53a8ff66;border-radius:36px;justify-content:center;align-items:center;padding:14px 32px;display:flex;position:absolute;bottom:32px;left:50%;transform:translate(-50%)}.touch-zone-label{letter-spacing:.5px;text-transform:uppercase;color:#fffc;font-size:15px;font-weight:700}.mobile-not-supported{z-index:300;background:#0d0d1af2;justify-content:center;align-items:center;display:none;position:fixed;inset:0}@media (pointer:coarse){.mobile-not-supported{display:flex}}.mobile-not-supported-content{text-align:center;color:var(--text);max-width:360px;padding:32px}.mobile-not-supported-content h2{margin-bottom:12px;font-size:22px;font-weight:700}.mobile-not-supported-content p{color:var(--text-dim);font-size:15px;line-height:1.5}.landscape-prompt{z-index:300;background:#000000eb;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.landscape-prompt-content{text-align:center;color:var(--text)}.landscape-prompt-icon{margin-bottom:16px;font-size:64px;animation:2s ease-in-out infinite rotate-hint}@keyframes rotate-hint{0%,to{transform:rotate(0)}50%{transform:rotate(90deg)}}.landscape-prompt-content p{color:var(--text-dim);font-size:18px}@media (pointer:coarse) and (orientation:portrait){.landscape-prompt{display:flex}}.show-touch{display:none}@media (pointer:coarse){.hide-touch{display:none}.show-touch{display:inline}}.roulette-page{flex-direction:column;align-items:center;max-width:600px;margin:0 auto;padding:60px 24px;display:flex}.roulette-title{background:linear-gradient(135deg,var(--accent),#a78bfa);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:8px;font-size:36px;font-weight:800}.roulette-subtitle{color:var(--text-dim);margin-bottom:32px;font-size:15px}.roulette-streak{color:var(--yellow);background:#fbbf2426;border:1px solid #fbbf2466;border-radius:20px;margin-bottom:24px;padding:6px 16px;font-size:14px;font-weight:700}.roulette-reels{gap:16px;width:100%;margin-bottom:32px;display:flex}.roulette-reel{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius);text-align:center;flex:1;padding:20px 12px;transition:border-color .3s,box-shadow .3s;overflow:hidden}.reel-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:12px;font-size:11px;font-weight:700}.reel-value{color:var(--text);min-height:28px;font-size:18px;font-weight:700;transition:filter .15s}.reel-spinning .reel-value{color:var(--text-dim);animation:.15s ease-in-out infinite alternate reel-blur}.reel-stopped{border-color:var(--accent);box-shadow:0 0 16px var(--accent-glow);animation:.3s ease-out reel-land}.reel-stopped .reel-value{color:var(--accent)}@keyframes reel-blur{0%{filter:blur();transform:translateY(-2px)}to{filter:blur(2px);transform:translateY(2px)}}@keyframes reel-land{0%{transform:scale(1.08)}50%{transform:scale(.97)}to{transform:scale(1)}}.roulette-spin-btn{background:var(--accent);color:#fff;letter-spacing:2px;cursor:pointer;border:none;border-radius:12px;padding:18px 64px;font-size:22px;font-weight:800;transition:background .15s,transform .1s}.roulette-spin-btn:hover{background:var(--accent-hover);transform:translateY(-2px)}.roulette-spin-btn:active{transform:translateY(0)}.roulette-spinning-hint{color:var(--text-dim);font-size:15px;font-weight:600}.roulette-preview{width:100%;animation:.4s ease-out roulette-reveal}.roulette-preview-info{justify-content:center;gap:16px;margin-bottom:16px;display:flex}.roulette-race-btn{text-align:center;background:var(--green);color:#000;letter-spacing:2px;cursor:pointer;border:none;border-radius:12px;width:100%;padding:18px;font-size:22px;font-weight:800;text-decoration:none;transition:transform .1s;animation:1.5s ease-in-out infinite roulette-pulse;display:block}.roulette-race-btn:hover{color:#000;text-decoration:none;transform:translateY(-2px)}@keyframes roulette-reveal{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes roulette-pulse{0%,to{box-shadow:0 0 #4ade8066}50%{box-shadow:0 0 20px 4px #4ade8033}}.locale-switcher{background:var(--bg-card);color:var(--text-dim);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' fill='%2394a3b8'%3E%3Cpath d='M0 0l4 5 4-5z'/%3E%3C/svg%3E");background-position:right 6px center;background-repeat:no-repeat;outline:none;padding:4px 20px 4px 8px;font-size:12px;font-weight:600;transition:border-color .15s,color .15s}.locale-switcher:hover{border-color:var(--accent);color:var(--text)}.locale-switcher:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.locale-switcher option{background:var(--bg-darker);color:var(--text)}@media (max-width:640px){.site-header{height:44px;padding:0 12px}.site-logo{font-size:16px}.nav-links{gap:4px}.nav-links a{padding:4px 8px;font-size:12px}.game-page{height:calc(100vh - 44px)}.game-page>div:first-child{padding:4px 12px;font-size:12px}.game-page .btn-sm{padding:4px 8px;font-size:11px}}@media (pointer:coarse) and (orientation:landscape){.site-header{display:none}.game-page{height:100dvh}.game-page>div:first-child{display:none}}.unlock-progress{background:var(--bg-darker);border-radius:2px;width:100%;height:4px;margin-top:4px;overflow:hidden}.unlock-progress-fill{background:var(--accent);border-radius:2px;height:100%;transition:width .4s ease-out}.new-badge{letter-spacing:.5px;text-transform:uppercase;background:var(--yellow);color:#000;border-radius:3px;padding:1px 5px;font-size:9px;font-weight:800;line-height:1.4}@keyframes unlock-flash{0%{box-shadow:0 0 #fbbf24b3}50%{box-shadow:0 0 16px 4px #fbbf2466}to{box-shadow:0 0 #fbbf2400}}.unlock-flash{animation:1s ease-out unlock-flash}