:root {
  --bg: #07131f;
  --panel: #0d1d2c;
  --panel-2: #112538;
  --panel-3: #152b40;
  --line: rgba(166, 205, 227, .14);
  --line-strong: rgba(166, 205, 227, .25);
  --text: #f5f9fc;
  --muted: #93a9b8;
  --muted-2: #6e8696;
  --accent: #3cd7b6;
  --accent-soft: rgba(60, 215, 182, .12);
  --cyan: #61c9ff;
  --amber: #f6c56b;
  --red: #ff7b78;
  --green: #63db9b;
  --violet: #b99cff;
  --shadow: 0 18px 45px rgba(0,0,0,.24);
  --radius: 16px;
  --radius-sm: 11px;
  --nav-w: 226px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); }
body { overflow-x: hidden; }
button, input { font: inherit; }
button { cursor: pointer; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: var(--nav-w) 1fr; background:
  radial-gradient(circle at 72% -15%, rgba(61, 215, 182, .08), transparent 27%),
  radial-gradient(circle at 98% 34%, rgba(97, 201, 255, .055), transparent 30%),
  var(--bg); }
.sidebar { position: sticky; top: 0; height: 100vh; border-right: 1px solid var(--line); padding: 20px 14px; display: flex; flex-direction: column; gap: 22px; background: rgba(6, 17, 27, .83); backdrop-filter: blur(18px); }
.brand { display: flex; align-items: center; gap: 10px; padding: 0 8px 10px; }
.brand-mark { width: 38px; height: 38px; border: 1px solid rgba(60,215,182,.45); border-radius: 11px; display:grid; place-items:center; background: linear-gradient(145deg, rgba(60,215,182,.18), rgba(97,201,255,.08)); box-shadow: inset 0 0 22px rgba(60,215,182,.06); }
.brand-mark svg { width: 23px; height: 23px; }
.brand-mark.custom { padding:3px; background:rgba(255,255,255,.035); }
.brand-logo-img { display:block; width:100%; height:100%; object-fit:contain; border-radius:7px; }
.brand-title { font-weight: 760; font-size: 13px; line-height: 1.1; letter-spacing: .02em; }
.brand-sub { color: var(--muted-2); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; margin-top: 4px; }
.nav { display:flex; flex-direction:column; gap:4px; }
.nav-group-label { padding: 13px 11px 6px; color: var(--muted-2); text-transform: uppercase; font-size: 9px; letter-spacing: .13em; }
.nav-link { width: 100%; border: 0; display:flex; align-items:center; gap:11px; padding:10px 11px; border-radius:10px; color:#a8bac7; background:transparent; text-align:left; font-size:12px; transition:.18s ease; }
.nav-link:hover { background:rgba(255,255,255,.035); color:var(--text); }
.nav-link.active { color:var(--text); background:linear-gradient(90deg, rgba(60,215,182,.14), rgba(60,215,182,.025)); box-shadow: inset 2px 0 0 var(--accent); }
.nav-icon { width:18px; height:18px; display:grid; place-items:center; border:1px solid var(--line); border-radius:6px; color:var(--muted); font-size:8px; font-weight:800; }
.nav-link.active .nav-icon { border-color:rgba(60,215,182,.35); color:var(--accent); background:rgba(60,215,182,.08); }
.sidebar-footer { margin-top:auto; border-top:1px solid var(--line); padding:14px 8px 0; }
.env-pill { display:flex; align-items:center; justify-content:space-between; gap:7px; font-size:9px; color:var(--muted); }
.dot { width:7px; height:7px; border-radius:50%; display:inline-block; background:var(--green); box-shadow:0 0 0 4px rgba(99,219,155,.08); }
.release { font-size:9px; color:var(--muted-2); margin-top:9px; }
.main { min-width:0; }
.topbar { height:66px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:0 24px; border-bottom:1px solid var(--line); background:rgba(7,19,31,.72); backdrop-filter:blur(16px); position:sticky; top:0; z-index:10; }
.context { display:flex; align-items:center; gap:12px; min-width:0; }
.city-chip { padding:7px 10px; border:1px solid var(--line); border-radius:9px; color:#c8d7e0; font-size:10px; white-space:nowrap; background:rgba(255,255,255,.02); }
.sep { width:1px; height:22px; background:var(--line); }
.page-title { font-size:14px; font-weight:700; white-space:nowrap; }
.top-actions { display:flex; align-items:center; gap:9px; }
.search { width:220px; height:34px; border:1px solid var(--line); border-radius:9px; background:rgba(255,255,255,.025); color:var(--text); padding:0 11px; outline:none; font-size:10px; }
.search:focus { border-color:rgba(60,215,182,.42); box-shadow:0 0 0 3px rgba(60,215,182,.06); }
.icon-btn { width:34px; height:34px; border:1px solid var(--line); border-radius:9px; color:var(--muted); background:rgba(255,255,255,.025); display:grid; place-items:center; }
.user { width:34px; height:34px; border-radius:9px; background:linear-gradient(145deg,#1a4253,#133044); border:1px solid rgba(97,201,255,.25); display:grid; place-items:center; font-size:10px; font-weight:800; }
.content { padding:22px 24px 40px; max-width:1700px; margin:auto; }
.status-banner { border:1px solid rgba(246,197,107,.22); background:linear-gradient(90deg, rgba(246,197,107,.08), rgba(246,197,107,.018)); border-radius:12px; padding:10px 13px; display:flex; align-items:center; gap:10px; margin-bottom:17px; font-size:10px; color:#d8c9a8; }
.status-tag { border:1px solid rgba(246,197,107,.35); background:rgba(246,197,107,.09); color:var(--amber); font-weight:800; padding:3px 7px; border-radius:6px; font-size:8px; letter-spacing:.08em; }
.section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:14px; margin-bottom:14px; }
.eyebrow { color:var(--accent); text-transform:uppercase; font-size:8px; font-weight:800; letter-spacing:.16em; margin-bottom:6px; }
h1 { margin:0; font-size:23px; letter-spacing:-.03em; }
.lead { color:var(--muted); font-size:10px; margin-top:6px; line-height:1.5; max-width:760px; }
.primary-btn, .ghost-btn { height:34px; border-radius:9px; padding:0 12px; font-size:9px; font-weight:750; border:1px solid; }
.primary-btn { color:#061816; background:var(--accent); border-color:var(--accent); }
.ghost-btn { color:#c3d3dc; border-color:var(--line); background:rgba(255,255,255,.025); }
.kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; margin:16px 0 18px; }
.kpi { min-width:0; border:1px solid var(--line); border-radius:var(--radius-sm); background:linear-gradient(155deg, rgba(17,37,56,.92), rgba(9,26,39,.92)); padding:13px 13px 12px; box-shadow:0 9px 26px rgba(0,0,0,.1); }
.kpi-top { display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--muted); font-size:8px; text-transform:uppercase; letter-spacing:.08em; }
.kpi-value { font-size:22px; font-weight:760; margin-top:9px; letter-spacing:-.04em; }
.kpi-foot { margin-top:6px; display:flex; align-items:center; gap:5px; color:var(--muted-2); font-size:8px; }
.trend { font-weight:800; }
.trend.good { color:var(--green); }.trend.warn { color:var(--amber); }.trend.bad { color:var(--red); }
.grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr); gap:12px; }
.panel { min-width:0; border:1px solid var(--line); border-radius:var(--radius); background:rgba(12,29,44,.84); box-shadow:var(--shadow); overflow:hidden; }
.panel-head { min-height:52px; padding:12px 14px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:12px; }
.panel-title { font-size:11px; font-weight:750; }
.panel-sub { color:var(--muted-2); font-size:8px; margin-top:3px; }
.panel-body { padding:14px; }
.mini-tabs { display:flex; gap:3px; padding:3px; border:1px solid var(--line); background:rgba(255,255,255,.018); border-radius:8px; }
.mini-tab { border:0; color:var(--muted); background:transparent; padding:5px 8px; border-radius:6px; font-size:8px; }
.mini-tab.active { color:var(--text); background:var(--panel-3); }
table { border-collapse:collapse; width:100%; }
th { text-align:left; color:var(--muted-2); text-transform:uppercase; letter-spacing:.08em; font-size:7px; font-weight:800; padding:9px 10px; border-bottom:1px solid var(--line); white-space:nowrap; }
td { padding:10px; border-bottom:1px solid rgba(166,205,227,.08); color:#cad8e0; font-size:9px; white-space:nowrap; }
tbody tr { transition:.15s; }
tbody tr:hover { background:rgba(255,255,255,.02); }
.vehicle { font-weight:800; color:var(--text); }
.badge { display:inline-flex; align-items:center; gap:5px; min-height:20px; padding:0 7px; border-radius:6px; border:1px solid; font-size:7px; font-weight:800; letter-spacing:.03em; }
.badge.red { color:var(--red); border-color:rgba(255,123,120,.28); background:rgba(255,123,120,.08); }
.badge.amber { color:var(--amber); border-color:rgba(246,197,107,.28); background:rgba(246,197,107,.08); }
.badge.green { color:var(--green); border-color:rgba(99,219,155,.27); background:rgba(99,219,155,.07); }
.badge.cyan { color:var(--cyan); border-color:rgba(97,201,255,.25); background:rgba(97,201,255,.07); }
.badge.gray { color:#a3b5c0; border-color:var(--line); background:rgba(255,255,255,.025); }
.dot-sm { width:5px;height:5px;border-radius:50%;background:currentColor; }
.metric-stack { display:flex; flex-direction:column; gap:10px; }
.metric-row { border:1px solid var(--line); background:rgba(255,255,255,.018); border-radius:10px; padding:11px; }
.metric-label { display:flex; justify-content:space-between; gap:8px; color:#bdccd5; font-size:9px; }
.metric-label strong { color:var(--text); }
.bar { height:5px; border-radius:99px; background:rgba(255,255,255,.06); overflow:hidden; margin-top:9px; }
.bar > span { height:100%; display:block; border-radius:99px; background:linear-gradient(90deg,var(--accent),var(--cyan)); }
.timeline { display:flex; flex-direction:column; }
.timeline-item { display:grid; grid-template-columns:56px 14px 1fr; gap:6px; min-height:44px; }
.timeline-time { color:var(--muted-2); font-size:8px; padding-top:3px; }
.timeline-line { position:relative; }
.timeline-line::before { content:""; position:absolute; left:6px; top:10px; bottom:-9px; width:1px; background:var(--line); }
.timeline-item:last-child .timeline-line::before { display:none; }
.timeline-dot { width:7px; height:7px; border-radius:50%; background:var(--accent); position:absolute; left:3px; top:4px; box-shadow:0 0 0 4px rgba(60,215,182,.07); }
.timeline-copy { font-size:9px; color:#c6d4dc; line-height:1.4; }
.timeline-copy span { display:block; color:var(--muted-2); font-size:8px; margin-top:2px; }
.page-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.module-card { min-height:170px; padding:15px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(150deg, rgba(17,37,56,.88), rgba(10,26,40,.88)); }
.module-card h3 { margin:13px 0 6px; font-size:12px; }
.module-card p { margin:0; font-size:9px; line-height:1.55; color:var(--muted); }
.module-icon { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; color:var(--accent); border:1px solid rgba(60,215,182,.23); background:var(--accent-soft); font-size:9px; font-weight:850; }
.module-foot { margin-top:16px; display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--muted-2); font-size:8px; }
.api-card { border:1px solid var(--line); border-radius:12px; padding:13px; background:rgba(255,255,255,.018); display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center; margin-bottom:9px; }
.api-name { font-size:10px; font-weight:750; }
.api-path { color:var(--muted-2); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:8px; margin-top:4px; }
.empty { padding:48px 20px; text-align:center; color:var(--muted); }
.empty strong { display:block; color:var(--text); font-size:13px; margin-bottom:6px; }
.footer-note { margin-top:16px; color:var(--muted-2); font-size:8px; text-align:right; }
@media (max-width:1200px){ .kpis{grid-template-columns:repeat(3,1fr)} .grid{grid-template-columns:1fr} .page-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:760px){ :root{--nav-w:70px}.brand-copy,.nav-link span:last-child,.nav-group-label,.sidebar-footer{display:none}.sidebar{padding:16px 9px}.brand{padding:0;justify-content:center}.nav-link{justify-content:center;padding:10px}.topbar{padding:0 12px}.search{display:none}.content{padding:16px 12px 30px}.kpis{grid-template-columns:repeat(2,1fr)}.page-grid{grid-template-columns:1fr}.section-head{align-items:flex-start;flex-direction:column}.city-chip{display:none}}

/* EP0.1.1 - admin-controlled branding */
.admin-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:12px; }
.branding-editor { display:grid; grid-template-columns:minmax(220px,.7fr) minmax(280px,1.3fr); gap:18px; align-items:center; }
.branding-preview { min-height:190px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(145deg,rgba(7,19,31,.88),rgba(14,34,49,.9)); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:22px; text-align:center; }
.branding-preview-label { color:var(--muted-2); text-transform:uppercase; font-size:8px; letter-spacing:.12em; margin-bottom:12px; }
.branding-logo-preview { width:72px; height:72px; border:1px solid rgba(60,215,182,.38); border-radius:18px; display:grid; place-items:center; color:var(--accent); background:linear-gradient(145deg,rgba(60,215,182,.16),rgba(97,201,255,.07)); padding:14px; }
.branding-logo-preview.custom { padding:7px; background:rgba(255,255,255,.035); }
.branding-logo-preview svg { width:42px; height:42px; }
.branding-preview-copy { margin-top:13px; display:flex; flex-direction:column; gap:4px; }
.branding-preview-copy strong { font-size:12px; }
.branding-preview-copy span { color:var(--muted-2); font-size:8px; text-transform:uppercase; letter-spacing:.1em; }
.branding-controls { min-width:0; }
.field-label { color:var(--text); font-size:10px; font-weight:750; }
.field-help { color:var(--muted); font-size:9px; line-height:1.55; margin-top:6px; max-width:540px; }
.button-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.ghost-btn:disabled { cursor:not-allowed; opacity:.38; }
.admin-safety-note { margin-top:16px; border:1px solid rgba(97,201,255,.16); background:rgba(97,201,255,.045); border-radius:10px; padding:11px 12px; display:flex; flex-direction:column; gap:5px; }
.admin-safety-note strong { color:var(--cyan); font-size:9px; }
.admin-safety-note span { color:var(--muted); font-size:8px; line-height:1.5; }
.admin-message { border:1px solid var(--line); border-radius:10px; padding:10px 12px; margin-bottom:12px; font-size:9px; }
.admin-message.green { color:var(--green); border-color:rgba(99,219,155,.25); background:rgba(99,219,155,.06); }
.admin-message.red { color:var(--red); border-color:rgba(255,123,120,.25); background:rgba(255,123,120,.06); }
.admin-message.gray { color:var(--muted); background:rgba(255,255,255,.02); }
.module-card.compact { min-height:130px; }
@media (max-width:1050px){ .admin-layout,.branding-editor{grid-template-columns:1fr} }

