.welcome-container{min-height:100vh;background:linear-gradient(135deg,#f0f2f5,#e8ecef);display:flex;align-items:center;justify-content:center;padding:20px;color:#2c3e50;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;position:relative}.welcome-content{max-width:400px;width:100%;text-align:center}.logo-section{margin-bottom:40px}.welcome-title{font-size:3rem;font-weight:900;background:linear-gradient(45deg,#e74c3c,#3498db,#9b59b6);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradient 3s ease infinite;margin-bottom:10px;line-height:1.1}.welcome-subtitle{font-size:1rem;color:#7f8c8d;margin-bottom:0;font-weight:400}.team-selection{margin-bottom:40px}.team-selection h2{font-size:1.3rem;margin-bottom:20px;color:#2c3e50;font-weight:600}.dropdown-container{position:relative;width:100%}.dropdown-button{width:100%;background:#fff;border:2px solid #ddd;border-radius:12px;padding:18px 20px;color:#2c3e50;font-size:1rem;cursor:pointer;transition:all .3s ease;display:flex;justify-content:space-between;align-items:center;min-height:60px;-webkit-tap-highlight-color:transparent;box-shadow:0 2px 8px #0000001a}.dropdown-button:active{transform:scale(.98)}.dropdown-button.selected{border-color:var(--team-color);background:#f8f9fa;box-shadow:0 4px 12px #00000026}.dropdown-text{flex:1;text-align:left;font-weight:500;color:#2c3e50}.dropdown-arrow{transition:transform .3s ease;font-size:.8rem;margin-left:10px;color:#7f8c8d}.dropdown-arrow.open{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:100%;left:0;right:0;background:#fff;border:2px solid #ddd;border-radius:12px;margin-top:5px;z-index:1000;overflow:hidden;box-shadow:0 10px 30px #00000026;animation:slideDown .2s ease-out;max-height:300px;overflow-y:auto}.dropdown-menu::-webkit-scrollbar{width:6px}.dropdown-menu::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.dropdown-menu::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:10px}.dropdown-menu::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.dropdown-item{width:100%;background:none;border:none;padding:15px 20px;color:#2c3e50;font-size:.95rem;cursor:pointer;transition:all .2s ease;border-bottom:1px solid #ecf0f1;display:flex;align-items:center;text-align:left;-webkit-tap-highlight-color:transparent}.dropdown-item:last-child{border-bottom:none}.dropdown-item:hover,.dropdown-item:active{background:#f8f9fa}.team-indicator{width:12px;height:12px;border-radius:50%;margin-right:12px;flex-shrink:0;border:1px solid rgba(0,0,0,.1)}.start-button{width:100%;background:linear-gradient(45deg,#e74c3c,#3498db);border:none;border-radius:15px;padding:18px 20px;font-size:1.1rem;font-weight:700;color:#fff;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px;min-height:60px;-webkit-tap-highlight-color:transparent;box-shadow:0 4px 15px #0003}.start-button.enabled:active{transform:scale(.98)}.start-button.enabled:hover{box-shadow:0 6px 20px #00000040}.start-button.disabled{background:#bdc3c7;cursor:not-allowed;opacity:.6;box-shadow:none}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 480px){.welcome-container{padding:15px}.welcome-title{font-size:2.5rem}.welcome-subtitle{font-size:.9rem}.dropdown-button,.start-button{padding:20px;font-size:1rem;min-height:56px}.dropdown-item{padding:18px 20px;font-size:.9rem}.dropdown-menu{max-height:250px}}@media (max-height: 600px) and (orientation: landscape){.welcome-title{font-size:2rem;margin-bottom:5px}.logo-section,.team-selection{margin-bottom:20px}.team-selection h2{margin-bottom:15px}.dropdown-menu{max-height:200px}}@supports not (-webkit-appearance: none){.dropdown-menu{scrollbar-width:thin;scrollbar-color:#c1c1c1 #f1f1f1}}.top-scores{margin-top:32px;background:#f8f8f8;border-radius:16px;padding:18px 10px;box-shadow:0 2px 12px #0001}.top-scores h3{margin-top:0;margin-bottom:14px;text-align:center;font-size:1.2rem;color:#222;letter-spacing:1px}.top-scores ol{list-style:none;padding:0;margin:0}.top-scores li{display:flex;align-items:center;justify-content:space-between;gap:8px;border:2.5px solid #ddd;border-radius:12px;padding:8px 14px;margin-bottom:10px;background:#fff;color:#222;font-size:1rem;transition:border-color .2s}.top-scores li:nth-child(1){border-color:gold;font-weight:700;box-shadow:0 2px 8px #ffd70033}.top-scores li:nth-child(2){border-color:silver;font-weight:700;box-shadow:0 2px 8px #c0c0c033}.top-scores li:nth-child(3){border-color:#cd7f32;font-weight:700;box-shadow:0 2px 8px #cd7f3233}.top-scores img{height:38px;width:38px;object-fit:contain;margin-left:8px}html,body{margin:0;padding:0;box-sizing:border-box;background:none}.game-bg{min-height:100vh;background:linear-gradient(180deg,#e8ecef,#bfc3c7);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:relative;overflow:hidden}.score{position:absolute;top:18px;left:0;right:0;text-align:center;font-size:2rem;font-weight:700;color:#e74c3c;z-index:10;text-shadow:0 2px 8px #fff,0 0px 2px #e74c3c;letter-spacing:2px}.game-canvas{position:relative;width:300px;height:500px;margin-top:60px;background:transparent;border-radius:18px;box-shadow:0 8px 32px #2c3e502e;overflow:hidden}.road{position:absolute;top:0;width:300px;height:100%;background:#666;border-radius:12px;z-index:1;overflow:hidden}.piano{position:absolute;top:0;width:18px;height:100%;z-index:2;background:repeating-linear-gradient(to bottom,#fff 0,#fff 15px,#e74c3c 15px,#e74c3c 30px)}.piano-left{left:-18px;border-radius:12px 0 0 12px}.piano-right{right:-18px;border-radius:0 12px 12px 0}.road-line{position:absolute;left:50%;width:12px;height:36px;background:#fff;border-radius:8px;transform:translate(-50%);opacity:.7;z-index:3}.car{position:absolute;width:40px;height:60px;background:#3498db;border-radius:8px 8px 12px 12px;bottom:40px;z-index:10;border:3px solid #fff;box-shadow:0 4px 12px #3498db33}.obstacle{position:absolute;width:40px;height:40px;background:#e74c3c;border-radius:8px;border:2px solid #fff;z-index:9;box-shadow:0 2px 8px #e74c3c26}.game-over{position:absolute;top:40%;left:0;right:0;text-align:center;background:#fffffff2;color:#e74c3c;font-size:2rem;font-weight:700;border-radius:16px;padding:30px 10px 20px;z-index:100;box-shadow:0 4px 24px #2c3e502e;display:flex;flex-direction:column;gap:16px}.game-over button{background:#3498db;color:#fff;border:none;border-radius:8px;padding:10px 24px;font-size:1rem;font-weight:600;margin-top:10px;cursor:pointer;transition:background .2s}.game-over .back-btn{background:#7f8c8d}.controls{width:100%;display:flex;justify-content:center;gap:5px;position:fixed;bottom:32px;left:0;z-index:20}.arrow-btn{width:130px;height:100px;background:#fff;color:#3498db;border:2px solid #3498db;border-radius:10px;font-size:2.5rem;font-weight:700;box-shadow:0 2px 8px #2c3e501f;display:flex;align-items:center;justify-content:center;transition:background .2s,color .2s;-webkit-user-select:none;user-select:none}.arrow-btn:active{background:#3498db;color:#fff}.arrow-btn:disabled{opacity:.4;cursor:not-allowed}@media (max-width: 400px){.game-canvas{min-width:220px;max-width:100vw}.controls{gap:18vw}.arrow-btn{width:56px;height:56px;font-size:2rem}}.piano{position:absolute;top:0;width:20px;height:100%;z-index:1;background:repeating-linear-gradient(#fff 0,#fff 30px,#e74c3c 30px,#e74c3c 70px),#27ae60}.piano-left{margin-left:35px;border-radius:12px 0 0 12px}.piano-right{margin-right:30px;border-radius:0 12px 12px 0}.grass{position:absolute;top:0;width:60px;height:100%;background:#27ae60;z-index:0}.grass-left{margin-left:-35px;border-radius:12px 0 0 12px}.grass-right{right:-35px;border-radius:0 12px 12px 0}.arrow-btn{-webkit-tap-highlight-color:transparent;touch-action:manipulation}.car{position:absolute;width:40px;height:60px;--car-color: #3498db;background:none;z-index:10;border:none;box-shadow:none;display:block}.f1-wheel{position:absolute;width:7px;height:12px;background:#222;border-radius:1px;z-index:5;box-shadow:0 0 0 2px #111}.f1-wheel-fl{left:2px;top:8px}.f1-wheel-fr{right:2px;top:8px}.f1-wheel-rl{left:2px;top:38px}.f1-wheel-rr{right:2px;top:38px}.f1-rearaxle{position:absolute;left:6px;top:44px;width:28px;height:4px;background:#111;border-radius:2px;z-index:4}.f1-body{position:absolute;left:12px;top:8px;width:16px;height:44px;background:var(--car-color);border-radius:10px 10px 12px 12px/16px 16px 12px 12px;z-index:3;box-shadow:0 2px 6px #0002}.f1-cockpit{position:absolute;left:16px;top:22px;width:8px;height:14px;background:#111;border-radius:6px 6px 8px 8px;z-index:4}.f1-nose{position:absolute;left:17px;top:-5px;width:6px;height:18px;background:var(--car-color);border-radius:4px 4px 8px 8px;z-index:3;box-shadow:0 2px #fff8}.f1-frontwing{position:absolute;left:0;top:-7px;width:40px;height:10px;background:#222;clip-path:polygon(0% 100%,22% 110%,50% 55%,78% 110%,100% 100%,50% 0%);box-shadow:0 0 0 1px #fff inset;z-index:0}.f1-rearwing{position:absolute;left:6px;top:50px;width:28px;height:7px;background:#222;border-radius:4px;z-index:4;box-shadow:0 0 0 2px #fff inset}.f1-line{position:absolute;left:19px;width:2px;background:#fff;border-radius:1px;z-index:6}.f1-line1{top:10px;height:0px}.f1-line2{top:30px;height:18px}