/* ═══════════════════════════════════════════════════════════════════════════
   StudioCheck — styles.css  B-V1 Premium Redesign
   Scope: CSS-only. Zero HTML or JS changes in this file.
   All original class names preserved. New classes added as suffix blocks.
   Dark mode = default (:root). Light mode = [data-theme="light"] override.
═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. DESIGN TOKENS ───────────────────────────────────────────────────── */
:root{
  /* Surface */
  --bg:#07070f;
  --bg2:#0e0e1a;
  --bg3:#141422;
  --bg4:#1b1b2e;
  --bg5:#22223a;
  --bg6:#2a2a44;

  /* Borders */
  --border:rgba(255,255,255,0.06);
  --border2:rgba(255,255,255,0.11);
  --border3:rgba(255,255,255,0.18);

  /* Text */
  --text:#f0f0ff;
  --text2:#9898b8;
  --text3:#55557a;

  /* Brand */
  --accent:#7c6aff;
  --accent-h:#6b59ee;
  --accent-d:rgba(124,106,255,0.12);
  --accent-d2:rgba(124,106,255,0.06);

  /* Semantic */
  --green:#1fd98a;
  --green-d:rgba(31,217,138,0.10);
  --amber:#f5a623;
  --amber-d:rgba(245,166,35,0.10);
  --red:#f43f5e;
  --red-d:rgba(244,63,94,0.10);
  --cyan:#22d3ee;
  --cyan-d:rgba(34,211,238,0.10);
  --pink:#ec4899;

  /* Layout */
  --sidebar:224px;
  --topbar:56px;

  /* Typography */
  --font-d:'Inter',system-ui,-apple-system,sans-serif;
  --font-b:'Inter',system-ui,-apple-system,sans-serif;

  /* Shape */
  --r:10px;
  --r2:12px;
  --r3:18px;
  --sc-modal-radius:12px;

  /* Motion */
  --tr:all 0.18s cubic-bezier(0.4,0,0.2,1);

  /* Shadows (dark) */
  --shadow-sm:none;
  --shadow-md:0 4px 12px rgba(0,0,0,0.5),0 2px 4px rgba(0,0,0,0.3);
  --shadow-lg:0 12px 32px rgba(0,0,0,0.6),0 4px 8px rgba(0,0,0,0.4);

  /* KPI number sizes */
  --kpi-xl:38px;
  --kpi-lg:26px;
  --kpi-md:20px;
  --kpi-lbl:11px;

  /* ── V2 DESIGN TOKENS ────────────────────────────────────────────────────
     Prefix: --sc-*  |  Light mode = default (:root).
     Dark override: [data-theme="dark"] block below.
     All V-2 through V-17 bites use ONLY these tokens — never raw hex.
  ─────────────────────────────────────────────────────────────────────────── */

  /* Surfaces */
  --sc-bg:            #f8fafc;
  --sc-surface:       #ffffff;
  --sc-surface-hover: #f1f5f9;

  /* Borders — 0.5px only, never 1px or 2px */
  --sc-border:        rgba(0,0,0,0.08);
  --sc-border-strong: rgba(0,0,0,0.14);

  /* Text — three tiers */
  --sc-text-primary:   #0f172a;
  --sc-text-secondary: #64748b;
  --sc-text-muted:     #94a3b8;

  /* Accent — indigo, one color, used sparingly */
  --sc-accent:       #4338ca;
  --sc-accent-light: #eef2ff;
  --sc-accent-text:  #4338ca;
  /* Accent-tinted border — the only card border allowed to carry the accent
     color, reserved for the This Week priority card and predictive/forecast
     cards (VR-TW2, VR-R3, VR-PH3). Everything else stays --sc-border. */
  --sc-border-accent: rgba(67,56,202,0.35);
  --sc-accent-border-light: rgba(124,106,255,0.25);

  /* Semantic — DELTA TEXT AND 6px ALERT DOTS ONLY.
     Never use as card bg, fill, border, or header. */
  --sc-positive: #16a34a;
  --sc-negative: #dc2626;
  --sc-caution:  #d97706;

  /* Heat scale — schedule/occupancy intensity legend (red→green, 6 stops) */
  --heat-1: #c0392b;
  --heat-2: #e74c3c;
  --heat-3: #e67e22;
  --heat-4: #f1c40f;
  --heat-5: #a8d520;
  --heat-6: #27ae60;

  /* Shape */
  --sc-radius-card:  12px;
  --sc-radius-chip:   8px;
  --sc-radius-badge:  4px;
  --sc-radius-btn:    8px;

  /* Spacing */
  --sc-pad-card:    20px;
  --sc-pad-card-sm: 16px;
  --sc-gap-grid:    12px;
}

[data-theme="light"]{
  --bg:#f0f0f8;
  --bg2:#ffffff;
  --bg3:#e8e8f4;
  --bg4:#dcdcec;
  --bg5:#d0d0e0;
  --bg6:#c4c4d4;
  --border:rgba(0,0,0,0.07);
  --border2:rgba(0,0,0,0.12);
  --border3:rgba(0,0,0,0.18);
  --text:#12122a;
  --text2:#44446a;
  --text3:#7878a0;
  --accent:#6355e0;
  --accent-h:#5244cc;
  --accent-d:rgba(99,85,224,0.10);
  --accent-d2:rgba(99,85,224,0.05);
  --green:#0f9060;
  --green-d:rgba(15,144,96,0.12);
  --amber:#9a6200;
  --amber-d:rgba(154,98,0,0.12);
  --red:#c01838;
  --red-d:rgba(192,24,56,0.12);
  --cyan:#0891a8;
  --cyan-d:rgba(8,145,168,0.12);
  --pink:#be1c77;
  --shadow-sm:none;
  --shadow-md:0 4px 12px rgba(0,0,0,0.10),0 2px 4px rgba(0,0,0,0.06);
  --shadow-lg:0 12px 32px rgba(0,0,0,0.12),0 4px 8px rgba(0,0,0,0.08);
}
[data-theme="light"] .tip-box{color:var(--sc-text-secondary);}

[data-theme="dark"]{
  --sc-bg:            #0f1117;
  --sc-surface:       #1a1d27;
  --sc-surface-hover: #252836;
  --sc-border:        rgba(255,255,255,0.08);
  --sc-border-strong: rgba(255,255,255,0.14);
  --sc-text-primary:   #f1f5f9;
  --sc-text-secondary: #94a3b8;
  --sc-text-muted:     #64748b;
  --sc-accent:         #6366f1;
  --sc-accent-light:   #1e1b4b;
  --sc-accent-text:    #818cf8;
  --sc-border-accent:  rgba(99,102,241,0.4);
  --sc-accent-border-light: rgba(124,106,255,0.25);
  --sc-positive: #22c55e;
  --sc-negative: #f87171;
  --sc-caution:  #fbbf24;
}

/* ── 2. RESET & BASE ─────────────────────────────────────────────────────── */
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;margin:0;padding:0;}
body{
  background:var(--sc-bg);
  color:var(--sc-text-primary);
  font-family:var(--font-b);
  font-size:14px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* ── 3. ONBOARDING WIZARD ───────────────────────────────────────────────── */
#onboarding{position:fixed;inset:0;background:var(--sc-bg);z-index:2000;overflow-y:auto;}
#onboarding.hidden{display:none;}
.ob-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px;}
.ob-card{
  background:var(--sc-surface);
  border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-modal-radius);
  padding:28px 30px 22px;
  max-width:520px;
  width:100%;
}
.ob-logo{font-family:var(--font-d);font-size:16px;font-weight:500;color:var(--sc-text-primary);margin-bottom:18px;text-align:center;letter-spacing:-0.01em;}
.ob-logo span{color:var(--sc-accent);}
.ob-title{font-family:var(--font-d);font-size:20px;font-weight:500;margin-bottom:4px;text-align:center;letter-spacing:-0.02em;color:var(--sc-text-primary);}
.ob-sub{font-size:12px;color:var(--sc-text-secondary);margin-bottom:16px;line-height:1.6;text-align:center;}
.ob-label{font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--sc-text-secondary);margin-bottom:6px;margin-top:14px;}
.ob-input{
  width:100%;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--r);padding:10px 13px;font-size:14px;
  font-family:var(--font-b);color:var(--sc-text-primary);outline:none;transition:var(--tr);
}
.ob-input:focus{border-color:var(--sc-accent);outline:2px solid var(--sc-accent);outline-offset:1px;}

/* Checkboxes */
.ob-checks{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:6px;}
.ob-check{
  display:flex;align-items:center;gap:10px;
  background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-chip);padding:11px 13px;cursor:pointer;
  transition:border-color .15s,background .15s;user-select:none;
}
.ob-check:hover{border-color:var(--sc-accent);}
.ob-check.on{border-color:var(--sc-accent);background:var(--sc-accent-light);}
.ob-chk{
  width:16px;height:16px;border-radius:4px;flex-shrink:0;
  border:0.5px solid var(--sc-border-strong);
  display:flex;align-items:center;justify-content:center;
  font-size:10px;color:#fff;transition:var(--tr);
}
.ob-check.on .ob-chk{background:var(--sc-accent);border-color:var(--sc-accent);}
.ob-check-lbl{font-size:13px;font-weight:500;color:var(--sc-text-primary);line-height:1.2;}
.ob-check.on .ob-check-lbl{color:var(--sc-accent);}

/* Duration selector */
.ob-dur-grid{display:flex;gap:7px;flex-wrap:wrap;margin-top:6px;}
.ob-dur-opt{
  flex:1;min-width:70px;background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-chip);padding:8px 6px;text-align:center;cursor:pointer;transition:var(--tr);
}
.ob-dur-opt:hover{border-color:var(--sc-accent);}
.ob-dur-opt.on{border-color:var(--sc-accent);background:var(--sc-accent-light);}
.ob-dur-opt-val{font-family:var(--font-d);font-size:15px;font-weight:500;color:var(--sc-text-primary);}
.ob-dur-opt-lbl{font-size:10px;color:var(--sc-text-muted);margin-top:1px;}
.ob-dur-opt.on .ob-dur-opt-val{color:var(--sc-accent);}

/* Step indicators */
.ob-steps{display:flex;align-items:center;justify-content:center;gap:5px;margin-bottom:14px;}
.ob-step-dot{width:7px;height:7px;border-radius:50%;background:var(--sc-border-strong);transition:var(--tr);}
.ob-step-dot.active{background:var(--sc-accent);width:20px;border-radius:4px;}
.ob-step-dot.done{background:var(--sc-positive);}
.ob-step-label{font-size:10px;color:var(--sc-text-muted);text-align:center;margin-bottom:12px;letter-spacing:.07em;text-transform:uppercase;font-weight:500;}

/* Select */
.ob-select{
  width:100%;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--r);padding:10px 13px;font-size:14px;
  font-family:var(--font-b);color:var(--sc-text-primary);outline:none;
  transition:var(--tr);appearance:none;cursor:pointer;
}
.ob-select:focus{border-color:var(--sc-accent);}

/* Currency pill */
.ob-currency-pill{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--sc-accent-light);border:0.5px solid var(--sc-accent-border-light);
  border-radius:20px;padding:3px 12px;
  font-size:12px;font-weight:500;color:var(--sc-accent);
  font-family:var(--font-d);margin-top:7px;
}

/* Buttons */
.ob-btns{display:flex;gap:8px;margin-top:18px;}
.ob-btn-back{
  flex:0 0 auto;background:transparent;color:var(--sc-text-secondary);
  border:0.5px solid var(--sc-border-strong);border-radius:var(--sc-radius-btn);
  padding:9px 18px;font-size:13px;font-family:var(--font-b);
  font-weight:500;cursor:pointer;transition:var(--tr);
}
.ob-btn-back:hover{border-color:var(--sc-accent);color:var(--sc-text-primary);}
.ob-btn-next{
  flex:1;background:var(--sc-accent);color:#fff;border:none;
  border-radius:var(--sc-radius-btn);padding:9px;font-size:13px;
  font-family:var(--font-b);font-weight:500;cursor:pointer;
  transition:var(--tr);letter-spacing:0.01em;
}
.ob-btn-next:hover{background:var(--accent-h);}
.ob-btn{
  width:100%;background:var(--sc-accent);color:#fff;border:none;
  border-radius:var(--sc-radius-btn);padding:11px;font-size:13px;
  font-family:var(--font-b);font-weight:500;cursor:pointer;
  transition:var(--tr);margin-top:16px;
}
.ob-btn:hover{background:var(--accent-h);}

/* Rooms table */
.ob-rooms-table{width:100%;border-collapse:collapse;margin-top:8px;}
.ob-rooms-table th{
  font-size:10px;font-weight:500;color:var(--sc-text-muted);
  text-transform:uppercase;letter-spacing:.05em;
  padding:5px 8px;text-align:left;border-bottom:0.5px solid var(--sc-border);
}
.ob-rooms-table td{padding:4px 6px;}
.ob-rooms-table input{
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:6px;padding:6px 8px;font-size:13px;
  font-family:var(--font-b);color:var(--sc-text-primary);outline:none;
  width:100%;transition:var(--tr);
}
.ob-rooms-table input:focus{border-color:var(--sc-accent);}
.ob-add-room{
  background:transparent;border:0.5px dashed var(--sc-border-strong);
  border-radius:6px;padding:6px 12px;font-size:12px;
  color:var(--sc-text-muted);cursor:pointer;width:100%;margin-top:6px;transition:var(--tr);
}
.ob-add-room:hover{border-color:var(--sc-accent);color:var(--sc-accent);}
.ob-rm-del{background:transparent;border:none;color:var(--sc-text-muted);font-size:14px;cursor:pointer;padding:2px 6px;border-radius:4px;transition:var(--tr);}
.ob-rm-del:hover{color:var(--sc-negative);}

/* Market tier grid */
.ob-tier-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:6px;}
.ob-tier{
  background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--r);padding:12px 10px;cursor:pointer;
  transition:var(--tr);text-align:center;
}
.ob-tier:hover{border-color:var(--sc-accent);}
.ob-tier.on{border-color:var(--sc-accent);background:var(--sc-accent-light);}
.ob-tier-name{font-size:12px;font-weight:500;color:var(--sc-text-primary);margin-bottom:3px;}
.ob-tier.on .ob-tier-name{color:var(--sc-accent);}
.ob-tier-sub{font-size:10px;color:var(--sc-text-muted);line-height:1.4;}

/* Summary card */
.ob-summary{
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--r);padding:14px 16px;margin-top:10px;
  display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;
}
.ob-sum-lbl{font-size:9px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:2px;}
.ob-sum-val{font-size:13px;font-weight:500;color:var(--sc-text-primary);}
.ob-err-tier{font-size:11px;color:var(--sc-negative);margin-top:4px;display:none;}

/* Region grid */
.ob-regions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;margin-top:6px;}
.ob-reg{
  background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-chip);padding:9px 11px;cursor:pointer;transition:var(--tr);
}
.ob-reg:hover{border-color:var(--sc-accent);}
.ob-reg.on{border-color:var(--sc-accent);background:var(--sc-accent-light);}
.ob-reg-name{font-size:12px;font-weight:500;color:var(--sc-text-primary);}
.ob-reg.on .ob-reg-name{color:var(--sc-accent);}
.ob-reg-sub{font-size:10px;color:var(--sc-text-muted);margin-top:2px;}

/* Fiscal / hours grids */
.ob-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.ob-fiscal-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px;}
.ob-fiscal-inp{
  background:var(--sc-bg);border:0.5px solid var(--sc-border-strong);
  border-radius:6px;padding:7px 10px;
  font-size:15px;font-family:var(--font-d);font-weight:500;
  color:var(--sc-text-primary);outline:none;width:70px;
  -moz-appearance:textfield;transition:var(--tr);
}
.ob-fiscal-inp:focus{border-color:var(--sc-accent);}
.ob-hours-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:6px;}
.ob-hours-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--r);padding:10px;transition:var(--tr);
}
.ob-hours-day{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px;}
.ob-closed-toggle{
  display:flex;align-items:center;gap:6px;
  font-size:11px;color:var(--sc-text-muted);cursor:pointer;
  margin-bottom:6px;user-select:none;
}
.ob-time-inp{
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:5px;padding:5px 3px;
  font-size:10px;font-family:var(--font-b);color:var(--sc-text-primary);
  outline:none;width:100%;min-width:0;max-width:100%;
  box-sizing:border-box;transition:var(--tr);
}
.ob-time-inp:focus{border-color:var(--sc-accent);}
.ob-time-sep{font-size:10px;color:var(--sc-text-muted);margin:0 2px;flex-shrink:0;}
.ob-time-row{display:flex;align-items:center;gap:2px;margin-top:4px;min-width:0;overflow:hidden;}
.ob-err-hours{font-size:11px;color:var(--sc-negative);margin-top:4px;display:none;}

/* Nav bar */
.ob-nav{display:flex;justify-content:flex-end;gap:8px;margin-top:18px;padding-top:14px;border-top:0.5px solid var(--sc-border);}
.ob-nav-step{font-size:11px;color:var(--sc-text-muted);align-self:center;}

/* ── 4. APP SHELL ────────────────────────────────────────────────────────── */
#app{
  display:grid;
  grid-template-columns:var(--sidebar) 1fr;
  grid-template-rows:var(--topbar) 1fr;
  height:100vh;
  overflow:hidden;
}
#app.hidden{display:none;}

/* ── 5. TOPBAR ───────────────────────────────────────────────────────────── */
.topbar{
  grid-column:1/-1;
  background:var(--sc-surface);
  border-bottom:0.5px solid var(--sc-border);
  display:flex;
  align-items:center;
  padding:0 16px;
  gap:10px;
  z-index:50;
  overflow:hidden;
}
.tb-logo-wrap{display:flex;flex-direction:column;justify-content:center;flex-shrink:0;}
.tb-logo{
  font-family:var(--font-d);font-size:16px;font-weight:500;
  color:var(--sc-text-primary);white-space:nowrap;
  letter-spacing:-0.01em;line-height:1.2;
}
.tb-logo span{color:var(--sc-text-primary);}
.tb-logo-meta{
  font-size:10px;font-weight:500;color:var(--sc-text-muted);
  text-transform:uppercase;letter-spacing:.05em;line-height:1.2;
}
.tb-div{width:1px;height:20px;background:var(--sc-border-strong);flex-shrink:0;}
.tb-studio{
  font-size:13px;color:var(--sc-text-secondary);font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  max-width:200px;flex-shrink:1;
}
.tb-space{flex:1;}
.tb-fiscal-badge{
  display:flex;align-items:center;gap:5px;
  background:var(--sc-accent-light);border:0.5px solid rgba(124,106,255,0.22);
  border-radius:20px;padding:4px 12px;
  font-size:11px;color:var(--sc-text-secondary);white-space:nowrap;flex-shrink:0;
}
.tb-fiscal-badge b{color:var(--sc-accent);font-family:var(--font-d);}
.tb-score-lbl{font-size:11px;color:var(--sc-text-muted);white-space:nowrap;flex-shrink:0;}
.tb-score-pill{
  background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-badge);padding:4px 14px;
  font-size:11px;font-weight:500;font-family:var(--font-d);
  white-space:nowrap;flex-shrink:0;
  transition:var(--tr);
}
/* FP-16: topbar has ~8 flex children and no responsive handling anywhere —
   on a 390px phone (this app's actual primary use case per the habit-loop
   strategy) they overflow past the topbar's overflow:hidden and get
   silently clipped, which can push the avatar/menu button off-screen
   entirely. Drop the least essential pieces so the score pill and menu
   button always stay reachable. tb-logo-meta/tb-logo-wrap included
   defensively for when VA-10's wordmark metadata line lands — harmless
   no-op selectors until then. */
