:root {
  --bg: #fbfaf7;
  --panel: #ffffff;
  --panel-2: #f3f2ee;
  --text: #161616;
  --muted: #706f6a;
  --faint: #9b9a95;
  --border: rgba(22, 22, 22, 0.1);
  --border-strong: rgba(22, 22, 22, 0.18);
  --green: #007a5e;
  --green-dark: #053f34;
  --blue: #155f72;
  --amber: #ba7517;
  --red: #b91c1c;
  --shadow: 0 12px 28px rgba(20, 20, 20, 0.07);
  --radius: 8px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--text); background: var(--bg); letter-spacing: 0; }
button, input, select { font: inherit; letter-spacing: 0; }
button { cursor: pointer; }

/* ------------- LOGIN — L2: white card + jewel hairline strip (brand contract: jewels on white,
   no marketing copy — the login is a doorway, not a billboard; settled with Will 2026-07-12) ---- */
.login-screen { position: relative; min-height: 100vh; display: grid; place-items: center; background: #f6f8f7; padding: 28px 16px; }
.login-strip { position: absolute; top: 0; left: 0; right: 0; height: 5px; background: linear-gradient(90deg, #047857 0 25%, #1e47c4 0 50%, #7522bb 0 75%, #ad1f1f 0 100%); }
.login-panel { width: min(440px, 100%); background: var(--panel); border: 1px solid rgba(22, 22, 22, 0.05); border-radius: 14px; box-shadow: 0 24px 60px rgba(15, 30, 22, 0.12); padding: 42px 46px 34px; }
.login-lockup { display: flex; align-items: center; justify-content: center; gap: 11px; margin-bottom: 8px; }
.login-lockup .wordmark { font-size: 24px; font-weight: 800; letter-spacing: -0.01em; color: #17212b; }
.login-lockup .wordmark .wm-2 { font-weight: 700; }
.login-lockup .wm-2 .wp1 { color: #047857; }
.login-lockup .wm-2 .wp2 { color: #1e40af; }
.login-lockup .wm-2 .wp3 { color: #6b21a8; }
.login-lockup .wm-2 .wp4 { color: #c81e1e; }
.login-tenant { margin: 0 0 30px; text-align: center; font-size: 12.5px; color: #5b6673; }
.tenant-badge { display: flex; gap: 10px; align-items: center; margin-bottom: 28px; }
.tenant-badge > span, .workspace-card > span, .user-card > span { width: 34px; height: 34px; border-radius: 8px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #0f766e, #38bdf8); font-weight: 760; font-size: 12px; }
.tenant-badge strong, .workspace-card strong, .user-card strong { display: block; font-size: 13px; }
.tenant-badge small, .workspace-card small, .user-card small { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; }
.login-panel h2 { margin: 0 0 4px; font-size: 20px; text-align: center; }
.login-panel p { margin: 0 0 20px; color: var(--muted); font-size: 13px; line-height: 1.45; text-align: center; }
.login-panel input { width: 100%; border: 1px solid var(--border-strong); border-radius: 9px; padding: 12px 13px; margin-bottom: 10px; }
.login-panel .primary-btn, .login-panel .secondary-btn { width: 100%; margin-top: 2px; }
.login-note { margin: 12px 0 0 !important; font-size: 12px; color: var(--faint) !important; }
.login-error { min-height: 18px; margin-top: 10px; color: var(--red); font-size: 12px; text-align: center; }

/* ------------- APP SHELL ------------- */
.app-shell { display: none; min-height: 100vh; grid-template-columns: 224px minmax(0, 1fr); }
.app-shell.active { display: grid; }
.login-screen.hidden { display: none; }
/* Forest chrome convergence — the sidebar rail is Cadence's constant signature
   (--chrome-* from cadence-design.css). Content surfaces below stay light/tenant. */
.sidebar { position: sticky; top: 0; height: 100vh; background: var(--chrome-bg); border-right: 1px solid var(--chrome-line); display: flex; flex-direction: column; }
.sidebar-brand { padding: 20px 18px 18px; }
.sidebar-brand strong { display: block; font-size: 20px; line-height: 1.05; letter-spacing: -0.01em; font-weight: 700; white-space: nowrap; }
.sidebar-brand .wordmark .wm-1 { display: inline; font-size: 20px; color: var(--chrome-bright); }
.sidebar-brand .wordmark .wm-2 { display: inline; font-size: 20px; color: var(--chrome-dim); font-weight: 700; }
.sidebar-brand > span { display: block; margin-top: 7px; color: var(--chrome-dim); font-size: 11px; font-weight: 650; }
.sidebar-nav { padding: 6px 10px; display: grid; gap: 12px; overflow-y: auto; }
.nav-group { display: grid; gap: 2px; }
.nav-group-items { display: contents; } /* transparent in the left rail; a dropdown panel in top-nav */
.nav-group-label { padding: 0 8px 5px; color: var(--chrome-dim); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; }
.nav-item { position: relative; display: flex; align-items: center; gap: 9px; width: 100%; min-height: 36px; border: 0; border-radius: var(--radius); padding: 8px 10px; background: transparent; color: var(--chrome-text); text-align: left; font-size: 14px; line-height: 1.2; }
.nav-item:hover { background: var(--chrome-hover); color: var(--chrome-bright); }
.nav-item.active { background: var(--chrome-active); color: var(--chrome-bright); font-weight: 700; }
.nav-icon { width: 4px; height: 18px; border-radius: 999px; background: currentColor; opacity: 0; flex: 0 0 auto; }
/* explicit, consistent keyboard focus ring (best practice; :focus-visible = keyboard only, no ring on mouse click) */
:where(button, a, input, select, textarea, summary, [tabindex], .nav-item, .nav-item-top, .nav-group-label):focus-visible { outline: 2px solid var(--accent, #047857); outline-offset: 2px; border-radius: 4px; }
.nav-item.active .nav-icon { opacity: 1; background: var(--chrome-mint); }
.sidebar-footer { margin-top: auto; padding: 10px; border-top: 1px solid var(--chrome-line); display: grid; gap: 8px; }
.workspace-card { display: flex; align-items: center; gap: 9px; border: 0; border-radius: var(--radius); background: var(--chrome-card); padding: 8px; min-width: 0; }
.workspace-card > span { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #0f766e, #38bdf8); font-weight: 760; font-size: 11px; }
.workspace-card strong { display: block; font-size: 12px; color: var(--chrome-bright); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.workspace-card small { display: block; margin-top: 1px; color: var(--chrome-dim); font-size: 10px; }
.user-card { display: flex; align-items: center; gap: 9px; border: 0; border-radius: var(--radius); background: transparent; padding: 8px; min-width: 0; cursor: pointer; transition: background 0.12s; }
.user-card:hover { background: var(--chrome-card); }
.user-card > span { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #047857, #10B981); font-weight: 760; font-size: 11px; flex: none; }
.user-card > div { min-width: 0; flex: 1; }
.user-card .user-name { display: block; font-size: 12px; color: var(--chrome-bright); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-card .user-role { display: block; margin-top: 1px; color: var(--chrome-dim); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-card::after { content: '\22EF'; color: var(--chrome-dim); font-size: 16px; line-height: 1; flex: none; padding: 0 2px; }

.main { min-width: 0; }
.topbar { position: sticky; top: 0; z-index: 20; min-height: 56px; display: grid; grid-template-columns: 1fr minmax(280px, 460px) auto; gap: 14px; align-items: center; background: rgba(251,250,247,0.94); border-bottom: 1px solid var(--border); backdrop-filter: blur(10px); padding: 9px 24px; }
.topbar-context { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.topbar h1 { margin: 0; font-size: 18px; line-height: 1.2; }
.topbar p { margin: 3px 0 0; color: var(--faint); font-size: 12px; }
.command-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid var(--border); border-radius: 999px; background: var(--panel); color: var(--muted); padding: 8px 14px; font-size: 12px; }
.command-bar:hover { border-color: var(--border-strong); color: var(--text); }
.command-bar span { font-weight: 500; }
kbd { border: 1px solid var(--border); border-radius: 5px; padding: 2px 6px; color: var(--faint); background: var(--panel-2); font-size: 10px; }
.status-pills { display: flex; align-items: center; gap: 8px; }
.status-pill { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); border-radius: 999px; padding: 6px 9px; background: var(--panel); color: var(--muted); font-size: 11px; white-space: nowrap; }
/* Shared AI insight strip (matches the Bachmans workbench band) */
.ai-strip { display: flex; align-items: center; gap: 11px; padding: 11px 14px; margin: 14px 0; background: linear-gradient(90deg, rgba(0,122,94,0.07), rgba(0,122,94,0.02)); border: 1px solid rgba(0,122,94,0.18); border-radius: var(--radius); font-size: 13px; color: var(--text); line-height: 1.45; }
.ai-strip .ai-spark { width: 24px; height: 24px; border-radius: 7px; background: linear-gradient(135deg, #007a5e, #10b981); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: none; font-size: 13px; }
.ai-strip .ai-text { flex: 1; min-width: 0; }
.ai-strip .ai-text strong { color: var(--green); font-weight: 700; }
.ai-strip .ai-text em { font-style: normal; color: var(--muted); }
.status-pill.ai-active { color: var(--green); border-color: rgba(0,122,94,0.3); background: rgba(0,122,94,0.05); font-weight: 600; }
.status-pill.ok { color: var(--green); background: rgba(0,122,94,0.08); border-color: rgba(0,122,94,0.22); }
.status-pill.warn { color: var(--amber); background: rgba(186,117,23,0.08); border-color: rgba(186,117,23,0.22); }

.global-search { display: none; position: fixed; top: 76px; left: 50%; transform: translateX(-50%); width: min(720px, calc(100vw - 32px)); z-index: 40; }
.global-search.open { display: block; }
.global-search input { width: 100%; border: 1px solid var(--border-strong); border-radius: 12px; padding: 14px 16px; box-shadow: var(--shadow); }
.command-results { margin-top: 8px; background: var(--panel); border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow); overflow: hidden; }
.command-row { width: 100%; border: 0; background: var(--panel); padding: 11px 14px; display: flex; justify-content: space-between; gap: 12px; text-align: left; }
.command-row:hover { background: rgba(0,122,94,0.06); }
.command-row strong { display: block; }
.command-row span { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; }

.view { padding: 20px 24px 42px; max-width: none; }
.page-head { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.page-head h2 { margin: 0; font-size: 24px; line-height: 1.1; }
.page-head p { margin: 5px 0 0; color: var(--muted); max-width: 760px; line-height: 1.4; font-size: 13px; }
.actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.primary-btn, .secondary-btn { border: 1px solid transparent; border-radius: var(--radius); padding: 9px 12px; font-size: 13px; font-weight: 600; }
.primary-btn { background: var(--green-dark); color: #fff; }
.secondary-btn { background: var(--panel); border-color: var(--border-strong); color: var(--text); }
.secondary-btn.compact { padding: 6px 10px; font-size: 12px; }
.link-btn { border: 0; background: transparent; color: var(--green); padding: 0; font-weight: 600; }

/* ------------- SOURCE BADGES (NEW v2) ------------- */
.src { display: inline-flex; align-items: center; gap: 4px; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; padding: 2px 6px; border-radius: 4px; vertical-align: middle; line-height: 1.3; margin-left: 6px; white-space: nowrap; }
.src.live { color: var(--green); background: rgba(0,122,94,0.1); }
.src.staged { color: var(--amber); background: rgba(186,117,23,0.12); }
.src.seeded { color: var(--blue); background: rgba(21,95,114,0.1); }
.src.design { color: var(--faint); background: var(--panel-2); }
.src-legend { display: inline-flex; gap: 6px; align-items: center; font-size: 11px; color: var(--muted); }
.src-legend .src { margin-left: 0; }
.faint { color: var(--faint); }
.tr-total td { border-top: 2px solid var(--border); background: var(--panel-2); }
table.cat-grid th, table.cat-grid td { white-space: nowrap; }
tr.cat-head td { background: var(--panel-2); color: var(--muted); font-size: 12px; padding-top: 10px; border-top: 1px solid var(--border); }
/* Time-phased Style Supply Plan grid (accounts x weeks, styles stacked) */
.sp-wrap { overflow-x: auto; }
table.sp-grid { border-collapse: separate; border-spacing: 0; font-size: 12px; min-width: 100%; }
table.sp-grid th, table.sp-grid td { padding: 4px 10px; border-bottom: 1px solid var(--border); white-space: nowrap; text-align: right; }
table.sp-grid .sp-acct { position: sticky; left: 0; background: var(--panel); text-align: left; min-width: 200px; z-index: 1; }
table.sp-grid thead th { position: sticky; top: 0; background: var(--panel); color: var(--muted); font-weight: 600; z-index: 1; }
table.sp-grid thead .sp-acct { z-index: 2; }
table.sp-grid tr.sp-style td { background: var(--panel-2); font-weight: 600; border-top: 2px solid var(--border); }
table.sp-grid tr.sp-style .sp-acct { background: var(--panel-2); }
table.sp-grid tr.sp-style .sp-style-name { color: var(--muted); font-weight: 400; margin-left: 4px; }
table.sp-grid tr.sp-bold td { font-weight: 700; }
.scope-select.period { background: rgba(21,95,114,0.06); border-color: rgba(21,95,114,0.3); }
.scope-select.period label { color: var(--blue); }

/* ------------- WORKING-SET CONTEXT (NEW v2) ------------- */
.scope-context { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 16px; margin-bottom: 12px; }
.scope-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.scope-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 999px; padding: 4px 10px; font-size: 12px; color: var(--text); }
.scope-chip strong { font-weight: 700; color: var(--text); }
.scope-chip span { color: var(--muted); font-size: 11px; }
.scope-select { display: inline-flex; align-items: center; gap: 6px; background: rgba(0,122,94,0.06); border: 1px solid rgba(0,122,94,0.3); border-radius: var(--radius); padding: 4px 8px 4px 12px; min-height: 36px; }
.scope-select label { font-size: 10px; color: var(--green); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
.scope-select select { border: 0; background: transparent; font-size: 13px; font-weight: 600; color: var(--text); padding: 3px 4px; cursor: pointer; }
/* multi-select facet dropdown (replaces single-value <select> facets) */
.facet-dd.scope-select { display: inline-block; position: relative; padding: 0; cursor: pointer; }
.facet-dd > summary { list-style: none; display: flex; align-items: center; gap: 6px; padding: 5px 10px; min-height: 34px; }
.facet-dd > summary::-webkit-details-marker { display: none; }
.facet-dd .facet-sum { font-size: 13px; font-weight: 600; color: var(--text); }
.facet-dd .facet-caret { font-size: 10px; color: var(--green); font-style: normal; margin-left: auto; padding-left: 4px; }
.facet-dd[open] .facet-caret { transform: rotate(180deg); }
.facet-list { position: absolute; z-index: 60; top: calc(100% + 4px); left: 0; min-width: 190px; max-height: 290px; overflow-y: auto; background: var(--surface, #fff); border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 10px 30px rgba(15,23,42,0.16); padding: 6px; }
.facet-opt { display: flex; align-items: center; gap: 8px; padding: 5px 8px; font-size: 12.5px; color: var(--text); border-radius: 6px; cursor: pointer; white-space: nowrap; }
.facet-opt:hover { background: rgba(0,122,94,0.08); }
.facet-opt input { width: 14px; height: 14px; accent-color: var(--green); cursor: pointer; }
.facet-all { border-bottom: 1px solid var(--border); margin-bottom: 4px; padding-bottom: 7px; font-weight: 600; }
.scope-summary-label { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
.scope-context .scope-totals { display: flex; gap: 18px; align-items: center; }
.scope-totals .stat { display: flex; flex-direction: column; align-items: flex-end; }
.scope-totals .stat label { font-size: 10px; color: var(--faint); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
.scope-totals .stat strong { font-size: 17px; font-variant-numeric: tabular-nums; }

/* Inline-editable grid cells (Golden scheduling workbench) — invisible until hover/focus */
.gt-cell-num, .gt-cell-sel, .gt-cell-date { font: inherit; font-size: 12px; padding: 3px 6px; border: 1px solid transparent; border-radius: 5px; background: rgba(4,120,87,0.05); color: var(--text); cursor: pointer; max-width: 100%; }
th[data-sorted] { background: rgba(4,120,87,0.06); }
.gt-cell-num { width: 54px; text-align: right; }
.gt-cell-date { width: 130px; }
.gt-cell-num:hover, .gt-cell-sel:hover, .gt-cell-date:hover { border-color: var(--border); background: var(--surface2, #f4f5f7); }
.gt-cell-num:focus, .gt-cell-sel:focus, .gt-cell-date:focus { outline: none; border-color: var(--accent); background: var(--surface, #fff); cursor: text; }
.gt-peg-link { color: var(--accent); cursor: pointer; font-weight: 700; border-bottom: 1px dotted var(--accent); }
.gt-peg-link:hover { opacity: 0.75; }
.gt-stock-tag { display: inline-block; margin-left: 6px; font-size: 10px; font-weight: 700; padding: 1px 7px; border-radius: 10px; cursor: pointer; border: 1px solid; white-space: nowrap; }
.gt-stock-tag.out { color: #C74634; background: #FBE9E7; border-color: #F4C7BE; }
.gt-stock-tag.ss { color: #8a6d3b; background: var(--surface2, #f4f5f7); border-color: var(--border); font-weight: 600; }
.gt-stock-tag:hover { opacity: 0.8; }

/* Production calendar (Gantt board) — lines down the side, days across the top */
.gantt-wrap { overflow-x: auto; }
.gantt { min-width: 720px; }
.gantt-row { display: grid; grid-template-columns: 120px repeat(5, minmax(120px, 1fr)); }
.gantt-head .gantt-day, .gantt-corner { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--faint); padding: 6px 8px; border-bottom: 1px solid var(--border); }
.gantt-lane-label { padding: 8px; border-bottom: 1px solid var(--border); border-right: 1px solid var(--border); display: flex; flex-direction: column; gap: 2px; justify-content: center; }
.gantt-lane-label strong { font-size: 13px; }
.gantt-cap { font-size: 11px; color: var(--text2); font-variant-numeric: tabular-nums; }
.gantt-cap.over { color: #C74634; font-weight: 700; }
.gantt-cell { min-height: 62px; border-bottom: 1px solid var(--border); border-right: 1px solid var(--border); padding: 4px; display: flex; flex-direction: column; gap: 3px; position: relative; transition: background 0.12s; }
.gantt-cell.gantt-cell-over { background: rgba(4,120,87,0.08); outline: 2px dashed var(--accent); outline-offset: -2px; }
.gantt-cell-load { font-size: 10px; color: var(--faint); font-variant-numeric: tabular-nums; align-self: flex-end; }
.gantt-cell-load.over { color: #C74634; font-weight: 700; }
.gantt-block { background: var(--surface2, #f4f5f7); border-radius: 4px; padding: 3px 6px; font-size: 11px; cursor: grab; display: flex; justify-content: space-between; gap: 6px; align-items: center; }
.gantt-block:hover { background: var(--surface, #fff); box-shadow: 0 1px 3px rgba(0,0,0,0.12); }
.gantt-block:active { cursor: grabbing; }
.gcl-bar { display: block; width: 44px; height: 3px; background: var(--border); border-radius: 2px; margin-top: 2px; margin-left: auto; overflow: hidden; }
.gcl-fill { display: block; height: 100%; background: var(--accent); }
.gb-model { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gb-qty { color: var(--text2); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* WIP / routing kanban — station columns, draggable per-WO traveler cards */
.wip-filters { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; margin-bottom: 12px; }
.wip-filter { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.wip-filter-l { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--faint); margin-right: 2px; }
.wip-board { display: flex; gap: 12px; overflow-x: auto; padding: 4px 2px 10px; align-items: stretch; }
.wip-col { flex: 0 0 196px; background: var(--surface2, #f4f5f7); border: 1px solid var(--border); border-radius: 10px; padding: 10px; transition: background 0.12s, box-shadow 0.12s; }
.wip-col-slim { flex: 0 0 34px; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 10px 4px; }
.wip-slim-label { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--faint); white-space: nowrap; }
.wip-slim-zero { font-size: 10px; color: var(--faint); font-variant-numeric: tabular-nums; }
.wip-col.wip-col-over { background: rgba(4,120,87,0.07); box-shadow: inset 0 0 0 2px var(--accent); }
.wip-col-h { font-size: 12px; font-weight: 700; color: var(--text); padding: 2px 4px 10px; display: flex; justify-content: space-between; align-items: center; }
.wip-col-h .wip-count { font-size: 11px; color: var(--faint); font-weight: 600; background: var(--surface, #fff); border-radius: 10px; padding: 1px 8px; }
.wip-col.wip-done .wip-col-h { color: var(--green); }
.wip-col-body { display: flex; flex-direction: column; gap: 8px; min-height: 40px; }
.wip-empty { font-size: 11px; color: var(--faint); padding: 10px 6px; text-align: center; border: 1px dashed var(--border); border-radius: 6px; }
.wip-card { background: var(--surface, #fff); border: 1px solid var(--border); border-radius: 7px; padding: 9px 10px; box-shadow: 0 1px 2px rgba(0,0,0,0.04); cursor: grab; transition: box-shadow 0.12s, transform 0.06s; }
.wip-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.10); }
.wip-card:active { cursor: grabbing; transform: scale(0.99); }
.wip-card-top { display: flex; justify-content: space-between; gap: 6px; align-items: baseline; }
.wip-card-top strong { font-size: 12px; }
.wip-card-top .wip-qty { font-size: 11px; color: var(--text2); font-variant-numeric: tabular-nums; }
.wip-card-sub { font-size: 10px; color: var(--faint); margin: 3px 0 7px; }
.wip-ops { display: flex; gap: 2px; }
.wip-op { flex: 1; height: 6px; border-radius: 2px; background: var(--border); }
.wip-op.done { background: var(--green); }
.wip-op.active { background: #B45309; }
.wip-card-foot { font-size: 10px; color: var(--text2); margin-top: 7px; display: flex; justify-content: space-between; align-items: center; }
.wip-legend { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 11px; color: var(--text2); padding: 2px 2px 12px; }
.wip-legend .wip-step { background: var(--surface2, #f4f5f7); border: 1px solid var(--border); border-radius: 20px; padding: 3px 10px; font-weight: 600; }

/* Capacity planning — work-center x day load heat grid */
.wcap-grid { display: grid; grid-template-columns: 130px repeat(5, minmax(72px, 1fr)); min-width: 560px; }
.wcap-head { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--faint); padding: 7px 8px; border-bottom: 1px solid var(--border); text-align: center; }
.wcap-lane { padding: 9px; border-bottom: 1px solid var(--border); border-right: 1px solid var(--border); font-weight: 600; font-size: 13px; display: flex; align-items: center; }
.wcap-cell { border-bottom: 1px solid var(--border); border-right: 1px solid var(--border); padding: 9px 4px; text-align: center; font-size: 12px; font-variant-numeric: tabular-nums; }

/* Multi-select customer chips (Demand Exceptions / WD baseline) */
.dmx-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-bottom: 12px; }
.dmx-chips-label { font-size: 10px; color: var(--faint); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; margin-right: 2px; }
.dmx-chip { border: 1px solid var(--border-strong); border-radius: 999px; padding: 5px 12px; font-size: 12px; background: var(--panel); color: var(--muted); cursor: pointer; transition: background 0.12s, border-color 0.12s, color 0.12s; }
.dmx-chip:hover { border-color: var(--accent, #047857); color: var(--text); }
.dmx-chip.on { background: var(--accent-soft, #ECFDF5); border-color: var(--accent, #047857); color: var(--accent-text, #065F46); font-weight: 600; }

/* ------------- COMPACT FILTER CHIPS (NEW v2) ------------- */
.filter-chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 14px; }
.filter-chips .chip-search { flex: 1 1 240px; min-width: 200px; }
.filter-chips .chip-search input { width: 100%; border: 1px solid var(--border-strong); border-radius: var(--radius); padding: 8px 12px; font-size: 13px; background: var(--panel); min-height: 36px; }
.filter-chips select { border: 1px solid var(--border-strong); border-radius: var(--radius); padding: 8px 10px; background: var(--panel); min-height: 36px; font-size: 13px; min-width: 140px; }
.filter-chips .chip-more { color: var(--green); background: transparent; border: 0; padding: 8px 6px; font-size: 12px; font-weight: 600; }
.more-filters { display: none; flex-wrap: wrap; gap: 8px; align-items: center; padding: 12px; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 14px; }
.more-filters.open { display: flex; }
.more-filters .field { display: grid; gap: 4px; }
.more-filters .field label { font-size: 10px; color: var(--faint); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
.more-filters select, .more-filters input { border: 1px solid var(--border-strong); border-radius: var(--radius); padding: 7px 10px; background: var(--panel); min-height: 34px; font-size: 13px; }

/* ------------- MULTI-PICKER (NEW v2) ------------- */
.mpicker { position: relative; display: inline-block; }
.mpicker-btn { display: inline-flex; align-items: center; gap: 8px; background: var(--panel); border: 1px solid var(--border-strong); border-radius: var(--radius); padding: 6px 10px 6px 12px; min-height: 36px; font-size: 13px; color: var(--text); white-space: nowrap; min-width: 140px; }
.mpicker-btn:hover { border-color: var(--text); }
.mpicker-btn.has-selection { border-color: var(--green); background: rgba(0,122,94,0.04); }
.mpicker-btn .mpicker-lbl { font-size: 10px; color: var(--faint); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
.mpicker-btn .mpicker-val { font-weight: 600; color: var(--text); max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
.mpicker-btn .mpicker-caret { color: var(--muted); font-size: 11px; margin-left: 2px; }
.mpicker-pop { position: absolute; top: calc(100% + 4px); left: 0; min-width: 240px; max-width: 320px; background: var(--panel); border: 1px solid var(--border-strong); border-radius: var(--radius); box-shadow: var(--shadow); z-index: 30; }
.mpicker-head { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; border-bottom: 1px solid var(--border); font-size: 11px; color: var(--muted); }
.mpicker-clear { background: transparent; border: 0; color: var(--green); font-size: 11px; font-weight: 600; padding: 0; }
.mpicker-list { max-height: 320px; overflow-y: auto; padding: 4px 0; }
.mpicker-opt { display: flex; align-items: center; gap: 8px; padding: 6px 12px; cursor: pointer; font-size: 13px; }
.mpicker-opt:hover { background: rgba(0,122,94,0.05); }
.mpicker-opt input { margin: 0; cursor: pointer; }
.mpicker-opt span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mpicker-group { padding: 8px 12px 4px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--faint); }
/* Period multi-picker sits in the scope bar — tint it like the other scope selectors */
.mpicker.period-picker .mpicker-btn { background: rgba(21,95,114,0.06); border-color: rgba(21,95,114,0.3); }
.mpicker.period-picker .mpicker-btn .mpicker-lbl { color: var(--blue); }
.mpicker.period-picker .mpicker-btn.has-selection { border-color: var(--blue); background: rgba(21,95,114,0.1); }

/* ------------- WORK QUEUE (NEW v2) ------------- */
.queue-group { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 16px; margin-bottom: 12px; }
.queue-group-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.queue-group-head h3 { margin: 0; font-size: 14px; font-weight: 700; }
.queue-group-head .group-meta { color: var(--muted); font-size: 12px; }
.queue-list { display: grid; gap: 6px; }
.queue-row { display: grid; grid-template-columns: 22px minmax(0, 1fr) 110px 110px 140px 140px 80px; gap: 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--panel); text-align: left; cursor: pointer; transition: border-color 0.12s; }
.queue-row:hover { border-color: rgba(0,122,94,0.4); background: rgba(0,122,94,0.025); }
.queue-row .sev { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--faint); }
.queue-row .sev.high { background: var(--red); }
.queue-row .sev.med { background: var(--amber); }
.queue-row .sev.low { background: var(--green); }
.queue-row .title { min-width: 0; }
.queue-row .title strong { display: block; font-size: 13px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.queue-row .title small { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.queue-row .meta { font-size: 12px; color: var(--muted); }
.queue-row .meta strong { display: block; color: var(--text); font-size: 12px; font-weight: 600; }
.queue-row .meta small { display: block; margin-top: 1px; color: var(--faint); font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; }
.queue-row .go { text-align: right; color: var(--green); font-size: 12px; font-weight: 600; }
.queue-quickfilters { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.queue-quickfilters button { border: 1px solid var(--border-strong); background: var(--panel); border-radius: 999px; padding: 6px 12px; font-size: 12px; color: var(--muted); }
.queue-quickfilters button.active { background: var(--green); color: #fff; border-color: var(--green); }

/* ------------- KPI / METRIC (kept) ------------- */
.kpi-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
.kpi { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; min-width: 0; }
.kpi.featured { background: var(--green); border-color: var(--green); color: #fff; }
.kpi label { display: block; color: var(--faint); font-size: 10px; font-weight: 760; letter-spacing: 0.07em; text-transform: uppercase; }
.kpi.featured label { color: rgba(255,255,255,0.78); }
.kpi strong { display: block; margin-top: 8px; font-size: 25px; font-weight: 760; line-height: 1.1; overflow: hidden; text-overflow: ellipsis; }
.kpi small { display: block; margin-top: 7px; color: var(--muted); line-height: 1.3; }
.kpi.featured small { color: rgba(255,255,255,0.85); }

.two-col { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr); gap: 14px; align-items: start; }
.three-col { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.panel { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: 0 2px 8px rgba(0,0,0,0.02); min-width: 0; }
.panel-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--border); }
.panel-head h3 { margin: 0; font-size: 14px; font-weight: 700; }
.panel-head span { color: var(--faint); font-size: 12px; }

/* ------------- TABLES (kept) ------------- */
.table-wrap { overflow-x: auto; overflow-y: auto; max-width: 100%; padding-bottom: 8px; scrollbar-gutter: stable; }
.table-wrap::-webkit-scrollbar { height: 12px; width: 12px; }
.table-wrap::-webkit-scrollbar-thumb { background: rgba(22,22,22,0.26); border-radius: 999px; border: 3px solid #f8f7f3; }
.table-wrap::-webkit-scrollbar-track { background: #f8f7f3; border-radius: 999px; }
table { width: 100%; border-collapse: collapse; font-size: 12px; }
th, td { padding: 8px 10px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: middle; white-space: nowrap; }
th { position: sticky; top: 0; z-index: 2; color: var(--faint); background: #f8f7f3; font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; }
td.wrap { white-space: normal; line-height: 1.35; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
tr.clickable { cursor: pointer; }
tr.clickable:hover td { background: rgba(0,122,94,0.05); }
tr.selected td { background: rgba(0,122,94,0.07); }
.pill { display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; padding: 4px 8px; background: var(--panel-2); color: var(--muted); font-size: 10px; font-weight: 760; text-transform: uppercase; letter-spacing: 0.04em; white-space: nowrap; }
.pill.ok { color: var(--green); background: rgba(0,122,94,0.1); }
.pill.warn { color: var(--amber); background: rgba(186,117,23,0.12); }
.pill.red { color: var(--red); background: rgba(185,28,28,0.1); }
.delta-down { color: var(--red); }
.delta-up { color: var(--green); }

/* ------------- ITEM CARD GRID (NEW v2 Line Plan) ------------- */
.item-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.item-card { display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: var(--radius); background: var(--panel); padding: 0; text-align: left; min-width: 0; cursor: pointer; overflow: hidden; transition: border-color 0.12s, transform 0.12s; }
.item-card:hover, .item-card.active { border-color: rgba(0,122,94,0.5); transform: translateY(-1px); box-shadow: 0 6px 16px rgba(0,122,94,0.08); }
.item-card.active { border-width: 2px; padding: -1px; }
.item-card .card-img { aspect-ratio: 1 / 1; background: var(--panel-2); object-fit: cover; width: 100%; display: block; }
.item-card .card-img-placeholder { aspect-ratio: 1 / 1; background: var(--panel-2); display: grid; place-items: center; color: var(--faint); font-size: 11px; }
.item-card .card-body { padding: 10px 12px 12px; display: grid; gap: 4px; min-height: 110px; }
.item-card .card-body strong { font-size: 13px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.item-card .card-body small { color: var(--muted); font-size: 11px; }
.item-card .card-stats { display: flex; gap: 10px; margin-top: auto; padding-top: 6px; }
.item-card .card-stats div { font-size: 11px; color: var(--muted); }
.item-card .card-stats strong { font-size: 12px; color: var(--text); display: block; font-variant-numeric: tabular-nums; }
.item-card .card-foot { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; border-top: 1px solid var(--border); background: rgba(0,0,0,0.015); }
.item-card .card-foot .sku { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; color: var(--faint); }

/* ------------- SELECTED-STYLE DRAWER (NEW v2) ------------- */
.style-drawer { position: sticky; bottom: 0; margin-top: 18px; display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 18px; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; box-shadow: 0 -4px 16px rgba(0,0,0,0.04); }
.style-drawer img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; background: var(--panel-2); border-radius: var(--radius); }
.style-drawer .drawer-body { display: flex; flex-direction: column; min-width: 0; }
.style-drawer .drawer-title { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.style-drawer .drawer-title h3 { margin: 0; font-size: 20px; line-height: 1.2; }
.style-drawer .drawer-title p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.style-drawer .drawer-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 14px 0; }
.style-drawer .drawer-metric { border: 1px solid var(--border); border-radius: var(--radius); padding: 10px 12px; }
.style-drawer .drawer-metric label { color: var(--faint); font-size: 10px; text-transform: uppercase; font-weight: 700; letter-spacing: 0.06em; }
.style-drawer .drawer-metric strong { display: block; margin-top: 4px; font-size: 19px; font-variant-numeric: tabular-nums; }
.style-drawer .drawer-attrs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding-top: 12px; border-top: 1px solid var(--border); }
.style-drawer .drawer-attrs .attr { font-size: 12px; }
.style-drawer .drawer-attrs label { display: block; color: var(--faint); font-size: 10px; text-transform: uppercase; font-weight: 700; }
.style-drawer .drawer-attrs strong { display: block; margin-top: 3px; font-size: 12px; color: var(--text); }
.style-drawer .drawer-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }

/* ------------- SCENARIO STRIP (NEW v2 Demand Review) ------------- */
.scenario-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.scenario-cell { border: 1px solid var(--border); border-radius: var(--radius); background: var(--panel); padding: 10px 12px; }
.scenario-cell label { display: block; color: var(--faint); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
.scenario-cell strong { display: block; margin-top: 4px; font-size: 18px; font-variant-numeric: tabular-nums; }
.scenario-cell small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }

/* ------------- TAB STRIP (NEW v2 — Supply Review packet) ------------- */
.tab-strip { display: flex; gap: 0; border-bottom: 1px solid var(--border); margin-bottom: 16px; overflow-x: auto; }
.tab-strip button { background: transparent; border: 0; border-bottom: 2px solid transparent; padding: 10px 16px; font-size: 13px; font-weight: 600; color: var(--muted); white-space: nowrap; position: relative; }
.tab-strip button:hover { color: var(--text); }
.tab-strip button.active { color: var(--green); border-bottom-color: var(--green); }
.tab-strip button .tab-badge { display: inline-block; margin-left: 6px; background: var(--panel-2); border-radius: 999px; padding: 1px 8px; font-size: 10px; color: var(--muted); font-weight: 700; }
.tab-strip button.active .tab-badge { background: rgba(0,122,94,0.12); color: var(--green); }
.tab-strip button.warn .tab-badge { background: rgba(186,117,23,0.14); color: var(--amber); }

/* ------------- PACKET SUMMARY (NEW v2 — Supply Review banner) ------------- */
.packet-summary { display: flex; align-items: center; gap: 16px; background: var(--panel); border: 1px solid var(--border); border-left: 4px solid var(--amber); border-radius: var(--radius); padding: 12px 16px; margin-bottom: 14px; }
.packet-summary.ok { border-left-color: var(--green); }
.packet-summary.alert { border-left-color: var(--red); }
.packet-summary .ps-icon { width: 32px; height: 32px; border-radius: 50%; background: rgba(186,117,23,0.12); color: var(--amber); display: grid; place-items: center; font-weight: 800; font-size: 16px; flex: 0 0 32px; }
.packet-summary.ok .ps-icon { background: rgba(0,122,94,0.1); color: var(--green); }
.packet-summary.alert .ps-icon { background: rgba(185,28,28,0.1); color: var(--red); }
.packet-summary .ps-body { flex: 1; min-width: 0; }
.packet-summary .ps-body strong { display: block; font-size: 14px; margin-bottom: 2px; }
.packet-summary .ps-body span { display: block; color: var(--muted); font-size: 12px; }
.packet-summary .ps-actions { display: flex; gap: 8px; flex: 0 0 auto; }

/* ------------- ACTION RAIL (NEW v2 — Line Plan + drawer) ------------- */
.action-rail { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.action-pill { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--border-strong); background: var(--panel); border-radius: 999px; padding: 5px 11px; font-size: 11px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: 0.04em; }
.action-pill:hover { color: var(--text); border-color: var(--text); }
.action-pill.active.watch { color: var(--blue); background: rgba(21,95,114,0.08); border-color: rgba(21,95,114,0.4); }
.action-pill.active.include { color: var(--green); background: rgba(0,122,94,0.1); border-color: rgba(0,122,94,0.4); }
.action-pill.active.cut { color: var(--red); background: rgba(185,28,28,0.08); border-color: rgba(185,28,28,0.4); }

.decision-tag { display: inline-flex; align-items: center; gap: 4px; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; padding: 2px 6px; border-radius: 4px; margin-left: 6px; }
.decision-tag.watch { color: var(--blue); background: rgba(21,95,114,0.1); }
.decision-tag.include { color: var(--green); background: rgba(0,122,94,0.1); }
.decision-tag.cut { color: var(--red); background: rgba(185,28,28,0.1); }

/* ------------- RECENTLY OPENED (NEW v2 — command bar) ------------- */
.recent-row { display: flex; gap: 6px; padding: 8px 14px; background: var(--panel-2); border-top: 1px solid var(--border); font-size: 11px; color: var(--muted); align-items: center; flex-wrap: wrap; }
.recent-row label { font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; font-size: 10px; }
.recent-row button { background: var(--panel); border: 1px solid var(--border); border-radius: 4px; padding: 3px 8px; font-size: 11px; color: var(--text); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.recent-row button:hover { border-color: var(--green); color: var(--green); }

/* ------------- DATA TRUST PAGE (NEW v2) ------------- */
.trust-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; margin-bottom: 18px; }
.trust-card { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px 18px; }
.trust-card label { display: block; color: var(--faint); font-size: 10px; text-transform: uppercase; letter-spacing: 0.07em; font-weight: 700; margin-bottom: 8px; }
.trust-card strong { display: block; font-size: 17px; line-height: 1.3; margin-bottom: 6px; word-break: break-word; }
.trust-card small { display: block; color: var(--muted); font-size: 12px; line-height: 1.4; }
.trust-card .trust-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; vertical-align: middle; margin-right: 6px; background: var(--faint); }
.trust-card.live .trust-dot { background: var(--green); }
.trust-card.warn .trust-dot { background: var(--amber); }
.trust-card.alert .trust-dot { background: var(--red); }
.trust-stat { display: flex; gap: 18px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); font-size: 12px; }
.trust-stat div span { display: block; color: var(--faint); font-size: 10px; text-transform: uppercase; font-weight: 700; }
.trust-stat div strong { display: block; margin-top: 2px; font-size: 14px; font-variant-numeric: tabular-nums; }

/* ------------- WEEKLY VARIANCE BAR (NEW v2 — Demand Review) ------------- */
.weekly-bars { display: flex; gap: 3px; align-items: flex-end; height: 80px; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--panel); margin-bottom: 14px; }
.weekly-bar { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; }
.weekly-bar .bar { width: 100%; min-height: 2px; border-radius: 2px 2px 0 0; background: var(--green); position: relative; }
.weekly-bar .bar.neg { background: var(--red); }
.weekly-bar .bar.flat { background: var(--faint); height: 2px; }
.weekly-bar .label { font-size: 9px; color: var(--faint); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }

/* ------------- SIZE CURVE (NEW v2) ------------- */
.curve-row { display: grid; grid-template-columns: 180px 80px 80px 80px 80px 80px 80px 80px 80px 100px 90px; gap: 10px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--border); font-size: 12px; }
.curve-row.head { background: #f8f7f3; color: var(--faint); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
.curve-row .size-cell { text-align: right; font-variant-numeric: tabular-nums; }
.curve-row .style-cell strong { display: block; font-size: 12px; }
.curve-row .style-cell small { display: block; color: var(--muted); font-size: 10px; }
.curve-exception { display: inline-flex; align-items: center; gap: 4px; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; padding: 2px 6px; border-radius: 4px; background: var(--panel-2); color: var(--muted); }
.curve-exception.miss { color: var(--red); background: rgba(185,28,28,0.08); }
.curve-exception.broken { color: var(--amber); background: rgba(186,117,23,0.12); }
.curve-exception.lowconf { color: var(--blue); background: rgba(21,95,114,0.1); }
.curve-exception.override { color: var(--green); background: rgba(0,122,94,0.1); }

/* ------------- VIEW TOGGLE (segmented) ------------- */
.segmented { display: inline-flex; border: 1px solid var(--border); background: var(--panel-2); border-radius: var(--radius); padding: 3px; gap: 2px; }
.segmented button { border: 0; background: transparent; border-radius: 6px; padding: 6px 12px; font-size: 12px; font-weight: 600; color: var(--muted); }
.segmented button.active { background: var(--panel); color: var(--green); box-shadow: 0 1px 3px rgba(0,0,0,0.08); }

/* ------------- LINE PLAN TABLE (dense view) ------------- */
.line-plan-table table { min-width: 1100px; }
.table-thumb { width: 40px; height: 40px; border-radius: 5px; object-fit: cover; background: var(--panel-2); flex: 0 0 auto; display: block; }
.table-thumb-empty { width: 40px; height: 40px; border-radius: 5px; background: var(--panel-2); display: block; }
.thumb-cell { width: 50px; padding: 6px 10px !important; }

/* ------------- LEGACY (kept) ------------- */
.queue-card { border-left: 3px solid var(--green); padding: 12px 14px; display: grid; gap: 5px; background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); border-left-width: 3px; }
.queue-card.warn { border-left-color: var(--amber); }
.queue-card.red { border-left-color: var(--red); }
.queue-card strong { font-size: 14px; }
.queue-card span { color: var(--muted); font-size: 12px; line-height: 1.4; }
.empty { padding: 22px; color: var(--muted); text-align: center; }
.loading-state { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; min-height: 320px; padding: 48px; color: var(--muted); font-size: 14px; }
.loading-state .spinner { width: 30px; height: 30px; border-radius: 50%; border: 3px solid var(--border); border-top-color: var(--green); animation: cad-spin 0.7s linear infinite; }
@keyframes cad-spin { to { transform: rotate(360deg); } }

@media (max-width: 1120px) {
  .app-shell { grid-template-columns: 78px minmax(0, 1fr); }
  .sidebar-brand span, .nav-item span:not(.nav-icon), .nav-group-label, .sidebar-footer { display: none; }
  .topbar { grid-template-columns: 1fr; align-items: start; }
  .command-bar { display: none; }
  .kpi-grid, .scenario-strip, .three-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .two-col, .style-drawer { grid-template-columns: 1fr; }
  .queue-row { grid-template-columns: 22px minmax(0, 1fr) 100px 90px; }
  .queue-row .meta:nth-child(n+5) { display: none; }
  .style-drawer .drawer-metrics, .style-drawer .drawer-attrs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .login-panel { padding: 34px 26px 28px; }
  .kpi-grid, .scenario-strip { grid-template-columns: 1fr; }
  .filter-chips { flex-direction: column; align-items: stretch; }
  .filter-chips select { width: 100%; }
  .view { padding: 18px 14px 36px; }
  .scope-context { flex-direction: column; align-items: flex-start; gap: 10px; }
}

/* ---- In-app glossary / "How this works" slide-over ---- */
.help-overlay { position: fixed; inset: 0; background: rgba(15, 23, 42, .42); backdrop-filter: blur(2px); display: none; z-index: 1000; }
.help-overlay.open { display: flex; justify-content: flex-end; }
.help-panel { width: min(440px, 92vw); height: 100%; overflow-y: auto; background: var(--panel); border-left: 1px solid var(--border); box-shadow: -10px 0 36px rgba(0, 0, 0, .16); padding: 26px 26px 40px; animation: helpSlide .18s ease; }
@keyframes helpSlide { from { transform: translateX(26px); opacity: .4; } to { transform: none; opacity: 1; } }
.help-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.help-kicker { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .09em; color: var(--muted); font-weight: 700; }
.help-head h3 { margin: 3px 0 0; font-size: 19px; color: var(--text); }
.help-close { border: 0; background: transparent; font-size: 26px; line-height: 1; cursor: pointer; color: var(--muted); padding: 0 2px; }
.help-close:hover { color: var(--text); }
.help-what { color: var(--text); font-size: 14px; line-height: 1.55; margin: 0 0 18px; }
.help-terms { margin: 0; }
.help-terms dt { font-weight: 700; font-size: 13px; color: var(--text); margin-top: 15px; }
.help-terms dd { margin: 3px 0 0; font-size: 13px; color: var(--muted); line-height: 1.55; }
.help-terms dd strong { color: var(--text); }
.help-foot { margin-top: 24px; padding-top: 15px; border-top: 1px solid var(--border); font-size: 12px; color: var(--muted); line-height: 1.5; }
.help-empty { color: var(--muted); font-style: italic; font-size: 13px; }

/* ---- Forecast Lab: per-item explainability slide-over ---- */
.exp-panel { width: min(480px, 94vw); }
.exp-why { font-weight: 600; white-space: nowrap; }
.exp-sub { display: block; margin-top: 7px; font-size: 12px; color: var(--muted); }
.exp-sub code { font-size: 11px; }
.exp-narr { font-size: 14px; line-height: 1.6; color: var(--text); margin: 4px 0 20px; padding: 13px 15px; background: var(--accent-soft); border: 1px solid var(--border); border-radius: 10px; }
.exp-narr strong { color: var(--text); }
.exp-sec { margin: 0 0 22px; }
.exp-sec-h { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--muted); margin-bottom: 9px; }
.exp-body { font-size: 13px; line-height: 1.55; color: var(--text); margin: 0 0 10px; }
.exp-body strong { color: var(--text); }
.exp-blend { display: flex; height: 26px; border-radius: 7px; overflow: hidden; font-size: 11px; font-weight: 700; color: #fff; }
.exp-blend-ml { background: var(--accent); display: flex; align-items: center; justify-content: center; min-width: 0; }
.exp-blend-tr { background: #94a3b8; display: flex; align-items: center; justify-content: center; min-width: 0; }
.exp-decomp-nums { display: flex; align-items: flex-end; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.exp-decomp-nums > div { display: flex; flex-direction: column; gap: 2px; }
.exp-decomp-nums label { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 700; }
.exp-decomp-nums strong { font-size: 16px; color: var(--text); }
.exp-op { font-size: 16px; color: var(--muted); padding-bottom: 2px; font-weight: 600; }
.exp-chart { position: relative; height: 84px; display: flex; align-items: flex-end; gap: 3px; padding: 4px 0; }
.exp-bar { flex: 1; height: 100%; display: flex; align-items: flex-end; }
.exp-bar i { display: block; width: 100%; border-radius: 2px 2px 0 0; }
.exp-bar i.up { background: var(--accent); }
.exp-bar i.down { background: #cbd5e1; }
.exp-base { position: absolute; left: 0; right: 0; border-top: 1px dashed var(--muted); z-index: 1; }
.exp-note { font-size: 11.5px; color: var(--muted); line-height: 1.5; margin: 9px 0 0; }
.exp-facs { list-style: none; margin: 0; padding: 0; }
.exp-fac { display: flex; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--border); }
.exp-fac:last-child { border-bottom: 0; }
.exp-fac-ic { font-size: 11px; line-height: 1.5; margin-top: 1px; }
.exp-fac.up .exp-fac-ic { color: var(--green); }
.exp-fac.down .exp-fac-ic { color: var(--red); }
.exp-fac.neutral .exp-fac-ic { color: var(--muted); }
.exp-fac strong { display: block; font-size: 13px; color: var(--text); }
.exp-fac span { display: block; font-size: 12px; color: var(--muted); line-height: 1.5; margin-top: 1px; }
.exp-drv { margin: 0 0 10px; }
.exp-drv-head { display: flex; align-items: baseline; gap: 7px; font-size: 13px; }
.exp-drv-head strong { color: var(--text); font-weight: 600; }
.exp-drv-share { margin-left: auto; font-size: 12px; font-weight: 700; color: var(--muted); }
.exp-drv-dir { font-size: 10px; line-height: 1; }
.exp-drv-dir.up { color: var(--green); }
.exp-drv-dir.down { color: var(--red); }
.exp-drv-bar { height: 6px; border-radius: 3px; background: var(--border); margin-top: 4px; overflow: hidden; }
.exp-drv-bar i { display: block; height: 100%; border-radius: 3px; }
.exp-drv-bar i.up { background: var(--green); }
.exp-drv-bar i.down { background: var(--red); }

/* ---- Forecast Value Add (the trust stairstep) ---- */
.fva-ladder { margin: 18px 0 8px; display: flex; flex-direction: column; gap: 12px; }
.fva-row { display: grid; grid-template-columns: 220px 1fr 200px; align-items: center; gap: 16px; }
.fva-row-label strong { display: block; font-size: 14px; color: var(--text); }
.fva-row-label span { display: block; font-size: 11.5px; color: var(--muted); line-height: 1.45; margin-top: 2px; }
.fva-bar-wrap { background: var(--border); border-radius: 7px; height: 30px; overflow: hidden; }
.fva-bar { height: 100%; display: flex; align-items: center; justify-content: flex-end; padding: 0 10px; color: #fff; font-weight: 700; font-size: 13px; border-radius: 7px; transition: width .25s ease; min-width: 40px; }
.fva-bar.fva-naive { background: #94a3b8; }
.fva-bar.fva-trend { background: var(--amber, #f59e0b); }
.fva-bar.fva-cadence { background: var(--accent); }
.fva-row-fva { font-size: 13px; color: var(--text); }
.fva-sec { margin: 22px 0 0; }
.fva-sec-h { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--muted); margin-bottom: 9px; }
.fva-movers { display: flex; gap: 22px; margin-top: 22px; flex-wrap: wrap; }
.fva-half { flex: 1 1 320px; min-width: 0; }
@media (max-width: 760px) { .fva-row { grid-template-columns: 1fr; gap: 6px; } .fva-row-fva { margin-top: 2px; } }

/* ---- Demand / Supply Analytics (Chart.js dashboards) ---- */
.da-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
.da-card { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 14px 16px 16px; min-width: 0; }
.da-card.da-wide { grid-column: 1 / -1; }
.da-card-h strong { font-size: 14px; color: var(--text); font-weight: 600; }
.da-card-h span { display: block; font-size: 12px; color: var(--muted); margin-top: 2px; line-height: 1.45; }
.da-canvas-wrap { position: relative; height: 260px; margin-top: 10px; }
.da-wide .da-canvas-wrap { height: 300px; }
.da-legend { display: flex; flex-wrap: wrap; gap: 14px; font-size: 11.5px; color: var(--muted); margin-top: 8px; }
.da-legend span { display: inline-flex; align-items: center; gap: 5px; }
.da-swatch { display: inline-block; width: 12px; height: 10px; border-radius: 2px; }
@media (max-width: 900px) { .da-grid { grid-template-columns: 1fr; } }

/* ---- Forecast Adjustment cockpit ---- */
.aq-banner { background: var(--accent-soft); border: 1px solid var(--border); border-radius: 8px; padding: 8px 12px; font-size: 12.5px; color: var(--text); margin: 12px 0; }
.aq-banner i { font-style: normal; font-weight: 700; }
.aq-queued { background: var(--accent-soft); }
.aq-adopt { font-weight: 600; }
.aq-adopt.on { color: var(--green); }
.dmx-chip.disabled { opacity: .45; cursor: default; }
/* ---- Forecast Adjustment cockpit: filters + edit→apply→commit grid ---- */
.aq-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin: 0 0 12px; }
.aq-table th .aq-sub { font-size: 9px; color: var(--faint); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.aq-table td.aq-cad { color: var(--muted); font-variant-numeric: tabular-nums; }
.aq-table td.aq-fc-td { min-width: 132px; }
.aq-fc { display: flex; flex-direction: column; gap: 3px; }
.aq-fc-input { width: 78px; padding: 4px 6px; border: 1px solid var(--border); border-radius: 6px; font-size: 13px; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; background: var(--card); color: var(--text); }
.aq-fc-input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.aq-fc-val { font-weight: 700; font-variant-numeric: tabular-nums; }
.aq-fc-quick { display: inline-flex; gap: 3px; }
.aq-fc-quick button { width: 20px; height: 20px; line-height: 1; padding: 0; border: 1px solid var(--border); border-radius: 5px; background: var(--card); color: var(--muted); font-size: 12px; font-weight: 700; cursor: pointer; }
.aq-fc-quick button:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.aq-nudge { font-size: 10.5px; line-height: 1.25; max-width: 200px; margin-top: 1px; }
.aq-nudge.down { color: #A32D2D; }
.aq-nudge.big { color: #BA7517; }
.aq-reason { padding: 4px 6px; border: 1px solid var(--border); border-radius: 6px; font-size: 12px; background: var(--card); color: var(--text); max-width: 140px; }
.aq-reason.need { border-color: #BA7517; box-shadow: 0 0 0 2px rgba(186,117,23,.14); }
.aq-committed { color: var(--green); font-weight: 700; font-size: 11.5px; }
.aq-pending-row { background: rgba(186,117,23,.06); }
.aq-committed-row { background: var(--accent-soft); }
.aq-committed-row td.aq-cad { text-decoration: line-through; opacity: .6; }
.aq-subnote { font-size: 11.5px; color: var(--muted); margin: -6px 0 12px; }
.aq-est { color: var(--faint); font-weight: 700; cursor: help; }
.aq-table td .aq-est { margin-left: 1px; }
/* CBMF netting */
.cbmf-conf { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 10px; white-space: nowrap; }
.cbmf-conf.excess { background: var(--green-soft, #E3F1EA); color: var(--green, #1D9E75); }
.cbmf-conf.onhand { background: #F2EEE3; color: #92702A; }
.cbmf-tag { font-size: 10px; font-weight: 700; color: #92702A; background: #F2EEE3; border-radius: 4px; padding: 0 4px; }
.cbmf-line { font-size: 12px; line-height: 1.5; }
.cbmf-line + .cbmf-line { margin-top: 1px; }
/* Capable-to-Promise status */
.ctp-stat { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 10px; white-space: nowrap; }
.ctp-stat.short { background: #F6E2DF; color: #A32D2D; }
.ctp-stat.build { background: #F2EEE3; color: #92702A; }
/* Forecast Why — quick facts chips */
.exp-facts { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 4px; }
.exp-fact { background: var(--band, #F4F6F8); border: 1px solid var(--border); border-radius: 8px; padding: 5px 10px; min-width: 0; }
.exp-fact label { display: block; font-size: 9.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 700; }
.exp-fact b { font-size: 12.5px; color: var(--text); font-weight: 700; }
/* Forecast deep dive — full-screen */
.fcl-deep-ov { position: fixed; inset: 0; z-index: 200; background: rgba(15,23,42,0.55); display: none; padding: 24px; overflow: auto; }
.fcl-deep-ov.open { display: block; }
.fcl-deep-panel { max-width: 1140px; margin: 0 auto; background: var(--surface, #fff); border-radius: 14px; box-shadow: 0 24px 70px rgba(15,23,42,0.35); padding: 22px 26px 28px; }
.fdg-head { display: flex; align-items: flex-start; gap: 12px; border-bottom: 1px solid var(--border); padding-bottom: 14px; margin-bottom: 16px; }
.fdg-head h2 { margin: 2px 0 4px; font-size: 20px; color: var(--text); }
.fdg-head > div:first-child { flex: 1; }
.fdg-tags { font-size: 12px; color: var(--muted); }
.fdg-tags code { background: var(--band,#F4F6F8); padding: 1px 6px; border-radius: 5px; }
.fdg-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 18px; align-items: start; }
.fdg-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.fdg-card { border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; }
.fdg-card-h { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; color: var(--green); margin-bottom: 8px; }
.fdg-ai-card { background: var(--accent-soft); border-color: rgba(0,122,94,0.25); }
.fdg-ai { font-size: 13.5px; line-height: 1.55; color: var(--text); }
.fdg-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; }
.fdg-metric label { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 700; }
.fdg-metric strong { font-size: 15px; color: var(--text); }
.fdg-fva-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; font-size: 13px; border-bottom: 1px dashed var(--border); }
.fdg-fva-row span { flex: 1; color: var(--muted); }
.fdg-fva-row.best { font-weight: 700; }
/* #112 routing & safety-stock evidence card */
.fev-axes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 8px; }
.fev-ax { border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px; }
.fev-ax label { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 700; }
.fev-ax strong { font-size: 18px; color: var(--text); font-variant-numeric: tabular-nums; }
.fev-ax span { display: block; font-size: 10.5px; color: var(--muted); margin-top: 1px; }
.fev-route { font-size: 12.5px; line-height: 1.5; color: var(--text); margin: 6px 0 0; }
.fev-flag { font-size: 11.5px; line-height: 1.45; color: #BA7517; margin: 6px 0 0; }
.fev-divider { border-top: 1px solid var(--border); margin: 12px 0 10px; }
.fev-ss-h { font-size: 12px; color: var(--muted); font-weight: 600; margin-bottom: 7px; }
.fev-sl-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.fev-sl { padding: 4px 10px; border: 1px solid var(--border); border-radius: 14px; background: var(--card); color: var(--muted); font-size: 12px; font-weight: 700; cursor: pointer; font-variant-numeric: tabular-nums; }
.fev-sl:hover { border-color: var(--accent); color: var(--accent); }
.fev-sl.rec { border-color: var(--accent); color: var(--accent); }
.fev-sl.on { background: var(--accent); color: #fff; border-color: var(--accent); }
.fev-ss-val { margin-left: auto; font-size: 13px; color: var(--text); }
.fev-ss-val strong { font-size: 17px; font-variant-numeric: tabular-nums; }
.fdg-fva-row i { font-style: normal; font-size: 11px; }
@media (max-width: 820px) { .fdg-grid { grid-template-columns: 1fr; } }
/* Global AI copilot (chatbot) */
.cadchat-fab { position: fixed; right: 22px; bottom: 22px; z-index: 150; width: 52px; height: 52px; border-radius: 50%; border: 0; background: var(--violet, #643192); color: #fff; font-size: 22px; cursor: pointer; box-shadow: 0 8px 22px rgba(100,49,146,0.42); }
.cadchat-fab:hover { filter: brightness(1.08); }
.cadchat-panel { position: fixed; right: 22px; bottom: 84px; z-index: 150; width: 372px; max-width: calc(100vw - 28px); height: 480px; max-height: calc(100vh - 120px); background: var(--surface, #fff); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 18px 50px rgba(15,23,42,0.30); display: none; flex-direction: column; overflow: hidden; }
.cadchat-panel.open { display: flex; }
.cadchat-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; background: var(--violet, #643192); color: #fff; font-weight: 700; font-size: 14px; }
.cadchat-x { background: transparent; border: 0; color: #fff; font-size: 18px; cursor: pointer; line-height: 1; }
.cadchat-msgs { flex: 1; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.cadchat-empty { color: var(--muted); font-size: 13px; line-height: 1.55; }
.cadchat-msg { max-width: 86%; padding: 8px 11px; border-radius: 12px; font-size: 13px; line-height: 1.45; white-space: pre-wrap; }
.cadchat-msg.me { align-self: flex-end; background: var(--violet, #643192); color: #fff; border-bottom-right-radius: 4px; }
.cadchat-msg.ai { align-self: flex-start; background: var(--band, #F4F6F8); color: var(--text); border-bottom-left-radius: 4px; }
.cadchat-msg.busy { color: var(--muted); font-style: italic; }
.cadchat-input { display: flex; gap: 6px; padding: 10px; border-top: 1px solid var(--border); }
.cadchat-input textarea { flex: 1; resize: none; border: 1px solid var(--border); border-radius: 8px; padding: 8px; font: inherit; font-size: 13px; max-height: 90px; box-sizing: border-box; }
.cadchat-send { border: 0; background: var(--violet, #643192); color: #fff; border-radius: 8px; padding: 0 14px; font-weight: 700; cursor: pointer; }

/* ---- Auburn transplant support: legacy cad-* tokens + KPI/card/table/mono rules ----
   The transplanted P&M / Cost Scenario / Sales Reporting markup uses the legacy shell's
   global cad-* classes; v2 never loaded that stylesheet. Self-contained copy (values
   inlined from the legacy tokens) so the KPI cards and tables render as designed. */
:root {
  --cad-navy:#0B2A4A; --cad-blue:#1E5BA8; --cad-ink:#15171A; --cad-muted:#5A6473;
  --cad-faint:#8A93A0; --cad-line:#E6E9EE; --cad-line-soft:#EEF1F5;
  --cad-surface:#FFFFFF; --cad-tint:#F2F5F9; --cad-accent:#1E5BA8;
  --cad-radius:11px; --cad-radius-sm:8px;
  --violet:#643192;   /* Ask Cadence + the Coordinate nav group */
  --cad-shadow:0 1px 2px rgba(16,32,56,0.05);
}
.cad-kpis { display:flex; gap:12px; flex-wrap:wrap; }
.cad-kpi { flex:1; min-width:150px; background:var(--cad-surface); border:1px solid var(--cad-line); border-radius:var(--cad-radius); padding:14px 16px; box-shadow:var(--cad-shadow); position:relative; overflow:hidden; }
.cad-kpi::before { content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--cad-accent); opacity:0; transition:opacity .15s; }
.cad-kpi:hover::before { opacity:.8; }
.cad-kpi-l { font-size:9.5px; font-weight:700; color:var(--cad-muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:6px; }
.cad-kpi-v { font-size:23px; font-weight:700; color:var(--cad-navy); line-height:1; font-variant-numeric:tabular-nums; }
.cad-kpi-s { font-size:10.5px; color:var(--cad-faint); margin-top:5px; }
.cad-card { background:var(--cad-surface); border:1px solid var(--cad-line); border-radius:var(--cad-radius); box-shadow:var(--cad-shadow); overflow:hidden; }
.cad-table { width:100%; border-collapse:collapse; }
.cad-table thead th { background:var(--cad-tint); padding:8px 11px; text-align:left; font-size:9px; font-weight:700; color:var(--cad-muted); text-transform:uppercase; letter-spacing:.05em; position:sticky; top:0; z-index:2; }
.cad-table thead th.num { text-align:right; }
.cad-table tbody td { padding:9px 11px; font-size:11.5px; color:var(--cad-ink); border-bottom:1px solid var(--cad-line-soft); }
.cad-table tbody tr:last-child td { border-bottom:none; }
.cad-table tbody tr:hover td { background:var(--cad-tint); }
.cad-table .num { text-align:right; font-family:'IBM Plex Mono',monospace; font-variant-numeric:tabular-nums; }
.cad-mono { font-family:'IBM Plex Mono',monospace; font-variant-numeric:tabular-nums; }


/* ===== LAYOUT VARIANT: top horizontal nav (body[data-layout="topbar"]) =====================
   A config-driven alternative to the default left sidebar — the whole chrome flips to a deep
   forest-green horizontal top bar (the same chrome the left rail uses, rotated) with a mint
   active-underline. Scoped entirely under the attribute so no other tenant is affected; module
   renderers are layout-agnostic (they render into #view either way). */
body[data-layout="topbar"] .app-shell { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
body[data-layout="topbar"] .sidebar {
  position: sticky; top: 0; z-index: 30; height: auto; width: 100%;
  flex-direction: row; align-items: stretch; gap: 6px; padding: 0 22px;
  border-right: none; border-bottom: 1px solid rgba(0,0,0,0.28);
  background: linear-gradient(90deg, #0d2b1f 0%, #124a34 100%);
  box-shadow: 0 1px 5px rgba(0,0,0,0.20);
  /* deep-forest re-skin of the chrome tokens, local to the bar (matches the left-rail chrome) */
  --chrome-bg: transparent; --chrome-line: rgba(255,255,255,0.12); --chrome-text: #b8cfc2;
  --chrome-bright: #f2f1ea; --chrome-dim: #6e9c85; --chrome-hover: rgba(255,255,255,0.08);
  --chrome-active: rgba(255,255,255,0.10); --chrome-card: rgba(255,255,255,0.06);
}
body[data-layout="topbar"] .sidebar-brand { display: flex; flex-direction: column; justify-content: center; padding: 10px 22px 10px 0; margin-right: 6px; border-right: 1px solid rgba(255,255,255,0.14); flex: 0 0 auto; }
body[data-layout="topbar"] .sidebar-brand strong,
body[data-layout="topbar"] .sidebar-brand .wordmark .wm-1 { font-size: 18px; color: #f2f1ea; }
body[data-layout="topbar"] .sidebar-brand .wordmark .wm-2 { font-size: 18px; }
body[data-layout="topbar"] .sidebar-brand > span { margin-top: 2px; font-size: 10.5px; color: #8fb3a2; }
/* the nav is a row of group tabs; overflow:visible so dropdown panels escape the bar. Grouping keeps
   the top-level tab count small (~4-6) so the bar itself never needs to scroll. */
body[data-layout="topbar"] .sidebar-nav {
  display: flex; flex-direction: row; flex-wrap: nowrap; align-items: stretch; gap: 2px;
  padding: 0; overflow: visible; flex: 1 1 0%; min-width: 0;
}
body[data-layout="topbar"] .nav-group { position: relative; display: flex; align-items: stretch; }
/* group label = the top-level tab trigger, with a dropdown caret */
body[data-layout="topbar"] .nav-group-label {
  display: inline-flex; align-items: center; gap: 6px; height: 100%; margin: 0; padding: 0 14px;
  cursor: pointer; white-space: nowrap; font-size: 13px; font-weight: 600; letter-spacing: 0;
  text-transform: none; color: #b8cfc2; border-bottom: 2.5px solid transparent;
}
body[data-layout="topbar"] .nav-group-label::after {
  content: none; width: 11px; height: 11px; flex: none; border: 0;
  background: currentColor; opacity: 0.5;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5L6 7.5L9 4.5' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5L6 7.5L9 4.5' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  transition: transform .17s cubic-bezier(.4,0,.2,1), opacity .17s ease;
}
body[data-layout="topbar"] .nav-group:hover > .nav-group-label,
body[data-layout="topbar"] .nav-group.open > .nav-group-label,
body[data-layout="topbar"] .nav-group:focus-within > .nav-group-label { color: #f2f1ea; }
body[data-layout="topbar"] .nav-group:hover > .nav-group-label::after,
body[data-layout="topbar"] .nav-group.open > .nav-group-label::after { transform: rotate(180deg); opacity: 0.8; }
/* active group — the one holding the current module */
body[data-layout="topbar"] .nav-group:has(.nav-item.active) > .nav-group-label {
  color: #ffffff; border-bottom-color: var(--tenant-accent-bright, #7ee2b0);
}
/* single-module group → a direct top-level tab (no dropdown) */
body[data-layout="topbar"] .nav-item-top {
  min-height: 0; height: 100%; width: auto; white-space: nowrap; border-radius: 0; padding: 0 14px;
  align-items: center; border-bottom: 2.5px solid transparent; font-size: 13px; font-weight: 600;
  color: #b8cfc2; background: transparent;
}
body[data-layout="topbar"] .nav-item-top:hover { background: rgba(255,255,255,0.08); color: #f2f1ea; }
body[data-layout="topbar"] .nav-item-top.active {
  background: rgba(255,255,255,0.06); color: #ffffff; font-weight: 700;
  border-bottom-color: var(--tenant-accent-bright, #7ee2b0);
}
/* dropdown panel of the group's modules — opens on hover/focus, escapes the bar */
body[data-layout="topbar"] .nav-group-items {
  display: flex; position: absolute; top: calc(100% + 5px); left: 0; z-index: 60;
  min-width: 210px; padding: 6px; flex-direction: column; gap: 2px;
  background: #0f3527; border: 1px solid rgba(255,255,255,0.13);
  border-radius: 10px; box-shadow: 0 14px 34px rgba(0,0,0,0.38);
  visibility: hidden; opacity: 0; transform: translateY(-6px); pointer-events: none;
  transition: opacity .14s ease, transform .14s ease, visibility .14s;
}
/* invisible hover bridge across the gap so moving onto the panel doesn't snap it shut */
body[data-layout="topbar"] .nav-group-items::before { content: ""; position: absolute; top: -9px; left: 0; right: 0; height: 9px; }
body[data-layout="topbar"] .nav-group:hover > .nav-group-items,
body[data-layout="topbar"] .nav-group.open > .nav-group-items,
body[data-layout="topbar"] .nav-group:focus-within > .nav-group-items {
  visibility: visible; opacity: 1; transform: translateY(0); pointer-events: auto;
}
/* module rows inside the dropdown */
body[data-layout="topbar"] .nav-group-items .nav-item {
  min-height: 34px; width: 100%; border-radius: 7px; padding: 7px 11px; border-bottom: 0;
  font-size: 13px; font-weight: 600; color: #cfe3d8; white-space: nowrap;
}
body[data-layout="topbar"] .nav-group-items .nav-item:hover { background: rgba(255,255,255,0.09); color: #ffffff; }
body[data-layout="topbar"] .nav-group-items .nav-item.active { background: rgba(126,226,176,0.16); color: #ffffff; }
/* dark bar = monochrome wordmark (brand contract): "Plan" muted cream, color lives in the chip */
body[data-layout="topbar"] .sidebar-brand .wordmark .wm-2 { color: #f2f1ea; font-weight: 500; }
body[data-layout="topbar"] .nav-icon { display: none; }
/* top-nav: the account control (avatar + Profile/Preferences/Shortcuts/Sign out menu) moves to the
   right end of the bar — the standard top-right spot. Compact to an avatar + caret so it doesn't
   fight the horizontal nav for width; the tenant name still lives in the brand at top-left. */
body[data-layout="topbar"] .sidebar-footer {
  display: flex; align-items: center; flex: 0 0 auto; margin: 0 0 0 6px; padding: 0; border-top: 0;
}
body[data-layout="topbar"] .user-card { padding: 6px; gap: 0; border-radius: 8px; }
body[data-layout="topbar"] .user-card:hover { background: transparent; }
body[data-layout="topbar"] .user-card:hover > span { box-shadow: 0 0 0 3px rgba(4,120,87,0.18); }
body[data-layout="topbar"] .user-card > div { display: none; }
/* cleaner account control: circular avatar with a subtle lift, drop the floating ellipsis (the avatar IS the trigger) */
body[data-layout="topbar"] .user-card::after { content: none; }
body[data-layout="topbar"] .user-card > span { border-radius: 50%; box-shadow: 0 0 0 1px rgba(0,0,0,0.06); transition: box-shadow .14s ease; }
body[data-chrome="inverted"] .user-card > span { box-shadow: 0 0 0 1px rgba(0,0,0,0.06); }
body[data-layout="topbar"] .user-card::after { color: #b8cfc2; padding-left: 4px; }
/* the page-title bar stays a light secondary bar under the green nav (content area is light) */
body[data-layout="topbar"] .topbar { border-bottom: 1px solid var(--border); background: #fbfaf7; }

/* Brand mark chip (jewel bars on light tile) in the wordmark lockups */
.wordmark .brand-mark {
  display: inline-block;
  vertical-align: -4px;
  margin-right: 8px;
  border-radius: 5px;
}
/* dark bar: soften the glyph tile from a stark white sticker to a frosted chip so it reads as
   part of the bar, not a badge stuck on it (Will 7/17). Inverted (white bar) still hides it. */
body[data-layout="topbar"] .sidebar-brand .brand-mark rect:first-child { fill: rgba(255, 255, 255, 0.12); }

/* BRAND CONTRACT (docs/brand-contract.md): jewel letters exist ONLY on white surfaces.
   On dark surfaces the wordmark is monochrome (wm-2 muted) and the chip carries the color —
   the .wp spans inherit wm-2's color here on purpose. Never reintroduce tinted derivatives. */

/* .pr-tab / .pr-exp base styles — these lived only in the pricing module's embedded <style>, so
   sales/other modules rendered NATIVE unstyled buttons when visited before Pricing mounted.
   Promoted here so every module gets them; the embedded copy stays and wins ties harmlessly. */
.pr-tab { padding: 9px 17px; border: none; background: none; font-family: inherit; font-size: 13px; color: #6b6b67; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; font-weight: 500; transition: color 0.12s; }
.pr-tab:hover { color: #0B2A4A; }
.pr-tab.on { color: #0B2A4A; border-bottom-color: #0B2A4A; font-weight: 700; }
.pr-exp { padding: 7px 13px; border: 1px solid #d4d4d4; border-radius: 7px; background: #fff; font-family: inherit; font-size: 12px; color: #3a3a3a; cursor: pointer; white-space: nowrap; transition: all 0.12s; }
.pr-exp:hover { border-color: #0B2A4A; color: #0B2A4A; background: #f7f9fb; }
.pr-top-filter { padding: 7px 10px; border: 1px solid #d4d4d4; border-radius: 8px; background: #fff; font-family: inherit; font-size: 12.5px; color: #1a1a18; min-width: 132px; cursor: pointer; }

/* ===== CHROME VARIANT: inverted (body[data-chrome="inverted"], composes with layout=topbar) ====
   The marketing homepage as an app: white top bar carrying the raw-jewel lockup, deep forest
   canvas behind it, white cards floating on the canvas. The canvas is a tenant token (--canvas,
   set from theme.canvas) so a client who wants a different workspace color is a config value,
   not a fork. Appended last so equal-specificity overrides of the topbar block win. */

/* --- the bar: white, ink text --- */
body[data-chrome="inverted"] .sidebar {
  background: #ffffff;
  border-bottom: 1px solid #dfe6ee;
  box-shadow: 0 1px 4px rgba(16, 32, 24, 0.05);
  --chrome-line: #e3e8ee; --chrome-text: #5b6673; --chrome-bright: #17212b;
  --chrome-dim: #8a94a0; --chrome-hover: rgba(23, 33, 43, 0.05);
  --chrome-active: rgba(4, 120, 87, 0.08); --chrome-card: rgba(23, 33, 43, 0.05);
}
body[data-chrome="inverted"] .sidebar-brand { border-right-color: #e6ebf1; }
body[data-chrome="inverted"] .sidebar-brand strong,
body[data-chrome="inverted"] .sidebar-brand .wordmark .wm-1 { color: #17212b; }
body[data-chrome="inverted"] .sidebar-brand > span { color: #5b6673; }
/* raw marketing jewels on the WHITE BAR ONLY — the login screen's forest-gradient lockup
   keeps the light dark-surface tints (raw jewels are illegible on forest) */
body[data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 .wp1 { color: #047857; }
body[data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 .wp2 { color: #1e47c4; }
body[data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 .wp3 { color: #7522bb; }
body[data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 .wp4 { color: #ad1f1f; }
/* bare bars on the white bar — the light tile chip disappears against white, so hide it and
   scale the bars up to hold the same visual weight (transform doesn't reflow the lockup) */
body[data-chrome="inverted"] .sidebar-brand .brand-mark rect:first-child { opacity: 0; }
body[data-chrome="inverted"] .sidebar-brand .brand-mark { transform: scale(1.3); }
/* nav tabs: slate -> ink, active = tenant-green underline + wash */
body[data-chrome="inverted"] .nav-group-label { color: #5b6673; }
body[data-chrome="inverted"] .nav-group:hover > .nav-group-label,
body[data-chrome="inverted"] .nav-group:focus-within > .nav-group-label { color: #17212b; }
/* PACE PILOT (Will 7/17): on the white bar each stage carries its brand jewel via --nav-accent
   (set per group in tenants.json) with a persistent colored underline; Today stays neutral ink.
   The wordmark drops to monochrome so the four colors live once, in PACE, not twice. */
body[data-chrome="inverted"] .nav-group[style*="--nav-accent"] > .nav-group-label,
body[data-chrome="inverted"] .nav-group[style*="--nav-accent"] .nav-item-top { color: var(--nav-accent); border-bottom-color: var(--nav-accent); }
body[data-chrome="inverted"] .nav-group[style*="--nav-accent"]:hover > .nav-group-label,
body[data-chrome="inverted"] .nav-group[style*="--nav-accent"].open > .nav-group-label,
body[data-chrome="inverted"] .nav-group[style*="--nav-accent"]:focus-within > .nav-group-label { color: var(--nav-accent); }
body[data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 .wp1,
body[data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 .wp2,
body[data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 .wp3,
body[data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 .wp4 { color: #4a5361; }
/* pilot palette on the golden (inverted) bar: the bottom jewel strip tracks the deeper PACE set
   (nav label colors come from --nav-accent in config; this keeps the strip in sync). Golden-scoped. */
body[data-chrome="inverted"] .sidebar::after { background: linear-gradient(90deg, #047857 0 25%, #3967c1 0 50%, #643192 0 75%, #e03935 0 100%); }
/* glyph bars track the PACE palette on the golden bar (bar 1 green is unchanged; recolor 2-4).
   Golden-scoped override — the shared SVG in retail-afa-v2.html stays on the old jewels for other
   tenants until the brand sweep. rect:first-child is the tile (hidden on inverted). */
body[data-chrome="inverted"] .sidebar-brand .brand-mark rect:nth-child(3) { fill: #3967c1; }
body[data-chrome="inverted"] .sidebar-brand .brand-mark rect:nth-child(4) { fill: #643192; }
body[data-chrome="inverted"] .sidebar-brand .brand-mark rect:nth-child(5) { fill: #e03935; }
/* active tab = the section's OWN colour on the label + its underline. No fill — a green wash on
   every active tab buried the PACE colours (Act read green, not blue) and over-greened the bar. */
body[data-chrome="inverted"] .nav-group:has(.nav-item.active) > .nav-group-label {
  background: transparent; font-weight: 700;
  color: var(--nav-accent, #17212b);
  border-bottom-color: var(--nav-accent, #17212b);
}
body[data-chrome="inverted"] .nav-item-top { color: #5b6673; }
body[data-chrome="inverted"] .nav-item-top:hover { background: rgba(23, 33, 43, 0.05); color: #17212b; }
body[data-chrome="inverted"] .nav-item-top.active {
  background: transparent; color: var(--nav-accent, #17212b); font-weight: 700;
  border-bottom-color: var(--nav-accent, #17212b);
}
/* dropdown panel goes light */
body[data-chrome="inverted"] .nav-group-items {
  background: #ffffff; border: 1px solid #dfe6ee; box-shadow: 0 14px 34px rgba(15, 30, 22, 0.18);
}
body[data-chrome="inverted"] .nav-group-items .nav-item { color: #33404c; }
body[data-chrome="inverted"] .nav-group-items .nav-item:hover { background: rgba(23, 33, 43, 0.06); color: #17212b; }
body[data-chrome="inverted"] .nav-group-items .nav-item.active { background: rgba(23, 33, 43, 0.07); color: #17212b; font-weight: 700; }
body[data-chrome="inverted"] .user-card:hover { background: transparent; }
body[data-chrome="inverted"] .user-card::after { color: #8a94a0; }

/* --- the canvas: the one consistent beige room (C2a, settled with Will 2026-07-12) ---
   The dark-canvas experiment (forest body, then banded fades) is retired: the room never
   changes; brand mass lives in the bar, the hairline, and the forest grid headers. The
   inverted chrome is now ONLY the white-bar treatment — the body inherits the default
   --bg beige like every other chrome. */

/* the jewel hairline strip under the top bar — both bar chromes, all topbar tenants */
body[data-layout="topbar"] .sidebar::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3.5px; z-index: 1;
  background: linear-gradient(90deg, #047857 0 25%, #1e47c4 0 50%, #7522bb 0 75%, #ad1f1f 0 100%);
}


/* RWM PACE NAV POLISH: color is the stage cue, not the whole label. */
body[data-layout="topbar"][data-chrome="inverted"] .sidebar {
  padding: 0 18px;
  border-bottom-color: #d9e1ea;
  box-shadow: 0 1px 8px rgba(15, 23, 42, 0.045);
}
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-brand {
  padding: 8px 18px 8px 0;
  margin-right: 10px;
  border-right-color: #e8edf3;
}
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-brand strong,
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-brand .wordmark .wm-1,
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 {
  font-size: 17px;
  letter-spacing: 0;
}
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-brand .wordmark .wm-1 { font-weight: 760; }
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 { font-weight: 520; }
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-brand > span { margin-top: 1px; font-size: 10.5px; }
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-brand .brand-mark { transform: scale(1.16); }
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-nav { gap: 6px; }
body[data-layout="topbar"][data-chrome="inverted"] .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-item-top {
  color: #4b5563 !important;
  border-bottom-color: transparent !important;
  font-size: 13px;
  font-weight: 650;
  gap: 7px;
  padding-inline: 11px;
}
body[data-layout="topbar"][data-chrome="inverted"] .nav-group[style*="--nav-accent"] > .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-group[style*="--nav-accent"] .nav-item-top {
  color: #4b5563 !important;
  border-bottom-color: transparent !important;
}
body[data-layout="topbar"][data-chrome="inverted"] .nav-group[style*="--nav-accent"] > .nav-group-label::before,
body[data-layout="topbar"][data-chrome="inverted"] .nav-group[style*="--nav-accent"] .nav-item-top::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--nav-accent);
  flex: none;
}
body[data-layout="topbar"][data-chrome="inverted"] .nav-group:hover > .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-group.open > .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-group:focus-within > .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-item-top:hover {
  color: #111827 !important;
  background: rgba(15, 23, 42, 0.04);
}
body[data-layout="topbar"][data-chrome="inverted"] .nav-group:has(.nav-item.active) > .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-item-top.active {
  color: #111827 !important;
  font-weight: 760;
  border-bottom-color: var(--nav-accent, #111827) !important;
  background: transparent;
}
body[data-layout="topbar"][data-chrome="inverted"] .nav-group:has(.nav-item.active) > .nav-group-label::before,
body[data-layout="topbar"][data-chrome="inverted"] .nav-item-top.active::before {
  transform: scale(1.15);
}
body[data-layout="topbar"][data-chrome="inverted"] .sidebar::after {
  height: 2px;
  background: linear-gradient(90deg, #047857 0 25%, #3967c1 0 50%, #643192 0 75%, #e03935 0 100%);
  opacity: 0.95;
}


/* RWM PACE NAV RESET: keep colored labels; remove dot experiment. */
body[data-layout="topbar"][data-chrome="inverted"] .nav-group[style*="--nav-accent"] > .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-group[style*="--nav-accent"] .nav-item-top {
  color: var(--nav-accent) !important;
  border-bottom-color: transparent !important;
}
body[data-layout="topbar"][data-chrome="inverted"] .nav-group[style*="--nav-accent"] > .nav-group-label::before,
body[data-layout="topbar"][data-chrome="inverted"] .nav-group[style*="--nav-accent"] .nav-item-top::before {
  content: none !important;
  display: none !important;
}
body[data-layout="topbar"][data-chrome="inverted"] .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-item-top {
  font-weight: 600;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}
body[data-layout="topbar"][data-chrome="inverted"] .nav-group:hover > .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-group.open > .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-group:focus-within > .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-item-top:hover {
  background: transparent;
}
body[data-layout="topbar"][data-chrome="inverted"] .nav-group:has(.nav-item.active) > .nav-group-label,
body[data-layout="topbar"][data-chrome="inverted"] .nav-item-top.active {
  color: var(--nav-accent, #111827) !important;
  font-weight: 700;
  border-bottom-color: var(--nav-accent, #111827) !important;
}
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-brand .wordmark .wm-1 { font-weight: 700; }
body[data-layout="topbar"][data-chrome="inverted"] .sidebar-brand .wordmark .wm-2 { font-weight: 500; }

/* NAR prospect polish: workbook MRP as a connected planning story */
.nar-hero { display:flex; justify-content:space-between; align-items:stretch; gap:24px; padding:22px 24px; border-left:4px solid #b91c1c; background:linear-gradient(135deg,#ffffff 0%,#fff7f7 100%); }
.nar-hero h3 { margin:4px 0 8px; font-size:24px; line-height:1.12; color:#111827; letter-spacing:0; }
.nar-hero p { margin:0; max-width:780px; font-size:13.5px; line-height:1.62; color:#4b5563; }
.nar-story-steps { min-width:230px; display:grid; gap:7px; align-content:center; }
.nar-story-steps span { display:flex; align-items:center; gap:8px; border:1px solid #f1c9c9; background:#fff; border-radius:8px; padding:8px 10px; font-size:12px; font-weight:700; color:#7f1d1d; }
.nar-story-steps span::before { content:""; width:7px; height:7px; border-radius:50%; background:#b91c1c; flex:none; }
.nar-story strong { display:block; font-size:28px; color:#111827; margin:5px 0 2px; }
.nar-story p { margin:0 0 12px; font-size:12.5px; line-height:1.55; color:#566171; }
.nar-location-rail { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin:14px 0; }
.nar-location-rail > div { background:#111827; color:#fff; border-radius:8px; padding:12px 14px; min-height:86px; }
.nar-location-rail span { display:block; font-size:11px; color:#fca5a5; text-transform:uppercase; font-weight:800; letter-spacing:.04em; }
.nar-location-rail strong { display:block; margin-top:5px; font-size:23px; }
.nar-location-rail small { display:block; margin-top:3px; color:#d1d5db; font-size:11.5px; }
.nar-bars { height:72px; display:flex; align-items:end; gap:3px; padding:9px 8px; border:1px solid #e6eaf0; border-radius:8px; background:linear-gradient(180deg,#fff,#f8fafc); }
.nar-bars i { flex:1; min-width:3px; border-radius:4px 4px 0 0; background:linear-gradient(180deg,#ef4444,#991b1b); opacity:.84; }
.nar-item-card { display:flex; flex-direction:column; min-height:258px; border-top:3px solid #b91c1c; }
.nar-item-top { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.nar-item-top h3 { margin:2px 0 0; font-size:19px; color:#111827; }
.nar-item-card p { min-height:48px; margin:10px 0 8px; font-size:12.5px; line-height:1.42; color:#374151; }
.nar-item-vendor { font-size:11.5px; font-weight:800; color:#7f1d1d; text-transform:uppercase; letter-spacing:.04em; margin-bottom:8px; }
.nar-order-rules { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.nar-order-rules div { border:1px solid #e6eaf0; border-radius:8px; padding:10px; background:#fbfdff; }
.nar-order-rules strong { display:block; font-size:12.5px; color:#111827; margin-bottom:4px; }
.nar-order-rules span { display:block; font-size:12px; line-height:1.45; color:#566171; }
.nar-forecast-card p { min-height:40px; margin:0 0 10px; font-size:12.5px; color:#566171; line-height:1.45; }
.nar-field-chips { display:flex; flex-wrap:wrap; gap:7px; }
.nar-field-chips span { border:1px solid #e5e7eb; background:#f9fafb; color:#374151; border-radius:999px; padding:6px 10px; font-size:11.5px; font-weight:700; }
.nar-role-chip { display:inline-flex; border-radius:999px; padding:3px 8px; font-size:10.5px; font-weight:800; }
.nar-role-manual { background:#fef3c7!important; color:#92400e!important; }
.nar-role-extracted { background:#e0f2fe!important; color:#075985!important; }
.nar-role-calculated { background:#dcfce7!important; color:#166534!important; }
.nar-guide-table td { vertical-align:top; }
.nar-why-panel { width:980px; max-width:96vw; }
@media (max-width: 860px) {
  .nar-hero { flex-direction:column; }
  .nar-location-rail { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .nar-order-rules { grid-template-columns:1fr; }
}

.nar-workbook-legend { display:flex; gap:8px; flex-wrap:wrap; margin:2px 0 10px; }
.nar-workbook-legend span { border-radius:999px; padding:4px 9px; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.nar-why-panel .table-wrap table th,
.nar-why-panel .table-wrap table td { font-size:12px; }
.nar-hero .nar-field-chips span { background:#fff; }

/* ---- AFA flagship (Northwind Apparel) scaffold ---- */
.afa-scaffold { display:flex; flex-direction:column; gap:16px; }
.afa-scaffold-hero {
  background:var(--panel); border:1px solid var(--border); border-left:4px solid var(--green);
  border-radius:var(--radius); padding:20px 22px; box-shadow:0 2px 8px rgba(0,0,0,0.02);
}
.afa-scaffold-hero.moat { border-left-color:var(--red); }
.afa-scaffold-badge {
  display:inline-block; font-size:10px; font-weight:760; letter-spacing:0.07em; text-transform:uppercase;
  color:var(--muted); background:var(--bg); border:1px solid var(--border); border-radius:999px; padding:3px 10px;
}
.afa-scaffold-hero h3 { margin:12px 0 4px; font-size:20px; font-weight:760; color:var(--text); }
.afa-scaffold-hero p { margin:0; color:var(--muted); font-size:13px; line-height:1.45; max-width:70ch; }
.afa-scaffold-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; padding:16px; }
.afa-scaffold-grid label { display:block; color:var(--faint); font-size:10px; font-weight:760; letter-spacing:0.07em; text-transform:uppercase; margin-bottom:6px; }
.afa-scaffold-grid strong { font-size:14px; font-weight:600; color:var(--text); }

/* ---- AFA · Line Plan ---- */
.afa-lp-bar { display:flex; align-items:center; gap:12px; margin:2px 0 14px; }
.afa-lp-bar .seg { display:inline-flex; background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:3px; gap:2px; }
.seg-btn { border:0; background:transparent; color:var(--muted); font:inherit; font-size:12px; font-weight:600; padding:6px 14px; border-radius:7px; cursor:pointer; }
.seg-btn:hover { color:var(--text); }
.seg-btn.active { background:var(--green); color:#fff; }
.afa-lp-kpis { margin-bottom:16px; }
.afa-src { display:inline-flex; align-items:center; }
.afa-lp-table { width:100%; border-collapse:collapse; font-size:13px; }
.afa-lp-table thead th { text-align:left; font-size:10px; font-weight:760; letter-spacing:0.06em; text-transform:uppercase; color:var(--faint); padding:8px 12px; border-bottom:1px solid var(--border); }
.afa-lp-table th.num, .afa-lp-table td.num { text-align:right; font-variant-numeric:tabular-nums; }
.afa-lp-table td { padding:8px 12px; border-bottom:1px solid var(--border); color:var(--text); }
.afa-lp-table tbody tr:hover td { background:var(--bg); }
.afa-lp-style { font-weight:600; }
.afa-lp-foot td { border-top:2px solid var(--border); border-bottom:0; font-weight:700; color:var(--muted); }
.afa-lp-foot td:first-child { color:var(--faint); font-weight:600; }

/* ---- AFA · Item Master search + shared cells ---- */
.afa-im-search { flex:1; display:flex; justify-content:flex-end; }
.afa-im-search input {
  width:280px; max-width:100%; padding:7px 12px; font:inherit; font-size:13px;
  border:1px solid var(--border); border-radius:8px; background:var(--panel); color:var(--text);
}
.afa-im-search input:focus { outline:none; border-color:var(--green); }
.afa-lp-table td.mono { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px; color:var(--muted); }

/* ---- AFA · Work Queue cards ---- */
.afa-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; margin-bottom:16px; }
.afa-card { background:var(--panel); border:1px solid var(--border); border-left:3px solid var(--green); border-radius:var(--radius); padding:14px 16px; box-shadow:0 2px 8px rgba(0,0,0,0.02); }
.afa-card.warn { border-left-color:var(--amber); }
.afa-card.alert { border-left-color:var(--red); }
.afa-card .n { font-size:24px; font-weight:760; color:var(--text); line-height:1.1; }
.afa-card .lbl { font-size:12px; font-weight:700; color:var(--text); margin-top:4px; }
.afa-card .sub { font-size:11px; color:var(--muted); margin-top:5px; line-height:1.4; }

/* ---- AFA · Size Curves ---- */
.afa-sc-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:14px; }
.afa-sc-card { background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); padding:14px 16px 12px; box-shadow:0 2px 8px rgba(0,0,0,0.02); }
.afa-sc-head { display:flex; justify-content:space-between; align-items:baseline; font-size:13px; font-weight:700; color:var(--text); margin-bottom:12px; }
.afa-sc-head span { font-size:11px; font-weight:600; color:var(--muted); }
.afa-sc-cols { display:flex; align-items:flex-end; justify-content:space-between; gap:8px; height:120px; }
.afa-sc-col { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; }
.afa-sc-col .pct { font-size:10px; color:var(--muted); margin-bottom:4px; }
.afa-sc-col .bar { width:70%; background:var(--green); border-radius:4px 4px 0 0; min-height:2px; }
.afa-sc-col .sz { font-size:11px; font-weight:600; color:var(--text); margin-top:6px; }

/* ---- AFA · OTB ---- */
.afa-otb-table td.afa-otb-tot, .afa-otb-table th:last-child { font-weight:700; border-left:1px solid var(--border); background:var(--bg); }
.afa-otb-table tbody tr td:first-child { font-weight:600; }

/* ===== AFA module frame (UI Production Standard) ===== */
.afa-bar { align-items:center; }
.afa-bar-spacer { flex:1 1 auto; }
.afa-decision { margin:12px 0 14px; }
.primary-btn.compact, .secondary-btn.compact { padding:6px 14px; font-size:12px; border-radius:8px; }
.afa-decision .primary-btn { border:0; cursor:pointer; font-weight:600; }

/* one continuous Excel-grade grid with sticky header + group rows */
.afa-grid-wrap { border:1px solid var(--border); border-radius:var(--radius); overflow:auto; max-height:calc(100vh - 340px); background:var(--panel); box-shadow:0 2px 8px rgba(0,0,0,0.02); }
.afa-grid { width:100%; border-collapse:separate; border-spacing:0; font-size:13px; }
.afa-grid thead th { position:sticky; top:0; z-index:3; background:var(--panel); text-align:left; font-size:10px; font-weight:760; letter-spacing:0.06em; text-transform:uppercase; color:var(--faint); padding:9px 12px; border-bottom:1px solid var(--border-strong); }
.afa-grid th.num, .afa-grid td.num { text-align:right; font-variant-numeric:tabular-nums; }
.afa-grid td { padding:8px 12px; border-bottom:1px solid var(--border); color:var(--text); }
.afa-grid tbody tr:hover td { background:var(--bg); }
.afa-grid .afa-lp-style { font-weight:600; }
.afa-grid .afa-grp td { background:var(--bg); font-weight:700; font-size:12px; color:var(--text); padding:8px 12px; }
.afa-grid .afa-grp td span { float:right; font-weight:600; color:var(--muted); font-size:11px; }
.afa-grid .afa-grp:hover td { background:var(--bg); }
.afa-grid .afa-sub td { font-weight:700; color:var(--muted); border-bottom:2px solid var(--border-strong); }
.afa-grid .afa-sub td:first-child { color:var(--faint); font-weight:600; }
.afa-grid .afa-sub:hover td { background:transparent; }

/* designed empty state (P2) */
.afa-empty { text-align:center; padding:56px 20px; color:var(--muted); background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); }
.afa-empty-ic { font-size:30px; color:var(--faint); margin-bottom:10px; }
.afa-empty p { margin:0 0 12px; font-size:14px; }

/* focus-visible rings (P7 / WCAG 2.4.7) */
.afa-bar .mpicker-btn:focus-visible, .afa-bar .chip-search input:focus-visible, .afa-bar .chip-more:focus-visible,
.afa-decision .primary-btn:focus-visible, .afa-empty button:focus-visible { outline:2px solid var(--green); outline-offset:2px; }

/* ===== AFA Line Plan v2 (Cards⇄Sheet, exceptions, buy sheet) ===== */
.page-head .actions .afa-view-seg { margin-right:2px; }
/* decision strip: totals left, exception chips right */
.afa-decision { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  background:var(--panel); border:1px solid var(--border); border-radius:var(--radius); padding:12px 16px; margin:12px 0 14px; box-shadow:0 2px 8px rgba(0,0,0,0.02); }
.afa-decision .scope-totals { display:flex; gap:26px; flex-wrap:wrap; }
.afa-exc-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.afa-exc { border:1px solid var(--border); background:var(--bg); border-radius:999px; padding:5px 12px; font:inherit; font-size:12px; font-weight:600; color:var(--muted); cursor:pointer; display:inline-flex; gap:6px; align-items:center; }
.afa-exc strong { color:var(--text); }
.afa-exc.alert { border-left:3px solid var(--red); }
.afa-exc.warn { border-left:3px solid var(--amber); }
.afa-exc:hover { border-color:var(--border-strong); }
.afa-exc.on { background:var(--green); color:#fff; border-color:var(--green); }
.afa-exc.on strong { color:#fff; }
.afa-review-clean { font-size:12px; color:var(--faint); }

/* cards lens */
.afa-cards-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(184px,1fr)); gap:14px; }
.afa-card { text-align:left; padding:0; border:1px solid var(--border); border-radius:var(--radius); background:var(--panel); overflow:hidden; cursor:pointer; font:inherit; color:var(--text); box-shadow:0 2px 8px rgba(0,0,0,0.02); transition:box-shadow .12s, transform .12s, border-color .12s; display:flex; flex-direction:column; }
.afa-card:hover { box-shadow:0 8px 22px rgba(0,0,0,0.09); transform:translateY(-2px); border-color:var(--border-strong); }
.afa-card:focus-visible { outline:2px solid var(--green); outline-offset:2px; }
.afa-card-img { aspect-ratio:1/1; background-size:cover; background-position:center; background-color:var(--bg); }
.afa-card-swatch { display:flex; align-items:center; justify-content:center; }
.afa-card-swatch span { font-size:11px; font-weight:700; color:rgba(255,255,255,0.92); text-shadow:0 1px 2px rgba(0,0,0,0.35); letter-spacing:.02em; }
.afa-card-body { padding:10px 12px 12px; }
.afa-card-name { font-size:13px; font-weight:700; line-height:1.25; }
.afa-card-sub { font-size:11px; color:var(--muted); margin-top:2px; }
.afa-card-stats { display:flex; gap:10px; margin-top:9px; font-size:11px; color:var(--muted); flex-wrap:wrap; }
.afa-card-stats b { color:var(--text); font-variant-numeric:tabular-nums; }
.afa-row-click { cursor:pointer; }

/* buy sheet drawer */
.afa-buy-ov { position:fixed; inset:0; background:rgba(15,23,20,0.34); opacity:0; pointer-events:none; transition:opacity .15s; z-index:60; }
.afa-buy-ov.open { opacity:1; pointer-events:auto; }
.afa-buy-panel { position:absolute; top:0; right:0; height:100%; width:min(720px,92vw); background:var(--panel); box-shadow:-8px 0 30px rgba(0,0,0,0.18); display:flex; flex-direction:column; transform:translateX(12px); transition:transform .15s; overflow:hidden; }
.afa-buy-ov.open .afa-buy-panel { transform:translateX(0); }
.afa-buy-head { display:flex; align-items:flex-start; justify-content:space-between; padding:18px 22px; border-bottom:1px solid var(--border); }
.afa-buy-head h3 { margin:0; font-size:18px; font-weight:760; }
.afa-buy-head p { margin:3px 0 0; font-size:12px; color:var(--muted); }
.afa-buy-x { border:0; background:transparent; font-size:16px; color:var(--muted); cursor:pointer; padding:4px 8px; border-radius:6px; }
.afa-buy-x:hover { background:var(--bg); color:var(--text); }
.afa-buy-body { padding:18px 22px 28px; overflow:auto; display:flex; flex-direction:column; gap:16px; }
/* Item Master — record drawer */
.afa-item-panel, .afa-buy-panel.afa-im-panel { width:min(880px,95vw); }
.afa-im-hero { width:100%; height:230px; border-radius:12px; background-size:cover; background-position:center; background-color:var(--bg); border:1px solid var(--border); margin-bottom:14px; }
.afa-im-attrs { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px 18px; margin-bottom:14px; }
.afa-im-attr { display:flex; flex-direction:column; gap:2px; }
.afa-im-attr label { font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.afa-im-attr span { font-size:13px; font-weight:600; color:var(--text); }
.afa-im-tiles { display:flex; flex-wrap:wrap; gap:10px; }
.afa-im-tile { flex:1 1 92px; border:1px solid var(--border); border-radius:10px; padding:10px 12px; background:var(--panel); }
.afa-im-tile label { display:block; font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-bottom:3px; }
.afa-im-tile strong { font-size:17px; font-weight:740; color:var(--text); }
.afa-im-tile.alert { border-color:#dc2626; } .afa-im-tile.alert strong { color:#dc2626; }
.afa-im-tile.warn { border-color:#d97706; } .afa-im-tile.warn strong { color:#b45309; }
.afa-im-sub { font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin:12px 0 6px; font-weight:640; }
.afa-im-loading { font-size:12.5px; color:var(--muted); padding:14px 4px; }
.afa-im-bar { flex-wrap:wrap; gap:8px; align-items:center; }
.afa-im-filter { font-size:12px; padding:6px 10px; border:1px solid var(--border); border-radius:8px; background:var(--panel); color:var(--text); cursor:pointer; max-width:190px; }
.afa-im-filter:hover { border-color:var(--muted); }
/* MFP Topline */
.mfp-kpis { display:flex; flex-wrap:wrap; gap:10px; margin:12px 0; }
.mfp-kpi { flex:1 1 140px; border:1px solid var(--border); border-radius:10px; padding:10px 14px; background:var(--panel); }
.mfp-kpi label { display:block; font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.mfp-kpi strong { font-size:20px; font-weight:760; color:var(--text); display:block; margin:2px 0; }
.mfp-kpi span { font-size:11.5px; font-weight:600; }
.mfp-grid { font-variant-numeric:tabular-nums; }
.mfp-grid th, .mfp-grid td { white-space:nowrap; }
.mfp-grid .mfp-mcol { text-align:left; font-weight:600; position:sticky; left:0; background:var(--panel); z-index:1; min-width:150px; }
.mfp-grid thead th { font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; }
.mfp-grid .mfp-season { background:rgba(148,163,184,0.10); }
.mfp-grid .mfp-fy { background:rgba(148,163,184,0.18); font-weight:700; }
.mfp-grid .mfp-otb-row td { border-top:2px solid var(--accent,#DB2777); font-weight:640; }
.mfp-grid .mfp-otb-row .mfp-mcol { color:var(--accent,#DB2777); }
.mfp-pos { color:#059669; } td.mfp-pos { background:rgba(5,150,105,0.09); }
.mfp-neg { color:#dc2626; } td.mfp-neg { background:rgba(220,38,38,0.09); }
.mfp-flat { color:var(--muted); }
.mfp-src { font-size:11px; color:var(--muted); margin-top:10px; }
/* Topline planning grid — dense, sticky label col, version/var stacks */
.mfp-grid td, .mfp-grid th { padding:2px 8px; font-size:11.5px; height:22px; text-align:right; }
.mfp-grid .mfp-rlabel { text-align:left; position:sticky; left:0; background:var(--panel); z-index:1; min-width:150px; padding-left:18px; color:var(--muted); font-weight:500; }
.mfp-grid .mfp-roll { background:rgba(148,163,184,0.10); }
.mfp-grid .mfp-fy { background:rgba(148,163,184,0.18); font-weight:700; }
.mfp-mhead td { background:var(--bg); border-top:1px solid var(--border); font-weight:740; font-size:12px; text-align:left; position:sticky; left:0; color:var(--text); padding:7px 8px 3px; }
.mfp-editbadge { font-size:9px; text-transform:uppercase; letter-spacing:.04em; color:#fff; background:var(--accent,#DB2777); border-radius:4px; padding:1px 5px; margin-left:6px; vertical-align:middle; }
.mfp-editbadge.derived { background:var(--muted); }
.mfp-wp .mfp-rlabel { color:var(--text); font-weight:740; }
.mfp-wp td { font-weight:640; }
.mfp-seed .mfp-rlabel { color:#7c3aed; font-style:italic; }
.mfp-seed td { color:#7c3aed; }
.mfp-varrow td { font-size:10.5px; color:var(--muted); }
.mfp-varrow .mfp-rlabel { padding-left:26px; font-style:italic; }
.mfp-var.mfp-neg, .mfp-neg { color:#dc2626 !important; }
.mfp-pos { color:#059669; }
.mfp-in-td { padding:1px 2px !important; }
.mfp-in { width:74px; text-align:right; font-size:11.5px; font-variant-numeric:tabular-nums; border:1px solid transparent; border-radius:4px; padding:2px 5px; background:transparent; color:var(--text); font-weight:640; }
.mfp-in:hover { border-color:var(--border); }
.mfp-in:focus { border-color:var(--accent,#DB2777); background:var(--panel); outline:none; box-shadow:0 0 0 2px rgba(219,39,119,.12); }
.mfp-in-roll { font-style:italic; }

/* Per-metric color identity + block separation (breaks up the white; each metric set its own hue) */
.mfp-grid tbody.mfp-blk { --mh:148,163,184; }
.mfp-grid tbody.mfp-blk:nth-of-type(1) { --mh:99,102,241; }   /* Sales — indigo */
.mfp-grid tbody.mfp-blk:nth-of-type(2) { --mh:13,148,136; }   /* ASP — teal */
.mfp-grid tbody.mfp-blk:nth-of-type(3) { --mh:217,119,6; }    /* Units — amber */
.mfp-grid tbody.mfp-blk:nth-of-type(4) { --mh:225,29,72; }    /* GM$ — rose */
.mfp-grid tbody.mfp-blk:nth-of-type(5) { --mh:124,58,237; }   /* GM% — violet */
.mfp-grid tbody.mfp-blk .mfp-mhead td { background:rgba(var(--mh),.09); box-shadow:inset 3px 0 0 rgb(var(--mh)); border-top:1px solid rgba(var(--mh),.35); }
.mfp-grid tbody.mfp-blk .mfp-mlabel { color:rgb(var(--mh)); font-size:12.5px; font-weight:760; }
.mfp-grid tbody.mfp-blk td:not(.mfp-rlabel):not(.mfp-mcol):not(.mfp-roll):not(.mfp-fy) { background-color:rgba(var(--mh),.03); }
.mfp-editbadge { background:rgb(var(--mh)); }
.mfp-editbadge.derived { background:var(--muted); }
/* Editable (WP input) row — obviously different */
.mfp-grid tbody.mfp-blk .mfp-editrow td:not(.mfp-rlabel):not(.mfp-mcol):not(.mfp-roll):not(.mfp-fy) { background-color:rgba(var(--mh),.14)!important; }
.mfp-grid tbody.mfp-blk .mfp-editrow td { box-shadow:inset 0 -1px 0 rgba(var(--mh),.25), inset 0 1px 0 rgba(var(--mh),.25); }
.mfp-editrow .mfp-rlabel { color:var(--text)!important; font-weight:760!important; }
.mfp-editrow .mfp-rlabel::after { content:" ✎"; color:rgb(var(--mh)); font-size:10px; }
.mfp-editrow .mfp-in { border-color:rgba(var(--mh),.4); background:var(--panel); }
.mfp-editrow .mfp-in:hover { border-color:rgb(var(--mh)); }
.mfp-editrow .mfp-in:focus { border-color:rgb(var(--mh)); box-shadow:0 0 0 2px rgba(var(--mh),.18); }
/* Why pill */
.mfp-why { margin-left:10px; border:1px solid var(--border); background:var(--panel); color:var(--muted); border-radius:20px; font-size:10.5px; font-weight:660; padding:2px 10px; cursor:pointer; vertical-align:middle; }
.mfp-why:hover, .mfp-why.open { color:rgb(var(--mh)); border-color:rgba(var(--mh),.55); background:rgba(var(--mh),.06); }
.mfp-why span { font-size:8px; margin-left:2px; }
/* Deep-dive drill panel */
.mfp-drill-row td { position:sticky; left:0; background:var(--panel); padding:0!important; }
.mfp-drill-inner { max-width:1100px; padding:14px 16px; border-left:3px solid rgb(var(--mh)); background:linear-gradient(90deg, rgba(var(--mh),.05), rgba(var(--mh),0) 60%); }
.mfp-drill-h { display:flex; align-items:baseline; gap:10px; margin-bottom:10px; }
.mfp-drill-h strong { font-size:13.5px; color:var(--text); } .mfp-drill-h span { font-size:11px; color:var(--muted); }
.mfp-drill-cols { display:flex; gap:26px; flex-wrap:wrap; margin-bottom:6px; }
.mfp-drill-col { flex:1 1 300px; min-width:280px; } .mfp-drill-col.mfp-drill-wide { flex:1 1 100%; }
.mfp-drill-col h5 { font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); margin:0 0 7px; font-weight:700; }
.mfp-drill-note { font-size:11px; color:var(--muted); margin-top:8px; line-height:1.5; }
.mfp-drill-note b { color:var(--text); }
/* mini WP/LY bars */
.mfp-mini { display:flex; flex-direction:column; gap:5px; }
.mfp-mini-row { display:grid; grid-template-columns:88px 1fr 78px 46px; align-items:center; gap:8px; font-size:11.5px; }
.mfp-mini-solo .mfp-mini-row { grid-template-columns:110px 1fr 96px; }
.mfp-mini-lbl { color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mfp-mini-track { position:relative; height:16px; display:flex; flex-direction:column; justify-content:center; gap:3px; }
.mfp-mini-track i { display:block; height:6px; border-radius:4px; min-width:2px; transition:width .25s ease; }
.mfp-mini-track i.wp { background:rgb(var(--mh, 4,120,87)); } .mfp-mini-track i.ly { background:rgba(148,163,184,.45); }
.mfp-mini-val { text-align:right; font-variant-numeric:tabular-nums; color:var(--text); font-weight:640; }
.mfp-mini-d { text-align:right; font-weight:640; font-size:11px; }
/* mini margin/cost waterfall */
.mfp-wf { display:flex; align-items:flex-end; gap:6px; flex-wrap:wrap; }
.mfp-wf-step { display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:8px 10px; border-radius:8px; background:var(--panel); border:1px solid var(--border); min-width:92px; }
.mfp-wf-step.first { background:rgba(var(--mh),.10); } .mfp-wf-step.total { background:rgba(var(--mh),.18); }
.mfp-wf-step b { font-size:14px; font-weight:760; color:var(--text); } .mfp-wf-step em { font-style:normal; font-size:12px; font-weight:680; }
.mfp-wf-step span { font-size:10px; color:var(--muted); }
.mfp-wf-bar { height:5px; border-radius:3px; display:block; margin-bottom:1px; }
.mfp-wf-bar.pos { background:#34d399; } .mfp-wf-bar.neg { background:#f87171; }

.mfp-wi { display:flex; align-items:center; gap:8px; flex-wrap:wrap; background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:8px 12px; margin:10px 0; font-size:12px; }
.mfp-wi-lbl { font-weight:700; color:var(--text); }
.mfp-wi-x { color:var(--muted); }
.mfp-wi-pct { width:64px; padding:5px 8px; border:1px solid var(--border); border-radius:8px; font-size:12px; background:var(--bg); color:var(--text); }
.mfp-wi-active { background:rgba(219,39,119,.10); color:var(--accent,#DB2777); border-radius:20px; padding:3px 10px; font-weight:640; }
.mfp-wi-spacer { flex:1; }
.mfp-chart { margin-top:16px; border:1px solid var(--border); border-radius:12px; padding:12px 14px; background:var(--panel); }
.mfp-chart-legend { font-size:12px; color:var(--muted); margin-bottom:8px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.mfp-chart-legend b { color:var(--text); font-weight:700; }
.mfp-leg-wrap { display:flex; gap:12px; flex-wrap:wrap; margin-left:auto; }
.mfp-leg { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; color:var(--muted); font-weight:600; }
.mfp-leg i { width:12px; height:3px; border-radius:2px; display:inline-block; }
.mfp-chart-svg { width:100%; height:150px; display:block; }
/* Rebuilt line chart — crisp: no stretch, real axes, hairline grid, WP area + endpoint */
.mfp-cx-svg { width:100%; height:auto; max-height:300px; display:block; }
.mfp-cx-grid { stroke:var(--line,#e3e8ef); stroke-width:1; shape-rendering:crispEdges; }
.mfp-cx-yt, .mfp-cx-xt { fill:var(--faint,#94a3b8); font-size:10.5px; font-variant-numeric:tabular-nums; }
.mfp-cx-end { fill:#047857; font-size:11.5px; font-weight:700; font-variant-numeric:tabular-nums; }
/* Cadence (clean seasonal) view */
.mfp-view-seg { margin-right:6px; }
.mfp-cad td, .mfp-cad th { padding:9px 14px; font-size:12.5px; }
.mfp-cad .mfp-cad-lbl { font-size:13px; color:var(--text); font-weight:640; }
.mfp-cad-v { font-weight:720; font-size:14px; color:var(--text); }
.mfp-cad-d { font-size:10.5px; margin-top:1px; }
.mfp-cad-row:hover td { background:rgba(148,163,184,0.07); }
.mfp-cad .mfp-fy { background:rgba(148,163,184,0.14); }
.mfp-leg-snap i { border-top:2px dashed currentColor; background:transparent!important; height:0; border-radius:0; }

/* Exception engine */
.mfp-exc-strip { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:10px 0; font-size:12px; }
.mfp-exc-clean { color:#047857; background:rgba(4,120,87,.07); border:1px solid rgba(4,120,87,.18); border-radius:8px; padding:7px 12px; font-weight:600; }
.mfp-exc-count { font-weight:740; color:var(--text); background:rgba(148,163,184,.16); border-radius:20px; padding:3px 10px; }
.mfp-exc-count.high { color:#b91c1c; background:rgba(220,38,38,.12); }
.mfp-exc-chip { border:1px solid var(--border); background:var(--panel); color:var(--text); border-radius:20px; padding:4px 11px; font-size:11.5px; cursor:pointer; font-weight:560; }
.mfp-exc-chip:hover { border-color:var(--accent,#DB2777); }
.mfp-exc-chip.high { border-color:rgba(220,38,38,.4); color:#b91c1c; background:rgba(220,38,38,.05); }
.mfp-exc-more { color:var(--muted); font-size:11px; }
.mfp-exc-queue { border:1px solid var(--border); border-radius:12px; background:var(--panel); padding:6px; margin:10px 0; }
.mfp-exc-qhead { font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); font-weight:700; padding:6px 8px 8px; display:flex; align-items:center; gap:8px; }
.mfp-exc-row { display:flex; align-items:center; gap:10px; width:100%; text-align:left; border:0; border-top:1px solid var(--border); background:transparent; color:var(--text); padding:9px 10px; cursor:pointer; font-size:12.5px; }
.mfp-exc-row:first-of-type { border-top:0; }
.mfp-exc-row:hover { background:rgba(148,163,184,.08); }
.mfp-exc-dot { width:8px; height:8px; border-radius:50%; flex:none; }
.mfp-exc-dot.up { background:#0891b2; } .mfp-exc-dot.down { background:#dc2626; }
.mfp-exc-row.high .mfp-exc-dot { box-shadow:0 0 0 3px rgba(220,38,38,.16); }
.mfp-exc-txt { flex:1; } .mfp-exc-row.high .mfp-exc-txt { font-weight:640; }
.mfp-exc-go { color:var(--accent,#DB2777); font-size:11px; font-weight:640; opacity:0; }
.mfp-exc-row:hover .mfp-exc-go { opacity:1; }
@keyframes mfpFlash { 0%,100% { box-shadow:none; } 30% { box-shadow:inset 0 0 0 2px var(--accent,#DB2777), 0 0 0 3px rgba(219,39,119,.25); } }
.mfp-flash { animation:mfpFlash 2.2s ease; background:rgba(219,39,119,.08)!important; }

/* AI seed explain */
.mfp-ai { border:1px solid var(--border); border-radius:10px; background:var(--panel); margin:10px 0; overflow:hidden; }
.mfp-ai-toggle { width:100%; text-align:left; border:0; background:transparent; color:var(--text); padding:9px 12px; font-size:12px; font-weight:680; cursor:pointer; display:flex; align-items:center; gap:8px; }
.mfp-ai-tag { font-size:10px; font-weight:600; color:#6d28d9; background:rgba(124,58,237,.10); border-radius:20px; padding:2px 8px; text-transform:uppercase; letter-spacing:.03em; }
.mfp-ai-body { padding:4px 12px 12px; }
.mfp-ai-row { border-top:1px solid var(--border); padding:9px 0; }
.mfp-ai-h { display:flex; align-items:center; gap:10px; font-size:12.5px; }
.mfp-ai-h strong { min-width:170px; } .mfp-ai-yr { font-weight:720; }
.mfp-ai-h .chip-more { margin-left:auto; }
.mfp-ai-why { font-size:11px; color:var(--muted); margin:3px 0 5px; }
.mfp-ai-bars { display:flex; flex-wrap:wrap; gap:5px 12px; }
.mfp-ai-fac { display:inline-flex; align-items:center; gap:5px; font-size:10.5px; color:var(--muted); }
.mfp-ai-fac i { height:6px; background:#34d399; border-radius:3px; display:inline-block; min-width:2px; }
.mfp-ai-fac i.neg { background:#f87171; }
.mfp-ai-foot { font-size:10.5px; color:var(--muted); margin-top:8px; font-style:italic; }

/* Plan bridge */
.mfp-bridge { margin-top:16px; border:1px solid var(--border); border-radius:12px; padding:12px 14px; background:var(--panel); }
.mfp-br-svg { width:100%; height:auto; max-height:220px; display:block; }
.mfp-br-tot { font-weight:700; margin-left:6px; font-variant-numeric:tabular-nums; }
.mfp-br-tot.mfp-pos { color:#059669; } .mfp-br-tot.mfp-neg { color:#dc2626; }
.mfp-br-lbl { font-size:10.5px; fill:var(--muted); text-anchor:middle; }
.mfp-br-val { font-size:10.5px; fill:var(--text); text-anchor:middle; font-weight:650; font-variant-numeric:tabular-nums; }
.mfp-br-anchor { fill:#cbd5e1; } .mfp-br-total { fill:#047857; }
.mfp-br-pos { fill:#34d399; } .mfp-br-neg { fill:#f87171; }
.mfp-br-conn { stroke:var(--faint,#94a3b8); stroke-width:1; stroke-dasharray:3 3; opacity:.7; }
@media (prefers-color-scheme:dark){ .mfp-br-anchor { fill:#475569; } }

/* Snapshot compare bar */
.mfp-snapbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:12px 0; font-size:11.5px; }
.mfp-snap-lbl { font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; font-size:10.5px; }
.mfp-snap-item { display:inline-flex; align-items:center; gap:7px; border:1px solid var(--border); border-radius:20px; padding:4px 6px 4px 10px; background:var(--panel); }
.mfp-snap-item i { width:9px; height:9px; border-radius:50%; }
.mfp-snap-item em { font-style:normal; font-weight:660; }
.mfp-snap-x { color:var(--muted)!important; padding:2px 6px!important; }

/* Topline area — tab bar (Plan / Dashboard / upcoming areas) */
.mfp-tabs { display:flex; align-items:center; gap:2px; border-bottom:1px solid var(--border); margin:6px 0 14px; overflow-x:auto; }
.mfp-tab { border:0; background:transparent; color:var(--muted); font-size:13px; font-weight:640; padding:9px 16px; cursor:pointer; border-bottom:2px solid transparent; white-space:nowrap; }
.mfp-tab:hover { color:var(--text); }
.mfp-tab.active { color:var(--accent,#DB2777); border-bottom-color:var(--accent,#DB2777); }
.mfp-tab.soon { color:var(--faint,#9aa7b4); cursor:default; display:inline-flex; align-items:center; gap:6px; }
.mfp-tab.soon i { font-style:normal; font-size:8.5px; text-transform:uppercase; letter-spacing:.05em; background:rgba(148,163,184,.18); color:var(--muted); border-radius:20px; padding:1px 6px; }

/* Dashboard tab — cards */
.mfp-dash { display:flex; flex-direction:column; gap:16px; }
.mfp-dash-row { display:flex; gap:16px; flex-wrap:wrap; }
.mfp-card { border:1px solid var(--border); border-radius:14px; background:var(--panel); padding:16px 18px; box-shadow:0 1px 2px rgba(15,42,74,.04); }
.mfp-card-half { flex:1 1 440px; min-width:340px; }
.mfp-card > h4 { margin:0 0 10px; font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); font-weight:700; }
.mfp-card .mfp-bridge, .mfp-card .mfp-chart { border:0; padding:0; margin:0; background:transparent; }
.mfp-card .mfp-exc-strip { margin:0; }

/* Why — compact inline teaser + deep-dive button */
.mfp-teaser { display:flex; align-items:center; gap:14px; padding:11px 14px; border-left:3px solid rgb(var(--mh,148,163,184)); background:linear-gradient(90deg, rgba(var(--mh,148,163,184),.06), rgba(var(--mh,148,163,184),0) 70%); flex-wrap:wrap; }
.mfp-teaser-stat { font-size:15px; font-weight:760; color:var(--text); } .mfp-teaser-stat em { font-style:normal; font-size:12px; font-weight:640; color:var(--muted); margin-left:4px; }
.mfp-teaser-line { font-size:12px; color:var(--muted); flex:1; min-width:180px; }
.mfp-deepdive { border:1px solid rgba(var(--mh,148,163,184),.5); background:var(--panel); color:rgb(var(--mh,148,163,184)); border-radius:20px; font-size:11.5px; font-weight:660; padding:5px 13px; cursor:pointer; }
.mfp-deepdive:hover { background:rgba(var(--mh,148,163,184),.10); }

/* Why deep-dive drawer (DHI-style) */
.mfp-wd-scrim { position:fixed; inset:0; background:rgba(11,42,74,.28); z-index:79; }
.mfp-wd { position:fixed; top:0; right:0; height:100vh; width:560px; max-width:94vw; background:var(--panel,#fff); box-shadow:-12px 0 40px rgba(11,42,74,.20); z-index:80; overflow:auto; padding:22px 24px 32px; font-size:13px; }
.mfp-wd-head { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.mfp-wd-eyebrow { font-size:10px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:700; }
.mfp-wd-title { font-size:19px; font-weight:760; line-height:1.25; margin-top:4px; color:var(--text); }
.mfp-wd-scope { margin-top:5px; font-size:12px; color:var(--muted); }
.mfp-wd-x { border:0; background:transparent; font-size:19px; color:var(--muted); cursor:pointer; line-height:1; }
.mfp-wd-narr { background:rgba(4,120,87,.07); border:1px solid rgba(4,120,87,.20); border-radius:9px; padding:12px 14px; margin-top:14px; line-height:1.55; color:var(--text); }
.mfp-wd-tiles { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.mfp-wd-tile { flex:1 1 118px; background:var(--bg); border:1px solid var(--border); border-radius:8px; padding:9px 12px; }
.mfp-wd-tl { font-size:9.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-weight:700; }
.mfp-wd-tv { font-size:15px; font-weight:740; margin-top:2px; color:var(--text); }
.mfp-wd-ts { font-size:10.5px; color:var(--muted); }
.mfp-wd-body { margin-top:8px; }
.mfp-wd-body .mfp-drill-inner { max-width:none; border-left:0; background:transparent; padding:14px 0 0; }
.mfp-wd-body .mfp-drill-h { display:none; }
.mfp-wd-body .mfp-drill-cols { gap:16px; }
.mfp-wd-body .mfp-drill-col { min-width:220px; }

/* Why drawer — generative AI analyst read */
.mfp-wd-ai { margin-top:16px; border:1px solid rgba(var(--mh),.30); border-radius:12px; padding:14px 16px; background:linear-gradient(180deg, rgba(var(--mh),.08), rgba(var(--mh),.02)); }
.mfp-wd-ai-top { display:flex; align-items:center; gap:8px; }
.mfp-wd-ai-badge { font-size:11px; font-weight:800; letter-spacing:.02em; color:#fff; background:rgb(var(--mh)); border-radius:20px; padding:3px 10px; }
.mfp-wd-ai-sub { font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:700; flex:1; }
.mfp-wd-ai-refresh { border:0; background:transparent; color:var(--muted); cursor:pointer; font-size:14px; }
.mfp-wd-ai-refresh:hover { color:rgb(var(--mh)); }
.mfp-wd-ai-headline { font-size:16px; font-weight:760; color:var(--text); margin:10px 0 6px; line-height:1.3; }
.mfp-wd-ai-read { font-size:13px; line-height:1.6; color:var(--text); }
.mfp-wd-ai-bullets { list-style:none; padding:0; margin:11px 0 0; display:flex; flex-direction:column; gap:6px; }
.mfp-wd-ai-bullets li { position:relative; padding:7px 11px 7px 30px; border-radius:8px; font-size:12px; line-height:1.45; background:var(--panel); border:1px solid var(--border); }
.mfp-wd-ai-bullets li::before { position:absolute; left:10px; top:7px; font-size:11px; }
.mfp-wd-ai-bullets li.ok::before { content:'▲'; color:#059669; }
.mfp-wd-ai-bullets li.warn::before { content:'●'; color:#d97706; }
.mfp-wd-ai-foot { font-size:10px; color:var(--muted); margin-top:10px; font-style:italic; }
.mfp-wd-ai-acthead { font-size:10px; text-transform:uppercase; letter-spacing:.05em; color:rgb(var(--mh)); font-weight:800; margin:13px 0 6px; }
.mfp-wd-ai-actions { margin:0; padding-left:20px; display:flex; flex-direction:column; gap:5px; }
.mfp-wd-ai-actions li { font-size:12px; line-height:1.45; color:var(--text); }
.mfp-wd-ai-actions li::marker { color:rgb(var(--mh)); font-weight:800; }
.mfp-wd-back { border:0; background:transparent; color:rgb(var(--mh)); cursor:pointer; font-size:11px; font-weight:700; padding:0; text-transform:none; letter-spacing:0; }
.mfp-wd-back:hover { text-decoration:underline; }
.mfp-mini-drill { color:rgb(var(--mh,148,163,184))!important; cursor:pointer; font-weight:640; }
.mfp-mini-drill:hover { text-decoration:underline; }

/* Daily Pulse */
.pulse-today { display:inline-block; font-size:12px; font-weight:640; color:var(--muted); background:rgba(148,163,184,.12); border-radius:20px; padding:4px 12px; margin-bottom:12px; }
.pulse-ai { margin-top:0; margin-bottom:16px; }
.pulse-cards { display:flex; gap:12px; flex-wrap:wrap; margin:16px 0; }
.pulse-card { flex:1 1 150px; border:1px solid var(--border); border-radius:12px; padding:13px 16px; background:var(--panel); }
.pulse-card.big { flex:1 1 100%; border-color:rgba(219,39,119,.35); background:linear-gradient(180deg, rgba(219,39,119,.06), rgba(219,39,119,.01)); }
.pulse-card label { display:block; font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-weight:700; }
.pulse-card strong { display:block; font-size:22px; font-weight:770; color:var(--text); margin:3px 0; }
.pulse-card.big strong { font-size:30px; }
.pulse-card span { font-size:12px; font-weight:660; }
.pulse-card em { display:block; font-style:normal; font-size:11px; color:var(--muted); margin-top:2px; }
.pulse-spark { width:100%; height:auto; max-height:220px; display:block; }
.pulse-bars { display:flex; flex-direction:column; gap:7px; }
.pulse-bar-row { display:grid; grid-template-columns:110px 1fr 90px 48px; align-items:center; gap:9px; font-size:12px; }
.pulse-bar-n { color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pulse-bar-tk { height:10px; background:rgba(148,163,184,.15); border-radius:5px; overflow:hidden; }
.pulse-bar-tk i { display:block; height:10px; background:var(--accent,#DB2777); border-radius:5px; }
.pulse-bar-v { text-align:right; font-weight:640; font-variant-numeric:tabular-nums; color:var(--text); }
.pulse-bar-d { text-align:right; font-weight:640; }
.pulse-bar-drill { color:var(--accent,#DB2777)!important; cursor:pointer; font-weight:600; }
.pulse-bar-drill:hover { text-decoration:underline; }
.pulse-filters { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:10px 0 4px; }
.pulse-filters-spacer { flex:1; }
.pulse-pseg-lbl { font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; font-weight:700; }
.pulse-pseg { }
.pulse-scope { display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:640; color:var(--accent,#DB2777); background:rgba(219,39,119,.08); border-radius:20px; padding:4px 6px 4px 12px; margin-bottom:10px; }
.pulse-scope button { border:0; background:var(--panel); color:var(--muted); border-radius:20px; font-size:10.5px; padding:2px 9px; cursor:pointer; }
.pulse-card { cursor:pointer; transition:box-shadow .1s; }
.pulse-card:hover { box-shadow:0 2px 8px rgba(15,42,74,.10); }
.pulse-card.active { border-color:var(--accent,#DB2777); box-shadow:inset 0 0 0 1px var(--accent,#DB2777); }
.pulse-back { border:0; background:transparent; color:var(--accent,#DB2777); cursor:pointer; font-size:11px; font-weight:700; margin-left:8px; text-transform:none; letter-spacing:0; }
.pulse-back:hover { text-decoration:underline; }

.mfp-wd-ai-load { display:flex; gap:6px; margin:14px 0 6px; }
.mfp-wd-ai-load i { flex:1; height:8px; border-radius:4px; background:rgba(var(--mh),.14); animation:mfpShim 1.1s ease-in-out infinite; }
.mfp-wd-ai-load i:nth-child(2) { animation-delay:.18s; } .mfp-wd-ai-load i:nth-child(3) { animation-delay:.36s; }
.mfp-wd-ai-loadtxt { font-size:11.5px; color:var(--muted); }
@keyframes mfpShim { 0%,100% { opacity:.4; } 50% { opacity:1; } }
.mfp-wd-ai-err { font-size:12px; color:var(--muted); margin-top:10px; }
/* drawer sections */
.mfp-wd-sec { margin-top:20px; }
.mfp-wd-sec h5 { font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-weight:700; margin:0 0 9px; }
.mfp-wd-spark { width:100%; height:auto; max-height:150px; display:block; }
.mfp-wd-sparklab { display:flex; gap:14px; font-size:10.5px; color:var(--muted); margin-top:4px; }
.mfp-wd-sparklab i { display:inline-block; width:12px; height:3px; border-radius:2px; margin-right:4px; vertical-align:middle; }
.mfp-wd-sparklab span:last-child { margin-left:auto; }
.mfp-wd-drv { display:grid; grid-template-columns:96px 1fr 92px; align-items:center; gap:9px; margin-bottom:6px; font-size:12px; }
.mfp-wd-drv-n { color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mfp-wd-drv-bar { height:9px; background:rgba(148,163,184,.15); border-radius:5px; overflow:hidden; }
.mfp-wd-drv-bar i { display:block; height:9px; border-radius:5px; }
.mfp-wd-drv-bar i.pos { background:#34d399; } .mfp-wd-drv-bar i.neg { background:#f87171; }
.mfp-wd-drv-v { text-align:right; font-weight:640; font-variant-numeric:tabular-nums; }
.mfp-wd-flag { position:relative; font-size:12px; line-height:1.45; padding:9px 12px 9px 12px; border-radius:9px; margin-bottom:7px; border:1px solid; }
.mfp-wd-flag.opp { background:rgba(5,150,105,.06); border-color:rgba(5,150,105,.25); }
.mfp-wd-flag.risk { background:rgba(217,119,6,.07); border-color:rgba(217,119,6,.28); }
.mfp-wd-flag-tag { display:inline-block; font-size:8.5px; font-weight:800; letter-spacing:.05em; border-radius:4px; padding:1px 6px; margin-right:8px; vertical-align:middle; }
.mfp-wd-flag.opp .mfp-wd-flag-tag { background:#059669; color:#fff; } .mfp-wd-flag.risk .mfp-wd-flag-tag { background:#d97706; color:#fff; }

/* By Channel */
.mfp-chan-bar { display:flex; align-items:center; gap:12px; margin:4px 0 14px; flex-wrap:wrap; }
.mfp-chan-lbl { font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); font-weight:700; white-space:nowrap; }
.mfp-mixbar { flex:1; min-width:260px; display:flex; height:26px; border-radius:7px; overflow:hidden; }
.mfp-mixseg { display:flex; align-items:center; justify-content:center; color:#fff; font-size:11px; font-weight:640; white-space:nowrap; overflow:hidden; }
.mfp-chan-share { margin-left:12px; font-size:11px; font-weight:600; color:var(--muted); }
.mfp-grid .mfp-chan-mrow td { background:rgba(var(--mh,148,163,184),.05); border-top:1px solid rgba(var(--mh,148,163,184),.18); padding-top:5px; }
.mfp-chan-mlbl { font-weight:700!important; color:rgb(var(--mh,148,163,184))!important; font-size:11px!important; }
.mfp-chan-check .mfp-mhead td { background:rgba(148,163,184,.12); box-shadow:inset 3px 0 0 var(--muted); }
.mfp-chan-check .mfp-mlabel { color:var(--text); }

/* Item Hierarchy — Dept > Category > Sub-Category drill */
.mfp-hier-bar { display:flex; align-items:center; gap:12px; margin:4px 0 12px; }
.mfp-hier-spacer { flex:1; }
.mfp-hier th, .mfp-hier td { padding:6px 12px; font-size:12px; height:26px; }
.mfp-hier thead th { font-size:10.5px; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); font-weight:700; text-align:right; }
.mfp-hier thead th.mfp-hier-name { text-align:left; }
.mfp-hier-name { text-align:left!important; position:sticky; left:0; background:var(--panel); z-index:1; min-width:260px; }
.mfp-hier-row { cursor:default; }
.mfp-hier-row.lvl0, .mfp-hier-row.lvl1 { cursor:pointer; }
.mfp-hier-row:hover td { background:rgba(148,163,184,.07); }
.mfp-hier-row.lvl0 > .mfp-hier-name { font-weight:720; color:var(--text); padding-left:14px; }
.mfp-hier-row.lvl1 > .mfp-hier-name { font-weight:600; color:var(--text); padding-left:34px; }
.mfp-hier-row.lvl2 > .mfp-hier-name { color:var(--muted); padding-left:56px; font-size:11.5px; }
.mfp-hier-row.lvl0 td { border-top:1px solid var(--border); }
.mfp-hier-tot td { font-weight:740; background:rgba(148,163,184,.10); border-bottom:2px solid var(--border); }
.mfp-hier-caret { display:inline-block; width:14px; color:var(--muted); font-size:9px; margin-right:4px; }
.mfp-hier-leaf { display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--border); margin:0 9px 1px 4px; }
.mfp-hier-wp { font-weight:700; color:var(--text); }
.mfp-hier-mix { white-space:nowrap; }
.mfp-hier-mixbar { display:inline-block; width:46px; height:6px; border-radius:3px; background:rgba(148,163,184,.2); margin-right:6px; vertical-align:middle; overflow:hidden; }
.mfp-hier-mixbar i { display:block; height:6px; background:var(--accent,#DB2777); border-radius:3px; }
.mfp-hier-mixh { text-align:right; }
.mfp-hier .mfp-hier-wp.mfp-in-td { padding:1px 4px!important; }
.mfp-hier .mfp-hier-wp .mfp-in { width:104px; border-color:rgba(15,118,110,.25); font-weight:700; }
.mfp-hier .mfp-hier-wp .mfp-in:hover { border-color:var(--accent,#0F766E); }
.mfp-hier-edited .mfp-in { background:rgba(15,118,110,.10); border-color:rgba(15,118,110,.5)!important; }
.mfp-hier-editcount { font-size:11px; font-weight:640; color:#0F766E; background:rgba(15,118,110,.10); border-radius:20px; padding:3px 10px; margin-right:4px; }

/* Item hierarchy — Level 1/2/3 mix breakdown (channel-style blocks, drilled) */
.mfp-item .mfp-item-h { cursor:pointer; }
.mfp-item .mfp-item-h:hover td { filter:brightness(0.98); }
.mfp-item-blk.lvl0 .mfp-mhead td { padding-left:12px; }
.mfp-item-blk.lvl1 .mfp-mhead td { padding-left:32px; }
.mfp-item-blk.lvl2 .mfp-mhead td { padding-left:52px; }
.mfp-item-blk.lvl1 .mfp-chan-mlbl, .mfp-item-blk.lvl1 .mfp-rlabel { padding-left:40px; }
.mfp-item-blk.lvl2 .mfp-chan-mlbl, .mfp-item-blk.lvl2 .mfp-rlabel { padding-left:60px; }
.mfp-item-blk.lvl1 .mfp-mlabel { font-size:12px; }
.mfp-item-blk.lvl2 .mfp-mlabel { font-size:11.5px; font-weight:640; }
.mfp-item-tl .mfp-mhead td { background:rgba(148,163,184,.14)!important; box-shadow:inset 3px 0 0 var(--muted); font-weight:740; }
.mfp-item-tl .mfp-mlabel { color:var(--text)!important; }
.mfp-item-lvl { display:inline-block; font-size:9px; font-weight:800; letter-spacing:.03em; color:#fff; background:rgb(var(--mh,148,163,184)); border-radius:4px; padding:1px 5px; margin-right:7px; vertical-align:middle; }
.mfp-item .mfp-hier-caret { font-size:12px; color:rgb(var(--mh,148,163,184)); }
.mfp-item-h.has-kids .mfp-mcol { position:relative; }
.mfp-item-drill { margin-left:12px; font-size:10.5px; font-weight:660; color:rgb(var(--mh,148,163,184)); background:rgba(var(--mh,148,163,184),.10); border:1px solid rgba(var(--mh,148,163,184),.35); border-radius:20px; padding:2px 10px; }
.mfp-item-h.has-kids:hover .mfp-item-drill { background:rgb(var(--mh,148,163,184)); color:#fff; }
.mfp-item-h.has-kids:hover td { background:rgba(var(--mh,148,163,184),.14); }

/* Month → week column drill */
.mfp-wk-caret { display:inline-block; cursor:pointer; color:var(--muted); font-size:9px; margin-right:4px; padding:0 2px; border-radius:3px; }
.mfp-wk-caret:hover { color:var(--accent,#DB2777); background:rgba(219,39,119,.12); }
.mfp-grid th.mfp-wk { background:rgba(37,99,235,.07); }
.mfp-grid td.mfp-wk { background:rgba(37,99,235,.05); font-style:italic; color:var(--muted); }
.mfp-grid .mfp-wp td.mfp-wk { color:var(--text); font-style:normal; }
.mfp-wk-end { display:block; font-size:10.5px; font-weight:700; color:var(--text); }
.mfp-wk-num { display:block; font-size:8.5px; font-weight:600; color:var(--muted); text-transform:none; letter-spacing:0; }

/* Three-way reconciliation */
.recon-grid th .recon-dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:5px; vertical-align:middle; }
.recon-tri { display:inline-flex; align-items:flex-end; gap:2px; height:22px; width:34px; vertical-align:middle; }
.recon-tri i { flex:1; display:block; border-radius:1px 1px 0 0; min-height:8px; }
.recon-rec { font-weight:740; color:var(--text); background:rgba(15,118,110,.07); }
.recon-picked { box-shadow:inset 0 0 0 1px rgba(15,118,110,.35); background:rgba(15,118,110,.06); }
.recon-review { color:#b45309; background:rgba(180,83,9,.10); border-radius:20px; padding:2px 9px; font-size:11px; font-weight:640; }
.mfp-kpi-rec { border-color:rgba(15,118,110,.4); background:rgba(15,118,110,.05); }
.recon-grid td, .recon-grid th { white-space:nowrap; }

/* Store Allocation — editable policy-lever cells */
.afa-cell-select { border: 1px solid var(--border, #d8dee5); border-radius: 6px; background: var(--surface, #fff); font-size: 12px; font-weight: 600; color: var(--text, #1a2733); padding: 3px 6px; min-width: 74px; }
.afa-cell-select:hover { border-color: var(--accent, #0F766E); }
.afa-cell-select:focus { outline: none; border-color: var(--accent, #0F766E); box-shadow: 0 0 0 2px rgba(15,118,110,.15); }
tr.afa-row-edited td { background: rgba(15,118,110,.06); }
tr.afa-row-edited td:first-child { box-shadow: inset 3px 0 0 var(--accent, #0F766E); }
.afa-bar-spacer { flex: 1 1 auto; }

/* Store Allocation — policy sub-nav + number cells */
.afa-policy-nav { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 14px; }
.afa-policy-pill { border: 1px solid var(--border, #d8dee5); background: var(--surface, #fff); color: var(--text, #1a2733); border-radius: 999px; padding: 5px 12px; font-size: 12px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.afa-policy-pill:hover { border-color: var(--accent, #0F766E); }
.afa-policy-pill.active { background: var(--accent, #0F766E); border-color: var(--accent, #0F766E); color: #fff; }
.afa-policy-pill.pending { color: var(--faint, #8a97a3); }
.afa-pill-dot { width: 6px; height: 6px; border-radius: 50%; background: #d4a017; display: inline-block; }
.afa-cell-num { width: 84px; border: 1px solid var(--border, #d8dee5); border-radius: 6px; background: var(--surface, #fff); font-size: 12px; font-weight: 600; color: var(--text, #1a2733); padding: 3px 8px; text-align: right; }
.afa-cell-num:focus { outline: none; border-color: var(--accent, #0F766E); box-shadow: 0 0 0 2px rgba(15,118,110,.15); }
.afa-num-col { max-width: 130px; }

/* Store Allocation — Manage TOs workbench */
.afa-insight { font-size: 12.5px; color: var(--muted, #56626e); margin: -4px 0 12px; padding: 0 2px; }
.afa-insight strong { color: var(--text, #1a2733); }
.afa-insight strong.warn { color: #b45309; }
.afa-chip-group { display: inline-flex; align-items: center; gap: 4px; }
.afa-chip-lbl { font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--faint, #8a97a3); font-weight: 600; margin-right: 2px; }
.afa-chip { border: 1px solid var(--border, #d8dee5); background: var(--surface, #fff); color: var(--text, #1a2733); border-radius: 999px; padding: 4px 10px; font-size: 12px; font-weight: 600; cursor: pointer; }
.afa-chip:hover { border-color: var(--accent, #0F766E); }
.afa-chip.active { background: var(--accent, #0F766E); border-color: var(--accent, #0F766E); color: #fff; }
.afa-chip-n { opacity: .65; font-weight: 500; }
.afa-chip.active .afa-chip-n { opacity: .85; }
.afa-fill { display: inline-block; min-width: 42px; text-align: center; border-radius: 5px; padding: 1px 6px; font-size: 11.5px; font-weight: 700; }
.afa-fill-ok { color: #047857; background: rgba(4,120,87,.10); }
.afa-fill-warn { color: #b45309; background: rgba(180,83,9,.10); }
.afa-fill-alert { color: #b91c1c; background: rgba(185,28,28,.10); }
tr.afa-row-short td { background: rgba(180,83,9,.045); }
tr.afa-row-short td:first-child { box-shadow: inset 3px 0 0 #d4a017; }
.afa-src-cell { font-size: 11.5px; color: var(--muted, #56626e); white-space: nowrap; }
.afa-src-full { color: var(--text, #1a2733); }
.afa-src-part { color: var(--faint, #8a97a3); font-size: 11px; margin-left: 4px; }

/* Store Allocation — resolution chips + in-transit + Why drawer */
.afa-row-click { cursor: pointer; }
.afa-intransit { color: #2563eb; font-weight: 600; font-size: 11px; }
.afa-reso { font-weight: 600; font-size: 11.5px; white-space: nowrap; }
.afa-reso-po { color: #1d4ed8; }
.afa-reso-sis { color: #047857; }
.afa-reso-buy { color: #b91c1c; }
.afa-dw-scrim { position: fixed; inset: 0; background: rgba(15,23,32,.28); z-index: 90; }
.afa-dw { position: fixed; top: 0; right: 0; height: 100vh; width: 420px; max-width: 92vw; background: var(--surface, #fff); box-shadow: -8px 0 28px rgba(15,23,32,.18); z-index: 91; display: flex; flex-direction: column; }
.afa-dw-top { display: flex; align-items: flex-start; justify-content: space-between; padding: 16px 18px 12px; border-bottom: 1px solid var(--border, #e5e9ee); }
.afa-dw-title { font-size: 16px; font-weight: 700; color: var(--text, #1a2733); }
.afa-dw-region { font-size: 11px; font-weight: 600; color: var(--faint, #8a97a3); border: 1px solid var(--border, #d8dee5); border-radius: 999px; padding: 1px 7px; margin-left: 6px; vertical-align: middle; }
.afa-dw-sub { font-size: 12px; color: var(--muted, #56626e); margin-top: 3px; font-family: 'IBM Plex Mono', monospace; }
.afa-dw-x { background: none; border: none; font-size: 22px; line-height: 1; color: var(--faint, #8a97a3); cursor: pointer; padding: 0 2px; }
.afa-dw-body { padding: 6px 18px 24px; overflow-y: auto; }
.afa-dw-sec { padding: 12px 0; border-bottom: 1px solid var(--border-soft, #eef1f4); }
.afa-dw-h { font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--faint, #8a97a3); font-weight: 700; margin-bottom: 7px; }
.afa-dw-math { font-size: 12.5px; line-height: 1.65; color: var(--muted, #56626e); }
.afa-dw-math strong { color: var(--text, #1a2733); }
.afa-dw-reso { background: rgba(29,78,216,.05); margin: 6px -18px 0; padding: 12px 18px; border-bottom: none; border-left: 3px solid #1d4ed8; }
.afa-dw-reso .afa-dw-h { color: #1d4ed8; }
.afa-dw-reso div { font-size: 13px; line-height: 1.55; color: var(--text, #1a2733); }
.afa-dw-leg { display: flex; align-items: baseline; gap: 8px; padding: 4px 0; font-size: 12.5px; }
.afa-dw-leg-wh { font-weight: 700; color: var(--text, #1a2733); min-width: 40px; }
.afa-dw-leg-av { color: var(--muted, #56626e); }
.afa-dw-leg-po { margin-left: auto; font-size: 11.5px; color: #1d4ed8; font-weight: 600; }
.afa-dw-kv { display: flex; justify-content: space-between; font-size: 12.5px; padding: 3px 0; color: var(--muted, #56626e); }
.afa-dw-kv strong { color: var(--text, #1a2733); }
.afa-dw-muted { font-size: 12.5px; color: var(--faint, #8a97a3); }

/* Store Allocation — Manage TOs: POV bar, Cadence/Sheet toggle */
.afa-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.afa-bar-top { margin-bottom: 8px; }
.afa-bar-pov { padding: 8px 10px; background: var(--surface-2, #f7f9fb); border: 1px solid var(--border-soft, #eef1f4); border-radius: 8px; margin-bottom: 12px; }
.afa-bar-spacer { flex: 1 1 auto; }
.afa-view-toggle { flex: 0 0 auto; }
.afa-size-chip { font-size: 10px; font-weight: 700; color: var(--accent, #0F766E); background: rgba(15,118,110,.09); border-radius: 4px; padding: 0 5px; margin-left: 4px; vertical-align: middle; }
.afa-asof { color: var(--faint, #8a97a3); font-size: 11.5px; }
tr.afa-row-appr td:first-child { box-shadow: inset 3px 0 0 #047857; }

/* Store Allocation — Sheet view (NSPB Manage TO, mirrored, Excel-on-web) */
.afa-sheet-note { font-size: 11.5px; color: var(--muted, #56626e); margin: 2px 0 8px; }
.afa-sheet-note strong { color: var(--text, #1a2733); }
.afa-sheet-wrap { position: relative; max-height: calc(100vh - 320px); overflow: auto; border: 1px solid var(--border, #d7dde5); border-radius: 8px; background: #fff; }
.afa-sheet { border-collapse: separate; border-spacing: 0; font-size: 12px; width: max-content; min-width: 100%; }
.afa-sheet th { position: sticky; top: 0; z-index: 6; background: #eef2f5; color: #243244; font-weight: 700; font-size: 10px; text-transform: uppercase; letter-spacing: 0; text-align: right; padding: 0 6px; height: 26px; white-space: nowrap; border-bottom: 1px solid #c9d3dc; border-right: 1px solid #e1e6ec; }
.afa-sheet th.afa-edit-h { background: #e7f4f0; color: #0f5c53; }
.afa-sheet td { padding: 0 6px; height: 23px; line-height: 23px; text-align: right; white-space: nowrap; border-bottom: 1px solid #eef1f4; border-right: 1px solid #f1f4f7; font-variant-numeric: tabular-nums; color: #1c2733; background: #fff; }
.afa-sheet th.num, .afa-sheet td.num { min-width: 44px; }
.afa-sheet th:not(.num):not(.afa-edit-h), .afa-sheet td:not(.num):not(.afa-edit) { text-align: left; }
.afa-sheet tbody tr:hover td { background: #f6faf9; }
.afa-sheet .mono { font-family: 'IBM Plex Mono', monospace; font-size: 10.5px; }
.afa-sheet .afa-frz { position: sticky; left: 0; z-index: 7; min-width: 124px; max-width: 124px; overflow: hidden; text-overflow: ellipsis; box-shadow: 1px 0 0 #e1e6ec; }
.afa-sheet .afa-frz2 { position: sticky; left: 124px; z-index: 7; min-width: 96px; max-width: 118px; overflow: hidden; text-overflow: ellipsis; box-shadow: 1px 0 0 #e1e6ec; }
.afa-sheet thead .afa-frz, .afa-sheet thead .afa-frz2 { z-index: 9; }
.afa-sheet tbody .afa-frz, .afa-sheet tbody .afa-frz2 { background: #fff; }
.afa-sheet tbody tr:hover .afa-frz, .afa-sheet tbody tr:hover .afa-frz2 { background: #f6faf9; }
.afa-propcol { cursor: pointer; color: var(--accent, #0F766E); font-weight: 700; text-align: center !important; min-width: 58px; }
.afa-prop { background: #fbfcfd; color: #56626e; font-size: 11px; }
.afa-muted { color: #a3adb8; }
.afa-sheet td.afa-edit { padding: 0; background: #fffdf3; }
.afa-sheet th.afa-edit-h.num, .afa-sheet td.afa-edit { min-width: 58px; max-width: 74px; }
.afa-sheet-edit { width: 100%; height: 23px; box-sizing: border-box; border: none; background: transparent; font: inherit; font-size: 11.5px; text-align: right; padding: 0 6px; color: #1c2733; outline: none; }
.afa-sheet-edit:focus { background: #fff; box-shadow: inset 0 0 0 2px var(--accent, #0F766E); }
.afa-sheet-sel { text-align: left; cursor: pointer; min-width: 62px; }
.afa-flag { width: 100%; height: 23px; border: none; background: transparent; font: inherit; font-size: 11.5px; font-weight: 700; color: #b0b8c1; cursor: pointer; }
.afa-flag.on { color: #047857; background: rgba(4,120,87,.10); }
.afa-flag.off { color: #94a3b0; }
/* Policy-grid engine (matrix policy forms) */
.afa-sheet.afa-pg th.afa-pg-group { text-align: center; background: #e6ebf0; color: #364656; border-bottom: 1px solid #cdd6df; }
.afa-sheet.afa-pg thead tr:first-child th { border-bottom: 1px solid #d5dde5; }
.afa-sheet.afa-pg td.afa-edit { min-width: 52px; }
.afa-pg-note { font-size: 11.5px; color: var(--muted, #56626e); }
.afa-flag-warn { color: #b45309; font-weight: 700; }
.afa-sheet-constr td { background: rgba(180,83,9,.05); }
.afa-sheet-constr .afa-frz, .afa-sheet-constr .afa-frz2 { background: #fdf7ef; }
.afa-sheet-appr .afa-frz { box-shadow: 1px 0 0 #e1e6ec, inset 3px 0 0 #047857; }

/* Store Allocation — Cadence table density (kill the airy column gaps): fixed layout, one column absorbs slack */
.afa-cad table { table-layout: fixed; width: 100%; }
.afa-cad thead th { font-size: 10.5px; padding-top: 6px; padding-bottom: 6px; }
.afa-cad tbody td { padding-top: 5px; padding-bottom: 5px; }
.afa-cad th:nth-child(1), .afa-cad td:nth-child(1) { width: 132px; }                 /* SKU */
.afa-cad th:nth-child(2), .afa-cad td:nth-child(2) { width: 258px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }  /* Name */
.afa-cad th:nth-child(3), .afa-cad td:nth-child(3) { width: 156px; }                 /* Store */
.afa-cad th:nth-child(4), .afa-cad td:nth-child(4) { width: 58px; }                  /* Region */
.afa-cad th.num, .afa-cad td.num { width: 64px; }                                    /* AWS WOS On-hand Uncons Total Fill */
.afa-cad th:last-child, .afa-cad td:last-child { width: auto; white-space: nowrap; } /* Sourcing / action absorbs the remainder */

/* ===== Store Allocation — deeper visual polish pass (Refactoring UI: hierarchy, density, de-emphasis) ===== */
/* KPI strip is secondary chrome — tighten it so the work surface (table) leads */
.afa-kpis { gap: 10px; margin-bottom: 14px; }
.afa-kpis .kpi { padding: 10px 14px; border-radius: 9px; }
.afa-kpis .kpi label { font-size: 9.5px; letter-spacing: .06em; }
.afa-kpis .kpi strong { margin-top: 4px; font-size: 22px; }
/* Name cell: truncate the name but ALWAYS show the size chip (was getting ellipsis-cut) */
.afa-cad td.afa-nm-cell { overflow: visible; }
.afa-cad .afa-nm { display: inline-block; max-width: 208px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.afa-cad .afa-size-chip { vertical-align: middle; }
/* widen the text columns a touch to use the space + shrink the right gap */
.afa-cad th:nth-child(2), .afa-cad td:nth-child(2) { width: 300px; }
.afa-cad th:nth-child(3), .afa-cad td:nth-child(3) { width: 178px; }
/* row affordance */
.afa-cad tbody tr { transition: background .08s; }
.afa-cad tbody tr:hover td { background: #f5faf8; }
.afa-cad tbody tr:hover td:first-child { box-shadow: inset 3px 0 0 var(--accent, #0F766E); }
/* tighten the vertical rhythm above the table */
.afa-bar-top { margin-bottom: 7px; }
.afa-insight { margin: 2px 0 10px; }
/* Sheet: a hair more depth on the frozen edge + calmer constrained tint */
.afa-sheet .afa-frz { box-shadow: 2px 0 0 #dbe1e8; }
.afa-sheet-constr td { background: rgba(190,110,30,.055); }
.afa-sheet thead th { box-shadow: 0 1px 0 #c9d3dc; }
/* editable focus ring (WCAG-visible) already on inputs; make the flag buttons focus-visible too */
.afa-flag:focus-visible, .afa-sheet-sel:focus-visible { outline: 2px solid var(--accent, #0F766E); outline-offset: -2px; }

/* Per-user density preference (account menu → Preferences). Compact tightens the vertical rhythm. */
body[data-density="compact"] .view{padding-top:8px}
body[data-density="compact"] .pr-tbl td,body[data-density="compact"] .pr-tbl th{padding-top:4px;padding-bottom:4px}
body[data-density="compact"] .cad-table td,body[data-density="compact"] .cad-table th{padding-top:5px;padding-bottom:5px}
body[data-density="compact"] .module-header{padding-bottom:2px;margin-bottom:6px}
body[data-density="compact"] .cad-kpi{padding:9px 11px}

/* ---- MFP Sheet (Univer) + Summary visualization ---- */
.mfp-uv-note{font-size:12px;color:#5b6675;padding:8px 10px;background:#f6f8fb;border:1px solid #e3e8ef;border-radius:6px;margin:8px 0}
.mfp-uv-note b{color:#1f2a37}
.mfp-uv-box{height:calc(100vh - 330px);min-height:420px;border:1px solid #d7dde5;border-radius:6px;overflow:hidden;background:#fff}
.mfp-uv-loading{padding:36px;text-align:center;color:#5b6675;font-size:12.5px}
.mfp-sum-viz{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.mfp-sum-viz .mfp-card-half{margin:0}
@media (max-width:1100px){.mfp-sum-viz{grid-template-columns:1fr}}

/* ---- Vendor Scorecard ---- */
.av-wrap{margin-top:10px}
.av-table{width:100%;border-collapse:collapse;font-size:12.5px}
.av-table th{text-align:left;padding:7px 9px;border-bottom:2px solid #e3e8ef;color:#5b6675;font-weight:600;white-space:nowrap;position:sticky;top:0;background:#fff;z-index:1}
.av-table th.num{text-align:right}
.av-table td{padding:7px 9px;border-bottom:1px solid #eef2f6;vertical-align:middle}
.av-table td.num{text-align:right;font-variant-numeric:tabular-nums}
.av-row{cursor:pointer}
.av-row:hover{background:#f6f9fc}
.av-row.av-sel{background:#f2f9f6}
.av-dept{display:block;font-size:10.5px;color:#94a3b8;font-weight:500;margin-top:1px}
.av-sub{color:#94a3b8;font-size:10.5px}
.av-comp{white-space:nowrap}
.av-comp b{margin-left:6px;font-variant-numeric:tabular-nums}
.av-cbar{display:inline-block;width:56px;height:7px;border-radius:4px;background:#eef2f6;overflow:hidden;vertical-align:middle}
.av-cbar i{display:block;height:100%;border-radius:4px}
.av-cbar.av-g i{background:#059669}.av-cbar.av-b i{background:#1e47c4}.av-cbar.av-a i{background:#d97706}.av-cbar.av-r i{background:#dc2626}
.av-rag{display:inline-block;padding:2px 7px;border-radius:11px;font-weight:600;font-size:11.5px;font-variant-numeric:tabular-nums}
.av-rag.av-g{background:#dcfce7;color:#15803d}.av-rag.av-a{background:#fef3c7;color:#b45309}.av-rag.av-r{background:#fee2e2;color:#b91c1c}
.av-tier{display:inline-block;padding:2px 8px;border-radius:5px;font-weight:700;font-size:11px;letter-spacing:.01em;white-space:nowrap}
.av-tier.av-g{background:#065f46;color:#fff}.av-tier.av-b{background:#1e47c4;color:#fff}.av-tier.av-a{background:#b45309;color:#fff}.av-tier.av-r{background:#b91c1c;color:#fff}
.av-onord{color:#5b6675}
.av-trend{width:120px}.av-spark{width:120px;height:26px;display:block}
.av-drill{color:#94a3b8;text-align:center;font-size:13px}
.av-detail{margin-top:14px}
.av-detail-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:12px}
@media (max-width:1050px){.av-detail-grid{grid-template-columns:1fr}}
.av-score{width:100%;border-collapse:collapse;font-size:12.5px;margin-top:6px}
.av-score th{text-align:left;padding:6px 8px;border-bottom:1px solid #e3e8ef;color:#5b6675;font-weight:600}
.av-score th.num,.av-score td.num{text-align:right;font-variant-numeric:tabular-nums}
.av-score td{padding:6px 8px;border-bottom:1px solid #f1f4f8}
.av-score-tot td{border-top:2px solid #e3e8ef;background:#f8fafc}
.av-signal{padding:9px 11px;background:#f6f8fb;border:1px solid #e3e8ef;border-radius:6px;font-size:12.5px;color:#1f2a37;line-height:1.5}
.av-facts{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:11px}
.av-fact{background:#fafbfc;border:1px solid #eef2f6;border-radius:6px;padding:7px 9px}
.av-fact label{display:block;font-size:10.5px;color:#94a3b8;font-weight:600;text-transform:uppercase;letter-spacing:.03em}
.av-fact strong{font-size:14px;color:#1f2a37;font-variant-numeric:tabular-nums}
.av-md{margin-top:10px;font-size:12.5px;font-weight:600}
.av-otblink{margin-top:12px}

/* ---- OTB hero row + basis toggle ---- */
.mfp-basis-seg{display:inline-flex;margin-left:6px}
.mfp-basis-seg .seg-btn{padding:3px 12px}
.mfp-otb-hero td{background:#f2f7ff !important;font-weight:600}
.mfp-otb-hero .mfp-otb-lbl{color:#1e47c4}
.mfp-otb-tag{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:4px;background:#1e47c4;color:#fff;font-size:9.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;vertical-align:middle}
.mfp-otb-over{background:#fee2e2 !important;color:#b91c1c !important;font-weight:700}

/* ---- Business Health (exec landing) ---- */
.hl-score{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:11px;margin:6px 0 4px}
.hl-big{background:linear-gradient(135deg,#047857,#065f46);color:#fff;border-radius:13px;padding:16px 18px;display:flex;flex-direction:column;justify-content:center}
.hl-big .hl-lab{font-size:11px;font-weight:600;opacity:.82;letter-spacing:.02em}
.hl-big .hl-val{font-size:33px;font-weight:800;letter-spacing:-.025em;margin:5px 0 3px;font-variant-numeric:tabular-nums}
.hl-big .hl-bvs{font-size:12.5px;font-weight:600;opacity:.95}
.hl-big .hl-bvs b{background:rgba(255,255,255,.2);padding:1px 7px;border-radius:20px}
.hl-kpi{background:var(--panel,#f7f9fc);border:1px solid var(--line,#e3e8ef);border-radius:13px;padding:14px 15px 12px}
.hl-kpi .hl-lab{font-size:11px;color:var(--muted,#5b6675);font-weight:600}
.hl-kval{font-size:23px;font-weight:750;letter-spacing:-.02em;margin:5px 0 3px;font-variant-numeric:tabular-nums}
.hl-vs{font-size:11.5px;font-weight:600}
.hl-vs.up{color:#059669}.hl-vs.down{color:#dc2626}.hl-vs.flat{color:#b45309}
.hl-two{display:grid;grid-template-columns:1.55fr 1fr;gap:12px;margin-top:12px}
.hl-three{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:12px;margin-top:12px}
.hl-csub{color:var(--muted,#5b6675);font-size:12px;margin:-4px 0 12px}
.hl-chart{width:100%;height:auto;max-height:250px;display:block}
.hl-legend{display:flex;gap:16px;margin-top:8px;font-size:11.5px;color:var(--muted,#5b6675)}
.hl-legend i{display:inline-block;width:16px;height:3px;border-radius:2px;vertical-align:middle;margin-right:6px}
.hl-mixbar{display:flex;height:32px;border-radius:8px;overflow:hidden;margin:2px 0 12px}
.hl-mixseg{display:flex;align-items:center;justify-content:center;color:#fff;font-size:11.5px;font-weight:700;min-width:2px}
.hl-mixrow{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-top:1px solid var(--line,#e3e8ef);font-size:13px}
.hl-mixrow:first-of-type{border-top:0}
.hl-mixrow .nm{font-weight:600;display:flex;align-items:center;gap:8px}
.hl-sw{width:9px;height:9px;border-radius:3px}
.hl-mixrow .r{display:flex;gap:14px;align-items:baseline}
.hl-mixrow .amt{font-weight:700;font-variant-numeric:tabular-nums}
.hl-mixrow .up{color:#059669;font-weight:700;font-size:12px}.hl-mixrow .down{color:#dc2626;font-weight:700;font-size:12px}
.hl-catrow{display:grid;grid-template-columns:96px 1fr 60px 52px;gap:11px;align-items:center;padding:8px 0;border-top:1px solid var(--line,#e3e8ef);font-size:13px}
.hl-catrow:first-of-type{border-top:0}
.hl-catrow .nm{font-weight:600}
.hl-bar{height:8px;border-radius:5px;background:var(--panel-2,#eef2f6);overflow:hidden}
.hl-bar i{display:block;height:100%;border-radius:5px}
.hl-bar i.b{background:#1e47c4}.hl-bar i.good{background:#059669}.hl-bar i.crit{background:#dc2626}
.hl-catrow .amt{text-align:right;font-weight:650;font-variant-numeric:tabular-nums}
.hl-catrow .yoy{text-align:right;font-weight:700;font-size:12px;font-variant-numeric:tabular-nums}
.hl-catrow .yoy.up{color:#059669}.hl-catrow .yoy.down{color:#dc2626}
.hl-hrow{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-top:1px solid var(--line,#e3e8ef);font-size:13px}
.hl-hrow:first-of-type{border-top:0}
.hl-hrow .hv{font-weight:700;font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:8px}
.hl-pill{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:2px 7px;border-radius:5px}
.hl-pill.g{background:#dcfce7;color:#15803d}.hl-pill.a{background:#fef3c7;color:#b45309}.hl-pill.r{background:#fee2e2;color:#b91c1c}
.hl-aibadge{font-size:10px;font-weight:700;letter-spacing:.03em;color:#fff;background:linear-gradient(90deg,#7522bb,#1e47c4);padding:2px 7px;border-radius:5px;margin-right:6px}
.hl-brief p{margin:0 0 9px;font-size:13px}.hl-brief .lead{font-weight:650}
.hl-watch{list-style:none;padding:0;margin:4px 0 0;display:flex;flex-direction:column;gap:7px}
.hl-watch li{display:flex;gap:9px;font-size:12.5px;color:var(--muted,#5b6675);align-items:flex-start}
.hl-watch li::before{content:"";width:6px;height:6px;border-radius:50%;background:#047857;margin-top:6px;flex:none}
@media (max-width:1050px){.hl-score{grid-template-columns:1fr 1fr}.hl-two,.hl-three{grid-template-columns:1fr}}

.mfp-sum{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.mfp-sum .mfp-dash-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:1000px){.mfp-sum .mfp-dash-row{grid-template-columns:1fr}}

.mfp-hier-lbl{font-size:11px;font-weight:600;color:var(--muted,#5b6675);text-transform:uppercase;letter-spacing:.03em;margin:0 5px 0 12px}
.mfp-hier-lbl:first-child{margin-left:0}

.mfp-br-zoom{margin-left:auto;font-size:10.5px;color:var(--faint,#94a3b8);font-style:italic;}

/* ---- Topline Summary: growth-vs-trend, read, phasing ---- */
.mfp-csub{color:var(--muted,#5b6675);font-size:12px;margin:-2px 0 12px}
.mfp-tr-head,.mfp-tr-row{display:grid;grid-template-columns:150px 1fr 84px 96px 92px 150px;align-items:center;gap:12px}
.mfp-tr-head{padding:0 0 7px;border-bottom:1px solid var(--line,#e3e8ef);font-size:10.5px;color:var(--faint,#94a3b8);font-weight:700;text-transform:uppercase;letter-spacing:.03em;text-align:right}
.mfp-tr-head em{font-weight:500;text-transform:none;letter-spacing:0;font-size:10px;font-style:normal}
.mfp-tr-row{padding:9px 0;border-bottom:1px solid var(--line,#eef2f6);font-size:13px}
.mfp-tr-row:last-child{border-bottom:0}
.mfp-tr-name{font-weight:650;color:var(--text,#1b2431);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mfp-tr-bar{height:8px;border-radius:5px;background:var(--panel-2,#eef2f6);overflow:hidden}
.mfp-tr-bar i{display:block;height:100%;border-radius:5px;background:#047857}
.mfp-tr-val,.mfp-tr-n{text-align:right;font-variant-numeric:tabular-nums;font-weight:650}
.mfp-tr-n{font-size:12.5px}
.mfp-tr-plan{color:var(--muted,#5b6675)}
.mfp-tr-flag{text-align:right}
.mfp-gapchip{display:inline-block;padding:2px 8px;border-radius:11px;font-size:10.5px;font-weight:700;white-space:nowrap}
.mfp-gapchip.over{background:#fee2e2;color:#b91c1c}
.mfp-gapchip.under{background:#e0f2fe;color:#0369a1}
.mfp-read{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:9px}
.mfp-read li{position:relative;padding-left:16px;font-size:13px;line-height:1.5;color:var(--text,#1b2431)}
.mfp-read li::before{content:"";position:absolute;left:0;top:7px;width:7px;height:7px;border-radius:50%}
.mfp-read li.seed::before{background:#7522bb}.mfp-read li.risk::before{background:#dc2626}
.mfp-read li.opp::before{background:#0369a1}.mfp-read li.conc::before{background:#94a3b8}
.mfp-read li.ok::before{background:#059669}
.mfp-ph{display:flex;flex-direction:column;gap:9px}
.mfp-ph-row{display:grid;grid-template-columns:64px 1fr 46px 84px;align-items:center;gap:10px;font-size:12.5px}
.mfp-ph-n{font-weight:650}
.mfp-ph-track{display:flex;flex-direction:column;gap:3px}
.mfp-ph-track i{display:block;height:6px;border-radius:4px;min-width:2px}
.mfp-ph-track i.wp{background:#047857}.mfp-ph-track i.ly{background:rgba(148,163,184,.45)}
.mfp-ph-v{text-align:right;font-weight:650;font-variant-numeric:tabular-nums}
.mfp-ph-d{text-align:right;font-size:11.5px;font-weight:650;font-variant-numeric:tabular-nums}
.mfp-flat{color:var(--faint,#94a3b8)}
@media (max-width:1100px){.mfp-tr-head,.mfp-tr-row{grid-template-columns:120px 1fr 70px 78px 78px 110px;gap:8px}}

.mfp-tr-head .mfp-tr-bar{background:none}

.pulse-rng{font-weight:500;color:var(--faint,#94a3b8);text-transform:none;letter-spacing:0;margin-left:4px}

.mfp-otb-past{color:var(--faint,#94a3b8) !important;opacity:.55}

.recon-systemic{margin:12px 0 0;padding:11px 14px;border-radius:9px;background:#eff6ff;border:1px solid #bfdbfe;color:#1e3a8a;font-size:13px;line-height:1.55}
.recon-systemic b{color:#1e3a8a}
@media (prefers-color-scheme:dark){.recon-systemic{background:#16233a;border-color:#28406b;color:#c7dbff}.recon-systemic b{color:#c7dbff}}

/* ---- Pulse: period toggle + quadrant deep dives ---- */
.hl-pseg{margin-right:8px}
.hl-pseg .seg-btn{padding:5px 12px;font-size:12.5px}
.mfp-card h4{display:flex;align-items:center;gap:8px}
.hl-deep-btn{margin-left:auto;border:1px solid var(--line,#e3e8ef);background:transparent;color:var(--muted,#5b6675);
  font-size:11.5px;font-weight:650;padding:3px 9px;border-radius:6px;cursor:pointer;white-space:nowrap}
.hl-deep-btn:hover{background:var(--panel-2,#eef2f6);color:var(--text,#1b2431);border-color:var(--line-2,#d7dde5)}
.hl-deep-top{display:flex;align-items:center;gap:14px;margin:4px 0 14px}
.hl-deep-top h3{margin:0;font-size:17px;font-weight:750;letter-spacing:-.01em}
.hl-deep-read{padding:11px 14px;border-radius:9px;background:var(--panel,#f7f9fc);border:1px solid var(--line,#e3e8ef);
  font-size:13px;line-height:1.55;margin-bottom:12px}
.hl-dtable{width:100%;border-collapse:collapse;font-size:12.5px}
.hl-dtable th{text-align:left;padding:8px 10px;border-bottom:2px solid var(--line,#e3e8ef);color:var(--faint,#94a3b8);
  font-weight:700;font-size:10.5px;text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}
.hl-dtable th.num,.hl-dtable td.num{text-align:right;font-variant-numeric:tabular-nums}
.hl-dtable td{padding:8px 10px;border-bottom:1px solid var(--line,#eef2f6)}
.hl-dtable tbody tr:hover{background:var(--panel,#f7f9fc)}
.hl-dc-n{font-weight:650;white-space:nowrap}
.hl-dc-bar{width:170px}
.hl-dc-tk{display:flex;flex-direction:column;gap:3px}
.hl-dc-tk i{display:block;height:6px;border-radius:4px;min-width:2px}
.hl-dc-tk i.ty{background:#047857}.hl-dc-tk i.ly{background:rgba(148,163,184,.45)}
.hl-dim{color:var(--faint,#94a3b8)}
.hl-tag{font-size:10px;font-weight:700;color:var(--faint,#94a3b8);text-transform:uppercase;letter-spacing:.03em}

.hl-rng{font-weight:500;opacity:.75;letter-spacing:0;margin-left:5px}

/* Later-phase nav groups: visible as roadmap, greyed and not clickable */
.nav-soon .nav-group-label{opacity:.42;cursor:default}
.nav-item-soon{display:flex;align-items:center;gap:8px;opacity:.42;cursor:not-allowed;pointer-events:none;padding:6px 10px;font-size:13px}
.nav-group-flat.nav-soon .nav-item-top{opacity:.42;cursor:not-allowed;pointer-events:none}
.nav-soon{pointer-events:none}

/* ---- Grid stickiness: header row AND the row-label column stay put while scrolling ---- */
/* Opaque backgrounds + a deliberate z-order, so block header rows can't paint over the column
   headers, and the label column doesn't scroll away on wide (1800px+) grids. */
.mfp-grid thead th { position:sticky; top:0; z-index:6; background:var(--panel); box-shadow:0 1px 0 var(--border-strong); }
.mfp-grid .mfp-mcol, .mfp-grid .mfp-rlabel { position:sticky; left:0; z-index:4; background:var(--panel); }
.mfp-grid thead th.mfp-mcol { z-index:7; }
.mfp-grid tbody tr.mfp-mhead > td { position:sticky; left:0; z-index:5; background:var(--panel-2, #eef2f6); }
/* editable rows keep their tint on the frozen label cell */
.mfp-grid tr.mfp-editrow .mfp-rlabel { background:var(--panel); }
.av-table thead th { position:sticky; top:0; z-index:5; background:var(--panel); }
.hl-dtable thead th { position:sticky; top:0; z-index:5; background:var(--panel); }

/* ---- Week drill: read as a group belonging to the expanded month ---- */
/* Neutral tint (the old blue was arbitrary against the brand), a clear left/right boundary so the
   weeks visibly bracket their month, and no italics — italic numbers read as "provisional". */
.mfp-grid th.mfp-wk { background:rgba(4,120,87,.055); }
.mfp-grid td.mfp-wk { background:rgba(4,120,87,.04); font-style:normal; color:var(--muted); }
.mfp-grid .mfp-wp td.mfp-wk { color:var(--text); }
.mfp-grid th.mfp-wk-f, .mfp-grid td.mfp-wk-f { border-left:2px solid rgba(4,120,87,.28); }
.mfp-grid th.mfp-wk-l, .mfp-grid td.mfp-wk-l { border-right:2px solid rgba(4,120,87,.28); }
.mfp-wk-end { font-size:10.5px; font-weight:700; }
.mfp-wk-num { font-size:9px; opacity:.75; }
.mfp-wk-caret:hover { color:#047857; background:rgba(4,120,87,.12); }
/* view-mode hint */
.mfp-viewnote{margin:8px 0 10px;padding:9px 12px;border-radius:8px;background:var(--panel-2,#eef2f6);
  border:1px solid var(--line,#e3e8ef);font-size:12.5px;color:var(--muted,#5b6675)}
.mfp-linkbtn{background:none;border:0;padding:0;color:#1e47c4;font-weight:650;font-size:12.5px;cursor:pointer;text-decoration:underline}

/* ---- Cell audit panel: change history + notes (right-click a plan cell) ---- */
.mfp-cp-scrim{position:fixed;inset:0;background:rgba(15,23,42,.28);z-index:60}
.mfp-cp{position:fixed;top:0;right:0;bottom:0;width:392px;max-width:94vw;background:var(--panel,#fff);
  border-left:1px solid var(--line,#e3e8ef);box-shadow:-8px 0 28px rgba(20,32,54,.14);z-index:61;
  display:flex;flex-direction:column;overflow:auto}
.mfp-cp-top{display:flex;align-items:flex-start;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line,#e3e8ef)}
.mfp-cp-top h4{margin:0;font-size:15px;font-weight:750}
.mfp-cp-sub{color:var(--muted,#5b6675);font-size:12px;margin-top:2px}
.mfp-cp-x{margin-left:auto;border:0;background:none;font-size:15px;color:var(--muted,#5b6675);cursor:pointer;padding:2px 6px;border-radius:6px}
.mfp-cp-x:hover{background:var(--panel-2,#eef2f6)}
.mfp-cp-sec{padding:14px 18px;border-bottom:1px solid var(--line,#eef2f6)}
.mfp-cp-sec h5{margin:0 0 9px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--faint,#94a3b8)}
.mfp-cp-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:9px}
.mfp-cp-list li{display:flex;flex-direction:column;gap:2px;font-size:12.5px}
.mfp-cp-val{font-variant-numeric:tabular-nums}
.mfp-cp-note{white-space:pre-wrap;line-height:1.45}
.mfp-cp-meta{font-size:11px;color:var(--faint,#94a3b8)}
.mfp-cp-empty{color:var(--faint,#94a3b8);font-style:italic}
.mfp-cp-add{display:flex;flex-direction:column;gap:7px;margin-bottom:11px}
.mfp-cp-add textarea{width:100%;border:1px solid var(--line-2,#d7dde5);border-radius:7px;padding:8px 10px;
  font:inherit;font-size:12.5px;resize:vertical}
.mfp-cp-add button{align-self:flex-start}
.mfp-cp-foot{padding:12px 18px;font-size:11.5px;color:var(--faint,#94a3b8)}
/* a cell that already carries history/notes gets a corner tick */
.mfp-has-audit{position:relative}
.mfp-has-audit::after{content:"";position:absolute;top:2px;right:2px;width:0;height:0;
  border-top:6px solid #1e47c4;border-left:6px solid transparent}

/* ---- Why: full-page mode (same content, room to breathe) ---- */
.mfp-wd-full{margin-left:auto;border:1px solid var(--line-2,#d7dde5);background:transparent;color:var(--muted,#5b6675);
  font-size:11.5px;font-weight:650;padding:4px 10px;border-radius:6px;cursor:pointer;white-space:nowrap;margin-right:8px}
.mfp-wd-full:hover{background:var(--panel-2,#eef2f6);color:var(--text,#1b2431)}
.mfp-wd.mfp-wd-page{position:static;width:auto;max-width:none;height:auto;box-shadow:none;border-left:0;
  border:1px solid var(--line,#e3e8ef);border-radius:12px;margin-top:12px;overflow:visible}
.mfp-wd.mfp-wd-page .mfp-wd-head{position:static}
/* two columns of analysis when there's room */
@media (min-width:1200px){
  .mfp-wd.mfp-wd-page .mfp-wd-body{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .mfp-wd.mfp-wd-page .mfp-wd-tiles{grid-template-columns:repeat(4,1fr)}
}

/* OTB comparison rows (LY, Projected/Planned EOM) sit behind the plan rows */
.mfp-grid tr.mfp-dimrow td{color:var(--faint,#94a3b8);font-size:12px}
.mfp-grid tr.mfp-dimrow .mfp-otb-lbl{color:var(--muted,#5b6675);font-weight:600}

/* OTB week drill — month-end-only rows (Planned/Projected EOM, OTB) render a muted dot on the
   intra-month weeks: those are month-end concepts and inventing a weekly value would be fabrication. */
.mfp-grid td.mfp-wk-mute { color:var(--muted); opacity:.42; font-weight:600; }
/* Seed provenance badge — marks a row whose value is derived (LY x factor), not sourced or saved. */
.mfp-seedbadge { display:inline-block; font-size:8.5px; font-weight:700; letter-spacing:.02em; text-transform:uppercase;
  padding:1px 5px; border-radius:3px; background:rgba(120,113,108,.14); color:#78716c; vertical-align:middle; margin-left:4px; }

/* Vendor scorecard — real-data states. "not rated" and em-dash cells are deliberate: a vendor with too
   few receipts is shown honestly rather than given a manufactured score. */
.av-na { color:var(--muted); opacity:.6; font-weight:600; font-size:11.5px; }
.av-caveat { margin:10px 0 14px; padding:10px 14px; border-left:3px solid #b45309; background:rgba(180,83,9,.07);
  border-radius:0 6px 6px 0; font-size:12.5px; line-height:1.55; color:var(--text); }
.av-unmeas { margin-top:10px; padding:10px 14px; background:rgba(120,113,108,.07); border-radius:6px; font-size:12px; color:var(--muted); }
.av-unmeas strong { color:var(--text); }
.av-unmeas ul { margin:6px 0 0; padding-left:18px; }
.av-unmeas li { margin:2px 0; }
/* Cover target defaults to FV's live actual cover; this note says so until a planner overrides it. */
.mfp-auto-note { font-style:normal; font-size:10.5px; font-weight:700; color:#047857; background:rgba(4,120,87,.10);
  padding:1px 6px; border-radius:3px; margin-left:6px; }

/* ---- Guide panel: the sections a training audience actually asks for ------------------------------
   A guide that only lists what a screen contains is useless when someone asks "where did this number
   come from?". These carry the formula, the provenance and the gotchas. */
.help-panel { width: min(560px, 96vw); }
.help-sec { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--border); }
.help-sec h4 { margin: 0 0 10px; font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.help-sec .help-terms dt:first-of-type { margin-top: 0; }
.help-formulas dd code { display: inline-block; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 12px; background: rgba(4,120,87,.07); color: #047857; border: 1px solid rgba(4,120,87,.16);
  border-radius: 5px; padding: 2px 7px; margin-top: 2px; }
.help-formulas .help-note { display: block; margin-top: 4px; font-size: 12px; color: var(--muted); line-height: 1.5; }
.help-src-list, .help-watch ul { margin: 0; padding-left: 17px; }
.help-src-list li, .help-watch li { font-size: 12.5px; line-height: 1.6; color: var(--muted); margin: 0 0 7px; }
.help-src-list li strong, .help-watch li strong { color: var(--text); }
.help-src-list code, .help-foot code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11.5px;
  background: rgba(120,113,108,.12); border-radius: 4px; padding: 1px 4px; }
.help-watch { border-top-color: rgba(180,83,9,.3); }
.help-watch h4 { color: #b45309; }
.help-watch li::marker { color: #b45309; }
.help-foot em { font-style: normal; font-weight: 700; color: var(--text); }

/* Plan save state — a planner has to be able to see that what they typed is actually kept. */
.plan-save { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700; padding:3px 9px;
  border-radius:20px; letter-spacing:.01em; margin-right:2px; }
.plan-save:empty { display:none; }
.plan-save.ok { color:#047857; background:rgba(4,120,87,.10); }
.plan-save.ok::before { content:''; width:6px; height:6px; border-radius:50%; background:#047857; }
.plan-save.saving { color:#1e47c4; background:rgba(30,71,196,.10); }
.plan-save.dirty { color:#b45309; background:rgba(180,83,9,.12); }
.plan-save.err { color:#b91c1c; background:rgba(185,28,28,.12); }

/* Plan version control — flip the whole planning surface between Working Plan and a sandbox.
   A sandbox is visually distinct on purpose: the numbers look identical, so the ONLY thing telling a
   planner they are not editing the real plan is this control. */
.plan-ver { display:inline-flex; align-items:center; gap:6px; padding:3px 4px 3px 10px; border-radius:8px;
  border:1px solid var(--border); background:var(--surface); margin-right:6px; }
.plan-ver-lbl { font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.plan-ver-sel { border:0; background:transparent; font-family:inherit; font-size:12.5px; font-weight:700;
  color:var(--text); cursor:pointer; outline:none; max-width:200px; }
.plan-ver-act { border:1px solid transparent; background:transparent; color:var(--muted); font-family:inherit;
  font-size:11.5px; font-weight:600; padding:3px 7px; border-radius:5px; cursor:pointer; }
.plan-ver-act:hover { background:rgba(4,120,87,.10); color:#047857; }
.plan-ver-act.danger:hover { background:rgba(185,28,28,.10); color:#b91c1c; }
.plan-ver.sandbox { border-color:rgba(180,83,9,.45); background:rgba(180,83,9,.07); }
.plan-ver.sandbox .plan-ver-lbl { color:#b45309; }
.plan-ver.sandbox .plan-ver-sel { color:#b45309; }