:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#0a0a0f;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;width:100%;height:100vh;background:#0a0a0f}#root{width:100%;height:100vh;margin:0;padding:0}.app-container{display:flex;height:100vh;width:100%;background:#0a0a0f;overflow:hidden}.carplay-section{width:80%;height:100%;display:flex;align-items:center;justify-content:center;background:#0a0a0f;border-right:2px solid rgba(0,212,255,.3);position:relative}.controls-section{width:20%;height:100%;background:#0a0a0f;display:flex;align-items:stretch;overflow:hidden;position:relative}.start-screen{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#0a0a0f}.start-text{font-size:28px;font-weight:300;color:#fff9;letter-spacing:2px;text-align:center}.car-model-container{width:100%;height:100%;border-radius:20px;overflow:hidden;position:relative}.carplay-display{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:#0a0a0f;border-radius:8px;overflow:hidden;opacity:0;animation:fadeIn .8s ease-in forwards}.carplay-display.fade-in{opacity:1}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.loading-screen-full{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#0a0a0f;animation:fadeIn .5s ease-in}.loading-content{display:flex;flex-direction:column;align-items:center;gap:30px}.loading-title{font-size:32px;font-weight:300;color:#fffc;letter-spacing:3px}.spinner{width:50px;height:50px;border:3px solid rgba(255,255,255,.1);border-top:3px solid rgba(255,255,255,.6);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.carplay-content{width:100%;height:100%;display:flex;flex-direction:column;padding:30px;color:#fff;position:relative}.dashboard-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:20px;flex:1;width:964px;height:480px;min-width:964px;max-width:964px;min-height:480px;max-height:480px}.tile{border-radius:20px;transition:all .4s cubic-bezier(.4,0,.2,1);cursor:pointer;box-shadow:0 4px 12px #00000026;overflow:hidden}.tile:hover{transform:scale(1.02);box-shadow:0 8px 24px #00000040}.tile-large{grid-column:span 2;grid-row:span 1;width:636px;height:230px;min-width:636px;max-width:636px;min-height:230px;max-height:230px}.tile-medium{grid-row:span 1;width:308px;height:230px;min-width:308px;max-width:308px;min-height:230px;max-height:230px}.tab-dots{display:flex;justify-content:center;align-items:center;gap:12px;padding:20px 0;position:absolute;bottom:10px;left:50%;transform:translate(-50%)}.dot{width:8px;height:8px;border-radius:50%;background:#ffffff4d;transition:all .3s ease;cursor:pointer}.dot:hover{background:#ffffff80}.dot.active{background:#fff;width:24px;border-radius:4px}.vehicle-controls{background:#0a0a0f;color:#fff;padding:24px;display:flex;flex-direction:column;gap:20px;overflow-y:auto;max-height:100%;width:100%}.controls-title{font-size:14px;font-weight:600;margin-bottom:8px;color:#ffffff80;text-transform:uppercase;letter-spacing:2px}.control-section{display:flex;flex-direction:column;gap:10px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.05)}.control-section:last-child{border-bottom:none}.control-section h3{font-size:11px;color:#fff6;text-transform:uppercase;letter-spacing:1.5px;margin:0 0 8px;font-weight:500}.button-group{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.control-btn{padding:14px 16px;background:#ffffff0d;color:#ffffffb3;border:1px solid rgba(255,255,255,.08);border-radius:12px;cursor:pointer;font-size:13px;font-weight:500;text-transform:capitalize;letter-spacing:.3px;transition:all .4s cubic-bezier(.4,0,.2,1);white-space:nowrap;position:relative;overflow:hidden}.control-btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#8ba89033;transform:translate(-50%,-50%);transition:width .6s ease,height .6s ease}.control-btn:hover:not(:disabled):before{width:300px;height:300px}.control-btn:hover:not(:disabled){background:#ffffff14;border-color:#8ba8904d;color:#ffffffe6;transform:translateY(-1px)}.control-btn:active:not(:disabled){transform:scale(.98);transition:all .1s ease}.control-btn:disabled{opacity:.3;cursor:not-allowed;background:#ffffff05;border-color:#ffffff08}.control-btn.start,.control-btn.stop,.control-btn.accelerate,.control-btn.brake{position:relative}.control-btn.gear,.control-btn.heat,.control-btn.weather{min-width:40px}.control-btn.gear.active,.control-btn.heat.active,.control-btn.weather.active{background:#8ba89033;border-color:#8ba89080;color:#8ba890}.control-btn.lights,.control-btn.wipers,.control-btn.music,.control-btn.lock{grid-column:1 / -1}.control-btn.window{font-size:11px}.control-btn.window.open{background:#ffffff0d;border-color:#ffffff1a;color:#fff9}.control-btn.window.closed,.control-btn.music.playing,.control-btn.locked,.control-btn.closed{background:#8ba89033;border-color:#8ba89080;color:#8ba890}.control-btn.unlocked,.control-btn.open{background:#ffffff0d;border-color:#ffffff1a;color:#fff9}.control-btn.reset{grid-column:1 / -1;background:#ffffff08;border-color:#ffffff14;color:#ffffff80;margin-top:8px}.control-btn.reset:hover:not(:disabled){background:#ff50501a;border-color:#ff50504d;color:#ff7878e6}.volume-slider,.speed-slider,.temp-slider{width:100%;height:3px;border-radius:10px;background:#ffffff14;outline:none;-webkit-appearance:none;appearance:none;margin:12px 0 8px;position:relative;cursor:pointer;transition:all .3s ease}.speed-slider:disabled{opacity:.3;cursor:not-allowed}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:#8ba890;cursor:pointer;box-shadow:0 2px 8px #8ba89066;transition:all .3s cubic-bezier(.4,0,.2,1)}.speed-slider::-webkit-slider-thumb,.temp-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:#8ba890;cursor:pointer;box-shadow:0 2px 8px #8ba89066;transition:all .3s cubic-bezier(.4,0,.2,1)}.volume-slider:hover,.speed-slider:hover:not(:disabled),.temp-slider:hover{background:#ffffff1f}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 4px 12px #8ba89099}.volume-slider::-webkit-slider-thumb:active{transform:scale(1.1)}.volume-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#8ba890;cursor:pointer;box-shadow:0 2px 8px #8ba89066;border:none;transition:all .3s cubic-bezier(.4,0,.2,1)}.speed-slider::-moz-range-thumb,.temp-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#8ba890;cursor:pointer;box-shadow:0 2px 8px #8ba89066;border:none;transition:all .3s cubic-bezier(.4,0,.2,1)}.volume-slider::-moz-range-thumb:hover{transform:scale(1.2);box-shadow:0 4px 12px #8ba89099}.volume-slider::-moz-range-thumb:active{transform:scale(1.1)}.volume-label,.speed-label,.temp-label{font-size:11px;color:#fff6;text-align:center;font-weight:500;letter-spacing:.5px}.seat-heat-container{display:flex;flex-direction:column;gap:12px}.seat-row{display:flex;flex-direction:column;gap:6px}.seat-label{font-size:10px;color:#ffffff80;text-transform:uppercase;letter-spacing:.5px}.button-group-inline{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.button-group-inline .control-btn{padding:8px 10px;font-size:11px}