@media(max-width:480px){
  .topbar{padding:0 10px;gap:6px;}
  .tb-studio,.tb-fiscal-badge,.tb-score-lbl,.tb-div,.tb-updated,.tb-logo-meta{display:none!important;}
  .tb-logo{font-size:14px;}
  .tb-user-name{display:none;}
  .tb-user-btn{padding:4px 4px 4px 4px;}
}
.tb-updated{font-size:11px;color:var(--sc-text-muted);white-space:nowrap;flex-shrink:0;}
.tb-lang{
  display:flex;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  border-radius:8px;overflow:hidden;flex-shrink:0;
}
.lang-btn{
  padding:5px 12px;font-size:11px;font-family:var(--font-b);
  font-weight:500;color:var(--sc-text-muted);background:transparent;
  border:none;border-bottom:2px solid transparent;cursor:pointer;transition:var(--tr);
}
.lang-btn.active{background:transparent;color:var(--sc-accent-text);border-bottom-color:var(--sc-accent);}

/* Standard topbar button */
.btn-tb{
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:8px;padding:6px 13px;
  font-size:12px;font-family:var(--font-b);font-weight:500;
  color:var(--sc-text-secondary);cursor:pointer;transition:var(--tr);
  white-space:nowrap;flex-shrink:0;display:inline-flex;
  align-items:center;gap:6px;
}
.btn-tb:hover{border-color:var(--sc-accent);color:var(--sc-accent);}
.btn-tb.saved{border-color:rgba(31,217,138,0.4);color:var(--green);}

/* Hide the old topbar Enter Data — replaced by per-tab triggers */
.btn-tb.btn-enter-data{display:none;}

/* ── Spec badge classes (V11) ──────────────────────────────────────── */
.sc-badge{
  font-size:11px;font-weight:500;
  padding:2px 8px;border-radius:var(--sc-radius-badge);
  border:0.5px solid var(--sc-border-strong);
  background:var(--sc-surface);color:var(--sc-text-secondary);
  display:inline-flex;align-items:center;
}
.sc-badge-positive{border-color:rgba(22,163,74,0.25);color:var(--sc-positive);background:rgba(22,163,74,0.06);}
.sc-badge-negative{border-color:rgba(220,38,38,0.25);color:var(--sc-negative);background:rgba(220,38,38,0.06);}
.sc-badge-caution{border-color:rgba(217,119,6,0.25);color:var(--sc-caution);background:rgba(217,119,6,0.06);}

/* ── Spec button classes (V10) ──────────────────────────────────────── */
.btn-primary{
  background:var(--sc-accent);color:#fff;border:none;
  border-radius:var(--sc-radius-btn);padding:8px 16px;
  font-size:14px;font-weight:500;cursor:pointer;
  transition:var(--tr);
}
.btn-primary:hover{background:var(--accent-h);}
.btn-secondary{
  background:transparent;color:var(--sc-text-primary);
  border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-btn);padding:8px 16px;
  font-size:14px;font-weight:500;cursor:pointer;
  transition:var(--tr);
}
.btn-secondary:hover{border-color:var(--sc-accent);color:var(--sc-accent);}
.btn-ghost{
  background:none;border:none;color:var(--sc-accent-text);
  font-size:13px;font-weight:500;padding:0;cursor:pointer;
}
.btn-ghost:hover{text-decoration:underline;}

/* Theme toggle — icon only */
#btn-theme{
  width:34px;height:34px;padding:0;display:flex;
  align-items:center;justify-content:center;
  border-radius:50%;font-size:15px;
}

/* ── 6. SIDEBAR ──────────────────────────────────────────────────────────── */
.sidebar{
  background:var(--sc-surface);
  border-right:0.5px solid var(--sc-border);
  padding:12px 8px;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:1px;
}
.nav-sec{
  font-size:9px;font-weight:500;letter-spacing:.10em;
  text-transform:uppercase;color:var(--sc-text-muted);
  padding:12px 10px 5px;margin-top:4px;
}
.nav-item{
  display:flex;align-items:center;gap:9px;
  padding:8px 11px;border-radius:8px;
  cursor:pointer;transition:var(--tr);
  color:var(--sc-text-secondary);font-size:13px;font-weight:500;
  border:none;background:transparent;
  width:100%;text-align:left;position:relative;
}
.nav-item:hover{background:var(--sc-surface-hover);color:var(--sc-text-primary);}
.nav-item.active{
  background:transparent;
  color:var(--sc-accent-text);
  font-weight:500;
}
.nav-item.active::before{
  content:'';position:absolute;left:0;top:4px;bottom:4px;
  width:3px;border-radius:2px;background:var(--sc-accent);
}
.nav-icon{font-size:14px;width:16px;text-align:center;flex-shrink:0;opacity:0.7;}
.nav-item.active .nav-icon{opacity:1;}
.nav-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:18px;height:18px;border-radius:9px;
  padding:0 5px;font-size:10px;font-weight:500;
  background:var(--sc-accent);color:#fff;
  margin-left:auto;flex-shrink:0;
  font-variant-numeric:tabular-nums;line-height:1;
}
.nav-badge.nav-badge-danger{background:var(--sc-negative);}
.nav-rag{margin-left:auto;width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.nav-rag.g{background:var(--green);}
.nav-rag.a{background:var(--amber);}
.nav-rag.r{background:var(--red);}
.nav-rag.n{background:var(--sc-surface-hover);}

/* Sidebar bottom */
.sidebar-btm{margin-top:auto;padding-top:12px;border-top:0.5px solid var(--sc-border);}
.sidebar-note{
  background:var(--sc-accent-light);border:0.5px solid rgba(124,106,255,0.15);
  border-radius:var(--r);padding:11px 12px;
  font-size:11px;color:var(--sc-text-muted);line-height:1.6;
}

/* ── 7. MAIN CONTENT AREA ────────────────────────────────────────────────── */
.main{overflow-y:auto;background:var(--sc-bg);}

/* ── 8. PAGE STRUCTURE ───────────────────────────────────────────────────── */
.page{display:none;padding:24px 28px 48px;max-width:1280px;}
.page.active{display:block;}

/* Page header — compressed */
.page-eyebrow{
  font-size:11px;font-weight:500;letter-spacing:.07em;
  text-transform:uppercase;color:var(--sc-accent-text);margin-bottom:3px;
}
.page-title{
  font-family:var(--font-d);font-size:20px;font-weight:500;
  color:var(--sc-text-primary);letter-spacing:-0.02em;margin-bottom:2px;
  line-height:1.2;
}
.page-sub{
  font-size:12px;color:var(--sc-text-muted);line-height:1.6;
  max-width:600px;margin-bottom:18px;
}

/* Tab header row — title + Enter Data button side by side */
.tab-header{
  display:flex;align-items:flex-start;
  justify-content:space-between;gap:16px;
  margin-bottom:20px;flex-wrap:wrap;
}
.tab-header-left{flex:1;min-width:0;}
.tab-header-left .page-eyebrow{margin-bottom:3px;}
.tab-header-left .page-title{margin-bottom:2px;}
.tab-header-left .page-sub{margin-bottom:0;}

/* Per-tab Enter Data trigger button */
.btn-enter-tab{
  display:inline-flex;align-items:center;gap:7px;
  background:var(--sc-accent);color:#fff;border:none;
  border-radius:var(--sc-radius-btn);padding:9px 18px;
  font-size:12px;font-family:var(--font-b);font-weight:500;
  cursor:pointer;transition:var(--tr);white-space:nowrap;
  flex-shrink:0;letter-spacing:0.01em;
}
.btn-enter-tab:hover{background:var(--accent-h);}
.btn-enter-tab svg{width:13px;height:13px;opacity:0.9;}

/* Section divider */
/* B-DS1: upgraded from 9px uppercase + trailing line to a cleaner 13px/600
   heading style with more breathing room. The old ::after divider line is
   removed entirely (pseudo-element only — no HTML/JS touched). */
.sec-title{
  font-size:13px;font-weight:500;letter-spacing:0;
  text-transform:none;color:var(--sc-text-secondary);
  display:flex;align-items:center;gap:10px;
  margin-bottom:16px;margin-top:24px;
}

/* ── 9. KPI STAT CARDS ───────────────────────────────────────────────────── */
/* B-DS1: unified card foundation. .kpi-card is the new single source of
   truth for card visual language — .stat-card, .rev-kpi-card, and
   .cos-kpi-card are aliased into it so every existing card across every tab
   (Dashboard, Revenue, Costs, Capacity, etc.) picks up the same look with
   zero HTML changes. New markup going forward should use .kpi-card directly. */
.stat-row{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:10px;
  margin-bottom:16px;
}
.kpi-card,.stat-card,.rev-kpi-card,.cos-kpi-card{
  background:var(--sc-surface);
  border:0.5px solid var(--sc-border);
  border-radius:var(--sc-radius-card);
  padding:16px 18px;
  transition:var(--tr);
  position:relative;
  overflow:hidden;
}
.stat-card::after{
  content:'';position:absolute;bottom:0;left:0;right:0;
  height:2px;background:transparent;transition:var(--tr);
}
.stat-card.hl{
  border-color:rgba(124,106,255,0.22);
}
.stat-card.hl::after{background:var(--sc-accent);}
.stat-card.warn{
  border-color:var(--sc-border);
}
.stat-card.warn::after{background:transparent;}
.stat-card.ok{
  border-color:var(--sc-border);
}
.stat-card.ok::after{background:transparent;}
.stat-lbl{
  font-size:var(--kpi-lbl);font-weight:500;
  letter-spacing:.06em;text-transform:uppercase;
  color:var(--sc-text-muted);margin-bottom:8px;
}
.stat-val{
  font-family:var(--font-d);font-size:var(--kpi-lg);
  font-weight:500;color:var(--sc-text-primary);
  letter-spacing:-0.02em;line-height:1.1;
  font-variant-numeric:tabular-nums;
}
.stat-sub{font-size:11px;color:var(--sc-text-muted);margin-top:5px;line-height:1.4;}

/* Delta badge (positive/negative trend) */
.stat-delta{
  display:inline-flex;align-items:center;gap:3px;
  font-size:13px;font-weight:500;margin-top:4px;
  font-variant-numeric:tabular-nums;
}
.stat-delta.up{color:var(--sc-positive);}
.stat-delta.dn{color:var(--sc-negative);}

/* ── 10. INPUT CARDS ─────────────────────────────────────────────────────── */
.input-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:8px;margin-bottom:4px;
}
.input-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:16px 18px;
  transition:border-color .15s;
}
.input-card:focus-within{border-color:rgba(124,106,255,0.35);}
.input-card.has-val{border-color:rgba(124,106,255,0.18);}
.input-card.has-err{border-color:var(--red);}
.ic-label{
  font-size:var(--kpi-lbl);font-weight:500;letter-spacing:.06em;
  text-transform:uppercase;color:var(--sc-text-muted);margin-bottom:6px;
}
.ic-val{
  font-family:var(--font-d);font-size:20px;font-weight:500;
  color:var(--sc-text-primary);line-height:1.1;margin-bottom:4px;
  font-variant-numeric:tabular-nums;
}
.ic-sub{font-size:11px;color:var(--sc-text-muted);}
.ic-input{
  width:100%;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  border-radius:7px;padding:8px 10px;font-size:15px;
  font-family:var(--font-d);font-weight:500;color:var(--sc-text-primary);
  outline:none;transition:var(--tr);
}
.ic-input:focus{border-color:var(--sc-accent);}
.ic-bench{font-size:10px;color:var(--sc-text-muted);margin-top:4px;}
.ic-bench b{font-weight:500;}
.ic-rag{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:4px;vertical-align:middle;}
.ic-rag.g{background:var(--green);}
.ic-rag.a{background:var(--amber);}
.ic-rag.r{background:var(--red);}

/* ── 11. SCORE HERO ──────────────────────────────────────────────────────── */
.score-hero{
  display:grid;grid-template-columns:150px 1fr;
  gap:20px;align-items:center;
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--sc-radius-card);padding:22px 26px;
  margin-bottom:16px;
}
.score-ring-w{position:relative;display:flex;align-items:center;justify-content:center;}
.score-center{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  text-align:center;
}
.score-num{
  font-family:var(--font-d);font-size:48px;font-weight:500;
  color:var(--sc-text-primary);line-height:1;
  font-variant-numeric:tabular-nums;
}
.score-den{font-size:13px;color:var(--sc-text-muted);margin-top:1px;}
.arch-pill{
  display:inline-block;
  font-size:11px;font-weight:500;letter-spacing:.06em;
  text-transform:uppercase;
  background:var(--sc-accent-light);color:var(--sc-accent-text);
  border:0.5px solid rgba(99,102,241,0.25);
  border-radius:var(--sc-radius-badge);padding:2px 8px;margin-bottom:7px;
}
.hero-name{
  font-family:var(--font-d);font-size:16px;font-weight:500;
  color:var(--sc-text-primary);margin-bottom:5px;letter-spacing:-0.01em;
}
.bench-badge{
  display:inline-block;
  font-size:11px;font-weight:500;letter-spacing:.02em;
  background:transparent;color:var(--sc-text-secondary);
  border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-badge);padding:2px 8px;margin-bottom:7px;margin-left:6px;
}
.hero-sub{font-size:12px;color:var(--sc-text-muted);line-height:1.6;max-width:480px;}
.dash-freshness{font-size:11px;margin-top:6px;font-weight:500;}
.roi-ticker{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--sc-radius-card);padding:10px 16px;margin-bottom:14px;font-size:12px;font-weight:500;color:var(--sc-positive);}
/* FP-6: Money bar — persistent slim strip, sticks under topbar across all tabs */
#money-bar{position:sticky;top:0;z-index:40;background:var(--sc-accent-light);border-bottom:0.5px solid rgba(67,56,202,0.15);padding:0 28px;height:36px;align-items:center;gap:6px;font-variant-numeric:tabular-nums;flex-shrink:0;}
/* FP-16: 28px side padding leaves only ~334px of a 390px screen for content;
   the SR copy in particular ("Ovaj mesec ... nije naplaćeno ... vidi kako")
   can overflow a fixed 36px single-line bar. Tighten padding and drop the
   suffix — amount + CTA carry the meaning on their own. */
@media(max-width:480px){
  #money-bar{padding:0 12px;gap:4px;}
  .mb-suffix{display:none;}
}
.mb-label{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:0.06em;margin-right:2px;}
.mb-amount{font-size:15px;font-weight:500;color:var(--sc-accent);}
.mb-suffix{font-size:13px;color:var(--sc-text-secondary);}
.mb-cta{margin-left:6px;background:none;border:none;color:var(--sc-accent-text);font-size:13px;font-weight:500;cursor:pointer;padding:0;font-family:inherit;}
.mb-cta:hover{text-decoration:underline;}
.positive-callout{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--sc-radius-card);padding:10px 16px;margin-bottom:14px;font-size:12px;font-weight:500;color:var(--sc-positive);}

/* ── 12. DOMAIN CARDS ────────────────────────────────────────────────────── */
.domain-grid{
  display:grid;grid-template-columns:repeat(5,1fr);
  gap:0;margin-bottom:16px;
  background:var(--sc-surface);
  border:0.5px solid var(--sc-border);border-top:none;
  border-radius:0 0 var(--sc-radius-card) var(--sc-radius-card);
  overflow:hidden;
}
.domain-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:16px 16px 14px;
  cursor:pointer;transition:var(--tr);
  display:flex;flex-direction:column;gap:4px;
  position:relative;overflow:hidden;
}
.domain-card:hover{border-color:var(--sc-border-strong);}
/* FP-1: RAG signal moved from a persistent card-edge bar to a single 6px
   dot before the label — semantic color now survives only as delta text
   or a small dot, never as an always-on card decoration. */
.domain-lbl{
  display:flex;align-items:center;gap:6px;
  font-size:11px;font-weight:500;letter-spacing:.06em;
  text-transform:uppercase;color:var(--sc-text-muted);
}
.domain-lbl::before{
  content:'';width:6px;height:6px;border-radius:50%;flex-shrink:0;
  background:var(--sc-border-strong);transition:var(--tr);
}
.domain-card.rag-g .domain-lbl::before{background:var(--green);}
.domain-card.rag-a .domain-lbl::before{background:var(--amber);}
.domain-card.rag-r .domain-lbl::before{background:var(--red);}
/* VR-D1: compact chip overrides when domain-cards live in the hero strip */
.domain-grid .domain-card{
  border:none;border-right:0.5px solid var(--sc-border);
  border-radius:0;padding:10px 12px 8px;gap:2px;min-height:unset;
}
.domain-grid .domain-card:last-child{border-right:none;}
.domain-grid .domain-card:hover{
  background:var(--sc-surface-hover);
  border-color:transparent;box-shadow:none;
}
.domain-grid .domain-score{font-size:20px;}
/* Mobile: re-separate domain-grid from hero when stacked */
@media(max-width:600px){
  .dash-hero{border-radius:var(--sc-radius-card);}
  .domain-grid{
    border-top:0.5px solid var(--sc-border);
    border-radius:var(--sc-radius-card);
    margin-top:8px;
  }
  .domain-grid .domain-card{border-bottom:0.5px solid var(--sc-border);}
}
.domain-score{
  font-family:var(--font-d);font-size:var(--kpi-xl);
  font-weight:500;color:var(--sc-text-primary);line-height:1.1;
  font-variant-numeric:tabular-nums;
}
/* B-DS2: status label becomes a pill. Uses currentColor for its background/
   border so it automatically tints to whatever color is already set inline
   by JS on this element (unchanged) — no new JS needed for the pill look. */
.domain-rag-lbl{
  display:inline-flex;align-items:center;
  font-size:10px;font-weight:500;color:var(--sc-text-muted);
  margin-top:3px;padding:2px 8px;border-radius:20px;
  background:color-mix(in srgb,currentColor 12%,transparent);
  border:0.5px solid color-mix(in srgb,currentColor 30%,transparent);
  width:fit-content;
}

/* ── 13. CHART CARDS ─────────────────────────────────────────────────────── */
.chart-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:12px;margin-bottom:16px;
}
.chart-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:18px;
  transition:var(--tr);
}
/* B-DS2: chart card header status pill — title left + status pill right,
   using the existing .chart-lbl flex/space-between row (no new wrapper
   needed). Same currentColor idiom as .domain-rag-lbl. */
.chart-status-pill{
  display:inline-flex;align-items:center;
  font-size:10px;font-weight:500;
  padding:2px 8px;border-radius:20px;
  background:color-mix(in srgb,currentColor 12%,transparent);
  border:0.5px solid color-mix(in srgb,currentColor 30%,transparent);
  text-transform:none;letter-spacing:0;
}
.chart-lbl{
  font-size:11px;font-weight:500;color:var(--sc-text-secondary);
  text-transform:uppercase;letter-spacing:.05em;
  margin-bottom:14px;display:flex;align-items:center;
  justify-content:space-between;
}
.chart-expand-hint{
  font-size:10px;color:var(--sc-text-muted);font-weight:400;
  text-transform:none;letter-spacing:0;cursor:pointer;
}

/* Expandable chart — click to grow */
.chart-expandable{cursor:pointer;}
.chart-expandable canvas{
  transition:height 0.35s cubic-bezier(0.4,0,0.2,1);
}
.chart-expandable.chart-expanded{
  border-color:var(--sc-border-strong);
}

