@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Inter:wght@400;600;700&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,Arial,sans-serif;background:#0a0a1a;color:#fff;min-height:100vh;overflow:hidden}#root{width:100vw;height:100vh;display:flex;align-items:center;justify-content:center}.screen{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;position:relative;overflow-y:auto}.splash-screen{background:radial-gradient(ellipse at center,#1a1a3e,#0a0a1a 70%)}.splash-content{display:flex;flex-direction:column;align-items:center;gap:32px;text-align:center;max-width:600px}.splash-logo{display:flex;flex-direction:column;align-items:center}.logo-geo{font-family:Orbitron,monospace;font-size:80px;font-weight:900;color:#0f8;text-shadow:0 0 30px rgba(0,255,136,.6),0 0 60px rgba(0,255,136,.3);letter-spacing:8px;line-height:1}.logo-racer{font-family:Orbitron,monospace;font-size:80px;font-weight:900;color:#f9ca24;text-shadow:0 0 30px rgba(249,202,36,.6),0 0 60px rgba(249,202,36,.3);letter-spacing:8px;line-height:1}.logo-sub{font-size:16px;color:#b2bec3;margin-top:8px;letter-spacing:1px}.splash-cars{font-size:40px;letter-spacing:12px;animation:slide-in .5s ease-out}.splash-buttons{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}.splash-footer{font-size:14px;color:#74b9ff;text-align:center;line-height:1.6}.host-screen,.join-screen{background:linear-gradient(135deg,#0a0a1a,#1a0a2e);gap:20px;justify-content:flex-start;padding-top:60px}h1{font-family:Orbitron,monospace;font-size:36px;color:#f9ca24;text-shadow:0 0 20px rgba(249,202,36,.4)}.code-section{text-align:center}.code-label{font-size:14px;color:#b2bec3;margin-bottom:8px}.code-display{font-family:Orbitron,monospace;font-size:72px;font-weight:900;color:#0f8;letter-spacing:20px;text-shadow:0 0 40px rgba(0,255,136,.7);background:#00ff8814;border:3px solid rgba(0,255,136,.4);border-radius:16px;padding:16px 40px;min-width:320px;text-align:center}.lobby-section{width:100%;max-width:500px}.lobby-header{font-size:14px;color:#b2bec3;margin-bottom:8px;text-align:center}.player-list{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow-y:auto;background:#ffffff0a;border-radius:12px;padding:10px}.player-item{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#ffffff0f;border-radius:8px;border:1px solid rgba(255,255,255,.1);font-size:14px}.player-host{border-color:#f9ca2466;background:#f9ca2414}.player-name{flex:1;font-weight:600}.player-tier{font-size:12px;color:#74b9ff}.host-badge{background:#f9ca24;color:#000;font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px}.waiting-hint{color:#636e72;font-size:13px;text-align:center;padding:10px}.host-tip{font-size:12px;color:#636e72;text-align:center;max-width:400px}.join-form{width:100%;max-width:380px;display:flex;flex-direction:column;gap:16px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:13px;color:#b2bec3;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.input-field{background:#ffffff14;border:2px solid rgba(255,255,255,.15);border-radius:10px;padding:14px 16px;font-size:18px;color:#fff;outline:none;transition:border-color .2s;font-family:inherit}.input-field:focus{border-color:#0f8;box-shadow:0 0 0 3px #00ff8826}.input-code{font-family:Orbitron,monospace;font-size:32px;letter-spacing:10px;text-align:center}.error-message{background:#e74c3c26;border:1px solid rgba(231,76,60,.4);border-radius:8px;padding:10px 14px;font-size:13px;color:#e17055}.waiting-room{display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center;width:100%;max-width:500px}.waiting-message{font-size:16px;color:#b2bec3;display:flex;flex-direction:column;align-items:center;gap:8px}.spinner{font-size:32px;animation:spin 2s linear infinite}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;border:none;border-radius:10px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s ease;text-transform:uppercase;letter-spacing:.5px}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,#0f8,#00b894);color:#000;box-shadow:0 4px 20px #00ff8859}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 28px #00ff8880}.btn-secondary{background:#ffffff1a;color:#fff;border:2px solid rgba(255,255,255,.2)}.btn-secondary:hover:not(:disabled){background:#ffffff2e;border-color:#ffffff59}.btn-large{padding:16px 36px;font-size:18px;border-radius:14px;min-width:200px}.btn-back{position:absolute;top:16px;left:16px;background:#ffffff14;color:#b2bec3;border:1px solid rgba(255,255,255,.12);padding:8px 14px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}.btn-back:hover{background:#ffffff24;color:#fff}.game-container{position:relative;width:100%;height:100vh;display:flex;align-items:center;justify-content:center;background:#000;overflow:hidden}.game-canvas{display:block;max-width:100%;max-height:100vh;image-rendering:crisp-edges}.leaderboard{position:absolute;top:10px;right:10px;width:160px;background:#000000bf;border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:8px;font-size:11px;backdrop-filter:blur(4px);z-index:10}.leaderboard-title{font-family:Orbitron,monospace;font-size:10px;color:#f9ca24;text-align:center;margin-bottom:6px;letter-spacing:1px}.lb-row{display:flex;align-items:center;gap:4px;padding:4px 2px;border-bottom:1px solid rgba(255,255,255,.06)}.lb-first{background:#f9ca241f;border-radius:4px}.lb-pos{width:18px;color:#f9ca24;font-weight:700;font-size:11px}.lb-name{flex:1;color:#fff;font-size:11px}.lb-info{display:flex;flex-direction:column;align-items:flex-end;gap:1px}.lb-lap{font-size:10px;color:#0f8}.lb-tier{font-size:9px;color:#74b9ff}.lb-boost{font-size:10px}.lb-empty{color:#636e72;font-size:11px;text-align:center;padding:6px}.overlay{position:absolute;inset:0;background:#000000d1;display:flex;align-items:center;justify-content:center;z-index:100;backdrop-filter:blur(3px)}.question-card{background:linear-gradient(145deg,#1a1a3e,#0d0d2e);border:2px solid rgba(249,202,36,.35);border-radius:20px;padding:28px 32px;max-width:540px;width:100%;box-shadow:0 20px 60px #000000b3,0 0 40px #f9ca241a}.qb-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.qb-lap{font-family:Orbitron,monospace;font-size:13px;color:#f9ca24;font-weight:700}.qb-category{font-size:10px;background:#74b9ff33;color:#74b9ff;padding:3px 8px;border-radius:4px;letter-spacing:.5px}.timer-bar-bg{height:6px;background:#ffffff1a;border-radius:3px;overflow:hidden;margin-bottom:4px}.timer-bar-fill{height:100%;border-radius:3px;transition:width .1s linear}.timer-text{font-size:11px;color:#b2bec3;text-align:right;margin-bottom:16px}.question-text{font-size:18px;font-weight:600;line-height:1.4;color:#fff;margin-bottom:20px;min-height:52px}.options-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.option-btn{display:flex;align-items:center;gap:10px;padding:12px 14px;background:#ffffff12;border:2px solid rgba(255,255,255,.12);border-radius:10px;color:#fff;font-size:14px;font-weight:500;cursor:pointer;text-align:left;transition:all .12s;font-family:inherit}.option-btn:hover:not(:disabled){background:#ffffff24;border-color:#f9ca2480;transform:translateY(-1px)}.option-btn.correct{background:#00b89440;border-color:#00b894;color:#0f8}.option-btn.wrong{background:#e74c3c33;border-color:#e74c3c;color:#ff7675}.option-letter{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:#ffffff1f;border-radius:50%;font-size:11px;font-weight:700;flex-shrink:0}.result-banner{padding:10px 14px;border-radius:8px;font-size:15px;font-weight:700;text-align:center;margin-bottom:10px}.result-banner.correct{background:#00b89433;border:1px solid #00b894;color:#0f8}.result-banner.wrong{background:#e74c3c33;border:1px solid #e74c3c;color:#ff7675}.qb-progress{display:flex;gap:6px;justify-content:center;margin-bottom:8px}.progress-dot{width:10px;height:10px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.2);display:inline-block}.progress-dot.dot-correct{background:#00b894;border-color:#00b894}.progress-dot.dot-wrong{background:#e74c3c;border-color:#e74c3c}.progress-dot.dot-current{border-color:#f9ca24;background:#f9ca244d}.boost-preview{font-size:12px;color:#b2bec3;text-align:center}.boost-preview strong{color:#f9ca24}.pit-overlay{background:#000000e0}.pit-card{border-color:#0f86;box-shadow:0 20px 60px #000000b3,0 0 50px #00ff8826}.pit-header{display:flex;align-items:center;gap:14px;margin-bottom:16px}.pit-icon{font-size:36px}.pit-title{font-family:Orbitron,monospace;font-size:22px;color:#0f8;font-weight:900}.pit-subtitle{font-size:12px;color:#b2bec3;margin-top:2px}.pit-stakes{font-size:12px;color:#b2bec3;text-align:center;padding:8px;background:#ffffff0a;border-radius:6px}.results-screen{background:radial-gradient(ellipse at center,#1a1a3e,#0a0a1a 70%);gap:24px}.results-table{width:100%;max-width:600px;background:#ffffff0a;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}.results-header{display:grid;grid-template-columns:60px 1fr 160px 60px;padding:10px 16px;background:#f9ca241a;font-size:11px;font-weight:700;color:#f9ca24;letter-spacing:.8px;text-transform:uppercase;gap:8px}.results-row{display:grid;grid-template-columns:60px 1fr 160px 60px;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.06);align-items:center;font-size:14px;gap:8px}.medal-1{background:#ffd7001a}.medal-2{background:#c0c0c014}.medal-3{background:#cd7f3214}.res-pos{font-size:20px}.res-name{font-weight:600}.res-vehicle{font-size:12px;font-weight:600}.res-laps{text-align:center;color:#74b9ff;font-weight:700}.results-actions{display:flex;gap:16px}.results-footer{font-size:13px;color:#636e72;text-align:center}.results-empty{padding:20px;text-align:center;color:#636e72}.boost-explainer{width:100%;max-width:600px;background:#ffffff0a;border:1px solid rgba(100,200,100,.2);border-radius:16px;padding:20px 24px}.boost-explainer h3{margin:0 0 14px;font-size:15px;color:#55efc4}.boost-rows{display:flex;flex-direction:column;gap:10px}.boost-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;gap:12px}.boost-effect{font-weight:700;color:#74b9ff;white-space:nowrap}.boost-effect.upgrade{color:#55efc4}.boost-effect.penalty{color:#e17055}.boost-note{margin:14px 0 0;font-size:12px;color:#b2bec3;text-align:center}.track-picker{width:100%;max-width:600px;display:flex;flex-direction:column;align-items:center;gap:16px}.track-picker h3{margin:0;font-size:16px;color:#f9ca24}.track-options{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.track-option-btn{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 20px;background:#ffffff0d;border:2px solid rgba(255,255,255,.12);border-radius:14px;cursor:pointer;color:#dfe6e9;transition:all .15s ease;min-width:150px;font-family:inherit}.track-option-btn:hover{background:#ffffff17;border-color:#ffffff40;transform:translateY(-2px)}.track-option-btn.selected{background:#f9ca241f;border-color:#f9ca24;color:#f9ca24}.track-emoji{font-size:28px}.track-name{font-size:13px;font-weight:700}.track-desc{font-size:11px;color:#b2bec3;text-align:center}.track-option-btn.selected .track-desc{color:#fdcb6e}.waiting-next-race{display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px;background:#ffffff0a;border-radius:16px;width:100%;max-width:400px}.waiting-next-race p{margin:0;font-size:15px;color:#dfe6e9;text-align:center}.waiting-next-race .waiting-sub{font-size:12px;color:#74b9ff}.waiting-spinner{font-size:32px;animation:spin 2s linear infinite}.results-footer-actions{display:flex;gap:12px;justify-content:center;padding-top:8px}.btn-small{font-size:13px;padding:10px 20px}.error-screen{background:#0a0a1a}.error-card{display:flex;flex-direction:column;align-items:center;gap:16px;background:#e74c3c1a;border:2px solid rgba(231,76,60,.3);border-radius:20px;padding:40px;max-width:440px;text-align:center}.error-icon{font-size:48px}.error-card h2{font-size:24px;color:#e74c3c}.error-card .error-message{font-size:14px;color:#b2bec3;line-height:1.5}.loading-screen{background:#0a0a1a;color:#b2bec3;font-size:16px}@keyframes slide-in{0%{transform:translate(-30px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 20px #00ff884d}50%{box-shadow:0 0 40px #00ff88b3}}@media(max-width:1300px){.logo-geo,.logo-racer{font-size:60px}.code-display{font-size:56px;letter-spacing:14px}}@media(max-height:820px){.host-screen,.join-screen{padding-top:40px;gap:14px}h1{font-size:28px}.lobby-section .player-list{max-height:180px}}