*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei,system-ui,sans-serif;background:#0b0f14;color:#dfe6ee;-webkit-user-select:none;user-select:none}.app{position:relative;width:100%;height:100%}.app canvas{display:block}.tag-chip{background:#0c1016c7;border:1px solid rgba(120,150,190,.35);border-radius:6px;padding:3px 8px;font-size:12px;white-space:nowrap;color:#cfe0f2;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none}.hud-title{position:absolute;top:18px;left:50%;transform:translate(-50%);text-align:center;pointer-events:none}.hud-title h1{font-size:22px;letter-spacing:2px;color:#eef4fb}.hud-title p{font-size:12px;color:#7f8fa3;margin-top:4px}.mode-badge{position:absolute;top:82px;left:50%;transform:translate(-50%);padding:6px 18px;border-radius:20px;font-size:14px;font-weight:600;letter-spacing:1px;pointer-events:none;border:1px solid transparent}.mode-stop{background:#5a647340;color:#aab4c0;border-color:#4a5462}.mode-ev{background:#26d07c26;color:#26d07c;border-color:#26d07c55}.mode-hybrid{background:#ff8c4226;color:#ff8c42;border-color:#ff8c4255}.mode-regen{background:#4fc3f726;color:#4fc3f7;border-color:#4fc3f755}.mode-charge{background:#ffd54f26;color:#ffd54f;border-color:#ffd54f55}.hud-left{position:absolute;left:18px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;pointer-events:none}.gauge{background:#0c1016b8;border:1px solid rgba(120,150,190,.2);border-radius:12px;padding:10px 12px 8px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;flex-direction:column;align-items:center}.gauge-readout{margin-top:2px;display:flex;align-items:baseline;gap:4px}.gauge-value{font-size:26px;font-weight:700;font-variant-numeric:tabular-nums}.gauge-unit{font-size:11px;color:#7f8fa3}.gauge-ev{font-size:24px;font-weight:800;color:#26d07c;letter-spacing:2px}.gauge-label{font-size:11px;color:#7f8fa3;margin-top:2px}.hud-right{position:absolute;right:18px;top:50%;transform:translateY(-50%);display:flex;gap:14px;align-items:stretch;pointer-events:none}.soc-wrap{background:#0c1016b8;border:1px solid rgba(120,150,190,.2);border-radius:12px;padding:14px 12px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;flex-direction:column;align-items:center;gap:8px}.soc-track{position:relative;width:34px;height:180px;border-radius:8px;background:#1a212b;overflow:hidden;border:1px solid #2c3644}.soc-zone{position:absolute;bottom:25%;top:20%;left:0;right:0;background:#26d07c14}.soc-fill{position:absolute;bottom:0;left:0;right:0;transition:height .3s}.soc-label{white-space:nowrap}.soc-pct{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:12px;font-weight:700;color:#fff;text-shadow:0 1px 3px #000}.soc-label{font-size:11px;color:#7f8fa3}.pflow{background:#0c1016b8;border:1px solid rgba(120,150,190,.2);border-radius:12px;padding:14px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;flex-direction:column;gap:10px;width:230px}.pbar{display:flex;align-items:center;gap:8px;font-size:12px}.pbar-label{width:62px;color:#9fb0c3}.pbar-track{flex:1;height:8px;background:#1a212b;border-radius:4px;overflow:hidden}.pbar-fill{height:100%;border-radius:4px;transition:width .2s}.pbar-val{width:58px;text-align:right;font-variant-numeric:tabular-nums}.pbar-legend{display:flex;flex-wrap:wrap;gap:6px 10px;font-size:10px;margin-top:2px}.rpms{position:absolute;bottom:-76px;right:0;width:100%;display:flex;flex-direction:column;gap:4px;font-size:11px;color:#7f8fa3}.rpms b{color:#cfe0f2;font-variant-numeric:tabular-nums}.controls{position:absolute;bottom:20px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:26px;background:#0c1016c7;border:1px solid rgba(120,150,190,.25);border-radius:14px;padding:14px 22px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.ctl{display:flex;flex-direction:column;gap:6px}.ctl label{font-size:12px;color:#9fb0c3;display:flex;justify-content:space-between;gap:10px}.ctl b{color:#eef4fb}.ctl input[type=range]{width:150px;accent-color:#4fc3f7;cursor:pointer}.slider-throttle{accent-color:#26d07c!important}.slider-brake{accent-color:#e74c3c!important}.slider-explode{accent-color:#9d8cff!important}.hint{font-size:11px;color:#66788e;max-width:130px;line-height:1.6}