:root{--bg: #0b1020;--bg-card: #141a30;--bg-card-2: #1a2140;--fg: #e6ecff;--fg-dim: #8a92b2;--accent: #6aa4ff;--good: #3ddc84;--warn: #ffb454;--err: #ff6b6b;--border: #22294a}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;overscroll-behavior:none}#app{min-height:100%;padding:max(env(safe-area-inset-top),12px) 12px max(env(safe-area-inset-bottom),12px) 12px;display:flex;flex-direction:column;gap:12px}header{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 0}header h1{margin:0;font-size:18px;font-weight:600;letter-spacing:.2px}.state-pill{padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;background:var(--bg-card);color:var(--fg-dim);border:1px solid var(--border)}.state-pill.connected{color:var(--good);border-color:var(--good)}.state-pill.connecting{color:var(--warn);border-color:var(--warn)}.state-pill.error{color:var(--err);border-color:var(--err)}.pill-stack{display:inline-flex;gap:6px;align-items:center}.net-pill{font-size:11px;cursor:help;min-width:60px;text-align:center}.net-pill[data-state=idle]{color:var(--good);border-color:var(--good)}.net-pill[data-state=syncing]{color:var(--accent);border-color:var(--accent)}.net-pill[data-state=offline]{color:var(--warn);border-color:var(--warn);background:#2b2210}.net-pill[data-state=backoff]{color:var(--warn);border-color:var(--warn)}.net-pill[data-state=error]{color:var(--err);border-color:var(--err)}.net-pill[data-state=pending]{color:var(--fg-dim);border-color:var(--fg-dim)}.controls{display:flex;gap:8px;flex-wrap:wrap}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:var(--bg-card);color:var(--fg);padding:10px 14px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;min-height:44px;flex:1 1 auto}button.primary{background:var(--accent);color:#081226;border-color:transparent}button.danger{background:var(--err);color:#240808;border-color:transparent}button:disabled{opacity:.4;cursor:not-allowed}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.tile{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:6px;min-height:104px}.tile .label{color:var(--fg-dim);font-size:12px;text-transform:uppercase;letter-spacing:.6px}.tile .value{font-size:36px;font-weight:700;line-height:1.05;font-variant-numeric:tabular-nums}.tile .unit{color:var(--fg-dim);font-size:13px}.log{background:var(--bg-card-2);border:1px solid var(--border);border-radius:12px;padding:10px 12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--fg-dim);max-height:160px;overflow-y:auto;white-space:pre-wrap;word-break:break-word}.row{display:flex;gap:8px;align-items:center;justify-content:space-between;font-size:13px;color:var(--fg-dim)}.kbd{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--bg-card);padding:1px 6px;border-radius:4px;color:var(--fg);border:1px solid var(--border)}.banner{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:12px;font-size:13px;color:var(--fg-dim);line-height:1.4}.banner b{color:var(--fg)}.terminal-wrap{display:flex;flex-direction:column;gap:8px;background:#05070f;border:1px solid var(--border);border-radius:12px;padding:10px 10px 0;flex:1 1 auto;min-height:280px}.terminal-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.terminal-bar input[type=search]{flex:1 1 100px;min-width:80px;background:var(--bg-card);color:var(--fg);border:1px solid var(--border);border-radius:8px;padding:6px 10px;font:13px ui-monospace,SFMono-Regular,Menlo,monospace}.terminal-bar button.sm{min-height:32px;padding:4px 10px;font-size:12px;flex:0 0 auto;transition:background-color .12s,color .12s,border-color .12s}.terminal-bar button.sm[data-kind=ok]{background:#0e2a18;color:var(--good);border-color:var(--good)}.terminal-bar button.sm[data-kind=warn]{background:#2b2210;color:var(--warn);border-color:var(--warn)}.terminal-bar button.sm[data-kind=err]{background:#2a0f10;color:var(--err);border-color:var(--err)}.terminal-status{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.5px;padding:3px 8px;border-radius:6px;background:var(--bg-card);color:var(--fg-dim);border:1px solid var(--border)}.terminal-status[data-kind=ok]{color:var(--good);border-color:var(--good)}.terminal-status[data-kind=warn]{color:var(--warn);border-color:var(--warn)}.terminal-status[data-kind=err]{color:var(--err);border-color:var(--err)}.terminal-counter{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--fg-dim);margin-left:auto}.terminal-body{flex:1 1 auto;margin:0 -10px;padding:10px;overflow-y:auto;font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;color:#c8d1e4;white-space:pre-wrap;word-break:break-word;max-height:60vh;border-top:1px solid var(--border);border-radius:0 0 12px 12px;background:#03050c}.terminal-body .t-ts{color:#6b7591}.terminal-body .t-key{color:#58c4ff}.terminal-body .t-val{color:#3ddc84;font-weight:600}.terminal-body .t-unit{color:#6b7591;margin-left:1px}.terminal-body .t-info{color:#ffb454}.terminal-body .t-err{color:var(--err)}.t-badge-remote{display:inline-block;background:#1a2140;color:#58c4ff;border:1px solid #244169;border-radius:4px;padding:0 4px;font-size:10px;margin-right:4px}.auth-gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}.auth-card{width:100%;max-width:380px;background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:24px}.auth-title{margin:0 0 4px;font:700 22px Inter,sans-serif}.auth-sub{margin:0 0 18px;color:var(--fg-dim);font-size:13px}.auth-form{display:flex;flex-direction:column;gap:12px}.auth-form label{display:flex;flex-direction:column;gap:6px}.auth-form label span{font-size:12px;color:var(--fg-dim)}.auth-form input{background:var(--bg-card-2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;color:var(--fg);font-size:14px}.auth-form input:focus{outline:none;border-color:var(--accent)}.auth-error{color:var(--err);font-size:12px;min-height:16px}.auth-toggle{text-align:center;color:var(--accent);font-size:12px;text-decoration:none;margin-top:4px}.user-chip{display:inline-flex;gap:8px;align-items:center;font-size:12px}.user-email{color:var(--fg-dim)}.user-logout{background:transparent;color:var(--fg-dim);border:1px solid var(--border);padding:4px 10px;border-radius:6px;font-size:11px;cursor:pointer;min-height:28px}.user-logout:hover{color:var(--err);border-color:var(--err)}.vin-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;z-index:100;overflow-y:auto}.vin-modal-card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:20px;width:100%;max-width:440px}.vin-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.vin-modal-header h2{margin:0;font-size:16px}.vin-modal-close{background:transparent;border:1px solid var(--border);color:var(--fg-dim);border-radius:6px;padding:4px 10px;cursor:pointer}.vin-modal-field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.vin-modal-field label{font-size:11px;color:var(--fg-dim);text-transform:uppercase;letter-spacing:.5px}.vin-modal-field input{background:var(--bg-card-2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;color:var(--fg);font:600 13px ui-monospace,Menlo,monospace;letter-spacing:1px}.vin-decoded{background:var(--bg-card-2);border:1px solid var(--border);border-radius:8px;padding:12px;margin-bottom:12px}.vin-decoded-title{font:600 14px Inter,sans-serif;margin-bottom:6px;color:var(--good)}.vin-decoded-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:4px 12px;font-size:12px}.vin-decoded-grid>div{display:flex;justify-content:space-between;gap:8px}.vin-decoded-key{color:var(--fg-dim)}.vin-decoded-val{color:var(--fg);text-align:right}.vin-modal-err{color:var(--err);font-size:12px;margin-bottom:8px}.vin-modal-actions{display:flex;gap:8px}.vin-modal-actions button{flex:1 1 auto}.garage{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.garage-header{display:flex;justify-content:space-between;align-items:center;padding:4px 2px}.garage-header-title{font:600 12px Inter,sans-serif;text-transform:uppercase;letter-spacing:.6px;color:var(--fg-dim)}.garage-card{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:10px 12px;display:flex;justify-content:space-between;align-items:center;cursor:pointer}.garage-card.active{border-color:var(--accent);background:var(--bg-card-2)}.garage-card-name{font:600 13px Inter,sans-serif;color:var(--fg)}.garage-card-sub{font-size:11px;color:var(--fg-dim);margin-top:2px}.garage-card-vin{font-family:ui-monospace,Menlo,monospace;font-size:10px;color:var(--fg-dim)}.garage-add{background:transparent;border:1px dashed var(--border);border-radius:10px;padding:10px;color:var(--accent);font-size:13px;cursor:pointer;text-align:center}.garage-add:hover{border-color:var(--accent)}.trips-header{display:flex;justify-content:space-between;align-items:center;padding:4px 0 10px;font-size:13px;color:var(--fg)}.trips-header button.sm{min-height:30px;padding:4px 12px;font-size:12px;background:var(--bg-card);color:var(--fg);border:1px solid var(--border);border-radius:6px;cursor:pointer}.trips-list{display:flex;flex-direction:column;gap:10px}.trips-empty{padding:24px;text-align:center;color:var(--fg-dim);font-size:13px;background:var(--bg-card);border:1px dashed var(--border);border-radius:10px}.trip-card{background:var(--bg-card);border:1px solid var(--border);border-left:4px solid var(--fg-dim);border-radius:10px;padding:12px}.trip-card[data-status=good]{border-left-color:var(--good)}.trip-card[data-status=attention]{border-left-color:var(--warn)}.trip-card[data-status=critical]{border-left-color:var(--err)}.trip-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}.trip-card-date{font:600 14px Inter,sans-serif;color:var(--fg)}.trip-card-duration{font-size:11px;color:var(--fg-dim);margin-top:2px}.trip-card-score{font:700 22px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--good);padding:2px 10px;background:var(--bg-card-2);border-radius:8px}.trip-card[data-status=attention] .trip-card-score{color:var(--warn)}.trip-card[data-status=critical] .trip-card-score{color:var(--err)}.trip-card[data-status=unknown] .trip-card-score{color:var(--fg-dim)}.trip-card-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:6px 12px;font-size:12px;margin-bottom:8px}.trip-card-stats>div{display:flex;justify-content:space-between;gap:8px}.trip-stat-key{color:var(--fg-dim)}.trip-stat-val{color:var(--fg);font-family:ui-monospace,Menlo,monospace}.trip-card-events,.trip-card-alerts{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}.trip-event,.trip-event-more,.trip-alert{font-size:10px;padding:2px 6px;border-radius:4px;background:var(--bg-card-2);color:var(--fg-dim);border:1px solid var(--border);white-space:nowrap}.trip-event[data-type=hard_brake]{color:var(--err);border-color:var(--err)}.trip-event[data-type=hard_accel],.trip-event[data-type=hard_accel_rpm]{color:var(--warn);border-color:var(--warn)}.trip-event[data-type=overheat_peak]{color:var(--err);border-color:var(--err);background:#2a0f10}.trip-alert{color:var(--warn);border-color:var(--warn)}.health-panel{display:flex;flex-direction:column;gap:12px;padding:14px;background:var(--bg-card);border:1px solid var(--border);border-radius:14px;margin-bottom:12px}.health-panel[data-status=good]{border-color:var(--good)}.health-panel[data-status=attention]{border-color:var(--warn)}.health-panel[data-status=critical]{border-color:var(--err)}.health-header{display:flex;align-items:center;gap:16px}.health-score{font:700 44px ui-monospace,SFMono-Regular,Menlo,monospace;line-height:1;min-width:96px;text-align:center;padding:10px 14px;border-radius:10px;background:var(--bg-card-2);color:var(--good)}.health-panel[data-status=attention] .health-score{color:var(--warn)}.health-panel[data-status=critical] .health-score{color:var(--err)}.health-meta{display:flex;flex-direction:column;gap:4px}.health-status{font:600 13px Inter,sans-serif;letter-spacing:1px;color:var(--good)}.health-panel[data-status=attention] .health-status{color:var(--warn)}.health-panel[data-status=critical] .health-status{color:var(--err)}.health-drivingstate{font-size:12px;color:var(--fg-dim);text-transform:capitalize}.health-subsystems{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.health-sub{padding:8px 10px;background:var(--bg-card-2);border-left:3px solid var(--fg-dim);border-radius:8px}.health-sub[data-status=good]{border-left-color:var(--good)}.health-sub[data-status=attention]{border-left-color:var(--warn)}.health-sub[data-status=critical]{border-left-color:var(--err)}.health-sub[data-status=unknown]{opacity:.5}.health-sub-key{font:600 10px Inter,sans-serif;text-transform:uppercase;letter-spacing:.6px;color:var(--fg-dim)}.health-sub-label{font-size:13px;color:var(--fg);margin-top:2px}.health-sub-detail{font-size:11px;color:var(--fg-dim);margin-top:1px;font-family:ui-monospace,Menlo,monospace}.health-alerts{display:flex;flex-direction:column;gap:6px}.health-alerts-empty{color:var(--good);font-size:12px;padding:6px 8px}.health-alert{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;border-radius:8px;font-size:12px;line-height:1.3}.health-alert[data-severity=info]{background:#1b2140;color:var(--accent)}.health-alert[data-severity=warn]{background:#2b2210;color:var(--warn)}.health-alert[data-severity=error]{background:#2a0f10;color:var(--err)}.health-alert-icon{flex:0 0 auto}.health-alert-msg{flex:1 1 auto}.dtc-panel{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px}.dtc-header{display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:14px}.dtc-header button.sm{min-height:28px;padding:0 10px;font-size:16px;background:transparent;border:1px solid var(--border);color:var(--fg-dim);border-radius:6px}.dtc-loading,.dtc-empty,.dtc-error{color:var(--fg-dim);font-size:13px;padding:6px 0}.dtc-empty{color:var(--good)}.dtc-error{color:var(--err)}.dtc-section{margin-top:8px}.dtc-section-title{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--fg-dim);margin-bottom:6px}.dtc-stored .dtc-code{color:var(--err)}.dtc-pending .dtc-code{color:var(--warn)}.dtc-permanent .dtc-code{color:var(--err)}.dtc-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:10px;align-items:center;padding:6px 8px;background:var(--bg-card-2);border-radius:6px;margin-bottom:4px;font-size:13px}.dtc-code{font:600 13px ui-monospace,Menlo,monospace}.dtc-system{color:var(--fg-dim);font-size:12px;text-transform:lowercase}.dtc-origin{color:var(--fg-dim);font-size:11px}.dtc-lookup{color:var(--accent);font-size:12px;text-decoration:none}.stream-row{display:flex;align-items:center;gap:8px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:8px 10px}.stream-row .stream-label{font-size:11px;color:var(--fg-dim);text-transform:uppercase;letter-spacing:.6px;flex:0 0 auto}.stream-row .stream-url{flex:1 1 auto;background:var(--bg-card-2);padding:6px 8px;border-radius:6px;font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stream-row button.sm{min-height:32px;padding:4px 12px;font-size:12px;flex:0 0 auto;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:var(--bg-card);color:var(--fg);border-radius:8px;font-weight:600}.nav{display:flex;gap:4px;padding:4px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px}.nav button{flex:1 1 auto;background:transparent;border:none;min-height:36px;font-size:13px;color:var(--fg-dim);padding:6px 10px}.nav button.active{background:var(--bg-card-2);color:var(--fg);border-radius:8px}