/* VR-C1: .htab — the "pill toggle" pattern (segmented control), for view-state
   toggles like Capacity's This week/Last month. Distinct from .dtab (underline
   tabs, used for content tabs like VR-C2's Room breakdown/Heatmap). Active
   segment uses the accent fill, same idiom as .btn-primary — this is a control,
   not a status badge, so the semantic-color-only rule doesn't apply here. */
.htab-group{display:inline-flex;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);border-radius:20px;padding:2px;gap:2px;}
.htab{font-size:12px;font-weight:500;padding:6px 14px;border:none;border-radius:18px;background:transparent;color:var(--sc-text-secondary);cursor:pointer;transition:var(--tr);}
.htab:hover{color:var(--sc-text-primary);}
.htab.active{background:var(--sc-accent);color:#fff;}

/* VR-C2: .dtab — underline content-tabs pattern, for switching between views
   inside one card (e.g. Capacity's Room breakdown / Schedule heatmap). Distinct
   from .htab (pill toggle, for view-state controls like This week/Last month). */
.dtab{flex:1;font-size:11px;font-weight:500;padding:10px 8px;border:none;border-bottom:0.5px solid var(--sc-border);cursor:pointer;color:var(--sc-text-secondary);background:transparent;transition:var(--tr);}
.dtab.active{background:var(--sc-surface-hover);color:var(--sc-accent-text);border-bottom:2px solid var(--sc-accent);}

/* ── 14. ACTION CARDS ────────────────────────────────────────────────────── */
.action-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-left:3px solid var(--sc-accent);
  border-radius:var(--r2);padding:20px;
  margin-bottom:10px;
  transition:var(--tr);
}
.action-card:hover{border-color:var(--sc-border-strong);border-left-color:var(--sc-accent);}
.ac-title{font-size:14px;font-weight:500;color:var(--sc-text-primary);margin-bottom:5px;}
.ac-body{font-size:13px;color:var(--sc-text-secondary);margin-bottom:12px;line-height:1.55;}
.ac-pri{
  display:inline-flex;align-items:center;gap:5px;
  font-size:10px;font-weight:500;letter-spacing:.05em;
  text-transform:uppercase;border-radius:20px;
  padding:3px 10px;margin-bottom:12px;
}
.action-card.high .ac-pri{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.action-card.med .ac-pri{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.action-card.qw .ac-pri{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}

/* VR-TW2: This Week priority card — the only card besides the forecast card
   (VR-R3) allowed an accent-colored border. Everything else stays --sc-border. */
.tw-priority-card{
  background:var(--sc-surface);
  border:0.5px solid var(--sc-border-accent);
  border-top:2.5px solid var(--sc-accent);
  border-radius:var(--sc-radius-card);
  padding:18px 20px;margin-bottom:10px;
  cursor:pointer;transition:var(--tr);
}
.tw-priority-card:hover{border-color:var(--sc-border-accent);}
.tw-priority-num{
  width:24px;height:24px;border-radius:50%;
  background:var(--sc-accent);color:#fff;
  font-family:var(--font-d);font-size:11px;font-weight:500;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.tw-priority-title{font-size:14px;font-weight:500;color:var(--sc-text-primary);}
.tw-priority-sub{font-size:12px;color:var(--sc-text-secondary);margin-top:2px;line-height:1.5;}
.tw-priority-flag{font-size:11px;font-weight:500;color:var(--sc-negative);white-space:nowrap;}

/* VR-TW2: This Week secondary actions — compact chevron rows, title only */
.tw-secondary-row{
  display:flex;align-items:center;gap:10px;
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--sc-radius-card);
  padding:8px 14px;min-height:40px;
  cursor:pointer;transition:var(--tr);
}
.tw-secondary-row:hover{border-color:var(--sc-border-strong);}
.tw-secondary-num{
  width:20px;height:20px;border-radius:50%;
  background:var(--sc-surface-hover);color:var(--sc-text-secondary);
  font-family:var(--font-d);font-size:10px;font-weight:500;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.tw-secondary-title{flex:1;font-size:13px;color:var(--sc-text-primary);}
.tw-secondary-type{
  font-size:10px;font-weight:500;color:var(--sc-text-secondary);
  background:var(--sc-surface-hover);border-radius:20px;padding:2px 8px;
  white-space:nowrap;
}
.tw-secondary-chevron{font-size:14px;color:var(--sc-text-muted);flex-shrink:0;}
.ac-steps{list-style:none;display:flex;flex-direction:column;gap:6px;}
.ac-steps li{
  font-size:12px;color:var(--sc-text-secondary);
  padding-left:16px;position:relative;line-height:1.5;
}
.ac-steps li::before{
  content:'';position:absolute;left:0;top:7px;
  width:5px;height:5px;border-radius:50%;background:var(--sc-border-strong);
}
.ac-impact{
  font-size:11px;color:var(--sc-text-muted);
  margin-top:12px;padding-top:12px;
  border-top:0.5px solid var(--sc-border);
  font-style:italic;
}

/* ── 15. TOOLTIP SYSTEM ──────────────────────────────────────────────────── */
.tip-wrap{position:relative;display:inline-block;vertical-align:middle;}
.tip-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:14px;height:14px;border-radius:50%;
  background:var(--sc-surface-hover);color:var(--sc-text-muted);
  font-size:9px;font-weight:500;cursor:default;
  border:0.5px solid var(--sc-border-strong);margin-left:3px;
  transition:var(--tr);
}
.tip-icon:hover{background:var(--sc-accent-light);color:var(--sc-accent);border-color:var(--sc-accent);}
.tip-box{
  display:none;position:absolute;bottom:calc(100% + 6px);left:50%;
  transform:translateX(-50%);
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--r);padding:10px 13px;
  font-size:11px;color:var(--sc-text-secondary);line-height:1.55;
  min-width:220px;max-width:280px;z-index:100;
  pointer-events:none;
}
.tip-wrap:hover .tip-box,.tip-box.show{display:block;}

/* Benchmark hints */
.bk-hint{font-size:10px;color:var(--sc-text-muted);margin-top:3px;display:flex;align-items:center;gap:4px;}
.bk-dot{width:5px;height:5px;border-radius:50%;display:inline-block;}
.bk-dot.g{background:var(--green);}
.bk-dot.a{background:var(--amber);}
.bk-dot.r{background:var(--red);}

/* ── 16. PRINT ───────────────────────────────────────────────────────────── */
@media print{
  .topbar,.sidebar,#onboarding{display:none!important;}
  #app{display:block;height:auto;overflow:visible;}
  .main{overflow:visible;height:auto;}
  .page{display:none!important;}
  #page-reports{display:block!important;padding:0;}
}

/* ── 17. CAPACITY CIRCLES ────────────────────────────────────────────────── */
.cap-circles-block{
  margin-bottom:20px;background:var(--sc-surface);
  border:0.5px solid var(--sc-border);border-radius:var(--r2);
  padding:20px 22px;
}
/* B-DS3: cleaner label treatment — dropped uppercase/letter-spacing,
   matching the same direction B-DS1 already took with .sec-title. */
.cap-circle-label{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-align:center;margin-bottom:4px;}
.cap-circle-val{font-family:var(--font-d);font-size:22px;font-weight:500;color:var(--sc-text-primary);text-align:center;line-height:1.1;}
.cap-circle-sub{font-size:10px;color:var(--sc-text-muted);text-align:center;margin-top:2px;}
.cap-circles-inner{display:flex;align-items:center;gap:0;flex-wrap:wrap;}
.cap-circles-segments{display:flex;gap:6px;flex-wrap:wrap;flex:1;justify-content:flex-start;}
.cap-circles-divider{width:1px;background:var(--sc-border-strong);margin:0 20px;height:160px;flex-shrink:0;align-self:center;}
.cap-circle-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 6px;border-radius:var(--r);transition:var(--tr);min-width:130px;}
.cap-circle-card:hover{background:var(--sc-surface-hover);}
.cap-circle-combined{display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0;}
.cap-circle-label-top{font-size:11px;font-weight:500;color:var(--sc-text-secondary);text-align:center;letter-spacing:.01em;}
.cap-circle-benchrow{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:2px;}
.cap-bench-pill{
  font-size:10px;padding:2px 8px;border-radius:20px;font-weight:500;
  background:var(--sc-surface-hover);color:var(--sc-text-muted);border:0.5px solid var(--sc-border);
}
.cap-bench-pill.g{background:var(--sc-surface);color:var(--sc-text-secondary);border-color:var(--sc-border-strong);}
.cap-bench-pill.a{background:var(--sc-surface);color:var(--sc-text-secondary);border-color:var(--sc-border-strong);}
.cap-bench-pill.r{background:var(--sc-surface);color:var(--sc-text-secondary);border-color:var(--sc-border-strong);}
.cap-circles-legend{display:flex;gap:16px;margin-top:14px;padding-top:12px;border-top:0.5px solid var(--sc-border);flex-wrap:wrap;}
.cap-leg-item{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--sc-text-muted);}
.cap-leg-dot{width:8px;height:8px;border-radius:50%;}

@media(max-width:768px){
  .cap-circles-inner{flex-direction:column;align-items:flex-start;}
  .cap-circles-divider{width:100%;height:1px;margin:14px 0;}
  .cap-circles-segments{gap:4px;}
  .cap-circle-card{min-width:110px;}
  .cap-circles-legend{gap:10px;}
}

/* Heatmap (Bite 25) */
.sched-heatmap-table{border-collapse:collapse;font-size:11px;width:100%;}
.sched-heatmap-table th,.sched-heatmap-table td{padding:4px 6px;text-align:center;border:0.5px solid var(--sc-border);}
.sched-heatmap-table th{background:var(--sc-surface-hover);font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.05em;}

/* Room utilization strip (Bite 26) */
.room-util-row{display:grid;grid-template-columns:160px 1fr 60px 70px 80px 110px;gap:0;align-items:center;padding:8px 0;border-bottom:0.5px solid var(--sc-border);}
.room-util-name{font-size:13px;font-weight:500;color:var(--sc-text-primary);}
.room-util-bar-wrap{height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;}
.room-util-bar{height:100%;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}
.room-util-pct{font-size:13px;font-weight:500;color:var(--sc-text-primary);text-align:right;padding-right:8px;}
.room-util-meta{font-size:11px;color:var(--sc-text-muted);text-align:right;padding-right:8px;}
.room-util-best{font-size:11px;color:var(--sc-text-muted);text-align:right;}

@media(max-width:600px){
  .room-util-row{grid-template-columns:1fr auto;gap:4px;}
  .room-util-bar-wrap,.room-util-meta,.room-util-best{display:none;}
}

/* KPI Archive (Bite 28) */
.kpi-archive-table{width:100%;border-collapse:collapse;}
.kpi-archive-table th{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;padding:8px 12px;border-bottom:0.5px solid var(--sc-border);text-align:left;}
.kpi-archive-table td{font-size:14px;color:var(--sc-text-primary);padding:10px 12px;border-bottom:0.5px solid var(--sc-border);text-align:left;}
.kpi-archive-table tr:last-child td{border-bottom:none;}

@media(max-width:768px){
  .domain-grid{grid-template-columns:repeat(3,1fr);}
  .chart-grid{grid-template-columns:1fr;}
}
@media(max-width:480px){
  .domain-grid{grid-template-columns:1fr 1fr;}
  .stat-row{grid-template-columns:1fr 1fr;}
  .score-hero{grid-template-columns:1fr;text-align:center;}
}

/* ── 18. INSTRUCTOR ANALYTICS ────────────────────────────────────────────── */
/* Summary bar */
.instr-summary-bar{
  display:flex;flex-wrap:wrap;gap:8px;
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:14px 18px;
  margin-bottom:16px;
}
.instr-sum-item{display:flex;flex-direction:column;gap:2px;min-width:80px;}
.instr-sum-lbl{font-size:9px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;}
.instr-sum-val{font-family:var(--font-d);font-size:18px;font-weight:500;color:var(--sc-text-primary);font-variant-numeric:tabular-nums;}
.instr-sum-div{width:1px;background:var(--sc-border-strong);align-self:stretch;margin:0 4px;}

/* Cross-check */
.instr-xcheck{font-size:11px;color:var(--sc-caution);background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--sc-radius-card);padding:8px 12px;margin-bottom:12px;}

/* Add button */
.instr-add-btn{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--sc-accent);color:#fff;border:none;
  border-radius:var(--r);padding:8px 16px;font-size:13px;font-weight:500;
  cursor:pointer;white-space:nowrap;transition:var(--tr);
}
.instr-add-btn:hover{background:#3730a3;}
.instr-secondary-btn{
  display:inline-flex;align-items:center;gap:5px;
  background:var(--sc-surface);color:var(--sc-text-secondary);
  border:0.5px solid var(--sc-border-strong);border-radius:var(--r);
  padding:7px 12px;font-size:12px;font-weight:500;
  cursor:pointer;white-space:nowrap;transition:var(--tr);
}
.instr-secondary-btn:hover{border-color:var(--sc-accent);color:var(--sc-text-primary);}

/* Empty state */
.instr-empty{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:32px 16px;text-align:center;
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--sc-radius-card);
}

/* Instructor card */
.instr-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);margin-bottom:14px;
  overflow:hidden;transition:border-color .15s;
}
.instr-card:hover{border-color:var(--sc-border-strong);}
.instr-card-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;border-bottom:0.5px solid var(--sc-border);
  background:var(--sc-surface-hover);flex-wrap:wrap;gap:10px;
}
.instr-name{font-size:14px;font-weight:500;color:var(--sc-text-primary);}
.instr-type-badge{
  font-size:10px;font-weight:500;letter-spacing:.05em;
  text-transform:uppercase;border-radius:20px;
  padding:3px 10px;
}
.instr-type-badge.ft{background:var(--sc-accent-light);color:var(--sc-accent);}
.instr-type-badge.fl{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.instr-del-btn{
  background:transparent;border:0.5px solid var(--sc-border-strong);
  border-radius:6px;padding:4px 9px;font-size:11px;
  color:var(--sc-text-muted);cursor:pointer;transition:var(--tr);
}
.instr-del-btn:hover{border-color:var(--red);color:var(--red);}

/* Card body */
.instr-card-body{padding:18px;}
.instr-field-row{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:14px;}
.instr-field{display:flex;flex-direction:column;gap:4px;flex:1;min-width:130px;}
.instr-field-lbl{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.05em;}
.instr-field input,.instr-field select{
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  border-radius:7px;padding:7px 10px;font-size:13px;
  font-family:var(--font-b);color:var(--sc-text-primary);outline:none;
  transition:var(--tr);width:100%;
}
.instr-field input:focus,.instr-field select:focus{border-color:var(--sc-accent);}

/* Toggle group */
.instr-toggle-group{display:flex;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);border-radius:8px;overflow:hidden;}
.instr-toggle-opt{
  flex:1;padding:7px 12px;font-size:12px;font-weight:500;
  color:var(--sc-text-muted);background:transparent;border:none;
  cursor:pointer;transition:var(--tr);text-align:center;
}
.instr-toggle-opt.on{background:var(--sc-accent);color:#fff;}

/* Mini stats strip */
.instr-stats-strip{
  display:flex;gap:10px;flex-wrap:wrap;
  background:var(--sc-surface-hover);border-radius:var(--r);
  padding:10px 14px;margin-top:12px;
}
.instr-stat-item{display:flex;flex-direction:column;gap:2px;}
.instr-stat-lbl{font-size:9px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.05em;}
.instr-stat-val{font-family:var(--font-d);font-size:16px;font-weight:500;color:var(--sc-text-primary);font-variant-numeric:tabular-nums;}

@media(max-width:768px){
  .instr-field-row{flex-direction:column;}
  .instr-field{min-width:100%;}
}

/* Room assignment */
.instr-room-assign{display:flex;flex-direction:column;gap:10px;margin-bottom:12px;}
.instr-room-row{
  display:grid;grid-template-columns:1fr 80px 100px 100px;
  gap:10px;align-items:center;
  background:var(--sc-surface-hover);border-radius:var(--r);padding:10px 14px;
}
.instr-room-name{font-size:13px;font-weight:500;color:var(--sc-text-primary);}
.instr-room-inputs{display:flex;flex-direction:column;gap:12px;}
.instr-room-badge{
  font-size:10px;font-weight:500;
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  border-radius:20px;padding:2px 8px;color:var(--sc-text-muted);
}

@media(max-width:768px){
  .instr-room-row{grid-template-columns:1fr 1fr;gap:8px;}
}

/* KPI Panel (Bite 2) */
.instr-kpi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px;}
.instr-kpi-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:16px;
}
.instr-kpi-lbl{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;}
.instr-kpi-val{font-family:var(--font-d);font-size:var(--kpi-lg);font-weight:500;color:var(--sc-text-primary);line-height:1.1;font-variant-numeric:tabular-nums;}
.instr-kpi-sub{font-size:11px;color:var(--sc-text-muted);margin-top:4px;}

/* Horizontal bar */
.instr-bar-row{display:flex;align-items:center;gap:10px;margin-top:8px;}
.instr-bar-track{flex:1;height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;}
.instr-bar-fill{height:100%;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}
.instr-bar-fill.g{background:var(--sc-accent);}
.instr-bar-fill.a{background:var(--sc-accent);}
.instr-bar-fill.r{background:var(--sc-accent);}
.instr-bar-pct{font-size:12px;font-weight:500;color:var(--sc-text-primary);min-width:38px;text-align:right;}

/* Source note */
.instr-source-note{font-size:11px;color:var(--sc-text-muted);margin-bottom:12px;font-style:italic;}

