:root {
  --bg: #f4f6f3;
  --surface: #ffffff;
  --surface-soft: #f8faf7;
  --ink: #17221b;
  --muted: #657269;
  --line: #dce3dd;
  --line-strong: #cbd5cd;
  --nav: #14251d;
  --nav-soft: #1d3328;
  --primary: #23694a;
  --primary-soft: #e4f0e9;
  --accent: #d6ef55;
  --accent-ink: #23310f;
  --blue: #3b6fd8;
  --blue-soft: #eaf0fc;
  --warning: #b66b13;
  --warning-soft: #fff2df;
  --danger: #ba3f3f;
  --danger-soft: #fceaea;
  --shadow: 0 6px 24px rgba(23, 34, 27, 0.06);
  --radius: 8px;
  --sidebar: 244px;
}

* { box-sizing: border-box; }

html { overflow-x: hidden; background: var(--bg); color: var(--ink); }

body {
  margin: 0;
  min-width: 320px;
  background: var(--bg);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: 0;
}

button, select, input { font: inherit; }
button { color: inherit; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.app-shell { min-height: 100vh; }

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 20;
  width: var(--sidebar);
  display: flex;
  flex-direction: column;
  padding: 24px 16px 18px;
  background: var(--nav);
  color: #f1f5f2;
  overflow-y: auto;
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 8px 27px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}

.brand-mark {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 7px;
  background: var(--accent);
  color: var(--accent-ink);
  font-weight: 800;
  font-size: 19px;
}

