*{box-sizing:border-box}html,body{color:#fff;-webkit-user-select:none;user-select:none;background:#0b0d10;height:100%;margin:0;font-family:Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow:hidden}#app canvas{display:block;width:100vw!important;height:100vh!important}.hidden{display:none!important}.logo{letter-spacing:6px;font-size:44px;font-style:italic;font-weight:800}.logo span{color:#e8283a}#loading{z-index:20;background:radial-gradient(circle at 50% 40%,#1d2633,#07090c);flex-direction:column;justify-content:center;align-items:center;gap:18px;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}#loading .bar{background:#222a35;border-radius:2px;width:320px;height:4px;overflow:hidden}#loading .bar i{background:#e8283a;width:0;height:100%;transition:width .2s;display:block}#loadmsg{opacity:.7;font-size:14px}#hud{pointer-events:none;z-index:5;position:fixed;top:0;bottom:0;left:0;right:0}.panel{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#080c128c;border:1px solid #ffffff14;border-radius:10px}#laps{font-variant-numeric:tabular-nums;min-width:230px;padding:12px 16px;position:absolute;top:18px;left:18px}#laps .row{justify-content:space-between;gap:18px;font-size:16px;line-height:1.55;display:flex}#laps .row.big{font-size:22px;font-weight:700}#laps .row.cur{color:#ffe066;font-size:22px;font-weight:700}#laps .row.small{opacity:.85;font-size:13px}#laps .lbl{opacity:.6;letter-spacing:1px;align-self:center;font-size:12px;font-weight:600}#minimap{width:220px;height:220px;position:absolute;top:18px;right:18px}#dash{width:300px;height:300px;position:absolute;bottom:22px;right:26px}#tacho{width:300px;height:300px;position:absolute;top:0;bottom:0;left:0;right:0}#speed{text-align:center;font-variant-numeric:tabular-nums;text-shadow:0 2px 8px #0009;width:100%;font-size:66px;font-weight:800;position:absolute;top:108px}#unit{text-align:center;opacity:.7;letter-spacing:2px;width:100%;font-size:14px;position:absolute;top:186px}#gear{text-align:center;color:#ffe066;width:100%;font-size:30px;font-weight:800;position:absolute;top:212px}#assists{justify-content:center;gap:8px;font-size:11px;font-weight:700;display:flex;position:absolute;bottom:6px;left:0;right:0}#assists span{color:#ffffff59;background:#ffffff14;border-radius:4px;padding:2px 6px}#assists span.on{color:#fff}#assists span.active{color:#000;background:#f0a500}#stats{white-space:pre;background:#00000073;border-radius:6px;padding:8px 10px;font:12px/1.45 ui-monospace,Menlo,Consolas,monospace;position:absolute;bottom:16px;left:18px}#toast{text-shadow:0 2px 10px #000000b3;opacity:0;text-align:center;font-size:28px;font-weight:800;transition:opacity .3s;position:absolute;top:22%;left:50%;transform:translate(-50%)}#toast.show{opacity:1}#toast .s{opacity:.85;font-size:16px;font-weight:600;display:block}#hint{opacity:.55;text-shadow:0 1px 3px #000;font-size:12px;position:absolute;bottom:10px;left:50%;transform:translate(-50%)}#menu{z-index:10;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#05080c9e;justify-content:center;align-items:center;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.menuBox{background:#0e1219ed;border:1px solid #ffffff1a;border-radius:14px;width:min(900px,94vw);max-height:94vh;padding:28px 34px;overflow:auto}.menuBox .sub{opacity:.65;margin:4px 0 18px}.menuBox h3{letter-spacing:2px;text-transform:uppercase;color:#ff6b78;margin:18px 0 8px;font-size:13px}.cols{grid-template-columns:1.15fr 1fr;gap:30px;display:grid}button.primary{pointer-events:auto;color:#fff;cursor:pointer;letter-spacing:1px;background:#e8283a;border:0;border-radius:8px;padding:12px 34px;font-size:18px;font-weight:700}button.primary:hover{background:#ff3b4e}.keys td{vertical-align:top;padding:3px 8px 3px 0;font-size:14px}kbd{text-align:center;background:#2a313c;border:1px solid #3c4552;border-radius:4px;min-width:22px;margin-right:3px;padding:1px 6px;font:600 12px ui-monospace,monospace;display:inline-block}label{margin:8px 0;font-size:14px;display:block}label select,label input[type=range]{width:100%;margin-top:4px;display:block}label.chk{align-items:center;gap:8px;display:flex}select{color:#fff;background:#222a35;border:1px solid #3c4552;border-radius:6px;padding:6px}.note{opacity:.6;font-size:12px}.actions{flex-wrap:wrap;gap:10px;display:flex}button.secondary{color:#fff;cursor:pointer;background:#2a313c;border:1px solid #3c4552;border-radius:8px;padding:12px 22px;font-size:16px;font-weight:600}body:not(.touch) .touchHelp,body.touch .keysSection{display:none}body.touch .keys td{font-size:13px}@media (max-width:760px){.cols{grid-template-columns:1fr;gap:0}.menuBox{padding:18px 18px 22px}.logo{letter-spacing:4px;font-size:32px}}@media (max-height:520px){.menuBox{max-height:calc(100vh - 16px);padding:14px 20px}.logo{font-size:28px}.menuBox .sub{margin:2px 0 10px}.menuBox h3{margin:10px 0 6px}}#menu{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.menuBox{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}#app canvas{touch-action:none}#rotateHint{display:none}#touch{pointer-events:none;z-index:6;display:none;position:fixed;top:0;bottom:0;left:0;right:0}body.touch #touch{display:block}body.touch{-webkit-user-select:none;-webkit-touch-callout:none;overscroll-behavior:none;touch-action:none}#touch button,#steerPad{pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}#touch button{color:#fff;letter-spacing:1px;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0a0e146b;border:2px solid #ffffff47;border-radius:14px;font:800 14px/1.1 Segoe UI,Roboto,Helvetica,Arial,sans-serif}#touch button.active{background:#ffffff52;border-color:#fff;transform:scale(.97)}#steerPad{left:calc(12px + env(safe-area-inset-left));bottom:calc(12px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0a0e1461;border:2px solid #ffffff47;border-radius:60px;justify-content:space-between;align-items:center;width:min(40vw,270px);height:min(24vh,118px);min-height:84px;padding:0 16px;display:flex;position:absolute}#steerPad.active{border-color:#ffffffb3}#steerPad .chev{color:#ffffffa6;pointer-events:none;font-size:22px}#steerPad .track{pointer-events:none;background:#ffffff2e;border-radius:2px;height:4px;margin-top:-2px;position:absolute;top:50%;left:12%;right:12%}#steerKnob{pointer-events:none;background:#ffe066d9;border-radius:50%;width:56px;height:56px;margin:-28px 0 0 -28px;position:absolute;top:50%;left:50%;box-shadow:0 2px 10px #00000080}#pedals{right:calc(12px + env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom));align-items:flex-end;gap:10px;display:flex;position:absolute}#pedals .pcol{flex-direction:column;align-items:stretch;gap:8px;display:flex}#touch #tGas{background:#1e8c4673;width:min(22vw,96px);height:min(34vh,150px);min-height:104px}#touch #tGas.active{background:#3cc86e99}#touch #tBrake{background:#b41e2d73;width:min(20vw,88px);height:min(26vh,118px);min-height:80px}#touch #tBrake.active{background:#e8283aa6}#touch #tHand{height:44px;font-size:11px!important}#tButtons{right:calc(12px + env(safe-area-inset-right));top:calc(12px + env(safe-area-inset-top) + 120px);gap:8px;display:flex;position:absolute}#tButtons button{min-width:50px;height:42px;padding:0 8px;font-size:12px}body.touch #hint{display:none}body.touch #laps{top:calc(10px + env(safe-area-inset-top));left:calc(10px + env(safe-area-inset-left));width:158px;min-width:0;padding:7px 10px}body.touch #laps .row{gap:8px;font-size:12px;line-height:1.45}body.touch #laps .row.big,body.touch #laps .row.cur{font-size:15px}body.touch #laps .lbl{font-size:10px}body.touch #laps .row.small{font-size:11px}body.touch #minimap{top:calc(10px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));width:110px;height:110px}body.touch #dash{bottom:auto;right:auto;left:calc(178px + env(safe-area-inset-left));top:calc(6px + env(safe-area-inset-top));transform-origin:0 0;background:radial-gradient(circle,#080c129e 0 66%,#080c1200 70%);border-radius:50%;transform:scale(.46)}body.touch #stats{left:calc(10px + env(safe-area-inset-left));bottom:auto;top:calc(150px + env(safe-area-inset-top));font-size:10px}body.touch #toast{width:80vw;font-size:20px;top:26%}body.touch #toast .s{font-size:13px}@media (orientation:portrait){body.touch #dash{left:calc(10px + env(safe-area-inset-left));top:calc(132px + env(safe-area-inset-top));transform:scale(.46)}body.touch #steerPad{width:min(42vw,230px)}body.touch #rotateHint{top:calc(290px + env(safe-area-inset-top));white-space:nowrap;background:#00000073;border-radius:10px;padding:4px 10px;font-size:12px;animation:6s forwards fadeHint;display:block;position:absolute;left:50%;transform:translate(-50%)}}@keyframes fadeHint{0%,70%{opacity:.9}to{opacity:0;visibility:hidden}}@media (orientation:landscape) and (max-height:430px){body.touch #tButtons{top:calc(8px + env(safe-area-inset-top));right:calc(132px + env(safe-area-inset-right))}body.touch #steerPad{width:min(34vw,270px)}}