/* Decision card */
.instr-decision-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:16px 18px;
  margin-bottom:14px;
}
.instr-decision-title{font-size:13px;font-weight:500;color:var(--sc-text-primary);margin-bottom:6px;}
.instr-decision-body{font-size:12px;color:var(--sc-text-secondary);line-height:1.6;}
.instr-decision-verdict{
  display:inline-flex;align-items:center;gap:5px;
  font-size:11px;font-weight:500;border-radius:20px;
  padding:4px 11px;margin-top:8px;
}
.instr-decision-verdict.g{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.instr-decision-verdict.a{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.instr-decision-verdict.r{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}

@media(max-width:768px){.instr-kpi-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.instr-kpi-grid{grid-template-columns:1fr;}}

/* Gauge row (Bite 3) */
.instr-gauge-row{display:flex;gap:4px;flex-wrap:wrap;align-items:flex-start;}
.instr-gauge-cell{display:flex;flex-direction:column;align-items:center;}

/* Charts panel */
.instr-charts-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;}
background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:16px 18px;
  margin-bottom:14px;
}
.instr-chart-title{font-size:11px;font-weight:500;color:var(--sc-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:12px;}
@media(max-width:700px){.instr-charts-grid{grid-template-columns:1fr;}}

/* Room P&L Matrix */
.instr-matrix-wrap{overflow-x:auto;border-radius:var(--r2);}
#instr-matrix-table th{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;padding:8px 12px;border-bottom:0.5px solid var(--sc-border);}
#instr-matrix-table td{font-size:14px;color:var(--sc-text-primary);padding:10px 12px;border-bottom:0.5px solid var(--sc-border);}
#instr-matrix-table tr:last-child td{border-bottom:none;}

/* ── 19. SIDEBAR DATA BUTTONS ────────────────────────────────────────────── */
.tb-autosave{font-size:11px;color:var(--sc-text-muted);opacity:0;transition:opacity .3s ease;margin-right:8px;white-space:nowrap;}
.sidebar-secondary-links{display:flex;flex-direction:column;gap:2px;margin-bottom:10px;padding-bottom:10px;border-bottom:0.5px solid var(--sc-border);}
.sdb-link{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:400;color:var(--sc-text-muted);padding:5px 8px;background:none;border:none;border-radius:var(--sc-radius-badge);cursor:pointer;text-align:left;transition:var(--tr);}
.sdb-link:hover{color:var(--sc-text-secondary);background:var(--sc-surface-hover);}
.sdb-link.active{color:var(--sc-accent-text);}
/* ── FP-4: Dashboard hero ──────────────────────────────────────────── */
.dash-hero{display:flex;gap:0;align-items:stretch;padding:0;background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--sc-radius-card) var(--sc-radius-card) 0 0;margin-bottom:0;}
.dash-hero-left{flex:1;min-width:0;padding:16px 20px;}
.dash-hero-right{flex-shrink:0;min-width:160px;display:flex;align-items:center;justify-content:center;padding:12px 16px;border-left:0.5px solid var(--sc-border);}
.dash-hero-score{font-size:40px;font-weight:500;color:var(--sc-text-primary);font-variant-numeric:tabular-nums;line-height:1;}
.dash-hero-arch{font-size:13px;font-weight:400;color:var(--sc-text-secondary);margin-top:3px;margin-bottom:6px;}
.dash-meta-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:11px;color:var(--sc-text-muted);}
.dash-meta-row span:not(:empty)+span:not(:empty)::before{content:'·';margin-right:4px;}
.dash-hero-cta{width:100%;padding:10px 12px;background:var(--sc-accent-light);border:0.5px solid rgba(67,56,202,0.2);border-radius:var(--sc-radius-chip);text-align:center;cursor:pointer;}
.dash-hero-cta-empty{width:100%;padding:12px;text-align:center;}
@media(max-width:600px){
  .dash-hero{flex-direction:column;}
  .dash-hero-right{min-width:0;width:100%;border-left:none;border-top:0.5px solid var(--sc-border);}
}
.sidebar-data-btns{display:flex;gap:5px;margin-bottom:10px;}
.sdb-btn{
  flex:1;display:flex;align-items:center;justify-content:center;
  gap:4px;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  border-radius:7px;padding:7px 5px;font-size:11px;
  font-family:var(--font-b);font-weight:500;color:var(--sc-text-muted);
  cursor:pointer;transition:var(--tr);
}
.sdb-btn:hover{border-color:var(--sc-accent);color:var(--sc-accent);}
.sdb-icon{font-size:12px;}
.sdb-reset:hover{border-color:var(--red);color:var(--red);}

/* ── 20. COST STRUCTURE ──────────────────────────────────────────────────── */
.cos-kpi-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px;}
.cos-kpi-card{
  flex:1;min-width:130px;
  display:flex;flex-direction:column;gap:4px;
}
.cos-kpi-lbl{
  font-size:var(--kpi-lbl);font-weight:500;
  text-transform:uppercase;letter-spacing:.06em;color:var(--sc-text-muted);
}
.cos-kpi-val{
  font-family:var(--font-d);font-size:var(--kpi-lg);
  font-weight:500;letter-spacing:-.02em;line-height:1.1;
  font-variant-numeric:tabular-nums;
}
.cos-kpi-val.g{color:var(--sc-text-primary);}
.cos-kpi-val.a{color:var(--sc-text-primary);}
.cos-kpi-val.r{color:var(--sc-text-primary);}
.cos-kpi-sub{font-size:11px;color:var(--sc-text-muted);line-height:1.4;}
.kpi-lbl{font-size:10px;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px;}
.kpi-val{font-family:var(--font-d);font-size:22px;font-weight:500;color:var(--sc-text-primary);font-variant-numeric:tabular-nums;}
.kpi-sub{font-size:10px;color:var(--sc-text-muted);margin-top:2px;line-height:1.4;}

/* Main layout */
.cos-layout{display:grid;grid-template-columns:1fr;gap:20px;align-items:start;}

/* Collapsible sections */
.cos-section{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);overflow:hidden;margin-bottom:10px;}
.cos-section-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;cursor:pointer;transition:var(--tr);
  user-select:none;
}
.cos-section-header:hover{background:var(--sc-surface-hover);}
.cos-section-title{font-size:13px;font-weight:500;color:var(--sc-text-primary);}
.cos-section-total{font-size:13px;font-weight:500;font-family:var(--font-d);color:var(--sc-text-primary);}
.cos-section-toggle{font-size:12px;color:var(--sc-text-muted);transition:transform .2s ease;}
.cos-section.open .cos-section-toggle{transform:rotate(180deg);}
.cos-section-body{display:none;border-top:0.5px solid var(--sc-border);padding:14px 18px;}
.cos-section.open .cos-section-body{display:block;}

/* Field rows */
.cos-field-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:0.5px solid var(--sc-border);}
.cos-field-row:last-child{border-bottom:none;}
.cos-field-lbl{font-size:12px;color:var(--sc-text-secondary);}
.cos-field-inp{
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  border-radius:7px;padding:6px 10px;font-size:13px;
  font-family:var(--font-d);font-weight:500;color:var(--sc-text-primary);
  outline:none;width:130px;text-align:right;transition:var(--tr);
}
.cos-field-inp:focus{border-color:var(--sc-accent);}

/* Visual panels */
.cos-vis-panel{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:18px;margin-bottom:14px;}
.cos-vis-title{font-size:11px;font-weight:500;color:var(--sc-text-secondary);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px;}
.cos-vis-sub{font-size:11px;color:var(--sc-text-muted);margin-bottom:14px;}

/* Donut legend */
.cos-donut-wrap{display:flex;align-items:center;gap:20px;flex-wrap:wrap;}
.cos-donut-canvas{position:relative;}
.cos-donut-legend{display:flex;flex-direction:column;gap:7px;flex:1;}
.cos-donut-item{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--sc-text-secondary);}
.cos-donut-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
.cos-donut-pct{margin-left:auto;font-weight:500;font-family:var(--font-d);font-size:13px;color:var(--sc-text-primary);}

/* Break-even grid */
.cos-be-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px;}
.cos-be-card{background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);border-radius:var(--r);padding:14px;}
.cos-be-lbl{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;}
.cos-be-val{font-family:var(--font-d);font-size:22px;font-weight:500;color:var(--sc-text-primary);line-height:1.1;font-variant-numeric:tabular-nums;}
.cos-be-sub{font-size:11px;color:var(--sc-text-muted);margin-top:3px;}

/* Waterfall */
.cos-waterfall-wrap{overflow-x:auto;border-radius:var(--r);}

/* Dashboard widget */
.cos-dash-widget-wrap{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:16px 18px;
  margin-bottom:12px;cursor:pointer;transition:var(--tr);
}
.cos-dash-widget-wrap:hover{border-color:var(--sc-border-strong);}
.cos-dash-widget-header{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:12px;
}
.cos-dash-widget-title{font-size:12px;font-weight:500;color:var(--sc-text-primary);text-transform:uppercase;letter-spacing:.05em;}
.cos-dash-widget-link{font-size:11px;color:var(--sc-accent);font-weight:500;}

/* ── VR-D2: Dashboard 4 KPI cards (Occupancy / Revenue gap / Retention / Net margin) ──
   Replaces the 6-chip pain strip. No colored badges anywhere. Delta text and the
   sparkline stroke are the only semantic color; card value color is neutral except
   Occupancy/Revenue gap which may render var(--sc-negative) when below target
   (the 2 permitted colored values on this tab — see dashRenderPainStrip()). */
.dash-kpi-grid{
  display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));
  gap:var(--sc-gap-grid);margin-bottom:14px;
}
.dash-kpi-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--sc-radius-card);padding:var(--sc-pad-card-sm);
  cursor:pointer;transition:var(--tr);position:relative;
}
.dash-kpi-card:hover{border-color:var(--sc-border-strong);}
.dash-kpi-lbl{
  font-size:11px;font-weight:500;letter-spacing:.06em;
  text-transform:uppercase;color:var(--sc-text-muted);margin-bottom:6px;
  display:flex;align-items:center;gap:3px;
}
.dash-kpi-val-row{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;}
.dash-kpi-val{
  font-family:var(--font-d);font-size:22px;font-weight:500;color:var(--sc-text-primary);
  font-variant-numeric:tabular-nums;line-height:1;
}
.dash-kpi-bench{font-size:10px;color:var(--sc-text-muted);margin-top:6px;}
.dash-kpi-spark{width:100%;height:22px;display:block;margin-top:8px;}
@media(max-width:900px){.dash-kpi-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.dash-kpi-grid{grid-template-columns:repeat(2,1fr);}}

/* ── 1.6: chip quick-edit ─────────────────────────────────────────────── */
.chip-edit-btn{width:13px;height:13px;border-radius:3px;border:0.5px solid var(--sc-border-strong);background:var(--sc-surface-hover);color:var(--sc-text-muted);font-size:9px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin-left:auto;opacity:0;transition:var(--tr);line-height:1;}
.pain-chip:hover .chip-edit-btn,.dash-kpi-card:hover .chip-edit-btn{opacity:1;}
.chip-edit-pop{position:absolute;top:calc(100% + 6px);left:0;z-index:300;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);border-radius:var(--r2);padding:12px 14px;min-width:210px;}
.pain-chip:nth-last-child(-n+2) .chip-edit-pop,.dash-kpi-card:nth-last-child(-n+2) .chip-edit-pop{left:auto;right:0;}
.cep-title{font-size:9px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--sc-text-muted);margin-bottom:8px;}
.cep-field{margin-bottom:8px;}
.cep-lbl{font-size:10px;color:var(--sc-text-secondary);margin-bottom:3px;display:block;}
.cep-row{display:flex;align-items:center;gap:6px;}
.cep-inp{flex:1;min-width:0;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);border-radius:var(--r);padding:5px 8px;font-size:13px;color:var(--sc-text-primary);font-family:var(--font-d);}
.cep-inp:focus{outline:none;border-color:var(--sc-accent);}
.cep-unit{font-size:11px;color:var(--sc-text-muted);white-space:nowrap;}
.cep-redirect{font-size:11px;color:var(--sc-text-secondary);line-height:1.55;margin-bottom:10px;}
.cep-btn-row{display:flex;gap:6px;margin-top:10px;}
.cep-done{flex:1;background:var(--sc-accent);color:#fff;border:none;border-radius:var(--sc-radius-btn);padding:6px 10px;font-size:11px;font-weight:500;cursor:pointer;}
.cep-nav{flex:1;background:transparent;color:var(--sc-text-primary);border:0.5px solid var(--sc-border-strong);border-radius:var(--sc-radius-btn);padding:6px 10px;font-size:11px;cursor:pointer;}

.week-teaser{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--sc-radius-card);padding:10px 16px;margin-bottom:16px;
  cursor:pointer;transition:var(--tr);
}
.week-teaser:hover{border-color:var(--sc-border-strong);}
.week-teaser-lbl{font-size:12.5px;font-weight:500;color:var(--amber);}
.week-teaser-btn{
  font-size:11px;font-weight:500;color:var(--sc-text-primary);background:var(--sc-surface-hover);
  border:0.5px solid var(--sc-border-strong);border-radius:var(--r);
  padding:6px 14px;white-space:nowrap;
}
.week-teaser-hero{
  padding:14px 18px;margin-bottom:18px;
}
.week-teaser-hero .week-teaser-lbl{font-size:14px;}
.week-teaser-hero .week-teaser-btn{font-size:12px;padding:8px 16px;}
.week-teaser-icon{font-size:10px;color:var(--amber);flex-shrink:0;}
.tw-stale-nudge{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--sc-radius-card);padding:10px 16px;margin-bottom:16px;
  font-size:12px;font-weight:500;color:var(--sc-caution);
}

.dash-row-a{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;}
.dash-row-a .cos-dash-widget-wrap{margin-bottom:0;}
@media(max-width:900px){.dash-row-a{grid-template-columns:1fr;}}

/* FP-11: fixed 2×2 grid (Intro→Member folded into Clients pulse — see index.html).
   align-items:start so a taller card (Clients, which now holds 2 sub-sections)
   doesn't stretch its row-mate to match; each card keeps its natural height. */
.pulse-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:16px;align-items:start;}
.pulse-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:14px 16px;
  transition:var(--tr);
  cursor:pointer;min-height:126px;
}
.pulse-card:hover{border-color:var(--sc-border-strong);}
.pulse-card-title{
  font-size:11px;font-weight:500;color:var(--sc-text-muted);
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px;
  display:flex;align-items:center;gap:5px;
}
.pulse-row{
  display:flex;align-items:center;justify-content:space-between;
  font-size:12px;color:var(--sc-text-secondary);padding:3px 0;gap:8px;
}
.pulse-row span:first-child{color:var(--sc-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pulse-kv{
  display:flex;align-items:center;justify-content:space-between;
  font-size:12px;color:var(--sc-text-muted);padding:3px 0;
}
.pulse-kv b{color:var(--sc-text-primary);font-weight:500;font-variant-numeric:tabular-nums;}
.pulse-divider{height:0.5px;background:var(--sc-border);margin:6px 0;}
.pulse-empty{padding:24px 16px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;}
.pulse-empty-msg{font-size:14px;font-weight:500;color:var(--sc-text-secondary);margin:0;line-height:1.5;}
.pulse-empty-sub{font-size:12px;color:var(--sc-text-muted);margin:0;}
.pulse-empty-nav{font-size:13px;font-weight:500;color:var(--sc-accent-text);background:none;border:none;padding:0;cursor:pointer;margin-top:4px;}
.pulse-empty-nav:hover{text-decoration:underline;}
.pulse-empty-icon{font-size:24px;color:var(--sc-text-muted);}
@media(max-width:560px){.pulse-grid{grid-template-columns:1fr;}}

@media(max-width:900px){.cos-be-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:600px){.cos-be-grid{grid-template-columns:1fr;}.cos-kpi-card{min-width:100px;}}

/* ── 21. PACKAGE HEALTH HEATMAP CARDS ───────────────────────────────────── */
.phs-heatmap-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:10px;margin-bottom:16px;
}
.phs-hm-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:16px;
}
.phs-hm-label{font-size:11px;font-weight:500;color:var(--sc-text-secondary);margin-bottom:6px;display:flex;align-items:center;gap:6px;}
.phs-hm-score{font-family:var(--font-d);font-size:28px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums;}
.phs-hm-score.g{color:var(--sc-text-primary);}
.phs-hm-score.a{color:var(--sc-text-primary);}
.phs-hm-score.r{color:var(--sc-text-primary);}
.phs-hm-bar{height:4px;border-radius:2px;background:var(--sc-surface-hover);margin-top:8px;overflow:hidden;}
.phs-hm-bar-fill{height:100%;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}
.phs-hm-bar-fill.g{background:var(--sc-accent);}
.phs-hm-bar-fill.a{background:var(--sc-accent);}
.phs-hm-bar-fill.r{background:var(--sc-accent);}

@media(max-width:600px){.phs-heatmap-grid{grid-template-columns:1fr 1fr!important;}}

/* ── 22. GAUGE NEEDLE ────────────────────────────────────────────────────── */
@keyframes gaugeArcIn{from{stroke-dasharray:0 188.5;}to{}}
#phs-gauge-arc{animation:none;}
.phs-gauge-wrap-inner svg{filter:drop-shadow(0 2px 8px rgba(0,0,0,0.25));}
.phs-gauge-svg{overflow:visible;display:block;}
.phs-gauge-needle{transform-origin:70px 72px;transition:transform 0.8s cubic-bezier(0.34,1.56,0.64,1);}
@keyframes gaugeIn{from{opacity:0;transform:scale(0.9);}to{opacity:1;transform:scale(1);}}
.phs-gauge-wrap-inner{animation:gaugeIn .4s ease;}

/* VR-PH1: hero card system classes — replaces one-off inline styles on the
   outer hero wrapper and the 3-column leak grid's repeated label/value pattern. */
.phs-hero{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:start;background:var(--sc-surface);border:0.5px solid var(--sc-negative);border-radius:var(--sc-radius-card);padding:18px 20px;margin-bottom:14px;}
.phs-hero-icon{font-size:20px;color:var(--sc-negative);flex-shrink:0;margin-top:2px;}
.phs-leak-lbl{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--sc-text-muted);margin-bottom:4px;}
.phs-leak-val{font-size:16px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--sc-negative);}
@media(max-width:600px){.phs-hero{grid-template-columns:1fr;}}

/* ── 23. REVENUE LEAK WATERFALL ──────────────────────────────────────────── */
.rev-leak-title{font-size:12px;font-weight:500;color:var(--sc-text-primary);}
.rev-leak-sub{font-size:11px;color:var(--sc-text-muted);margin-bottom:12px;}
.rev-leak-bar-wrap{height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;margin-bottom:6px;}
.rev-leak-bar-fill{height:100%;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}

/* ── 24. PACKAGE CARD STATUS BADGE ──────────────────────────────────────── */
.phs-card-status{
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 10px;border-radius:20px;
  font-size:10px;font-weight:500;
  letter-spacing:.04em;text-transform:uppercase;flex-shrink:0;
}
.phs-card-status.ok{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.phs-card-status.warn{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.phs-card-status.bad{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}

/* ── 25. REVENUE IMPACT BUBBLES ──────────────────────────────────────────── */
.rev-bubble-wrap{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.rev-bubble{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:80px;height:80px;border-radius:50%;
  background:var(--sc-surface-hover);border:2px solid var(--sc-border);
  font-size:11px;font-weight:500;color:var(--sc-text-primary);
  text-align:center;cursor:pointer;transition:var(--tr);
}
.rev-bubble:hover{transform:scale(1.08);}
.rev-bubble.pos{border-color:var(--sc-border-strong);background:var(--sc-surface-hover);}
.rev-bubble.neg{border-color:var(--sc-border-strong);background:var(--sc-surface-hover);}
.rev-bubble-val{font-family:var(--font-d);font-size:13px;font-weight:500;}
.rev-bubble-lbl{font-size:9px;color:var(--sc-text-muted);margin-top:2px;}

/* ── 26. PACKAGE PERFORMANCE MATRIX ──────────────────────────────────────── */
.pkg-perf-table{width:100%;border-collapse:collapse;}
.pkg-perf-table th{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;padding:8px 12px;border-bottom:0.5px solid var(--sc-border);}
.pkg-perf-table td{font-size:14px;color:var(--sc-text-primary);padding:10px 12px;border-bottom:0.5px solid var(--sc-border);}
.pkg-perf-table tr:last-child td{border-bottom:none;}
.pkg-perf-table tr:hover td{background:var(--sc-surface-hover);}

/* ── 27. VAT STRIP CARD ──────────────────────────────────────────────────── */
.vat-strip-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--r2);padding:18px 22px;
  margin-bottom:16px;position:relative;overflow:hidden;
}
.vat-strip-card::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--sc-accent);
}
.vsc-row{display:grid;grid-template-columns:1fr 120px;gap:4px;align-items:center;padding:8px 0;border-bottom:0.5px solid var(--sc-border);}
.vsc-row:last-child{border-bottom:none;}
.vsc-lbl{font-size:13px;color:var(--sc-text-primary);}
.vsc-sub{font-size:11px;color:var(--sc-text-muted);}
.vsc-val{font-family:var(--font-d);font-size:16px;font-weight:500;color:var(--sc-text-primary);text-align:right;}
.vsc-val.accent{color:var(--sc-accent);}
.vsc-val.green{color:var(--sc-text-primary);}
.vsc-badge{display:inline-block;font-size:10px;padding:2px 8px;border-radius:20px;background:var(--sc-surface-hover);color:var(--sc-text-secondary);font-weight:500;margin-top:4px;}

