/* ═══════════════════════════════════════════════════════════
   Central Zone Tracker v3 — Design System
   IBM Plex Sans · IBM Plex Mono · Navy/Gold Brand
   ═══════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

/* ── Design Tokens ─────────────────────────────────────────── */
:root {
  /* Brand */
  --navy: #0b1f3a; --navy2: #132d52; --navy3: #1a3a68;
  --gold: #f59e0b; --gold2: #fbbf24; --gold3: #fde68a;

  /* Surface scale (light) */
  --surface-0: #f0f4f9;  /* page bg */
  --surface-1: #ffffff;  /* card */
  --surface-2: #f8fafc;  /* hover / stripe */
  --surface-3: #e2e8f0;  /* border */
  --surface-4: #1e293b;  /* deep text / header */

  /* Semantic colors */
  --color-up:    #22c55e; --color-up-bg:    #dcfce7;
  --color-down:  #ef4444; --color-down-bg:  #fee2e2;
  --color-warn:  #f59e0b; --color-warn-bg:  #fef3c7;
  --color-info:  #3b82f6; --color-info-bg:  #dbeafe;
  --color-neutral: #64748b;

  /* Status */
  --done:  #22c55e; --prog:  #3b82f6; --pend:  #94a3b8;
  --issue: #ef4444; --block: #f97316;

  /* Typography */
  --text-xs:   10px; --text-sm:  12px; --text-base: 14px;
  --text-lg:   16px; --text-xl:  20px; --text-2xl:  24px; --text-3xl: 30px;

  /* Spacing */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-7: 28px; --space-8: 32px;

  /* Radius */
  --radius-sm: 6px; --radius: 8px; --radius-lg: 12px; --radius-xl: 16px;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.06);
  --shadow:    0 1px 3px rgba(0,0,0,.08), 0 4px 12px rgba(0,0,0,.05);
  --shadow-md: 0 4px 16px rgba(0,0,0,.10);
  --shadow-lg: 0 8px 32px rgba(0,0,0,.14);

  /* Transitions */
  --transition: all .2s cubic-bezier(.4,0,.2,1);
  --transition-fast: all .12s ease;

  /* Legacy aliases for v1/v2 compat */
  --bg: var(--surface-0); --white: var(--surface-1); --card: var(--surface-1);
  --text: var(--surface-4); --text2: var(--color-neutral); --border: var(--surface-3);
  --shadow2: var(--shadow-md);

  /* Region colors */
  --r1:#3b82f6;--r2:#22c55e;--r3:#a855f7;--r4:#f97316;--r5:#06b6d4;--r6:#ec4899;
}

/* Dark mode */
.dark {
  --surface-0: #0f172a; --surface-1: #1e293b; --surface-2: #263348;
  --surface-3: #334155; --surface-4: #f1f5f9;
  --color-neutral: #94a3b8;
  --bg: var(--surface-0); --white: var(--surface-1); --card: var(--surface-1);
  --text: var(--surface-4); --text2: var(--color-neutral); --border: var(--surface-3);
  --shadow:    0 1px 3px rgba(0,0,0,.3), 0 4px 12px rgba(0,0,0,.2);
  --shadow-md: 0 4px 16px rgba(0,0,0,.3);
}

/* ── Reset & Base ──────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { transition: background .3s, color .3s; }
body {
  font-family:'IBM Plex Sans',sans-serif;
  background:var(--surface-0); color:var(--surface-4);
  min-height:100vh; padding-bottom:60px;
  font-size:var(--text-base); line-height:1.55;
  transition: background .3s, color .3s;
}
.mono { font-family:'IBM Plex Mono',monospace; }
::-webkit-scrollbar { width:5px; height:5px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--surface-3); border-radius:3px; }
a { color:var(--color-info); text-decoration:none; }
a:hover { text-decoration:underline; }

/* ── Typography helpers ────────────────────────────────────── */
.text-xs  { font-size:var(--text-xs)!important; }
.text-sm  { font-size:var(--text-sm)!important; }
.text-base{ font-size:var(--text-base)!important; }
.text-lg  { font-size:var(--text-lg)!important; }
.text-xl  { font-size:var(--text-xl)!important; }
.text-muted { color:var(--color-neutral)!important; }
.text-right { text-align:right!important; }
.fw-600  { font-weight:600; }
.mt-8    { margin-top:8px; }
.mb-8    { margin-bottom:8px; }
.d-flex  { display:flex; }
.gap-8   { gap:8px; }