.brand-copy,
.side-footer > span:last-child,
.freshness > span:last-child { display: flex; flex-direction: column; }
.brand-copy strong { font-size: 14px; font-weight: 700; }
.brand-copy small { margin-top: 3px; color: #9fb0a6; font-size: 11px; }

.nav-list { display: grid; gap: 6px; margin-top: 24px; }

.nav-item {
  width: 100%;
  min-height: 44px;
  display: grid;
  grid-template-columns: 26px 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #aebcb3;
  text-align: left;
  cursor: pointer;
}

.nav-item:hover { background: rgba(255,255,255,.055); color: #fff; }
.nav-item.is-active { background: var(--nav-soft); color: #fff; }
.nav-item.is-active::before {
  content: "";
  position: absolute;
  left: 0;
  width: 3px;
  height: 23px;
  border-radius: 0 3px 3px 0;
  background: var(--accent);
}
.nav-icon { font-size: 15px; text-align: center; white-space: nowrap; }
.nav-count {
  min-width: 21px;
  padding: 2px 6px;
  border-radius: 10px;
  background: rgba(255,255,255,.12);
  color: #dce5df;
  font-size: 11px;
  text-align: center;
}
.nav-count-warn { background: #5f3d1b; color: #ffd99f; }

.side-status {
  margin-top: auto;
  padding: 16px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--radius);
  background: rgba(255,255,255,.035);
}

.side-status-head { display: flex; align-items: center; justify-content: space-between; color: #afbeb5; font-size: 11px; }
.side-status > strong { display: block; margin-top: 12px; font-size: 19px; letter-spacing: .04em; }
.side-status p { margin: 3px 0 12px; color: #aebbb3; font-size: 12px; }
.side-status small { display: block; margin-top: 9px; color: #7f9186; font-size: 10px; }
.progress-track { height: 4px; border-radius: 2px; background: rgba(255,255,255,.1); overflow: hidden; }
.progress-track span { display: block; height: 100%; background: var(--accent); }

.status-dot {
  width: 8px;
  height: 8px;
  display: inline-block;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #4aba78;
  box-shadow: 0 0 0 3px rgba(74,186,120,.13);
}

.side-footer {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  padding: 14px 8px 0;
  border-top: 1px solid rgba(255,255,255,.1);
}
.avatar { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; background: #31483b; color: #d5e1d9; font-size: 10px; font-weight: 700; }
.side-footer strong { font-size: 11px; font-weight: 600; }
.side-footer small { margin-top: 2px; color: #82938a; font-size: 10px; }

.main-shell { margin-left: var(--sidebar); min-width: 0; }

.topbar {
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 16px clamp(20px, 3vw, 42px);
  border-bottom: 1px solid var(--line);
  background: rgba(244,246,243,.94);
}

.topbar h1 { margin: 2px 0 0; font-size: clamp(21px, 2.1vw, 28px); line-height: 1.2; letter-spacing: 0; }
.eyebrow { margin: 0; color: var(--primary); font-size: 10px; font-weight: 800; letter-spacing: .11em; }
.topbar-actions { display: flex; align-items: center; gap: 16px; }
.demo-pill, .success-badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 5px 9px;
  border-radius: 4px;
  background: var(--warning-soft);
  color: #8a5416;
  font-size: 11px;
  font-weight: 700;
}
.success-badge { background: var(--primary-soft); color: var(--primary); }
.freshness { display: flex; align-items: center; gap: 9px; }
.freshness strong { font-size: 11px; font-weight: 700; }
.freshness small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.icon-button, .mobile-menu {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--surface);
  cursor: pointer;
  font-size: 20px;
}
.icon-button:hover, .mobile-menu:hover { border-color: var(--primary); color: var(--primary); }
.mobile-menu { display: none; }

main { padding: 0 clamp(20px, 3vw, 42px) 48px; }

.filterbar {
  min-height: 66px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 20px;
  margin-bottom: 24px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}
.filterbar label { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; white-space: nowrap; }
select, .search-field input, input[type="date"] {
  min-height: 34px;
  border: 1px solid var(--line-strong);
  border-radius: 5px;
  background: var(--surface);
  color: var(--ink);
  outline: none;
}
select { padding: 0 31px 0 10px; }
input[type="date"] { min-width: 132px; padding: 0 8px; }
select:disabled { color: var(--muted); cursor: default; opacity: 1; }
select:focus, input[type="date"]:focus, .search-field:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(35,105,74,.12); }
.date-range-control { min-width: 520px; display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.date-range-control label { gap: 6px; }
.date-separator { color: var(--muted); font-size: 10px; }
.date-apply-button {
  min-height: 34px;
  padding: 0 13px;
  border: 1px solid var(--primary);
  border-radius: 5px;
  background: var(--primary);
  color: #fff;
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
}
.date-apply-button:disabled { cursor: wait; opacity: .65; }
.date-range-status { flex-basis: 100%; margin-left: 63px; color: var(--muted); font-size: 8px; }
.date-range-status:empty { display: none; }
.date-range-status.is-error { color: var(--danger); }
.basis-control { display: grid; gap: 3px; }
.basis-help { max-width: 300px; color: var(--muted); font-size: 8px; line-height: 1.35; }
.filter-meta { margin-left: auto; display: flex; gap: 17px; color: var(--muted); font-size: 10px; }
.filter-meta strong { color: var(--ink); }

.page { display: none; min-width: 0; max-width: 100%; overflow-x: clip; }
.page.is-active { display: block; animation: page-in .18s ease-out; }
@keyframes page-in { from { opacity: .35; transform: translateY(3px); } to { opacity: 1; transform: none; } }

.health-banner {
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 12px 16px;
  border-left: 3px solid var(--primary);
  background: var(--primary-soft);
}
.health-main { display: flex; align-items: center; gap: 12px; }
.health-main > span:last-child { display: flex; flex-direction: column; }
.health-main strong { color: #174d36; font-size: 13px; }
.health-main small { margin-top: 3px; color: #527360; font-size: 11px; }
.health-icon { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; background: var(--primary); color: #fff; font-weight: 800; }
.text-button { border: 0; background: transparent; color: var(--primary); font-size: 11px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.text-button:hover { text-decoration: underline; }

.section-heading, .page-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin: 29px 0 14px;
}
.section-heading h2, .panel-head h2, .page-intro h2, .table-toolbar h2 { margin: 3px 0 0; font-size: 16px; line-height: 1.3; letter-spacing: 0; }
.section-note, .panel-context, .method-note { color: var(--muted); font-size: 10px; }
.page-intro { align-items: center; margin-top: 4px; }
.page-intro h2 { font-size: 22px; }
.page-intro p:last-child { margin: 6px 0 0; color: var(--muted); font-size: 12px; }

.kpi-grid { display: grid; grid-template-columns: repeat(6, minmax(128px, 1fr)); gap: 10px; }
.kpi-card {
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: 0 2px 8px rgba(23,34,27,.025);
}
.kpi-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 10px; }
.kpi-icon { color: var(--primary); font-size: 14px; }
.kpi-value { display: block; margin-top: 12px; font-size: clamp(22px, 2.4vw, 30px); line-height: 1; font-weight: 750; font-variant-numeric: tabular-nums; }
.kpi-value small { margin-left: 4px; color: var(--muted); font-size: 10px; font-weight: 500; }
.kpi-foot { display: flex; align-items: center; gap: 4px; margin-top: 9px; color: var(--muted); font-size: 9px; }
.delta-up { color: var(--primary); font-weight: 700; }
.delta-down { color: var(--danger); font-weight: 700; }

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(320px, .85fr); gap: 14px; margin-top: 14px; }
.dashboard-grid-wide { grid-template-columns: minmax(420px, .9fr) minmax(500px, 1.25fr); }
.insight-layout { grid-template-columns: minmax(480px, 1.5fr) minmax(320px, .75fr); }
.panel {
  min-width: 0;
  padding: 19px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
}
.panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }

.funnel { display: grid; gap: 7px; }
.funnel-row { display: grid; grid-template-columns: 72px 1fr 62px; align-items: center; gap: 9px; }
.funnel-label { color: var(--muted); font-size: 10px; }
.funnel-track { height: 20px; background: var(--surface-soft); overflow: hidden; }
.funnel-bar { height: 100%; min-width: 2px; display: flex; align-items: center; justify-content: flex-end; padding-right: 6px; background: var(--primary); color: #fff; font-size: 8px; transition: width .35s ease; }
.funnel-row:nth-child(2) .funnel-bar { opacity: .89; }
.funnel-row:nth-child(3) .funnel-bar { opacity: .78; }
.funnel-row:nth-child(4) .funnel-bar { opacity: .67; }
.funnel-row:nth-child(5) .funnel-bar { background: #95ae35; }
.funnel-row:nth-child(6) .funnel-bar { background: #668523; }
.funnel-value { font-size: 11px; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.funnel-foot { display: flex; justify-content: space-between; gap: 14px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.funnel-foot strong { color: var(--ink); }

.trend-chart svg { width: 100%; height: auto; display: block; overflow: visible; }
.trend-grid { stroke: var(--line); stroke-width: 1; }
.trend-axis { fill: var(--muted); font-size: 9px; }
.trend-line-primary, .trend-line-accent, .trend-line-blue { fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.trend-line-primary { stroke: var(--primary); }
.trend-line-accent { stroke: #92a929; }
.trend-line-blue { stroke: var(--blue); }
.trend-point { stroke: var(--surface); stroke-width: 2; }
.trend-line-primary-point { fill: var(--primary); }
.trend-line-accent-point { fill: #92a929; }
.trend-line-blue-point { fill: var(--blue); }
.chart-legend { display: flex; flex-wrap: wrap; gap: 12px; color: var(--muted); font-size: 9px; }
.chart-legend span { display: flex; align-items: center; gap: 5px; }
.legend-line { width: 14px; height: 2px; display: inline-block; }
.legend-line.is-primary { background: var(--primary); }
.legend-line.is-accent { background: #92a929; }
.legend-line.is-blue { background: var(--blue); }
.chart-takeaway { margin: 12px 0 0; padding-top: 10px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.chart-takeaway span { color: var(--primary); font-weight: 800; }
.chart-takeaway-warn span { color: var(--warning); }
.trend-cutoff { stroke: var(--warning); stroke-width: 1.5; stroke-dasharray: 4 4; }
.trend-cutoff-label { fill: var(--warning); font-size: 9px; }

.insight-list { display: grid; gap: 2px; }
.insight-compact { display: grid; grid-template-columns: 5px 1fr auto; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.insight-compact:last-child { border-bottom: 0; }
.insight-mark { width: 4px; border-radius: 2px; background: var(--warning); }
.insight-mark.critical { background: var(--danger); }
.insight-mark.opportunity { background: var(--primary); }
.insight-mark.observe { background: var(--line-strong); }
.insight-copy strong { display: block; font-size: 12px; line-height: 1.45; }
.insight-copy p { margin: 3px 0 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.insight-tag { align-self: start; padding: 3px 6px; border-radius: 3px; background: var(--warning-soft); color: var(--warning); font-size: 9px; font-weight: 700; }
.insight-tag.critical { background: var(--danger-soft); color: var(--danger); }
.insight-tag.opportunity { background: var(--primary-soft); color: var(--primary); }
.insight-tag.observe { background: #eef1ef; color: var(--muted); }

.donut-layout { display: flex; align-items: center; justify-content: center; gap: 30px; padding: 6px 0 8px; }
.donut { width: 122px; height: 122px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: var(--line-strong); position: relative; }
.donut::after { content: ""; position: absolute; width: 79px; height: 79px; border-radius: 50%; background: var(--surface); }
.donut-center { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }
.donut-center strong { font-size: 27px; }
.donut-center span { color: var(--muted); font-size: 9px; }
.donut-legend { display: grid; gap: 9px; min-width: 85px; }
.donut-legend span, .source-list span { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 10px; }
.donut-legend b { min-width: 20px; color: var(--ink); font-size: 12px; }
.dot { width: 7px; height: 7px; display: inline-block; flex: 0 0 auto; border-radius: 50%; background: var(--line-strong); }
.dot-good, .dot-primary { background: var(--primary); }
.dot-neutral { background: #aab6ad; }
.dot-accent { background: #92a929; }
.dot-observe { background: var(--line-strong); }
.dot-warning { background: var(--warning); }
.dot-danger { background: var(--danger); }
.dot-warn { background: var(--warning); }
.dot-bad { background: var(--danger); }
.dot-accent { background: #9dbb2e; }
.mini-divider { height: 1px; background: var(--line); }
.mini-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding-top: 14px; }
.mini-metrics span { display: flex; flex-direction: column; }
.mini-metrics small { color: var(--muted); font-size: 8px; }
.mini-metrics strong { margin-top: 4px; font-size: 14px; }
.is-bad { color: var(--danger) !important; }

.inline-stats { display: flex; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.inline-stats span { min-width: 100px; padding: 10px 14px; border-right: 1px solid var(--line); display: flex; flex-direction: column; }
.inline-stats span:last-child { border: 0; }
.inline-stats small { color: var(--muted); font-size: 9px; }
.inline-stats strong { margin-top: 4px; font-size: 15px; }

.stage-strip { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin: 22px 0 14px; }
.stage-card { padding: 12px 14px; border-top: 3px solid var(--primary); background: var(--surface); box-shadow: 0 2px 10px rgba(23,34,27,.035); }
.stage-card.warning { border-color: var(--warning); }
.stage-card.critical { border-color: var(--danger); }
.stage-card.observe { border-color: var(--line-strong); }
.stage-card span { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 9px; }
.stage-card strong { display: block; margin-top: 7px; font-size: 17px; }
.stage-card small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }

.table-panel { padding: 0; overflow: hidden; }
.conversion-panel { margin-top: 14px; }
.quick-reply-panel { margin-top: 14px; }
.quick-reply-table { min-width: 760px; }
.quick-reply-template-row td { border-top: 1px solid var(--line-strong); }
.quick-reply-action-row td:first-child { padding-left: 58px; }
.quick-reply-name { min-width: 240px; display: flex; align-items: center; gap: 8px; color: var(--ink); }
.quick-reply-name > span { color: var(--primary); font-size: 12px; }
.quick-reply-name strong { font-size: 10px; font-weight: 600; }
.email-conversion-table { min-width: 1450px; }
.wa-conversion-table { min-width: 1850px; }
.daily-detail-panel { margin-top: 14px; padding: 0; overflow: hidden; }
.daily-detail-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 19px 15px; border-bottom: 1px solid var(--line); }
.daily-detail-controls { display: flex; align-items: flex-end; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.month-segment { display: inline-flex; min-height: 34px; padding: 3px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface-soft); }
.month-segment button { min-width: 54px; padding: 5px 12px; border: 0; border-radius: 4px; background: transparent; color: var(--muted); font-size: 10px; font-weight: 700; cursor: pointer; }
.month-segment button.is-active { background: var(--primary); color: #fff; }
.daily-date-field { display: flex; flex-direction: column; gap: 3px; color: var(--muted); font-size: 8px; }
.daily-date-field input { width: 134px; min-height: 34px; padding: 0 8px; border: 1px solid var(--line-strong); border-radius: 5px; background: var(--surface); color: var(--ink); }
.daily-locate-button { min-height: 34px; padding: 0 11px; border: 1px solid var(--line-strong); border-radius: 5px; background: var(--surface); }
.daily-clear-button { width: 34px; height: 34px; }
.daily-detail-list { display: grid; }
.daily-node { border-bottom: 1px solid var(--line); }
.daily-node:last-child { border-bottom: 0; }
.daily-node-summary { width: 100%; min-height: 68px; display: grid; grid-template-columns: 30px minmax(210px, 1.45fr) repeat(5, minmax(82px, .7fr)); align-items: center; gap: 10px; padding: 11px 19px; border: 0; background: var(--surface); text-align: left; cursor: pointer; }
.daily-node-summary:hover { background: #f6faf7; }
.daily-node-summary[aria-expanded="true"] { background: var(--surface-soft); }
.daily-expand-icon { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 4px; color: var(--primary); font-size: 14px; font-weight: 700; }
.daily-node-summary[aria-expanded="true"] .daily-expand-icon { border-color: var(--primary); background: var(--primary); color: #fff; }
.daily-node-title { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.daily-node-title strong { overflow-wrap: anywhere; font-size: 11px; }
.daily-node-title small { color: var(--muted); font-size: 8px; }
.daily-summary-metric { display: flex; flex-direction: column; gap: 3px; text-align: right; }
.daily-summary-metric small { color: var(--muted); font-size: 8px; }
.daily-summary-metric strong { font-size: 12px; font-variant-numeric: tabular-nums; }
.daily-node-body { border-top: 1px solid var(--line); background: #fbfcfb; }
.daily-table { min-width: 1740px; }
.daily-table th { position: sticky; top: 0; z-index: 1; }
.daily-table th:first-child, .daily-table td:first-child { position: sticky; left: 0; z-index: 2; background: inherit; box-shadow: 1px 0 0 var(--line); }
.daily-table th:first-child { z-index: 3; background: var(--surface-soft); }
.daily-table tr.is-focused { background: #fff8c9; }
.daily-table tr.is-focused td:first-child { background: #fff8c9; }
.daily-table .zero-value { color: #9aa49d; }
.daily-detail-empty { padding: 24px 19px; color: var(--muted); font-size: 10px; }
.table-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 19px 14px; }
.table-actions { display: flex; align-items: center; gap: 8px; }
.search-field { min-height: 34px; display: flex; align-items: center; gap: 6px; padding: 0 9px; border: 1px solid var(--line-strong); border-radius: 5px; background: var(--surface); color: var(--muted); }
.search-field input { width: 180px; min-height: 30px; padding: 0; border: 0; }
.search-field input:focus { outline: 0; }
.table-wrap { overflow-x: auto; }
table { width: 100%; min-width: 870px; border-collapse: collapse; font-size: 10px; }
th { padding: 10px 12px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface-soft); color: var(--muted); font-size: 9px; font-weight: 700; text-align: right; white-space: nowrap; }
th:first-child, td:first-child { padding-left: 19px; text-align: left; }
th:last-child, td:last-child { padding-right: 19px; }
td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
tbody tr { cursor: pointer; }
tbody tr:hover { background: #f6faf7; }
.node-name { min-width: 220px; display: flex; align-items: center; gap: 9px; }
.stage-code { width: 5px; height: 30px; flex: 0 0 auto; border-radius: 2px; background: var(--primary); }
.stage-code.booked { background: var(--blue); }
.stage-code.absent { background: #8467b6; }
.stage-code.attended { background: var(--warning); }
.stage-code.paid { background: #6d7c72; }
.node-name span:last-child { display: flex; flex-direction: column; }
.node-name strong { font-size: 10px; }
.node-name small { margin-top: 2px; color: var(--muted); font-size: 8px; }
.metric-cell { min-width: 80px; }
.metric-cell > span { display: block; height: 3px; margin-top: 5px; background: var(--line); }
.metric-cell > span i { display: block; height: 100%; background: var(--primary); }
.metric-cell.warning > span i { background: var(--warning); }
.metric-cell.critical > span i { background: var(--danger); }
.status-label { display: inline-flex; align-items: center; gap: 5px; padding: 3px 7px; border-radius: 3px; background: var(--primary-soft); color: var(--primary); font-size: 8px; font-weight: 700; }
.status-label.critical { background: var(--danger-soft); color: var(--danger); }
.status-label.warning { background: var(--warning-soft); color: var(--warning); }
.status-label.observe { background: #eef1ef; color: #657269; }
.row-arrow { border: 0; background: transparent; color: var(--muted); cursor: pointer; }
.table-footer { display: flex; justify-content: space-between; gap: 20px; padding: 12px 19px; color: var(--muted); font-size: 9px; }
.table-footer-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; flex-wrap: wrap; text-align: right; }
.metric-stack { display: grid; gap: 6px; text-align: left; white-space: normal; }
.metric-stack span { display: block; min-width: 150px; }

.lifecycle-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.lifecycle-card { position: relative; min-width: 0; padding: 17px; border: 1px solid var(--line); background: var(--surface); }
.lifecycle-card::after { content: "→"; position: absolute; right: -16px; top: 50%; z-index: 2; width: 20px; color: var(--line-strong); text-align: center; }
.lifecycle-card:last-child::after { display: none; }
.lifecycle-card .step { color: var(--primary); font-size: 9px; font-weight: 800; }
.lifecycle-card h3 { margin: 9px 0 2px; font-size: 13px; }
.lifecycle-card > p { margin: 0; color: var(--muted); font-size: 9px; }
.lifecycle-value { display: flex; align-items: baseline; gap: 5px; margin-top: 17px; }
.lifecycle-value strong { font-size: 25px; }
.lifecycle-value span { color: var(--muted); font-size: 9px; }
.lifecycle-change { margin-top: 5px; color: var(--primary); font-size: 9px; }

.window-chart { display: grid; gap: 16px; padding: 6px 0; }
.window-row { display: grid; grid-template-columns: 145px 1fr 48px; align-items: center; gap: 10px; }
.window-row > span { color: var(--muted); font-size: 10px; }
.window-track { height: 14px; background: var(--surface-soft); }
.window-track i { display: block; height: 100%; background: var(--primary); }
.window-row strong { font-size: 10px; text-align: right; }
.attribution-bars { display: grid; gap: 17px; }
.attribution-bars > div > span { display: flex; justify-content: space-between; gap: 10px; }
.attribution-bars b { font-size: 10px; }
.attribution-bars em { color: var(--muted); font-size: 9px; font-style: normal; }
.attribution-bars > div > strong { float: right; margin-top: -13px; font-size: 10px; }
.attribution-bars i { height: 5px; display: block; clear: both; margin-top: 8px; background: var(--line); }
.attribution-bars u { display: block; height: 100%; background: var(--primary); text-decoration: none; }
.attribution-bars > div:nth-child(2) u { background: var(--warning); }
.attribution-bars > div:nth-child(3) u { background: #aab6ad; }
.source-list { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 22px; padding-top: 14px; border-top: 1px solid var(--line); }
.source-list strong { color: var(--ink); }

.insight-summary { display: flex; gap: 10px; }
.insight-summary span { padding: 9px 12px; border: 1px solid var(--line); background: var(--surface); color: var(--muted); font-size: 9px; }
.insight-summary strong { color: var(--ink); font-size: 13px; }
.insight-filter-row { display: flex; flex-wrap: wrap; gap: 7px; margin: 22px 0 12px; }
.chip { min-height: 32px; padding: 6px 12px; border: 1px solid var(--line-strong); border-radius: 5px; background: var(--surface); color: var(--muted); font-size: 10px; cursor: pointer; }
.chip.is-active { border-color: var(--primary); background: var(--primary); color: #fff; }
.full-insight-list { display: grid; gap: 10px; }
.insight-card { display: grid; grid-template-columns: 6px 1fr auto; gap: 16px; padding: 18px; border: 1px solid var(--line); background: var(--surface); }
.insight-card-line { border-radius: 3px; background: var(--warning); }
.insight-card.critical .insight-card-line { background: var(--danger); }
.insight-card.opportunity .insight-card-line { background: var(--primary); }
.insight-card.observe .insight-card-line { background: var(--line-strong); }
.insight-card-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.insight-card-head h3 { margin: 0; font-size: 13px; }
.insight-severity { padding: 3px 6px; border-radius: 3px; background: var(--warning-soft); color: var(--warning); font-size: 8px; font-weight: 800; }
.insight-card.critical .insight-severity { background: var(--danger-soft); color: var(--danger); }
.insight-card.opportunity .insight-severity { background: var(--primary-soft); color: var(--primary); }
.insight-card.observe .insight-severity { background: #eef1ef; color: var(--muted); }
.insight-card p { margin: 0 0 12px; color: var(--muted); font-size: 10px; line-height: 1.55; }
.insight-evidence { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.insight-evidence span { color: var(--muted); font-size: 9px; }
.insight-evidence strong { color: var(--ink); }
.insight-action { min-width: 210px; align-self: center; padding: 12px; background: var(--surface-soft); }
.insight-action small { color: var(--muted); font-size: 8px; }
.insight-action p { margin: 5px 0 10px; color: var(--ink); }
.insight-action button { width: 100%; min-height: 30px; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--surface); color: var(--primary); font-size: 9px; font-weight: 700; cursor: pointer; }
.insight-action button:hover { border-color: var(--primary); }

.quality-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 22px 0 14px; }
.quality-card { padding: 16px; border: 1px solid var(--line); background: var(--surface); }
.quality-card span { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 9px; }
.quality-card i { width: 8px; height: 8px; border-radius: 50%; background: var(--primary); }
.quality-card strong { display: block; margin-top: 10px; font-size: 22px; }
.quality-card small { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; }
.quality-layout { grid-template-columns: minmax(420px, 1.05fr) minmax(420px, .95fr); }
.run-timeline { margin: 0; padding: 0; list-style: none; }
.run-step { position: relative; display: grid; grid-template-columns: 54px 20px 1fr auto; gap: 9px; align-items: start; padding-bottom: 16px; }
.run-step:last-child { padding-bottom: 0; }
.run-step::after { content: ""; position: absolute; left: 63px; top: 17px; bottom: 0; width: 1px; background: var(--line); }
.run-step:last-child::after { display: none; }
.run-step time { color: var(--muted); font-size: 9px; }
.run-step .step-dot { position: relative; z-index: 1; width: 15px; height: 15px; display: grid; place-items: center; border-radius: 50%; background: var(--primary); color: #fff; font-size: 8px; }
.run-step strong { display: block; font-size: 10px; }
.run-step p { margin: 3px 0 0; color: var(--muted); font-size: 9px; }
.run-step > small { color: var(--muted); font-size: 8px; }
.source-manifest { display: grid; gap: 1px; }
.source-row { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }
.source-row:last-child { border: 0; }
.source-row span { display: flex; flex-direction: column; }
.source-row strong { font-size: 10px; }
.source-row small { margin-top: 2px; color: var(--muted); font-size: 8px; }
.source-row > em { color: var(--muted); font-size: 9px; font-style: normal; }
.source-row > i { color: var(--primary); font-size: 10px; font-style: normal; font-weight: 700; }
.source-row.is-blocked > i { color: var(--danger); }
.source-row.is-blocked strong { color: var(--danger); }
.compact-source-list .source-row { grid-template-columns: 1fr auto; }
.compact-source-list .source-row > em { display: none; }

.is-hidden { display: none !important; }
#health-banner:not(.is-complete), .source-blocker {
  border-left-color: var(--warning);
  background: var(--warning-soft);
}
#health-banner:not(.is-complete) .health-icon, .source-blocker .health-icon { background: var(--warning); }
#health-banner:not(.is-complete) .health-main strong, .source-blocker .health-main strong { color: #75470f; }
#health-banner:not(.is-complete) .health-main small, .source-blocker .health-main small { color: #815d32; }
.payment-grid { grid-template-columns: repeat(3, 1fr); margin-bottom: 14px; }
.payment-note { margin-top: 14px; }
#view-payment > .table-panel { margin-top: 14px; }
.empty-state { padding: 24px; color: var(--muted); text-align: center !important; }
.run-step.is-blocked .step-dot { background: var(--danger); }
.run-step.is-blocked > small { color: var(--danger); font-weight: 700; }
.empty-evidence { padding: 18px; background: var(--surface-soft); }
.empty-evidence strong { display: block; font-size: 13px; }
.empty-evidence p { margin: 8px 0 12px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.empty-evidence code { color: var(--primary); font-size: 10px; overflow-wrap: anywhere; }

.node-dialog {
  width: min(680px, calc(100% - 30px));
  max-height: 85vh;
  padding: 0;
  border: 0;
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 22px 70px rgba(10,22,15,.3);
}
.node-dialog::backdrop { background: rgba(12,23,17,.55); }
.dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; padding: 20px; border-bottom: 1px solid var(--line); }
.dialog-head h2 { margin: 4px 0 0; font-size: 17px; }
.dialog-head button { width: 30px; height: 30px; border: 0; border-radius: 4px; background: var(--surface-soft); cursor: pointer; font-size: 20px; }
#dialog-content { padding: 20px; }
.dialog-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.dialog-metrics span { padding: 10px; background: var(--surface-soft); display: flex; flex-direction: column; }
.dialog-metrics small { color: var(--muted); font-size: 8px; }
.dialog-metrics strong { margin-top: 5px; font-size: 15px; }
.evidence-title { margin: 20px 0 9px; font-size: 11px; }
.evidence-list { display: grid; gap: 7px; }
.evidence-row { display: grid; grid-template-columns: 125px 1fr auto; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: 9px; }
.evidence-row time, .evidence-row small { color: var(--muted); }
.dialog-rule { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.6; }
.dialog-rule strong { color: var(--ink); }

.run-toast {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 50;
  min-width: 280px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid #345244;
  border-radius: var(--radius);
  background: var(--nav);
  color: #fff;
  box-shadow: 0 14px 40px rgba(10,22,15,.3);
  opacity: 0;
  transform: translateY(15px);
  pointer-events: none;
  transition: .2s ease;
}
.run-toast.is-visible { opacity: 1; transform: none; }
.run-toast span:last-child { display: flex; flex-direction: column; }
.run-toast strong { font-size: 11px; }
.run-toast small { margin-top: 3px; color: #aabbb1; font-size: 9px; }
.spinner { width: 19px; height: 19px; border: 2px solid rgba(255,255,255,.2); border-top-color: var(--accent); border-radius: 50%; animation: spin .8s linear infinite; }
.spinner.is-complete { display: grid; place-items: center; border: 0; animation: none; color: var(--accent); font-weight: 800; }
@keyframes spin { to { transform: rotate(360deg); } }

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

@media (max-width: 1180px) {
  .kpi-grid { grid-template-columns: repeat(3, 1fr); }
  .dashboard-grid-wide, .insight-layout, .quality-layout { grid-template-columns: 1fr; }
  .stage-strip { grid-template-columns: repeat(3, 1fr); }
  .lifecycle-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 860px) {
  :root { --sidebar: 0px; }
  .sidebar { width: 244px; transform: translateX(-100%); transition: transform .2s ease; }
  .sidebar.is-open { transform: translateX(0); }
  .main-shell { margin-left: 0; }
  .mobile-menu { display: grid; }
  .topbar { justify-content: flex-start; }
  .topbar-actions { margin-left: auto; }
  .freshness, .demo-pill { display: none; }
  .filterbar { align-items: flex-end; gap: 10px; overflow: visible; padding-bottom: 12px; }
  .filterbar label { flex-direction: column; align-items: flex-start; gap: 4px; }
  .date-range-control { width: 100%; min-width: 0; }
  .basis-control { align-self: stretch; }
  .basis-control label { flex-direction: column; align-items: flex-start; }
  .filter-meta { display: none; }
  .lifecycle-grid { grid-template-columns: repeat(2, 1fr); }
  .lifecycle-card::after { display: none; }
  .quality-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 620px) {
  main { padding-inline: 14px; }
  .topbar { padding-inline: 14px; }
  .filterbar { flex-wrap: wrap; overflow: visible; padding-block: 12px; }
  .filterbar label { min-width: calc(50% - 6px); }
  .filterbar label select { width: 100%; }
  .date-range-control { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto; gap: 5px; }
  .date-range-control label { min-width: 0; flex-direction: column; align-items: flex-start; }
  .date-range-control input { width: 100%; min-width: 0; }
  .date-range-status { grid-column: 1 / -1; margin-left: 0; }
  .kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .panel { padding: 15px; }
  .table-panel { padding: 0; }
  .funnel-row { grid-template-columns: 60px 1fr 52px; }
  .health-banner, .section-heading, .page-intro, .table-toolbar { align-items: flex-start; flex-direction: column; }
  .health-banner .text-button { align-self: flex-end; }
  .inline-stats { width: 100%; }
  .inline-stats span { min-width: 0; flex: 1; padding-inline: 9px; }
  .stage-strip { grid-template-columns: 1fr 1fr; }
  .table-actions { width: 100%; flex-direction: column; align-items: stretch; }
  .search-field input { width: 100%; }
  .lifecycle-grid { grid-template-columns: 1fr; }
  .window-row { grid-template-columns: 118px 1fr 42px; }
  .insight-card { grid-template-columns: 5px 1fr; }
  .insight-action { grid-column: 2; min-width: 0; }
  .dialog-metrics { grid-template-columns: repeat(2, 1fr); }
  .evidence-row { grid-template-columns: 92px 1fr; }
  .evidence-row small { grid-column: 2; }
  .run-toast { left: 14px; right: 14px; bottom: 14px; min-width: 0; }
}

.category-row {
  background: var(--surface-soft);
}

.category-row td {
  border-top: 1px solid var(--line-strong);
  font-weight: 700;
}

.category-name {
  display: flex;
  align-items: center;
  gap: 9px;
}

.category-name > span {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.category-name small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 500;
}

.accordion-toggle {
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid var(--line-strong);
  border-radius: 4px;
  background: var(--surface);
  color: var(--primary);
  cursor: pointer;
  font-weight: 800;
}

.node-detail-row td:first-child { padding-left: 24px; }
.node-detail-row:hover { background: var(--primary-soft); }

.test-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}

.test-card { min-width: 0; }
.test-card .panel-head > div, .test-card .panel-head h2 { min-width: 0; overflow-wrap: anywhere; }
.test-card table { min-width: 0; table-layout: fixed; }
.test-card th, .test-card td { padding-inline: 6px; font-size: 8px; }
.test-card th, .test-card td { white-space: normal; overflow-wrap: anywhere; }
.test-card th:first-child, .test-card td:first-child { padding-left: 6px; }
.test-card th:last-child, .test-card td:last-child { padding-right: 6px; }
.test-card th small {
  display: block;
  margin-top: 3px;
  color: rgba(255,255,255,.72);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 7px;
  font-weight: 500;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.data-pending { color: var(--warning); font-size: 8px; font-weight: 700; }
.launch-note {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 7px;
  margin: -4px 0 14px;
  padding: 10px 12px;
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 9px;
}
.launch-note span { color: var(--muted); }
.test-purpose { margin: -5px 0 12px; color: var(--muted); font-size: 9px; line-height: 1.6; }
.test-outcome-coverage { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: -2px 0 12px; padding: 8px 10px; background: var(--surface-soft); font-size: 8px; }
.test-outcome-coverage span { color: var(--muted); }
.test-outcome-coverage strong { font-size: 8px; text-align: right; }
.test-decision {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: 10px;
}
.test-decision span { color: var(--muted); }

.audience-layout { grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); }
.profile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 22px; }
.profile-block { display: grid; gap: 8px; }
.profile-block > strong { font-size: 10px; }
.profile-block > span { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; padding: 4px 0; overflow: hidden; }
.profile-block > span i { position: absolute; inset: auto auto 0 0; height: 2px; background: var(--primary); }
.profile-block em, .profile-block b { position: relative; font-size: 8px; font-style: normal; font-weight: 500; }
.profile-block b { color: var(--muted); }
.behavior-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--line); }
.behavior-grid > span { display: grid; padding: 14px; background: var(--surface); }
.behavior-grid small { color: var(--muted); font-size: 8px; }
.behavior-grid strong { margin-top: 6px; font-size: 20px; }
.behavior-grid em { color: var(--muted); font-size: 8px; font-style: normal; }
.behavior-grid p { grid-column: 1 / -1; margin: 0; padding: 10px; background: var(--surface); color: var(--muted); font-size: 8px; line-height: 1.5; }
.segment-panel { margin-top: 14px; }
.segment-list { display: grid; gap: 11px; }
.segment-list > div { display: grid; grid-template-columns: 150px minmax(0, 1fr) 60px; align-items: center; gap: 12px; }
.segment-list span { display: flex; justify-content: space-between; gap: 8px; font-size: 9px; }
.segment-list span small { color: var(--muted); }
.segment-list > div > i { height: 7px; overflow: hidden; border-radius: 4px; background: var(--line); }
.segment-list > div > i b { display: block; height: 100%; background: var(--primary); }
.segment-list em { color: var(--muted); font-size: 9px; font-style: normal; text-align: right; }

@media (max-width: 1100px) {
  .test-grid, .audience-layout { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .profile-grid { grid-template-columns: 1fr; }
  .segment-list > div { grid-template-columns: 110px minmax(0, 1fr) 46px; }
  .test-card .panel-head { flex-direction: column; gap: 8px; }
  .test-decision { align-items: flex-start; flex-direction: column; }
}

.trend-bar-primary { fill: var(--primary); opacity: .82; }
.trend-dot-accent { fill: #92a929; stroke: var(--surface); stroke-width: 2; }
.trend-axis-accent { fill: #70851d; }

.stage-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.stage-meta span {
  padding: 3px 6px;
  border-radius: 3px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 8px;
}

.reconcile-list { display: grid; }
.reconcile-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
}
.reconcile-row:last-child { border-bottom: 0; }
.reconcile-row span { display: flex; min-width: 0; flex-direction: column; }
.reconcile-row strong { font-size: 10px; }
.reconcile-row small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.reconcile-row b { color: var(--primary); font-size: 18px; font-variant-numeric: tabular-nums; white-space: nowrap; }

.source-category {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 3px 7px;
  border-radius: 3px;
  background: #eef1ef;
  color: var(--muted);
  font-size: 8px;
  font-weight: 700;
}
.source-category.wa { background: var(--primary-soft); color: var(--primary); }
.source-category.email { background: var(--blue-soft); color: var(--blue); }
.source-category.website { background: #edf3dd; color: #62761c; }
.source-category.banner { background: var(--warning-soft); color: var(--warning); }
.source-category.empty, .source-category.unknown { background: var(--danger-soft); color: var(--danger); }
td code { color: var(--primary); font-size: 9px; }
.cell-note { display: block; margin-top: 3px; color: var(--muted); font-size: 8px; }
tbody tr { cursor: default; }

#cohort-stage-strip { grid-template-columns: repeat(4, 1fr); }
.accounting-panel { margin: 0 0 14px; }
.cohort-reconciliation { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; border: 1px solid var(--line); background: var(--line); }
.accounting-card { min-width: 0; padding: 16px; background: var(--surface); }
.accounting-card.is-total { background: var(--primary-soft); }
.accounting-card > span { color: var(--muted); font-size: 9px; font-weight: 700; }
.accounting-card > strong { display: block; margin-top: 7px; color: var(--ink); font-size: 24px; font-variant-numeric: tabular-nums; }
.accounting-card > strong small { margin-left: 4px; color: var(--muted); font-size: 9px; }
.accounting-card > b { display: block; margin-top: 2px; color: var(--primary); font-size: 11px; font-variant-numeric: tabular-nums; }
.accounting-card > p { margin: 7px 0 0; color: var(--muted); font-size: 9px; line-height: 1.45; }
.accounting-note { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; padding: 10px 12px; background: var(--surface-soft); color: var(--muted); font-size: 9px; }
.accounting-note > span { color: var(--primary); font-size: 15px; }
.accounting-note strong { color: var(--ink); font-weight: 600; }
.package-list { display: grid; gap: 2px; }
.package-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 88px 56px;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.package-row:last-child { border-bottom: 0; }
.package-row > span { display: flex; min-width: 0; flex-direction: column; }
.package-row strong { overflow-wrap: anywhere; font-size: 9px; line-height: 1.45; }
.package-row small { margin-top: 3px; color: var(--muted); font-size: 8px; font-weight: 500; }
.package-row > b { font-size: 10px; text-align: right; }
.package-row > b small { color: var(--muted); font-size: 8px; }
.package-share { height: 6px; overflow: hidden; border-radius: 3px; background: var(--line); }
.package-share i { display: block; height: 100%; background: var(--primary); }

.source-row { min-width: 0; }
.source-row span { min-width: 0; }
.source-row strong, .source-row small { overflow-wrap: anywhere; }
.source-row.is-limited > i { color: var(--warning); }
.source-row.is-limited strong { color: #75470f; }

.rule-panel { margin-top: 14px; }
#view-cohort .dashboard-grid-wide { grid-template-columns: 1fr; }
.rule-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); }
.rule-item {
  min-width: 0;
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 10px;
  padding: 14px;
  background: var(--surface);
}
.rule-item > span { color: var(--primary); font-size: 9px; font-weight: 800; }
.rule-item strong { display: block; font-size: 10px; }
.rule-item p { margin: 5px 0 0; color: var(--muted); font-size: 9px; line-height: 1.55; }

@media (max-width: 1180px) {
  .rule-grid { grid-template-columns: repeat(2, 1fr); }
  .daily-node-summary { grid-template-columns: 30px minmax(190px, 1.2fr) repeat(5, minmax(72px, .6fr)); }
}

@media (max-width: 620px) {
  #cohort-stage-strip, .rule-grid, .cohort-reconciliation { grid-template-columns: 1fr; }
  .package-row { grid-template-columns: minmax(0, 1fr) 68px 48px; }
  .source-row { grid-template-columns: minmax(0, 1fr) auto; }
  .source-row > em { display: none; }
  .daily-detail-toolbar { align-items: stretch; flex-direction: column; }
  .daily-detail-controls { justify-content: flex-start; }
  .daily-date-field { flex: 1 1 130px; }
  .daily-date-field input { width: 100%; }
  .daily-node-summary { grid-template-columns: 28px minmax(0, 1fr) repeat(2, minmax(62px, auto)); gap: 8px; padding: 12px 14px; }
  .daily-summary-metric:nth-child(n+5) { display: none; }
}