/* ── 28. WASY CARD ───────────────────────────────────────────────────────── */
.wasy-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:18px 22px;
  margin-bottom:16px;
}
.wasy-result-row{
  display:flex;align-items:center;justify-content:space-between;
  background:var(--sc-surface-hover);border-radius:var(--r);
  padding:14px 18px;margin-top:14px;
  border:0.5px solid var(--sc-border);
}
.wasy-result-lbl{font-size:11px;color:var(--sc-text-muted);}
.wasy-result-val{font-family:var(--font-d);font-size:24px;font-weight:500;color:var(--sc-text-primary);font-variant-numeric:tabular-nums;}

/* ── 29. PBR CARD ────────────────────────────────────────────────────────── */
.pbr-card{
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:16px 20px;
  margin-bottom:16px;
}
.pbr-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:12px;margin-top:12px;
}
.pbr-item{display:flex;flex-direction:column;gap:3px;}
.pbr-lbl{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.05em;}
.pbr-val{font-family:var(--font-d);font-size:20px;font-weight:500;color:var(--sc-text-primary);}
.pbr-hint{font-size:10px;color:var(--sc-text-muted);}

/* ── 30. SCORECARD / REPORTS ──────────────────────────────────────────────── */
.sc-row{
  display:grid;grid-template-columns:1fr 90px 100px 95px;
  gap:8px;align-items:center;
  padding:10px 14px;border-bottom:0.5px solid var(--sc-border);
}
.sc-row:hover{background:var(--sc-surface-hover);}
.sc-metric{font-size:13px;color:var(--sc-text-primary);}
.sc-val{font-size:13px;font-weight:500;font-family:var(--font-d);color:var(--sc-text-primary);text-align:right;}
.sc-bench{font-size:12px;color:var(--sc-text-muted);text-align:right;}
.sc-status{font-size:11px;font-weight:500;text-align:right;}
.sc-status.g{color:var(--sc-text-primary);}
.sc-status.a{color:var(--sc-text-primary);}
.sc-status.r{color:var(--sc-text-primary);}
.sc-table{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);overflow:hidden;}
.sc-header{
  display:grid;grid-template-columns:1fr 90px 100px 95px;
  gap:8px;padding:10px 14px;
  background:var(--sc-surface-hover);border-bottom:0.5px solid var(--sc-border);
}
.sc-header span{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;}
.sc-header span:not(:first-child){text-align:right;}

/* Package comparison */
.pkg-cmp{display:grid;grid-template-columns:1fr 24px 1fr;gap:8px;align-items:center;margin:12px 0;}
.pkg-cmp-old,.pkg-cmp-new{
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  border-radius:var(--r);padding:12px 14px;font-size:12px;color:var(--sc-text-secondary);
  line-height:1.7;
}
.pkg-cmp-new{border-color:rgba(31,217,138,0.25);background:rgba(31,217,138,0.04);}
.pkg-cmp-lbl{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;}
.pkg-cmp-name{font-size:13px;font-weight:500;color:var(--sc-text-primary);margin-bottom:4px;}
.pkg-cmp-arrow{font-size:18px;color:var(--sc-text-muted);text-align:center;}

/* ── 31. REVENUE TAB ──────────────────────────────────────────────────────── */
.rev-hero-row{
  display:grid;grid-template-columns:160px 1fr;
  gap:20px;align-items:start;
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:20px 24px;
  margin-bottom:16px;
}
.rev-hero-gauge{display:flex;flex-direction:column;align-items:center;gap:8px;}
.rev-hero-gauge svg{overflow:visible;}
.rev-hero-score-lbl{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;}
.rev-hero-status{
  display:inline-block;font-size:10px;font-weight:500;
  padding:3px 10px;border-radius:20px;letter-spacing:.04em;
  text-transform:uppercase;
}
.rev-hero-status.g{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.rev-hero-status.a{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.rev-hero-status.r{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.rev-hero-status.n{background:var(--sc-surface-hover);color:var(--sc-text-muted);}
.rev-kpi-grid{flex:1;min-width:280px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
/* Visual box properties (background/border/radius/padding/shadow) now come
   from the merged .kpi-card rule above (B-DS1) — this card intentionally
   picks up the same unified look as stat-card and cos-kpi-card. */
.rev-kpi-label{font-size:11px;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:5px;}
.rev-kpi-val{font-family:var(--font-d);font-size:22px;font-weight:500;color:var(--sc-text-primary);line-height:1;font-variant-numeric:tabular-nums;}
.rev-kpi-sub{font-size:11px;color:var(--sc-text-muted);margin-top:4px;}
/* B-DS1: generalised universal pill component — .rev-kpi-badge aliased in
   so existing Revenue-tab badges keep working unchanged. New status/delta
   pills added in later B-DS bites (domain cards, chart headers, etc.)
   should use .delta-pill directly. */
.delta-pill,.rev-kpi-badge{display:inline-block;font-size:13px;font-weight:500;margin-top:4px;}
.delta-pill.g,.rev-kpi-badge.g{color:var(--sc-positive);}
.delta-pill.a,.rev-kpi-badge.a{color:var(--sc-caution);}
.delta-pill.r,.rev-kpi-badge.r{color:var(--sc-negative);}

/* Three Profitability Levers */
.rev-lever-icon{
  width:34px;height:34px;border-radius:10px;
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:10px;font-size:16px;color:var(--sc-text-secondary);
}
.rev-lever-title{font-size:12px;font-weight:500;color:var(--sc-text-primary);margin-bottom:4px;}
.rev-lever-sub{font-size:11px;color:var(--sc-text-muted);}

/* Lever 1 — Pricing bar */
.rev-price-bar{height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;margin-top:8px;}
.rev-price-fill{height:100%;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}

/* Lever 2 — Revenue mix segments */
.rev-mix-bar{display:flex;height:8px;border-radius:4px;overflow:hidden;margin-top:10px;gap:2px;}
.rev-mix-seg{height:100%;border-radius:2px;transition:flex .5s ease;}
.rev-mix-seg.pkg{background:var(--sc-accent);}
.rev-mix-seg.sub{background:var(--cyan);}
.rev-mix-seg.dropin{background:var(--amber);}
.rev-mix-labels{display:flex;gap:10px;margin-top:8px;flex-wrap:wrap;}
.rev-mix-label-item{display:flex;align-items:center;gap:4px;font-size:10px;color:var(--sc-text-muted);}
.rev-mix-dot{width:7px;height:7px;border-radius:2px;}

/* Lever 3 — Burn rate track */
.rev-burn-track{height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;margin-top:10px;position:relative;}
.rev-burn-fill{height:100%;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}
.rev-burn-marker{position:absolute;top:-3px;width:2px;height:11px;background:var(--amber);border-radius:1px;}

/* Revenue ceiling */
.rev-ceiling-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:18px;
  margin-bottom:16px;
}
.rev-ceiling-title{font-size:11px;font-weight:500;color:var(--sc-text-secondary);text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;}
.rev-ceiling-nums{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:16px;}
.rev-ceiling-item{display:flex;flex-direction:column;gap:3px;}
.rev-ceiling-lbl{font-size:10px;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.05em;font-weight:500;}
.rev-ceiling-val{font-family:var(--font-d);font-size:20px;font-weight:500;color:var(--sc-text-primary);}

/* Margin Trajectory Ledger */
.ledger-tbl{width:100%;border-collapse:collapse;}
.ledger-tbl th{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;padding:8px 12px;border-bottom:0.5px solid var(--sc-border);}
.ledger-tbl td{font-size:14px;color:var(--sc-text-primary);padding:10px 12px;border-bottom:0.5px solid var(--sc-border);}
.ledger-tbl tr:last-child td{border-bottom:none;}
.ledger-tbl tr:hover td{background:var(--sc-surface-hover);}
.ledger-trend-up{color:var(--green);font-weight:500;}
.ledger-trend-dn{color:var(--red);font-weight:500;}
.ledger-trend-flat{color:var(--sc-text-muted);}

/* Stagnation alert */
.stag-alert{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--sc-radius-card);padding:16px 18px;margin-top:14px;
}
.stag-alert-title{font-size:12px;font-weight:500;color:var(--sc-negative);margin-bottom:6px;}
.stag-alert-body{font-size:12px;color:var(--sc-text-secondary);line-height:1.6;}

/* VR-D3: promoted Dashboard mirror — 7px dot + inline text + link, no colored
   background, no separate red title line. JS (updateStagHorizon) only ever
   toggles this element's display between 'none' and 'block' via inline style,
   so this stays a block-level container with plain inline children. */
.stag-alert-row{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--sc-radius-card);padding:9px 14px;margin-bottom:14px;
}
.stag-alert-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--sc-negative);margin-right:8px;vertical-align:middle;flex-shrink:0;}
.stag-alert-row-body{font-size:12px;color:var(--sc-text-primary);line-height:1.6;}
.stag-alert-row-link{font-size:12px;color:var(--sc-accent-text);font-weight:500;margin-left:8px;white-space:nowrap;cursor:pointer;}

/* Data entry collapsible */
.rev-data-section{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);margin-bottom:12px;overflow:hidden;
}
.rev-data-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:13px 18px;cursor:pointer;transition:var(--tr);user-select:none;
}
.rev-data-header:hover{background:var(--sc-surface-hover);}
.rev-data-title{font-size:12px;font-weight:500;color:var(--sc-text-primary);text-transform:uppercase;letter-spacing:.05em;}
.rev-data-body{border-top:0.5px solid var(--sc-border);padding:16px 18px;display:none;}
.rev-data-section.open .rev-data-body{display:block;}

@media(max-width:640px){
  .rev-hero-row{grid-template-columns:1fr;}
  .rev-kpi-grid{grid-template-columns:repeat(2,1fr);}
  .rev-ceiling-nums{grid-template-columns:1fr 1fr;}
}

/* ── 32. CAPACITY MANUAL ENTRY ────────────────────────────────────────────── */
.cap-manual-row{
  display:flex;align-items:center;gap:8px;
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:10px 14px;
  margin-bottom:8px;
}
.cap-manual-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cap-manual-sep{width:1px;height:26px;background:var(--sc-border);flex-shrink:0;}
.cap-manual-field{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex-shrink:0;}
.cap-manual-field-lbl{font-size:9px;color:var(--sc-text-muted);white-space:nowrap;font-weight:500;text-transform:uppercase;letter-spacing:.04em;}
.cap-manual-input{
  width:52px;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  border-radius:6px;padding:5px 6px;color:var(--sc-text-primary);
  font-size:13px;font-weight:500;font-family:var(--font-d);
  text-align:right;box-sizing:border-box;outline:none;transition:var(--tr);
}
.cap-manual-input:focus{border-color:var(--sc-accent);}
@media(max-width:380px){
  .cap-manual-row{padding:8px 10px;gap:6px;}
  .cap-manual-input{width:42px;font-size:12px;}
  .cap-manual-sep{margin:0 2px;}
}

/* ── 33. CLIENTS TAB ──────────────────────────────────────────────────────── */
.cli-estimate-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px;}
.cli-cohort-bar{height:10px;border-radius:5px;overflow:hidden;display:flex;gap:2px;margin:10px 0;}
.cli-cohort-seg{height:100%;border-radius:3px;transition:flex .5s ease;}
.cli-cohort-seg.g{background:var(--sc-text-muted);}
.cli-cohort-seg.a{background:var(--sc-text-muted);}
.cli-cohort-seg.r{background:var(--sc-text-muted);}
.cli-records-tbl{width:100%;border-collapse:collapse;}
.cli-records-tbl th{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;padding:8px 12px;border-bottom:0.5px solid var(--sc-border);}
.cli-records-tbl td{font-size:14px;color:var(--sc-text-primary);padding:10px 12px;border-bottom:0.5px solid var(--sc-border);}
.cli-records-tbl tr:last-child td{border-bottom:none;}
.cli-records-tbl tr:hover td{background:var(--sc-surface-hover);}
.cli-risk-pill{display:inline-block;font-size:10px;font-weight:500;padding:2px 8px;border-radius:20px;}
.cli-risk-pill.g{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.cli-risk-pill.a{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.cli-risk-pill.r{background:rgba(220,38,38,0.06);color:var(--red);}

/* Tier upgrade gate */
.cli-upgrade-gate{
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--r2);padding:20px;text-align:center;
  margin:16px 0;
}
.cli-upgrade-title{font-size:14px;font-weight:500;color:var(--sc-text-primary);margin-bottom:6px;}
.cli-upgrade-sub{font-size:12px;color:var(--sc-text-muted);margin-bottom:14px;}
.cli-upgrade-cta{
  display:inline-flex;align-items:center;
  background:var(--sc-accent);color:#fff;border:none;
  border-radius:var(--r);padding:10px 22px;
  font-size:13px;font-weight:500;cursor:pointer;transition:var(--tr);
}
.cli-upgrade-cta:hover{background:var(--accent-h);}

/* ── 34. DRAWER ───────────────────────────────────────────────────────────── */
.drawer-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,.5);
  z-index:200;opacity:0;pointer-events:none;
  transition:opacity .25s ease;
}
.drawer-backdrop.open{opacity:1;pointer-events:all;}
.drawer{
  position:fixed;top:0;right:0;bottom:0;
  width:min(600px,96vw);background:var(--sc-surface);
  border-left:0.5px solid var(--sc-border);z-index:201;
  display:flex;flex-direction:column;
  transform:translateX(100%);
  transition:transform .28s cubic-bezier(.4,0,.2,1);
  overflow:hidden;
}
.drawer.open{transform:translateX(0);}
.drawer-header{
  display:flex;align-items:center;gap:10px;
  padding:18px 20px 16px;border-bottom:0.5px solid var(--sc-border);flex-shrink:0;
}
.drawer-title{font-size:15px;font-weight:500;color:var(--sc-text-primary);flex:1;}
.drawer-tab-badge{
  font-size:11px;font-weight:500;color:var(--sc-accent-text);
  background:var(--sc-accent-light);border:0.5px solid rgba(99,102,241,0.25);
  border-radius:var(--sc-radius-badge);padding:2px 8px;
  letter-spacing:.04em;text-transform:uppercase;
}
.drawer-close{
  width:30px;height:30px;border-radius:7px;border:0.5px solid var(--sc-border);
  background:var(--sc-surface-hover);color:var(--sc-text-secondary);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;transition:var(--tr);flex-shrink:0;
}
.drawer-close:hover{background:var(--sc-surface-hover);color:var(--sc-text-primary);}
.drawer-body{flex:1;overflow-y:auto;padding:20px;}
.drawer-empty{
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;height:100%;text-align:center;gap:8px;
  padding:32px 16px;
}
.drawer-empty-icon{font-size:24px;color:var(--sc-text-muted);}
.drawer-empty-msg{font-size:14px;font-weight:500;color:var(--sc-text-secondary);margin:0;}
.drawer-empty-sub{font-size:12px;color:var(--sc-text-muted);margin:0;}

/* ── 35. PROFILE PANEL ────────────────────────────────────────────────────── */
/* Topbar user avatar button */
.tb-user-btn{
  position:relative;
  display:flex;align-items:center;gap:8px;
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:22px;padding:4px 12px 4px 4px;
  cursor:pointer;transition:var(--tr);flex-shrink:0;
}
/* OE-6: unread changelog dot */
.oe6-dot{
  position:absolute;top:2px;left:22px;
  width:8px;height:8px;border-radius:50%;
  background:var(--sc-negative);
  border:2px solid var(--sc-surface-hover);
}
.oe6-dot-inline{position:static;display:inline-block!important;margin-left:6px;border:none;width:6px;height:6px;}
.tb-user-btn:hover{border-color:var(--sc-accent);}
.tb-avatar{
  width:28px;height:28px;border-radius:50%;
  background:var(--sc-accent);
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:500;color:#fff;flex-shrink:0;
  font-family:var(--font-d);
}
.tb-user-name{font-size:12px;font-weight:500;color:var(--sc-text-primary);white-space:nowrap;}
.tb-chevron{font-size:10px;color:var(--sc-text-muted);transition:transform .2s ease;}
.tb-user-btn.open .tb-chevron{transform:rotate(180deg);}

/* Dropdown */
.tb-user-menu{
  position:absolute;top:calc(var(--topbar) + 6px);right:14px;
  background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-card);padding:6px;
  min-width:220px;z-index:300;
  display:none;
  animation:menuIn .15s ease;
}
.tb-user-menu.open{display:block;}
@keyframes menuIn{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:translateY(0);}}
.tb-user-info{padding:10px 12px 12px;border-bottom:0.5px solid var(--sc-border);margin-bottom:4px;}
.tb-user-info-name{font-size:14px;font-weight:500;color:var(--sc-text-primary);margin-bottom:2px;}
.tb-user-info-email{font-size:11px;color:var(--sc-text-muted);}
.tb-menu-item{
  display:flex;align-items:center;gap:10px;
  padding:9px 12px;border-radius:8px;font-size:13px;
  color:var(--sc-text-secondary);cursor:pointer;transition:var(--tr);
  background:transparent;border:none;width:100%;text-align:left;
}
.tb-menu-item:hover{background:var(--sc-surface-hover);color:var(--sc-text-primary);}
.tb-menu-item.danger:hover{background:var(--red-d);color:var(--red);}
.tb-menu-icon{
  width:30px;height:30px;border-radius:8px;
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;flex-shrink:0;
}
.tb-menu-sep{height:1px;background:var(--sc-border);margin:4px 6px;}

/* OE-5: cancellation flow modal */
.oe5-overlay{display:none;position:fixed;inset:0;z-index:360;background:rgba(0,0,0,0.35);}
.oe5-overlay.open{display:block;}
.oe5-modal{
  display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);
  width:420px;max-width:92vw;max-height:85vh;overflow-y:auto;
  background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-card);z-index:361;
  animation:menuIn .15s ease;
}
.oe5-modal.open{display:block;}
.oe5-modal-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 18px;border-bottom:0.5px solid var(--sc-border);
  position:sticky;top:0;background:var(--sc-surface);
}
.oe5-modal-title{font-size:16px;font-weight:500;color:var(--sc-text-primary);}
.oe5-modal-close{background:none;border:none;color:var(--sc-text-muted);cursor:pointer;padding:2px;display:flex;align-items:center;font-size:16px;}
.oe5-modal-close:hover{color:var(--sc-text-primary);}
.oe5-modal-body{padding:18px;}
.oe5-tenure{margin-bottom:18px;}
.oe5-tenure-stat{margin-bottom:4px;}
.oe5-tenure-val{font-size:14px;font-weight:500;color:var(--sc-text-primary);}
.oe5-tenure-sub{font-size:12px;color:var(--sc-text-muted);margin-top:6px;}
.oe5-pause-card{background:var(--sc-accent-light);border:0.5px solid var(--sc-border);border-radius:var(--sc-radius-chip);padding:14px;margin-bottom:18px;}
.oe5-section-label{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:6px;}
.oe5-pause-desc{font-size:12px;color:var(--sc-text-secondary);margin-bottom:10px;}
.oe5-pause-opts{display:flex;gap:8px;}
.oe5-pause-opt{
  flex:1;background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-btn);padding:8px;font-size:13px;font-weight:500;
  color:var(--sc-text-secondary);cursor:pointer;transition:var(--tr);
}
.oe5-pause-opt:hover{border-color:var(--sc-accent);}
.oe5-pause-opt.on{border-color:var(--sc-accent);color:var(--sc-accent-text);background:var(--sc-surface-hover);}
.oe5-reason-block{margin-bottom:4px;}
.oe5-reason-opts{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px;}
.oe5-reason-opt{
  background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-badge);padding:6px 10px;font-size:12px;
  color:var(--sc-text-secondary);cursor:pointer;transition:var(--tr);
}
.oe5-reason-opt:hover{border-color:var(--sc-accent);}
.oe5-reason-opt.on{border-color:var(--sc-accent);color:var(--sc-accent-text);background:var(--sc-accent-light);}
.oe5-reason-text{
  width:100%;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-chip);padding:8px 10px;font-size:13px;
  color:var(--sc-text-primary);font-family:var(--font-b);resize:vertical;outline:none;
}
.oe5-reason-text:focus{border-color:var(--sc-accent);}
.oe5-modal-foot{
  display:flex;justify-content:flex-end;gap:10px;padding:16px 18px;
  border-top:0.5px solid var(--sc-border);position:sticky;bottom:0;background:var(--sc-surface);
}
.oe5-btn-danger{
  background:transparent;border:0.5px solid rgba(220,38,38,0.35);color:var(--sc-negative);
  border-radius:var(--sc-radius-btn);padding:8px 16px;font-size:14px;font-weight:500;cursor:pointer;
}
.oe5-btn-danger:hover{background:rgba(220,38,38,0.06);}