/* ── Navigation ────────────────────────────────────────────── */
nav {
  position:sticky; top:0; z-index:200;
  background:var(--navy);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 var(--space-5); height:54px;
  box-shadow:0 2px 12px rgba(0,0,0,.3);
}
.nav-brand { display:flex; align-items:center; gap:12px; color:#fff; text-decoration:none; }
.nav-logo {
  width:34px; height:34px; background:var(--gold); border-radius:var(--radius-sm);
  display:flex; align-items:center; justify-content:center;
  font-size:17px; font-weight:700; color:var(--navy); flex-shrink:0;
  box-shadow:0 2px 8px rgba(245,158,11,.4);
}
.nav-title { font-size:var(--text-base); font-weight:600; color:#fff; }
.nav-sub   { font-size:9px; color:rgba(255,255,255,.45); font-weight:400; letter-spacing:.3px; text-transform:uppercase; }
.nav-right { display:flex; align-items:center; gap:var(--space-2); }
.nav-user  { font-size:var(--text-xs); color:rgba(255,255,255,.55); }
.nav-btn {
  padding:5px 12px; border-radius:var(--radius-sm); font-size:var(--text-xs); font-weight:500;
  cursor:pointer; border:1px solid rgba(255,255,255,.18); background:transparent;
  color:rgba(255,255,255,.75); transition:var(--transition-fast); font-family:inherit;
}
.nav-btn:hover { background:rgba(255,255,255,.12); color:#fff; border-color:rgba(255,255,255,.35); }
.nav-btn.active { background:var(--gold); color:var(--navy); border-color:var(--gold); }
.nav-breadcrumb { font-size:var(--text-xs); color:rgba(255,255,255,.45); display:flex; align-items:center; gap:4px; }
.nav-breadcrumb a { color:rgba(255,255,255,.6); }
.nav-breadcrumb a:hover { color:var(--gold); }
.nav-breadcrumb span { color:rgba(255,255,255,.25); }

/* ── Tab Bar ─────────────────────────────────────────────────── */
.tab-bar {
  position:sticky; top:54px; z-index:190;
  background:var(--navy2);
  display:flex; padding:0 var(--space-5); gap:2px; overflow-x:auto;
  scrollbar-width:none; -ms-overflow-style:none;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.tab-bar::-webkit-scrollbar { display:none; }
.tab-btn {
  padding:0 var(--space-4); height:42px; font-size:var(--text-xs); font-weight:500;
  cursor:pointer; border:none; background:transparent; color:rgba(255,255,255,.55);
  white-space:nowrap; border-bottom:2px solid transparent; transition:var(--transition-fast);
  font-family:inherit; display:flex; align-items:center; gap:5px;
  position:relative;
}
.tab-btn:hover { color:rgba(255,255,255,.85); background:rgba(255,255,255,.06); }
.tab-btn.active { color:#fff; border-bottom-color:var(--gold); font-weight:600; }

/* ── Main content ────────────────────────────────────────────── */
.main-content { padding:var(--space-5); max-width:1600px; margin:0 auto; }
.page-header {
  display:flex; align-items:flex-start; justify-content:space-between;
  margin-bottom:var(--space-5); gap:var(--space-4); flex-wrap:wrap;
}
.page-title { font-size:var(--text-2xl); font-weight:700; color:var(--surface-4); letter-spacing:-.3px; }
.page-sub   { font-size:var(--text-sm); color:var(--color-neutral); margin-top:2px; }
.section-title {
  font-size:var(--text-xs); font-weight:700; text-transform:uppercase; letter-spacing:.8px;
  color:var(--color-neutral); margin-bottom:var(--space-3); margin-top:var(--space-5);
}
.divider { border:none; border-top:1px solid var(--surface-3); margin:var(--space-5) 0; }

/* ── Cards ───────────────────────────────────────────────────── */
.card {
  background:var(--surface-1); border-radius:var(--radius-lg); padding:var(--space-5);
  box-shadow:var(--shadow); border:1px solid var(--surface-3); transition:var(--transition);
}
.card:hover { box-shadow:var(--shadow-md); }
.card-title { font-size:var(--text-sm); font-weight:600; color:var(--surface-4); margin-bottom:var(--space-3); }
.card-sub   { font-size:var(--text-xs); color:var(--color-neutral); }
.cards-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:var(--space-4); }
.charts-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:var(--space-4); }

/* ── KPI Strip ───────────────────────────────────────────────── */
.kpi-strip { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:var(--space-3); margin-bottom:var(--space-5); }
.kpi {
  background:var(--surface-1); border-radius:var(--radius-lg); padding:var(--space-4);
  box-shadow:var(--shadow); border:1px solid var(--surface-3); position:relative; overflow:hidden;
  transition:var(--transition);
}
.kpi:hover { box-shadow:var(--shadow-md); transform:translateY(-1px); }
.kpi::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--surface-3); }
.kpi.blue::before   { background:var(--color-info); }
.kpi.green::before  { background:var(--color-up); }
.kpi.gold::before   { background:var(--gold); }
.kpi.red::before    { background:var(--color-down); }
.kpi.amber::before  { background:var(--color-warn); }
.kpi-label { font-size:var(--text-xs); color:var(--color-neutral); font-weight:500; text-transform:uppercase; letter-spacing:.4px; margin-bottom:var(--space-1); }
.kpi-val   { font-size:var(--text-2xl); font-weight:700; color:var(--surface-4); font-family:'IBM Plex Mono',monospace; letter-spacing:-.5px; }
.kpi-sub   { font-size:var(--text-xs); color:var(--color-neutral); margin-top:2px; }
.kpi-trend { font-size:var(--text-xs); font-weight:600; margin-top:var(--space-1); display:flex; align-items:center; gap:3px; }
.kpi-trend.up   { color:var(--color-up); }
.kpi-trend.down { color:var(--color-down); }
.kpi-trend.flat { color:var(--color-neutral); }
.kpi-spark  { margin-top:var(--space-2); height:24px; }

/* ── Region cards ────────────────────────────────────────────── */
.region-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:var(--space-4); }
.region-card {
  border-radius:var(--radius-lg); padding:var(--space-5); position:relative; overflow:hidden;
  transition:var(--transition); cursor:pointer; border:1px solid rgba(255,255,255,.15);
  text-decoration:none; color:#fff; display:block;
}
.region-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.region-card.r1{background:linear-gradient(135deg,#1d4ed8,#3b82f6);}
.region-card.r2{background:linear-gradient(135deg,#15803d,#22c55e);}
.region-card.r3{background:linear-gradient(135deg,#7e22ce,#a855f7);}
.region-card.r4{background:linear-gradient(135deg,#c2410c,#f97316);}
.region-card.r5{background:linear-gradient(135deg,#0e7490,#06b6d4);}
.region-card.r6{background:linear-gradient(135deg,#be185d,#ec4899);}
.region-card-name { font-size:var(--text-lg); font-weight:700; margin-bottom:var(--space-2); }
.region-card-stats { display:flex; gap:var(--space-4); margin-top:var(--space-3); font-size:var(--text-xs); opacity:.85; }
.region-card-stat strong { font-family:'IBM Plex Mono',monospace; font-size:var(--text-sm); }
.region-progress { margin-top:var(--space-3); height:4px; background:rgba(255,255,255,.2); border-radius:2px; }
.region-progress-fill { height:100%; background:#fff; border-radius:2px; transition:width 1s cubic-bezier(.4,0,.2,1); }
.region-empty { opacity:.65; border:2px dashed rgba(255,255,255,.25); }

/* ── Tables ──────────────────────────────────────────────────── */
.tbl-wrap { overflow-x:auto; border-radius:var(--radius-lg); border:1px solid var(--surface-3); background:var(--surface-1); }
.tbl-wrap table { border-collapse:collapse; width:100%; }
.tbl-wrap th {
  background:var(--navy); color:#fff; padding:9px 12px;
  font-size:var(--text-xs); font-weight:600; text-transform:uppercase; letter-spacing:.5px;
  position:sticky; top:0; z-index:2; white-space:nowrap; cursor:pointer; user-select:none;
}
.tbl-wrap th:hover { background:var(--navy2); }
.tbl-wrap th.sorted-asc::after  { content:' ↑'; opacity:.7; }
.tbl-wrap th.sorted-desc::after { content:' ↓'; opacity:.7; }
.tbl-wrap td { padding:8px 12px; border-bottom:1px solid var(--surface-3); font-size:var(--text-sm); vertical-align:middle; }
.tbl-wrap tr:last-child td { border-bottom:none; }
.tbl-wrap tr:hover td { background:var(--surface-2); }
.tbl-footer td { background:var(--navy)!important; color:#fff!important; font-weight:600; font-family:'IBM Plex Mono',monospace; font-size:var(--text-xs); }
.tbl-scroll-fade { position:relative; }
.tbl-scroll-fade::after { content:''; position:absolute; right:0; top:0; bottom:0; width:32px; background:linear-gradient(to right,transparent,var(--surface-1)); pointer-events:none; }

/* ── Badges ──────────────────────────────────────────────────── */
.badge {
  display:inline-flex; align-items:center; padding:2px 8px; border-radius:100px;
  font-size:var(--text-xs); font-weight:500; white-space:nowrap; letter-spacing:.2px;
  background:var(--surface-2); color:var(--surface-4);
}
.badge-rsa { background:#dbeafe; color:#1e40af; }
.badge-asa { background:#dcfce7; color:#166534; }
.badge-ksa { background:#f3e8ff; color:#6b21a8; }
.badge-bsa { background:#ffedd5; color:#9a3412; }
.badge-y1  { background:#cffafe; color:#155e75; }
.badge-y2  { background:#dcfce7; color:#166534; }
.badge-y3  { background:#fef9c3; color:#713f12; }
.badge-done,.badge-completed { background:#dcfce7; color:#166534; }
.badge-in-progress { background:#dbeafe; color:#1e40af; }
.badge-work-to-be-started,.badge-pending { background:#fef9c3; color:#92400e; }
.badge-issue,.badge-blocked { background:#fee2e2; color:#991b1b; }
.badge-dealer { background:#dbeafe; color:#1e40af; }
.badge-hpcl   { background:#fef3c7; color:#92400e; }
.badge-joint  { background:#f3e8ff; color:#6b21a8; }
.badge-good   { background:#dcfce7; color:#166534; }
.badge-fair   { background:#fef9c3; color:#92400e; }
.badge-poor   { background:#fee2e2; color:#991b1b; }
.badge-full   { background:#dcfce7; color:#166534; }
.badge-partial{ background:#fef9c3; color:#92400e; }
.badge-none   { background:#f1f5f9; color:#475569; }
.badge-condemned,.badge-disposed { background:#fee2e2; color:#991b1b; }
.badge-star   { background:linear-gradient(135deg,#fef3c7,#fde68a); color:#92400e; font-weight:600; }

/* ── Exhibit / Analytics labels ─────────────────────────────── */
.exhibit { counter-increment:exhibit; }
.exhibit-label {
  font-size:var(--text-xs); font-weight:700; text-transform:uppercase; letter-spacing:.6px;
  color:var(--color-neutral); margin-bottom:var(--space-1);
}
.exhibit-label::before { content:'Exhibit '  counter(exhibit) ' — '; }
.insight-box {
  background:linear-gradient(135deg,#eff6ff,#dbeafe); border-left:3px solid var(--color-info);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0; padding:var(--space-2) var(--space-3);
  margin-top:var(--space-2); font-size:var(--text-xs); color:#1e3a5f; line-height:1.5;
}
.dark .insight-box { background:linear-gradient(135deg,#1e3a5f,#1e40af22); color:#93c5fd; }
.insight-box strong { color:var(--color-info); }
.insight-box .up   { color:var(--color-up);   font-weight:600; }
.insight-box .down { color:var(--color-down); font-weight:600; }
.counter-exhibits { counter-reset:exhibit; }

/* Traffic light indicators */
.traffic-green  { color:var(--color-up);   }
.traffic-amber  { color:var(--color-warn); }
.traffic-red    { color:var(--color-down); }
.tl-dot {
  display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:4px;
}
.tl-dot.green { background:var(--color-up); }
.tl-dot.amber { background:var(--color-warn); }
.tl-dot.red   { background:var(--color-down); }

/* Directional indicators */
.dir-up   { color:var(--color-up);      font-weight:600; }
.dir-down { color:var(--color-down);    font-weight:600; }
.dir-flat { color:var(--color-neutral); }

/* ── Buttons ─────────────────────────────────────────────────── */
.btn-group { display:flex; gap:var(--space-2); flex-wrap:wrap; }
.btn {
  padding:7px 14px; border-radius:var(--radius-sm); font-size:var(--text-sm); font-weight:500;
  cursor:pointer; border:1px solid var(--surface-3); background:var(--surface-1);
  color:var(--surface-4); transition:var(--transition-fast); font-family:inherit;
  display:inline-flex; align-items:center; gap:5px; white-space:nowrap; text-decoration:none;
}
.btn:hover { border-color:var(--surface-4); background:var(--surface-2); }
.btn-primary { background:var(--color-info); color:#fff; border-color:var(--color-info); }
.btn-primary:hover { background:#2563eb; border-color:#2563eb; }
.btn-gold    { background:var(--gold); color:var(--navy); border-color:var(--gold); font-weight:600; }
.btn-gold:hover { background:var(--gold2); border-color:var(--gold2); }
.btn-danger  { background:var(--color-down); color:#fff; border-color:var(--color-down); }
.btn-danger:hover { background:#dc2626; }
.btn-xs { padding:3px 8px; font-size:var(--text-xs); }
.btn-sm { padding:5px 10px; font-size:var(--text-xs); }

/* ── Forms ───────────────────────────────────────────────────── */
.form-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:var(--space-3); }
.form-group { display:flex; flex-direction:column; gap:var(--space-1); }
.form-group label { font-size:var(--text-xs); font-weight:600; color:var(--color-neutral); text-transform:uppercase; letter-spacing:.4px; }
input[type=text],input[type=number],input[type=email],input[type=password],input[type=date],input[type=month],
select,textarea {
  padding:8px 10px; border:1px solid var(--surface-3); border-radius:var(--radius-sm);
  font-size:var(--text-sm); font-family:inherit; background:var(--surface-1); color:var(--surface-4);
  transition:var(--transition-fast); width:100%;
}
input:focus,select:focus,textarea:focus { outline:none; border-color:var(--color-info); box-shadow:0 0 0 3px rgba(59,130,246,.12); }
input:hover,select:hover { border-color:var(--color-neutral); }

/* ── Filter bar ──────────────────────────────────────────────── */
.filter-bar {
  display:flex; flex-wrap:wrap; gap:var(--space-2); align-items:center;
  background:var(--surface-1); padding:var(--space-3) var(--space-4);
  border-radius:var(--radius-lg); border:1px solid var(--surface-3);
  box-shadow:var(--shadow-sm); margin-bottom:var(--space-4);
}
.filter-bar select,.filter-bar input { min-width:130px; max-width:200px; }
.filter-toggle { font-size:var(--text-xs); color:var(--color-info); cursor:pointer; font-weight:500; }

/* ── Modals ──────────────────────────────────────────────────── */
.modal-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:1000;
  display:flex; align-items:center; justify-content:center; padding:var(--space-4);
  backdrop-filter:blur(2px);
}
.modal-overlay.hidden { display:none; }
.modal {
  background:var(--surface-1); border-radius:var(--radius-xl); padding:var(--space-6);
  width:min(560px,96vw); max-height:90vh; overflow-y:auto;
  box-shadow:var(--shadow-lg); animation:slideUp .2s cubic-bezier(.34,1.56,.64,1);
  border:1px solid var(--surface-3);
}
.modal-lg { width:min(760px,96vw); }
.modal-xl { width:min(1000px,96vw); }
/* Slide-in from right (for edit panels) */
.drawer-overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:1000; backdrop-filter:blur(2px); }
.drawer-overlay.hidden { display:none; }
.drawer {
  position:fixed; right:0; top:0; bottom:0; width:min(520px,96vw);
  background:var(--surface-1); box-shadow:-8px 0 32px rgba(0,0,0,.2);
  z-index:1001; overflow-y:auto; padding:var(--space-6);
  animation:slideInRight .22s cubic-bezier(.4,0,.2,1);
  border-left:1px solid var(--surface-3);
}
.modal-title {
  font-size:var(--text-lg); font-weight:700; color:var(--surface-4);
  display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--space-5);
}
.modal-close {
  width:28px; height:28px; border-radius:50%; border:none; background:var(--surface-2);
  cursor:pointer; font-size:14px; display:flex; align-items:center; justify-content:center;
  color:var(--color-neutral); transition:var(--transition-fast);
}
.modal-close:hover { background:var(--surface-3); color:var(--surface-4); }
.modal-actions { display:flex; justify-content:flex-end; gap:var(--space-2); margin-top:var(--space-5); padding-top:var(--space-4); border-top:1px solid var(--surface-3); }

/* ── Sub-tabs ────────────────────────────────────────────────── */
.subtab-bar { display:flex; gap:2px; background:var(--surface-0); padding:3px; border-radius:var(--radius-sm); margin-bottom:var(--space-4); flex-wrap:wrap; border:1px solid var(--surface-3); }
.subtab-btn { padding:5px 14px; border-radius:5px; font-size:var(--text-xs); font-weight:500; cursor:pointer; border:none; background:transparent; color:var(--color-neutral); font-family:inherit; transition:var(--transition-fast); }
.subtab-btn.active { background:var(--surface-1); color:var(--navy); box-shadow:var(--shadow-sm); font-weight:600; }
.subtab-btn:hover:not(.active) { background:rgba(255,255,255,.6); color:var(--surface-4); }

/* ── Charts ──────────────────────────────────────────────────── */
.chart-title { font-size:var(--text-sm); font-weight:600; color:var(--surface-4); margin-bottom:var(--space-3); }
.bar-row { display:flex; align-items:center; gap:var(--space-2); margin-bottom:var(--space-2); }
.bar-label { width:130px; font-size:var(--text-xs); color:var(--surface-4); flex-shrink:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bar-track { flex:1; height:14px; background:var(--surface-2); border-radius:100px; overflow:hidden; }
.bar-fill  { height:100%; border-radius:100px; transition:width .9s cubic-bezier(.4,0,.2,1); }
.bar-val   { font-size:var(--text-xs); font-family:'IBM Plex Mono',monospace; color:var(--color-neutral); width:50px; text-align:right; }
.donut-wrap { display:flex; align-items:center; gap:var(--space-4); }
.donut-legend { display:flex; flex-direction:column; gap:var(--space-1); }
.legend-item { display:flex; align-items:center; gap:6px; font-size:var(--text-xs); color:var(--surface-4); }
.legend-dot  { width:8px; height:8px; border-radius:50%; flex-shrink:0; }

/* Sparkline */
.trend-svg polyline { stroke-linecap:round; stroke-linejoin:round; }
.sparkline { display:inline-block; vertical-align:middle; }

/* Heat table */
.heat-table td.heat { border-radius:4px; text-align:center; font-size:var(--text-xs); font-family:'IBM Plex Mono',monospace; font-weight:600; }

/* Scatterplot */
.scatter-dot { cursor:pointer; transition:r .15s; }
.scatter-dot:hover { r:8; }

/* ── Volume matrix ───────────────────────────────────────────── */
.vol-matrix { overflow-x:auto; border-radius:var(--radius-lg); border:1px solid var(--surface-3); }
.vol-matrix table { border-collapse:collapse; white-space:nowrap; min-width:600px; }
.vol-matrix th { background:var(--navy); color:#fff; padding:7px 10px; font-size:var(--text-xs); font-weight:600; text-transform:uppercase; letter-spacing:.4px; position:sticky; top:0; }
.vol-matrix th.freeze { position:sticky; left:0; z-index:2; background:var(--navy2); }
.vol-matrix td { padding:6px 10px; border-bottom:1px solid var(--surface-3); font-size:var(--text-xs); }
.vol-matrix td.freeze { position:sticky; left:0; background:var(--surface-1); font-weight:500; z-index:1; border-right:2px solid var(--surface-3); }
.vol-matrix tr:hover td { background:var(--surface-2); }
.vol-matrix tr:hover td.freeze { background:var(--surface-2); }
.vol-cell-pos { color:var(--color-up); font-weight:600; }
.vol-cell-neg { color:var(--color-down); font-weight:600; }

/* ── GPS / SVG Map ───────────────────────────────────────────── */
.svgmap { border-radius:var(--radius-lg); background:var(--surface-0); border:1px solid var(--surface-3); }

/* ── Alerts ──────────────────────────────────────────────────── */
.alert { padding:var(--space-3) var(--space-4); border-radius:var(--radius-sm); font-size:var(--text-sm); margin-bottom:var(--space-4); }
.alert-success { background:#dcfce7; color:#166534; border:1px solid #bbf7d0; }
.alert-error   { background:#fee2e2; color:#991b1b; border:1px solid #fecaca; }
.alert-warn    { background:#fef3c7; color:#92400e; border:1px solid #fde68a; }
.alert-info    { background:#dbeafe; color:#1e40af; border:1px solid #bfdbfe; }

/* ── Toast notifications ─────────────────────────────────────── */
.toast-container { position:fixed; bottom:24px; right:24px; z-index:9999; display:flex; flex-direction:column; gap:8px; pointer-events:none; }
.toast {
  background:var(--surface-4); color:var(--surface-0); padding:10px 16px; border-radius:var(--radius);
  font-size:var(--text-sm); box-shadow:var(--shadow-lg); pointer-events:all;
  animation:slideInRight .25s cubic-bezier(.34,1.56,.64,1); max-width:320px; position:relative; overflow:hidden;
}
.toast.success { background:#166534; }
.toast.error   { background:#991b1b; }
.toast.warn    { background:#92400e; }
.toast-progress { position:absolute; bottom:0; left:0; height:2px; background:rgba(255,255,255,.4); animation:toastProgress 4s linear forwards; }

/* ── Drop zone ───────────────────────────────────────────────── */
.drop-zone {
  border:2px dashed var(--surface-3); border-radius:var(--radius-lg); padding:var(--space-7) var(--space-5);
  text-align:center; cursor:pointer; transition:var(--transition); background:var(--surface-0); color:var(--color-neutral);
}
.drop-zone:hover,.drop-zone.over { border-color:var(--color-info); background:var(--color-info-bg); color:var(--color-info); }
.drop-zone input[type=file] { display:none; }
.drop-zone-icon { font-size:28px; margin-bottom:var(--space-2); }

/* ── Skeleton shimmer ────────────────────────────────────────── */
.skeleton { background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 50%,var(--surface-2) 75%); background-size:200% 100%; animation:shimmer 1.5s infinite; border-radius:var(--radius-sm); }
.skeleton-text  { height:12px; margin-bottom:6px; }
.skeleton-title { height:20px; width:60%; margin-bottom:8px; }
.skeleton-card  { height:120px; border-radius:var(--radius-lg); }

/* ── Footer ──────────────────────────────────────────────────── */
.footer-bar {
  position:fixed; bottom:0; left:0; right:0; z-index:100;
  background:var(--navy); color:rgba(255,255,255,.55);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 var(--space-5); height:34px; font-size:var(--text-xs);
}
.footer-stats { display:flex; gap:var(--space-5); }
.footer-stat  { display:flex; align-items:center; gap:4px; }
.footer-stat strong { color:rgba(255,255,255,.85); font-family:'IBM Plex Mono',monospace; }

/* ── Empty states ────────────────────────────────────────────── */
.empty-state { text-align:center; padding:var(--space-8); color:var(--color-neutral); }
.empty-state-icon  { font-size:40px; margin-bottom:var(--space-3); opacity:.5; }
.empty-state-title { font-size:var(--text-lg); font-weight:600; color:var(--surface-4); margin-bottom:var(--space-2); }
.empty-state-sub   { font-size:var(--text-sm); margin-bottom:var(--space-5); }

/* ── Animations ──────────────────────────────────────────────── */
@keyframes slideUp        { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:none} }
@keyframes slideInRight   { from{opacity:0;transform:translateX(32px)} to{opacity:1;transform:none} }
@keyframes shimmer        { 0%{background-position:200% 0} 100%{background-position:-200% 0} }
@keyframes toastProgress  { from{width:100%} to{width:0} }
@keyframes fadeIn         { from{opacity:0} to{opacity:1} }
.animate { animation:fadeIn .3s ease forwards; }
.animate-row { animation:slideUp .25s ease both; }

/* ── Responsive ──────────────────────────────────────────────── */
@media(max-width:768px) {
  .main-content { padding:var(--space-3); }
  .page-header  { flex-direction:column; }
  .kpi-strip    { grid-template-columns:repeat(2,1fr); }
  .region-grid  { grid-template-columns:1fr; }
  .charts-grid  { grid-template-columns:1fr; }
  .filter-bar   { display:none; }
  .filter-bar.mobile-open { display:flex; flex-direction:column; }
  .filter-toggle-btn { display:flex; }
  .tab-btn      { padding:0 var(--space-3); font-size:9px; height:38px; }
  .form-grid    { grid-template-columns:1fr; }
}
@media(max-width:600px) {
  .modal,.drawer { width:100%; border-radius:var(--radius-xl) var(--radius-xl) 0 0; position:fixed; bottom:0; left:0; right:0; max-height:90vh; animation:slideUp .25s ease; }
  .modal-overlay { align-items:flex-end; padding:0; }
}
@media(min-width:769px) { .filter-toggle-btn { display:none; } }

/* ── Edit button hover visibility ───────────────────────────── */
.edit-btn { opacity:0; transition:opacity .15s; }
tr:hover .edit-btn { opacity:1; }

/* ── Config section ──────────────────────────────────────────── */
.config-section-title { font-size:var(--text-sm); font-weight:700; color:var(--surface-4); margin-bottom:var(--space-3); }

/* ── Scenario / projection labels ───────────────────────────── */
.scenario-base  { color:var(--color-info);    }
.scenario-up    { color:var(--color-up);      }
.scenario-stress{ color:var(--color-down);    }
.confidence-band { opacity:.15; }

/* ── Market share heat colors (inline via style) ─────────────── */
/* Applied programmatically: green(>40%), amber(20-40%), red(<20%) */

/* ── BCG quadrant labels ─────────────────────────────────────── */
.quadrant-label { font-size:var(--text-xs); font-weight:700; text-transform:uppercase; letter-spacing:.5px; opacity:.4; }

/* ═══════════════════════════════════════════════
   V3 ADDITIONS — Design Tokens, Components, Dark
═══════════════════════════════════════════════ */
:root {
  --surface-2: #f1f4f9;
  --surface-3: #e2e6ef;
  --surface-4: #0b1f3a;
  --color-up:   #10b981;
  --color-down: #ef4444;
  --color-warn: #f59e0b;
  --color-info: #3b82f6;
  --color-neutral: #6b7280;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --shadow-sm: 0 1px 3px rgba(11,31,58,.08);
  --shadow-md: 0 4px 12px rgba(11,31,58,.12);
  --shadow-lg: 0 8px 24px rgba(11,31,58,.18);
}
.dark {
  --surface-0:#0f172a; --surface-1:#1e293b; --surface-2:#263348;
  --surface-3:#30363d; --surface-4:#f59e0b;
  --bg:var(--surface-0); --white:var(--surface-1); --card:var(--surface-1);
  --text-primary:#e6edf3; --text-secondary:#8b949e; --text-muted:#484f58;
  --color-neutral:#6b7280;
}
/* KPI enhancements */
.kpi-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); }
.kpi-arrow-up   { color:var(--color-up); }
.kpi-arrow-down { color:var(--color-down); }
.kpi-arrow-flat { color:var(--color-neutral); }
/* Exhibit cards */
.exhibit { position:relative; }
.exhibit-label {
  font-size:var(--text-xs); font-weight:700; text-transform:uppercase;
  letter-spacing:.6px; color:var(--color-neutral); margin-bottom:var(--space-2);
}
.exhibit-number {
  font-size:9px; color:var(--color-neutral); position:absolute;
  top:var(--space-3); right:var(--space-4);
}
.insight-box {
  background:rgba(59,130,246,.08); border-left:3px solid var(--color-info);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  padding:8px 12px; font-size:11px; color:var(--text-secondary);
  margin-top:var(--space-3); line-height:1.5;
}
.insight-box strong { color:var(--text-primary); }
/* Traffic lights */
.tl-green  { background:rgba(16,185,129,.15); color:#065f46; border-radius:12px; padding:2px 8px; font-size:10px; font-weight:600; }
.tl-amber  { background:rgba(245,158,11,.15);  color:#92400e; border-radius:12px; padding:2px 8px; font-size:10px; font-weight:600; }
.tl-red    { background:rgba(239,68,68,.15);   color:#991b1b; border-radius:12px; padding:2px 8px; font-size:10px; font-weight:600; }
/* CPI bar */
.cpi-bar-track { height:6px; background:var(--surface-3); border-radius:3px; flex:1; min-width:60px; overflow:hidden; }
.cpi-bar-fill  { height:6px; border-radius:3px; transition:width .6s ease; }
/* Scenario lines */
.scenario-base    { color:var(--color-info); }
.scenario-upside  { color:var(--color-up); }
.scenario-stress  { color:var(--color-down); }
/* Analytics tabs */
.atab-bar { display:flex; gap:2px; padding:0 var(--space-5); overflow-x:auto; background:var(--brand-navy); }
.atab-btn {
  padding:0 16px; height:38px; font-size:11px; font-weight:500;
  color:rgba(255,255,255,.55); border:none; background:none; cursor:pointer;
  border-bottom:2px solid transparent; white-space:nowrap;
  transition:color .15s, border-color .15s;
}
.atab-btn.active { color:#fff; border-bottom-color:var(--brand-gold); }
.atab-btn:hover  { color:rgba(255,255,255,.85); }
/* Drawer (slide-in right) */
.drawer-overlay { position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:200;display:flex;justify-content:flex-end; }
.drawer-overlay.hidden { display:none; }
.drawer-panel {
  width:min(480px,96vw); height:100vh; background:var(--surface-1);
  overflow-y:auto; padding:var(--space-5); position:relative;
  box-shadow:-8px 0 32px rgba(0,0,0,.15);
  animation:slideInRight .25s ease;
}
@keyframes slideInRight { from{transform:translateX(100%)} to{transform:translateX(0)} }
/* Toast container */
#toastContainer { position:fixed;bottom:20px;right:20px;z-index:9998;display:flex;flex-direction:column;gap:8px; }
.toast {
  padding:10px 16px; border-radius:var(--radius-md); font-size:12px;
  min-width:220px; max-width:320px; box-shadow:var(--shadow-lg);
  color:#fff; position:relative; overflow:hidden;
  animation:slideInToast .25s ease;
}
@keyframes slideInToast { from{transform:translateX(120%);opacity:0} to{transform:translateX(0);opacity:1} }
.toast.success { background:#065f46; }
.toast.error   { background:#991b1b; }
.toast.info    { background:#1e40af; }
.toast.warning { background:#92400e; }
.toast-progress {
  position:absolute;bottom:0;left:0;height:3px;background:rgba(255,255,255,.4);
  width:100%;animation:toastProgress var(--toast-dur,4s) linear forwards;
}
@keyframes toastProgress { from{width:100%} to{width:0} }
/* Skeleton shimmer */
.skeleton {
  background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 50%,var(--surface-2) 75%);
  background-size:200% 100%;
  animation:shimmer 1.5s infinite; border-radius:var(--radius-sm);
}
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }
.skeleton-text  { height:12px; margin:4px 0; }
.skeleton-title { height:20px; width:60%; }
.skeleton-kpi   { height:60px; }
/* Status popover */
.status-popover {
  position:absolute; z-index:100; background:var(--surface-1);
  border:1px solid var(--surface-3); border-radius:var(--radius-md);
  padding:var(--space-3); box-shadow:var(--shadow-lg);
  min-width:220px; top:100%; left:0; margin-top:4px;
}
.status-badge { cursor:pointer; user-select:none; }
.status-badge:hover { opacity:.8; }
/* Asset cards */
.asset-card {
  background:var(--surface-1); border-radius:var(--radius-lg);
  border:1px solid var(--surface-3); padding:var(--space-4);
  transition:box-shadow .2s,transform .2s;
}
.asset-card:hover { box-shadow:var(--shadow-md); transform:translateY(-1px); }
.asset-icon { font-size:28px; margin-bottom:var(--space-2); }
.asset-name { font-size:var(--text-sm); font-weight:600; color:var(--text-primary); }
.asset-meta { font-size:var(--text-xs); color:var(--color-neutral); margin-top:2px; }
.depr-row   { display:flex;justify-content:space-between;font-size:11px;padding:3px 0;border-bottom:1px solid var(--surface-2); }
/* Warranty badges */
.warranty-ok      { background:rgba(16,185,129,.12); color:#065f46; }
.warranty-warn    { background:rgba(245,158,11,.15);  color:#92400e; }
.warranty-expired { background:rgba(239,68,68,.15);   color:#991b1b; }
/* Index bars (peer benchmark) */
.idx-bar-wrap { display:flex;align-items:center;gap:6px;font-size:11px; }
.idx-bar-track{ flex:1;height:8px;background:var(--surface-2);border-radius:4px;position:relative;overflow:visible; }
.idx-bar-fill { height:8px;border-radius:4px;position:absolute;top:0; }
.idx-mark100  { position:absolute;top:-3px;height:14px;width:1.5px;background:var(--color-neutral);border-radius:1px; }
/* Opportunity score */
.opp-score { font-size:22px;font-weight:800;font-family:var(--mono);color:var(--brand-navy); }
.opp-bar   { height:4px;border-radius:2px;background:linear-gradient(90deg,var(--color-down),var(--color-warn),var(--color-up)); }
/* Executive brief */
.brief-block {
  background:var(--surface-1); border-radius:var(--radius-lg);
  border-left:4px solid var(--brand-gold); padding:var(--space-5);
  margin-bottom:var(--space-4);
}
.brief-block-title { font-size:var(--text-xs); font-weight:700; text-transform:uppercase; letter-spacing:.8px; color:var(--brand-gold); margin-bottom:var(--space-3); }
.brief-narrative { font-size:13px; line-height:1.7; color:var(--text-secondary); }
.brief-narrative strong { color:var(--text-primary); }
/* Source badge */
.source-badge { display:inline-flex;align-items:center;gap:3px;font-size:9px;font-weight:600;padding:1px 6px;border-radius:10px;background:rgba(59,130,246,.1);color:var(--color-info); }
/* Competitor triangle marker in text */
.brand-ioc    { color:#1d4ed8; } .brand-bpcl { color:#dc2626; }
.brand-shell  { color:#ca8a04; } .brand-nayara{ color:#7c3aed; }
/* Responsive */
@media(max-width:600px) {
  .drawer-panel { width:100vw; }
  .atab-btn { padding:0 10px; font-size:10px; }
  .charts-grid { grid-template-columns:1fr; }
  .kpi-strip { grid-template-columns:repeat(2,1fr); }
}

/* ═══════════════════════════════════════════════════════════
   v3 ADDITIONS — Dark Mode · Toasts · Drawers · Analytics
   ═══════════════════════════════════════════════════════════ */

/* Dark mode token overrides */
[data-theme="dark"] {
  --surface-0:#0d1117; --surface-1:#161b22; --surface-2:#21262d;
  --surface-3:#30363d; --surface-4:#f59e0b;
  --text-primary:#e6edf3; --text-secondary:#8b949e; --text-muted:#484f58;
  --shadow:0 1px 3px rgba(0,0,0,.3),0 4px 12px rgba(0,0,0,.2);
}
[data-theme="dark"] body{background:var(--surface-0);color:var(--text-primary);}
[data-theme="dark"] .card,[data-theme="dark"] .kpi-card{background:var(--surface-1);border-color:var(--surface-3);}
[data-theme="dark"] table thead tr{background:var(--surface-2);}
[data-theme="dark"] .nav-btn,[data-theme="dark"] .tab-btn{color:var(--text-secondary);}
[data-theme="dark"] .tab-btn.active{color:#fff;}
[data-theme="dark"] input,[data-theme="dark"] select,[data-theme="dark"] textarea{background:var(--surface-2);color:var(--text-primary);border-color:var(--surface-3);}

/* Toast notifications */
.toast-container{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:9999;}
.toast{display:flex;flex-direction:column;background:#fff;border:1px solid var(--surface-3);border-radius:var(--radius);padding:10px 14px;box-shadow:var(--shadow-md);min-width:260px;max-width:360px;transform:translateY(20px);opacity:0;transition:all .25s cubic-bezier(.4,0,.2,1);}
.toast.show{transform:translateY(0);opacity:1;}
.toast-success{border-left:3px solid var(--color-up);}
.toast-error{border-left:3px solid var(--color-down);}
.toast-warn{border-left:3px solid var(--color-warn);}
.toast-info{border-left:3px solid var(--color-info);}
.toast-progress{height:2px;background:var(--surface-3);margin-top:8px;border-radius:1px;width:100%;}

/* Drawer (slide-in right) */
.drawer-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:800;align-items:stretch;justify-content:flex-end;}
.drawer-panel{background:var(--surface-1);width:min(480px,95vw);height:100%;overflow-y:auto;transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;}
.drawer-overlay.open .drawer-panel{transform:translateX(0);}
.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--surface-3);font-weight:600;font-size:var(--text-lg);}
.drawer-body{padding:20px;flex:1;}
.drawer-close{background:none;border:none;font-size:20px;cursor:pointer;color:var(--text-muted);padding:4px;}

/* KPI Card upgrades */
.kpi-card{position:relative;overflow:hidden;transition:var(--transition);}
.kpi-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.kpi-trend{display:flex;align-items:center;gap:6px;margin-top:4px;font-size:var(--text-sm);}
.trend-up{color:var(--color-up);font-weight:600;}
.trend-down{color:var(--color-down);font-weight:600;}
.trend-flat{color:var(--text-muted);font-weight:500;}
.kpi-spark{margin-top:6px;opacity:.7;}

/* Skeleton shimmer */
.skeleton{background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 50%,var(--surface-2) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-sm);}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.skel-text{height:14px;margin-bottom:8px;border-radius:3px;}
.skel-card{height:80px;border-radius:var(--radius);}

/* Analytics exhibit style */
.exhibit{background:var(--surface-1);border:1px solid var(--surface-3);border-radius:var(--radius-lg);padding:var(--space-5);margin-bottom:var(--space-5);}
.exhibit-label{font-size:var(--text-xs);font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px;}
.exhibit-title{font-size:var(--text-base);font-weight:600;color:var(--text-primary);margin-bottom:var(--space-4);}
.insight-box{background:linear-gradient(135deg,#eff6ff,#dbeafe);border-left:3px solid var(--color-info);border-radius:0 var(--radius) var(--radius) 0;padding:10px 14px;margin-top:var(--space-3);font-size:var(--text-sm);color:#1e3a8a;line-height:1.5;}
[data-theme="dark"] .insight-box{background:linear-gradient(135deg,#1e3a5f,#1e3a8a20);color:#93c5fd;}
.insight-box strong{font-weight:700;}

/* Scenario badges */
.badge-base{background:#dbeafe;color:#1e40af;}
.badge-upside{background:#dcfce7;color:#166534;}
.badge-stress{background:#fee2e2;color:#991b1b;}

/* Source attribution badge */
.source-badge{display:inline-block;font-size:10px;padding:2px 6px;border-radius:10px;background:var(--surface-2);color:var(--text-muted);border:1px solid var(--surface-3);vertical-align:middle;margin-left:6px;}

/* Investment matrix quadrant chips */
.quad-prioritize{color:#166534;font-weight:600;}
.quad-deprioritize{color:#991b1b;}

/* Table upgrades v3 */
table.flat th{background:var(--surface-0);border-bottom:2px solid var(--surface-3);}
table.flat tr:hover td{background:var(--surface-2);}
th[data-sort]{cursor:pointer;user-select:none;}
th[data-sort]::after{content:' ⇅';opacity:.4;font-size:.85em;}
th[data-sort][data-dir="asc"]::after{content:' ↑';opacity:.8;}
th[data-sort][data-dir="desc"]::after{content:' ↓';opacity:.8;}

/* Rank + percentile cells */
.rank-cell{font-variant-numeric:tabular-nums;font-family:'IBM Plex Mono',monospace;font-weight:600;}
.pct-bar{display:flex;align-items:center;gap:6px;}
.pct-bar-inner{flex:1;height:4px;background:var(--surface-3);border-radius:2px;overflow:hidden;}
.pct-bar-fill{height:100%;border-radius:2px;transition:width .5s ease;}

/* CPI traffic light */
.cpi-star{color:#166534;background:#dcfce7;border-radius:20px;padding:2px 10px;font-size:var(--text-xs);font-weight:700;}
.cpi-ok{color:#92400e;background:#fef3c7;border-radius:20px;padding:2px 10px;font-size:var(--text-xs);font-weight:700;}
.cpi-watch{color:#991b1b;background:#fee2e2;border-radius:20px;padding:2px 10px;font-size:var(--text-xs);font-weight:700;}
.cpi-critical{color:#fff;background:#7f1d1d;border-radius:20px;padding:2px 10px;font-size:var(--text-xs);font-weight:700;}

/* Capture rate indicators */
.capture-high{color:var(--color-up);}
.capture-mid{color:var(--color-warn);}
.capture-low{color:var(--color-down);}

/* Executive brief layout */
.brief-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);}
.brief-section{background:var(--surface-1);border:1px solid var(--surface-3);border-radius:var(--radius-lg);padding:var(--space-5);}
.brief-section-title{font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:var(--space-3);}
.brief-kpi-row{display:flex;gap:var(--space-4);flex-wrap:wrap;}
.brief-kpi-block{flex:1;min-width:100px;}
.brief-kpi-num{font-size:var(--text-2xl);font-weight:700;font-family:'IBM Plex Mono',monospace;color:var(--text-primary);}
.brief-kpi-label{font-size:var(--text-xs);color:var(--text-muted);margin-top:2px;}
.brief-narrative{font-size:var(--text-sm);line-height:1.7;color:var(--text-secondary);background:var(--surface-0);border-radius:var(--radius);padding:var(--space-4);margin-top:var(--space-3);}
.complication-item{padding:var(--space-3);border-left:3px solid var(--color-down);background:var(--surface-0);border-radius:0 var(--radius) var(--radius) 0;margin-bottom:var(--space-2);font-size:var(--text-sm);}
.opportunity-item{padding:var(--space-3);border-left:3px solid var(--color-up);background:var(--surface-0);border-radius:0 var(--radius) var(--radius) 0;margin-bottom:var(--space-2);font-size:var(--text-sm);}

/* Assets page */
.asset-type-tabs{display:flex;gap:4px;flex-wrap:wrap;padding:var(--space-4);background:var(--surface-0);border-bottom:1px solid var(--surface-3);}
.asset-tab-btn{padding:6px 14px;border-radius:20px;border:1px solid var(--surface-3);background:var(--surface-1);font-size:var(--text-sm);cursor:pointer;transition:var(--transition);}
.asset-tab-btn.active{background:var(--navy);color:#fff;border-color:var(--navy);}
.warranty-ok{color:var(--color-up);}
.warranty-soon{color:var(--color-warn);}
.warranty-expired{color:var(--color-down);}
.depr-row{display:flex;gap:var(--space-3);font-size:var(--text-xs);color:var(--text-muted);margin-top:4px;}
.depr-val{font-family:'IBM Plex Mono',monospace;font-weight:600;color:var(--text-primary);}

/* GIS/Map styles */
.gis-layer-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-bottom:1px solid var(--surface-3);}
.gis-feature-count{font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:var(--text-lg);color:var(--navy);}
.competitor-triangle{display:inline-block;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:10px solid currentColor;}

/* Trading area card */
.ta-card{background:var(--surface-0);border:1px solid var(--surface-3);border-radius:var(--radius);padding:var(--space-4);font-size:var(--text-sm);}
.ta-stat{display:flex;justify-content:space-between;padding:3px 0;border-bottom:1px dashed var(--surface-3);}
.ta-stat:last-child{border-bottom:none;}
.ta-stat-val{font-family:'IBM Plex Mono',monospace;font-weight:600;}

/* Projection chart labels */
.proj-scenario{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-sm);}
.proj-scenario::before{content:'';display:inline-block;width:20px;height:2px;border-radius:1px;}
.proj-base::before{background:var(--color-info);}
.proj-upside::before{background:var(--color-up);border-top:1px dashed var(--color-up);background:none;}
.proj-stress::before{background:var(--color-down);border-top:1px dashed var(--color-down);background:none;}

/* Stalled works severity */
.stall-warn{background:#fef3c7;color:#92400e;padding:2px 8px;border-radius:4px;font-size:var(--text-xs);}
.stall-critical{background:#fee2e2;color:#991b1b;padding:2px 8px;border-radius:4px;font-size:var(--text-xs);}
.stall-severe{background:#7f1d1d;color:#fca5a5;padding:2px 8px;border-radius:4px;font-size:var(--text-xs);}

/* Status popover (inline status change) */
.status-popover{position:absolute;z-index:500;background:var(--surface-1);border:1px solid var(--surface-3);border-radius:var(--radius);padding:var(--space-3);box-shadow:var(--shadow-md);min-width:200px;}
.status-popover select{width:100%;margin-bottom:var(--space-2);}

/* Analytics config sliders */
.weight-row{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-2);}
.weight-label{width:160px;font-size:var(--text-sm);}
.weight-input{width:70px;font-family:'IBM Plex Mono',monospace;font-weight:600;}
.weight-sum{font-family:'IBM Plex Mono',monospace;font-weight:700;font-size:var(--text-lg);}
.weight-sum.valid{color:var(--color-up);}
.weight-sum.invalid{color:var(--color-down);}

/* Mobile responsive additions */
@media(max-width:600px){
  .brief-grid{grid-template-columns:1fr;}
  .exhibit{padding:var(--space-3);}
  .asset-type-tabs{padding:var(--space-2);}
  .weight-row{flex-wrap:wrap;}
  .weight-label{width:100%;}
}