:root{color-scheme:dark;--hud-bg: rgba(10, 14, 20, .72);--hud-fg: #e6edf3;--hud-accent: #4fc3ff;--hud-border: rgba(255, 255, 255, .08);font-family:PingFang TC,Noto Sans TC,Microsoft JhengHei,system-ui,sans-serif}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:#05070a}#scene{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}#pip{position:fixed;right:16px;bottom:16px;width:320px;height:220px;border:1px solid var(--hud-border);border-radius:8px;background:#000;box-shadow:0 4px 20px #00000080}#pip-label{position:fixed;right:24px;bottom:228px;padding:2px 8px;color:var(--hud-fg);background:var(--hud-bg);border-radius:4px;font-size:12px;letter-spacing:.05em;pointer-events:none}#hud{position:fixed;left:16px;top:16px;min-width:220px;max-width:340px;padding:14px 18px;background:var(--hud-bg);color:var(--hud-fg);border:1px solid var(--hud-border);border-radius:8px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);font-variant-numeric:tabular-nums;-webkit-user-select:none;user-select:none;pointer-events:none}.hud-actions{margin-top:10px;pointer-events:auto}#reset-btn,#edit-btn{width:100%;padding:7px 10px;border:1px solid var(--hud-border);border-radius:6px;background:#4fc3ff26;color:var(--hud-fg);font:inherit;font-size:13px;cursor:pointer;transition:background .15s ease}#reset-btn:hover,#edit-btn:hover{background:#4fc3ff47}#reset-btn:active,#edit-btn:active{background:#4fc3ff66}.hud-row{display:flex;align-items:baseline;gap:8px;margin:4px 0;line-height:1.4}.hud-row.small{margin-top:10px;padding-top:8px;border-top:1px solid var(--hud-border);font-size:11px;color:#8b96a3;line-height:1.5}.label{color:#8b96a3;font-size:12px;min-width:3.5em}.value{color:var(--hud-fg);font-weight:600;font-size:18px}.unit{color:#8b96a3;font-size:12px}#hud.hidden,#pip.hidden,#pip-label.hidden{display:none}.nav-link{display:block;margin-top:6px;padding:6px 10px;border:1px solid var(--hud-border);border-radius:6px;color:var(--hud-accent);font-size:13px;text-align:center;text-decoration:none}.nav-link:hover{background:#4fc3ff1f}.home-link{display:block;margin-top:4px;padding:3px 10px;color:#b7c2cf;font-size:12px;text-align:center;text-decoration:none}.home-link:hover{color:var(--hud-accent)}.value.status{font-size:15px}.hud-row.detail{margin-top:-2px;font-size:12px;color:#b7c2cf;min-height:1.4em}#hit-flash{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;box-shadow:inset 0 0 120px 30px #ff2828bf;opacity:0;transition:opacity .35s ease}#hit-flash.on{opacity:1;transition:none}#edit-btn{margin-top:6px}#editor{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;color:var(--hud-fg)}#editor.hidden{display:none}#editor-map{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none}#editor-panel{position:absolute;left:0;top:0;bottom:0;width:300px;box-sizing:border-box;padding:16px;overflow-y:auto;background:#0a0e14eb;border-right:1px solid var(--hud-border);font-size:13px}#editor-panel button{padding:6px 8px;border:1px solid var(--hud-border);border-radius:6px;background:#ffffff0f;color:var(--hud-fg);font:inherit;font-size:13px;cursor:pointer}#editor-panel button:hover{background:#4fc3ff33}#editor-panel button.primary{width:100%;margin-bottom:8px;padding:8px;background:#4fc3ff4d;font-weight:600}#editor-panel button.danger:hover{background:#ff50504d}.ed-title{font-size:16px;font-weight:600;margin-bottom:12px}.ed-section{margin-bottom:14px}.ed-label{color:#8b96a3;font-size:12px;margin-bottom:6px}.ed-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:6px}.ed-field{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:5px 0}.ed-field span{color:#b7c2cf}.ed-field input,.ed-field select{width:110px;box-sizing:border-box;padding:4px 6px;border:1px solid var(--hud-border);border-radius:4px;background:#ffffff0f;color:var(--hud-fg);font:inherit}.ed-field input[type=color]{height:28px;padding:2px}.ed-note{color:#8b96a3}.ed-status{min-height:1em;margin-bottom:12px;color:#ffb547;white-space:pre-line}.ed-hint{color:#8b96a3;font-size:11px;line-height:1.6}#inset-frame{position:fixed;left:16px;bottom:16px;width:260px;height:200px;box-sizing:border-box;border:1px solid rgba(255,255,255,.25);border-radius:6px;pointer-events:none}#inset-frame span{position:absolute;left:6px;top:4px;padding:1px 6px;border-radius:4px;background:var(--hud-bg);color:var(--hud-fg);font-size:11px}#inset-frame.hidden{display:none}body.touch{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}body.touch #pip{top:calc(16px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right));bottom:auto;width:280px;height:190px}body.touch #pip-label{top:calc(22px + env(safe-area-inset-top));right:calc(24px + env(safe-area-inset-right));bottom:auto}body.touch #inset-frame{top:calc(218px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right));left:auto;bottom:auto;width:280px;height:200px}#touch-ui{--pedal-h: min(230px, 28vh);position:fixed;top:0;right:0;bottom:0;left:0;z-index:5;pointer-events:none;color:var(--hud-fg)}#touch-ui .pedal,#touch-ui button,#touch-start{pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent}.pedal{position:absolute;bottom:calc(16px + env(safe-area-inset-bottom));width:190px;height:var(--pedal-h);box-sizing:border-box;display:flex;align-items:flex-end;justify-content:center;padding-bottom:18px;border-radius:20px;border:2px solid rgba(255,255,255,.18);font-size:18px;font-weight:600;letter-spacing:.1em;transition:background .08s ease,transform .08s ease}#pedal-brake{left:calc(16px + env(safe-area-inset-left));background:#e5393538}#pedal-gas{right:calc(16px + env(safe-area-inset-right));background:#43a04738}#pedal-brake.down{background:#e5393599;transform:scale(.97)}#pedal-gas.down{background:#43a04799;transform:scale(.97)}#gear-btn{position:absolute;right:calc(16px + env(safe-area-inset-right));bottom:calc(16px + var(--pedal-h) + 12px + env(safe-area-inset-bottom));width:96px;height:64px;border-radius:14px;border:2px solid rgba(255,255,255,.25);background:#0a0e14b8;color:#7dffa0;font:inherit;font-size:28px;font-weight:700}#gear-btn.reverse{color:#ffb547;border-color:#ffb54799}#touch-tools{position:absolute;left:50%;top:calc(16px + env(safe-area-inset-top));transform:translate(-50%);display:flex;gap:6px}#tilt-box{position:absolute;left:calc(16px + env(safe-area-inset-left));bottom:calc(16px + var(--pedal-h) + 12px + env(safe-area-inset-bottom));width:190px;display:flex;flex-direction:column;align-items:center;gap:8px}#tilt-box .row{display:flex;gap:6px}#touch-tools button,#tilt-box button,#touch-start button{padding:9px 11px;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:#0a0e14b8;color:var(--hud-fg);font:inherit;font-size:13px;white-space:nowrap}#tilt-box button.on{background:#ffb54759}#touch-tools button.off{color:#ffffff73;text-decoration:line-through}#tilt-meter{position:relative;width:120px;height:60px;border:2px solid rgba(255,255,255,.25);border-bottom:none;border-radius:60px 60px 0 0;box-sizing:border-box;background:#0a0e1480}#tilt-needle{position:absolute;left:calc(50% - 2px);bottom:0;width:4px;height:52px;border-radius:2px;background:#7dffa0;transform-origin:50% 100%}#touch-start{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#05070ac7}#touch-start.hidden{display:none}#touch-start .box{max-width:520px;margin:16px;padding:22px 24px;border-radius:12px;background:var(--hud-bg);border:1px solid var(--hud-border);font-size:15px;line-height:1.7}#touch-start .title{font-size:20px;font-weight:600;margin-bottom:8px}#touch-start ul{margin:0 0 16px;padding-left:20px}#touch-start #touch-go{display:block;width:100%;padding:14px;margin-bottom:8px;font-size:17px;font-weight:600;background:#4fc3ff59}#touch-start #touch-skip{display:block;width:100%}#touch-msg{margin-top:10px;min-height:1em;color:#ffb547}body.touch #hud{max-width:270px;min-width:0}body.touch #hud .hud-row.small{display:none}body.touch .hud-row:has(#hud-sound){display:none}@media (orientation: portrait){body.touch #touch-tools{left:auto;right:calc(16px + env(safe-area-inset-right));top:calc(426px + env(safe-area-inset-top));transform:none;width:282px;flex-wrap:wrap;justify-content:flex-end}}