/* OE-6: What's new panel */
.oe6-overlay{display:none;position:fixed;inset:0;z-index:340;background:transparent;}
.oe6-overlay.open{display:block;}
.oe6-panel{
  display:none;position:fixed;top:calc(var(--topbar) + 6px);right:14px;
  width:320px;max-height:70vh;overflow-y:auto;
  background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--sc-radius-card);padding:0;z-index:341;
  animation:menuIn .15s ease;
}
.oe6-panel.open{display:block;}
.oe6-panel-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;border-bottom:0.5px solid var(--sc-border);
  position:sticky;top:0;background:var(--sc-surface);
}
.oe6-panel-title{font-size:14px;font-weight:500;color:var(--sc-text-primary);}
.oe6-panel-close{
  background:none;border:none;color:var(--sc-text-muted);cursor:pointer;
  padding:2px;display:flex;align-items:center;font-size:16px;
}
.oe6-panel-close:hover{color:var(--sc-text-primary);}
.oe6-panel-list{padding:8px 16px 16px;}
.oe6-item{padding:10px 0;border-bottom:0.5px solid var(--sc-border);}
.oe6-item:last-child{border-bottom:none;}
.oe6-item-date{font-size:11px;color:var(--sc-text-muted);margin-bottom:2px;}
.oe6-item-text{font-size:12px;color:var(--sc-text-secondary);line-height:1.5;}
.oe6-panel-empty{padding:24px 16px;text-align:center;font-size:12px;color:var(--sc-text-muted);}

/* Profile page (page-profile) */
.profile-header-card{
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r3);padding:24px 28px;
  margin-bottom:16px;display:flex;align-items:center;
  gap:20px;flex-wrap:wrap;
}
.profile-avatar-lg{
  width:72px;height:72px;border-radius:50%;
  background:var(--sc-accent);
  display:flex;align-items:center;justify-content:center;
  font-size:26px;font-weight:500;color:#fff;
  font-family:var(--font-d);flex-shrink:0;
}
.profile-studio-name{font-family:var(--font-d);font-size:20px;font-weight:500;color:var(--sc-text-primary);margin-bottom:3px;}
.profile-studio-meta{font-size:13px;color:var(--sc-text-muted);}
.profile-info-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:14px 24px;
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--r2);padding:22px 26px;
  margin-bottom:14px;
}
.profile-field{display:flex;flex-direction:column;gap:4px;}
.profile-field-lbl{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.07em;}
.profile-field-val{font-size:14px;color:var(--sc-text-primary);font-weight:500;}
.profile-section-title{
  font-size:15px;font-weight:500;color:var(--sc-text-primary);
  margin-bottom:12px;padding-bottom:10px;
  border-bottom:0.5px solid var(--sc-border);
}
.profile-edit-btn{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);
  border-radius:var(--r);padding:7px 16px;
  font-size:12px;font-weight:500;color:var(--sc-text-secondary);
  cursor:pointer;transition:var(--tr);
}
.profile-edit-btn:hover{border-color:var(--sc-accent);color:var(--sc-accent);}

/* ── 36. MOBILE SIDEBAR ───────────────────────────────────────────────────── */
.sidebar-hamburger{
  display:none;background:transparent;border:none;
  color:var(--sc-text-secondary);cursor:pointer;padding:6px;
  border-radius:7px;transition:var(--tr);
}
.sidebar-hamburger:hover{background:var(--sc-surface-hover);color:var(--sc-text-primary);}
.sidebar-hamburger svg{width:20px;height:20px;display:block;}

/* Mobile overlay */
.sidebar-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,0.55);z-index:49;
}

@media(max-width:768px){
  :root{--sidebar:0px;}
  #app{grid-template-columns:1fr;grid-template-rows:var(--topbar) 1fr;}
  .sidebar{
    position:fixed;left:0;top:var(--topbar);bottom:0;
    width:240px;z-index:50;
    transform:translateX(-100%);
    transition:transform .28s cubic-bezier(.4,0,.2,1);
    border-right:0.5px solid var(--sc-border-strong);
  }
  .sidebar.mobile-open{transform:translateX(0);}
  .sidebar-overlay.mobile-open{display:block;}
  .sidebar-hamburger{display:flex;align-items:center;justify-content:center;}
  .page{padding:16px 16px 80px;}
  .domain-grid{grid-template-columns:repeat(3,1fr);}
  .stat-row{grid-template-columns:1fr 1fr;}
}
@media(max-width:480px){
  .domain-grid{grid-template-columns:1fr 1fr;}
  .stat-row{grid-template-columns:1fr;}
  .score-hero{grid-template-columns:1fr;text-align:center;}
  .chart-grid{grid-template-columns:1fr;}
  .rev-hero-row{grid-template-columns:1fr;}
}

/* ── 37. SCROLLBAR POLISH ─────────────────────────────────────────────────── */
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--sc-surface-hover);border-radius:10px;}
::-webkit-scrollbar-thumb:hover{background:var(--sc-surface-hover);}

/* ── 38. FOCUS RING (ACCESSIBILITY) ──────────────────────────────────────── */
:focus-visible{
  outline:2px solid var(--sc-accent);
  outline-offset:2px;
}
button:focus:not(:focus-visible),
input:focus:not(:focus-visible){outline:none;}

@media(prefers-reduced-motion:reduce){
  *,::before,::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* ── 39. UTILITY CLASSES ──────────────────────────────────────────────────── */
.text-g{color:var(--sc-text-primary);}
.text-a{color:var(--sc-text-primary);}
.text-r{color:var(--sc-text-primary);}
.text-accent{color:var(--sc-accent);}
.text-muted{color:var(--sc-text-muted);}
.fw-7{font-weight:500;}
.font-d{font-family:var(--font-d);}
.rag-pill{
  display:inline-flex;align-items:center;gap:4px;
  font-size:11px;font-weight:500;letter-spacing:.04em;
  text-transform:uppercase;border-radius:var(--sc-radius-badge);padding:2px 8px;
}
.rag-pill.g{background:rgba(22,163,74,0.06);color:var(--sc-positive);border:0.5px solid rgba(22,163,74,0.25);}
.rag-pill.a{background:rgba(217,119,6,0.06);color:var(--sc-caution);border:0.5px solid rgba(217,119,6,0.25);}
.rag-pill.r{background:rgba(220,38,38,0.06);color:var(--sc-negative);border:0.5px solid rgba(220,38,38,0.25);}
.rag-pill.n{background:var(--sc-surface);color:var(--sc-text-muted);border:0.5px solid var(--sc-border-strong);}


/* ── 40. PRESERVED COMPONENT RULES (migrated from original) ────────────── */
.ob-screen{display:none;}.ob-screen.active{display:block;}
.ob-rooms-table .rm-spots{width:80px;}
.ob-tier-icon{font-size:20px;margin-bottom:6px;}
.ob-err-tier.show{display:block;}
.ob-err{font-size:11px;color:var(--sc-negative);margin-top:4px;display:none;}
.ob-fiscal-box{background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);border-radius:8px;padding:10px 12px;}
.ob-fiscal-inp-row{display:flex;align-items:center;gap:6px;}
.ob-fiscal-unit{font-size:12px;color:var(--sc-text-muted);font-weight:500;}
.ob-fiscal-hint{font-size:10px;color:var(--sc-text-muted);margin-top:5px;line-height:1.5;}
.ob-duration-row{display:flex;gap:8px;margin-top:6px;}
.ob-dur-hint{font-size:10px;color:var(--sc-text-muted);margin-top:5px;line-height:1.5;}
.ob-day-box{background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);border-radius:8px;padding:10px 8px 8px;position:relative;min-width:0;overflow:hidden;}
.ob-day-title{font-size:10px;font-weight:500;color:var(--sc-text-muted);margin-bottom:8px;display:flex;align-items:center;justify-content:space-between;}
.ob-day-closed{display:flex;align-items:center;gap:5px;cursor:pointer;user-select:none;}
.ob-day-closed-chk{width:13px;height:13px;border-radius:3px;border:1.5px solid var(--sc-border-strong);display:flex;align-items:center;justify-content:center;font-size:8px;color:#fff;flex-shrink:0;transition:var(--tr);}
.ob-day-closed-lbl{font-size:10px;color:var(--sc-text-muted);}
.ob-closed-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:8px;background:rgba(244,63,94,0.05);border:0.5px solid rgba(244,63,94,0.2);pointer-events:none;opacity:0;transition:opacity .2s;}
.ob-closed-lbl{font-size:11px;font-weight:500;color:var(--red);}
.domain-score-pill{display:inline-flex;align-items:center;gap:7px;padding:5px 14px 5px 10px;border-radius:20px;font-size:12px;font-weight:500;margin-bottom:14px;border:0.5px solid;}
.dsp-score{font-family:var(--font-d);font-size:16px;font-weight:500;}
.ic-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;}
.ic-row{display:flex;align-items:center;gap:8px;}
.ic-input.err{border-color:var(--red);}
.ic-comp{font-size:11px;color:var(--sc-text-muted);margin-top:6px;min-height:14px;}
.tip-btn{position:relative;width:17px;height:17px;border-radius:50%;border:0.5px solid var(--sc-border-strong);background:var(--sc-surface-hover);color:var(--sc-text-muted);font-size:9px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--tr);flex-shrink:0;}
.tip-btn::before{content:'';position:absolute;top:50%;left:50%;width:44px;height:44px;transform:translate(-50%,-50%);}
.tip-title{font-size:10px;font-weight:500;color:var(--sc-text-primary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px;}
.tip-bench{margin-top:5px;padding-top:5px;border-top:0.5px solid var(--sc-border);}
.tip-bench-row{display:flex;justify-content:space-between;font-size:11px;padding:1px 0;}
.tip-bench-lbl{color:var(--sc-text-muted);}
.tip-bench-val{color:var(--sc-text-primary);font-weight:500;}
.info-banner{display:flex;align-items:flex-start;gap:9px;padding:9px 13px;background:rgba(124,106,255,0.06);border:0.5px solid rgba(124,106,255,0.14);border-radius:8px;font-size:12px;color:var(--sc-text-secondary);margin-bottom:10px;line-height:1.55;}
.sc-hdr{background:var(--sc-surface-hover);}
.sc-hdr .scc{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.04em;}
.sc-name{font-size:13px;color:var(--sc-text-primary);}
.sc-bv{font-size:11px;color:var(--sc-text-muted);text-align:right;}
.ac-top{display:flex;align-items:flex-start;gap:9px;margin-bottom:7px;}
.ac-num{width:24px;height:24px;border-radius:6px;background:var(--sc-surface-hover);font-family:var(--font-d);font-size:11px;font-weight:500;color:var(--sc-text-secondary);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.ac-step{display:flex;gap:7px;font-size:12px;color:var(--sc-text-secondary);}
.ac-sn{width:15px;height:15px;border-radius:50%;background:var(--sc-surface-hover);font-size:9px;font-weight:500;color:var(--sc-text-muted);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px;}
.qw-msgs{display:flex;flex-direction:column;gap:6px;margin:10px 0;}
.qw-msg{background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);border-radius:8px;padding:10px 12px;}
.qw-trigger{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:3px;}
.qw-text{font-size:12px;color:var(--sc-text-secondary);line-height:1.65;font-style:italic;}
.pkg-box{background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);border-radius:8px;padding:11px 13px;}
.pkg-box.new-pkg{border-color:rgba(31,217,138,0.28);background:rgba(31,217,138,0.025);}
.pkg-tag{font-size:9px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--sc-text-muted);margin-bottom:3px;}
.pkg-name{font-size:12px;font-weight:500;color:var(--sc-text-primary);margin-bottom:2px;}
.pkg-det{font-size:11px;color:var(--sc-text-muted);line-height:1.5;}
.pkg-price{font-size:14px;font-weight:500;font-family:var(--font-d);margin-top:5px;color:var(--sc-text-primary);}
.metric-score-wrap{display:flex;align-items:center;gap:8px;margin-top:9px;padding-top:9px;border-top:0.5px solid var(--sc-border);}
.metric-score-label{font-size:10px;color:var(--sc-text-muted);white-space:nowrap;}
.metric-score-bar{flex:1;height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;}
.metric-score-fill{height:100%;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}
.metric-score-num{font-family:var(--font-d);font-size:12px;font-weight:500;min-width:28px;text-align:right;transition:color .3s;}
.empty-state{display:flex;flex-direction:column;align-items:center;gap:8px;padding:32px 16px;text-align:center;}
.empty-icon{font-size:24px;color:var(--sc-text-muted);}
.vsc-title{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.07em;margin-bottom:12px;}
.vsc-row.total-row{padding-top:10px;margin-top:3px;}
.vsc-val.net{font-size:20px;color:var(--green);}
.vsc-footer{margin-top:10px;padding-top:10px;border-top:0.5px solid var(--sc-border);display:flex;gap:20px;flex-wrap:wrap;}
.vsc-footer-item{font-size:11px;color:var(--sc-text-muted);}
.wasy-tbl{width:100%;border-collapse:collapse;table-layout:fixed;}
.wasy-tbl thead th{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.04em;text-align:left;padding:0 6px 8px;}
.wasy-tbl thead th:not(:first-child){text-align:right;}
.wasy-tbl thead th:first-child{width:34%;}
.wasy-tbl tbody tr{border-bottom:0.5px solid var(--sc-border);}
.wasy-tbl tbody tr:hover{background:var(--sc-surface-hover);}
.wasy-tbl tbody td{padding:6px;}
.wasy-tbl tbody td:not(:first-child){text-align:right;}
.wasy-tbl input{width:100%;border:none;background:transparent;font-size:12px;color:var(--sc-text-primary);font-family:var(--font-sans);padding:4px;border-radius:4px;text-align:right;}
.wasy-tbl input[type="text"]{text-align:left;}
.wasy-tbl input:hover{background:var(--sc-surface-hover);}
.wasy-tbl input:focus{background:var(--sc-surface-hover);outline:1px solid var(--sc-accent);}
.wasy-tbl td.wasy-yield{font-family:var(--font-d);font-size:12px;font-weight:500;color:var(--sc-accent);white-space:nowrap;}
.wasy-del-btn{background:transparent;border:none;color:var(--sc-text-muted);cursor:pointer;font-size:12px;padding:2px 4px;border-radius:4px;line-height:1;}
.wasy-del-btn:hover{color:var(--sc-negative);background:var(--sc-surface-hover);}
.pbr-metric{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r);padding:12px 14px;}
.pain-banner{border-radius:var(--r2);padding:16px 20px;margin-bottom:14px;border:0.5px solid;}
.pain-banner.critical{background:rgba(244,63,94,0.05);border-color:rgba(244,63,94,0.25);}
.pain-banner.warning{background:rgba(245,166,35,0.05);border-color:rgba(245,166,35,0.25);}
.pb-header{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.pb-icon{font-size:16px;}
.pb-title{font-size:13px;font-weight:500;color:var(--sc-text-primary);}
.pb-body{font-size:12px;color:var(--sc-text-secondary);line-height:1.7;}
.ledger-wrap{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);overflow:hidden;margin-bottom:10px;}
.ledger-tbl .lt-label{font-weight:500;color:var(--sc-text-primary);white-space:nowrap;}
.ledger-tbl .lt-trend{font-weight:500;font-size:14px;}
.trend-tab{padding:6px 0;font-size:12px;font-weight:500;cursor:pointer;border:none;border-bottom:2px solid transparent;background:transparent;color:var(--sc-text-secondary);transition:var(--tr);white-space:nowrap;}
.trend-tab.active{color:var(--sc-accent-text);border-bottom-color:var(--sc-accent);}
.trend-inp{background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);border-radius:7px;padding:7px 10px;font-size:14px;font-family:var(--font-d);font-weight:500;color:var(--sc-text-primary);outline:none;width:100%;-moz-appearance:textfield;transition:var(--tr);}
.trend-del-btn{background:transparent;border:0.5px solid var(--sc-border);border-radius:7px;padding:6px 10px;font-size:12px;color:var(--sc-text-muted);cursor:pointer;transition:var(--tr);}
.sess-breakdown{display:flex;gap:10px;align-items:center;margin-top:6px;padding:8px 11px;background:rgba(34,211,238,0.05);border:0.5px solid rgba(34,211,238,0.12);border-radius:8px;flex-wrap:wrap;}
.sess-item{display:flex;flex-direction:column;gap:1px;}
.sess-item-lbl{font-size:9px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--sc-text-muted);}
.sess-item-val{font-family:var(--font-d);font-size:15px;font-weight:500;color:var(--sc-text-primary);}
.sess-sep{font-size:16px;color:var(--sc-border-strong);}
.bench-hint{font-size:10px;color:var(--sc-text-muted);margin-top:3px;line-height:1.4;}
.bench-hint .bh-good{color:var(--sc-positive,#16a34a);}
.bench-hint .bh-warn{color:var(--sc-caution,#d97706);}
.sched-heatmap-wrap{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:16px 18px;margin-bottom:18px;}
.room-util-wrap{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:14px 18px;margin-bottom:18px;}
.kpi-archive-wrap{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:16px 18px;margin-bottom:18px;}
.room-util-header{font-size:10px;font-weight:500;color:var(--sc-text-muted);padding:4px 0 8px;}
.room-util-bar-track{height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;}
.room-util-bar-fill{height:100%;border-radius:2px;transition:width 0.3s ease;}
.room-util-val{font-size:11px;font-weight:500;color:var(--sc-text-primary);text-align:right;padding-right:10px;}
.sched-heatmap-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;gap:10px;}
.sched-heatmap-title{font-size:13px;font-weight:500;color:var(--sc-text-primary);}
.sched-heatmap-filter{font-size:12px;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);border-radius:var(--r);padding:5px 10px;color:var(--sc-text-primary);cursor:pointer;}
.sched-heatmap-legend{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--sc-text-muted);}
.sched-heatmap-legend-bar{display:flex;gap:2px;}
.sched-heatmap-table td.sched-time{font-size:10px;color:var(--sc-text-muted);padding-right:8px;white-space:nowrap;font-weight:500;}
.sched-heatmap-cell{border-radius:5px;text-align:center;padding:7px 4px;font-size:11px;font-weight:500;cursor:default;transition:opacity .15s;position:relative;}
.sched-heatmap-cell.gap-slot{outline:2px dashed var(--amber);outline-offset:-2px;}
.sched-heatmap-cell.empty-slot{background:var(--sc-surface-hover);color:var(--sc-text-muted);font-weight:400;}
.sched-heatmap-hint{font-size:11px;color:var(--sc-text-muted);text-align:center;margin-top:10px;font-style:italic;}
.sched-tooltip{position:fixed;background:var(--sc-bg);border:0.5px solid var(--sc-border-strong);border-radius:var(--r);padding:8px 12px;font-size:11px;color:var(--sc-text-primary);pointer-events:none;z-index:9999;max-width:200px;line-height:1.5;display:none;}
.cap-cb-item{font-size:11px;font-weight:500;color:var(--sc-text-primary);white-space:nowrap;}
.cap-cb-sub{font-size:9px;font-weight:400;color:var(--sc-text-muted);}
.cap-leg-ring{display:inline-block;width:12px;height:12px;border-radius:50%;border:2.5px solid;flex-shrink:0;}
.instr-sum-cell{display:flex;flex-direction:column;gap:2px;padding-right:20px;border-right:0.5px solid var(--sc-border-strong);}
.instr-crosscheck{font-size:12px;padding:8px 14px;background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r);margin-bottom:14px;}
.instr-empty-icon{font-size:24px;color:var(--sc-text-muted);margin:0;}
.instr-empty-text{font-size:14px;font-weight:500;color:var(--sc-text-secondary);margin:0;}
.instr-empty-sub{font-size:12px;color:var(--sc-text-muted);max-width:360px;margin:0 auto;line-height:1.5;}
.instr-name-wrap{display:flex;align-items:center;gap:10px;}
.instr-avatar{width:34px;height:34px;border-radius:50%;background:var(--sc-accent);color:#fff;font-size:15px;font-weight:500;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.instr-name-input{font-size:15px;font-weight:500;color:var(--sc-text-primary);background:transparent;border:none;border-bottom:0.5px dashed var(--sc-border-strong);padding:2px 4px;width:200px;outline:none;}
.instr-eff-badge{font-size:11px;font-weight:500;padding:3px 9px;border-radius:20px;border:1.5px solid;background:transparent;letter-spacing:.02em;}
.instr-payout-badge{font-size:12px;font-weight:500;color:var(--sc-text-secondary);padding:3px 10px;background:var(--sc-bg);border:0.5px solid var(--sc-border);border-radius:20px;}
.instr-remove-btn{background:transparent;border:none;color:var(--sc-text-muted);font-size:14px;cursor:pointer;padding:4px 6px;border-radius:var(--r);transition:background .15s;line-height:1;}
.instr-section-row{display:flex;gap:20px;flex-wrap:wrap;align-items:flex-start;margin-bottom:16px;}
.instr-comp-fields{margin-bottom:4px;}
.instr-divider{height:1px;background:var(--sc-border);margin:14px 0;}
.instr-section-label{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--sc-text-muted);margin-bottom:12px;}
.instr-field-group{display:flex;flex-direction:column;gap:5px;flex:1;min-width:140px;}
.instr-field-label{font-size:11px;font-weight:500;color:var(--sc-text-secondary);text-transform:uppercase;letter-spacing:.05em;}
.instr-input-wrap{display:flex;align-items:center;background:var(--sc-bg);border:0.5px solid var(--sc-border);border-radius:var(--r);overflow:hidden;}
.instr-input{flex:1;padding:8px 10px;background:transparent;border:none;outline:none;font-size:13px;color:var(--sc-text-primary);min-width:0;}
.instr-unit{padding:0 10px;font-size:11px;color:var(--sc-text-muted);font-weight:500;white-space:nowrap;border-left:0.5px solid var(--sc-border);background:var(--sc-surface);}
.instr-hint{font-size:10px;color:var(--sc-text-muted);line-height:1.4;}
.instr-toggle{padding:6px 14px;background:transparent;border:none;font-size:12px;font-weight:500;color:var(--sc-text-muted);cursor:pointer;transition:all .15s;white-space:nowrap;}
.instr-toggle.on{background:var(--sc-accent);color:#fff;}
.instr-mini-stats{display:flex;gap:0;margin-top:16px;background:var(--sc-bg);border:0.5px solid var(--sc-border);border-radius:var(--r);overflow:hidden;}
.instr-mini-stat{flex:1;padding:10px 14px;border-right:0.5px solid var(--sc-border);display:flex;flex-direction:column;gap:2px;}
.instr-mini-lbl{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;}
.instr-mini-val{font-size:15px;font-weight:500;color:var(--sc-text-primary);}
.instr-room-pills{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.instr-room-pill{padding:6px 14px;border-radius:20px;border:1.5px solid var(--sc-border-strong);background:var(--sc-bg);color:var(--sc-text-muted);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;}
.instr-room-block{background:var(--sc-bg);border:0.5px solid var(--sc-border);border-radius:var(--r);padding:14px 16px;}
.instr-room-block-header{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:4px;}
.instr-room-block-label{font-size:13px;font-weight:500;color:var(--sc-text-primary);}
.instr-room-spot-badge{font-size:11px;font-weight:500;padding:2px 8px;border-radius:10px;background:var(--sc-surface);border:0.5px solid var(--sc-border);color:var(--sc-text-secondary);}
.instr-room-eff{font-size:12px;font-weight:500;margin-left:auto;}
.instr-room-cps{font-size:11px;font-weight:500;color:var(--sc-text-muted);padding:2px 8px;background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:10px;}
.instr-room-count-badge{font-size:11px;font-weight:500;padding:3px 9px;border-radius:20px;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);color:var(--sc-text-secondary);}
.instr-kpi-panel{margin-top:16px;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:16px 18px;}
.instr-kpi-panel-title{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--sc-text-muted);margin-bottom:14px;}
.instr-kpi-cell{display:flex;flex-direction:column;gap:4px;padding:12px 14px;background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r);}
.instr-kpi-bar-wrap{height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;margin:4px 0;}
.instr-kpi-bar-fill{height:100%;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}
.instr-kpi-source-note{font-size:11px;color:var(--sc-text-muted);margin-top:12px;padding:8px 12px;background:var(--sc-bg);border:0.5px solid var(--sc-border);border-radius:var(--r);line-height:1.5;}
.instr-kpi-decision{display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:12px 14px;border-radius:var(--r);border:1.5px solid;}
.instr-kpi-decision--good{background:var(--sc-surface-hover);border-color:var(--sc-border-strong);}
.instr-kpi-decision--switch-ft,.instr-kpi-decision--switch-fl{background:var(--sc-surface-hover);border-color:var(--sc-border-strong);}
.instr-kpi-decision--gold{background:var(--sc-surface-hover);border-color:var(--sc-border-strong);}
.instr-kpi-decision--audit{background:var(--sc-surface-hover);border-color:var(--sc-border-strong);}
.instr-kpi-dec-icon{font-size:18px;flex-shrink:0;margin-top:1px;}
.instr-kpi-dec-title{font-size:12px;font-weight:500;color:var(--sc-text-primary);margin-bottom:3px;}
.instr-kpi-dec-body{font-size:12px;color:var(--sc-text-secondary);line-height:1.5;}
.instr-charts-panel{margin-top:16px;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:16px 18px;}
.instr-charts-row{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap;}
.instr-charts-block{display:flex;flex-direction:column;gap:8px;min-width:0;}
.instr-charts-block-title{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--sc-text-muted);}
.instr-donut-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;}
.instr-donut-legend{display:flex;flex-direction:column;gap:4px;min-width:120px;}
.instr-donut-leg-row{display:flex;align-items:center;gap:6px;font-size:10px;}
.instr-donut-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.instr-donut-leg-lbl{color:var(--sc-text-secondary);flex:1;}
.instr-donut-leg-val{font-weight:500;color:var(--sc-text-primary);font-family:var(--font-d);}
.cos-inputs-col{display:flex;flex-direction:column;gap:0;}
.cos-col-title{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--sc-text-muted);margin-bottom:10px;}
.cos-visuals-col{display:flex;flex-direction:column;gap:14px;}
.cos-section-left{display:flex;align-items:center;gap:8px;}
.cos-section-icon{font-size:14px;}
.cos-section-right{display:flex;align-items:center;gap:8px;}
.cos-section-chevron{font-size:11px;color:var(--sc-text-muted);transition:transform .2s;}
.cos-field-label{font-size:11px;font-weight:500;color:var(--sc-text-secondary);display:flex;align-items:center;gap:5px;flex-wrap:wrap;}
.cos-auto-badge{font-size:9px;font-weight:500;padding:1px 6px;border-radius:10px;background:var(--sc-surface-hover);color:var(--sc-text-secondary);border:0.5px solid var(--sc-border-strong);}
.cos-field-input-wrap{display:flex;align-items:center;background:var(--sc-bg);border:0.5px solid var(--sc-border);border-radius:var(--r);overflow:hidden;}
.cos-field-input-wrap.is-auto{background:rgba(34,197,94,0.05);border-color:rgba(34,197,94,0.25);}
.cos-input{flex:1;padding:7px 10px;background:transparent;border:none;outline:none;font-size:12px;color:var(--sc-text-primary);min-width:0;}
.cos-input.overridden{color:var(--sc-text-primary);}
.cos-unit{padding:0 8px;font-size:10px;color:var(--sc-text-muted);font-weight:500;border-left:0.5px solid var(--sc-border);background:var(--sc-surface);white-space:nowrap;}
.cos-override-btn{padding:4px 8px;background:transparent;border:none;border-left:0.5px solid var(--sc-border);color:var(--sc-text-muted);cursor:pointer;font-size:11px;transition:color .15s;}
.cos-vis-row{display:flex;gap:12px;}

/* B-V7 — Costs tab Row 2/3 restructure */
.cos-row2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px;align-items:start;}
.cos-row3{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px;align-items:start;}
.cos-row2 .cos-vis-panel,.cos-row3 .cos-vis-panel{margin-bottom:0;}
@media(max-width:700px){.cos-row2,.cos-row3{grid-template-columns:1fr;}}

/* B-V7 — Instructors Row 1 stat tiles */
.instr-row1{display:grid;grid-template-columns:repeat(4,1fr) auto;gap:12px;align-items:center;margin-bottom:16px;}
.instr-row1-actions{display:flex;align-items:center;gap:8px;justify-content:flex-end;}
@media(max-width:780px){.instr-row1{grid-template-columns:repeat(2,1fr);}.instr-row1-actions{grid-column:1/-1;justify-content:flex-start;}}
.cos-vis-empty{font-size:12px;color:var(--sc-text-muted);padding:20px 0;text-align:center;}
.cos-donut-leg-row{display:flex;align-items:center;gap:6px;font-size:10px;}
.cos-donut-leg-lbl{flex:1;color:var(--sc-text-secondary);}
.cos-donut-leg-val{font-weight:500;color:var(--sc-text-primary);font-size:11px;}
.cos-be-title{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--sc-text-muted);margin-bottom:6px;}
.cos-be-gap{font-size:11px;font-weight:500;}
.cos-be-progress-wrap{height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;margin:5px 0;}
.cos-be-progress-fill{height:100%;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}
.cos-dash-inner{display:flex;gap:16px;align-items:center;flex-wrap:wrap;}
.cos-dash-metrics{display:flex;flex-direction:column;gap:4px;min-width:160px;}
.cos-dash-row{display:flex;align-items:center;gap:6px;}
.cos-dash-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.cos-dash-dot.amber{background:var(--amber);}
.cos-dash-dot.red{background:var(--red);}
.cos-dash-dot.neutral{background:var(--sc-border-strong);}
.cos-dash-lbl{flex:1;font-size:11px;color:var(--sc-text-secondary);}
.cos-dash-val{font-size:12px;font-weight:500;color:var(--sc-text-primary);}
.cos-mini-wf{display:flex;gap:2px;height:28px;flex:1;min-width:120px;border-radius:var(--r);overflow:hidden;}
.cos-mini-wf-empty{font-size:11px;color:var(--sc-text-muted);}
.heatmap-cell{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r);padding:14px 16px;position:relative;overflow:hidden;transition:transform .2s;cursor:default;}
/* B-DS5: colored left border — .hm-critical/.hm-warning/.hm-healthy/.hm-na
   were already being toggled correctly by existing JS (phsUpdateDisplaysOnly)
   but had NO corresponding CSS anywhere, so these cells have never actually
   shown any status color. Fixing the CSS only — JS untouched. */
.heatmap-cell::before{content:'';position:absolute;top:0;left:0;bottom:0;width:3px;background:var(--sc-surface-hover);}
.hm-label{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.06em;color:var(--sc-text-muted);margin-bottom:8px;}
.hm-score{font-family:var(--font-d);font-size:32px;font-weight:500;line-height:1.1;margin-bottom:8px;transition:color .3s;font-variant-numeric:tabular-nums;}
.hm-bar-track{height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;margin-bottom:6px;}
/* B-DS5: status label becomes a pill, colored via the cell's own state class
   (same already-correct classList — zero JS needed here either). */
.hm-status{
  display:inline-flex;align-items:center;
  font-size:11px;font-weight:500;letter-spacing:.02em;
  padding:2px 8px;border-radius:var(--sc-radius-badge);
  background:var(--sc-surface);color:var(--sc-text-muted);
  border:0.5px solid var(--sc-border-strong);
}
.heatmap-cell.hm-healthy .hm-status{background:rgba(22,163,74,0.06);color:var(--sc-positive);border-color:rgba(22,163,74,0.25);}
.heatmap-cell.hm-warning .hm-status{background:rgba(217,119,6,0.06);color:var(--sc-caution);border-color:rgba(217,119,6,0.25);}
.heatmap-cell.hm-critical .hm-status{background:rgba(220,38,38,0.06);color:var(--sc-negative);border-color:rgba(220,38,38,0.25);}
.plw-wrap{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:16px 18px;}
.plw-title{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.plw-svg{width:100%;overflow:visible;display:block;}
.plw-bar-label{font-size:10px;fill:var(--sc-text-muted);}
.plw-bar-value{font-size:11px;font-weight:500;}
.plw-connector{stroke:var(--sc-border-strong);stroke-width:1;stroke-dasharray:3 3;}
.phs-cs-healthy{background:var(--sc-surface-hover);color:var(--sc-text-secondary);border:0.5px solid var(--sc-border-strong);}
.phs-cs-warning{background:var(--sc-surface-hover);color:var(--sc-text-secondary);border:0.5px solid var(--sc-border-strong);}
.phs-cs-critical{background:var(--sc-surface-hover);color:var(--sc-text-secondary);border:0.5px solid var(--sc-border-strong);}
.phs-cs-na{background:var(--sc-surface-hover);color:var(--sc-text-muted);border:0.5px solid var(--sc-border);}
.pib-wrap{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:16px 18px;}
.pib-title{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px;display:flex;align-items:center;gap:8px;}
.pib-sub{font-size:10px;color:var(--sc-text-muted);margin-bottom:10px;}
.pib-svg{width:100%;overflow:visible;display:block;}
.ppm-wrap{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:16px 18px;}
.ppm-title{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px;display:flex;align-items:center;gap:8px;}
.ppm-sub{font-size:10px;color:var(--sc-text-muted);margin-bottom:12px;}
.ppm-svg{width:100%;overflow:visible;display:block;}
.ppm-dot{transition:r .3s ease,opacity .3s ease;cursor:default;}
.ppm-quadrant-lbl{font-size:9px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;opacity:.35;}
.ppm-axis-lbl{font-size:9px;fill:var(--sc-text-muted);}
.ppm-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:10px;}
.ppm-legend-item{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--sc-text-muted);}

/* PHS — Package Health Table (Bite B) */
.phs-pkg-table-wrap{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:14px 18px;margin-bottom:0;}
.phs-pkg-table-title{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px;display:flex;align-items:center;justify-content:space-between;}
.phs-pkg-row{display:grid;grid-template-columns:1fr 110px 82px 76px 78px;gap:8px;align-items:center;padding:7px 8px;border-radius:var(--r);transition:var(--tr);}
.phs-pkg-hdr{font-size:10px;color:var(--sc-text-muted);cursor:default!important;border-bottom:0.5px solid var(--sc-border);padding-bottom:6px;margin-bottom:2px;border-radius:0;}
.phs-pkg-row:not(.phs-pkg-hdr){cursor:pointer;}
.phs-pkg-row:not(.phs-pkg-hdr):hover{background:var(--sc-surface-hover);}
.phs-pkg-name-cell{min-width:0;}
.phs-pkg-name{font-size:12px;font-weight:500;color:var(--sc-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.phs-pkg-type{font-size:9px;font-weight:500;padding:1px 5px;border-radius:3px;display:inline-block;margin-top:2px;}
.phs-pkg-score-cell{display:flex;align-items:center;gap:6px;}
.phs-pkg-bar-bg{flex:1;height:4px;background:var(--sc-surface-hover);border-radius:2px;}
.phs-pkg-bar-fill{height:4px;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}
.phs-pkg-score-num{font-size:11px;font-weight:500;flex-shrink:0;min-width:20px;text-align:right;}
.phs-pkg-val{font-size:12px;color:var(--sc-text-primary);text-align:right;}
.phs-pkg-delta{font-size:11px;font-weight:500;text-align:right;}
.phs-pkg-status{text-align:right;}
.phs-pkg-badge{font-size:9px;font-weight:500;padding:2px 7px;border-radius:10px;display:inline-block;}

/* PHS — Format score mini-cards in hero (Bite A) */
.phs-fmt-sc-card{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--sc-radius-chip);padding:10px 14px;width:auto;display:inline-flex;flex-direction:column;}
.phs-fmt-sc-num{font-size:20px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums;}
.phs-fmt-sc-bar-bg{height:4px;background:var(--sc-surface-hover);border-radius:2px;margin:6px 0 5px;}
.phs-fmt-sc-bar-fill{height:4px;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}
.phs-fmt-sc-name{font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;}

/* PHS — Compact dimension score bars (Bite C) */
.phs-dim-list{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:14px 18px;margin-bottom:18px;}
.phs-dim-row{display:grid;grid-template-columns:180px 1fr 56px 92px;align-items:center;gap:10px;padding:7px 0;border-bottom:0.5px solid var(--sc-border);}
.phs-dim-row:last-child{border-bottom:none;padding-bottom:0;}
.phs-dim-lbl{font-size:11px;font-weight:500;color:var(--sc-text-primary);}
.phs-dim-lbl span{opacity:.55;font-weight:400;}
.phs-dim-bar-bg{height:4px;background:var(--sc-surface-hover);border-radius:2px;overflow:hidden;}
.phs-dim-bar-fill{height:4px;border-radius:2px;background:var(--sc-accent);transition:width 0.3s ease;}
.phs-dim-score{font-size:11px;font-weight:500;text-align:right;}
.phs-dim-row.hm-healthy .hm-status{color:var(--sc-text-secondary);}
.phs-dim-row.hm-warning .hm-status{color:var(--sc-text-secondary);}
.phs-dim-row.hm-critical .hm-status{color:var(--sc-text-secondary);}
.phs-dim-row.hm-na .hm-status{color:var(--sc-text-muted);}
.phs-comp-card{display:flex;flex-direction:column;gap:0;background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--sc-radius-card);padding:10px 12px;border-bottom:0.5px solid var(--sc-border);}
.phs-comp-card.hm-na{background:var(--sc-surface-hover);border-style:dashed;}
.phs-comp-card.hm-na .phs-dim-bar-bg{display:none;}
.rev-hero{display:flex;align-items:center;gap:20px;flex-wrap:wrap;background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);border-radius:var(--r2);padding:24px 28px;margin-bottom:14px;position:relative;overflow:hidden;}
/* VR-R1: compact score badge replaces the arc gauge */
.rev-score-badge{width:90px;flex-shrink:0;display:flex;flex-direction:column;align-items:flex-start;gap:5px;}
.rev-score-badge-lbl{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;}
.rev-score-badge-val{font-family:var(--font-d);font-size:36px;font-weight:500;color:var(--sc-text-primary);line-height:1;font-variant-numeric:tabular-nums;}
.rev-score-badge-denom{font-size:12px;color:var(--sc-text-muted);margin-left:2px;}
.rev-hero-divider{width:0.5px;align-self:stretch;background:var(--sc-border);flex-shrink:0;}
@media(max-width:900px){
  .rev-hero{flex-direction:column;align-items:flex-start;}
  .rev-hero-divider{display:none;}
  .rev-kpi-grid{grid-template-columns:repeat(2,1fr)!important;width:100%;}
}
/* VR-R2: "Money left on the table" — promoted full-width banner, below the KPI row */
.rev-gap-banner{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:var(--sc-surface);border:0.5px solid var(--sc-border);
  border-radius:var(--sc-radius-card);padding:16px 20px;
  margin-bottom:14px;flex-wrap:wrap;
}
.rev-gap-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--sc-negative);flex-shrink:0;}
.rev-levers{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px;}
.rev-lever{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:16px 18px;display:flex;flex-direction:column;gap:10px;}
.rev-lever-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;}
.rev-lever-impact{font-size:10px;font-weight:500;padding:2px 8px;border-radius:10px;white-space:nowrap;flex-shrink:0;}
.rev-lever-impact.neu{background:var(--sc-surface-hover);color:var(--sc-text-muted);}
/* B-DS4: these two variants were previously undefined — the pill rendered
   as unstyled plain text (no pill shape at all) in both the "above avg" and
   "below avg" states, i.e. every time real data populated it. Only the
   empty/no-data .neu state ever actually looked like a pill. */
.rev-lever-impact.pos{color:var(--green);}
.rev-lever-impact.neg{color:var(--red);}
.rev-lever-visual{width:100%;}
.rev-price-bar-wrap{position:relative;height:28px;background:var(--sc-surface-hover);border-radius:6px;overflow:visible;margin:4px 0;}
.rev-price-track{position:absolute;inset:0;border-radius:6px;overflow:hidden;}
.rev-price-marker{position:absolute;top:-4px;bottom:-4px;width:2px;border-radius:2px;transform:translateX(-50%);}
.rev-price-labels{display:flex;justify-content:space-between;font-size:9px;color:var(--sc-text-muted);margin-top:4px;}
.rev-mix-bars{display:flex;flex-direction:column;gap:5px;}
.rev-mix-row{display:flex;align-items:center;gap:8px;}
.rev-mix-lbl{font-size:10px;color:var(--sc-text-muted);width:72px;flex-shrink:0;}
.rev-mix-track{flex:1;height:8px;background:var(--sc-surface-hover);border-radius:4px;overflow:hidden;}
.rev-mix-fill{height:100%;border-radius:4px;transition:width .4s ease;}
.rev-mix-pct{font-size:10px;font-weight:500;width:30px;text-align:right;flex-shrink:0;}
.rev-mix-bench{font-size:9px;color:var(--sc-text-muted);margin-top:2px;text-align:right;}
.rev-burn-wrap{position:relative;margin:4px 0 8px;}
.rev-burn-zone{position:absolute;top:0;bottom:0;background:rgba(31,217,138,0.15);border-left:0.5px solid rgba(31,217,138,0.4);border-right:0.5px solid rgba(31,217,138,0.4);}
.rev-burn-labels{display:flex;justify-content:space-between;font-size:9px;color:var(--sc-text-muted);margin-top:5px;}
.rev-burn-legend{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--sc-text-muted);margin-top:6px;}
.rev-burn-legend-dot{width:8px;height:8px;border-radius:2px;flex-shrink:0;}
/* B-V6 — Revenue tab Row 2 restructure */
.rev-row2{display:grid;grid-template-columns:1fr 240px;gap:14px;margin-bottom:14px;align-items:start;}
/* VR-R4: Fiscal Strip + Forecast bottom row — fiscal strip narrower/fixed
   (compact key-value rows), forecast gets the remaining width (needs room
   for its chart). */
.rev-fiscal-forecast-row{display:flex;flex-direction:column;gap:14px;margin-bottom:14px;}
@media(max-width:900px){.rev-fiscal-forecast-row{grid-template-columns:1fr;}}
.rev-fiscal-summary{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);padding:18px 20px;display:flex;flex-direction:column;}
.rev-fiscal-title{font-size:10px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.07em;margin-bottom:12px;}
.rev-fiscal-row{display:flex;justify-content:space-between;align-items:center;padding:7px 0;border-bottom:0.5px solid var(--sc-border);}
.rev-fiscal-row.total{border-bottom:none;border-top:2px solid var(--sc-border-strong);padding-top:10px;margin-top:4px;}
.rev-fiscal-lbl{font-size:11px;color:var(--sc-text-muted);}
.rev-fiscal-val{font-family:var(--font-d);font-size:15px;font-weight:500;color:var(--sc-text-primary);}
.rev-fiscal-val.neg{color:var(--sc-text-primary);}
.rev-fiscal-val.net{color:var(--sc-text-primary);font-size:17px;}
.rev-fiscal-rate{font-size:10px;color:var(--sc-text-muted);margin-top:10px;padding-top:8px;border-top:0.5px solid var(--sc-border);}
.rev-fiscal-rate span{color:var(--sc-accent);font-weight:500;}
@media(max-width:680px){.rev-row2{grid-template-columns:1fr;}}
.rev-data-toggle{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r);cursor:pointer;font-size:12px;font-weight:500;color:var(--sc-text-secondary);transition:var(--tr);user-select:none;margin-bottom:0;}
.rev-data-toggle-arrow{font-size:10px;transition:transform .2s ease;color:var(--sc-text-muted);}
.rev-data-inner{padding-top:14px;}
.ob-fmt-chip{display:inline-block;font-size:10px;font-weight:500;padding:3px 8px;border-radius:20px;border:0.5px solid var(--sc-border-strong);color:var(--sc-text-muted);background:var(--sc-surface-hover);cursor:pointer;transition:var(--tr);margin:2px 3px 2px 0;user-select:none;pointer-events:auto;position:relative;z-index:1;}
.ob-fmt-chip.on{background:var(--sc-accent)!important;border-color:var(--sc-accent)!important;color:#fff!important;}
.ob-fmt-chip-row{padding:4px 8px 6px;display:flex;flex-wrap:wrap;align-items:center;}
.ob-fmt-chip-lbl{font-size:10px;color:var(--sc-text-muted);margin-right:6px;white-space:nowrap;}
.cap-manual-rows{margin-top:10px;display:flex;flex-direction:column;border:0.5px solid var(--sc-border);border-radius:var(--r);overflow:hidden;}
.cap-manual-label{font-size:12px;font-weight:500;color:var(--sc-text-secondary);}

/* ── 41. CLIENTS TAB — REDESIGN FOUNDATION (B-CLR0) ───────────────────────────
   Additive only. Reuses existing shared components directly, does NOT redefine
   them: .kpi-card (§ line ~523), .cli-risk-pill (§33), .cli-cohort-seg (§33),
   .cli-records-tbl (§33), .drawer* (§34), .cli-upgrade-* (§33).
   New classes below are all cli-clr- prefixed to avoid any collision with the
   existing per-tab systems (cos-, rev-, instr-, ob-, etc). ─────────────────── */

.cli-clr-zone-tag{display:flex;align-items:center;gap:8px;margin:22px 0 10px;}
.cli-clr-zone-tag:first-child{margin-top:0;}
.cli-clr-zone-dot{width:5px;height:5px;border-radius:50%;background:var(--sc-accent);flex-shrink:0;}
.cli-clr-zone-label{font-size:10.5px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;}
.cli-clr-zone-note{font-size:11px;color:var(--sc-text-muted);}

.cli-clr-kpi-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;}
@media(max-width:900px){.cli-clr-kpi-row{grid-template-columns:repeat(2,1fr);}}

.cli-clr-queue-card{background:var(--sc-surface);border:0.5px solid var(--sc-border-strong);border-radius:var(--r3);overflow:hidden;}
.cli-clr-queue-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:0.5px solid var(--sc-border);flex-wrap:wrap;gap:8px;}
.cli-clr-queue-title{font-family:var(--font-d);font-size:14px;font-weight:500;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.cli-clr-filter-row{display:flex;gap:6px;padding:10px 16px;border-bottom:0.5px solid var(--sc-border);flex-wrap:wrap;}
.cli-clr-filter-chip{font-size:11px;font-weight:500;padding:6px 12px;border-radius:20px;border:0.5px solid var(--sc-border-strong);color:var(--sc-text-secondary);cursor:pointer;background:var(--sc-surface-hover);transition:var(--tr);user-select:none;}
.cli-clr-filter-chip:hover{border-color:var(--sc-accent);}
.cli-clr-filter-chip.on-red{background:var(--sc-surface-hover);color:var(--sc-text-secondary);border-color:var(--sc-border-strong);}
.cli-clr-filter-chip.on-amber{background:var(--sc-surface-hover);color:var(--sc-text-secondary);border-color:var(--sc-border-strong);}
.cli-clr-filter-chip.on-cyan{background:var(--sc-surface-hover);color:var(--sc-text-secondary);border-color:var(--sc-border-strong);}
.cli-clr-filter-chip.on-neutral{background:var(--sc-surface-hover);color:var(--sc-text-secondary);border-color:var(--sc-border-strong);}
.cli-clr-filter-chip.active{background:var(--sc-surface-hover);color:var(--sc-text-secondary);border-color:var(--sc-border-strong);}

.cli-clr-queue-tbl{width:100%;border-collapse:collapse;}
.cli-clr-queue-tbl th{text-align:left;font-size:11px;font-weight:500;color:var(--sc-text-muted);text-transform:uppercase;letter-spacing:.06em;padding:8px 12px;border-bottom:0.5px solid var(--sc-border);}
.cli-clr-queue-tbl th.right,.cli-clr-queue-tbl td.right{text-align:right;}
.cli-clr-queue-tbl td{font-size:14px;color:var(--sc-text-primary);padding:10px 12px;border-bottom:0.5px solid var(--sc-border);vertical-align:middle;}
.cli-clr-queue-tbl tr:last-child td{border-bottom:none;}
.cli-clr-queue-tbl tr:hover td{background:var(--sc-surface-hover);}

.cli-clr-udot{width:8px;height:8px;border-radius:50%;display:inline-block;}
.cli-clr-udot.r{background:var(--red);}
.cli-clr-udot.a{background:var(--amber);}
.cli-clr-udot.c{background:var(--cyan);}

.cli-clr-cname{font-weight:500;font-size:12.5px;color:var(--sc-text-primary);display:flex;align-items:center;gap:6px;}
.cli-clr-tag-chip{font-size:8.5px;font-weight:500;padding:1px 6px;border-radius:8px;text-transform:uppercase;letter-spacing:.03em;}
.cli-clr-tag-chip.new{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.cli-clr-tag-chip.loyal{background:var(--sc-accent-light);color:var(--sc-accent);}
.cli-clr-cpkg{font-size:10.5px;color:var(--sc-text-muted);margin-top:1px;}

.cli-clr-visit-chip{font-size:10px;font-weight:500;padding:3px 8px;border-radius:6px;display:inline-block;}
.cli-clr-visit-chip.r{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.cli-clr-visit-chip.a{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}
.cli-clr-visit-chip.g{background:var(--sc-surface-hover);color:var(--sc-text-secondary);}

.cli-clr-burn-cell{display:flex;flex-direction:column;gap:3px;min-width:110px;}
.cli-clr-burn-line1{display:flex;align-items:center;gap:6px;}
.cli-clr-burn-bar-bg{width:44px;height:5px;border-radius:3px;background:var(--sc-surface-hover);overflow:hidden;}
.cli-clr-burn-bar-fill{height:100%;border-radius:3px;}
.cli-clr-burn-pct{font-size:10.5px;font-weight:500;color:var(--sc-text-primary);}
.cli-clr-burn-sub{font-size:9.5px;color:var(--sc-text-muted);}

.cli-clr-ltv-cell{display:flex;flex-direction:column;}
.cli-clr-ltv-val{font-weight:500;font-size:12px;color:var(--sc-text-primary);}
.cli-clr-ltv-val.hi{color:var(--sc-text-primary);}
.cli-clr-ltv-sub{font-size:9.5px;color:var(--sc-text-muted);}

.cli-clr-contact-chip{padding:3px 8px;border-radius:6px;background:var(--sc-surface-hover);border:0.5px solid var(--sc-border-strong);color:var(--sc-text-muted);cursor:pointer;font-size:10px;white-space:nowrap;display:inline-block;}
.cli-clr-contact-chip.set{color:var(--sc-text-secondary);background:var(--sc-surface-hover);border-color:transparent;}

.cli-clr-show-more{text-align:center;padding:11px;font-size:11px;color:var(--sc-accent);font-weight:500;cursor:pointer;border-top:0.5px solid var(--sc-border);}
.cli-clr-show-more:hover{background:var(--sc-accent-light);}

.cli-clr-two-col{display:grid;grid-template-columns:1.1fr 1fr;gap:14px;align-items:start;}
@media(max-width:900px){.cli-clr-two-col{grid-template-columns:1fr;}}
.cli-clr-ltv-overlay{margin:0 16px 14px;padding:9px 12px;background:var(--sc-accent-light);border:0.5px solid var(--sc-border);border-radius:var(--r);font-size:10.5px;color:var(--sc-text-secondary);}
.cli-clr-rq-row{display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border-bottom:0.5px solid var(--sc-border);font-size:11.5px;}
.cli-clr-rq-row:last-child{border-bottom:none;}
.cli-clr-rq-days{font-weight:500;font-size:10.5px;padding:2px 8px;border-radius:6px;}

.cli-clr-section{background:var(--sc-surface);border:0.5px solid var(--sc-border);border-radius:var(--r2);overflow:hidden;margin-bottom:9px;}
.cli-clr-section-header{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;cursor:pointer;transition:var(--tr);user-select:none;}
.cli-clr-section-header:hover{background:var(--sc-surface-hover);}
.cli-clr-section-left{display:flex;align-items:center;gap:11px;}
.cli-clr-section-icon{width:30px;height:30px;border-radius:8px;background:var(--sc-surface-hover);display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;}
.cli-clr-section-title{font-size:12.5px;font-weight:500;color:var(--sc-text-primary);}
.cli-clr-section-sub{font-size:10.5px;color:var(--sc-text-muted);margin-top:1px;}
.cli-clr-section-toggle{font-size:12px;color:var(--sc-text-muted);transition:transform .2s ease;}
.cli-clr-section.open .cli-clr-section-toggle{transform:rotate(90deg);}
.cli-clr-section-body{display:none;border-top:0.5px solid var(--sc-border);padding:14px 16px;}
.cli-clr-section.open .cli-clr-section-body{display:block;}

/* VR-V13: Unified toast stack container. Positioned fixed, stacks children
   vertically with 8px gap so multiple toasts never overlap. */
.sc-toast-stack{position:fixed;bottom:24px;z-index:10001;display:flex;flex-direction:column;gap:8px;pointer-events:none;}
.sc-toast-stack-bottom-right{right:24px;align-items:flex-end;}
.sc-toast-stack-bottom-center{left:50%;transform:translateX(-50%);align-items:center;}

/* ═══════════════════════════════════════════════════════════════════════════
   5.1 VISUAL LANGUAGE AUDIT — StudioCheck Design Conventions
   Locked July 2026. All new components MUST follow these rules.
   ═══════════════════════════════════════════════════════════════════════════

   PURPOSE: Prevent convention drift as Stage 2 components are built.
   New Dashboard forecasts (3.4, 3.5), at-risk client list (3.3), and
   partial-data mode (1.5) must all use the tokens and patterns below.

   ── RAG SIGNAL COLORS ────────────────────────────────────────────────────
   Use ONLY these three for good/warn/bad signals everywhere in the app.
   Never use hardcoded hex for a status color.
     Good:    var(--green)      #1fd98a
     Warn:    var(--amber)      #f5a623
     Bad:     var(--red)        #f43f5e
     Neutral: var(--sc-text-muted)      #55557a

   Subtle backgrounds (for banners, badges):
     Good bg:   var(--green-d)   rgba(31,217,138,0.10)
     Warn bg:   var(--amber-d)   rgba(245,166,35,0.10)
     Bad bg:    var(--red-d)     rgba(244,63,94,0.10)

   ── PERFORMANCE HEATMAP SCALE (6-stop) ───────────────────────────────────
   Used ONLY in Capacity heatmap, room utilization bars, instructor heatmap.
   NOT for RAG signals — these are continuous intensity scales, not status.
   Managed by perfColor(intensity) in JS — do not replicate inline.
     0.00–0.17: #c0392b  (very low)
     0.17–0.33: #e74c3c  (low)
     0.33–0.50: #e67e22  (below average)
     0.50–0.67: #f1c40f  (average)
     0.67–0.83: #a8d520  (good)
     0.83–1.00: #27ae60  (excellent)

   ── TREND ARROWS — THREE CONTEXTS, THREE CONVENTIONS ────────────────────
   Each is correct in its own context. Do not mix them.

   Context 1 — ABSOLUTE DELTA on pain chips / trajectory projections
     Use: ▲ (up) / ▼ (down)  — renderPainDelta(), getMetricTrajectory()
     Coloured by whether direction is good or bad for that metric.

   Context 2 — PERCENTAGE TREND on ledger / MoM trend rows
     Use: ↗ (rising) / ↘ (falling) / → (flat, <2% change)
     Managed by setTrend() — never replicate this logic inline.

   Context 3 — RANGE ALERT on seasonality / occupancy bands
     Use: ↑ (above band) / ↓ (below band) / → (within band)
     Used only in seasonal/occupancy band panels.

   ── FORECAST / PREDICTIVE PANEL PATTERN ─────────────────────────────────
   Any panel showing a forward projection MUST include:
   1. The projected value in the same typography as the actual value.
   2. A confidence disclaimer via forecastDisclaimer(nMonths) from JS.
   3. A → prefix on the projected number (e.g. "→ 30d: 58%").
   Colour the projection by direction vs current: green if trending good,
   red if trending bad, var(--sc-text-muted) if flat or unknown direction.

   ── PLATFORM BRAND COLORS (allowed exceptions) ──────────────────────────
   These must match the platform, not the app theme. Do not change.
     WhatsApp:  #25D366
     Viber:     #7360F2

   ── CHART SERIES PALETTE ────────────────────────────────────────────────
   Multi-series charts use a fixed palette (managed by JS, not CSS):
     ['#7c6aff','#22d3ee','#1fd98a','#f5a623','#f43f5e','#a78bfa']
   Single-metric sparklines use the direction color from --green/--red.

   ── TYPOGRAPHY SCALE (do not add new sizes) ─────────────────────────────
   Use existing font-size values only:
     Labels/eyebrows:  10–11px,  color: var(--sc-text-muted),  weight: 400–600
     Body/values:      12–13px,  color: var(--sc-text-secondary),  weight: 400–600
     Headlines:        14–16px,  color: var(--sc-text-primary),   weight: 600–700
     Hero numbers:     18–32px,  font-family: var(--font-d), weight: 700–800

   ── SPACING / RADIUS TOKENS ─────────────────────────────────────────────
   Use only these CSS variables for radius and elevation:
     var(--r)   — small radius (cards, inputs)
     var(--r2)  — medium radius (panels, modals)
     var(--shadow-sm) — card shadow
   ════════════════════════════════════════════════════════════════════════ */