/* ============================================================
   Sense Lab · Dr. S. Lee Life Sciences design identity
   Multi-page workspace (home, inquiries, assistant, knowledge,
   projects, admin). Co-brandable with each deployment's customer.
   ============================================================ */

:root {
  /* Dr. Lee palette */
  --navy:       #1F4E79;
  --navy-deep:  #173E5F;
  --gold:       #C9A961;
  --gold-soft:  #D4B879;
  --gold-tint:  #F4ECD9;
  --cream:      #E8DCC4;
  --off-white:  #FAFAF7;
  --paper:      #F5F3EE;
  --paper-2:    #EFEAD9;
  --text-dark:  #2A2A26;
  --text-med:   #4A4A45;
  --text-light: #5A5A54;
  --text-faint: #8B8B83;
  --border:     #E5DFD0;
  --border-soft:#EFEAD9;

  /* Customer accent (per-deployment override; default is neutral teal) */
  --seq:        #008d69;
  --seq-soft:   #4DAD8F;

  /* Status colors */
  --good:       #2E5C2E;
  --good-bg:    #E8F0E8;
  --good-bd:    #BBD0BB;
  --warn:       #8B5A1A;
  --warn-bg:    #FBF1E5;
  --warn-bd:    #E6CDA8;

  --serif: Georgia, 'Times New Roman', serif;
  --sans:  -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --mono:  ui-monospace, 'SF Mono', Consolas, 'Courier New', monospace;

  --radius:    6px;
  --radius-sm: 4px;
  --shadow-sm: 0 1px 2px rgba(31, 78, 121, 0.04);
  --shadow-md: 0 2px 8px rgba(31, 78, 121, 0.07);
  --shadow-lg: 0 8px 24px rgba(31, 78, 121, 0.12);

  --topbar-h:  64px;
  --sidebar-w: 220px;
  --sidebar-w-collapsed: 56px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
.hidden { display: none !important; }
button { font-family: inherit; cursor: pointer; }
input, textarea, select { font-family: inherit; font-size: inherit; color: inherit; }
a { color: var(--navy); }

html, body {
  height: 100%;
  background: var(--off-white);
  color: var(--text-dark);
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

body { display: flex; flex-direction: column; }

/* ============================================================
   TOPBAR (co-branding)
   ============================================================ */
.topbar {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 32px;
  align-items: center;
  height: var(--topbar-h);
  padding: 0 28px;
  background: #fff;
  border-bottom: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
  flex-shrink: 0;
}

.brand-block {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

/* Hamburger toggle (sidebar collapse / mobile drawer trigger) */
.nav-toggle {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  width: 36px;
  height: 36px;
  padding: 8px 8px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  transition: background 0.12s, border-color 0.12s;
  flex-shrink: 0;
}
.nav-toggle:hover { background: var(--paper); border-color: var(--border); }
.nav-toggle-bar {
  display: block;
  width: 18px;
  height: 2px;
  background: var(--text-med);
  border-radius: 1px;
  transition: transform 0.18s ease, opacity 0.18s ease;
}
body.nav-collapsed .nav-toggle-bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
body.nav-collapsed .nav-toggle-bar:nth-child(2) { opacity: 0; }
body.nav-collapsed .nav-toggle-bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.dl-mark {
  width: 22px;
  height: 40px;
  color: var(--navy);
  flex-shrink: 0;
}
.brand-text { display: flex; flex-direction: column; gap: 1px; }
.brand-name {
  font-family: var(--serif);
  font-size: 22px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -0.005em;
}
.brand-name .brand-year {
  margin-left: 5px;
  font-family: var(--mono);
  font-size: 13px;
  color: var(--gold);
  font-weight: 700;
  vertical-align: 2px;
}
.brand-by {
  font-size: 9.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 600;
}

/* For-customer block (co-branding placeholder, customer-specific per deployment) */
.for-block {
  display: flex;
  align-items: center;
  gap: 14px;
  justify-content: center;
}
.for-label {
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 600;
}
.customer-name {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-dark);
  letter-spacing: 0.01em;
  padding: 4px 12px;
  border: 1px dashed var(--border);
  border-radius: 6px;
  background: var(--off-white);
}
/* Back-compat for any deployment that still ships an <img class="seq-logo"> */
.seq-logo {
  height: 36px;
  width: auto;
  display: block;
}

.user-area { position: relative; justify-self: end; }
.user-block {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--text-med);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  padding: 4px 8px 4px 12px;
  transition: border-color 0.12s, background 0.12s;
  cursor: pointer;
}
.user-block:hover { background: var(--paper); border-color: var(--border); }
.user-text {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1px;
  text-align: right;
}
.user-name {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--navy);
  font-weight: 700;
}
.user-role {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--text-light);
}
.user-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--navy);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--serif);
  font-size: 12px;
  font-weight: 700;
}
.role-caret {
  font-size: 11px;
  color: var(--text-faint);
  margin-left: 2px;
}

/* Tier pill */
.role-tier-pill {
  display: inline-block;
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: 3px;
  font-weight: 700;
}
.role-tier-pill.junior { background: var(--paper); color: var(--text-med); border: 1px solid var(--border); }
.role-tier-pill.senior { background: var(--gold-tint); color: var(--navy-deep); border: 1px solid var(--gold-soft); }
.role-tier-pill.ceo    { background: var(--navy); color: #fff; }

/* Role dropdown */
.role-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  min-width: 320px;
  z-index: 50;
  padding: 6px;
  border-top: 3px solid var(--gold);
}
.role-dd-head {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  padding: 8px 12px 6px;
}
.role-dropdown ul { list-style: none; display: flex; flex-direction: column; gap: 1px; }
.role-dropdown li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background 0.12s;
}
.role-dropdown li:hover { background: var(--paper); }
.role-dropdown li.active { background: var(--gold-tint); }
.rdl-text { display: flex; flex-direction: column; gap: 1px; }
.rdl-name { font-family: var(--serif); font-size: 13.5px; color: var(--navy); font-weight: 700; }
.rdl-title { font-size: 11.5px; color: var(--text-light); }

/* ============================================================
   SHELL: sidebar + page area
   ============================================================ */
.shell {
  flex: 1;
  display: grid;
  grid-template-columns: var(--sidebar-w) 1fr;
  min-height: 0;
}

/* Sidebar */
.sidebar {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 16px 12px;
  background: #fff;
  border-right: 1px solid var(--border);
  position: sticky;
  top: var(--topbar-h);
  align-self: start;
  height: calc(100vh - var(--topbar-h));
  overflow-y: auto;
}
.nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: var(--radius-sm);
  color: var(--text-med);
  text-decoration: none;
  font-size: 13.5px;
  font-weight: 500;
  transition: background 0.12s, color 0.12s;
  position: relative;
}
.nav-item:hover { background: var(--paper); color: var(--navy); }
.nav-item.active {
  background: var(--gold-tint);
  color: var(--navy);
  font-weight: 700;
}
.nav-item.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 3px;
  background: var(--gold);
  border-radius: 0 2px 2px 0;
}
.nav-glyph {
  font-family: var(--serif);
  font-size: 16px;
  color: var(--gold);
  width: 18px;
  text-align: center;
}
.nav-svg {
  display: inline-block;
  vertical-align: -2px;
}
.nav-item.active .nav-glyph { color: var(--navy); }
.nav-item-hidden { display: none !important; }
.nav-label { flex: 1; }
.nav-badge {
  font-family: var(--mono);
  font-size: 10px;
  background: var(--paper-2);
  color: var(--text-light);
  padding: 1px 7px;
  border-radius: 10px;
  font-weight: 700;
}
.nav-item.active .nav-badge { background: var(--gold); color: #fff; }
.nav-spacer { flex: 1; min-height: 24px; }
.nav-foot {
  padding: 12px;
  border-top: 1px solid var(--border-soft);
}
.nav-foot-line {
  font-size: 11px;
  color: var(--text-faint);
}
.nav-foot-line.mono { font-family: var(--mono); font-size: 10px; margin-top: 2px; }

/* Page */
.page {
  padding: 28px 36px 60px;
  max-width: 1320px;
  width: 100%;
  margin: 0 auto;
  min-height: 0;
}

/* ============================================================
   PAGE HEAD (shared)
   ============================================================ */
.page-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 24px;
}
.page-num {
  font-family: var(--serif);
  font-size: 14px;
  color: var(--gold);
  font-weight: 700;
  letter-spacing: 0.08em;
}
.page-head h1 {
  font-family: var(--serif);
  font-size: 28px;
  font-weight: 400;
  color: var(--navy);
  margin: 4px 0 6px;
  line-height: 1.2;
}
.page-sub {
  font-family: var(--serif);
  font-size: 14.5px;
  color: var(--text-light);
  font-style: italic;
  max-width: 720px;
}
.page-actions { display: flex; gap: 10px; flex-shrink: 0; }

/* Stage breadcrumb: workflow progress at top of Workspace / Quotes / Approvals.
   Appended into .page-head from the page init.                                */
.stage-breadcrumb {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
  padding: 6px 12px;
  background: rgba(239, 234, 217, 0.55);
  border: 1px solid var(--border);
  border-radius: 18px;
  align-self: center;
  flex-shrink: 0;
}
.stage-bc-step {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.03em;
  border-radius: 12px;
  color: var(--text-faint);
}
.stage-bc-dot { font-size: 11px; line-height: 1; }
.stage-bc-label { font-weight: 600; }
.stage-bc-sep { color: var(--text-faint); font-size: 10px; opacity: 0.6; }
.stage-bc-past {
  color: #2f5b3e;
}
.stage-bc-past .stage-bc-dot { color: #2f5b3e; }
.stage-bc-active {
  color: var(--navy-deep);
  background: rgba(196, 160, 76, 0.18);
  font-weight: 700;
}
.stage-bc-active .stage-bc-dot { color: var(--gold); }
.stage-bc-future {
  color: var(--text-faint);
  opacity: 0.6;
}

/* ============================================================
   BUTTONS (shared)
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s, border-color 0.15s, transform 0.05s;
}
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--navy); color: #fff; border-color: var(--navy); }
.btn-primary:hover { background: var(--navy-deep); border-color: var(--navy-deep); }
.btn-ghost { background: #fff; color: var(--navy); border-color: var(--border); }
.btn-ghost:hover { background: var(--paper); border-color: var(--gold); }
.btn-text { background: transparent; color: var(--text-faint); border-color: transparent; text-decoration: underline; text-underline-offset: 2px; }
.btn-text:hover { color: var(--navy); }

/* ============================================================
   CARDS (shared)
   ============================================================ */
.card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}
.card-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding: 18px 22px 14px;
  border-bottom: 1px solid var(--border-soft);
}
.card-head h3 {
  font-family: var(--serif);
  font-size: 16px;
  color: var(--navy);
  font-weight: 700;
}
.card-link {
  font-size: 12px;
  color: var(--gold);
  font-weight: 600;
  text-decoration: none;
}
.card-link:hover { text-decoration: underline; }

.empty-card {
  padding: 36px 28px;
  background: var(--paper);
}
.empty-card h3 {
  font-family: var(--serif);
  color: var(--navy);
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 8px;
}
.empty-card p {
  font-size: 14px;
  color: var(--text-med);
  max-width: 660px;
  line-height: 1.6;
}

/* Generic list inside cards */
.list { list-style: none; }
.list li {
  padding: 12px 22px;
  border-bottom: 1px solid var(--border-soft);
  font-size: 13.5px;
  color: var(--text-dark);
  display: flex;
  align-items: center;
  gap: 12px;
}
.list li:last-child { border-bottom: none; }
.list .li-title { flex: 1; font-weight: 500; }
.list .li-meta { font-family: var(--mono); font-size: 11px; color: var(--text-faint); }
.list .li-status {
  font-family: var(--mono);
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.li-status.new      { background: var(--gold-tint); color: var(--navy); }
.li-status.draft    { background: var(--paper); color: var(--text-med); border: 1px solid var(--border); }
.li-status.ready    { background: var(--good-bg); color: var(--good); border: 1px solid var(--good-bd); }
.li-status.urgent   { background: var(--warn-bg); color: var(--warn); border: 1px solid var(--warn-bd); }

/* ============================================================
   HOME PAGE
   ============================================================ */
.kpi-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 24px;
}
.kpi {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 20px;
  box-shadow: var(--shadow-sm);
}
.kpi-num {
  font-family: var(--serif);
  font-size: 28px;
  color: var(--navy);
  font-weight: 700;
  line-height: 1;
}
.kpi-lab {
  font-size: 11.5px;
  color: var(--text-faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 600;
  margin-top: 6px;
}
.home-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

/* Charts row */
.home-charts {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 20px;
  margin-bottom: 20px;
}
.chart-card .card-head {
  padding: 16px 22px 10px;
}
.card-meta {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text-faint);
  letter-spacing: 0.04em;
}
.chart-body { padding: 16px 22px 20px; }

/* Bar chart (inquiry trend) */
.bar-chart {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 8px;
  align-items: end;
  height: 160px;
  padding: 4px 0;
  border-bottom: 1px solid var(--border-soft);
}
.bar-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  justify-content: flex-end;
  gap: 6px;
}
.bar-pair {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 100%;
  width: 100%;
  justify-content: center;
}
.bar {
  flex: 1;
  max-width: 14px;
  background: var(--gold);
  border-radius: 2px 2px 0 0;
  position: relative;
  transition: height 0.7s cubic-bezier(0.34, 1.2, 0.64, 1);
  min-height: 2px;
}
.bar.bar-received { background: var(--gold); }
.bar.bar-quoted   { background: var(--good); }
.bar-val {
  position: absolute;
  top: -16px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  font-weight: 700;
  opacity: 0;
  transition: opacity 0.3s 0.4s;
}
.bar:hover .bar-val { opacity: 1; }
.bar-label {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  letter-spacing: 0.04em;
}
.trend-legend {
  display: flex;
  gap: 18px;
  margin-top: 14px;
  font-size: 11.5px;
  color: var(--text-light);
}
.legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.dot {
  width: 10px;
  height: 10px;
  border-radius: 2px;
  display: inline-block;
}
.dot-gold { background: var(--gold); }
.dot-good { background: var(--good); }

/* Service breakdown horizontal bars */
.service-bars { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.service-bars li {
  display: grid;
  grid-template-columns: 130px 1fr 36px 26px;
  gap: 10px;
  align-items: center;
  font-size: 12.5px;
}
.sb-name { color: var(--text-dark); font-weight: 500; }
.sb-track {
  height: 8px;
  background: var(--paper);
  border-radius: 999px;
  overflow: hidden;
  position: relative;
}
.sb-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--gold) 0%, var(--gold-soft) 100%);
  border-radius: 999px;
  transition: width 0.8s cubic-bezier(0.34, 1.2, 0.64, 1);
}
.sb-pct {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--navy);
  font-weight: 700;
  text-align: right;
}
.sb-count {
  font-family: var(--mono);
  font-size: 10.5px;
  color: var(--text-faint);
  text-align: right;
}

/* ============================================================
   INQUIRIES PAGE
   ============================================================ */
.inquiry-list {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  margin-bottom: 28px;
}
.inquiry-list ul { list-style: none; }
.inquiry-list li {
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  gap: 16px;
  align-items: center;
  padding: 14px 22px;
  border-bottom: 1px solid var(--border-soft);
  cursor: pointer;
  transition: background 0.12s;
}
.inquiry-list li:hover { background: var(--paper); }
.inquiry-list li:last-child { border-bottom: none; }
.iq-title {
  font-weight: 600;
  font-size: 14px;
  color: var(--text-dark);
}
.iq-from {
  font-size: 12px;
  color: var(--text-light);
  margin-top: 2px;
}
.iq-time { font-family: var(--mono); font-size: 11px; color: var(--text-faint); }

/* Inquiry workspace */
.inquiry-workspace {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  overflow: hidden; /* preserve the rounded corners over child backgrounds */
}
.iw-grid {
  display: grid;
  /* minmax(0, 1fr) on the right column keeps it from expanding past
     the workspace card when a wide table (Knowledge matrix or Pricing
     comparable matrix) lives inside — the inner overflow-x scroll
     takes over instead of pushing the pane wider. */
  grid-template-columns: 360px minmax(0, 1fr);
  align-items: stretch; /* both panes paint the full row height */
}
.iw-pane {
  padding: 0;
  min-height: 100%;     /* fill the grid cell so the pane background extends
                           when the other side's collapsibles open the row */
  min-width: 0;         /* needed alongside minmax(0, 1fr) to allow shrink */
}
.iw-input { padding: 22px; border-right: 1px solid var(--border-soft); }
.iw-results { min-height: 580px; }
.iw-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 18px 24px 14px;
  border-bottom: 1px solid var(--border-soft);
}
.iw-input .iw-head { padding: 0 0 12px; border-bottom: 1px solid var(--border-soft); margin-bottom: 14px; }
.iw-num {
  font-family: var(--serif);
  font-size: 14px;
  color: var(--gold);
  font-weight: 700;
}
.iw-num-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  color: var(--gold);
}
.iw-num-icon svg { width: 16px; height: 16px; }
.iw-head h2 {
  font-family: var(--serif);
  font-size: 15px;
  color: var(--navy);
  font-weight: 700;
}
.results-meta {
  margin-left: auto;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text-faint);
}

/* Inquiry input */
.inquiry-source { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.src-label { font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-faint); font-weight: 700; }
.src-display {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-family: var(--sans);
  font-weight: 600;
  color: var(--navy-deep);
  padding: 2px 8px;
  background: rgba(255,255,255,0.55);
  border: 1px solid var(--border);
  border-radius: 3px;
}
.src-display::before {
  content: "";
  width: 6px; height: 6px;
  background: #2f8f4f;
  border-radius: 50%;
  box-shadow: 0 0 0 2px rgba(47,143,79,0.2);
}
/* Manual load variant: neutral grey indicator, no pulse */
.src-display.src-manual::before {
  background: #8B8B83;
  box-shadow: 0 0 0 2px rgba(139, 139, 131, 0.18);
}
.src-select {
  flex: 1;
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 6px 10px;
  font-size: 12.5px;
  color: var(--text-dark);
}
.inquiry-input {
  width: 100%;
  min-height: 160px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  resize: vertical;
  background: var(--off-white);
  font-size: 13px;
  line-height: 1.6;
  transition: border-color 0.15s;
}
.inquiry-input:focus { outline: none; border-color: var(--gold); background: #fff; }
.inquiry-input::placeholder { color: var(--text-faint); font-style: italic; }
.inquiry-actions { display: flex; gap: 8px; margin-top: 12px; }

/* Extracted */
.extracted {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--border-soft);
  animation: fadeIn 0.4s ease-out;
}
.ext-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.ext-label { font-size: 9.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold); font-weight: 700; }
.ext-status {
  font-size: 8.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--good);
  background: var(--good-bg);
  border: 1px solid var(--good-bd);
  padding: 1px 6px;
  border-radius: 10px;
  font-weight: 700;
  font-family: var(--mono);
}
.ext-list { list-style: none; }
.ext-list li {
  display: grid;
  grid-template-columns: 78px 1fr;
  padding: 3px 0;
  border-bottom: 1px dashed var(--border-soft);
  font-size: 11px;
}
.ext-list li:last-child { border-bottom: none; }
.ext-key { color: var(--text-faint); font-family: var(--mono); font-size: 10px; }
.ext-val.warn { color: var(--warn); font-style: italic; }
.ext-val .pill {
  display: inline-block;
  font-family: var(--mono);
  font-size: 10px;
  background: var(--warn-bg);
  border: 1px solid var(--warn-bd);
  color: var(--warn);
  padding: 0 6px;
  margin-left: 4px;
  border-radius: 3px;
}
.service-match {
  display: flex; gap: 10px; align-items: flex-start;
  margin-top: 16px; padding: 11px 13px;
  background: var(--good-bg);
  border: 1px solid var(--good-bd);
  border-left: 3px solid var(--good);
  border-radius: var(--radius-sm);
  font-size: 12.5px;
}
.sm-icon { color: var(--good); font-weight: 700; }
.sm-text b { font-family: var(--serif); color: var(--navy); }
.sm-sub { font-size: 11px; color: var(--text-light); font-style: italic; }

/* Empty state */
.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 70px 60px; min-height: 540px; }
.empty-glyph { font-family: var(--serif); font-size: 56px; color: var(--gold); margin-bottom: 16px; opacity: 0.7; }
.empty-glyph svg { width: 56px; height: 56px; display: block; margin: 0 auto; color: var(--gold); opacity: 0.7; }
.empty-state h3 { font-family: var(--serif); font-size: 18px; color: var(--navy); font-weight: 400; margin-bottom: 10px; }
.empty-state p { font-size: 11.5px; color: var(--text-light); max-width: 460px; margin-bottom: 6px; line-height: 1.6; }
.empty-state .empty-desc { font-size: 11.5px; }
.empty-hint { font-style: italic; color: var(--text-faint); font-size: 11px; }

/* Loading */
.loading-state { padding: 56px 48px; }
.loader-bar { height: 3px; background: var(--paper); border-radius: 999px; overflow: hidden; margin-bottom: 32px; }
.loader-fill { height: 100%; width: 0%; background: linear-gradient(90deg, var(--gold) 0%, var(--gold-soft) 100%); transition: width 0.4s ease-out; }
.loader-steps { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.loader-steps li {
  display: flex; align-items: center; gap: 14px;
  font-size: 13.5px; color: var(--text-faint);
  font-family: var(--serif); font-style: italic;
  padding-left: 36px; position: relative;
  transition: color 0.3s;
}
.loader-steps li::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 22px; height: 22px; border-radius: 50%;
  border: 2px solid var(--border); background: #fff;
  transition: all 0.3s;
}
.loader-steps li.active { color: var(--navy); }
.loader-steps li.active::before { border-color: var(--gold); background: var(--gold-tint); animation: pulse 1.2s infinite ease-in-out; }
.loader-steps li.done { color: var(--text-light); font-style: normal; }
.loader-steps li.done::before { background: var(--good); border-color: var(--good); content: "✓"; color: #fff; font-size: 12px; display: flex; align-items: center; justify-content: center; font-weight: 700; }

/* Results */
.results { animation: fadeIn 0.4s ease-out; }
.clusters { display: flex; flex-direction: column; }
.cluster { border-bottom: 1px solid var(--border-soft); }
.cluster:last-child { border-bottom: none; }
.cluster-head {
  display: flex; align-items: center; gap: 10px;
  padding: 13px 24px; cursor: pointer; user-select: none;
  transition: background 0.12s;
}
.cluster-head:hover { background: var(--paper); }
.cluster-caret { font-family: var(--mono); font-size: 12px; color: var(--gold); transition: transform 0.2s; width: 14px; }
.cluster.collapsed .cluster-caret { transform: rotate(-90deg); }
.cluster-name { font-family: var(--serif); font-size: 14.5px; color: var(--navy); font-weight: 700; flex: 1; }
.cluster-count { font-family: var(--mono); font-size: 10.5px; color: var(--text-faint); background: var(--paper); padding: 1px 8px; border-radius: 10px; border: 1px solid var(--border-soft); }
.cluster-body { padding: 4px 24px 12px; display: flex; flex-direction: column; gap: 8px; }
.cluster.collapsed .cluster-body { display: none; }

/* Candidate */
.cand {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px; align-items: center;
  padding: 11px 13px;
  background: var(--off-white);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  transition: border-color 0.12s, box-shadow 0.12s;
  cursor: pointer;
}
.cand:hover { border-color: var(--gold); box-shadow: var(--shadow-md); }
.cand-source {
  display: inline-block; font-family: var(--mono);
  font-size: 9.5px; letter-spacing: 0.05em;
  font-weight: 700; padding: 3px 7px; border-radius: 3px;
  text-transform: uppercase;
}
.cand-source.pubmed     { background: #E8F0EE; color: #1F5C4D; }
.cand-source.semscholar { background: #EBE8F0; color: #3F2D6B; }
.cand-source.jira       { background: #E8EEF5; color: #1A4480; }
.cand-source.gdrive     { background: #FAF1E8; color: #8B5A1A; }
.cand-source.quote      { background: #F0EAE0; color: #6B4F1F; }
.cand-source.past       { background: #ECECEC; color: #444; }
.cand-body { min-width: 0; }
.cand-title { font-size: 13px; color: var(--text-dark); font-weight: 600; margin-bottom: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cand-snip { font-size: 11.5px; color: var(--text-light); line-height: 1.5; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.cand-meta { display: flex; gap: 6px; align-items: center; margin-top: 5px; }
.rel-tag {
  display: inline-block; font-family: var(--mono);
  font-size: 9.5px; letter-spacing: 0.04em;
  padding: 1px 6px; border-radius: 3px; font-weight: 700;
}
.rel-tag.verified { background: var(--good-bg); color: var(--good); border: 1px solid var(--good-bd); }
.rel-tag.peer     { background: #ECEEF5; color: #2A3E6B; border: 1px solid #C7CEDF; }
.rel-tag.preprint { background: var(--warn-bg); color: var(--warn); border: 1px solid var(--warn-bd); }
.rel-tag.vendor   { background: #EFEBEB; color: #5C4040; border: 1px solid #D6C9C9; }
.cand-cite { font-family: var(--mono); font-size: 10px; color: var(--text-faint); }
.cand-cite a { color: var(--text-faint); text-decoration: none; border-bottom: 1px dotted var(--text-faint); }
.cand-cite a:hover { color: var(--navy); border-color: var(--navy); }
.cand-conf { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; min-width: 56px; }
.conf-num { font-family: var(--serif); font-size: 17px; color: var(--navy); font-weight: 700; line-height: 1; }
.conf-num .pct { font-size: 10.5px; color: var(--text-faint); margin-left: 1px; }
.conf-bar { width: 50px; height: 4px; background: var(--paper); border-radius: 999px; overflow: hidden; }
.conf-fill { height: 100%; background: var(--gold); transition: width 0.6s ease-out; }
.cand[data-conf-low="true"] .conf-fill { background: var(--warn); }

/* Output */
.iw-head-output {
  margin-top: 4px;
  padding-top: 22px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border-soft);
  align-items: center;
}

/* PDF-format tag (right side of output header) */
.output-format-tag {
  margin-left: auto;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 3px;
  background: rgba(31, 78, 121, 0.12);
  color: var(--navy);
  border: 1px solid rgba(31, 78, 121, 0.25);
  font-weight: 700;
}

/* Inline action button on workspace section header (next to PDF tag) */
.iw-head-action {
  margin-left: 8px;
  flex-shrink: 0;
}

/* Top action toolbar on workspace results pane. Save / Request review /
   Continue to quote on the left (workflow actions); Edit / New inquiry on
   the right (utility actions). Continue to quote is gated to level 2 / 3. */
.iw-action-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: rgba(239, 234, 217, 0.55);
  border-bottom: 1px solid var(--border-soft);
  flex-wrap: wrap;
}
.iw-action-spacer { flex: 1; min-width: 8px; }
.iw-action-bar .btn-primary:disabled,
.iw-action-bar .btn-disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

/* Team notes attachment block (top of Preview team notes modal) */
.team-notes-attach {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  margin-bottom: 14px;
  background: rgba(31, 78, 121, 0.08);
  border: 1px solid rgba(31, 78, 121, 0.2);
  border-radius: 5px;
}
.team-notes-attach-info {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
}
.team-notes-attach-icon { font-size: 14px; }
.team-notes-attach-label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.team-notes-attach-name {
  font-family: var(--serif);
  font-size: 13px;
  font-weight: 600;
  color: var(--navy-deep);
}

/* Team notes container (text form, styled) */
.team-notes-body {
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: 5px;
  overflow: hidden;
}
.team-notes-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 16px;
  background: rgba(239, 234, 217, 0.55);
  border-bottom: 1px solid var(--border-soft);
}
.team-notes-eyebrow {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.team-notes-id {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  color: var(--navy-deep);
}
.team-notes-content {
  padding: 14px 18px;
  background: #fff;
  border: none;
  border-radius: 0;
}
.team-notes-foot {
  padding: 6px 16px;
  border-top: 1px solid var(--border-soft);
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.04em;
  color: var(--text-faint);
  text-align: center;
}

/* Inquiry-preview popup: team-notes section (compact mock-archive view).
   Two buttons at top open the full Team notes modal and the PDF report
   modal; the body shows the mock-generated notes inline so the reviewer
   can scan without leaving the preview. */
.iq-preview-tn-actions {
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.iq-preview-tn-body {
  font-size: 11.5px;
  max-height: 360px;
  overflow: auto;
}
.iq-preview-tn-body .team-notes-content {
  padding: 10px 14px;
  line-height: 1.5;
}
.iq-preview-tn-body .team-notes-content .md-heading {
  margin: 8px 0 4px;
}
.iq-preview-tn-body .team-notes-content h3.md-heading { font-size: 12.5px; }
.iq-preview-tn-body .team-notes-content h4.md-heading { font-size: 12px; }
.iq-preview-tn-body .team-notes-content h5.md-heading { font-size: 11.5px; }
.iq-preview-tn-body .team-notes-content ul {
  margin: 2px 0 6px;
  padding-left: 18px;
}
.iq-preview-tn-body .team-notes-content li {
  margin: 1px 0;
}

/* PDF report (Technical assessment attachment) — letterhead document layout */
.pdf-report {
  background: #fff;
  border: 1px solid var(--border);
  box-shadow: 0 4px 12px rgba(31, 78, 121, 0.10);
  border-radius: 3px;
  font-family: var(--serif);
  color: var(--text-dark);
}
.pdf-report-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  padding: 18px 22px;
  border-bottom: 3px solid var(--gold);
  background: rgba(239, 234, 217, 0.4);
}
.pdf-report-brand-name {
  font-family: var(--serif);
  font-size: 22px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -0.005em;
}
.pdf-report-brand-sub {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-top: 2px;
}
.pdf-report-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 11px;
  text-align: right;
}
.pdf-report-meta .pdf-key {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-right: 4px;
}
.pdf-report-meta code {
  font-family: var(--mono);
  font-size: 10px;
  background: rgba(196, 160, 76, 0.10);
  padding: 1px 5px;
  border-radius: 2px;
}
.pdf-report-section {
  padding: 14px 22px 4px;
  border-bottom: 1px solid var(--border-soft);
}
.pdf-report-section:last-of-type { border-bottom: none; }
.pdf-report-section h3 {
  font-family: var(--serif);
  font-size: 14px;
  font-weight: 700;
  color: var(--navy-deep);
  margin: 0 0 8px;
  letter-spacing: 0.02em;
}
.pdf-report-section p {
  font-size: 12px;
  line-height: 1.65;
  margin: 0 0 6px;
}
.pdf-report-lead {
  font-family: var(--serif);
  font-size: 14px;
  font-weight: 600;
  color: var(--navy-deep);
}
.pdf-report-section code {
  font-family: var(--mono);
  font-size: 10.5px;
  background: rgba(196, 160, 76, 0.10);
  padding: 1px 5px;
  border-radius: 2px;
}
.pdf-report-table {
  width: 100%;
  border-collapse: collapse;
  margin: 4px 0 10px;
  font-size: 11px;
}
.pdf-report-table th,
.pdf-report-table td {
  border: 1px solid var(--border-soft);
  padding: 6px 9px;
  text-align: left;
  vertical-align: top;
}
.pdf-report-table th {
  background: rgba(196, 160, 76, 0.10);
  font-family: var(--sans);
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--navy-deep);
}
.pdf-cell-sub {
  display: block;
  font-size: 10.5px;
  color: var(--text-med);
  font-style: italic;
  margin-top: 3px;
}
.pdf-report-ext td:first-child { width: 32%; color: var(--navy-deep); }
.pdf-ext-pill {
  display: inline-block;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 1px 5px;
  margin-left: 4px;
  border-radius: 2px;
  background: var(--paper);
  color: var(--text-faint);
  border: 1px solid var(--border);
}
.pdf-ext-warn { color: #b03c3c; margin-left: 4px; font-size: 11px; }
.pdf-report-list {
  padding-left: 18px;
  margin: 0 0 8px;
}
.pdf-report-list li {
  font-size: 12px;
  line-height: 1.6;
  margin-bottom: 4px;
}
.pdf-report-audit {
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1.55;
  background: rgba(239, 234, 217, 0.4);
  padding: 10px 12px;
  border-left: 2px solid var(--gold);
  border-radius: 2px;
  white-space: pre-wrap;
  color: var(--text-dark);
  margin: 4px 0;
}
.pdf-report-empty {
  font-style: italic;
  color: var(--text-faint);
}

/* Per-stage detail blocks inside Methodology by stage section */
.pdf-stage-block {
  padding: 10px 12px;
  background: rgba(239, 234, 217, 0.4);
  border-left: 3px solid var(--gold);
  border-radius: 3px;
  margin: 0 0 12px;
}
.pdf-stage-missing {
  background: rgba(176, 60, 60, 0.06);
  border-left-color: #b03c3c;
}
.pdf-stage-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 6px;
}
.pdf-stage-num {
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--text-faint);
  font-weight: 700;
  letter-spacing: 0.06em;
}
.pdf-stage-name {
  font-family: var(--serif);
  font-size: 13px;
  font-weight: 700;
  color: var(--navy-deep);
}
.pdf-stage-conf {
  margin-left: auto;
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 700;
  color: var(--navy);
  background: rgba(31, 78, 121, 0.10);
  padding: 1px 7px;
  border-radius: 3px;
}
.pdf-stage-pick { font-size: 12px; color: var(--navy-deep); margin: 0 0 3px; }
.pdf-stage-sum { font-size: 11px; color: var(--text-med); font-style: italic; margin: 0 0 6px; line-height: 1.55; }
.pdf-stage-rat { font-size: 11px; color: var(--text-dark); margin: 0 0 4px; line-height: 1.55; }
.pdf-stage-srcs { font-size: 11px; color: var(--text-med); margin: 0 0 4px; line-height: 1.6; }
.pdf-stage-key {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-right: 4px;
}
.pdf-stage-missing-line { font-size: 11px; color: #b03c3c; font-style: italic; margin: 0; }
.pdf-rel-table { margin-top: 8px; font-size: 10.5px; }
.pdf-rel-table th { background: rgba(31, 78, 121, 0.08); font-size: 9.5px; }
.pdf-rel-table td { padding: 3px 8px; }
.pdf-rel-table th:first-child,
.pdf-rel-table td:first-child { width: 30%; }
.pdf-rel-table th:nth-child(2),
.pdf-rel-table td:nth-child(2) { width: 16%; font-family: var(--mono); white-space: nowrap; text-align: right; }
.pdf-rel-table th:nth-child(3),
.pdf-rel-table td:nth-child(3) { width: 54%; }
.pdf-rel-logic {
  font-style: italic;
  font-size: 10.5px;
  color: var(--text-med);
  line-height: 1.5;
}
.pdf-rel-sum td {
  background: rgba(196, 160, 76, 0.10);
  border-top: 1px solid var(--gold-soft);
}
.pdf-rel-sum td:nth-child(3) {
  font-style: italic;
  color: var(--text-faint);
  font-size: 10px;
}

.pdf-stage-alts {
  margin-top: 8px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px dashed var(--border);
  border-radius: 3px;
}
.pdf-stage-alts-head {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-bottom: 6px;
}
.pdf-stage-alt {
  padding: 4px 0;
  border-top: 1px dashed var(--border-soft);
}
.pdf-stage-alt:first-of-type { border-top: none; }
.pdf-alt-title { font-size: 11.5px; color: var(--navy-deep); margin-bottom: 2px; }
.pdf-alt-sum { font-size: 10.5px; color: var(--text-med); font-style: italic; line-height: 1.5; margin-bottom: 3px; }
.pdf-alt-rat { font-size: 10.5px; color: var(--text-dark); line-height: 1.55; }
.pdf-status {
  display: inline-block;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 2px;
}
.pdf-status-accept { background: rgba(70, 110, 80, 0.18); color: #2f5b3e; }
.pdf-status-review { background: rgba(196, 160, 76, 0.22); color: #8a6312; }
.pdf-status-reject { background: rgba(176, 60, 60, 0.18); color: #b03c3c; }
.pdf-report-foot {
  padding: 10px 22px 14px;
  background: rgba(239, 234, 217, 0.3);
  border-top: 1px solid var(--border-soft);
  text-align: center;
}
.pdf-report-foot-line {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.04em;
  color: var(--text-faint);
  line-height: 1.6;
}
.pdf-report-foot-line code {
  font-family: var(--mono);
  font-size: 9.5px;
}

@media (max-width: 760px) {
  .pdf-report-head { flex-direction: column; gap: 10px; }
  .pdf-report-meta { text-align: left; }
}

/* PDF preview frame (used in inquiry preview modals for assessment + quote) */
.pdf-preview {
  background: #fff;
  border: 1px solid var(--border);
  box-shadow: 0 2px 8px rgba(31, 78, 121, 0.08);
  border-radius: 3px;
  margin: 4px 0;
  font-family: var(--serif);
}
.pdf-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 16px;
  border-bottom: 2px solid var(--gold);
  background: rgba(239, 234, 217, 0.4);
}
.pdf-doc-type {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.pdf-doc-id {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  color: var(--navy-deep);
}
.pdf-body {
  padding: 16px 20px;
  font-family: var(--serif);
  font-size: 12px;
  line-height: 1.65;
  color: var(--text-dark);
  white-space: pre-wrap;
  background: #fff;
  margin: 0;
}
.pdf-body-quote {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pdf-quote-label { font-size: 13px; color: var(--navy-deep); }
.pdf-quote-total {
  font-family: var(--mono);
  font-size: 14px;
  font-weight: 700;
  color: var(--navy-deep);
  margin-top: 4px;
}
.pdf-quote-rule { font-size: 11px; color: var(--text-med); }
.pdf-quote-rule code {
  font-family: var(--mono);
  font-size: 10.5px;
  background: rgba(196, 160, 76, 0.10);
  padding: 1px 5px;
  border-radius: 2px;
}
.pdf-foot {
  padding: 6px 16px;
  border-top: 1px solid var(--border-soft);
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.04em;
  color: var(--text-faint);
  text-align: center;
  background: rgba(239, 234, 217, 0.3);
}
.output-toggle { margin-left: auto; display: flex; gap: 4px; background: var(--paper); padding: 3px; border-radius: var(--radius-sm); }
.tog { background: transparent; border: none; padding: 5px 12px; font-size: 11.5px; color: var(--text-light); font-weight: 600; border-radius: 3px; transition: all 0.15s; }
.tog:hover { color: var(--navy); }
.tog.active { background: #fff; color: var(--navy); box-shadow: var(--shadow-sm); }
.output-frame { padding: 22px 24px; background: var(--paper); border-bottom: 1px solid var(--border-soft); min-height: 200px; }
.output-meta { font-family: var(--mono); font-size: 10.5px; color: var(--text-faint); margin-bottom: 12px; letter-spacing: 0.04em; }
.output-body {
  background: #fff; border: 1px solid var(--border-soft); border-radius: var(--radius-sm);
  padding: 20px 24px;
  font-family: var(--serif);
  font-size: 13.5px; color: var(--text-dark); line-height: 1.7;
  white-space: pre-wrap;
}
.result-actions { display: flex; gap: 8px; padding: 16px 24px; align-items: center; }
.result-actions .btn-text { margin-left: auto; }

/* Section 2 (stage × source comparison) header — same shape as iw-head-output */
.iw-head-cmp {
  margin-top: 8px;
  padding-top: 22px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border-soft);
  align-items: center;
}

/* Collapsible wrapper for Section 2 (stage × source comparison).
   Default open; click summary to collapse. */
.iw-cmp-collapse {
  margin-top: 14px;
  border-top: 1px solid var(--border);
}
.iw-cmp-summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  padding: 18px 0 14px;
  border-bottom: 1px solid var(--border-soft);
  user-select: none;
}
.iw-cmp-summary::-webkit-details-marker { display: none; }
.iw-cmp-caret {
  font-size: 12px;
  color: var(--text-faint);
  transition: transform 0.15s;
  display: inline-block;
  width: 14px;
}
.iw-cmp-collapse[open] .iw-cmp-caret { transform: rotate(90deg); color: var(--gold); }
.iw-cmp-num {
  font-family: var(--serif);
  font-size: 14px;
  color: var(--gold);
  font-weight: 700;
  letter-spacing: 0.08em;
  width: 22px;
  text-align: center;
}
.iw-cmp-title {
  font-family: var(--serif);
  font-size: 16px;
  font-weight: 700;
  color: var(--navy);
}
.iw-cmp-sub {
  font-family: var(--serif);
  font-size: 12px;
  color: var(--text-light);
  font-style: italic;
  margin-left: auto;
}
.iw-cmp-body { padding: 14px 0 4px; }

/* Footer of the comparison collapsible: dirty-selection status + Edit report */
.iw-cmp-footer {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
  padding: 10px 14px;
  background: rgba(239, 234, 217, 0.55);
  border: 1px solid var(--border);
  border-radius: 5px;
}
.iw-cmp-edit-status {
  flex: 1;
  font-size: 11.5px;
  color: var(--text-faint);
  font-style: italic;
  line-height: 1.4;
}
.iw-cmp-edit-status.iw-edit-status-dirty {
  color: var(--navy-deep);
  font-style: normal;
  font-weight: 600;
}
.iw-cmp-footer .btn-disabled,
.iw-cmp-footer .btn-primary:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

/* Audit summary block (inside output-frame, below the assessment body) */
.audit-summary {
  margin-top: 18px;
  padding: 14px 16px;
  background: rgba(239, 234, 217, 0.55);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 5px;
}
.audit-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-soft);
  flex-wrap: wrap;
}

/* "Request technical re-assessment" button — warning-tint pill, only
   visible when the quote total breaches the customer budget cap. */
.btn-reassess {
  background: rgba(176, 60, 60, 0.10);
  color: #8a3030;
  border-color: rgba(176, 60, 60, 0.40);
}
.btn-reassess:hover {
  background: rgba(176, 60, 60, 0.20);
  border-color: rgba(176, 60, 60, 0.65);
}

/* Re-assessment request modal (over-budget hand-off to Knowledge). */
.reassess-modal .reassess-lead {
  font-size: 12.5px;
  color: var(--text-dark);
  line-height: 1.55;
  margin-bottom: 10px;
  background: rgba(176, 60, 60, 0.06);
  border-left: 3px solid rgba(176, 60, 60, 0.55);
  padding: 8px 10px;
  border-radius: 3px;
}
.reassess-modal .reassess-body {
  font-size: 12.5px;
  color: var(--text-med);
  line-height: 1.6;
  margin-bottom: 12px;
}

/* Re-assessment banner — surfaces the over-budget context inside the
   Knowledge workspace after the hand-off. */
.reassess-banner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: flex-start;
  gap: 14px;
  margin: 0 0 18px;
  padding: 12px 16px;
  background: rgba(176, 60, 60, 0.06);
  border: 1px solid rgba(176, 60, 60, 0.30);
  border-left: 4px solid rgba(176, 60, 60, 0.65);
  border-radius: 5px;
}
.reassess-banner-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(176, 60, 60, 0.85);
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.reassess-banner-title {
  font-family: var(--serif);
  font-size: 13.5px;
  font-weight: 700;
  color: #8a3030;
  margin-bottom: 4px;
}
.reassess-banner-meta {
  font-family: var(--sans);
  font-size: 11.5px;
  color: var(--text-dark);
  line-height: 1.55;
}
.reassess-banner-meta b { font-family: var(--mono); color: var(--navy-deep); }
.reassess-banner-note {
  margin-top: 6px;
  padding: 6px 10px;
  background: rgba(255, 255, 255, 0.75);
  border-left: 2px solid rgba(176, 60, 60, 0.40);
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text-med);
  font-style: italic;
  line-height: 1.5;
}
.reassess-banner-foot {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  letter-spacing: 0.04em;
  margin-top: 6px;
}
.reassess-banner-x {
  background: none;
  border: none;
  font-size: 18px;
  line-height: 1;
  color: var(--text-faint);
  cursor: pointer;
  padding: 2px 6px;
  align-self: flex-start;
}
.reassess-banner-x:hover { color: #8a3030; background: rgba(176, 60, 60, 0.08); border-radius: 3px; }

/* Send-back banner — paints at the top of the destination workspace
   (Knowledge OR Quote) when an inquiry was sent back from approval.
   Same shell as the re-assessment banner but uses a navy-tinted scheme
   to signal "reviewer note" rather than "budget alarm". */
.sendback-banner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: flex-start;
  gap: 14px;
  margin: 0 0 18px;
  padding: 12px 16px;
  background: rgba(44, 74, 107, 0.06);
  border: 1px solid rgba(44, 74, 107, 0.30);
  border-left: 4px solid var(--navy);
  border-radius: 5px;
}
.sendback-banner-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--navy);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sendback-banner-title {
  font-family: var(--serif);
  font-size: 13.5px;
  font-weight: 700;
  color: var(--navy-deep, var(--navy));
  margin-bottom: 4px;
}
.sendback-banner-meta {
  font-family: var(--sans);
  font-size: 11.5px;
  color: var(--text-dark);
  line-height: 1.55;
}
.sendback-banner-meta b { color: var(--navy-deep, var(--navy)); }
.sendback-banner-note {
  margin-top: 6px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, 0.85);
  border-left: 2px solid var(--navy);
  font-family: var(--serif);
  font-size: 12px;
  color: var(--text-dark);
  font-style: italic;
  line-height: 1.55;
  white-space: pre-wrap;
}
.sendback-banner-x {
  background: none;
  border: none;
  font-size: 18px;
  line-height: 1;
  color: var(--text-faint);
  cursor: pointer;
  padding: 2px 6px;
  align-self: flex-start;
}
.sendback-banner-x:hover { color: var(--navy-deep, var(--navy)); background: rgba(44, 74, 107, 0.08); border-radius: 3px; }

/* Pricing policy editor — multi-template tabs + dynamic columns +
   CSV / DB source picker. Shared shell for any future per-customer
   pricing variants (Standard / Multi-currency / Cost-plus / etc.). */
.pp-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 6px 0 12px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 4px;
}
.pp-tab {
  padding: 5px 12px;
  font-size: 11.5px;
  font-family: var(--sans);
  font-weight: 600;
  background: transparent;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  border-radius: 3px 3px 0 0;
  cursor: pointer;
  color: var(--text-med);
}
.pp-tab:hover { background: rgba(196, 160, 76, 0.06); color: var(--navy-deep, var(--navy)); }
.pp-tab.is-active {
  color: var(--navy-deep, var(--navy));
  border-bottom-color: var(--gold);
  background: rgba(196, 160, 76, 0.08);
}
.pp-tab-add {
  margin-left: auto;
  color: var(--text-faint);
  font-weight: 500;
  font-size: 11px;
}
.pp-template-meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
}
.pp-meta-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  align-items: center;
  gap: 10px;
  font-size: 11.5px;
}
.pp-meta-row input { padding: 5px 8px; font-size: 12px; border: 1px solid var(--border); border-radius: 3px; }
.pp-meta-key { font-size: 10.5px; font-weight: 700; color: var(--text-faint); letter-spacing: 0.06em; text-transform: uppercase; }
.pp-active { grid-template-columns: auto 1fr; }
.pp-source-row {
  display: flex;
  gap: 14px;
  margin: 6px 0 4px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
}
.pp-source-radio { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-size: 12px; }
.pp-source-radio input { accent-color: var(--navy); }
.pp-source-config {
  margin-top: 6px;
  padding: 10px 12px;
  background: rgba(196, 160, 76, 0.05);
  border: 1px dashed var(--gold);
  border-radius: 4px;
}
.pp-source-config[hidden] { display: none; }
.pp-attach-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  font-size: 11px;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: #fff;
  cursor: pointer;
  color: var(--text-med);
}
.pp-attach-btn:hover { background: var(--paper); border-color: var(--gold); }
.pp-attach-meta { margin-left: 8px; font-family: var(--mono); font-size: 10.5px; color: var(--text-faint); }
.pp-columns-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 10px 0 6px;
  padding: 6px 8px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
}
.pp-columns-label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
}
.pp-columns-list { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.pp-col-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  font-size: 10.5px;
  font-family: var(--mono);
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text-dark);
}
.pp-col-rm {
  border: none;
  background: transparent;
  color: var(--text-faint);
  font-size: 13px;
  cursor: pointer;
  line-height: 1;
  padding: 0 2px;
}
.pp-col-rm:hover { color: var(--warn, #B25A00); }
.pp-newcol-input {
  padding: 3px 8px;
  font-size: 11px;
  border: 1px solid var(--border);
  border-radius: 3px;
  width: 120px;
}
.pp-table {
  margin-top: 4px;
  font-size: 12px;
}
.pp-table input {
  width: 100%;
  padding: 3px 6px;
  font-size: 12px;
  border: 1px solid var(--border-soft);
  border-radius: 2px;
}
.pp-table input:focus { outline: none; border-color: var(--gold); }

/* Conversational assistant rewrite modal — shared shell across the
   audit summary textareas (Knowledge + Quote) and the Final draft
   body. Borrows the sendback-modal-context layout for the scope
   pill, then layers an instruction input + current text + suggested
   rewrite textareas. */
.ast-modal-scope {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  background: rgba(196, 160, 76, 0.08);
  border: 1px solid var(--border);
  border-left: 4px solid var(--gold);
  border-radius: 4px;
  margin-bottom: 6px;
  font-size: 12.5px;
}
.ast-scope-key {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
}
.ast-scope-val {
  font-family: var(--serif);
  font-weight: 700;
  color: var(--navy-deep, var(--navy));
}
.ast-instruction {
  width: 100%;
  font-size: 13px;
  padding: 8px 12px;
  margin-bottom: 4px;
}
.ast-current {
  background: rgba(0, 0, 0, 0.03);
  color: var(--text-med);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11.5px;
}
.ast-suggested {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12px;
  background: rgba(196, 160, 76, 0.05);
  border-color: var(--gold);
}
.ast-regen {
  margin-left: auto;
  font-size: 11px;
}

/* "Ask assistant" button slot in the Final draft section head */
.fp-section-head { display: flex; align-items: center; gap: 10px; }
.fp-section-head .fp-ask-assistant { margin-left: auto; }

/* Send-back picker modal (destination + comment) */
.sendback-modal-context {
  padding: 10px 12px;
  background: rgba(196, 160, 76, 0.08);
  border: 1px solid var(--border);
  border-radius: 4px;
  margin-bottom: 14px;
}
.sendback-meta-row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 10px;
  align-items: baseline;
  padding: 3px 0;
  font-size: 12.5px;
  line-height: 1.5;
}
.sendback-key {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
}
.sendback-meta-row code {
  font-family: var(--mono, ui-monospace);
  font-size: 12px;
  background: rgba(0, 0, 0, 0.04);
  padding: 0 4px;
  border-radius: 2px;
}
.sendback-section-head {
  margin: 16px 0 8px;
  font-family: var(--serif);
  font-size: 13px;
  font-weight: 700;
  color: var(--navy-deep, var(--navy));
}
.sendback-dest {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sendback-dest-row {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: start;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.sendback-dest-row:hover { border-color: var(--gold); background: rgba(196, 160, 76, 0.04); }
.sendback-dest-row input[type="radio"] {
  margin-top: 3px;
  accent-color: var(--navy);
}
.sendback-dest-name {
  font-family: var(--serif);
  font-size: 13.5px;
  font-weight: 700;
  color: var(--navy-deep, var(--navy));
  margin-bottom: 3px;
}
.sendback-dest-sub {
  font-size: 11.5px;
  color: var(--text-med);
  line-height: 1.5;
}
.sendback-dest-sub code {
  font-family: var(--mono, ui-monospace);
  font-size: 11px;
  background: rgba(0, 0, 0, 0.04);
  padding: 0 4px;
  border-radius: 2px;
}
.sendback-textarea {
  width: 100%;
  font-family: var(--sans);
  font-size: 12.5px;
  line-height: 1.55;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  resize: vertical;
  min-height: 110px;
}
.sendback-textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px rgba(196, 160, 76, 0.2); }

/* Inquiry-row pill that marks an inquiry as "sent back from approval".
   Sits in the same .sp-meta-tags row as the rule + risk-flag chips. */
.iq-sentback-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--navy);
  color: #fff;
  border-radius: 10px;
  margin-right: 4px;
}
.sp-row-sentback {
  border-left: 3px solid var(--navy);
}

/* Small "?" help icon sitting in audit headers — opens the reliability
   help modal. Subtle gold-tint chip. */
.btn-help-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--gold-tint);
  border: 1px solid rgba(197, 181, 154, 0.55);
  color: #6e5e3e;
  font-family: var(--serif);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}
.btn-help-icon:hover {
  background: var(--gold);
  color: #fff;
  border-color: var(--gold);
}
.btn-help-icon:focus { outline: 2px solid rgba(197, 161, 78, 0.45); outline-offset: 1px; }

/* Reliability help modal content (tables + tiers + worked example). */
.rel-help-lead {
  font-size: 12.5px;
  color: var(--text-med);
  line-height: 1.55;
  margin-bottom: 10px;
}
.rel-help-tiers {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.rel-help-tiers li {
  font-family: var(--sans);
  font-size: 11.5px;
  color: var(--text-dark);
  line-height: 1.5;
}
.rel-help-tier {
  display: inline-block;
  font-family: var(--sans);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 3px;
  margin-right: 4px;
}
.rel-help-tier.rel-help-strong { background: rgba(47, 143, 79, 0.18); color: #2f8f4f; }
.rel-help-tier.rel-help-ok     { background: rgba(122, 94, 42, 0.18); color: #7a5e2a; }
.rel-help-tier.rel-help-weak   { background: rgba(176, 60, 60, 0.18); color: #b03c3c; }
.rel-help-h {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--navy-deep);
  margin: 14px 0 6px;
}
.rel-help-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11.5px;
  margin-bottom: 10px;
}
.rel-help-table th, .rel-help-table td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--border-soft);
  text-align: left;
  vertical-align: top;
}
.rel-help-table thead th {
  background: rgba(239, 234, 217, 0.30);
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.rel-help-table td:nth-child(2),
.rel-help-table th:nth-child(2) { font-family: var(--mono); }
.rel-help-example tfoot td,
.rel-help-example tfoot th {
  border-top: 2px solid var(--navy);
  background: rgba(31, 78, 121, 0.05);
}
.rel-help-tip {
  font-family: var(--sans);
  font-size: 11.5px;
  color: var(--text-med);
  font-style: italic;
  background: rgba(239, 234, 217, 0.40);
  border-left: 3px solid var(--gold);
  padding: 8px 10px;
  margin-top: 10px;
}
.audit-head h4 {
  font-family: var(--serif);
  font-size: 14px;
  color: var(--navy-deep);
  margin: 0;
}
.audit-sub {
  font-size: 11px;
  color: var(--text-faint);
  font-style: italic;
}
.audit-head .btn-mini { margin-left: auto; }
.audit-textarea {
  width: 100%;
  min-height: 110px;
  padding: 10px 12px;
  font-family: var(--mono);
  font-size: 11.5px;
  line-height: 1.55;
  color: var(--text-dark);
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  resize: vertical;
}
.audit-textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px rgba(196, 160, 76, 0.2); }
.audit-foot { margin-top: 6px; }
.audit-status {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  letter-spacing: 0.02em;
}

/* Compact collapsible for Knowledge search results (below the matrix) */
.iw-kh-collapse {
  margin-top: 12px;
  padding: 8px 14px;
  background: rgba(239, 234, 217, 0.4);
  border: 1px solid var(--border);
  border-radius: 5px;
}
.iw-kh-collapse[open] { padding-bottom: 14px; }
.iw-kh-summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  padding: 4px 0;
}
.iw-kh-summary::-webkit-details-marker { display: none; }
.iw-kh-caret {
  font-size: 10px;
  color: var(--text-faint);
  transition: transform 0.15s;
  display: inline-block;
}
.iw-kh-collapse[open] .iw-kh-caret { transform: rotate(90deg); }
.iw-kh-title {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--navy-deep);
}
.iw-kh-sub {
  font-size: 11px;
  color: var(--text-faint);
  font-style: italic;
  margin-left: auto;
}

/* Compact variant of the knowledge-search narrative banner */
.kh-banner-compact {
  padding: 8px 12px !important;
  margin-bottom: 10px;
}
.kh-banner-compact .kh-summary {
  font-size: 11.5px;
  line-height: 1.5;
  margin: 0;
}

/* Rationale + reliability sections (D, E) */
.iw-head-rat, .iw-head-rel {
  margin-top: 8px;
  padding-top: 22px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border-soft);
  align-items: center;
}

.iw-rationale {
  padding: 22px 24px;
  background: var(--off-white);
  border-bottom: 1px solid var(--border-soft);
}
.rat-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.rat-list li {
  background: #fff;
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius-sm);
  padding: 12px 16px;
}
.rat-line {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 6px;
}
.rat-num {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--gold);
  font-weight: 700;
  letter-spacing: 0.04em;
  flex-shrink: 0;
}
.rat-rec {
  font-family: var(--serif);
  font-size: 13.5px;
  color: var(--navy);
  font-weight: 700;
  line-height: 1.4;
}
.rat-text {
  font-size: 12.5px;
  color: var(--text-med);
  line-height: 1.65;
  margin-bottom: 9px;
  margin-left: 28px;
}
.rat-sources {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  padding-top: 8px;
  border-top: 1px dashed var(--border-soft);
  margin-left: 28px;
}
.rat-cite {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px;
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: 12px;
  font-family: var(--mono);
  font-size: 10.5px;
}
.rat-cite-kind {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  display: inline-block;
}
.rat-cite-kind.verified { background: var(--good); }
.rat-cite-kind.peer     { background: var(--navy); }
.rat-cite-kind.preprint { background: var(--warn); }
.rat-cite-kind.vendor   { background: var(--text-faint); }
.rat-cite-ref { color: var(--text-dark); font-weight: 600; }
.rat-cite-conf { color: var(--gold); font-weight: 700; }

/* Reliability calculation panel */
.iw-reliability {
  padding: 22px 24px;
  background: var(--paper);
  border-bottom: 1px solid var(--border);
}
.rel-intro {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--text-med);
  font-style: italic;
  line-height: 1.6;
  margin-bottom: 16px;
  max-width: 720px;
}
.rel-grid {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 14px;
}
.rel-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
}
.rel-card h4 {
  font-family: var(--serif);
  font-size: 12.5px;
  color: var(--navy);
  font-weight: 700;
  margin-bottom: 10px;
  letter-spacing: 0.02em;
}
.rel-example-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--border-soft);
}
.rex-source {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--navy);
  font-weight: 700;
}
.rex-meta {
  font-size: 11.5px;
  color: var(--text-light);
  font-style: italic;
}

.rel-table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.rel-table td { padding: 5px 6px; vertical-align: middle; }
.rel-table tr { border-bottom: 1px dashed var(--border-soft); }
.rel-table tr:last-child { border-bottom: none; }
.rel-table .rel-signal {
  color: var(--text-dark);
  font-weight: 600;
  white-space: nowrap;
}
.rel-table .rel-weight {
  color: var(--gold);
  font-family: var(--mono);
  font-weight: 700;
  text-align: right;
  width: 50px;
}
.rel-table .rel-desc, .rel-table .rel-note {
  color: var(--text-light);
  font-style: italic;
  font-size: 10.5px;
}
.rel-table .rel-bar {
  width: 80px;
  height: 4px;
  background: var(--paper);
  border-radius: 2px;
  padding: 0 6px;
}
.rel-table .rel-bar-total {
  border-top: 2px solid var(--navy);
  padding-top: 6px;
}
.rel-fill {
  display: block;
  height: 100%;
  background: var(--gold);
  border-radius: 2px;
  transition: width 0.7s cubic-bezier(0.34, 1.2, 0.64, 1);
}
.rel-table .rel-val {
  font-family: var(--mono);
  color: var(--gold);
  font-weight: 700;
  text-align: right;
  min-width: 30px;
}
.rel-table tr.total {
  border-top: 2px solid var(--navy);
}
.rel-table tr.total .rel-signal {
  font-family: var(--serif);
  color: var(--navy);
  font-size: 13px;
}
.rel-table tr.total .rel-val {
  font-family: var(--serif);
  color: var(--navy);
  font-size: 16px;
}

@media (max-width: 900px) {
  .rel-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   ASSISTANT PAGE
   ============================================================ */
.chat-shell {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 0;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  min-height: 580px;
}
.chat-history {
  border-right: 1px solid var(--border-soft);
  padding: 18px 14px;
  background: var(--off-white);
  border-radius: var(--radius) 0 0 var(--radius);
}
.chat-history-head {
  font-size: 10.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-bottom: 10px;
  padding: 0 4px;
}
.chat-list { list-style: none; display: flex; flex-direction: column; gap: 2px; }
.chat-list li {
  padding: 9px 10px;
  border-radius: var(--radius-sm);
  font-size: 12.5px;
  color: var(--text-med);
  cursor: pointer;
  transition: background 0.12s;
}
.chat-list li:hover { background: var(--paper); color: var(--navy); }
.chat-list li.active { background: var(--gold-tint); color: var(--navy); font-weight: 600; }
.chat-list .ci-time { font-family: var(--mono); font-size: 10px; color: var(--text-faint); display: block; margin-top: 2px; }

.chat-main {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.chat-stream {
  flex: 1;
  overflow-y: auto;
  padding: 24px 28px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.msg {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 12px;
  animation: fadeIn 0.3s ease-out;
}
.msg .av {
  width: 32px; height: 32px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif); font-size: 12px; font-weight: 700;
}
.msg.user .av { background: var(--paper-2); color: var(--navy); }
.msg.bot  .av { background: var(--gold); color: #fff; }
.msg .body {
  background: var(--paper);
  padding: 12px 16px;
  border-radius: var(--radius-sm);
  font-size: 13.5px;
  line-height: 1.65;
  color: var(--text-dark);
  font-family: var(--serif);
}
.msg.user .body { background: #fff; border: 1px solid var(--border); }
.msg.bot  .body { border-left: 3px solid var(--gold); }
.msg .cites {
  margin-top: 10px; padding-top: 10px;
  border-top: 1px dashed var(--border);
  display: flex; gap: 6px; flex-wrap: wrap;
  font-family: var(--sans);
}
.msg .cite-chip {
  font-family: var(--mono); font-size: 10.5px;
  background: #fff; border: 1px solid var(--border);
  padding: 3px 8px; border-radius: 3px;
  color: var(--navy); text-decoration: none;
  transition: border-color 0.12s;
}
.msg .cite-chip:hover { border-color: var(--gold); }
.msg .cite-chip .src-tag {
  font-weight: 700; color: var(--gold); margin-right: 4px;
  text-transform: uppercase; font-size: 9px; letter-spacing: 0.04em;
}

.chat-suggestions {
  padding: 0 28px 8px;
  display: flex; flex-wrap: wrap; gap: 8px;
}
.chat-sugg {
  font-size: 12px;
  padding: 6px 12px;
  background: var(--paper);
  border: 1px solid var(--border);
  color: var(--text-med);
  border-radius: 16px;
  cursor: pointer;
  transition: all 0.12s;
}
.chat-sugg:hover { border-color: var(--gold); color: var(--navy); background: var(--gold-tint); }

.chat-input-bar {
  display: flex; gap: 10px;
  padding: 16px 28px;
  border-top: 1px solid var(--border-soft);
  background: var(--off-white);
}
.chat-input {
  flex: 1;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 9px 14px;
  font-size: 13.5px;
  background: #fff;
}
.chat-input:focus { outline: none; border-color: var(--gold); }

/* ============================================================
   KNOWLEDGE PAGE
   ============================================================ */
.knowledge-tabs {
  display: flex; gap: 4px;
  background: var(--paper);
  padding: 4px;
  border-radius: var(--radius-sm);
  margin-bottom: 20px;
  width: fit-content;
}
.ktab {
  background: transparent;
  border: none;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-light);
  border-radius: 3px;
  transition: all 0.15s;
}
.ktab:hover { color: var(--navy); }
.ktab.active { background: #fff; color: var(--navy); box-shadow: var(--shadow-sm); }

.knowledge-panel { display: flex; flex-direction: column; gap: 16px; }

/* K-queue items */
.kq-item {
  background: #fff;
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius);
  padding: 16px 20px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
  transition: box-shadow 0.12s;
}
.kq-item:hover { box-shadow: var(--shadow-md); }
.kq-q {
  font-family: var(--serif);
  font-size: 15px;
  color: var(--navy);
  font-weight: 700;
  margin-bottom: 6px;
}
.kq-meta {
  display: flex; gap: 12px;
  font-size: 12px;
  color: var(--text-light);
  align-items: center;
  flex-wrap: wrap;
}
.kq-meta .pill {
  font-family: var(--mono); font-size: 10px;
  background: var(--paper); border: 1px solid var(--border);
  padding: 2px 7px; border-radius: 10px;
  color: var(--text-med); font-weight: 600;
}
.kq-meta .pill.urgent { background: var(--warn-bg); border-color: var(--warn-bd); color: var(--warn); }
.kq-actions { display: flex; gap: 6px; }

/* Captured library entries */
.kc-item {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 22px;
}
.kc-q {
  font-family: var(--serif);
  font-size: 15px;
  color: var(--navy);
  font-weight: 700;
  margin-bottom: 8px;
}
.kc-a {
  font-size: 13.5px;
  color: var(--text-dark);
  line-height: 1.6;
  margin-bottom: 10px;
}
.kc-foot {
  display: flex; gap: 14px;
  font-size: 11.5px;
  color: var(--text-faint);
  font-family: var(--mono);
  letter-spacing: 0.04em;
  padding-top: 10px;
  border-top: 1px dashed var(--border-soft);
}

/* Experts */
.expert-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
}
.expert {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 20px;
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 14px;
  align-items: center;
}
.expert .av {
  width: 48px; height: 48px;
  border-radius: 50%;
  background: var(--navy);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif); font-size: 16px; font-weight: 700;
}
.expert-name { font-family: var(--serif); font-size: 16px; color: var(--navy); font-weight: 700; }
.expert-role { font-size: 12px; color: var(--text-light); margin-bottom: 6px; }
.expert-tags { display: flex; gap: 4px; flex-wrap: wrap; }
.expert-tags .tag {
  font-family: var(--mono); font-size: 10px;
  background: var(--paper); padding: 1px 7px;
  border-radius: 10px; color: var(--text-med);
  border: 1px solid var(--border);
}
.expert-tags .tag.sole { background: var(--warn-bg); border-color: var(--warn-bd); color: var(--warn); font-weight: 700; }

/* ============================================================
   APPROVAL BANNER (in inquiry/quotes workspace)
   ============================================================ */

.approval-banner {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
  margin: 10px 24px 0;
  padding: 7px 12px;
  border-radius: var(--radius-sm);
  border-left-width: 3px;
  border-left-style: solid;
}
.approval-banner.warn {
  background: var(--warn-bg);
  border: 1px solid var(--warn-bd);
  border-left-color: var(--warn);
}
.approval-banner.info {
  background: var(--paper);
  border: 1px solid var(--border);
  border-left-color: var(--gold);
}
.approval-banner.neutral { display: none; }
.ab-icon {
  font-size: 13px;
  font-weight: 700;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
.approval-banner.warn .ab-icon { background: var(--warn); color: #fff; }
.approval-banner.info .ab-icon { background: var(--gold); color: #fff; }
.ab-title {
  font-family: var(--serif);
  font-size: 11.5px;
  color: var(--navy);
  font-weight: 700;
  margin-bottom: 1px;
}
.ab-flags {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.ab-flag {
  font-size: 10.5px;
  color: var(--text-med);
  line-height: 1.4;
}
.ab-actions {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-shrink: 0;
}

/* Request review modal helpers */
.rev-options { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.rev-opt {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  align-items: flex-start;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}
.rev-opt:hover { border-color: var(--gold); background: var(--paper); }
.rev-opt input { margin-top: 4px; }
.rev-opt-label { font-family: var(--serif); font-size: 13px; color: var(--navy); font-weight: 700; }
.rev-opt-reason { font-size: 11.5px; color: var(--text-light); margin-top: 1px; }
.rev-note {
  width: 100%;
  min-height: 70px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 9px 12px;
  font-size: 13px;
  font-family: var(--sans);
  resize: vertical;
}
.rev-note:focus { outline: none; border-color: var(--gold); }

/* ============================================================
   APPROVALS PAGE
   ============================================================ */

.role-banner {
  background: #fff;
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius);
  padding: 16px 22px;
  margin-bottom: 18px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  box-shadow: var(--shadow-sm);
}
.rb-left { display: flex; gap: 14px; align-items: center; }
.rb-name {
  font-family: var(--serif);
  font-size: 15px;
  color: var(--navy);
  font-weight: 700;
}
.rb-perm {
  font-size: 12.5px;
  color: var(--text-light);
  margin-top: 2px;
  max-width: 600px;
  font-style: italic;
}
.rb-counts {
  display: flex;
  gap: 16px;
  font-size: 12px;
  color: var(--text-light);
}
.rb-counts b { color: var(--navy); font-family: var(--serif); font-size: 16px; font-weight: 700; }

.appr-tabs {
  display: flex;
  gap: 4px;
  background: var(--paper);
  padding: 4px;
  border-radius: var(--radius-sm);
  margin-bottom: 16px;
  width: fit-content;
}
.atab {
  background: transparent;
  border: none;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-light);
  border-radius: 3px;
  transition: all 0.15s;
}
.atab:hover { color: var(--navy); }
.atab.active { background: #fff; color: var(--navy); box-shadow: var(--shadow-sm); }

.appr-panel { display: flex; flex-direction: column; gap: 12px; }

.ap-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 22px;
  box-shadow: var(--shadow-sm);
}
.ap-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.ap-type {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 3px;
}
.ap-type.assessment { background: #E8F0EE; color: #1F5C4D; }
.ap-type.quote      { background: #F0EAE0; color: #6B4F1F; }
.ap-title {
  font-family: var(--serif);
  font-size: 15px;
  color: var(--navy);
  font-weight: 700;
  flex: 1;
  line-height: 1.4;
}
.ap-when {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text-faint);
}
.ap-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  font-size: 12px;
  color: var(--text-light);
  margin-bottom: 10px;
}
.ap-meta b { color: var(--text-med); font-weight: 600; }
.ap-flags {
  list-style: none;
  background: var(--warn-bg);
  border: 1px solid var(--warn-bd);
  border-left: 3px solid var(--warn);
  border-radius: var(--radius-sm);
  padding: 8px 14px;
  margin-bottom: 10px;
  font-size: 12.5px;
  color: var(--warn);
}
.ap-flags li { padding: 1px 0; }
.ap-note {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--text-dark);
  font-style: italic;
  padding: 10px 14px;
  background: var(--paper);
  border-radius: var(--radius-sm);
  margin-bottom: 12px;
  line-height: 1.55;
}
.ap-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  padding-top: 4px;
}
.ap-status {
  font-family: var(--mono);
  font-size: 11.5px;
  color: var(--text-faint);
  letter-spacing: 0.04em;
}

.rules-list { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.rules-list li {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 14px;
  align-items: center;
  padding: 10px 14px;
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 13px;
}
.rule-trigger { color: var(--text-dark); }
.rule-level {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 3px;
  font-weight: 700;
}
.rule-level.senior { background: var(--gold-tint); color: var(--navy-deep); border: 1px solid var(--gold-soft); }
.rule-level.ceo    { background: var(--navy); color: #fff; }
.rule-level.any    { background: var(--paper); color: var(--text-med); border: 1px solid var(--border); }
.rule-auto {
  font-family: var(--mono);
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}

@media (max-width: 900px) {
  .role-banner { grid-template-columns: 1fr; }
  .approval-banner { grid-template-columns: auto 1fr; }
  .ab-actions { grid-column: 1 / -1; flex-wrap: wrap; }
}

/* ============================================================
   QUOTES PAGE
   ============================================================ */

.qkpi { grid-template-columns: repeat(3, 1fr); }

.quote-workspace {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  margin-top: 24px;
  overflow: hidden;
}

.qw-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
  padding: 18px 24px;
  background: var(--paper);
  border-bottom: 1px solid var(--border);
}

/* Top action toolbar on the quote workspace (Save / Preview team notes /
   Confirm). Mirror of the Knowledge workspace toolbar. */
.qw-actions-toolbar {
  display: flex;
  gap: 8px;
  padding: 10px 24px;
  background: rgba(239, 234, 217, 0.30);
  border-bottom: 1px solid var(--border-soft);
  align-items: center;
}
.qw-actions-toolbar .btn { white-space: nowrap; }

/* Left-pane context block: inquiry no + per-stage best-hit methodology
   + pricing policy file. Inquiry and Pricing policy are plain inline
   blocks (no card). The methodology block keeps a subtle background
   since it contains a list of stage rows. */
.qw-context { display: flex; flex-direction: column; gap: 14px; }

.qwc-inline {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.qwc-block {
  background: rgba(239, 234, 217, 0.30);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
  padding: 8px 10px;
}
.qwc-block-method { padding: 6px 8px; }
.qwc-key {
  display: block;
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-bottom: 4px;
}
.qwc-val {
  font-family: var(--mono);
  font-size: 12.5px;
  font-weight: 700;
  color: var(--navy-deep);
  display: block;
}
.qwc-sub {
  display: block;
  font-family: var(--sans);
  font-size: 11.5px;
  color: var(--text-med);
  margin-top: 2px;
  line-height: 1.4;
}

/* Customer budget line under the inquiry no / title. */
.qwc-budget {
  display: block;
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text-dark);
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px dashed var(--border-soft);
}
.qwc-budget b { font-family: var(--mono); color: var(--navy-deep); }
.qwc-budget-src {
  font-family: var(--sans);
  font-size: 10px;
  color: var(--text-faint);
  font-style: italic;
  margin-left: 4px;
}
.qwc-budget.qwc-budget-unknown b { color: #b03c3c; }

/* Technical assessment artefact buttons in the left pane (View team
   notes / View PDF report). Subtle pair — same btn-ghost mini chrome. */
.qwc-ta-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.qwc-ta-actions .btn { white-space: nowrap; }

/* Per-stage best-hit list (Sample prep / Library prep / Sequencing /
   Primary / Secondary). Each row: stage number + label + top
   suggestion title + Strong/OK/Weak reliability tag. */
.qwc-stages {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.qwc-stage {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 4px 6px;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid var(--border-soft);
  border-left: 3px solid rgba(155, 175, 161, 0.55);
  border-radius: 3px;
}
.qwc-stage.qwc-stage-missing {
  border-left-color: rgba(176, 60, 60, 0.5);
  background: rgba(176, 60, 60, 0.06);
}
.qwc-stage-num {
  font-family: var(--mono);
  font-size: 8.5px;
  font-weight: 700;
  color: var(--text-faint);
  letter-spacing: 0.04em;
  padding-top: 1px;
  flex-shrink: 0;
}
.qwc-stage-body {
  flex: 1 1 auto;
  min-width: 0;
}
.qwc-stage-name {
  font-family: var(--sans);
  font-size: 9.5px;
  font-weight: 700;
  color: var(--navy-deep);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.qwc-stage-pick {
  font-family: var(--sans);
  font-size: 10.5px;
  font-weight: 600;
  color: var(--text-dark);
  margin-top: 1px;
  line-height: 1.3;
  word-break: break-word;
}
.qwc-stage-miss {
  font-weight: 500;
  color: #b03c3c;
  font-style: italic;
}
.qwc-stage-meta {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-top: 2px;
}
.qwc-stage-conf {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  font-family: var(--mono);
}
.qwc-stage-conf .qwc-stage-conf-tier {
  font-family: var(--sans);
  font-size: 9px;
  font-weight: 700;
}
.qwc-stage-conf .qwc-stage-conf-num { font-size: 9.5px; font-weight: 700; }
.qwc-stage-conf.rel-high .qwc-stage-conf-tier,
.qwc-stage-conf.rel-high .qwc-stage-conf-num { color: #2f8f4f; }
.qwc-stage-conf.rel-med  .qwc-stage-conf-tier,
.qwc-stage-conf.rel-med  .qwc-stage-conf-num { color: #7a5e2a; }
.qwc-stage-conf.rel-low  .qwc-stage-conf-tier,
.qwc-stage-conf.rel-low  .qwc-stage-conf-num { color: #b03c3c; }
.qwc-stage-empty {
  font-family: var(--sans);
  font-size: 11px;
  font-style: italic;
  color: var(--text-faint);
  list-style: none;
  padding: 4px 0;
}
.qwc-policy-list { list-style: none; padding: 0; margin: 0; }
.qwc-policy-row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--mono);
  font-size: 11px;
  padding: 2px 0;
}
.qwc-policy-row .src-tag-mini {
  background: var(--navy);
  color: #fff;
  font-size: 8.5px;
  padding: 1px 5px;
  border-radius: 2px;
  letter-spacing: 0.06em;
  font-weight: 700;
  font-family: var(--sans);
}
.qwc-policy-name { color: var(--text-dark); font-weight: 600; }
.qwc-policy-ver {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid var(--border-soft);
  padding: 1px 5px;
  border-radius: 2px;
}
.qwc-policy-sub { padding-top: 4px; }
.qwc-policy-note {
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}

/* Right-pane result blocks (Suggested services / Pricing rules /
   Quote history) — surfaced inside #qwQuoteBody so they only appear
   after Suggest completes. */
.qw-result-block {
  background: rgba(239, 234, 217, 0.20);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
  padding: 10px 12px;
  margin-top: 14px;
}
.qrb-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 8px;
}
.qrb-head h4 {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--navy-deep);
  margin: 0;
}
.qrb-sub {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  letter-spacing: 0.04em;
}

/* Compact summary block in the left pane of the quote workspace
   (From / Service match / Anchor). Replaces the wide qw-summary
   grid that used to sit at the top. */
.qw-summary-compact {
  background: rgba(239, 234, 217, 0.30);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
  padding: 8px 10px;
  margin-bottom: 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.qsc-row { display: flex; gap: 8px; font-size: 11.5px; }
.qsc-key {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 600;
  min-width: 80px;
}
.qsc-val {
  font-family: var(--sans);
  color: var(--text-dark);
  font-weight: 500;
  flex: 1 1 auto;
  min-width: 0;
  word-break: break-word;
}

/* Reference panel sits below the workspace grid (history / policy /
   sources) as a 3-column card so the left pane stays focused on
   inquiry + services. */
.qw-reference-card { margin-top: 18px; }
.qw-reference-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  padding: 6px 4px;
}

/* Suggested-services section in the left pane (no longer in a
   two-column grid since it now lives below Customer ask). */
.qw-suggested-services {
  margin-top: 12px;
}

/* Inquiry summary block: customer ask + suggested service items (with
   manual price entry for items lacking a reference price). Now lives
   inside the iw-input left pane — drop the page-level padding /
   border that the wider top-block variant carried. */
.qw-inquiry-summary {
  background: transparent;
  border-bottom: none;
  padding: 0;
  margin-top: 6px;
}
.qis-head {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-bottom: 8px;
}
.qis-head h3 {
  font-family: var(--serif);
  font-size: 14px;
  color: var(--navy-deep);
  margin: 0;
}
.qis-meta {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  letter-spacing: 0.04em;
}
.qis-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: 18px;
}
.qis-col h4 {
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text-med);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin: 0 0 4px;
}
.qis-sub {
  font-family: var(--sans);
  font-size: 10px;
  color: var(--text-faint);
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  margin-left: 6px;
}
.qis-ask-text {
  font-family: var(--sans);
  font-size: 11.5px;
  line-height: 1.5;
  background: rgba(239, 234, 217, 0.35);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
  padding: 8px 10px;
  margin: 0;
  white-space: pre-wrap;
  color: var(--text-med);
  max-height: 200px;
  overflow: auto;
}
.qis-services {
  list-style: none;
  padding: 0;
  margin: 0 0 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.qis-svc-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 10px;
  border: 1px solid var(--border-soft);
  border-left: 3px solid rgba(155, 175, 161, 0.55);
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.7);
  font-size: 11.5px;
}
.qis-svc-row.qis-svc-manual {
  border-left-color: var(--gold);
  background: rgba(239, 234, 217, 0.35);
}
.qis-svc-main {
  flex: 1 1 auto;
  min-width: 0;
}
.qis-svc-name { font-weight: 600; color: var(--navy-deep); }
.qis-svc-note { font-size: 10.5px; color: var(--text-faint); margin-top: 2px; }
.qis-svc-price {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.qis-svc-ref { font-family: var(--mono); font-size: 11.5px; font-weight: 700; color: var(--navy); }
.qis-svc-qty { font-family: var(--mono); font-size: 10.5px; color: var(--text-faint); }
.qis-svc-manual-input {
  width: 110px;
  padding: 3px 6px;
  font-family: var(--mono);
  font-size: 11px;
  border: 1px solid var(--gold);
  border-radius: 3px;
  background: #fff;
}
.qis-svc-manual-flag {
  font-family: var(--sans);
  font-size: 9.5px;
  color: #8a6f2e;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.qis-foot-hint {
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-faint);
  margin: 4px 0 0;
  font-style: italic;
}

/* Editable line items in the quote table. */
.qline-input {
  width: 80px;
  padding: 3px 6px;
  font-family: var(--mono);
  font-size: 12px;
  text-align: right;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: #fff;
}
.qline-input:focus {
  outline: none;
  border-color: var(--navy);
  box-shadow: 0 0 0 2px rgba(31, 78, 121, 0.15);
}
.qline-qty { width: 60px; }
.qline-unit { width: 90px; }

/* Quote audit summary (editable textarea + Rewrite button). */
.quote-audit-block {
  margin-top: 16px;
  padding: 12px 14px;
  background: rgba(239, 234, 217, 0.30);
  border: 1px solid var(--border-soft);
  border-radius: 5px;
}
.quote-audit-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}
.quote-audit-head h4 {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--navy-deep);
  margin: 0;
}
.quote-audit-text {
  width: 100%;
  min-height: 100px;
  padding: 8px 10px;
  font-family: var(--mono);
  font-size: 11.5px;
  line-height: 1.5;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: #fff;
  resize: vertical;
  box-sizing: border-box;
}
.quote-audit-status {
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-faint);
  margin-top: 4px;
  font-style: italic;
}

/* PDF quote — variant of pdf-report for the line-item table. */
.pdf-quote-table { width: 100%; }
.pdf-quote-table td.num, .pdf-quote-table th.num { text-align: right; }
.pdf-quote-note { font-size: 11px; color: var(--text-faint); margin-top: 2px; }

/* Real-quote PDF template: service-provider header, bill-to block,
   clean line item table, terms, signatures. */
.pdf-quote .pdf-quote-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 2px solid var(--navy);
  padding-bottom: 14px;
  margin-bottom: 18px;
}
.pdf-quote-provider-name {
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 700;
  color: var(--navy-deep);
  margin-bottom: 4px;
}
.pdf-quote-provider-line {
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text-med);
  line-height: 1.5;
}
.pdf-quote-title-block { text-align: right; }
.pdf-quote-title {
  font-family: var(--serif);
  font-size: 26px;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: 0.18em;
}
.pdf-quote-no {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text-med);
  margin-top: 4px;
}

.pdf-quote-parties {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 28px;
  margin-bottom: 18px;
}
.pdf-quote-block-label {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-bottom: 5px;
}
.pdf-quote-cust-name {
  font-family: var(--serif);
  font-size: 14px;
  font-weight: 700;
  color: var(--navy-deep);
  margin-bottom: 2px;
}
.pdf-quote-cust-line {
  font-family: var(--sans);
  font-size: 11.5px;
  color: var(--text-med);
  line-height: 1.5;
}
.pdf-quote-dates {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-family: var(--sans);
  font-size: 11.5px;
  color: var(--text-dark);
}
.pdf-quote-key {
  display: inline-block;
  min-width: 100px;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
}

.pdf-quote-project {
  background: rgba(239, 234, 217, 0.30);
  border-left: 3px solid var(--gold);
  padding: 8px 12px;
  margin-bottom: 16px;
  border-radius: 3px;
}
.pdf-quote-project-title {
  font-family: var(--serif);
  font-size: 13px;
  font-weight: 700;
  color: var(--navy-deep);
}
.pdf-quote-project-sub {
  font-family: var(--sans);
  font-size: 11.5px;
  color: var(--text-med);
  margin-top: 2px;
}

.pdf-quote-items {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 18px;
  font-size: 11.5px;
}
.pdf-quote-items thead th {
  background: var(--navy);
  color: #fff;
  padding: 8px 10px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 700;
}
.pdf-quote-items th.col-no,
.pdf-quote-items td.col-no { width: 32px; text-align: center; }
.pdf-quote-items th.col-num,
.pdf-quote-items td.col-num { text-align: right; width: 90px; }
.pdf-quote-items tbody td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--border-soft);
  font-family: var(--sans);
  color: var(--text-dark);
}
.pdf-quote-items tbody tr:nth-child(even) td { background: rgba(239, 234, 217, 0.18); }
.pdf-quote-items tfoot td {
  padding: 6px 10px;
  border-bottom: 1px solid var(--border-soft);
  font-family: var(--sans);
  color: var(--text-dark);
}
.pdf-quote-items tfoot tr.pdf-quote-grand td {
  border-top: 2px solid var(--navy);
  border-bottom: none;
  background: rgba(31, 78, 121, 0.06);
  font-size: 13px;
  padding-top: 9px;
}

.pdf-quote-terms {
  background: rgba(31, 78, 121, 0.03);
  border: 1px solid var(--border-soft);
  border-radius: 3px;
  padding: 10px 14px;
  margin-bottom: 22px;
}
.pdf-quote-terms ul {
  list-style: disc;
  margin: 0;
  padding-left: 20px;
}
.pdf-quote-terms li {
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text-med);
  line-height: 1.5;
  padding: 1px 0;
}

.pdf-quote-foot {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  padding-top: 12px;
  border-top: 1px solid var(--border-soft);
}
.pdf-quote-sign-line {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 700;
}
.pdf-quote-sign-rule {
  border-bottom: 1px solid var(--text-light);
  height: 28px;
  margin: 4px 0 4px;
}
.pdf-quote-sign-meta {
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}
.pdf-quote-docid {
  text-align: center;
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--text-faint);
  letter-spacing: 0.04em;
  margin-top: 14px;
}
.qw-sum-block { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.qw-sum-key {
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.qw-sum-val {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--navy);
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qw-grid {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
}

.qw-pane {}
.qw-quote { border-right: 1px solid var(--border-soft); min-height: 480px; }
.qw-reference { background: var(--off-white); }

/* Quote draft empty / loader / body */
.qw-empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 60px 50px; min-height: 380px;
}
.qw-empty .empty-glyph { color: var(--gold); font-size: 48px; opacity: 0.7; margin-bottom: 14px; font-family: var(--serif); }
.qw-empty h3 { font-family: var(--serif); color: var(--navy); font-size: 20px; font-weight: 400; margin-bottom: 10px; }
.qw-empty p { color: var(--text-light); font-size: 13.5px; max-width: 420px; margin-bottom: 18px; line-height: 1.6; }

.qw-loader { padding: 50px 40px; }

.qw-quote-body { padding: 22px 24px; animation: fadeIn 0.4s ease-out; }

/* Line items table */
.qline-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.qline-table thead th {
  text-align: left;
  padding: 10px 12px;
  background: var(--paper);
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  border-bottom: 1px solid var(--border);
}
.qline-table th.num, .qline-table td.num { text-align: right; }
.qline-table tbody td {
  padding: 12px;
  border-bottom: 1px solid var(--border-soft);
  vertical-align: top;
}
.qline-item {
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 3px;
}
.qline-note {
  font-size: 11.5px;
  color: var(--text-light);
  font-style: italic;
}

/* Stage-group header row inside the line table. */
.qline-table tbody tr.qline-stage-head td {
  background: rgba(31, 78, 121, 0.06);
  border-top: 1px solid rgba(31, 78, 121, 0.18);
  border-bottom: 1px solid rgba(31, 78, 121, 0.18);
  padding: 6px 12px;
  vertical-align: middle;
}
.qline-table .qline-stage-label {
  font-family: var(--sans);
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--navy-deep);
}
.qline-table .qline-stage-sub {
  font-family: var(--mono);
  font-size: 11.5px;
  font-weight: 700;
  color: var(--navy);
  text-align: right;
}

/* Per-line Rationale toggle + reliability inline (mirror of the
   methodology choice card per-stage actions row). */
.qline-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.qline-rat-toggle {
  background: var(--gold-tint);
  color: #6e5e3e;
  border: 1px solid rgba(197, 181, 154, 0.55);
  border-radius: 3px;
  padding: 2px 8px;
  font-family: var(--sans);
  font-size: 10.5px;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.qline-rat-toggle:hover { background: rgba(232, 220, 196, 0.7); color: var(--navy); border-color: var(--gold); }
.qline-rat-caret {
  display: inline-block;
  transition: transform 0.15s;
  font-size: 10px;
}
.qline-rat-toggle.is-open .qline-rat-caret { transform: rotate(90deg); }

/* Expanded row below a line carrying rationale + source pills. */
.qline-rat-row > td {
  background: rgba(239, 234, 217, 0.20);
  border-top: none !important;
  padding: 8px 12px 10px !important;
}
.qline-rat-list {
  list-style: none;
  padding: 0;
  margin: 0 0 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.qline-rat-list li {
  font-family: var(--sans);
  font-size: 11.5px;
  color: var(--text-med);
  line-height: 1.5;
  padding-left: 10px;
  border-left: 2px solid var(--gold);
}
.qline-rat-list li b {
  color: var(--navy-deep);
  font-weight: 700;
  margin-right: 4px;
}
.qline-rat-empty {
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text-faint);
  font-style: italic;
  margin-bottom: 6px;
}

/* User-rationale textarea inside the per-line Rationale expand row.
   Always present; the row picks up a "rationale needed" badge if a
   line is edited without text typed here. */
.qline-userrat {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed var(--border);
}
.qline-userrat-label {
  display: block;
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-bottom: 4px;
}
.qline-userrat-text {
  width: 100%;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: #fff;
  font-family: var(--sans);
  font-size: 11px;
  line-height: 1.4;
  color: var(--text-dark);
  resize: vertical;
  box-sizing: border-box;
}
.qline-userrat-text:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 2px rgba(197, 161, 78, 0.18);
}

/* "Rationale needed" flag on rows whose qty / unit has been edited
   from the original suggestion but no user rationale is typed. */
.qline-table tr.qline-edited-no-rat .qline-item::after {
  content: " ⚠ rationale needed";
  font-family: var(--sans);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #b03c3c;
  margin-left: 6px;
  background: rgba(176, 60, 60, 0.10);
  padding: 1px 6px;
  border-radius: 2px;
  vertical-align: middle;
  white-space: nowrap;
}
.qline-table tr.qline-edited:not(.qline-edited-no-rat) td:first-child {
  border-left: 3px solid var(--gold);
}

/* Manual-price row highlight + flag. */
.qline-table tr.qline-manual-row td {
  background: rgba(239, 234, 217, 0.30);
}
.qline-manual-flag {
  font-family: var(--sans);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #8a6f2e;
  text-transform: uppercase;
  margin-left: 4px;
}
.qline-input.qline-unit-manual {
  border-color: var(--gold);
  background: #fff;
}

/* Per-stage pricing comparable matrix. Mirrors the methodology matrix
   layout: stage rows × past-quote columns, with this quote anchored
   to the second column. */
.pc-mx-wrap { overflow-x: auto; }
.pc-matrix {
  width: 100%;
  border-collapse: collapse;
  font-size: 11.5px;
  margin: 6px 0 8px;
}
.pc-matrix th, .pc-matrix td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--border-soft);
  text-align: right;
  white-space: nowrap;
  vertical-align: top;
}
.pc-matrix thead th {
  background: rgba(239, 234, 217, 0.30);
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  font-weight: 700;
  border-bottom: 1px solid var(--border);
  vertical-align: bottom;
}
.pc-matrix .pc-mx-stage-head,
.pc-matrix .pc-mx-stage-cell {
  text-align: left;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 700;
  color: var(--navy-deep);
  letter-spacing: 0.02em;
  text-transform: none;
}
.pc-matrix .pc-mx-mine-head {
  background: rgba(31, 78, 121, 0.08);
}
.pc-matrix .pc-mx-mine {
  font-family: var(--mono);
  font-weight: 700;
  color: var(--navy);
  background: rgba(31, 78, 121, 0.04);
}
.pc-matrix .pc-mx-col.pc-mx-anchor { background: rgba(197, 161, 78, 0.16); }
.pc-matrix .pc-mx-anchor-cell { background: rgba(197, 161, 78, 0.08); }
.pc-matrix .pc-mx-anchor-tag {
  font-family: var(--sans);
  font-size: 8.5px;
  background: var(--gold);
  color: #fff;
  padding: 1px 4px;
  border-radius: 2px;
  letter-spacing: 0.06em;
  font-weight: 700;
  text-transform: uppercase;
  margin-left: 4px;
}
.pc-matrix .pc-mx-qid {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 700;
  color: var(--navy-deep);
  text-align: right;
}
.pc-matrix .pc-mx-meta {
  font-family: var(--sans);
  font-size: 9.5px;
  color: var(--text-faint);
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  margin-top: 2px;
}
.pc-matrix .pc-mx-cell {
  font-family: var(--mono);
  color: var(--text-med);
}
.pc-matrix .pc-mx-val { font-weight: 600; }
.pc-matrix .pc-mx-delta {
  font-size: 10px;
  font-weight: 600;
  margin-top: 1px;
}
.pc-matrix .pc-mx-delta.pc-up { color: #b03c3c; }
.pc-matrix .pc-mx-delta.pc-down { color: #2f8f4f; }
.pc-matrix .pc-mx-delta.pc-flat { color: var(--text-faint); }
.pc-matrix tfoot .pc-mx-foot-row th,
.pc-matrix tfoot .pc-mx-foot-row td {
  border-top: 2px solid var(--navy);
  border-bottom: none;
  padding-top: 8px;
  background: rgba(31, 78, 121, 0.04);
}

/* Sample-count row at the top of the matrix body. */
.pc-matrix .pc-mx-sample-row th,
.pc-matrix .pc-mx-sample-row td {
  background: rgba(239, 234, 217, 0.30);
  border-bottom: 1px solid var(--border);
}
.pc-matrix .pc-mx-sample .pc-mx-val { font-weight: 700; color: var(--navy-deep); }
.pc-matrix .pc-mx-sample .pc-mx-delta { font-family: var(--mono); }

/* Pricing comparable section header (per-stage matrix block above
   the anchor sources matrix). Keeps the two blocks visually distinct. */
.pc-section { margin-top: 10px; }
.pc-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
}
.pc-section-head h4 {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--navy-deep);
  margin: 0;
}
.pc-section-sub {
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}

/* Anchor sources block — sits below the per-stage matrix as its own
   section. Reuses the Knowledge-matrix (.mm-) chrome for the table +
   selector to match that visual exactly. */
.pc-anchor-section {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

/* Past-quote pill (analogue of ki-src-pill variants on Knowledge). */
.ki-src-pill.src-quote-anchor {
  background: rgba(197, 161, 78, 0.22);
  color: #6e5e3e;
  border-color: rgba(197, 181, 154, 0.55);
}
/* Small row-sub badge next to the sample-count pill (similarity %). */
.mm-row-sub {
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--text-faint);
  margin-left: 6px;
  letter-spacing: 0.04em;
}

/* Richer candidate-anchor toggle layout: Quote ID + full title on
   line 1, similarity + detail (total / samples / date) on line 2,
   why text on line 3. */
.qas-toggle {
  align-items: flex-start !important;
  padding: 8px 10px !important;
}
.qas-toggle-main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.qas-toggle-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.qas-toggle-title {
  font-family: var(--sans);
  font-size: 11.5px;
  font-weight: 600;
  color: var(--text-dark);
  flex: 1 1 auto;
  min-width: 0;
}
.qas-toggle-meta {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-family: var(--mono);
  font-size: 10.5px;
  color: var(--text-faint);
  flex-wrap: wrap;
}
.qas-toggle-sim {
  font-weight: 700;
  color: var(--navy);
}
.qas-toggle-detail { color: var(--text-med); }
.qas-toggle-why {
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text-med);
  font-style: italic;
  line-height: 1.45;
  margin-top: 2px;
}

/* Anchor sources × stages matrix (rows = selectable past quotes,
   columns = pipeline stages). Mirror of the Knowledge methodology
   matrix layout but using past quote totals as the analogue of
   source candidates. */
.pc-anchor-matrix {
  margin-top: 14px;
}
.pc-anchor-matrix-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
}
.pc-anchor-matrix-head h4 {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--navy-deep);
  margin: 0;
}
.pc-anchor-matrix-sub {
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}
.pc-anchor-mx {
  width: 100%;
  border-collapse: collapse;
  font-size: 11.5px;
}
.pc-anchor-mx thead th {
  background: rgba(239, 234, 217, 0.30);
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  font-weight: 700;
  border-bottom: 1px solid var(--border);
  padding: 6px 8px;
  text-align: left;
}
.pc-anchor-mx .pc-as-stagehead { text-align: right; min-width: 80px; }
.pc-anchor-mx .pc-as-rowhead {
  padding: 6px 8px;
  border-bottom: 1px solid var(--border-soft);
  text-align: left;
  vertical-align: top;
  background: rgba(255, 255, 255, 0.6);
  min-width: 140px;
}
.pc-anchor-mx .pc-as-rowhead-head { text-align: left; }
.pc-anchor-mx .pc-as-check {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.pc-anchor-mx .pc-as-check input[type="checkbox"] {
  accent-color: var(--navy);
  margin: 0;
}
.pc-as-qid {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  color: var(--navy-deep);
}
.pc-anchor-mx .pc-mx-anchor-tag {
  font-family: var(--sans);
  font-size: 8.5px;
  background: var(--gold);
  color: #fff;
  padding: 1px 4px;
  border-radius: 2px;
  letter-spacing: 0.06em;
  font-weight: 700;
  text-transform: uppercase;
  margin-left: 4px;
}
.pc-as-meta {
  font-family: var(--sans);
  font-size: 9.5px;
  color: var(--text-faint);
  font-weight: 500;
  margin-top: 2px;
  line-height: 1.4;
}
.pc-anchor-mx .pc-as-cell {
  padding: 6px 8px;
  border-bottom: 1px solid var(--border-soft);
  text-align: right;
  vertical-align: top;
  font-family: var(--mono);
  color: var(--text-med);
}
.pc-anchor-mx .pc-as-anchor-cell {
  background: rgba(197, 161, 78, 0.08);
}
.pc-anchor-mx .pc-as-anchor-rowhead {
  background: rgba(197, 161, 78, 0.10);
}
.pc-anchor-mx .pc-as-row-dim { opacity: 0.45; }
.pc-anchor-mx .pc-as-row-dim .pc-as-val,
.pc-anchor-mx .pc-as-row-dim .pc-as-delta { font-style: italic; }
.pc-as-val { font-weight: 600; }
.pc-as-delta {
  font-size: 10px;
  font-weight: 600;
  margin-top: 1px;
}
.pc-as-delta.pc-up { color: #b03c3c; }
.pc-as-delta.pc-down { color: #2f8f4f; }
.pc-as-delta.pc-flat { color: var(--text-faint); }
.pc-anchor-mx .pc-as-mine-row .pc-as-rowhead,
.pc-anchor-mx .pc-as-mine-row .pc-as-mine-cell {
  background: rgba(31, 78, 121, 0.05);
  border-bottom: 2px solid var(--navy);
}
.pc-as-mine-label {
  font-family: var(--serif);
  font-size: 12px;
  font-weight: 700;
  color: var(--navy);
}
.pc-anchor-mx .pc-as-mine-cell {
  text-align: left;
  font-family: var(--sans);
}
.pc-as-item-pill {
  display: inline-block;
  padding: 2px 6px;
  margin: 1px 3px 1px 0;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid var(--border);
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-dark);
  white-space: nowrap;
}
.pc-as-empty { font-family: var(--sans); font-size: 11px; color: var(--text-faint); }

/* Notable item differences section below the matrix. */
.pc-itemdiff {
  margin-top: 12px;
  padding: 10px 12px;
  background: rgba(70, 110, 80, 0.04);
  border: 1px solid var(--border-soft);
  border-left: 3px solid rgba(70, 110, 80, 0.55);
  border-radius: 4px;
}
.pc-itemdiff-head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-bottom: 6px;
}
.pc-itemdiff-head h4 {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--navy-deep);
  margin: 0;
}
.pc-itemdiff-sub {
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}
.pc-itemdiff-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.pc-itemdiff-list li {
  display: grid;
  grid-template-columns: minmax(140px, 0.5fr) 1fr;
  gap: 8px;
  align-items: baseline;
  font-size: 11.5px;
}
.pc-itemdiff-stage {
  font-family: var(--sans);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--navy);
}
.pc-itemdiff-items {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.pc-itemdiff-pill {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid var(--border);
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-dark);
}
.pc-itemdiff-anchor-why {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed rgba(70, 110, 80, 0.30);
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text-med);
  font-style: italic;
  line-height: 1.45;
}

/* The pricing-comparable matrix sits inside an iw-cmp collapsible
   when on the quote workspace; remove the default panel border so the
   collapsible's own border-bottom doesn't double up. */
.iw-cmp-body .pricing-comparable { padding: 0; }

.qline-table tfoot .qf-row td {
  padding: 8px 12px;
  border-bottom: 1px solid var(--border-soft);
}
.qf-row .lbl {
  text-align: right;
  font-size: 12.5px;
  color: var(--text-light);
}
.qf-row.discount .num { color: var(--good); }
.qf-row.qf-total td {
  border-top: 2px solid var(--navy);
  border-bottom: none;
  padding-top: 12px;
}
.qf-row.qf-total .lbl {
  font-family: var(--serif);
  font-size: 14px;
  color: var(--navy);
  font-weight: 700;
}
.qf-row.qf-total .num {
  font-family: var(--serif);
  font-size: 22px;
  color: var(--navy);
  font-weight: 700;
}

/* Pricing comparable panel (Quote page, shown after Suggest quote runs) */
.pricing-comparable {
  margin-top: 22px;
  padding: 14px 16px;
  background: rgba(239, 234, 217, 0.55);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 5px;
}
.pc-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-soft);
  flex-wrap: wrap;
}
.pc-head h4 {
  font-family: var(--serif);
  font-size: 14px;
  color: var(--navy-deep);
  margin: 0;
}
.pc-this { font-size: 11.5px; color: var(--text-med); }
.pc-this b { color: var(--navy-deep); font-family: var(--mono); }
.pc-lane {
  margin-left: auto;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  padding: 3px 8px;
  border-radius: 3px;
  font-weight: 600;
  text-transform: uppercase;
}
.pc-lane-self { background: rgba(70,110,80,0.18); color: #2f5b3e; }
.pc-lane-mgr  { background: rgba(196,160,76,0.22); color: #8a6312; }
.pc-lane-ceo  { background: rgba(176,60,60,0.18); color: #b03c3c; }

.pc-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.pc-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
  padding: 8px 10px;
  background: rgba(255,255,255,0.6);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
}
.pc-row-main { display: flex; align-items: center; gap: 8px; }
.pc-qid {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 700;
  color: var(--navy-deep);
}
.pc-title { font-size: 11.5px; color: var(--text-dark); font-weight: 600; }
.pc-anchor-tag {
  font-family: var(--mono);
  font-size: 9px;
  background: var(--gold);
  color: #fff;
  padding: 1px 5px;
  border-radius: 2px;
  letter-spacing: 0.04em;
}
.pc-when {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  margin-left: auto;
}
.pc-row-stats {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--mono);
  font-size: 11px;
}
.pc-past-total { color: var(--text-med); }
.pc-delta { font-weight: 700; }
.pc-delta.pc-up   { color: #b03c3c; }
.pc-delta.pc-down { color: #2f5b3e; }
.pc-delta.pc-flat { color: var(--text-faint); }
.pc-pct { font-weight: 500; font-size: 10px; }
.pc-sim { margin-left: auto; color: var(--text-faint); font-size: 10px; letter-spacing: 0.03em; }
.pc-why { font-size: 10.5px; color: var(--text-med); line-height: 1.4; font-style: italic; }
.pc-foot {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--border-soft);
  font-size: 10.5px;
  color: var(--text-med);
}
.pc-foot code {
  font-family: var(--mono);
  font-size: 10px;
  background: rgba(255,255,255,0.7);
  padding: 1px 4px;
  border-radius: 2px;
}

.qrationale {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--border-soft);
}
.qrationale h4 {
  font-family: var(--serif);
  font-size: 13px;
  color: var(--navy);
  font-weight: 700;
  margin-bottom: 10px;
}
.qrationale ul { list-style: none; }
.qrationale li {
  padding: 9px 0;
  border-bottom: 1px dashed var(--border-soft);
}
.qrationale li:last-child { border-bottom: none; }
.qrat-line {
  font-family: var(--serif);
  font-size: 12.5px;
  color: var(--gold);
  font-weight: 700;
  margin-bottom: 4px;
}
.qrat-text { font-size: 12.5px; color: var(--text-med); line-height: 1.55; }

.qw-quote-body .result-actions {
  padding: 18px 0 0;
  border-top: 1px solid var(--border-soft);
  margin-top: 18px;
}

/* Reference panel */
.qw-reference { padding: 0; }
.qw-reference .iw-head { background: var(--off-white); padding: 18px 22px 14px; }
.qref-section {
  padding: 16px 22px;
  border-bottom: 1px solid var(--border-soft);
}
.qref-section:last-child { border-bottom: none; }
.qref-section h4 {
  font-size: 10.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-bottom: 10px;
}
.qref-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.qref-list li {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  font-size: 12px;
}
.qref-list li.anchor {
  border-color: var(--gold);
  border-left: 3px solid var(--gold);
  background: var(--gold-tint);
}
.qref-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 4px;
}
.qref-id, .qref-rule {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--navy);
  font-weight: 700;
}
.qref-total, .qref-val {
  font-family: var(--serif);
  font-size: 14px;
  color: var(--navy);
  font-weight: 700;
}
.qref-title { color: var(--text-dark); margin-bottom: 4px; }
.qref-meta {
  display: flex;
  gap: 8px;
  font-family: var(--mono);
  font-size: 10.5px;
  color: var(--text-faint);
  margin-bottom: 6px;
}
.similarity { color: var(--good); font-weight: 700; }
.anchor-tag {
  background: var(--gold);
  color: #fff;
  padding: 1px 6px;
  border-radius: 3px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.qref-why { font-size: 11.5px; color: var(--text-light); font-style: italic; line-height: 1.5; }

.qref-list.policy li { padding: 9px 12px; }
.qref-source {
  font-family: var(--mono);
  font-size: 10.5px;
  color: var(--text-faint);
  margin-top: 2px;
}

.qref-list .src-link {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  transition: border-color 0.12s;
  padding: 9px 12px;
}
.qref-list .src-link:hover { border-color: var(--gold); }
.src-tag-mini {
  font-family: var(--mono);
  font-size: 9px;
  background: var(--paper);
  color: var(--navy);
  padding: 2px 6px;
  border-radius: 3px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

@media (max-width: 1100px) {
  .qw-summary { grid-template-columns: 1fr 1fr; }
  .qw-grid { grid-template-columns: 1fr; }
  .qw-quote { border-right: none; border-bottom: 1px solid var(--border-soft); }
  .qkpi { grid-template-columns: 1fr; }
}

/* ============================================================
   TOAST + MODAL (shared)
   ============================================================ */
.toast {
  position: fixed; bottom: 28px; right: 28px;
  background: var(--navy); color: #fff;
  padding: 11px 16px; border-radius: var(--radius-sm);
  font-size: 13px;
  box-shadow: var(--shadow-lg);
  opacity: 0; transform: translateY(8px);
  transition: opacity 0.2s, transform 0.2s;
  pointer-events: none; z-index: 100;
}
.toast.show { opacity: 1; transform: translateY(0); }

.modal-backdrop {
  position: fixed; inset: 0;
  background: rgba(31, 78, 121, 0.32);
  display: flex; align-items: center; justify-content: center;
  z-index: 200;
  animation: fadeIn 0.2s;
}
.modal {
  background: #fff;
  border-radius: var(--radius);
  padding: 28px 32px;
  max-width: 460px; width: 90%;
  box-shadow: var(--shadow-lg);
  border-top: 4px solid var(--gold);
}
.modal h3 { font-family: var(--serif); color: var(--navy); font-size: 19px; margin-bottom: 12px; }
.modal p { font-size: 13.5px; color: var(--text-med); line-height: 1.65; margin-bottom: 22px; }
.modal-actions { display: flex; gap: 10px; justify-content: flex-end; }

/* Stacked modal: dynamically-created popup that layers ON TOP of the
   existing #modalBackdrop. Used so "Open PDF report" from the inquiry
   preview opens in its own popup without dismissing the preview. */
.modal-backdrop-stacked {
  position: fixed; inset: 0;
  background: rgba(15, 30, 50, 0.55);
  display: flex; align-items: center; justify-content: center;
  z-index: 320;
  animation: fadeIn 0.18s;
  padding: 24px;
  overflow: auto;
}
.modal-stacked {
  background: #fff;
  border-radius: var(--radius);
  padding: 0;
  width: min(1100px, calc(100vw - 48px));
  max-height: calc(100vh - 48px);
  box-shadow: var(--shadow-lg);
  border-top: 4px solid var(--gold);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.modal-stacked .modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px 10px;
  border-bottom: 1px solid var(--border-soft);
  background: rgba(239, 234, 217, 0.35);
}
.modal-stacked .modal-title {
  font-family: var(--serif);
  font-size: 16px;
  color: var(--navy);
  margin: 0;
  font-weight: 600;
}
.modal-stacked-x {
  background: none;
  border: none;
  font-size: 22px;
  line-height: 1;
  color: var(--text-med);
  cursor: pointer;
  padding: 2px 8px;
  border-radius: 3px;
}
.modal-stacked-x:hover { background: rgba(31, 78, 121, 0.08); color: var(--navy); }
.modal-stacked-body {
  padding: 18px 22px;
  overflow: auto;
  flex: 1 1 auto;
}
.modal-stacked .modal-foot {
  display: flex;
  justify-content: flex-end;
  padding: 10px 20px;
  border-top: 1px solid var(--border-soft);
  background: rgba(239, 234, 217, 0.2);
}

/* ============================================================
   ANIMATIONS
   ============================================================ */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(201, 169, 97, 0.5); }
  50%      { box-shadow: 0 0 0 6px rgba(201, 169, 97, 0); }
}

/* ============================================================
   SIDEBAR COLLAPSED STATE (icon rail, body.nav-collapsed)
   Triggered by the topbar hamburger. Above 900px the sidebar
   becomes a 56px icon rail; below 900px it hides the bottom bar.
   ============================================================ */
body.nav-collapsed .shell {
  grid-template-columns: var(--sidebar-w-collapsed) 1fr;
}
body.nav-collapsed .sidebar {
  padding: 16px 4px;
}
body.nav-collapsed .nav-item {
  justify-content: center;
  padding: 10px 0;
  gap: 0;
}
body.nav-collapsed .nav-label,
body.nav-collapsed .nav-foot,
body.nav-collapsed .nav-spacer { display: none; }
body.nav-collapsed .nav-glyph { width: auto; font-size: 18px; }
body.nav-collapsed .nav-badge {
  position: absolute;
  top: 4px;
  right: 4px;
  min-width: 14px;
  padding: 0 4px;
  font-size: 9px;
  line-height: 14px;
  height: 14px;
  border-radius: 7px;
  text-align: center;
}
body.nav-collapsed .nav-badge:empty { display: none; }
body.nav-collapsed .nav-item.active::before { top: 6px; bottom: 6px; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1100px) {
  .iw-grid { grid-template-columns: 1fr; }
  .iw-input { border-right: none; border-bottom: 1px solid var(--border-soft); }
  .home-grid { grid-template-columns: 1fr; }
  .home-charts { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .topbar { grid-template-columns: 1fr auto; gap: 12px; padding: 0 14px; }
  .for-block { display: none; }
  .shell { grid-template-columns: 1fr; }
  .sidebar {
    position: fixed; bottom: 0; left: 0; right: 0;
    height: auto; flex-direction: row;
    border-right: none; border-top: 1px solid var(--border);
    padding: 6px 8px; gap: 4px;
    overflow-x: auto;
    z-index: 50;
  }
  .nav-item { padding: 8px 10px; flex-direction: column; gap: 2px; }
  .nav-label { font-size: 10px; }
  .nav-spacer, .nav-foot { display: none; }
  .page { padding: 18px 16px 100px; }
  .kpi-row { grid-template-columns: 1fr 1fr; }
  .chat-shell { grid-template-columns: 1fr; }
  .chat-history { display: none; }

  /* In mobile, the collapsed state hides the bottom nav bar entirely. */
  body.nav-collapsed .shell { grid-template-columns: 1fr; }
  body.nav-collapsed .sidebar { display: none; }
  body.nav-collapsed .page { padding-bottom: 24px; }
  body.nav-collapsed .nav-badge {
    position: static; height: auto; min-width: 0; padding: 1px 7px;
    font-size: 10px; line-height: normal; border-radius: 10px;
  }
}

/* ============================================================
   Small-screen polish (<760px and <600px)
   ============================================================ */
@media (max-width: 760px) {
  .topbar { padding: 0 10px; gap: 8px; }
  .brand-by { display: none; }
  .brand-name { font-size: 18px; }
  .dl-mark { width: 18px; height: 32px; }
  .user-block { padding: 4px 6px; }
  .user-text { display: none; }
  .role-dropdown {
    min-width: 0;
    width: min(320px, calc(100vw - 24px));
    right: -4px;
  }
  /* Page-head: stack title and actions on narrow screens */
  .page-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding-bottom: 14px;
    margin-bottom: 18px;
  }
  .page-head h1 { font-size: 22px; }
  .page-sub { font-size: 13px; }
  .page-actions { width: 100%; flex-wrap: wrap; }
  /* Stage breadcrumb: compact pills, no separators */
  .stage-breadcrumb { padding: 5px 10px; gap: 2px; }
  .stage-bc-step { padding: 2px 6px; font-size: 9.5px; }
  .stage-bc-sep { display: none; }
  /* Modal widths */
  .modal { width: calc(100vw - 24px); }
  .modal.modal-wide { max-width: none; width: calc(100vw - 24px); }
  /* Cards adapt */
  .kpi-row { grid-template-columns: 1fr 1fr; gap: 10px; }
  .qkpi { grid-template-columns: repeat(3, 1fr); }
  .admin-tile-grid { grid-template-columns: 1fr 1fr !important; }
  /* Inquiry / Assessment / Approval rows: drop the side age column to its own line */
  .ta-row { grid-template-columns: 1fr; gap: 8px; padding: 12px 14px; }
  .ta-age { text-align: left; min-width: 0; }
  .ta-age-val, .ta-age-lab { display: inline-block; margin-right: 6px; }
  /* Gap radar cols already collapse at 1100px; tighten internal padding */
  .gr-col { padding: 8px 10px; }
  .gr-row { padding: 8px 9px; }
  /* Workspace 2 column intake hides border between left/right when stacked */
  .iw-input { padding: 14px 14px; }
  /* Methodology risk screen 1-col already at 1100px */
  /* Pricing comparable lane preview wraps */
  .pc-head { flex-direction: column; align-items: flex-start; gap: 6px; }
  .pc-lane { margin-left: 0; }
}

@media (max-width: 600px) {
  .topbar { padding: 0 8px; }
  .brand-name { font-size: 16px; }
  .brand-name .brand-year { font-size: 11px; }
  .page { padding: 14px 12px 100px; }
  .kpi-row { grid-template-columns: 1fr; }
  .qkpi { grid-template-columns: 1fr 1fr; }
  .admin-tile-grid { grid-template-columns: 1fr !important; }
  /* Approval banner stacks fully */
  .approval-banner { grid-template-columns: 1fr; gap: 8px; padding: 12px; }
  /* Quote line items: hide qty column on tiny screens, keep total */
  .qline-table th:nth-child(2), .qline-table td:nth-child(2) { display: none; }
  /* Audit textarea: more height */
  .audit-textarea { min-height: 140px; font-size: 12px; }
  /* Stage breadcrumb stays single line but tiny */
  .stage-breadcrumb { width: 100%; justify-content: space-between; }
  /* Result actions wrap */
  .result-actions { flex-wrap: wrap; gap: 6px; padding: 12px 14px; }
}

@media print {
  .topbar, .sidebar, .page-actions, .result-actions, .output-toggle, .empty-state, .loading-state, .chat-input-bar, .chat-suggestions, .chat-history { display: none; }
  .shell { display: block; }
  .page { padding: 0; }
  .card, .inquiry-workspace { box-shadow: none; }
}

/* ============================================================
   Scenario + persona extensions (sketch additions, 2026-05-12)
   ============================================================ */

/* Inquiry list, star + rule pill */
.iq-star { color: var(--gold, #c4a04c); margin-right: 4px; }
.iq-rule { display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 8px; font-size: 11px; background: rgba(196,160,76,0.12); color: #8a6a1f; }
.iq-rule.high_value { background: rgba(196,160,76,0.18); color: #6a4e0f; }
.iq-rule.very_high { background: rgba(180,60,60,0.16); color: #8a1f1f; }
.iq-rule.high_value_borderline { background: rgba(196,160,76,0.10); color: #8a6a1f; }

/* Portfolio scan (Projects page) */
.ps-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 18px; margin: 12px 0 18px; }
.ps-meta-row { display: flex; gap: 12px; font-size: 13px; }
.ps-key { color: #666; min-width: 110px; font-weight: 600; }
.ps-h4 { margin: 20px 0 8px; font-size: 14px; color: #333; }
.ps-candidates { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.ps-cand { border: 1px solid #e6e6e6; border-radius: 8px; padding: 14px 16px; background: #fafafa; }
.ps-cand.pilot { border-left: 3px solid #2f8f4f; }
.ps-cand.adopt { border-left: 3px solid #1f6e3a; }
.ps-cand.defer { border-left: 3px solid #999; }
.ps-cand.decline { border-left: 3px solid #b03c3c; }
.ps-cand-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.ps-cand-name { font-weight: 600; font-size: 14px; }
.ps-cand-rec { padding: 2px 8px; border-radius: 10px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; }
.ps-cand-rec.pilot { background: #d8efdf; color: #1f6e3a; }
.ps-cand-rec.adopt { background: #c4e5cf; color: #1f6e3a; }
.ps-cand-rec.defer { background: #e8e8e8; color: #555; }
.ps-cand-rec.decline { background: #f0d0d0; color: #8a1f1f; }
.ps-cand-sum { font-size: 13px; color: #444; margin-bottom: 10px; line-height: 1.5; }
.ps-cand-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 18px; font-size: 12px; margin-bottom: 8px; }
.ps-cand-grid > div { display: flex; gap: 8px; }
.ps-cand-reason { font-size: 12px; color: #555; padding-top: 8px; border-top: 1px dashed #ddd; }
.ps-footnote { font-size: 11px; color: #888; margin-top: 16px; }
.ps-footnote code { background: #f0f0f0; padding: 1px 5px; border-radius: 3px; }

/* Admin self-service grid */
.admin-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 8px; }
.admin-card { padding: 12px 14px; border: 1px solid #e6e6e6; border-radius: 8px; background: #fff; cursor: pointer; transition: all 0.15s; }
.admin-card:hover { border-color: #c4a04c; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.admin-card h4 { margin: 0 0 6px; font-size: 13px; font-weight: 600; }
.admin-card .admin-desc { font-size: 12px; color: #555; line-height: 1.5; margin: 0 0 10px; }
.admin-meta { display: flex; justify-content: space-between; font-size: 11px; color: #888; }
.admin-editor { font-style: italic; }

/* Admin RBAC + thresholds + KB lists */
.rbac-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.rbac-col h5 { margin: 0 0 8px; font-size: 12px; text-transform: uppercase; color: #666; letter-spacing: 0.5px; }
.rbac-col ul { list-style: none; padding: 0; margin: 0; }
.rbac-col li { padding: 8px 0; border-bottom: 1px solid #f0f0f0; display: flex; flex-direction: column; gap: 2px; font-size: 13px; }
.rbac-col li > .role-tier-pill { align-self: flex-start; margin-top: 2px; }
.rbac-sub { font-size: 11px; color: #888; }

.threshold-list { list-style: none; padding: 0; margin: 0; }
.threshold-list li { padding: 8px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.thr-val { margin-left: auto; font-weight: 600; color: #6a4e0f; }

.kb-list { list-style: none; padding: 0; margin: 0; }
.kb-list li { padding: 8px 0; border-bottom: 1px solid #f0f0f0; font-size: 13px; display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; }
.kb-list code { background: #f4f4f4; padding: 1px 5px; border-radius: 3px; font-size: 11px; }
.kb-auth, .kb-scope { font-size: 11px; color: #888; }

@media (max-width: 900px) {
  .admin-grid { grid-template-columns: repeat(2, 1fr); }
  .ps-meta, .rbac-grid, .ps-cand-grid { grid-template-columns: 1fr; }
}

/* rbac empty hint */
.rbac-empty { font-size: 12px; color: #888; padding: 12px; background: #fafafa; border: 1px dashed #ddd; border-radius: 6px; line-height: 1.5; }

/* ============================================================
   Edit-modal (Admin self-service editors)
   ============================================================ */

/* Wider modal for form-based editors */
.modal.modal-wide { max-width: 720px; }

/* modalBody is now a <div>; keep textContent legacy modal layout */
#modalBody { font-size: 13.5px; color: var(--text-med); line-height: 1.65; margin-bottom: 20px; }

/* Stub banner for non-fully-wired editors */
.stub-banner { padding: 10px 12px; background: var(--paper-2); border-left: 3px solid var(--gold); border-radius: 4px; font-size: 12px; color: var(--text-med); margin: 4px 0 14px; line-height: 1.5; }

/* Form layout */
.edit-form { display: flex; flex-direction: column; gap: 14px; margin: 0; }
.edit-form label { display: flex; flex-direction: column; gap: 4px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-faint); font-weight: 600; }
.edit-form input[type="text"], .edit-form input[type="number"], .edit-form input:not([type]), .edit-form select, .edit-form textarea {
  padding: 8px 10px; border: 1px solid var(--border); border-radius: 6px; font-family: inherit; font-size: 13px; color: var(--text-dark); background: #fff; text-transform: none; letter-spacing: 0; font-weight: 400;
}
.edit-form textarea { min-height: 70px; resize: vertical; font-family: var(--mono, ui-monospace, monospace); font-size: 12px; line-height: 1.5; }
.edit-form input:focus, .edit-form select:focus, .edit-form textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px var(--gold-tint); }
.edit-form .form-row { display: flex; gap: 10px; }
.edit-form .check-row { flex-direction: row; align-items: center; gap: 8px; text-transform: none; font-size: 13px; font-weight: 400; color: var(--text-med); letter-spacing: 0; }
.edit-form .check-row input[type="checkbox"] { width: 14px; height: 14px; }
.edit-hint { font-size: 11px; color: var(--text-faint); line-height: 1.5; }
.edit-hint code { background: #f0f0f0; padding: 1px 5px; border-radius: 3px; font-size: 11px; }

/* Inline table editor (pricing) */
.edit-table { width: 100%; border-collapse: collapse; font-size: 12px; margin-top: 8px; }
.edit-table th { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--border); font-weight: 600; color: var(--text-faint); text-transform: uppercase; font-size: 10px; letter-spacing: 0.06em; }
.edit-table td { padding: 4px 6px; border-bottom: 1px solid var(--border-soft); vertical-align: middle; }
.edit-table input { width: 100%; border: 1px solid transparent; padding: 4px 6px; background: transparent; font-size: 12px; font-family: inherit; border-radius: 3px; }
.edit-table input:focus { outline: none; background: #fff; border-color: var(--gold-soft); }

/* List editor (vendors, staging) */
.edit-list-item { display: flex; align-items: flex-start; gap: 10px; padding: 8px 10px; border: 1px solid var(--border-soft); border-radius: 6px; background: var(--off-white); }
.edit-list-item input[type="checkbox"] { margin-top: 3px; width: 14px; height: 14px; flex-shrink: 0; }
.edit-list-item .item-main { flex: 1; font-size: 13px; color: var(--text-dark); }
.edit-list-item .item-main code { background: #ececec; padding: 1px 5px; border-radius: 3px; font-size: 11px; margin-left: 4px; }
.edit-list-item .item-sub { font-size: 11px; color: var(--text-faint); margin-top: 3px; line-height: 1.5; }

/* Buttons inside editors */
.btn-link { background: none; border: none; color: var(--navy); cursor: pointer; font-size: 11px; text-decoration: underline; padding: 0; }
.btn-link:hover { color: var(--gold); }
.btn-icon { background: transparent; border: 1px solid var(--border-soft); border-radius: 4px; width: 22px; height: 22px; line-height: 1; cursor: pointer; color: var(--text-faint); font-size: 14px; }
.btn-icon:hover { color: #b03c3c; border-color: #b03c3c; }

/* ============================================================
   Sense Library plane (Dr. S. Lee Life Sciences hosted)
   ============================================================ */

/* Inquiry workspace: Sense Library candidate badge + reliability tag */
.cand-source.shared { background: var(--navy); color: #fff; }
.rel-tag.shared { background: var(--navy); color: #fff; padding: 2px 8px; border-radius: 10px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; }

/* Knowledge sources editor: plane metadata chips */
.plane-managed { display: inline-block; padding: 1px 6px; border-radius: 8px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; margin-left: 6px; font-weight: 600; }
.plane-managed.plane-customer    { background: var(--gold-tint); color: #6a4e0f; }
.plane-managed.plane-dr-lee      { background: var(--navy); color: #fff; }
.plane-managed.plane-engineering { background: #e8e8e8; color: #555; }
.plane-routing { font-size: 10px; color: var(--text-faint); margin-left: 4px; font-style: italic; }

/* Sense Library access list */
.shared-row.granted { border-left: 3px solid #2f8f4f; }
.shared-row.pending { border-left: 3px solid var(--gold); background: rgba(196,160,76,0.06); }
.access-pill { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; margin-left: 6px; font-weight: 600; }
.access-pill.access-granted { background: #d8efdf; color: #1f6e3a; }
.access-pill.access-pending { background: rgba(196,160,76,0.20); color: #6a4e0f; }

/* ============================================================
   Methodology + Risk screening block (assessment gate, sits above stages)
   ============================================================ */
.methodology-risk-screen {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr);
  gap: 10px;
  margin: 0 0 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border-soft);
}
.mrs-card {
  padding: 10px 12px;
  background: rgba(239, 234, 217, 0.4);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 5px;
}
.mrs-card-risk { border-left-color: #b03c3c; background: rgba(176, 60, 60, 0.05); }
.mrs-card-risk:not(.mrs-has-flags) { border-left-color: rgba(70,110,80,0.5); background: rgba(70,110,80,0.04); }

/* Suggestion rationale card — sits below the audit summary, mirrors
   the methodology choice card chrome with a sage left-border to set
   it apart from the policy + risk variants. */
.mrs-card-suggest {
  border-left-color: rgba(70, 110, 80, 0.7);
  background: rgba(70, 110, 80, 0.04);
  margin-top: 14px;
}
.qsr-anchor {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 6px 10px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
  margin-bottom: 8px;
  font-size: 11.5px;
}
.qsr-anchor.qsr-anchor-empty {
  font-family: var(--sans);
  font-size: 11px;
  font-style: italic;
  color: var(--text-faint);
  background: transparent;
  border-style: dashed;
}
.qsr-anchor-tag {
  font-family: var(--sans);
  font-size: 9px;
  background: var(--gold);
  color: #fff;
  padding: 1px 6px;
  border-radius: 2px;
  letter-spacing: 0.06em;
  font-weight: 700;
  text-transform: uppercase;
}
.qsr-anchor-qid {
  font-family: var(--mono);
  font-weight: 700;
  color: var(--navy-deep);
}
.qsr-anchor-title { color: var(--text-dark); flex: 1 1 auto; min-width: 0; }
.qsr-anchor-total { font-family: var(--mono); font-weight: 700; color: var(--navy); }
.qsr-anchor-sim,
.qsr-anchor-when {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
}
.qsr-anchor-why {
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text-med);
  font-style: italic;
  margin-bottom: 8px;
  padding-left: 4px;
}
.qsr-empty {
  font-family: var(--sans);
  font-size: 11px;
  font-style: italic;
  color: var(--text-faint);
  padding: 6px 4px;
}

/* Rich note inside a synthesised line row (rationale / source pills /
   reliability tag). Replaces the plain "no reference price" string. */
.qline-rich .qline-note { font-style: normal; color: var(--text-med); }
.qline-stage-tag {
  font-family: var(--sans);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--navy);
  margin-bottom: 3px;
}
.qline-rationale {
  font-size: 11.5px;
  color: var(--text-med);
  line-height: 1.45;
  margin-bottom: 4px;
}
.qline-srcs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 4px;
}
.qline-src-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: 2px 6px;
  font-family: var(--sans);
  font-size: 10px;
  color: var(--text-dark);
}
.qline-src-pill .meth-btn-src-type {
  font-size: 8.5px;
  padding: 0 4px;
  border-radius: 2px;
  letter-spacing: 0.04em;
}
/* Quote-side source pills (anchor quote + pricing policy file) */
.qline-src-pill.src-pill-anchor .meth-btn-src-type { background: var(--gold); color: #fff; }
.qline-src-pill.src-pill-policy .meth-btn-src-type { background: var(--navy); color: #fff; }
.qline-rich-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 3px;
}

/* Suggestion rationale × Pricing policy grid (mirror of methodology-
   risk-screen layout on Technical assessment): wider left column for
   the rationale card, narrower right column for the policy card. */
.quote-rationale-policy {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr);
  gap: 10px;
  margin: 14px 0;
  align-items: start;
}
@media (max-width: 1100px) {
  .quote-rationale-policy { grid-template-columns: 1fr; }
}
/* Inside the 2-col grid, drop the inherited top margin so both cards
   align flush with the row's top edge. */
.quote-rationale-policy > * { margin-top: 0; }
.quote-rationale-policy .mrs-card { margin-top: 0; }

/* Line items card chrome — same mrs-card shape as the methodology
   choice card. Gold left border picks the gold-tint card style. */
.mrs-card-lines {
  margin-top: 14px;
}
.mrs-card-lines .qline-table { font-size: 12px; }
.mrs-card-lines .qline-table thead th {
  background: transparent;
  border-bottom: 1px solid var(--border-soft);
  padding: 6px 8px;
}
.mrs-card-lines .qline-table tbody td {
  padding: 6px 8px;
}
.mrs-card-lines .qline-table .qline-stage-head td {
  padding: 5px 8px;
}
.mrs-card-lines .qline-table tfoot .qf-row td {
  padding: 6px 8px;
}
/* Right-side policy card sits flush with the lines card top — drop
   the inherited margin-top that pushes it down when standalone. */
.quote-lines-policy .mrs-card-policy { margin-top: 0; }

/* Pricing-policy card variant (reuses mrs-card chrome). Gold-tint with
   navy left border to distinguish it from the methodology risk card. */
.mrs-card-policy {
  border-left-color: var(--navy);
  background: rgba(31, 78, 121, 0.04);
  margin-top: 14px;
}
.mrs-card-policy .mrs-policy-row { background: rgba(255, 255, 255, 0.6); }
.mrs-card-policy .mrs-policy-src {
  display: block;
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--text-faint);
  margin-top: 2px;
  letter-spacing: 0.04em;
}
/* Budget-comparison row: separated from rule rows by a thin divider. */
.mrs-card-policy .mrs-budget-row {
  background: rgba(197, 161, 78, 0.10);
  border-top: 1px dashed rgba(197, 161, 78, 0.45);
  margin-top: 4px;
  padding-top: 7px;
}
.mrs-card-policy .mrs-budget-empty {
  background: rgba(176, 60, 60, 0.04);
  border-top-color: rgba(176, 60, 60, 0.30);
}
.mrs-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.mrs-eyebrow {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.mrs-status {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.04em;
  padding: 1px 6px;
  border-radius: 2px;
  text-transform: uppercase;
  margin-left: auto;
}
.mrs-status-accept { background: rgba(70,110,80,0.18); color: #2f5b3e; }
.mrs-status-review { background: rgba(196,160,76,0.22); color: #8a6312; }
.mrs-status-reject { background: rgba(176,60,60,0.18); color: #b03c3c; }
.mrs-risk-count {
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--text-faint);
  margin-left: auto;
  letter-spacing: 0.03em;
}
.mrs-pick {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 5px;
}
.mrs-stage {
  font-size: 11px;
  color: var(--text-med);
  font-weight: 600;
}
.mrs-citation {
  font-family: var(--serif);
  font-size: 12px;
  font-weight: 600;
  color: var(--navy-deep);
  margin-bottom: 4px;
  line-height: 1.4;
}
.mrs-rationale {
  font-size: 10.5px;
  color: var(--text-med);
  line-height: 1.5;
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px dashed var(--border-soft);
}

/* Per-stage methodology summary (inside Methodology choice card) */
.mrs-stage-count {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.03em;
  color: var(--text-med);
  margin-bottom: 6px;
  padding-bottom: 4px;
  border-bottom: 1px dashed var(--border-soft);
}
.mrs-stage-count.mrs-stage-count-warn { color: #b03c3c; }
.mrs-stage-count b { color: inherit; font-weight: 700; }
.mrs-stage-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
/* Stage row aligned visually with .mrs-risk-row (same card shell): white
   tint, gold left border, compact padding. Inner detail follows the same
   "name on top + why/pick below" pattern as risk rows. */
.mrs-stage-item {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 6px;
  padding: 5px 8px;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 3px;
  border-left: 2px solid var(--gold-soft);
  align-items: start;
}
.mrs-stage-item .mrs-stage-num {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.04em;
  color: var(--text-faint);
  font-weight: 700;
  padding-top: 2px;
}
.mrs-stage-detail {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.mrs-stage-detail .mrs-stage-name {
  font-size: 11px;
  font-weight: 600;
  color: var(--navy-deep);
  line-height: 1.3;
  margin-bottom: 1px;
}
.mrs-stage-pick {
  font-size: 10px;
  color: var(--text-med);
  line-height: 1.4;
  font-weight: 400;
}
.mrs-stage-pick-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 1px;
}
.mrs-stage-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 3px;
}

/* Reliability inline tag (no pill chip): "Reliability · Strong 92".
   Hover surfaces the 5-signal breakdown table. */
.mrs-rel-inline {
  position: relative;
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  font-family: var(--mono);
  cursor: help;
  outline: none;
  padding: 1px 0;
}
.mrs-rel-inline .mrs-rel-lab {
  font-size: 9.5px;
  letter-spacing: 0.04em;
  color: var(--text-faint);
  font-weight: 600;
}
.mrs-rel-inline .mrs-rel-tier {
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.mrs-rel-inline .mrs-rel-num { font-size: 11.5px; font-weight: 700; }
.mrs-rel-inline.rel-high .mrs-rel-tier,
.mrs-rel-inline.rel-high .mrs-rel-num { color: #2f8f4f; }
.mrs-rel-inline.rel-med  .mrs-rel-tier,
.mrs-rel-inline.rel-med  .mrs-rel-num { color: #7a5e2a; }
.mrs-rel-inline.rel-low  .mrs-rel-tier,
.mrs-rel-inline.rel-low  .mrs-rel-num { color: #b03c3c; }

.mrs-rel-tip {
  display: none;
  position: absolute;
  z-index: 60;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 200px;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid var(--gold);
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(31, 78, 121, 0.18);
  text-align: left;
  white-space: nowrap;
}
.mrs-rel-tip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: var(--gold);
}
.mrs-rel-inline:hover .mrs-rel-tip,
.mrs-rel-inline:focus .mrs-rel-tip { display: block; }
.mrs-rel-tip-head {
  display: block;
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-bottom: 4px;
  padding-bottom: 3px;
  border-bottom: 1px dashed var(--border-soft);
}
.mrs-rel-tip-table {
  font-family: var(--mono);
  font-size: 11px;
  border-collapse: collapse;
}
.mrs-rel-tip-table th {
  text-align: left;
  font-weight: 600;
  color: var(--text-med);
  padding: 2px 12px 2px 0;
  font-family: var(--sans);
  font-size: 11px;
}
.mrs-rel-tip-table td {
  text-align: right;
  color: var(--navy-deep);
  font-weight: 700;
  padding: 2px 0;
}
.mrs-rationale-toggle {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 10px;
  background: rgba(196, 160, 76, 0.14);
  color: #6b4f1f;
  border: 1px solid var(--gold-soft);
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
}
.mrs-rationale-toggle:hover {
  background: rgba(196, 160, 76, 0.22);
  border-color: var(--gold);
}
.mrs-rationale-toggle.is-open {
  background: rgba(196, 160, 76, 0.28);
  border-color: var(--gold);
}
.mrs-rt-caret {
  font-size: 9px;
  transition: transform 0.15s;
  display: inline-block;
}
.mrs-rationale-toggle.is-open .mrs-rt-caret { transform: rotate(90deg); }
.mrs-stage-expand {
  margin-top: 6px;
  padding: 8px 10px;
  background: rgba(196, 160, 76, 0.06);
  border-left: 2px solid var(--gold-soft);
  border-radius: 3px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.mrs-stage-rat {
  font-size: 10.5px;
  color: var(--text-dark);
  font-style: italic;
  line-height: 1.5;
}
.mrs-stage-alts {
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px dashed var(--border-soft);
}
.mrs-stage-alts-head {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  margin-bottom: 4px;
}
.mrs-stage-alt {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 6px;
  padding: 4px 0;
  align-items: start;
}
.mrs-alt-rank {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  color: var(--text-faint);
  padding-top: 2px;
}
.mrs-alt-title {
  font-size: 11px;
  font-weight: 700;
  color: var(--navy-deep);
  line-height: 1.35;
}
.mrs-alt-sum {
  font-size: 10px;
  color: var(--text-med);
  line-height: 1.4;
  margin-top: 1px;
}
.mrs-alt-rat {
  font-size: 9.5px;
  color: var(--text-med);
  font-style: italic;
  line-height: 1.45;
  margin-top: 2px;
}
.mrs-stage-srcs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
.mrs-src-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--paper);
  border: 1px solid var(--border-soft);
  border-radius: 3px;
  padding: 2px 7px;
  font-family: inherit;
  font-size: 10px;
  color: var(--text-dark);
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}
.mrs-src-btn:hover { border-color: var(--gold-soft); background: #fff; }
.mrs-src-btn .meth-btn-src-type {
  font-family: var(--mono);
  font-size: 8.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.mrs-stage-rel {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  font-size: 10px;
}
.mrs-rel-lab {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.mrs-stage-rel .conf-bar { flex: 1; max-width: 220px; }
.mrs-stage-missing {
  background: rgba(176, 60, 60, 0.06);
  border-left-color: rgba(176, 60, 60, 0.5);
}
.mrs-stage-missing-lbl {
  font-size: 10px;
  color: #b03c3c;
  font-style: italic;
  line-height: 1.4;
}
.mrs-risk-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 5px; }
.mrs-risk-row {
  display: flex;
  flex-direction: column;
  padding: 5px 8px;
  background: rgba(255,255,255,0.6);
  border-radius: 3px;
  border-left: 2px solid rgba(176,60,60,0.5);
}
.mrs-risk-name {
  font-size: 11px;
  font-weight: 600;
  color: var(--navy-deep);
  margin-bottom: 2px;
}
.mrs-risk-why {
  font-size: 10px;
  color: var(--text-med);
  line-height: 1.4;
}
.mrs-risk-clean {
  font-size: 10.5px;
  color: #2f5b3e;
  font-style: italic;
  padding: 4px 0;
}

@media (max-width: 1100px) {
  .methodology-risk-screen { grid-template-columns: 1fr; }
}

/* ============================================================
   Methodology by stage (Inquiry workspace, assessment view)
   ============================================================ */

/* Stage tab strip */
.methodology-tabs { display: flex; gap: 4px; padding: 8px 0 14px; border-bottom: 1px solid var(--border-soft); margin-bottom: 16px; overflow-x: auto; }
.meth-tab { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 8px 12px; border: 1px solid var(--border-soft); background: var(--off-white); border-radius: 6px; cursor: pointer; font-family: inherit; min-width: 130px; transition: all 0.15s; }
.meth-tab:hover { border-color: var(--gold-soft); background: #fff; }
.meth-tab.active { border-color: var(--gold); background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,0.04); }
.meth-tab-num { font-size: 10px; color: var(--text-faint); font-weight: 600; letter-spacing: 0.06em; }
.meth-tab-label { font-size: 12px; color: var(--text-dark); font-weight: 600; text-align: left; line-height: 1.3; }
.meth-tab.active .meth-tab-label { color: var(--navy); }

/* Stage header */
.meth-stage-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.meth-stage-head h4 { margin: 0; font-family: var(--serif, Georgia, serif); color: var(--navy); font-size: 17px; }

/* Vertically-stacked stage accordions. Each <details> = one stage:
   summary is a pill-shaped button (number + label), body holds the
   ranked suggestions. All stages open by default; click any pill to
   collapse / re-expand it. */
.iw-results .methodology-stages {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.iw-results .meth-stage-acc {
  border: none;
}
.iw-results .meth-stage-pill {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  background: var(--off-white);
  border: 1px solid var(--border-soft);
  border-radius: 6px;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.15s, border-color 0.15s;
  user-select: none;
}
.iw-results .meth-stage-pill::-webkit-details-marker { display: none; }
.iw-results .meth-stage-pill:hover {
  background: #fff;
  border-color: var(--gold-soft);
}
.iw-results .meth-stage-acc[open] .meth-stage-pill {
  background: #fff;
  border-color: var(--gold);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}
.iw-results .meth-pill-caret {
  font-size: 10px;
  color: var(--text-faint);
  transition: transform 0.15s, color 0.15s;
  display: inline-block;
  width: 10px;
}
.iw-results .meth-stage-acc[open] .meth-pill-caret {
  transform: rotate(90deg);
  color: var(--gold);
}
.iw-results .meth-stage-pill .meth-tab-num {
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--text-faint);
  font-weight: 700;
  letter-spacing: 0.06em;
}
.iw-results .meth-stage-pill .meth-tab-label {
  font-family: var(--serif);
  font-size: 12.5px;
  font-weight: 700;
  color: var(--navy);
  line-height: 1.3;
}
.iw-results .meth-stage-acc[open] .meth-tab-label { color: var(--navy-deep); }
.iw-results .meth-pill-note {
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
  margin-left: auto;
}
.iw-results .meth-stage-body {
  padding: 10px 0 8px 18px;
  border-left: 2px solid var(--gold-soft);
  margin: 4px 0 6px 12px;
}
.meth-stage-note { font-size: 11px; color: var(--text-faint); padding: 2px 8px; background: var(--paper-2); border-radius: 10px; }

/* Suggestion list */
.meth-suggestions { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.meth-suggestion { display: flex; gap: 14px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 8px; background: #fff; transition: border-color 0.15s; }
.meth-suggestion:hover { border-color: var(--gold-soft); }
.meth-suggestion.rank-1 { border-left: 3px solid var(--navy); }
.meth-suggestion.rank-2 { border-left: 3px solid var(--gold); }
.meth-suggestion.rank-3 { border-left: 3px solid var(--text-faint); }
.meth-rank { flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: var(--navy); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 600; font-family: var(--serif, Georgia, serif); }
.meth-suggestion.rank-2 .meth-rank { background: var(--gold); }
.meth-suggestion.rank-3 .meth-rank { background: var(--text-faint); }
.meth-body { flex: 1; min-width: 0; }
.meth-title { font-size: 14px; font-weight: 600; color: var(--text-dark); margin-bottom: 4px; line-height: 1.4; }
.meth-summary { font-size: 13px; color: var(--text-med); line-height: 1.55; margin-bottom: 10px; }
.meth-actions { display: flex; flex-wrap: wrap; gap: 6px; }

/* Action buttons */
.meth-btn { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border: 1px solid var(--border); background: var(--off-white); border-radius: 14px; cursor: pointer; font-family: inherit; font-size: 11px; color: var(--text-med); transition: all 0.15s; }
.meth-btn:hover { border-color: var(--navy); color: var(--navy); background: #fff; }
.meth-btn-rationale { background: var(--gold-tint); border-color: var(--gold-soft); color: #6a4e0f; font-weight: 600; }
.meth-btn-rationale:hover { background: #fff; border-color: var(--gold); color: #4a3508; }
.meth-btn-src-type { padding: 1px 5px; background: rgba(0,0,0,0.08); border-radius: 6px; font-size: 9px; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 700; }
.meth-btn-shared .meth-btn-src-type   { background: var(--navy); color: #fff; }
.meth-btn-internal .meth-btn-src-type { background: var(--gold); color: #fff; }
.meth-btn-past .meth-btn-src-type     { background: #2f8f4f; color: #fff; }
.meth-btn-external .meth-btn-src-type { background: #5a5a54; color: #fff; }
.meth-btn-vendor .meth-btn-src-type   { background: #8a1f7a; color: #fff; }
.meth-no-source { font-size: 11px; color: var(--text-faint); font-style: italic; padding: 4px 10px; }

/* ============================================================
   Source preview drawer (right slide-in)
   ============================================================ */

.source-drawer {
  position: fixed; right: 0; top: 0;
  width: min(440px, 90vw); height: 100vh;
  background: #fff;
  border-left: 1px solid var(--border);
  box-shadow: -8px 0 24px rgba(0,0,0,0.10);
  z-index: 250;
  display: flex; flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.25s ease-out;
}
.source-drawer.open { transform: translateX(0); }
.source-drawer.hidden { display: none; }

.sd-head { display: flex; justify-content: space-between; align-items: flex-start; padding: 18px 20px 14px; border-bottom: 1px solid var(--border-soft); gap: 12px; }
.sd-eyebrow { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-faint); font-weight: 600; margin-bottom: 4px; }
.sd-title { font-family: var(--serif, Georgia, serif); color: var(--navy); font-size: 16px; margin: 0; line-height: 1.4; }
.sd-close { background: transparent; border: none; font-size: 22px; line-height: 1; color: var(--text-faint); cursor: pointer; padding: 0 4px; }
.sd-close:hover { color: var(--text-dark); }

.sd-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
.sd-section { margin-bottom: 18px; }
.sd-section h5 { margin: 0 0 8px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-faint); font-weight: 600; }
.sd-section p { margin: 0; font-size: 13px; color: var(--text-dark); line-height: 1.6; }
.sd-preview { margin: 0; padding: 12px 14px; background: var(--paper); border-left: 3px solid var(--gold); border-radius: 4px; font-size: 12.5px; color: var(--text-med); line-height: 1.6; font-family: var(--serif, Georgia, serif); font-style: italic; }
.sd-source-list { margin: 0; padding-left: 0; list-style: none; }
.sd-source-list li { padding: 6px 0; font-size: 12px; color: var(--text-med); border-bottom: 1px solid var(--border-soft); }
.sd-source-list li:last-child { border-bottom: none; }

.sd-foot { padding: 14px 20px; border-top: 1px solid var(--border-soft); }
.sd-foot:empty { display: none; }

/* Workspace sub-page back link */
.back-link { display: inline-block; font-size: 12px; color: var(--text-light); text-decoration: none; margin-bottom: 6px; transition: color 0.15s; }
.back-link:hover { color: var(--navy); }

/* ============================================================
   Inquiry list do-not-process label + toggle
   ============================================================ */

/* Skipped row appearance */
.inquiry-list li.iq-skipped { opacity: 0.65; background: var(--paper); }
.inquiry-list li.iq-skipped .iq-title { color: var(--text-light); }

/* Toggle pill */
.iq-toggle-wrap { display: flex; align-items: center; margin-right: 4px; flex-shrink: 0; }
.iq-label-toggle { position: relative; display: inline-flex; align-items: center; cursor: pointer; user-select: none; }
.iq-label-toggle input[type="checkbox"] { position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0; }
.iq-toggle-pill { display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; border: 1px solid; min-width: 110px; text-align: center; transition: all 0.15s; }
.iq-toggle-pill.off { background: var(--good-bg, #E8F0E8); color: var(--good, #2E5C2E); border-color: var(--good-bd, #BBD0BB); }
.iq-toggle-pill.on  { background: #f0e0e0; color: #8a1f1f; border-color: #d9b8b8; }
.iq-label-toggle:hover .iq-toggle-pill.off { background: #d8eddc; }
.iq-label-toggle:hover .iq-toggle-pill.on  { background: #e8d0d0; }

/* Reason text inline */
.iq-skip-reason { font-size: 11px; color: var(--text-faint); font-style: italic; }

/* Skip status pill */
.li-status.skip { background: #e8e8e8; color: #555; }

/* ============================================================
   Home: KPI-as-link + workflow guide
   ============================================================ */

/* KPI tiles also act as links */
.kpi-link { text-decoration: none; color: inherit; display: block; transition: transform 0.12s, box-shadow 0.12s; cursor: pointer; }
.kpi-link:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(31, 78, 121, 0.10); }

/* Workflow guide card */
.workflow-guide-card { margin: 16px 0 18px; }
.workflow-guide { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 18px; }
.workflow-guide li { display: flex; gap: 12px; padding: 12px 14px; border: 1px solid var(--border-soft); border-radius: 8px; background: var(--off-white); }
.workflow-guide li .wg-num { flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--navy); color: #fff; font-family: var(--serif, Georgia, serif); font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.wg-body h4 { margin: 0 0 4px; font-size: 13.5px; color: var(--text-dark); font-weight: 600; }
.wg-body p { margin: 0; font-size: 12.5px; color: var(--text-med); line-height: 1.55; }
.wg-body a { color: var(--navy); text-decoration: underline; }
.wg-pill.rationale { display: inline-block; padding: 0 6px; border-radius: 10px; font-size: 10px; background: var(--gold-tint); color: #6a4e0f; font-weight: 600; border: 1px solid var(--gold-soft); }

@media (max-width: 900px) {
  .workflow-guide { grid-template-columns: 1fr; }
}

/* ============================================================
   Home v3: datetime, chat embed, status summary, weekly report
   ============================================================ */

.home-head .page-sub { font-family: var(--mono, ui-monospace, monospace); font-size: 13px; color: var(--text-med); }

/* Home chat card */
.home-chat-card { margin-bottom: 18px; }
.home-chat-prompt { font-size: 13px; color: var(--text-med); margin: 6px 0 12px; line-height: 1.5; }
.home-chat-input { display: flex; gap: 8px; }
.home-chat-input .chat-input { flex: 1; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius); font-size: 14px; background: var(--off-white); }
.home-chat-input .chat-input:focus { outline: none; border-color: var(--gold); background: #fff; }
.home-chat-suggestions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.sug-chip { padding: 5px 12px; border: 1px solid var(--border); border-radius: 14px; background: var(--off-white); font-family: inherit; font-size: 12px; color: var(--text-med); cursor: pointer; transition: all 0.15s; }
.sug-chip:hover { border-color: var(--navy); background: #fff; color: var(--navy); }

/* Home grid (status summary + weekly report) */
.home-grid-2 { grid-template-columns: 1fr 1fr; gap: 18px; }

/* Status summary card */
.status-counts { list-style: none; padding: 0; margin: 0 0 18px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.status-counts li { margin: 0; }
.status-counts .kpi-link { display: block; padding: 10px 8px; text-align: center; background: var(--off-white); border: 1px solid var(--border-soft); border-radius: 6px; text-decoration: none; color: inherit; transition: all 0.15s; }
.status-counts .kpi-link:hover { border-color: var(--gold); background: #fff; }
.status-counts .kpi-num { display: block; font-family: var(--serif, Georgia, serif); font-size: 26px; font-weight: 700; color: var(--navy); line-height: 1; margin-bottom: 4px; }
.status-counts .kpi-lab { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--text-faint); font-weight: 600; line-height: 1.3; }

.status-sub-head, .weekly-sub-head { margin: 0 0 8px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-faint); font-weight: 600; }

.status-pending { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.status-pending .sp-empty { padding: 12px; font-size: 12px; color: var(--text-faint); font-style: italic; text-align: center; background: var(--off-white); border-radius: 6px; }
.status-pending .sp-row { display: flex; gap: 12px; align-items: center; padding: 10px 12px; background: var(--off-white); border: 1px solid var(--border-soft); border-radius: 6px; cursor: pointer; transition: all 0.15s; }
.status-pending .sp-row:hover { border-color: var(--gold); background: #fff; }
.status-pending .sp-main { flex: 1; min-width: 0; }
.status-pending .sp-title { font-size: 13px; color: var(--text-dark); font-weight: 500; margin-bottom: 3px; line-height: 1.3; }
.status-pending .sp-meta { font-size: 11px; color: var(--text-faint); }
.sp-age { flex-shrink: 0; text-align: right; }
.sp-age-val { font-family: var(--serif, Georgia, serif); font-size: 16px; font-weight: 700; line-height: 1; }
.sp-age-lab { font-size: 9px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-faint); font-weight: 600; margin-top: 3px; }
.sp-age.age-fresh .sp-age-val { color: #2f8f4f; }
.sp-age.age-warm  .sp-age-val { color: #8B5A1A; }
.sp-age.age-stale .sp-age-val { color: #b03c3c; }

/* Weekly report card */
.weekly-metrics { list-style: none; padding: 0; margin: 0 0 18px; display: flex; flex-direction: column; gap: 4px; }
.weekly-metrics li { display: grid; grid-template-columns: 36px 1fr auto auto; gap: 10px; align-items: baseline; padding: 6px 0; border-bottom: 1px solid var(--border-soft); }
.weekly-metrics li:last-child { border-bottom: none; }
.wm-count { font-family: var(--serif, Georgia, serif); font-size: 18px; font-weight: 700; color: var(--navy); text-align: right; }
.wm-metric { font-size: 12.5px; color: var(--text-dark); }
.wm-delta { font-family: var(--mono, ui-monospace, monospace); font-size: 11px; font-weight: 700; padding: 1px 6px; border-radius: 8px; }
.wm-delta.delta-up   { background: #d8efdf; color: #1f6e3a; }
.wm-delta.delta-down { background: #f0d0d0; color: #8a1f1f; }
.wm-delta.delta-flat { background: #e8e8e8; color: #555; }
.wm-note { font-size: 10px; color: var(--text-faint); font-style: italic; }

.weekly-highlights { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.weekly-highlights li { display: flex; gap: 8px; align-items: flex-start; font-size: 12px; color: var(--text-med); line-height: 1.5; padding: 6px 0; border-bottom: 1px dashed var(--border-soft); }
.weekly-highlights li:last-child { border-bottom: none; }
.wh-type { flex-shrink: 0; padding: 1px 8px; border-radius: 10px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 700; }
.wh-type.wh-quote     { background: var(--gold-tint); color: #6a4e0f; }
.wh-type.wh-approval  { background: var(--navy); color: #fff; }
.wh-type.wh-knowledge { background: #d8efdf; color: #1f6e3a; }

@media (max-width: 1100px) {
  .home-grid-2 { grid-template-columns: 1fr; }
  .status-counts { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================================
   Home v4 layout: status (top-left), weekly (bottom-left),
   assistant (right, sticky); generous whitespace
   ============================================================ */

.home-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "status weekly";
  gap: 24px;
  margin-top: 20px;
  align-items: start;
}

.home-status-card { grid-area: status; }
.home-weekly-card { grid-area: weekly; }

/* More generous internal padding for the two home cards */
.home-status-card, .home-weekly-card { padding: 28px 28px 26px; }

/* Add breathing room between sub-sections inside each card */
.home-status-card .status-counts { margin-bottom: 26px; }
.home-status-card .status-sub-head,
.home-weekly-card .weekly-sub-head { margin-top: 22px; margin-bottom: 12px; }
.home-weekly-card .weekly-metrics { margin-bottom: 4px; }

/* Status counts: nicer 2x2 default with airier tiles */
.status-counts { grid-template-columns: repeat(2, 1fr); gap: 12px; }
.status-counts .kpi-link { padding: 16px 12px; }
.status-counts .kpi-num { font-size: 30px; margin-bottom: 6px; }

/* Pending list rows: slight extra padding */
.status-pending .sp-row { padding: 12px 14px; }

/* Weekly metrics: more vertical breathing room */
.weekly-metrics li { padding: 8px 0; }

/* Chat card prompt + input + suggestions vertical rhythm */
.home-chat-card .home-chat-prompt { margin: 4px 0 18px; line-height: 1.6; }
.home-chat-card .home-chat-input { margin-bottom: 4px; }
.home-chat-card .home-chat-sub-head { margin: 22px 0 10px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-faint); font-weight: 600; }
.home-chat-card .home-chat-suggestions { flex-direction: column; align-items: stretch; gap: 8px; }
.home-chat-card .sug-chip { text-align: left; padding: 9px 14px; border-radius: 8px; line-height: 1.4; }

/* Responsive: collapse to single column on narrower viewports */
@media (max-width: 1100px) {
  .home-layout {
    grid-template-columns: 1fr;
    grid-template-areas:
      "status"
      "weekly";
    gap: 20px;
  }
  .home-status-card, .home-weekly-card { padding: 22px; }
}

/* ============================================================
   Home v5: status text + weekly date picker + categorised highlights
   ============================================================ */

/* Status summary text (replaces the 4 count tiles) */
.status-summary-text { font-size: 14.5px; line-height: 1.7; color: var(--text-dark); margin: 6px 0 26px; padding: 14px 16px; background: var(--off-white); border-left: 3px solid var(--gold); border-radius: 4px; }
.status-summary-text a { color: var(--navy); text-decoration: none; font-weight: 500; }
.status-summary-text a:hover { text-decoration: underline; }
.status-summary-text b { font-family: var(--serif, Georgia, serif); font-size: 17px; color: var(--navy); }

/* Weekly report header date pickers */
.weekly-range { display: flex; gap: 8px; align-items: center; }
.wr-label { display: inline-flex; flex-direction: column; gap: 2px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--text-faint); font-weight: 600; }
.wr-label input[type="date"] { padding: 4px 6px; border: 1px solid var(--border); border-radius: 4px; font-family: inherit; font-size: 12px; color: var(--text-dark); background: #fff; }
.wr-label input[type="date"]:focus { outline: none; border-color: var(--gold); }
.btn.btn-mini { padding: 4px 10px; font-size: 11px; align-self: flex-end; }

/* Weekly summary text (replaces the metric list) */
.weekly-summary-text { font-size: 13.5px; line-height: 1.7; color: var(--text-dark); margin: 4px 0 22px; padding: 12px 14px; background: var(--off-white); border-left: 3px solid var(--navy); border-radius: 4px; }
.weekly-summary-text b { font-family: var(--serif, Georgia, serif); font-size: 15px; color: var(--navy); }

/* Weekly achievements: category groups with bullets */
.weekly-achievements { display: flex; flex-direction: column; gap: 16px; }
.wa-group { padding: 12px 14px; background: var(--off-white); border: 1px solid var(--border-soft); border-radius: 6px; border-left: 3px solid var(--text-faint); }
.wa-group.cat-arrived   { border-left-color: var(--gold); }
.wa-group.cat-processed { border-left-color: var(--navy); }
.wa-group.cat-quote     { border-left-color: #c9a961; }
.wa-group.cat-approval  { border-left-color: #8B5A1A; }
.wa-group.cat-knowledge { border-left-color: #2f8f4f; }
.wa-group.cat-library   { border-left-color: var(--navy); }
.wa-cat-head { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-faint); font-weight: 700; }
.wa-cat-icon { font-size: 14px; line-height: 1; }
.wa-cat-label { color: var(--navy); font-weight: 700; }
.wa-cat-count { margin-left: auto; padding: 1px 7px; background: var(--paper-2); border-radius: 10px; font-size: 10px; color: var(--text-med); font-family: var(--mono, ui-monospace, monospace); }
.wa-list { list-style: disc; padding-left: 18px; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.wa-list li { font-size: 12.5px; color: var(--text-med); line-height: 1.55; }

/* Tighter responsive: date pickers wrap below at narrow */
@media (max-width: 760px) {
  .weekly-range { flex-wrap: wrap; }
}

/* ============================================================
   Level-based tier pills (replaces junior/senior/ceo)
   ============================================================ */
.role-tier-pill.level-1 { background: var(--paper); color: var(--text-med); border: 1px solid var(--border); }
.role-tier-pill.level-2 { background: var(--gold-tint); color: var(--navy-deep); border: 1px solid var(--gold-soft); }
.role-tier-pill.level-3 { background: var(--navy); color: #fff; }

/* Legacy junior/senior/ceo kept above stay valid for any data that still uses them */

/* If a rbac-sub line is empty (e.g., default persona without title), hide it cleanly */
.rbac-sub:empty { display: none; }

/* Rule level pills (Approvals page, threshold rules tab) */
.rule-level.self         { background: rgba(70,110,80,0.18); color: #2f5b3e; border: 1px solid rgba(70,110,80,0.3); }
.rule-level.level-2      { background: var(--gold-tint); color: var(--navy-deep); border: 1px solid var(--gold-soft); }
.rule-level.level-3      { background: var(--navy); color: #fff; }
.rule-level.level-2_or_3 { background: var(--paper); color: var(--text-med); border: 1px solid var(--border); }

/* Self-approved card variant */
.sa-card { background: rgba(70,110,80,0.06); border-left: 3px solid rgba(70,110,80,0.5); }
.sa-card .ap-type { background: rgba(70,110,80,0.18); color: #2f5b3e; }

/* ============================================================
   Technical assessment inbox (page = /assessment)
   Left pane uses sp-row + sp-meta-extra for the enriched fields below.
   ============================================================ */
.ta-list { padding: 0; }
.ta-empty {
  padding: 28px 24px;
  text-align: center;
  font-size: 12px;
  color: var(--text-faint);
  font-style: italic;
}

/* sp-row enriched (Opened to process pane) — simplified 3-row layout:
   tags above title, title, then a merged from + best-hit meta line. */
.sp-row-rich .sp-meta-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-bottom: 6px;
  font-size: 10.5px;
}
.sp-row-rich .sp-meta-from {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-top: 4px;
  font-size: 11px;
}
.sp-row-rich .sp-from { color: var(--text-med); }
.sp-row-rich .sp-dot { color: var(--text-faint); }
.sp-row-rich .sp-meta-from .ki-src-pill { font-size: 9px; padding: 1px 5px; }
.sp-row-rich .sp-meta-from .ta-besthit-conf {
  font-family: var(--mono);
  font-size: 9.5px;
  padding: 1px 5px;
  border-radius: 2px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

/* Quote-assessment chips (Quotes page, left pane) */
.sp-row-rich .sp-meta-from .q-anchor-chip {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 1px 6px;
  border-radius: 2px;
  background: rgba(31, 78, 121, 0.12);
  color: var(--navy);
  border: 1px solid rgba(31, 78, 121, 0.25);
}
.sp-row-rich .sp-meta-from .q-service-chip {
  font-family: var(--serif);
  font-size: 10.5px;
  color: var(--text-med);
  font-style: italic;
  max-width: 320px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sp-row-rich .sp-meta-extra .ta-est,
.sp-row-rich .sp-meta-extra .ta-prop,
.sp-row-rich .sp-meta-extra .ta-risk,
.sp-row-rich .sp-meta-extra .iq-rule,
.sp-row-rich .sp-meta-tags .ta-risk,
.sp-row-rich .sp-meta-tags .iq-rule {
  flex-shrink: 0;
  margin: 0;
}
.sp-row-rich .sp-meta-extra .iq-rule,
.sp-row-rich .sp-meta-tags .iq-rule {
  font-size: 9.5px;
  font-family: var(--mono);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 3px;
}
.sp-row-rich .ta-besthit {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 1px 7px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--border-soft);
  border-radius: 3px;
}
.sp-row-rich .ta-besthit-lab {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.sp-row-rich .ta-besthit-cit {
  font-family: var(--serif);
  font-size: 10.5px;
  color: var(--text-dark);
  font-weight: 600;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sp-row-rich .ta-besthit-conf {
  font-family: var(--mono);
  font-size: 9.5px;
  padding: 1px 5px;
  border-radius: 2px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.sp-row-rich .ta-besthit-conf.rel-high { background: rgba(47, 143, 79, 0.18); color: #2f8f4f; }
.sp-row-rich .ta-besthit-conf.rel-med  { background: rgba(197, 181, 154, 0.45); color: #7a5e2a; }
.sp-row-rich .ta-besthit-conf.rel-low  { background: rgba(176, 60, 60, 0.18); color: #b03c3c; }
.sp-row-rich .ta-besthit-conf.rel-none { background: transparent; color: var(--text-faint); }
.sp-row-rich .ki-src-pill { font-size: 9px; padding: 1px 5px; }
.ta-row-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.ta-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border-soft);
  cursor: pointer;
  transition: background 0.12s;
  align-items: center;
}
.ta-row:hover { background: rgba(239, 234, 217, 0.5); }
.ta-row:last-child { border-bottom: none; }
.ta-main { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ta-title {
  font-family: var(--serif);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--navy-deep);
  line-height: 1.4;
}
.ta-title .iq-no-inline {
  font-family: var(--mono);
  font-size: 11px;
  background: rgba(196, 160, 76, 0.16);
  color: #6b4f1f;
  padding: 1px 6px;
  border-radius: 2px;
  margin-right: 6px;
}
.ta-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: var(--text-med);
  flex-wrap: wrap;
}
.ta-from { font-weight: 500; }
.ta-est {
  font-family: var(--mono);
  font-size: 10.5px;
  color: var(--text-faint);
  padding: 1px 5px;
  background: rgba(255,255,255,0.7);
  border-radius: 2px;
}
.ta-prop {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: 2px;
  font-weight: 700;
}
.ta-prop-accept { background: rgba(70,110,80,0.16); color: #2f5b3e; }
.ta-prop-review { background: rgba(196,160,76,0.22); color: #8a6312; }
.ta-prop-reject { background: rgba(176,60,60,0.18); color: #b03c3c; }
.ta-risk {
  font-family: var(--mono);
  font-size: 9.5px;
  color: #b03c3c;
  padding: 1px 5px;
  background: rgba(176,60,60,0.1);
  border-radius: 2px;
  letter-spacing: 0.03em;
}
.ta-saved {
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}
.ta-age { text-align: right; min-width: 70px; }
.ta-age-val { font-family: var(--mono); font-size: 13px; font-weight: 700; color: var(--navy-deep); }
.ta-age-lab { font-family: var(--mono); font-size: 9.5px; color: var(--text-faint); letter-spacing: 0.05em; text-transform: uppercase; }
.ta-age.age-fresh .ta-age-val { color: #2f5b3e; }
.ta-age.age-warm  .ta-age-val { color: #8a6312; }
.ta-age.age-stale .ta-age-val { color: #b03c3c; }

/* ============================================================
   Stage pills (Home pending list)
   ============================================================ */
.sp-stage { display: inline-block; padding: 2px 9px; border-radius: 10px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 700; border: 1px solid; }
.sp-stage.stage-opened-to-process              { background: rgba(56, 132, 226, 0.16); color: #1e5fa8; border-color: rgba(56, 132, 226, 0.35); }
.sp-stage.stage-awaiting-technical-assessment  { background: var(--gold); color: #fff; border-color: var(--gold); }
.sp-stage.stage-awaiting-quote                  { background: rgba(31, 78, 121, 0.12); color: var(--navy); border-color: rgba(31, 78, 121, 0.3); }
.sp-stage.stage-awaiting-approval               { background: rgba(180, 60, 60, 0.12); color: #8a1f1f; border-color: rgba(180, 60, 60, 0.3); }
.sp-stage.stage-closed                           { background: rgba(70, 110, 80, 0.16); color: #2f5b3e; border-color: rgba(70, 110, 80, 0.35); }

/* Knowledge activity card uses the same shapes as Workspace activity (weekly-*) */
.knowledge-activity-card { padding: 24px 26px; margin-bottom: 18px; }

/* ============================================================
   Home density tune: fit a single viewport without scrolling
   Scoped to home-only via .home-head / .home-status-card /
   .home-weekly-card so other pages keep their reading size.
   ============================================================ */

.home-head { padding-bottom: 0; margin-bottom: 0; }
.home-head .page-num { font-size: 10px; }
.home-head h1 { font-size: 22px; margin-bottom: 2px; }
.home-head .page-sub { font-size: 11.5px; margin: 0; }

.home-layout { margin-top: 14px; gap: 18px; }
.home-status-card, .home-weekly-card { padding: 18px 20px 16px; }
.home-status-card .card-head, .home-weekly-card .card-head { margin-bottom: 6px; padding-bottom: 8px; }
.home-status-card .card-head h3, .home-weekly-card .card-head h3 { font-size: 15px; }
.home-status-card .card-link, .home-weekly-card .card-link { font-size: 11px; }
.home-status-card .card-meta, .home-weekly-card .card-meta { font-size: 11px; }

/* Status summary text */
.home-status-card .status-summary-text { font-size: 12.5px; line-height: 1.55; padding: 9px 12px; margin: 4px 0 14px; }
.home-status-card .status-summary-text b { font-size: 14px; }

/* Section sub-heads */
.home-status-card .status-sub-head,
.home-weekly-card  .weekly-sub-head { margin-top: 12px; margin-bottom: 6px; font-size: 10px; }

/* Pending list */
.home-status-card .status-pending { gap: 4px; }
.home-status-card .status-pending .sp-row { padding: 8px 12px; }
.home-status-card .sp-title { font-size: 12px; margin-bottom: 2px; line-height: 1.3; }
.home-status-card .sp-meta { font-size: 10.5px; }
.home-status-card .sp-stage { padding: 1px 7px; font-size: 9px; letter-spacing: 0.04em; }
.home-status-card .sp-age-val { font-size: 13px; }
.home-status-card .sp-age-lab { font-size: 8.5px; margin-top: 2px; }

/* Weekly summary text */
.home-weekly-card .weekly-summary-text { font-size: 12px; line-height: 1.55; padding: 9px 12px; margin: 4px 0 12px; }
.home-weekly-card .weekly-summary-text b { font-size: 13.5px; }

/* Weekly achievements */
.home-weekly-card .weekly-achievements { gap: 9px; }
.home-weekly-card .wa-group { padding: 8px 12px; }
.home-weekly-card .wa-cat-head { margin-bottom: 5px; font-size: 10px; gap: 6px; }
.home-weekly-card .wa-cat-icon { font-size: 12px; }
.home-weekly-card .wa-cat-count { font-size: 9px; padding: 0 5px; }
.home-weekly-card .wa-list { padding-left: 16px; gap: 2px; }
.home-weekly-card .wa-list li { font-size: 11px; line-height: 1.45; }

/* Date picker form (tight) */
.home-weekly-card .weekly-range input[type="date"] { padding: 2px 5px; font-size: 11px; }
.home-weekly-card .wr-label { font-size: 9px; }
.home-weekly-card .btn-mini { padding: 3px 8px; font-size: 10px; }

/* ============================================================
   Floating chat fab + in-page conversational assistant popup
   ============================================================ */

.chat-fab {
  position: fixed; right: 24px; bottom: 24px;
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--navy); color: #fff;
  border: none; cursor: pointer;
  box-shadow: 0 6px 18px rgba(31, 78, 121, 0.30);
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  z-index: 240;
  transition: transform 0.15s, box-shadow 0.15s, background 0.15s;
}
.chat-fab:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(31, 78, 121, 0.40); background: var(--navy-deep, #173E5F); }
.chat-fab.active { background: var(--gold); color: var(--navy); }
.chat-fab-icon { display: inline-block; line-height: 1; }

.chat-popup {
  position: fixed; right: 24px; bottom: 88px;
  width: min(380px, calc(100vw - 48px));
  height: min(540px, calc(100vh - 130px));
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(31, 78, 121, 0.18);
  display: flex; flex-direction: column;
  z-index: 245;
  transform: translateY(8px) scale(0.98);
  opacity: 0;
  transition: opacity 0.2s ease-out, transform 0.2s ease-out;
  pointer-events: none;
}
.chat-popup.open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.chat-popup.hidden { display: none; }

.cp-head { display: flex; justify-content: space-between; align-items: flex-start; padding: 14px 16px 12px; border-bottom: 1px solid var(--border-soft); gap: 10px; }
.cp-eyebrow { display: block; font-size: 9.5px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-faint); font-weight: 700; margin-bottom: 2px; }
.cp-title { font-family: var(--serif, Georgia, serif); color: var(--navy); font-size: 14px; margin: 0; line-height: 1.3; }
.cp-close { background: transparent; border: none; font-size: 20px; line-height: 1; color: var(--text-faint); cursor: pointer; padding: 0 4px; }
.cp-close:hover { color: var(--text-dark); }

.cp-body { flex: 1; overflow-y: auto; padding: 12px 14px 6px; display: flex; flex-direction: column; gap: 10px; }

.cp-empty { font-size: 11.5px; color: var(--text-faint); line-height: 1.55; padding: 8px 10px; background: var(--off-white); border-left: 3px solid var(--gold); border-radius: 4px; font-style: italic; }

.cp-suggestions { display: flex; flex-direction: column; gap: 6px; }
.cp-sug-head { font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-faint); font-weight: 700; margin-bottom: 2px; }
.cp-sug-chip { text-align: left; padding: 8px 12px; border: 1px solid var(--border-soft); background: var(--off-white); border-radius: 8px; font-family: inherit; font-size: 11.5px; color: var(--text-med); cursor: pointer; transition: all 0.15s; line-height: 1.4; }
.cp-sug-chip:hover { border-color: var(--gold); background: #fff; color: var(--navy); }

.cp-stream { display: flex; flex-direction: column; gap: 8px; }
.cp-msg { display: flex; flex-direction: column; gap: 3px; }
.cp-msg-user { align-items: flex-end; }
.cp-msg-bot  { align-items: flex-start; }
.cp-msg-bubble { padding: 7px 11px; border-radius: 10px; font-size: 12px; line-height: 1.5; max-width: 85%; }
.cp-msg-user .cp-msg-bubble { background: var(--navy); color: #fff; border-bottom-right-radius: 3px; }
.cp-msg-bot  .cp-msg-bubble { background: var(--paper); color: var(--text-dark); border-bottom-left-radius: 3px; }
.cp-msg-cites { display: flex; flex-wrap: wrap; gap: 4px; max-width: 85%; }
.cp-msg-bot .cp-msg-cites { align-self: flex-start; }
.cp-cite { font-size: 9.5px; padding: 1px 6px; background: var(--gold-tint); color: #6a4e0f; border-radius: 8px; font-family: var(--mono, ui-monospace, monospace); }

.cp-foot { padding: 10px 14px 12px; border-top: 1px solid var(--border-soft); display: flex; flex-direction: column; gap: 6px; }
.cp-input-bar { display: flex; gap: 6px; }
.cp-input { flex: 1; padding: 7px 10px; border: 1px solid var(--border); border-radius: 6px; font-family: inherit; font-size: 12px; background: var(--off-white); }
.cp-input:focus { outline: none; border-color: var(--gold); background: #fff; }
.cp-send { padding: 6px 12px; font-size: 12px; }
.cp-full-link { font-size: 10.5px; color: var(--text-faint); text-decoration: none; text-align: center; }
.cp-full-link:hover { color: var(--navy); text-decoration: underline; }

/* Drop the page-num spacer entirely (removed from templates; styles kept for any old data) */
.page-num { display: none; }

@media (max-width: 600px) {
  .chat-fab { right: 16px; bottom: 16px; }
  .chat-popup { right: 16px; bottom: 76px; width: calc(100vw - 32px); height: calc(100vh - 110px); }
}

/* ============================================================
   Density alignment across all pages (match home compact mode)
   Home keeps its own tighter overrides via .home-status-card /
   .home-weekly-card; this block raises the rest of the workspace
   to the same visual rhythm.
   ============================================================ */

/* Page header */
.page-head { padding-bottom: 10px; margin-bottom: 14px; }
.page-head h1 { font-size: 24px; line-height: 1.25; }
.page-head .page-sub { font-size: 12px; margin-top: 3px; line-height: 1.55; }
.back-link { font-size: 11px; }

/* Cards */
.card { padding: 20px 22px 18px; }
.card-head { padding-bottom: 8px; margin-bottom: 10px; }
.card-head h3 { font-size: 15.5px; }
.card-head h4 { font-size: 13.5px; }
.card-meta { font-size: 11px; }
.card-link { font-size: 11.5px; }

/* Buttons (mid density) */
.btn { padding: 7px 14px; font-size: 12.5px; }
.btn-primary, .btn-ghost { font-size: 12.5px; }
.btn-text { font-size: 12px; }

/* Inquiries list */
.inquiry-list li { padding: 11px 14px; }
.iq-title { font-size: 12.5px; }
.iq-from { font-size: 10.5px; }
.iq-time { font-size: 10.5px; }

/* Workspace input pane */
.iw-head { padding-bottom: 8px; margin-bottom: 10px; }
.iw-head h2 { font-size: 14px; }
.iw-num { font-size: 13px; }
.inquiry-source { font-size: 11px; margin-bottom: 10px; }
.src-label { font-size: 10px; }
.inquiry-input { font-size: 12.5px; line-height: 1.55; padding: 10px 12px; }

/* Process button: keep Load sample left, push Process to the right */
.inquiry-actions { justify-content: space-between; align-items: center; gap: 8px; margin-top: 10px; }

/* Extracted fields + service match */
.extracted { margin-top: 14px; }
.ext-head { margin-bottom: 6px; }
.ext-label { font-size: 10px; }
.ext-status { font-size: 9.5px; }
.ext-list li { font-size: 11.5px; padding: 4px 0; }
.ext-key { font-size: 10px; }
.ext-val { font-size: 11.5px; }
.service-match { padding: 8px 10px; font-size: 11.5px; margin-top: 10px; }

/* Loader steps */
.loader-steps li { font-size: 11.5px; padding: 4px 0; }

/* Clusters + candidates */
.cluster { margin-bottom: 8px; }
.cluster-head { padding: 8px 12px; font-size: 12px; }
.cluster-name { font-size: 12px; font-weight: 600; }
.cluster-count { font-size: 10.5px; }
.cand { padding: 10px 12px; }
.cand-title { font-size: 12.5px; line-height: 1.4; }
.cand-snip { font-size: 11.5px; line-height: 1.5; }
.cand-source { font-size: 9.5px; padding: 1px 6px; }
.cand-cite { font-size: 10.5px; }
.rel-tag { font-size: 9.5px; padding: 1px 6px; }
.conf-num { font-size: 14px; }

/* Output frame + draft */
.output-meta { font-size: 11px; padding: 4px 0 8px; }
.output-body { font-size: 12px; line-height: 1.6; }
.output-toggle .tog { font-size: 11.5px; padding: 4px 10px; }

/* Methodology */
.meth-tab { padding: 7px 10px; min-width: 120px; }
.meth-tab-num { font-size: 9.5px; }
.meth-tab-label { font-size: 11.5px; }
.meth-stage-head h4 { font-size: 14.5px; }
.meth-stage-note { font-size: 10.5px; }
.meth-suggestion { padding: 11px 13px; gap: 12px; }
.meth-rank { width: 24px; height: 24px; font-size: 12px; }
.meth-title { font-size: 12.5px; }
.meth-summary { font-size: 11.5px; line-height: 1.5; margin-bottom: 8px; }
.meth-btn { font-size: 10.5px; padding: 3px 9px; }
.meth-btn-src-type { font-size: 8.5px; }
.meth-no-source { font-size: 10.5px; }

/* Rationale + reliability */
.rat-list li { padding: 10px 0; }
.rat-rec { font-size: 12.5px; }
.rat-num { font-size: 11px; }
.rat-text { font-size: 11.5px; line-height: 1.55; }
.rat-cite { font-size: 10px; }
.rel-table th, .rel-table td { font-size: 11px; padding: 5px 8px; }
.rel-intro { font-size: 11.5px; line-height: 1.55; }
.rel-example-card h4, .rel-grid h4 { font-size: 12px; }

/* Source preview drawer */
.sd-eyebrow { font-size: 9.5px; }
.sd-title { font-size: 14.5px; }
.sd-section h5 { font-size: 10px; }
.sd-section p, .sd-source-list li { font-size: 11.5px; }
.sd-preview { font-size: 11.5px; padding: 10px 12px; }

/* Chat (Assistant page) */
.chat-history-head { font-size: 10px; padding: 8px 12px; }
.chat-list li { font-size: 12px; padding: 8px 10px; }
.chat-list .ci-time { font-size: 10px; }
.chat-input { font-size: 12.5px; padding: 8px 12px; }
.chat-sugg { font-size: 11.5px; padding: 6px 12px; }
.msg .cite-chip { font-size: 10px; }
.msg .src-tag { font-size: 9px; }

/* Knowledge */
.knowledge-tabs { margin-bottom: 14px; }
.ktab { font-size: 12px; padding: 7px 14px; }
.k-queue li, .captured li { padding: 11px 14px; font-size: 12px; }
.expert { padding: 12px 14px; }
.expert-name { font-size: 13px; }
.expert-role { font-size: 11px; margin-top: 2px; }
.expert-tags { gap: 4px; margin-top: 6px; }
.tag { font-size: 10px; padding: 1px 7px; }

/* Quotes KPI row */
.kpi-row { gap: 12px; margin-bottom: 16px; }
.kpi { padding: 14px 12px; }
.kpi-num { font-size: 22px; }
.kpi-lab { font-size: 10.5px; }

/* Quote workspace */
.qw-summary { padding: 12px 16px; gap: 18px; }
.qw-sum-key { font-size: 9.5px; }
.qw-sum-val { font-size: 12px; }
.qline-table th, .qline-table td { font-size: 11.5px; padding: 6px 10px; }
.qrationale h4 { font-size: 12px; }
.qrationale li { font-size: 11.5px; }
.qref-section h4 { font-size: 12px; }
.qref-list li { font-size: 11.5px; }

/* Approvals */
.appr-tabs .atab { font-size: 12px; padding: 7px 14px; }
.ap-card { padding: 13px 16px; }
.ap-type { font-size: 9.5px; padding: 1px 7px; }
.ap-title { font-size: 13px; }
.ap-when { font-size: 10.5px; }
.ap-meta span { font-size: 11px; }
.ap-flags li { font-size: 11px; }
.ap-note { font-size: 11.5px; line-height: 1.55; }
.rule-trigger { font-size: 11.5px; }
.rule-level { font-size: 10px; }
.rule-auto { font-size: 10px; }

/* Admin grid + sub-cards */
.admin-grid { gap: 10px; }
.admin-card { padding: 11px 13px; }
.admin-card h4 { font-size: 12.5px; margin-bottom: 4px; }
.admin-desc { font-size: 11px; line-height: 1.5; margin-bottom: 8px; }
.admin-meta { font-size: 10px; }
.rbac-col h5 { font-size: 10px; }
.rbac-col li { font-size: 12px; padding: 7px 0; }
.rbac-sub { font-size: 10.5px; }
.threshold-list li { font-size: 12px; padding: 7px 0; }
.kb-list li { font-size: 11.5px; padding: 7px 0; }

/* Portfolio scan */
.ps-meta-row { font-size: 12px; }
.ps-key { font-size: 11px; min-width: 96px; }
.ps-h4 { font-size: 12.5px; }
.ps-cand { padding: 12px 14px; }
.ps-cand-name { font-size: 13px; }
.ps-cand-rec { font-size: 10px; padding: 2px 7px; }
.ps-cand-sum { font-size: 11.5px; line-height: 1.5; }
.ps-cand-grid { font-size: 11px; }
.ps-cand-reason { font-size: 11px; }
.ps-footnote { font-size: 10.5px; }

/* Empty-card hint (e.g. Projects archive placeholder) */
.empty-card h3 { font-size: 14px; }
.empty-card p { font-size: 11.5px; line-height: 1.55; }

/* ============================================================
   Inquiries page: 2-column split (unprocessed left, in-flight right)
   ============================================================ */

.inquiry-split { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.inquiry-pane { padding: 18px 20px 16px; }
.inquiry-pane .card-head { padding-bottom: 8px; margin-bottom: 10px; }
.inquiry-pane .card-head h3 { font-size: 15.5px; }
.inquiry-pane .card-head .card-meta { font-size: 11px; color: var(--text-faint); }

/* Left: keep the existing .inquiry-list look but trim padding to match the new pane size */
.inquiry-pane-left .inquiry-list { margin: 0; }
.inquiry-pane-left .inquiry-list ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.inquiry-pane-left .inquiry-list li { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--border-soft); border-radius: 6px; background: var(--off-white); cursor: pointer; transition: all 0.15s; }
.inquiry-pane-left .inquiry-list li:hover { border-color: var(--gold); background: #fff; }
.inquiry-pane-left .inquiry-list .iq-main { flex: 1; min-width: 0; }
.inquiry-pane-left .inquiry-list .iq-title { font-size: 12.5px; line-height: 1.35; }
.inquiry-pane-left .inquiry-list .iq-from { font-size: 10.5px; color: var(--text-faint); margin-top: 2px; }
.inquiry-pane-left .inquiry-list .iq-time { font-size: 10px; color: var(--text-faint); flex-shrink: 0; align-self: center; }

/* Right: in-flight status grouped by stage */
.inquiry-status { display: flex; flex-direction: column; gap: 14px; }
.iq-status-empty { padding: 14px; font-size: 12px; color: var(--text-faint); font-style: italic; text-align: center; background: var(--off-white); border-radius: 6px; }
.iq-status-group { display: flex; flex-direction: column; gap: 6px; }
.iq-status-head { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font-weight: 600; }
.iq-status-head .sp-stage { font-size: 10px; }
.iq-status-count { margin-left: auto; padding: 1px 7px; background: var(--paper-2); border-radius: 10px; font-size: 10px; color: var(--text-med); font-family: var(--mono, ui-monospace, monospace); }
.iq-status-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.iq-status-list li { display: flex; gap: 10px; align-items: center; padding: 8px 12px; border: 1px solid var(--border-soft); border-radius: 6px; background: var(--off-white); cursor: pointer; transition: all 0.15s; }
.iq-status-list li:hover { border-color: var(--gold); background: #fff; }
.iq-status-main { flex: 1; min-width: 0; }
.iq-status-title { font-size: 12px; line-height: 1.35; color: var(--text-dark); }
.iq-status-meta { font-size: 10.5px; color: var(--text-faint); margin-top: 2px; }

@media (max-width: 1100px) {
  .inquiry-split { grid-template-columns: 1fr; }
}

/* ============================================================
   Dark mode override (deep navy page surface, cream text)
   Aligned with home.drsleelifesciences.com brand language:
   navy primary + cream typography + gold accent.
   ============================================================ */

:root {
  --off-white:  #142537;
  --paper:      #1c3149;
  --paper-2:    #243d57;
  --cream:      #34516e;
  --text-dark:  #ece6d4;
  --text-med:   #c2bcab;
  --text-light: #968f80;
  --text-faint: #6f7886;
  --border:     #2a4060;
  --border-soft:#1f3149;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.30);
  --shadow-md: 0 2px 10px rgba(0,0,0,0.32);
  --shadow-lg: 0 10px 28px rgba(0,0,0,0.45);
}

html, body { background: #0e1c2d; color: var(--text-dark); }

.topbar  { background: #0a1828; border-bottom-color: var(--border); box-shadow: 0 1px 0 rgba(0,0,0,0.30); }
.sidebar { background: #0a1828; border-right-color: var(--border); }

.brand-name { color: var(--gold); }
.customer-name { color: var(--text-dark); border-color: var(--border); background: var(--paper); }

.user-block:hover { background: var(--paper-2); border-color: var(--border); }
.user-name { color: var(--gold); }
.user-role { color: var(--text-med); }

.nav-item { color: var(--text-med); }
.nav-item:hover { background: var(--paper); color: var(--text-dark); }
.nav-item.active { background: var(--paper-2); color: var(--gold); }
.nav-foot-line { color: var(--text-faint); }

.page-head { border-bottom-color: var(--border); }
.page-head h1 { color: var(--text-dark); }
.page-head .page-sub { color: var(--text-med); }
.back-link { color: var(--text-faint); }
.back-link:hover { color: var(--gold); }

.card { background: var(--paper); border: 1px solid var(--border); box-shadow: var(--shadow-md); }
.card-head { border-bottom-color: var(--border-soft); }
.card-head h3 { color: var(--text-dark); }
.card-meta { color: var(--text-faint); }
.card-link { color: var(--gold); }

.inquiry-list li { background: var(--paper-2); border-color: var(--border); }
.inquiry-list li:hover { background: #2d4a68; border-color: var(--gold); }
.iq-title { color: var(--text-dark); }
.iq-from  { color: var(--text-faint); }
.iq-time  { color: var(--text-faint); }

.iq-status-list li { background: var(--paper-2); border-color: var(--border); }
.iq-status-list li:hover { background: #2d4a68; border-color: var(--gold); }
.iq-status-title { color: var(--text-dark); }
.iq-status-meta  { color: var(--text-faint); }
.iq-status-empty { background: var(--paper-2); color: var(--text-faint); border: 1px dashed var(--border); }
.iq-status-count { background: var(--paper); color: var(--text-med); }

.iw-pane, .iw-input, .iw-results { background: var(--paper); }
.iw-head { border-bottom-color: var(--border-soft); }
.iw-head h2 { color: var(--text-dark); }
.iw-num { color: var(--gold); }
.empty-state h3 { color: var(--text-dark); }
.empty-state p  { color: var(--text-med); }

input[type="text"], input[type="number"], input[type="date"], textarea, select,
.inquiry-input, .chat-input, .cp-input,
.edit-form input, .edit-form select, .edit-form textarea {
  background: #0a1828; color: var(--text-dark); border-color: var(--border);
}
input:focus, textarea:focus, select:focus,
.inquiry-input:focus, .chat-input:focus, .cp-input:focus {
  background: var(--paper); border-color: var(--gold);
}

.ext-list li { border-bottom-color: var(--border-soft); }
.ext-key { color: var(--text-faint); }
.ext-val { color: var(--text-dark); }
.service-match { background: var(--paper-2); color: var(--text-dark); }
.pill { background: var(--paper); color: var(--gold); }

.loader-steps li { color: var(--text-faint); }
.loader-steps li.active { color: var(--gold); }
.loader-steps li.done   { color: var(--text-med); }
.loader-bar { background: var(--paper-2); }
.loader-fill { background: var(--gold); }

.cluster-head { background: var(--paper-2); color: var(--text-dark); }
.cluster-head:hover { background: #2d4a68; }
.cluster-name  { color: var(--text-dark); }
.cluster-count { color: var(--text-faint); }
.cand { background: var(--paper-2); border-color: var(--border); }
.cand:hover { background: #2d4a68; }
.cand-title { color: var(--text-dark); }
.cand-snip { color: var(--text-med); }
.cand-cite a { color: var(--gold); }
.conf-num { color: var(--gold); }
.conf-bar { background: var(--paper); }
.conf-fill { background: var(--gold); }

.meth-tab { background: var(--paper-2); border-color: var(--border); }
.meth-tab:hover { border-color: var(--gold-soft); background: #2d4a68; }
.meth-tab.active { background: var(--paper); border-color: var(--gold); }
.meth-tab-num   { color: var(--text-faint); }
.meth-tab-label { color: var(--text-dark); }
.meth-tab.active .meth-tab-label { color: var(--gold); }
.meth-stage-head h4 { color: var(--text-dark); }
.meth-stage-note { background: var(--paper-2); color: var(--text-med); }
.meth-suggestion { background: var(--paper-2); border-color: var(--border); }
.meth-suggestion:hover { border-color: var(--gold-soft); }
.meth-title  { color: var(--text-dark); }
.meth-summary{ color: var(--text-med); }
.meth-btn { background: var(--paper); color: var(--text-med); border-color: var(--border); }
.meth-btn:hover { background: #2d4a68; color: var(--gold); border-color: var(--gold); }
.meth-btn-rationale { background: rgba(201,169,97,0.18); color: var(--gold); border-color: rgba(201,169,97,0.45); }
.meth-no-source { color: var(--text-faint); }

.output-meta { color: var(--text-faint); }
.output-body { color: var(--text-dark); }
.output-toggle .tog { background: var(--paper); color: var(--text-med); border-color: var(--border); }
.output-toggle .tog.active { background: var(--paper-2); color: var(--gold); border-color: var(--gold); }

.rat-rec { color: var(--text-dark); }
.rat-num { color: var(--gold); }
.rat-text { color: var(--text-med); }
.rel-table th, .rel-table td { border-bottom-color: var(--border-soft); color: var(--text-med); }
.rel-signal { color: var(--text-dark); }
.rel-bar { background: var(--paper-2); }
.rel-fill { background: var(--gold); }
.rel-intro { color: var(--text-med); }

.source-drawer { background: var(--paper); border-left-color: var(--border); box-shadow: -10px 0 32px rgba(0,0,0,0.45); }
.sd-head { border-bottom-color: var(--border-soft); }
.sd-title { color: var(--text-dark); }
.sd-eyebrow { color: var(--text-faint); }
.sd-section h5 { color: var(--text-faint); }
.sd-section p, .sd-source-list li { color: var(--text-med); }
.sd-preview { background: var(--paper-2); color: var(--text-dark); border-left-color: var(--gold); }
.sd-foot { border-top-color: var(--border-soft); }
.sd-close { color: var(--text-faint); }
.sd-close:hover { color: var(--text-dark); }

.chat-popup { background: var(--paper); border-color: var(--border); box-shadow: 0 16px 40px rgba(0,0,0,0.50); }
.cp-head { border-bottom-color: var(--border-soft); }
.cp-title { color: var(--text-dark); }
.cp-eyebrow { color: var(--text-faint); }
.cp-empty { background: var(--paper-2); color: var(--text-med); border-left-color: var(--gold); }
.cp-sug-head { color: var(--text-faint); }
.cp-sug-chip { background: var(--paper-2); color: var(--text-med); border-color: var(--border); }
.cp-sug-chip:hover { background: #2d4a68; color: var(--gold); border-color: var(--gold); }
.cp-msg-bot .cp-msg-bubble { background: var(--paper-2); color: var(--text-dark); }
.cp-foot { border-top-color: var(--border-soft); }
.cp-full-link { color: var(--text-faint); }
.cp-full-link:hover { color: var(--gold); }
.cp-close { color: var(--text-faint); }
.cp-close:hover { color: var(--text-dark); }

.modal-backdrop { background: rgba(5, 12, 22, 0.72); }
.modal { background: var(--paper); border-top-color: var(--gold); }
.modal h3 { color: var(--text-dark); }
#modalBody { color: var(--text-med); }
.edit-hint { color: var(--text-faint); }
.edit-hint code { background: var(--paper-2); color: var(--gold); }
.stub-banner { background: var(--paper-2); color: var(--text-med); border-left-color: var(--gold); }

.edit-table th { color: var(--text-faint); border-bottom-color: var(--border); }
.edit-table td { border-bottom-color: var(--border-soft); }
.edit-table input { color: var(--text-dark); background: transparent; }
.edit-table input:focus { background: var(--paper-2); border-color: var(--gold-soft); }
.edit-list-item { background: var(--paper-2); border-color: var(--border); color: var(--text-dark); }
.edit-list-item .item-sub { color: var(--text-faint); }
.edit-list-item .item-main code { background: var(--paper); color: var(--gold); }
.rbac-empty { background: var(--paper-2); color: var(--text-faint); border-color: var(--border); }
.btn-icon { background: transparent; border-color: var(--border); color: var(--text-faint); }
.btn-icon:hover { color: #ff8888; border-color: #ff8888; }
.btn-link { color: var(--gold); }
.btn-link:hover { color: var(--gold-soft); }

.home-status-card .status-summary-text { background: var(--paper-2); color: var(--text-dark); border-left-color: var(--gold); }
.home-status-card .status-summary-text a { color: var(--gold); }
.home-status-card .status-summary-text b { color: var(--gold); }
.home-status-card .sp-row { background: var(--paper-2); border-color: var(--border); }
.home-status-card .sp-row:hover { background: #2d4a68; border-color: var(--gold); }
.home-status-card .sp-title { color: var(--text-dark); }
.home-status-card .sp-meta  { color: var(--text-faint); }
.home-status-card .sp-empty { background: var(--paper-2); color: var(--text-faint); }
.home-weekly-card .weekly-summary-text { background: var(--paper-2); color: var(--text-dark); border-left-color: var(--gold); }
.home-weekly-card .weekly-summary-text b { color: var(--gold); }
.home-weekly-card .wa-group { background: var(--paper-2); border-color: var(--border); }
.home-weekly-card .wa-cat-label { color: var(--text-dark); }
.home-weekly-card .wa-list li { color: var(--text-med); }
.home-weekly-card .wa-cat-count { background: var(--paper); color: var(--text-med); }
.knowledge-activity-card .weekly-summary-text { background: var(--paper-2); color: var(--text-dark); border-left-color: var(--gold); }
.knowledge-activity-card .wa-group { background: var(--paper-2); border-color: var(--border); }

.kpi { background: var(--paper-2); border-color: var(--border); }
.kpi-num { color: var(--gold); }
.kpi-lab { color: var(--text-faint); }
.kpi-link { background: var(--paper-2); }
.kpi-link:hover { background: #2d4a68; border-color: var(--gold); }

.appr-tabs .atab { background: var(--paper); color: var(--text-med); border-color: var(--border); }
.appr-tabs .atab.active { background: var(--paper-2); color: var(--gold); border-color: var(--gold); }
.ap-card { background: var(--paper-2); border-color: var(--border); }
.ap-title { color: var(--text-dark); }
.ap-when, .ap-meta span { color: var(--text-faint); }
.ap-flags li { color: var(--text-med); }
.ap-note { background: var(--paper); color: var(--text-med); border-left-color: var(--gold); }
.rules-list li { border-bottom-color: var(--border-soft); }
.rule-trigger { color: var(--text-dark); }

.knowledge-tabs { border-bottom-color: var(--border); }
.ktab { color: var(--text-med); background: transparent; }
.ktab.active { color: var(--gold); border-bottom-color: var(--gold); }
.k-queue li, .captured li { background: var(--paper-2); border-color: var(--border); color: var(--text-dark); }
.k-queue li:hover, .captured li:hover { background: #2d4a68; }
.expert { background: var(--paper-2); border-color: var(--border); }
.expert-name { color: var(--text-dark); }
.expert-role { color: var(--text-faint); }
.tag { background: var(--paper); color: var(--text-med); border-color: var(--border); }
.tag.sole { background: rgba(201,169,97,0.18); color: var(--gold); }

.qw-summary { background: var(--paper-2); border-color: var(--border); }
.qw-sum-key { color: var(--text-faint); }
.qw-sum-val { color: var(--text-dark); }
.qline-table th, .qline-table td { border-bottom-color: var(--border-soft); color: var(--text-med); }
.qline-table th { color: var(--text-faint); }
.qrationale h4, .qref-section h4 { color: var(--text-dark); }
.qrationale li, .qref-list li { color: var(--text-med); }

.admin-card { background: var(--paper-2); border-color: var(--border); }
.admin-card:hover { background: #2d4a68; border-color: var(--gold); }
.admin-card h4 { color: var(--text-dark); }
.admin-desc { color: var(--text-med); }
.admin-meta { color: var(--text-faint); }
.rbac-col li { border-bottom-color: var(--border-soft); color: var(--text-dark); }
.rbac-sub { color: var(--text-faint); }
.threshold-list li, .kb-list li { border-bottom-color: var(--border-soft); color: var(--text-dark); }
.thr-val { color: var(--gold); }
.kb-list code { background: var(--paper); color: var(--gold); }
.kb-auth, .kb-scope { color: var(--text-faint); }

.ps-cand { background: var(--paper-2); border-color: var(--border); }
.ps-key { color: var(--text-faint); }
.ps-cand-name { color: var(--text-dark); }
.ps-cand-sum  { color: var(--text-med); }
.ps-cand-reason { color: var(--text-med); border-top-color: var(--border-soft); }
.ps-footnote { color: var(--text-faint); }
.ps-footnote code { background: var(--paper); color: var(--gold); }

.btn-ghost { background: transparent; border: 1px solid var(--border); color: var(--text-dark); }
.btn-ghost:hover { background: var(--paper-2); border-color: var(--gold); color: var(--gold); }
.btn-primary { background: var(--gold); color: #0e1c2d; border: none; }
.btn-primary:hover { background: var(--gold-soft); }
.btn-text { background: transparent; color: var(--text-faint); }
.btn-text:hover { color: var(--gold); }

.iq-rule { background: rgba(201,169,97,0.18); color: var(--gold); }
.iq-rule.high_value { background: rgba(201,169,97,0.25); color: var(--gold); }
.iq-rule.very_high { background: rgba(180, 60, 60, 0.25); color: #f0a8a8; }
.li-status.new   { background: rgba(46, 130, 60, 0.30); color: #b8e0b8; }
.li-status.draft { background: rgba(201, 169, 97, 0.20); color: var(--gold); }
.li-status.ready { background: rgba(46, 130, 200, 0.25); color: #98c8ee; }
.li-status.urgent{ background: rgba(180, 60, 60, 0.30); color: #f0a8a8; }
.li-status.skip  { background: var(--paper); color: var(--text-faint); }

.iq-toggle-pill.off { background: rgba(46, 130, 60, 0.30); color: #b8e0b8; border-color: rgba(46, 130, 60, 0.5); }
.iq-toggle-pill.on  { background: rgba(180, 60, 60, 0.30); color: #f0a8a8; border-color: rgba(180, 60, 60, 0.5); }
.iq-skipped { opacity: 0.55; }
.iq-skip-reason { color: var(--text-faint); }

.sp-stage.stage-opened-to-process { background: var(--paper); color: var(--text-med); border-color: var(--border); }
.sp-stage.stage-awaiting-technical-assessment { background: rgba(201,169,97,0.20); color: var(--gold); border-color: rgba(201,169,97,0.45); }
.sp-stage.stage-awaiting-quote { background: rgba(46, 130, 200, 0.22); color: #98c8ee; border-color: rgba(46, 130, 200, 0.45); }
.sp-stage.stage-awaiting-approval { background: rgba(180, 60, 60, 0.25); color: #f0a8a8; border-color: rgba(180, 60, 60, 0.45); }

.cp-cite { background: rgba(201,169,97,0.18); color: var(--gold); }
.meth-btn-shared .meth-btn-src-type   { background: #4a7fa6; color: #fff; }
.meth-btn-internal .meth-btn-src-type { background: var(--gold); color: #0e1c2d; }
.meth-btn-past .meth-btn-src-type     { background: #5fae7f; color: #0e1c2d; }
.meth-btn-external .meth-btn-src-type { background: var(--text-light); color: #0e1c2d; }
.meth-btn-vendor .meth-btn-src-type   { background: #c79de1; color: #0e1c2d; }

.cand-source.past       { background: rgba(95, 174, 127, 0.22); color: #b8e8c8; }
.cand-source.pubmed     { background: rgba(74, 127, 166, 0.30); color: #c0d8ee; }
.cand-source.semscholar { background: rgba(74, 127, 166, 0.30); color: #c0d8ee; }
.cand-source.jira       { background: rgba(46, 130, 200, 0.25); color: #98c8ee; }
.cand-source.gdrive     { background: rgba(201, 169, 97, 0.22); color: var(--gold); }
.cand-source.quote      { background: rgba(201, 169, 97, 0.22); color: var(--gold); }
.cand-source.vendor     { background: rgba(199, 157, 225, 0.25); color: #e8caf8; }
.cand-source.tool       { background: var(--paper); color: var(--text-med); }
.cand-source.shared     { background: var(--navy); color: #fff; }
.rel-tag.peer, .rel-tag.past, .rel-tag.verified { background: rgba(95, 174, 127, 0.22); color: #b8e8c8; }
.rel-tag.vendor    { background: rgba(199, 157, 225, 0.25); color: #e8caf8; }
.rel-tag.ecosystem { background: var(--paper); color: var(--text-med); }
.rel-tag.shared    { background: var(--navy); color: #fff; }

.role-tier-pill.level-1 { background: var(--paper); color: var(--text-med); border-color: var(--border); }
.role-tier-pill.level-2 { background: rgba(201,169,97,0.22); color: var(--gold); border-color: rgba(201,169,97,0.45); }
.role-tier-pill.level-3 { background: var(--navy); color: #fff; }
.role-tier-pill.junior  { background: var(--paper); color: var(--text-med); border-color: var(--border); }
.role-tier-pill.senior  { background: rgba(201,169,97,0.22); color: var(--gold); border-color: rgba(201,169,97,0.45); }
.role-tier-pill.ceo     { background: var(--navy); color: #fff; }

.role-dropdown { background: var(--paper); border-color: var(--border); }
.role-dropdown li:hover { background: var(--paper-2); }
.role-dropdown li.active { background: rgba(201,169,97,0.15); }
.rdl-name  { color: var(--gold); }
.rdl-title { color: var(--text-faint); }

.toast { background: var(--paper-2); color: var(--text-dark); border: 1px solid var(--border); }

.empty-card { background: var(--paper); border: 1px dashed var(--border); }
.empty-card h3 { color: var(--text-dark); }
.empty-card p  { color: var(--text-med); }

a { color: var(--gold); }
a:hover { color: var(--gold-soft); }
.weekly-range input[type="date"] { color-scheme: dark; }
.wr-label { color: var(--text-faint); }

.shared-row.granted { background: var(--paper-2); border-color: var(--border); border-left-color: #5fae7f; }
.shared-row.pending { background: var(--paper-2); border-color: var(--border); border-left-color: var(--gold); }
.access-pill.access-granted { background: rgba(95, 174, 127, 0.25); color: #b8e8c8; }
.access-pill.access-pending { background: rgba(201,169,97,0.22); color: var(--gold); }
.plane-managed.plane-customer    { background: rgba(201,169,97,0.22); color: var(--gold); }
.plane-managed.plane-dr-lee      { background: var(--navy); color: #fff; }
.plane-managed.plane-engineering { background: var(--paper); color: var(--text-med); }

/* ============================================================
   Cream card overlay (page stays dark navy; cards + banners cream)
   Sits after the dark mode block so it wins the cascade. Page-level
   chrome (body, topbar, sidebar, page-head, brand, nav, user-block)
   keeps cream text on the deep navy surface; the rest sits on cream
   cards with dark navy text.
   ============================================================ */

:root {
  --paper:      #F4ECD9;   /* cream card */
  --paper-2:    #E8DCC4;   /* cream hover / second-level surface */
  --cream:      #FAFAF7;   /* lightest, near-white */
  --text-dark:  #2A2A26;   /* primary text on cream */
  --text-med:   #4A4A45;
  --text-light: #5A5A54;
  --text-faint: #8B8B83;
  --border:     #D9CFB9;
  --border-soft:#E8DCC4;
  --shadow-md: 0 2px 10px rgba(0,0,0,0.22);
  --shadow-lg: 0 10px 28px rgba(0,0,0,0.32);
}

/* Page-level chrome remains cream-on-navy */
html, body { color: #ece6d4; }
.page-head h1 { color: #ece6d4; }
.page-head .page-sub { color: #c2bcab; }
.back-link { color: #968f80; }
.back-link:hover { color: var(--gold); }
.nav-item { color: #c2bcab; }
.nav-item:hover { background: rgba(255,255,255,0.06); color: #ece6d4; }
.nav-item.active { background: rgba(201,169,97,0.15); color: var(--gold); }
.nav-foot-line { color: #6f7886; }
.brand-by { color: #968f80; }
.customer-name { color: #ece6d4; background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.10); }
.user-name { color: var(--gold); }
.user-role { color: #c2bcab; }
.user-block:hover { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.10); }

/* Cards now appear cream */
.card { background: var(--paper); border: 1px solid var(--border); box-shadow: var(--shadow-md); color: var(--text-dark); }

/* Second-level surfaces inside cards (rows, hover, callouts) */
.inquiry-list li,
.iq-status-list li,
.cand,
.cluster-head,
.meth-tab,
.meth-suggestion,
.ap-card,
.k-queue li,
.captured li,
.expert,
.qw-summary,
.admin-card,
.ps-cand,
.kpi,
.kpi-link,
.home-status-card .sp-row,
.iq-status-empty,
.shared-row.granted,
.shared-row.pending,
.edit-list-item { background: var(--paper-2); border-color: var(--border); color: var(--text-dark); }

/* Hover state for any cream-tone row should darken slightly, not jump to navy */
.inquiry-list li:hover,
.iq-status-list li:hover,
.cand:hover,
.cluster-head:hover,
.meth-tab:hover,
.k-queue li:hover,
.captured li:hover,
.admin-card:hover,
.home-status-card .sp-row:hover,
.cp-sug-chip:hover,
.kpi-link:hover { background: #DFD2B4; border-color: var(--gold); }

/* Workspace input panes also cream */
.iw-pane, .iw-input, .iw-results { background: var(--paper); color: var(--text-dark); }
.iw-head h2, .iw-num { color: var(--text-dark); }
.empty-state h3 { color: var(--text-dark); }
.empty-state p { color: var(--text-med); }

/* Form fields: lightest cream so they stand out from card paper */
input[type="text"], input[type="number"], input[type="date"], textarea, select,
.inquiry-input, .chat-input, .cp-input,
.edit-form input, .edit-form select, .edit-form textarea {
  background: var(--cream); color: var(--text-dark); border-color: var(--border);
}
input:focus, textarea:focus, select:focus,
.inquiry-input:focus, .chat-input:focus, .cp-input:focus {
  background: #fff; border-color: var(--gold);
}
.weekly-range input[type="date"] { color-scheme: light; }

/* Buttons on cream */
.btn-ghost { background: transparent; color: var(--text-dark); border: 1px solid var(--border); }
.btn-ghost:hover { background: var(--paper-2); color: var(--text-dark); border-color: var(--gold); }
.btn-primary { background: var(--gold); color: #fff; }
.btn-primary:hover { background: var(--gold-soft); color: #fff; }
.btn-text { background: transparent; color: var(--text-light); }
.btn-text:hover { color: var(--navy); }
.btn-link { color: var(--navy); }
.btn-link:hover { color: var(--gold); }
.btn-icon { color: var(--text-faint); border-color: var(--border); }
.btn-icon:hover { color: #b03c3c; border-color: #b03c3c; }

/* Callouts / banners (status + weekly summary + sd-preview + cp-empty + stub-banner + ap-note + .pill)*/
.home-status-card .status-summary-text { background: #FAF5E3; color: var(--text-dark); border-left-color: var(--gold); }
.home-status-card .status-summary-text a { color: var(--navy); }
.home-status-card .status-summary-text b { color: var(--navy-deep); }
.home-status-card .sp-title { color: var(--text-dark); }
.home-status-card .sp-meta  { color: var(--text-faint); }
.home-status-card .sp-empty { background: var(--paper-2); color: var(--text-faint); }
.home-weekly-card .weekly-summary-text { background: #FAF5E3; color: var(--text-dark); border-left-color: var(--gold); }
.home-weekly-card .weekly-summary-text b { color: var(--navy-deep); }
.home-weekly-card .wa-group { background: var(--paper-2); border-color: var(--border); }
.home-weekly-card .wa-cat-label { color: var(--navy-deep); }
.home-weekly-card .wa-list li { color: var(--text-med); }
.home-weekly-card .wa-cat-count { background: var(--paper); color: var(--text-med); }
.knowledge-activity-card .weekly-summary-text { background: #FAF5E3; color: var(--text-dark); border-left-color: var(--gold); }
.knowledge-activity-card .wa-group { background: var(--paper-2); border-color: var(--border); }
.ap-note { background: #FAF5E3; color: var(--text-med); border-left-color: var(--gold); }
.stub-banner { background: #FAF5E3; color: var(--text-med); border-left-color: var(--gold); }
.cp-empty { background: #FAF5E3; color: var(--text-med); border-left-color: var(--gold); }
.sd-preview { background: #FAF5E3; color: var(--text-dark); border-left-color: var(--gold); }
.service-match { background: var(--paper-2); color: var(--text-dark); }
.pill { background: var(--paper-2); color: var(--gold); }

/* Chat popup + source drawer use cream paper */
.chat-popup { background: var(--paper); border-color: var(--border); box-shadow: 0 16px 40px rgba(0,0,0,0.42); }
.source-drawer { background: var(--paper); border-left-color: var(--border); box-shadow: -10px 0 32px rgba(0,0,0,0.35); }
.cp-title, .sd-title { color: var(--navy-deep); }
.cp-eyebrow, .sd-eyebrow, .sd-section h5, .cp-sug-head { color: var(--text-faint); }
.sd-section p, .sd-source-list li { color: var(--text-med); }
.cp-msg-bot .cp-msg-bubble { background: var(--paper-2); color: var(--text-dark); }
.cp-msg-user .cp-msg-bubble { background: var(--navy); color: #fff; }
.cp-sug-chip { background: var(--cream); color: var(--text-med); border-color: var(--border); }
.cp-full-link { color: var(--text-faint); }
.cp-full-link:hover { color: var(--navy); }
.sd-close, .cp-close { color: var(--text-faint); }
.sd-close:hover, .cp-close:hover { color: var(--navy); }

/* Modal cream + dark text */
.modal { background: var(--paper); border-top-color: var(--gold); box-shadow: var(--shadow-lg); }
.modal h3 { color: var(--navy-deep); }
#modalBody { color: var(--text-med); }
.modal-backdrop { background: rgba(5, 12, 22, 0.72); }

/* Role dropdown stays in the top-bar (dark) context */
.role-dropdown { background: #142537; border-color: #2a4060; box-shadow: 0 12px 28px rgba(0,0,0,0.45); }
.role-dropdown li:hover { background: rgba(255,255,255,0.06); }
.role-dropdown li.active { background: rgba(201,169,97,0.18); }
.rdl-name  { color: var(--gold); }
.rdl-title { color: #968f80; }
.role-dd-head { color: #968f80; }

/* Status / stage / tier pills on cream */
.li-status.new   { background: #d8efdf; color: #1f6e3a; }
.li-status.draft { background: var(--gold-tint); color: #6a4e0f; }
.li-status.ready { background: #d6e6f4; color: #1a4d80; }
.li-status.urgent{ background: #f4d8d8; color: #8a1f1f; }
.li-status.skip  { background: var(--paper-2); color: var(--text-faint); }

.iq-toggle-pill.off { background: #d8efdf; color: #1f6e3a; border-color: #b5d6c0; }
.iq-toggle-pill.on  { background: #f4d8d8; color: #8a1f1f; border-color: #d9b8b8; }

.sp-stage.stage-opened-to-process { background: var(--paper-2); color: var(--text-med); border-color: var(--border); }
.sp-stage.stage-awaiting-technical-assessment { background: var(--gold-tint); color: #6a4e0f; border-color: #d4c290; }
.sp-stage.stage-awaiting-quote { background: #d6e6f4; color: #1a4d80; border-color: #aec5dc; }
.sp-stage.stage-awaiting-approval { background: #f4d8d8; color: #8a1f1f; border-color: #d9b8b8; }

.iq-rule, .iq-rule.high_value { background: var(--gold-tint); color: #6a4e0f; }
.iq-rule.very_high { background: #f4d8d8; color: #8a1f1f; }

.role-tier-pill.level-1, .role-tier-pill.junior { background: var(--paper-2); color: var(--text-med); border-color: var(--border); }
.role-tier-pill.level-2, .role-tier-pill.senior { background: var(--gold-tint); color: #6a4e0f; border-color: #d4c290; }
.role-tier-pill.level-3, .role-tier-pill.ceo    { background: var(--navy); color: #fff; }

/* Source chips on cream */
.cand-source.past       { background: #d8efdf; color: #1f6e3a; }
.cand-source.pubmed     { background: #d6e6f4; color: #1a4d80; }
.cand-source.semscholar { background: #d6e6f4; color: #1a4d80; }
.cand-source.jira       { background: #d6e6f4; color: #1a4d80; }
.cand-source.gdrive     { background: var(--gold-tint); color: #6a4e0f; }
.cand-source.quote      { background: var(--gold-tint); color: #6a4e0f; }
.cand-source.vendor     { background: #ebd9f4; color: #5a1f7a; }
.cand-source.tool       { background: var(--paper-2); color: var(--text-med); }
.cand-source.shared     { background: var(--navy); color: #fff; }
.rel-tag.peer, .rel-tag.past, .rel-tag.verified { background: #d8efdf; color: #1f6e3a; }
.rel-tag.vendor { background: #ebd9f4; color: #5a1f7a; }
.rel-tag.ecosystem { background: var(--paper-2); color: var(--text-med); }
.rel-tag.shared { background: var(--navy); color: #fff; }

.access-pill.access-granted { background: #d8efdf; color: #1f6e3a; }
.access-pill.access-pending { background: var(--gold-tint); color: #6a4e0f; }
.plane-managed.plane-customer    { background: var(--gold-tint); color: #6a4e0f; }
.plane-managed.plane-dr-lee      { background: var(--navy); color: #fff; }
.plane-managed.plane-engineering { background: var(--paper-2); color: var(--text-med); }
.tag.sole { background: var(--gold-tint); color: #6a4e0f; }
.cp-cite { background: var(--gold-tint); color: #6a4e0f; }
.meth-btn-rationale { background: var(--gold-tint); color: #6a4e0f; border-color: #d4c290; }
.meth-btn { background: var(--cream); color: var(--text-med); border-color: var(--border); }
.meth-btn:hover { background: var(--paper-2); color: var(--navy); border-color: var(--gold); }

/* Source type chips inside methodology buttons stay vivid */
.meth-btn-shared .meth-btn-src-type   { background: var(--navy); color: #fff; }
.meth-btn-internal .meth-btn-src-type { background: var(--gold); color: #fff; }
.meth-btn-past .meth-btn-src-type     { background: #2f8f4f; color: #fff; }
.meth-btn-external .meth-btn-src-type { background: var(--text-faint); color: #fff; }
.meth-btn-vendor .meth-btn-src-type   { background: #8a1f7a; color: #fff; }

/* Card-head text + meta on cream */
.card-head h3, .card-head h4 { color: var(--navy-deep); }
.card-head .card-meta { color: var(--text-faint); }
.card-link { color: var(--navy); }
.card-link:hover { color: var(--gold); }

/* Headings inside cards */
.meth-tab-label { color: var(--text-dark); }
.meth-tab.active .meth-tab-label { color: var(--navy); }
.meth-title, .iq-title, .iq-status-title, .ap-title, .expert-name,
.ps-cand-name, .qw-sum-val, .admin-card h4, .rat-rec, .rule-trigger,
.rbac-col li b, .threshold-list li b { color: var(--text-dark); }
.meth-summary, .ps-cand-sum, .ap-flags li, .qrationale li, .qref-list li,
.ap-note, .rat-text, .admin-desc, .rbac-sub { color: var(--text-med); }
.iq-from, .iq-time, .iq-status-meta, .ap-meta span, .ap-when,
.ext-key, .qw-sum-key, .ps-key, .admin-meta,
.meth-stage-note, .iq-skip-reason, .wr-label { color: var(--text-faint); }
.iq-status-count, .wa-cat-count { background: var(--paper); color: var(--text-med); }
.thr-val { color: var(--navy); }
.kb-list code, .ps-footnote code, .edit-hint code { background: var(--cream); color: var(--navy); }

/* Tabs on cream */
.knowledge-tabs, .output-toggle, .appr-tabs { border-bottom-color: var(--border); }
.ktab { color: var(--text-light); }
.ktab.active { color: var(--navy); border-bottom-color: var(--navy); }
.appr-tabs .atab { background: var(--paper-2); color: var(--text-med); border-color: var(--border); }
.appr-tabs .atab.active { background: var(--cream); color: var(--navy); border-color: var(--navy); }
.output-toggle .tog { background: var(--paper-2); color: var(--text-med); border-color: var(--border); }
.output-toggle .tog.active { background: var(--cream); color: var(--navy); border-color: var(--navy); }

/* Tables on cream */
.rel-table th, .rel-table td, .qline-table th, .qline-table td,
.edit-table th, .edit-table td { border-bottom-color: var(--border-soft); }
.rel-table th, .qline-table th { color: var(--text-faint); }
.rel-table td, .qline-table td { color: var(--text-med); }
.rel-signal { color: var(--text-dark); }
.rel-bar { background: var(--paper-2); }
.rel-fill { background: var(--gold); }
.rel-intro { color: var(--text-med); }

/* Loader fill stays gold */
.loader-bar { background: var(--paper-2); }
.loader-fill { background: var(--gold); }
.loader-steps li { color: var(--text-faint); }
.loader-steps li.active { color: var(--navy); }
.loader-steps li.done   { color: var(--text-med); }

/* Inquiry skip row dimming */
.iq-skipped { opacity: 0.55; background: var(--paper-2); }

/* Workflow / portfolio scan bullets */
.weekly-highlights li { border-bottom-color: var(--border-soft); }

/* Toast (top-right notification) cream */
.toast { background: var(--cream); color: var(--text-dark); border: 1px solid var(--border); box-shadow: 0 6px 16px rgba(0,0,0,0.25); }

/* Empty-card placeholder */
.empty-card { background: var(--paper); border: 1px dashed var(--border); }
.empty-card h3 { color: var(--navy-deep); }
.empty-card p  { color: var(--text-med); }

/* Anchors inside cream cards default to navy */
.card a, .modal a, .source-drawer a, .chat-popup a { color: var(--navy); }
.card a:hover, .modal a:hover, .source-drawer a:hover, .chat-popup a:hover { color: var(--gold); }

/* ============================================================
   Light theme final pass (aligned to home.drsleelifesciences.com)
   Page is a soft paper cream (no longer dark navy). Topbar +
   sidebar use the same cream family. Cards sit on top with a
   translucent off-white so they read as a paper-on-paper card,
   not a bright punched-out tile.
   Sits last in the cascade to win over the earlier dark mode
   and cream-card overlay blocks.
   ============================================================ */

:root {
  --paper:      #FAF7EE;   /* card surface (softest off-white) */
  --paper-2:    #F1E9D5;   /* second-level surface / hover */
  --cream:      #FFFFFF;   /* input + lightest */
  --text-dark:  #2A2A26;
  --text-med:   #4A4A45;
  --text-light: #5A5A54;
  --text-faint: #8B8B83;
  --border:     #E5DDC8;
  --border-soft:#EFE8D4;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 2px 10px rgba(31,78,121,0.07);
  --shadow-lg: 0 10px 28px rgba(31,78,121,0.14);
}

/* Page background = soft paper cream */
html, body { background: #F4ECD9; color: var(--text-dark); }

/* Top banner + sidebar share the cream family; topbar is the lightest band so it reads as a header. */
.topbar  { background: rgba(250, 247, 238, 0.92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--border); box-shadow: 0 1px 0 rgba(31,78,121,0.06); }
.sidebar { background: #EFE6CF; border-right: 1px solid var(--border); }

/* Brand + user controls on cream topbar */
.brand-name { color: var(--navy); }
.brand-by   { color: var(--text-faint); }
.dl-mark    { color: var(--navy); }
.customer-name { color: var(--navy-deep); background: rgba(255,255,255,0.55); border: 1px dashed var(--border); }
.user-name { color: var(--navy); }
.user-role { color: var(--text-med); }
.user-block:hover { background: rgba(255,255,255,0.50); border-color: var(--border); }

/* Sidebar nav on cream */
.nav-item { color: var(--text-med); }
.nav-item:hover { background: rgba(255,255,255,0.55); color: var(--navy); }
.nav-item.active { background: rgba(201,169,97,0.25); color: var(--navy-deep); }
.nav-foot-line { color: var(--text-faint); }
.nav-glyph { color: var(--gold); }

/* Page-head text on cream page */
.page-head h1 { color: var(--navy-deep); }
.page-head .page-sub { color: var(--text-med); }
.back-link { color: var(--text-light); }
.back-link:hover { color: var(--gold); }

/* Card: translucent paper so it does not glare on the cream page */
.card { background: rgba(250, 247, 238, 0.7); border: 1px solid var(--border); box-shadow: var(--shadow-md); color: var(--text-dark); }

/* Second-level surfaces inside cards: slightly more saturated cream so rows still read */
.inquiry-list li,
.iq-status-list li,
.cand,
.cluster-head,
.meth-tab,
.meth-suggestion,
.ap-card,
.k-queue li,
.captured li,
.expert,
.qw-summary,
.admin-card,
.ps-cand,
.kpi,
.kpi-link,
.home-status-card .sp-row,
.iq-status-empty,
.shared-row.granted,
.shared-row.pending,
.edit-list-item { background: rgba(241, 233, 213, 0.85); border-color: var(--border); color: var(--text-dark); }

/* Hover state on rows: warmer cream + gold border */
.inquiry-list li:hover,
.iq-status-list li:hover,
.cand:hover,
.cluster-head:hover,
.meth-tab:hover,
.k-queue li:hover,
.captured li:hover,
.admin-card:hover,
.home-status-card .sp-row:hover,
.cp-sug-chip:hover,
.kpi-link:hover { background: rgba(232, 220, 196, 0.95); border-color: var(--gold); }

/* Workspace input panes match the card paper */
.iw-pane, .iw-input, .iw-results { background: rgba(250, 247, 238, 0.5); color: var(--text-dark); }
.iw-head h2, .iw-num { color: var(--navy-deep); }
.empty-state h3 { color: var(--navy-deep); }
.empty-state p { color: var(--text-med); }

/* Form fields sit on white so they stand against the cream paper */
input[type="text"], input[type="number"], input[type="date"], textarea, select,
.inquiry-input, .chat-input, .cp-input,
.edit-form input, .edit-form select, .edit-form textarea {
  background: rgba(255,255,255,0.85); color: var(--text-dark); border-color: var(--border);
}
input:focus, textarea:focus, select:focus,
.inquiry-input:focus, .chat-input:focus, .cp-input:focus {
  background: #fff; border-color: var(--gold);
}
.weekly-range input[type="date"] { color-scheme: light; }

/* Buttons */
.btn-ghost { background: transparent; color: var(--text-dark); border: 1px solid var(--border); }
.btn-ghost:hover { background: rgba(241, 233, 213, 0.85); color: var(--navy); border-color: var(--gold); }
.btn-primary { background: var(--gold); color: #fff; }
.btn-primary:hover { background: var(--gold-soft); color: #fff; }
.btn-text { background: transparent; color: var(--text-light); }
.btn-text:hover { color: var(--navy); }
.btn-link { color: var(--navy); }
.btn-link:hover { color: var(--gold); }
.btn-icon { color: var(--text-faint); border-color: var(--border); }
.btn-icon:hover { color: #b03c3c; border-color: #b03c3c; }

/* Callouts / banners: warm gold-tint over cream so they read but do not glare */
.home-status-card .status-summary-text { background: rgba(244, 236, 217, 0.6); color: var(--text-dark); border-left-color: var(--gold); }
.home-status-card .status-summary-text a { color: var(--navy); }
.home-status-card .status-summary-text b { color: var(--navy-deep); }
.home-status-card .sp-title { color: var(--text-dark); }
.home-status-card .sp-meta  { color: var(--text-faint); }
.home-status-card .sp-empty { background: rgba(241, 233, 213, 0.6); color: var(--text-faint); }
.home-weekly-card .weekly-summary-text { background: rgba(244, 236, 217, 0.6); color: var(--text-dark); border-left-color: var(--gold); }
.home-weekly-card .weekly-summary-text b { color: var(--navy-deep); }
.home-weekly-card .wa-group { background: rgba(241, 233, 213, 0.7); border-color: var(--border); }
.home-weekly-card .wa-cat-label { color: var(--navy-deep); }
.home-weekly-card .wa-list li { color: var(--text-med); }
.home-weekly-card .wa-cat-count { background: rgba(244, 236, 217, 0.9); color: var(--text-med); }
.knowledge-activity-card .weekly-summary-text { background: rgba(244, 236, 217, 0.6); color: var(--text-dark); border-left-color: var(--gold); }
.knowledge-activity-card .wa-group { background: rgba(241, 233, 213, 0.7); border-color: var(--border); }
.ap-note { background: rgba(244, 236, 217, 0.6); color: var(--text-med); border-left-color: var(--gold); }
.stub-banner { background: rgba(244, 236, 217, 0.6); color: var(--text-med); border-left-color: var(--gold); }
.cp-empty { background: rgba(244, 236, 217, 0.6); color: var(--text-med); border-left-color: var(--gold); }
.sd-preview { background: rgba(244, 236, 217, 0.6); color: var(--text-dark); border-left-color: var(--gold); }
.service-match { background: rgba(241, 233, 213, 0.7); color: var(--text-dark); }
.pill { background: rgba(241, 233, 213, 0.7); color: var(--gold); }

/* Chat popup + source drawer share the same paper-on-paper look */
.chat-popup { background: rgba(250, 247, 238, 0.96); border-color: var(--border); box-shadow: 0 16px 40px rgba(31,78,121,0.18); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.source-drawer { background: rgba(250, 247, 238, 0.96); border-left-color: var(--border); box-shadow: -10px 0 32px rgba(31,78,121,0.16); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.cp-title, .sd-title { color: var(--navy-deep); }
.cp-eyebrow, .sd-eyebrow, .sd-section h5, .cp-sug-head { color: var(--text-faint); }
.sd-section p, .sd-source-list li { color: var(--text-med); }
.cp-msg-bot .cp-msg-bubble { background: rgba(241, 233, 213, 0.9); color: var(--text-dark); }
.cp-msg-user .cp-msg-bubble { background: var(--navy); color: #fff; }
.cp-sug-chip { background: rgba(255,255,255,0.6); color: var(--text-med); border-color: var(--border); }
.cp-full-link { color: var(--text-faint); }
.cp-full-link:hover { color: var(--navy); }
.sd-close, .cp-close { color: var(--text-faint); }
.sd-close:hover, .cp-close:hover { color: var(--navy); }

/* Modal cream paper + deep navy text */
.modal { background: rgba(250, 247, 238, 0.98); border-top-color: var(--gold); box-shadow: var(--shadow-lg); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.modal h3 { color: var(--navy-deep); }
#modalBody { color: var(--text-med); }
.modal-backdrop { background: rgba(31, 78, 121, 0.20); }

/* Role dropdown matches cream */
.role-dropdown { background: rgba(255,255,255,0.95); border-color: var(--border); box-shadow: 0 12px 28px rgba(31,78,121,0.18); }
.role-dropdown li:hover { background: rgba(241, 233, 213, 0.85); }
.role-dropdown li.active { background: rgba(201,169,97,0.22); }
.rdl-name  { color: var(--navy); }
.rdl-title { color: var(--text-light); }
.role-dd-head { color: var(--text-faint); }

/* Status / stage / tier pills on cream paper */
.li-status.new   { background: #d8efdf; color: #1f6e3a; }
.li-status.draft { background: var(--gold-tint); color: #6a4e0f; }
.li-status.ready { background: #d6e6f4; color: #1a4d80; }
.li-status.urgent{ background: #f4d8d8; color: #8a1f1f; }
.li-status.skip  { background: rgba(241, 233, 213, 0.7); color: var(--text-faint); }

.iq-toggle-pill.off { background: #d8efdf; color: #1f6e3a; border-color: #b5d6c0; }
.iq-toggle-pill.on  { background: #f4d8d8; color: #8a1f1f; border-color: #d9b8b8; }

.sp-stage.stage-opened-to-process { background: rgba(241, 233, 213, 0.8); color: var(--text-med); border-color: var(--border); }
.sp-stage.stage-awaiting-technical-assessment { background: var(--gold-tint); color: #6a4e0f; border-color: #d4c290; }
.sp-stage.stage-awaiting-quote { background: #d6e6f4; color: #1a4d80; border-color: #aec5dc; }
.sp-stage.stage-awaiting-approval { background: #f4d8d8; color: #8a1f1f; border-color: #d9b8b8; }

.iq-rule, .iq-rule.high_value { background: var(--gold-tint); color: #6a4e0f; }
.iq-rule.very_high { background: #f4d8d8; color: #8a1f1f; }

.role-tier-pill.level-1, .role-tier-pill.junior { background: rgba(241, 233, 213, 0.8); color: var(--text-med); border-color: var(--border); }
.role-tier-pill.level-2, .role-tier-pill.senior { background: var(--gold-tint); color: #6a4e0f; border-color: #d4c290; }
.role-tier-pill.level-3, .role-tier-pill.ceo    { background: var(--navy); color: #fff; }

/* Source chips on cream paper */
.cand-source.past       { background: #d8efdf; color: #1f6e3a; }
.cand-source.pubmed     { background: #d6e6f4; color: #1a4d80; }
.cand-source.semscholar { background: #d6e6f4; color: #1a4d80; }
.cand-source.jira       { background: #d6e6f4; color: #1a4d80; }
.cand-source.gdrive     { background: var(--gold-tint); color: #6a4e0f; }
.cand-source.quote      { background: var(--gold-tint); color: #6a4e0f; }
.cand-source.vendor     { background: #ebd9f4; color: #5a1f7a; }
.cand-source.tool       { background: rgba(241, 233, 213, 0.8); color: var(--text-med); }
.cand-source.shared     { background: var(--navy); color: #fff; }
.rel-tag.peer, .rel-tag.past, .rel-tag.verified { background: #d8efdf; color: #1f6e3a; }
.rel-tag.vendor { background: #ebd9f4; color: #5a1f7a; }
.rel-tag.ecosystem { background: rgba(241, 233, 213, 0.8); color: var(--text-med); }
.rel-tag.shared { background: var(--navy); color: #fff; }

.access-pill.access-granted { background: #d8efdf; color: #1f6e3a; }
.access-pill.access-pending { background: var(--gold-tint); color: #6a4e0f; }
.plane-managed.plane-customer    { background: var(--gold-tint); color: #6a4e0f; }
.plane-managed.plane-dr-lee      { background: var(--navy); color: #fff; }
.plane-managed.plane-engineering { background: rgba(241, 233, 213, 0.8); color: var(--text-med); }
.tag.sole { background: var(--gold-tint); color: #6a4e0f; }
.cp-cite { background: var(--gold-tint); color: #6a4e0f; }
.meth-btn-rationale { background: var(--gold-tint); color: #6a4e0f; border-color: #d4c290; }
.meth-btn { background: rgba(255,255,255,0.6); color: var(--text-med); border-color: var(--border); }
.meth-btn:hover { background: rgba(241, 233, 213, 0.85); color: var(--navy); border-color: var(--gold); }

.meth-btn-shared .meth-btn-src-type   { background: var(--navy); color: #fff; }
.meth-btn-internal .meth-btn-src-type { background: var(--gold); color: #fff; }
.meth-btn-past .meth-btn-src-type     { background: #2f8f4f; color: #fff; }
.meth-btn-external .meth-btn-src-type { background: var(--text-faint); color: #fff; }
.meth-btn-vendor .meth-btn-src-type   { background: #8a1f7a; color: #fff; }

/* Card head + meta on cream paper */
.card-head { border-bottom-color: var(--border-soft); }
.card-head h3, .card-head h4 { color: var(--navy-deep); }
.card-head .card-meta { color: var(--text-faint); }
.card-link { color: var(--navy); }
.card-link:hover { color: var(--gold); }

/* Inner text colours */
.meth-tab-label { color: var(--text-dark); }
.meth-tab.active .meth-tab-label { color: var(--navy); }
.meth-title, .iq-title, .iq-status-title, .ap-title, .expert-name,
.ps-cand-name, .qw-sum-val, .admin-card h4, .rat-rec, .rule-trigger,
.rbac-col li b, .threshold-list li b { color: var(--text-dark); }
.meth-summary, .ps-cand-sum, .ap-flags li, .qrationale li, .qref-list li,
.ap-note, .rat-text, .admin-desc, .rbac-sub { color: var(--text-med); }
.iq-from, .iq-time, .iq-status-meta, .ap-meta span, .ap-when,
.ext-key, .qw-sum-key, .ps-key, .admin-meta,
.meth-stage-note, .iq-skip-reason, .wr-label { color: var(--text-faint); }
.iq-status-count, .wa-cat-count { background: rgba(244, 236, 217, 0.8); color: var(--text-med); }
.thr-val { color: var(--navy); }
.kb-list code, .ps-footnote code, .edit-hint code { background: rgba(255,255,255,0.7); color: var(--navy); }

/* Tabs on cream */
.knowledge-tabs, .output-toggle, .appr-tabs { border-bottom-color: var(--border); }
.ktab { color: var(--text-light); background: transparent; }
.ktab.active { color: var(--navy); border-bottom-color: var(--navy); }
.appr-tabs .atab { background: rgba(241, 233, 213, 0.8); color: var(--text-med); border-color: var(--border); }
.appr-tabs .atab.active { background: rgba(255,255,255,0.85); color: var(--navy); border-color: var(--navy); }
.output-toggle .tog { background: rgba(241, 233, 213, 0.8); color: var(--text-med); border-color: var(--border); }
.output-toggle .tog.active { background: rgba(255,255,255,0.85); color: var(--navy); border-color: var(--navy); }

/* Tables */
.rel-table th, .rel-table td, .qline-table th, .qline-table td,
.edit-table th, .edit-table td { border-bottom-color: var(--border-soft); }
.rel-table th, .qline-table th { color: var(--text-faint); }
.rel-table td, .qline-table td { color: var(--text-med); }
.rel-signal { color: var(--text-dark); }
.rel-bar { background: rgba(241, 233, 213, 0.8); }
.rel-fill { background: var(--gold); }
.rel-intro { color: var(--text-med); }

/* Loader */
.loader-bar { background: rgba(241, 233, 213, 0.8); }
.loader-fill { background: var(--gold); }
.loader-steps li { color: var(--text-faint); }
.loader-steps li.active { color: var(--navy); }
.loader-steps li.done   { color: var(--text-med); }

/* Skipped row dim */
.iq-skipped { opacity: 0.55; background: rgba(241, 233, 213, 0.7); }

/* Toast cream */
.toast { background: rgba(255,255,255,0.95); color: var(--text-dark); border: 1px solid var(--border); box-shadow: 0 8px 24px rgba(31,78,121,0.18); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }

/* Empty card placeholder */
.empty-card { background: rgba(250, 247, 238, 0.7); border: 1px dashed var(--border); }
.empty-card h3 { color: var(--navy-deep); }
.empty-card p  { color: var(--text-med); }

/* Anchors */
a { color: var(--navy); }
a:hover { color: var(--gold); }

/* Chat fab keeps the navy bubble + gold hover */
.chat-fab { background: var(--navy); color: #fff; box-shadow: 0 6px 18px rgba(31,78,121,0.30); }
.chat-fab:hover { background: var(--navy-deep); }
.chat-fab.active { background: var(--gold); color: var(--navy); }

/* ============================================================
   Final brand alignment to home.drsleelifesciences.com
   Exact palette + Fraunces serif + Inter sans + paper-with-dots
   background. Sits last so it wins over all earlier theme blocks.
   ============================================================ */

:root {
  /* Exact palette from home.drsleelifesciences.com */
  --navy:        #2C4A6B;   /* slate / grey-blue (not the previous saturated navy) */
  --navy-deep:   #1F3550;
  --gold:        #C5B59A;   /* dusty muted gold */
  --gold-soft:   #D6C9B0;
  --gold-tint:   #EFE7D2;   /* derived for soft tints */
  --sage:        #9BAFA1;
  --sage-soft:   #B0BEB3;
  --accent-warm: #C77E5A;
  --text-emphasis: #A85E3D;

  /* Surfaces */
  --paper:      #F5F3EE;    /* body background base */
  --off-white:  #FAFAF7;    /* lightest band */
  --cream:      #E8DCC4;    /* warm cream (subtle accent surface) */
  --paper-2:    #EFEAD9;    /* second-level surface inside cards */

  /* Text */
  --text-dark:  #2A2A26;
  --text-med:   #4A4A45;
  --text-light: #5A5A54;
  --text-faint: #8B8B83;

  /* Borders */
  --border:     #E5DFD0;
  --border-soft:#EFEAD9;

  /* Fonts (Google: Fraunces serif + Inter sans) */
  --serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --mono:  ui-monospace, 'SF Mono', Consolas, 'Courier New', monospace;
}

/* Body: paper cream with a subtle dot grid (same as the home site) */
html { scroll-behavior: smooth; }
html, body {
  background-color: var(--paper);
  background-image: radial-gradient(circle at center, rgba(44, 74, 107, 0.07) 1.2px, transparent 1.5px);
  background-size: 28px 28px;
  background-position: 0 0;
  color: var(--text-dark);
  font-family: var(--sans);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
}
::selection { background: var(--gold); color: var(--navy-deep); }

/* Top banner: translucent paper above the page */
.topbar {
  background: rgba(245, 243, 238, 0.92);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--border-soft);
  box-shadow: none;
}
.sidebar { background: rgba(245, 243, 238, 0.6); border-right: 1px solid var(--border-soft); }

/* Brand wordmark uses Fraunces serif at brand size */
.brand-name { font-family: var(--serif); color: var(--navy); letter-spacing: 0.4px; font-weight: 600; }
.brand-name .brand-year { font-family: var(--mono); color: var(--gold); }
.brand-by   { font-family: var(--sans); color: var(--text-faint); letter-spacing: 0.12em; text-transform: uppercase; font-size: 9.5px; font-weight: 500; }
.dl-mark    { color: var(--navy); }
.customer-name { font-family: var(--serif); color: var(--navy-deep); background: rgba(255,255,255,0.55); border: 1px dashed var(--border); }

/* User block, sidebar nav text */
.user-name { font-family: var(--serif); color: var(--navy); font-weight: 600; }
.user-role { font-family: var(--sans); color: var(--text-med); }
.user-block:hover { background: rgba(255,255,255,0.55); border-color: var(--border); }
.user-avatar { background: var(--navy); color: #fff; font-family: var(--serif); }

.nav-item { color: var(--text-med); font-family: var(--sans); font-weight: 500; }
.nav-item:hover { background: rgba(255,255,255,0.6); color: var(--navy); }
.nav-item.active { background: rgba(197,181,154,0.25); color: var(--navy-deep); }
.nav-foot-line { color: var(--text-faint); font-family: var(--sans); }
.nav-glyph { color: var(--gold); }

/* Page-head: serif h1 + sans sub */
.page-head h1 { font-family: var(--serif); color: var(--navy-deep); font-weight: 600; letter-spacing: -0.005em; }
.page-head .page-sub { font-family: var(--sans); color: var(--text-med); }
.back-link { font-family: var(--sans); color: var(--text-light); }
.back-link:hover { color: var(--navy); }

/* Cards: translucent paper-on-paper */
.card { background: rgba(250, 250, 247, 0.72); border: 1px solid var(--border); box-shadow: 0 2px 10px rgba(44, 74, 107, 0.06); color: var(--text-dark); }
.card-head h3, .card-head h4 { font-family: var(--serif); color: var(--navy-deep); font-weight: 600; }
.card-head .card-meta { font-family: var(--sans); color: var(--text-faint); }
.card-link { font-family: var(--sans); color: var(--navy); }
.card-link:hover { color: var(--accent-warm); }

/* Second-level surfaces inside cards */
.inquiry-list li,
.iq-status-list li,
.cand,
.cluster-head,
.meth-tab,
.meth-suggestion,
.ap-card,
.k-queue li,
.captured li,
.expert,
.qw-summary,
.admin-card,
.ps-cand,
.kpi,
.kpi-link,
.home-status-card .sp-row,
.iq-status-empty,
.shared-row.granted,
.shared-row.pending,
.edit-list-item { background: rgba(239, 234, 217, 0.65); border-color: var(--border); color: var(--text-dark); }

.inquiry-list li:hover,
.iq-status-list li:hover,
.cand:hover,
.cluster-head:hover,
.meth-tab:hover,
.k-queue li:hover,
.captured li:hover,
.admin-card:hover,
.home-status-card .sp-row:hover,
.cp-sug-chip:hover,
.kpi-link:hover { background: rgba(232, 220, 196, 0.85); border-color: var(--gold); }

/* Workspace input panes match */
.iw-pane, .iw-input, .iw-results { background: rgba(250, 250, 247, 0.55); color: var(--text-dark); }
.iw-head h2 { font-family: var(--serif); color: var(--navy-deep); font-weight: 600; }
.iw-num { font-family: var(--mono); color: var(--gold); }
.empty-state h3 { font-family: var(--serif); color: var(--navy-deep); }
.empty-state p { color: var(--text-med); }

/* Form fields */
input[type="text"], input[type="number"], input[type="date"], textarea, select,
.inquiry-input, .chat-input, .cp-input,
.edit-form input, .edit-form select, .edit-form textarea {
  background: rgba(255,255,255,0.85); color: var(--text-dark); border-color: var(--border);
  font-family: var(--sans);
}
input:focus, textarea:focus, select:focus,
.inquiry-input:focus, .chat-input:focus, .cp-input:focus {
  background: #fff; border-color: var(--navy);
}
.weekly-range input[type="date"] { color-scheme: light; }

/* Buttons */
.btn-ghost { background: transparent; color: var(--text-dark); border: 1px solid var(--border); font-family: var(--sans); }
.btn-ghost:hover { background: rgba(232, 220, 196, 0.6); color: var(--navy); border-color: var(--navy); }
.btn-primary { background: var(--navy); color: #fff; border: none; font-family: var(--sans); font-weight: 500; letter-spacing: 0.02em; }
.btn-primary:hover { background: var(--navy-deep); color: #fff; }
.btn-text { background: transparent; color: var(--text-light); font-family: var(--sans); }
.btn-text:hover { color: var(--navy); }
.btn-link { color: var(--navy); }
.btn-link:hover { color: var(--accent-warm); }

/* Callouts use a warm cream tint with a sage left border (a softer accent than gold) */
.home-status-card .status-summary-text,
.home-weekly-card .weekly-summary-text,
.knowledge-activity-card .weekly-summary-text,
.ap-note, .stub-banner, .cp-empty, .sd-preview {
  background: rgba(232, 220, 196, 0.45);
  color: var(--text-dark);
  border-left-color: var(--sage);
}
.home-status-card .status-summary-text a { color: var(--navy); }
.home-status-card .status-summary-text b,
.home-weekly-card  .weekly-summary-text b,
.knowledge-activity-card .weekly-summary-text b { color: var(--navy-deep); font-family: var(--serif); }
.home-weekly-card .wa-group,
.knowledge-activity-card .wa-group { background: rgba(239, 234, 217, 0.55); border-color: var(--border); }
.home-weekly-card .wa-cat-label { color: var(--navy-deep); font-family: var(--serif); font-weight: 600; }
.home-weekly-card .wa-list li { color: var(--text-med); }
.home-weekly-card .wa-cat-count { background: rgba(245, 243, 238, 0.8); color: var(--text-med); font-family: var(--mono); }
.iq-status-count { background: rgba(245, 243, 238, 0.8); color: var(--text-med); font-family: var(--mono); }
.service-match { background: rgba(239, 234, 217, 0.6); color: var(--text-dark); }
.pill { background: rgba(239, 234, 217, 0.6); color: var(--navy); }

/* Floating surfaces (modal, drawer, chat popup, toast) - cream + blur */
.modal { background: rgba(250, 250, 247, 0.97); border-top-color: var(--gold); box-shadow: 0 10px 28px rgba(44,74,107,0.18); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.modal h3 { font-family: var(--serif); color: var(--navy-deep); }
#modalBody { color: var(--text-med); }
.modal-backdrop { background: rgba(44, 74, 107, 0.25); }

.source-drawer { background: rgba(250, 250, 247, 0.96); border-left-color: var(--border); box-shadow: -10px 0 32px rgba(44,74,107,0.16); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.sd-title { font-family: var(--serif); color: var(--navy-deep); }

.chat-popup { background: rgba(250, 250, 247, 0.96); border-color: var(--border); box-shadow: 0 16px 40px rgba(44,74,107,0.20); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.cp-title { font-family: var(--serif); color: var(--navy-deep); }
.cp-msg-bot .cp-msg-bubble { background: rgba(239, 234, 217, 0.85); color: var(--text-dark); }
.cp-msg-user .cp-msg-bubble { background: var(--navy); color: #fff; }
.cp-sug-chip { background: rgba(255,255,255,0.6); color: var(--text-med); border-color: var(--border); font-family: var(--sans); }
.cp-full-link { color: var(--text-faint); }
.cp-full-link:hover { color: var(--navy); }

.toast { background: rgba(255,255,255,0.95); color: var(--text-dark); border: 1px solid var(--border); box-shadow: 0 8px 24px rgba(44,74,107,0.18); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); font-family: var(--sans); }

/* Role dropdown matches */
.role-dropdown { background: rgba(255,255,255,0.96); border-color: var(--border); box-shadow: 0 12px 28px rgba(44,74,107,0.18); }
.role-dropdown li:hover { background: rgba(232, 220, 196, 0.5); }
.role-dropdown li.active { background: rgba(197,181,154,0.30); }
.rdl-name  { font-family: var(--serif); color: var(--navy); font-weight: 600; }
.rdl-title { color: var(--text-light); }
.role-dd-head { color: var(--text-faint); }

/* Pills (status / stage / tier) on cream */
.li-status.new   { background: rgba(155, 175, 161, 0.30); color: #3d5a48; }   /* sage tint */
.li-status.draft { background: var(--gold-tint); color: #6e5e3e; }
.li-status.ready { background: rgba(44, 74, 107, 0.14); color: var(--navy-deep); }
.li-status.urgent{ background: rgba(199, 126, 90, 0.22); color: #8a4523; }
.li-status.skip  { background: rgba(239, 234, 217, 0.7); color: var(--text-faint); }

.iq-toggle-pill.off { background: rgba(155, 175, 161, 0.30); color: #3d5a48; border-color: rgba(155, 175, 161, 0.55); }
.iq-toggle-pill.on  { background: rgba(199, 126, 90, 0.22); color: #8a4523; border-color: rgba(199, 126, 90, 0.50); }

.sp-stage.stage-opened-to-process { background: rgba(239, 234, 217, 0.8); color: var(--text-med); border-color: var(--border); }
.sp-stage.stage-awaiting-technical-assessment { background: var(--gold-tint); color: #6e5e3e; border-color: rgba(197,181,154,0.55); }
.sp-stage.stage-awaiting-quote { background: rgba(44, 74, 107, 0.14); color: var(--navy-deep); border-color: rgba(44, 74, 107, 0.30); }
.sp-stage.stage-awaiting-approval { background: rgba(199, 126, 90, 0.22); color: #8a4523; border-color: rgba(199, 126, 90, 0.45); }

.iq-rule, .iq-rule.high_value { background: var(--gold-tint); color: #6e5e3e; }
.iq-rule.very_high { background: rgba(199, 126, 90, 0.22); color: #8a4523; }

.role-tier-pill.level-1, .role-tier-pill.junior { background: rgba(239, 234, 217, 0.8); color: var(--text-med); border-color: var(--border); }
.role-tier-pill.level-2, .role-tier-pill.senior { background: var(--gold-tint); color: #6e5e3e; border-color: rgba(197,181,154,0.55); }
.role-tier-pill.level-3, .role-tier-pill.ceo    { background: var(--navy); color: #fff; }

/* Source chips */
.cand-source.past       { background: rgba(155, 175, 161, 0.30); color: #3d5a48; }
.cand-source.pubmed     { background: rgba(44, 74, 107, 0.14); color: var(--navy-deep); }
.cand-source.semscholar { background: rgba(44, 74, 107, 0.14); color: var(--navy-deep); }
.cand-source.jira       { background: rgba(44, 74, 107, 0.14); color: var(--navy-deep); }
.cand-source.gdrive     { background: var(--gold-tint); color: #6e5e3e; }
.cand-source.quote      { background: var(--gold-tint); color: #6e5e3e; }
.cand-source.vendor     { background: rgba(199, 126, 90, 0.22); color: #8a4523; }
.cand-source.tool       { background: rgba(239, 234, 217, 0.8); color: var(--text-med); }
.cand-source.shared     { background: var(--navy); color: #fff; }
.rel-tag.peer, .rel-tag.past, .rel-tag.verified { background: rgba(155, 175, 161, 0.30); color: #3d5a48; }
.rel-tag.vendor { background: rgba(199, 126, 90, 0.22); color: #8a4523; }
.rel-tag.ecosystem { background: rgba(239, 234, 217, 0.8); color: var(--text-med); }
.rel-tag.shared { background: var(--navy); color: #fff; }

.access-pill.access-granted { background: rgba(155, 175, 161, 0.30); color: #3d5a48; }
.access-pill.access-pending { background: var(--gold-tint); color: #6e5e3e; }
.plane-managed.plane-customer    { background: var(--gold-tint); color: #6e5e3e; }
.plane-managed.plane-dr-lee      { background: var(--navy); color: #fff; }
.plane-managed.plane-engineering { background: rgba(239, 234, 217, 0.8); color: var(--text-med); }
.tag.sole { background: var(--gold-tint); color: #6e5e3e; }
.cp-cite { background: var(--gold-tint); color: #6e5e3e; font-family: var(--mono); }

.meth-btn-rationale { background: var(--gold-tint); color: #6e5e3e; border-color: rgba(197,181,154,0.55); }
.meth-btn { background: rgba(255,255,255,0.6); color: var(--text-med); border-color: var(--border); font-family: var(--sans); }
.meth-btn:hover { background: rgba(232, 220, 196, 0.6); color: var(--navy); border-color: var(--navy); }

.meth-btn-shared .meth-btn-src-type   { background: var(--navy); color: #fff; }
.meth-btn-internal .meth-btn-src-type { background: var(--gold); color: #fff; }
.meth-btn-past .meth-btn-src-type     { background: var(--sage); color: #fff; }
.meth-btn-external .meth-btn-src-type { background: var(--text-light); color: #fff; }
.meth-btn-vendor .meth-btn-src-type   { background: var(--accent-warm); color: #fff; }

/* Methodology titles + cards */
.meth-tab-label { color: var(--text-dark); font-family: var(--sans); }
.meth-tab.active .meth-tab-label { color: var(--navy); }
.meth-stage-head h4 { font-family: var(--serif); color: var(--navy-deep); }
.meth-title, .iq-title, .iq-status-title, .ap-title, .expert-name,
.ps-cand-name, .qw-sum-val, .admin-card h4, .rat-rec, .rule-trigger,
.rbac-col li b, .threshold-list li b { color: var(--text-dark); }
.meth-summary, .ps-cand-sum, .ap-flags li, .qrationale li, .qref-list li,
.ap-note, .rat-text, .admin-desc, .rbac-sub { color: var(--text-med); }
.iq-from, .iq-time, .iq-status-meta, .ap-meta span, .ap-when,
.ext-key, .qw-sum-key, .ps-key, .admin-meta,
.meth-stage-note, .iq-skip-reason, .wr-label { color: var(--text-faint); }
.thr-val { color: var(--navy); font-family: var(--mono); }
.kb-list code, .ps-footnote code, .edit-hint code { background: rgba(255,255,255,0.7); color: var(--navy); font-family: var(--mono); }

/* Tabs */
.knowledge-tabs, .output-toggle, .appr-tabs { border-bottom-color: var(--border); }
.ktab { color: var(--text-light); background: transparent; font-family: var(--sans); }
.ktab.active { color: var(--navy); border-bottom-color: var(--navy); }
.appr-tabs .atab { background: rgba(239, 234, 217, 0.7); color: var(--text-med); border-color: var(--border); font-family: var(--sans); }
.appr-tabs .atab.active { background: rgba(255,255,255,0.85); color: var(--navy); border-color: var(--navy); }
.output-toggle .tog { background: rgba(239, 234, 217, 0.7); color: var(--text-med); border-color: var(--border); font-family: var(--sans); }
.output-toggle .tog.active { background: rgba(255,255,255,0.85); color: var(--navy); border-color: var(--navy); }

/* Tables */
.rel-table th, .rel-table td, .qline-table th, .qline-table td,
.edit-table th, .edit-table td { border-bottom-color: var(--border-soft); }
.rel-table th, .qline-table th { color: var(--text-faint); font-family: var(--sans); }
.rel-table td, .qline-table td { color: var(--text-med); }
.rel-signal { color: var(--text-dark); }
.rel-bar { background: rgba(239, 234, 217, 0.8); }
.rel-fill { background: var(--navy); }
.rel-intro { color: var(--text-med); }

/* Loader */
.loader-bar { background: rgba(239, 234, 217, 0.7); }
.loader-fill { background: var(--navy); }
.loader-steps li { color: var(--text-faint); font-family: var(--sans); }
.loader-steps li.active { color: var(--navy); }
.loader-steps li.done   { color: var(--text-med); }

.iq-skipped { opacity: 0.55; background: rgba(239, 234, 217, 0.6); }

.empty-card { background: rgba(250, 250, 247, 0.6); border: 1px dashed var(--border); }
.empty-card h3 { font-family: var(--serif); color: var(--navy-deep); }
.empty-card p  { color: var(--text-med); }

/* Anchors default to slate-navy */
a { color: var(--navy); }
a:hover { color: var(--accent-warm); }

/* Chat fab matches the slate navy primary */
.chat-fab { background: var(--navy); color: #fff; box-shadow: 0 6px 18px rgba(44, 74, 107, 0.32); }
.chat-fab:hover { background: var(--navy-deep); }
.chat-fab.active { background: var(--gold); color: var(--navy-deep); }

/* Headings throughout use Fraunces */
h1, h2, h3, h4 { font-family: var(--serif); letter-spacing: -0.005em; }
.brand-by, .nav-foot-line, .role-dd-head, .wr-label,
.card-meta, .card-link, .li-status, .iq-rule, .iq-toggle-pill,
.cp-eyebrow, .sd-eyebrow, .cp-sug-head, .status-sub-head,
.weekly-sub-head, .home-chat-sub-head, .empty-state .empty-hint,
.brand-by, .nav-item, .sp-age-lab, .sp-stage,
.access-pill, .plane-managed, .role-tier-pill,
.rule-level, .rule-auto, .meth-tab-num, .meth-btn-src-type,
.wm-delta, .ap-type, .iq-skip-reason {
  font-family: var(--sans);
}
.sp-age-val, .qw-sum-val, .kpi-num, .wm-count { font-family: var(--serif); }
.brand-name .brand-year, .kb-list code, .ps-footnote code,
.edit-hint code, .cp-cite, .iq-status-count, .wa-cat-count,
.thr-val { font-family: var(--mono); }

/* ============================================================
   Final adjustments: navy main content area, inquiry number chip,
   compact toggle below time
   ============================================================ */

/* Main content area (.page) is navy slate; sidebar is a lighter slate from the same family. */
.page { background: #2C4A6B; min-height: calc(100vh - var(--topbar-h, 64px)); padding: 32px 28px; }
.page-head h1 { color: #ECE6D4; }
.page-head .page-sub { color: #C2BCAB; }
.back-link { color: #968F80; }
.back-link:hover { color: var(--gold); }
.page-head { border-bottom-color: rgba(255,255,255,0.10); }

/* Sidebar: light slate (#A0B5C9), navy family, distinct from cream topbar */
.sidebar { background: #A0B5C9; border-right: 1px solid rgba(31, 53, 80, 0.18); }
.sidebar .nav-item { color: var(--navy-deep); }
.sidebar .nav-item:hover { background: rgba(255,255,255,0.35); color: var(--navy-deep); }
.sidebar .nav-item.active { background: rgba(255,255,255,0.55); color: var(--navy-deep); font-weight: 600; }
.sidebar .nav-glyph { color: var(--navy); }
.sidebar .nav-item.active .nav-glyph { color: var(--gold); }
.sidebar .nav-foot-line { color: rgba(31, 53, 80, 0.55); }
.sidebar .nav-badge { background: rgba(31, 53, 80, 0.18); color: var(--navy-deep); }

/* Card shadow needs more depth on the navy main area */
.card { box-shadow: 0 4px 18px rgba(0,0,0,0.18); }
.modal-backdrop { background: rgba(15, 30, 50, 0.55); }

/* Inquiry number chip (mono, system-generated) */
.iq-no {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  background: rgba(245, 243, 238, 0.85);
  border: 1px solid var(--border-soft);
  padding: 2px 7px;
  border-radius: 4px;
  letter-spacing: 0.02em;
  flex-shrink: 0;
  white-space: nowrap;
  height: fit-content;
  margin-top: 2px;
}

/* Unified inquiry row (used in both the Opened to process and In flight cards) */
.inquiry-pane-left .inquiry-list ul { gap: 6px; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.inquiry-pane-left .inquiry-list li,
.inquiry-pane-right .iq-status-list li {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: start;
  gap: 12px;
  padding: 11px 14px;
}

/* Right column: age block on top, small toggle (left card only) under it */
.iq-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  flex-shrink: 0;
}

/* Compact toggle sitting under the age block */
.iq-toggle-small { cursor: pointer; }
.iq-toggle-small .iq-toggle-pill {
  padding: 2px 8px;
  font-size: 9px;
  min-width: 0;
  letter-spacing: 0.05em;
}

/* More opaque do-not-process / process pills, including the inline pill inside the sub-text */
.iq-toggle-pill.off { background: rgba(155, 175, 161, 0.65); color: #244934; border-color: rgba(155, 175, 161, 0.85); }
.iq-toggle-pill.on  { background: rgba(199, 126, 90, 0.55); color: #5a2811; border-color: rgba(199, 126, 90, 0.85); }
.iq-toggle-pill-inline {
  display: inline-block;
  padding: 1px 7px;
  font-size: 9.5px;
  min-width: 0;
  letter-spacing: 0.04em;
  margin: 0 2px;
  vertical-align: 1px;
}

/* ============================================================
   Final tweaks: card icons, unified inquiry card background,
   strip the "pending" label from the left inquiry card.
   ============================================================ */

/* Card-head: align icon + title in a single row */
.card-head h3 { display: inline-flex; align-items: center; gap: 9px; }
.card-head h4 { display: inline-flex; align-items: center; gap: 8px; }
.iw-head h2  { display: inline-flex; align-items: center; gap: 9px; }

/* Minimalism card icon (inline SVG, currentColor inherits the heading colour) */
.card-icon {
  width: 18px; height: 18px;
  flex-shrink: 0;
  color: var(--navy);
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.85;
}

/* Inquiry panes keep the same cream-paper card shape as Status summary / Workspace activity.
   Rows inside the pane are plain list items (no second-level card behind each inquiry). */
.inquiry-pane.card { /* inherit default .card; no override needed */ }

.inquiry-pane-left .inquiry-list li,
.inquiry-pane-right .iq-status-list li {
  background: transparent;
  border: 1px solid var(--border-soft);
  box-shadow: none;
  border-radius: 6px;
}
.inquiry-pane-left .inquiry-list li:hover,
.inquiry-pane-right .iq-status-list li:hover {
  background: rgba(232, 220, 196, 0.45);
  border-color: var(--gold);
  box-shadow: none;
}

.inquiry-pane-right .iq-status-group { margin-bottom: 4px; }

/* Drop the "received" caption inside the Opened-to-process rows only.
   The right-pane In-flight rows keep the label visible. */
.inquiry-pane-left .sp-age-lab { display: none; }

/* ============================================================
   Card-head layout polish: keep title and trailing controls (date
   picker, count chip, link) on the same line; pull title slightly
   closer to the card edge.
   ============================================================ */

/* Card-head as a flex row, no wrapping; title left, controls right */
.card-head {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: nowrap;
}
.card-head h3 { flex-shrink: 1; min-width: 0; }
.card-head .card-meta,
.card-head .card-link,
.card-head .weekly-range,
.card-head .btn-mini { margin-left: auto; flex-shrink: 0; }
.card-head .card-meta + .weekly-range,
.card-head .card-meta + .card-link,
.card-head .card-meta + .btn-mini { margin-left: 12px; }

/* Trim card horizontal padding so titles sit closer to the left edge */
.card { padding: 18px 16px 16px; }
.home-status-card, .home-weekly-card { padding: 18px 16px 16px; }
.inquiry-pane { padding: 18px 16px 16px; }
.knowledge-activity-card { padding: 22px 18px; }

/* Tight card-head padding adjustment */
.card-head { padding-left: 2px; }

/* Home: stage-opened-to-process pill picks up the sage green of the "process" toggle
   (matches the Inquiries page off-toggle so the language reads consistently). */
.home-status-card .sp-stage.stage-opened-to-process {
  background: rgba(155, 175, 161, 0.55);
  color: #244934;
  border-color: rgba(155, 175, 161, 0.85);
}

/* Home Workspace activity: collapse the From / To picker into a single-line strip so the
   card-head height matches Status summary's card-head; content starts on the same line. */
.home-weekly-card .card-head { align-items: center; }
.home-weekly-card .weekly-range {
  display: flex;
  align-items: center;
  gap: 6px;
}
.home-weekly-card .wr-label {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
  font-size: 9px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-faint);
}
.home-weekly-card .wr-label input[type="date"] {
  padding: 1px 4px;
  font-size: 10px;
  height: 22px;
  line-height: 1;
  border-radius: 4px;
}
.home-weekly-card .btn-mini {
  padding: 2px 8px;
  font-size: 10px;
  height: 22px;
  line-height: 1;
}

/* Activity log page */
.activity-log-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.activity-log-list .act-empty { padding: 16px; font-size: 12px; color: var(--text-faint); font-style: italic; text-align: center; background: var(--paper-2); border-radius: 6px; }
.act-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 14px;
  padding: 10px 12px;
  background: rgba(239, 234, 217, 0.65);
  border: 1px solid var(--border);
  border-left: 3px solid var(--text-faint);
  border-radius: 6px;
}
.act-row.act-level-1 { border-left-color: var(--text-light); }
.act-row.act-level-2 { border-left-color: var(--gold); }
.act-row.act-level-3 { border-left-color: var(--navy); }

.act-meta { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.act-time { font-family: var(--mono); font-size: 10.5px; color: var(--text-faint); }
.act-meta .role-tier-pill { align-self: flex-start; }

.act-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.act-text { font-size: 12.5px; color: var(--text-dark); line-height: 1.5; }
.act-type { font-size: 10.5px; color: var(--text-faint); font-style: italic; text-transform: lowercase; }

/* Actor name as a tag chip */
.act-actor-tag-row { display: flex; }
.act-actor-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  color: var(--navy-deep);
  background: rgba(155, 175, 161, 0.35);
  border: 1px solid rgba(155, 175, 161, 0.65);
  padding: 1px 8px;
  border-radius: 10px;
  letter-spacing: 0.02em;
}
.act-actor-tag.big {
  font-size: 12px;
  padding: 3px 12px;
}

/* Active row */
.act-row.active { background: rgba(255, 254, 248, 0.96); border-color: var(--gold); box-shadow: 0 2px 8px rgba(0,0,0,0.10); cursor: pointer; }
.act-row { cursor: pointer; }

@media (max-width: 760px) {
  .act-row { grid-template-columns: 1fr; }
}

/* ============================================================
   Workspace activity summary callout + Send-to-manager button
   ============================================================ */

.weekly-summary-block {
  position: relative;
  background: rgba(232, 220, 196, 0.45);
  border-left: 3px solid var(--sage);
  border-radius: 4px;
  padding: 10px 14px 14px;
  margin: 4px 0 12px;
}
.weekly-summary-block .weekly-summary-text {
  margin: 0 0 4px;
  padding: 0;
  background: transparent;
  border: none;
}
.weekly-summary-send {
  position: absolute;
  right: 12px;
  bottom: 10px;
}

/* ============================================================
   Activity log: filter strip + 2-pane (list + preview)
   ============================================================ */

.act-filter-card { padding: 12px 16px; margin-bottom: 14px; }
.act-filter-form { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.act-filter-form .wr-label { display: inline-flex; flex-direction: row; align-items: center; gap: 5px; font-size: 9px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-faint); }
.act-filter-form .wr-label input,
.act-filter-form .wr-label select { padding: 3px 6px; font-size: 11px; height: 24px; line-height: 1; border-radius: 4px; }
.act-filter-meta { font-size: 11px; color: var(--text-faint); }

/* 2-pane layout */
.act-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: 14px;
  align-items: start;
}
.act-list-card, .act-preview-card { padding: 16px; }

/* Preview pane */
.act-preview-empty { padding: 24px; font-size: 12px; color: var(--text-faint); font-style: italic; text-align: center; background: rgba(239, 234, 217, 0.5); border-radius: 6px; }
.act-preview-meta { display: grid; grid-template-columns: 110px 1fr; gap: 6px 14px; margin-bottom: 14px; }
.act-preview-meta-row { display: contents; }
.act-preview-meta-row .ps-key { color: var(--text-faint); font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; font-weight: 600; }
.act-preview-meta-row > span:last-child { font-size: 12.5px; color: var(--text-dark); }
.act-preview-h4 { margin: 14px 0 6px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--text-faint); font-weight: 700; }
.act-preview-summary { font-size: 13px; color: var(--text-dark); line-height: 1.55; padding: 10px 12px; background: rgba(232, 220, 196, 0.4); border-left: 3px solid var(--gold); border-radius: 4px; margin-bottom: 8px; }
.act-preview-context { font-size: 12px; color: var(--text-med); line-height: 1.6; }

@media (max-width: 1000px) {
  .act-layout { grid-template-columns: 1fr; }
}

/* ============================================================
   Final polish: continuous navy background on scroll + remove
   italics + remove mono on page-head sub
   ============================================================ */

/* Body + html share the navy main-content colour so scroll never reveals a different background band. */
html, body { background: #2C4A6B; background-image: none; }

/* Topbar + sidebar already sit on top of the navy via their own backgrounds; .page also navy.
   Anything that scrolls off-edge now meets navy on every side. */

/* Page-head sub-text: regular sans, no italic, no mono. */
.page-head .page-sub,
.home-head .page-sub {
  font-family: var(--sans);
  font-style: normal;
  font-size: 12.5px;
  letter-spacing: 0;
}

/* Italic disabled on common sub-text helpers that were tagged italic */
.iq-skip-reason,
.meth-stage-note,
.act-type,
.act-preview-empty,
.iq-status-empty,
.empty-card p,
.cp-empty,
.ps-footnote { font-style: normal; }

/* ============================================================
   Fixed topbar + sidebar so they stay in place + keep their
   colour on any scroll. The .shell padding accommodates them.
   ============================================================ */

.topbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
}
.sidebar {
  position: fixed;
  top: var(--topbar-h, 64px);
  left: 0;
  width: var(--sidebar-w, 220px);
  height: calc(100vh - var(--topbar-h, 64px));
  overflow-y: auto;
  z-index: 80;
}
.shell {
  padding-top: var(--topbar-h, 64px);
  padding-left: var(--sidebar-w, 220px);
  display: block;
}
.shell > .page { min-height: calc(100vh - var(--topbar-h, 64px)); }

/* ============================================================
   Send-for-review modal: period line, note section, full preview
   ============================================================ */

.send-period-line {
  font-size: 12.5px;
  color: var(--text-dark);
  padding: 6px 10px;
  background: rgba(232, 220, 196, 0.45);
  border-left: 3px solid var(--sage);
  border-radius: 4px;
  display: block;
  font-family: var(--sans);
  letter-spacing: 0;
  text-transform: none;
  font-weight: 500;
}

.send-preview-block {
  margin-top: 18px;
  padding: 14px 16px;
  background: rgba(244, 236, 217, 0.45);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.send-preview-title {
  margin: 0 0 8px;
  font-family: var(--serif);
  color: var(--navy-deep);
  font-size: 14px;
  font-weight: 600;
}
.send-preview-tagline {
  font-size: 12px;
  color: var(--text-med);
  margin-bottom: 14px;
  padding: 8px 12px;
  background: rgba(255, 255, 255, 0.55);
  border-left: 3px solid var(--gold);
  border-radius: 4px;
  line-height: 1.55;
}
.send-preview-tagline b { color: var(--navy-deep); font-family: var(--serif); }

.send-preview-head {
  margin: 12px 0 6px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-faint);
  font-weight: 700;
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.send-preview-count { font-family: var(--mono); color: var(--text-med); font-weight: 600; font-size: 10.5px; }
.send-preview-list {
  list-style: disc;
  padding-left: 18px;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.send-preview-list li {
  font-size: 12px;
  color: var(--text-med);
  line-height: 1.5;
}

/* ============================================================
   Unified sp-row look (Home pending list + Inquiries page rows)
   Matches the user-provided reference: title + stage pill + from
   on the left, big age value + RECEIVED label on the right.
   ============================================================ */

.sp-row-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }

.sp-row-list .sp-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  background: rgba(250, 247, 238, 0.85);
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s;
}
.sp-row-list .sp-row:hover {
  background: rgba(255, 254, 248, 0.95);
  border-color: var(--gold);
}

.sp-row-list .sp-title { font-size: 13.5px; color: var(--text-dark); font-weight: 500; line-height: 1.35; margin-bottom: 4px; }
.sp-row-list .sp-meta { font-size: 11.5px; color: var(--text-faint); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sp-row-list .sp-stage { letter-spacing: 0.06em; }
.sp-row-list .sp-age { text-align: right; flex-shrink: 0; }
.sp-row-list .sp-age-val { font-family: var(--serif); font-size: 17px; font-weight: 600; line-height: 1; }
.sp-row-list .sp-age-lab { font-size: 9.5px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-faint); font-weight: 700; margin-top: 4px; }
.sp-row-list .sp-age.age-fresh .sp-age-val { color: #2f8f4f; }
.sp-row-list .sp-age.age-warm  .sp-age-val { color: #8a4523; }
.sp-row-list .sp-age.age-stale .sp-age-val { color: #b03c3c; }

/* do-not-process stage pill (used when an inquiry carries the label) */
.sp-stage.stage-do-not-process {
  background: rgba(199, 126, 90, 0.30);
  color: #5a2811;
  border-color: rgba(199, 126, 90, 0.55);
}

/* Skipped row inside the Opened-to-process pane reads as dimmed */
.sp-row.iq-skipped { opacity: 0.7; background: rgba(241, 233, 213, 0.55); }

/* Inline inquiry-number tag rendered as a prefix on sp-row titles */
.iq-no-inline {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 600;
  color: var(--navy);
  background: rgba(232, 220, 196, 0.55);
  padding: 1px 6px;
  border-radius: 4px;
  letter-spacing: 0.02em;
  margin-right: 4px;
  vertical-align: 1px;
}

/* ============================================================
   Unified sp-row sizing across Home and Inquiries
   - Same card surface + same compact typography in both places.
   - Inquiries rows shrink to Home's smaller scale.
   ============================================================ */

.sp-row-list .sp-row,
.home-status-card .sp-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  background: rgba(241, 233, 213, 0.65);
  border: 1px solid var(--border);
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s;
}
.sp-row-list .sp-row:hover,
.home-status-card .sp-row:hover {
  background: rgba(232, 220, 196, 0.85);
  border-color: var(--gold);
}

.sp-row-list .sp-title,
.home-status-card .sp-title {
  font-size: 12.5px;
  color: var(--text-dark);
  font-weight: 500;
  line-height: 1.35;
  margin-bottom: 3px;
}

.sp-row-list .sp-meta,
.home-status-card .sp-meta {
  font-size: 10.5px;
  color: var(--text-faint);
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}

.sp-row-list .sp-stage,
.home-status-card .sp-stage {
  font-size: 9px;
  padding: 1px 7px;
  letter-spacing: 0.05em;
}

.sp-row-list .sp-age,
.home-status-card .sp-age { text-align: right; flex-shrink: 0; }

.sp-row-list .sp-age-val,
.home-status-card .sp-age-val {
  font-family: var(--serif);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1;
}
.sp-row-list .sp-age-lab,
.home-status-card .sp-age-lab {
  font-size: 8.5px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  font-weight: 700;
  margin-top: 3px;
}

.sp-row-list .sp-age.age-fresh .sp-age-val,
.home-status-card .sp-age.age-fresh .sp-age-val { color: #2f8f4f; }
.sp-row-list .sp-age.age-warm  .sp-age-val,
.home-status-card .sp-age.age-warm  .sp-age-val { color: #8a4523; }
.sp-row-list .sp-age.age-stale .sp-age-val,
.home-status-card .sp-age.age-stale .sp-age-val { color: #b03c3c; }

/* Inquiry-no chip on these compact rows */
.sp-row-list .iq-no-inline,
.home-status-card .iq-no-inline {
  font-size: 9.5px;
  padding: 0 5px;
}

/* Pin the Opened-to-process rows to the exact same translucent paper-2 the In-flight rows use.
   An older theme block was giving the left pane li a more opaque cream via .inquiry-pane-left
   .inquiry-list li (specificity 0,2,1); this override raises specificity to 0,3,0. */
.inquiry-pane-left .sp-row-list .sp-row,
.inquiry-pane-right .sp-row-list .sp-row {
  background: rgba(239, 234, 217, 0.65);
  border-color: var(--border);
}
.inquiry-pane-left .sp-row-list .sp-row:hover,
.inquiry-pane-right .sp-row-list .sp-row:hover {
  background: rgba(232, 220, 196, 0.85);
  border-color: var(--gold);
}

/* Final stage pill colours: Opened to process = sage green, Do-not-process = neutral grey */
.sp-stage.stage-opened-to-process,
.home-status-card .sp-stage.stage-opened-to-process {
  background: rgba(155, 175, 161, 0.45);
  color: #244934;
  border-color: rgba(155, 175, 161, 0.75);
}

.sp-stage.stage-do-not-process {
  background: rgba(139, 139, 131, 0.30);
  color: #4A4A45;
  border-color: rgba(139, 139, 131, 0.55);
}

/* do-not-process toggle pill (inline + on the row) reads as a neutral grey */
.iq-toggle-pill.on,
.iq-toggle-pill-inline.on {
  background: rgba(139, 139, 131, 0.30);
  color: #4A4A45;
  border-color: rgba(139, 139, 131, 0.55);
}

/* Inline do-not-process chip under the Inquiries page title:
   opaque grey background, white text, no border. */
.iq-toggle-pill-inline,
.iq-toggle-pill-inline.on,
.iq-toggle-pill-inline.off {
  background: #6B6B65;
  color: #FFFFFF;
  border: 1px solid #6B6B65;
}

/* ============================================================
   Activity log: smaller text inside both cards
   ============================================================ */

/* Cards themselves a touch tighter */
.act-list-card, .act-preview-card { padding: 14px 16px; }
.act-list-card .card-head h3,
.act-preview-card .card-head h3 { font-size: 14px; }
.act-filter-card { padding: 10px 14px; }

/* Filter strip text */
.act-filter-form .wr-label { font-size: 8.5px; }
.act-filter-form .wr-label input,
.act-filter-form .wr-label select { padding: 2px 5px; font-size: 10.5px; height: 22px; }
.act-filter-form .btn-mini { font-size: 10px; padding: 2px 8px; height: 22px; }
.act-filter-meta { font-size: 10.5px; }

/* Left list rows */
.act-list-card .activity-log-list .act-row { gap: 10px; padding: 8px 10px; }
.act-list-card .activity-log-list .act-time { font-size: 9.5px; }
.act-list-card .activity-log-list .act-actor-tag { font-size: 9.5px; padding: 1px 7px; }
.act-list-card .activity-log-list .act-text { font-size: 11.5px; line-height: 1.4; }
.act-list-card .activity-log-list .act-type { font-size: 9.5px; }
.act-list-card .activity-log-list .role-tier-pill { font-size: 8.5px; padding: 0 6px; }

/* Right preview pane */
.act-preview-card .act-preview-meta { gap: 4px 12px; margin-bottom: 10px; }
.act-preview-card .act-preview-meta-row .ps-key { font-size: 9.5px; }
.act-preview-card .act-preview-meta-row > span:last-child { font-size: 11.5px; }
.act-preview-card .act-actor-tag.big { font-size: 11px; padding: 2px 9px; }
.act-preview-card .role-tier-pill { font-size: 9px; padding: 1px 7px; }

.act-preview-card .send-preview-block { padding: 10px 12px; margin-top: 4px; }
.act-preview-card .send-preview-title { font-size: 12.5px; margin-bottom: 6px; }
.act-preview-card .send-preview-tagline { font-size: 11px; line-height: 1.5; padding: 6px 10px; margin-bottom: 10px; }
.act-preview-card .send-preview-tagline b { font-size: 12px; }
.act-preview-card .send-preview-head { font-size: 9.5px; margin: 10px 0 4px; }
.act-preview-card .send-preview-count { font-size: 9.5px; }
.act-preview-card .send-preview-list { padding-left: 16px; gap: 3px; }
.act-preview-card .send-preview-list li { font-size: 11px; line-height: 1.45; }

/* ============================================================
   Reporting hierarchy editor: matrix UI
   ============================================================ */
.rh-section-head {
  margin: 18px 0 6px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  font-weight: 700;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.rh-section-sub { font-size: 9.5px; text-transform: none; letter-spacing: 0; color: var(--text-faint); font-weight: 400; font-style: normal; }

.rh-matrix {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  margin-bottom: 6px;
}
.rh-matrix th, .rh-matrix td {
  padding: 8px 10px;
  border: 1px solid var(--border);
  text-align: center;
  background: rgba(255,255,255,0.55);
}
.rh-matrix thead th {
  background: rgba(232, 220, 196, 0.5);
  font-family: var(--sans);
  font-size: 10.5px;
  font-weight: 700;
  color: var(--navy-deep);
  letter-spacing: 0.02em;
}
.rh-matrix .rh-corner {
  background: rgba(239, 234, 217, 0.65);
  color: var(--text-faint);
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-align: left;
}
.rh-matrix .rh-row-head {
  background: rgba(232, 220, 196, 0.4);
  color: var(--navy-deep);
  text-align: left;
  font-size: 11px;
  font-weight: 600;
}
.rh-cell { display: inline-flex; cursor: pointer; }
.rh-cell input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--navy); }

/* Inquiries page:
   - The cream paper container on each pane is restored (default .card look).
   - The inner .inquiry-list / .inquiry-status section had its own opaque white
     background + border + shadow from the original Inquiries CSS block. That
     was the "white layer" between INQ rows. Force it transparent here. */
.inquiry-pane.card { /* inherit default .card cream paper */ }

.inquiry-pane .card-head { border-bottom-color: var(--border-soft); }
.inquiry-pane .card-head h3 { color: var(--navy-deep); }

.inquiry-pane .inquiry-list,
.inquiry-pane .inquiry-status {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.inquiry-pane-left .sp-row-list .sp-row,
.inquiry-pane-right .sp-row-list .sp-row {
  background: rgba(239, 234, 217, 0.65);
  border: 1px solid var(--border);
  box-shadow: none;
  min-height: 64px;
  align-items: center;
}
.inquiry-pane-left .sp-row-list .sp-row:hover,
.inquiry-pane-right .sp-row-list .sp-row:hover {
  background: rgba(232, 220, 196, 0.85);
  border-color: var(--gold);
}

/* Truncate long inquiry titles with ellipsis; keep meta on one line too */
.inquiry-pane-left .sp-row-list .sp-main,
.inquiry-pane-right .sp-row-list .sp-main { min-width: 0; }
.inquiry-pane-left .sp-row-list .sp-title,
.inquiry-pane-right .sp-row-list .sp-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.inquiry-pane-left .sp-row-list .sp-meta,
.inquiry-pane-right .sp-row-list .sp-meta {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}
.inquiry-pane-left .sp-row-list .sp-meta .sp-stage,
.inquiry-pane-right .sp-row-list .sp-meta .sp-stage { display: inline-block; vertical-align: middle; margin-right: 4px; }

/* ============================================================
   Do-not-process label modal: meta + body preview
   ============================================================ */
.label-modal-meta {
  padding: 10px 12px;
  background: rgba(239, 234, 217, 0.55);
  border-left: 3px solid var(--gold);
  border-radius: 4px;
  margin-bottom: 12px;
}
.label-modal-title {
  font-family: var(--serif);
  color: var(--navy-deep);
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 4px;
  line-height: 1.4;
}
.label-modal-sub {
  font-size: 11.5px;
  color: var(--text-med);
  line-height: 1.6;
}
.label-modal-sub b { color: var(--text-faint); font-weight: 600; font-family: var(--sans); }
.label-modal-reason {
  font-size: 11px;
  color: var(--text-faint);
  margin-top: 6px;
  font-style: normal;
}
.label-modal-section-head {
  margin: 14px 0 6px;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  font-weight: 700;
}
.label-modal-body {
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 11.5px;
  color: var(--text-dark);
  background: rgba(255,255,255,0.6);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 12px 14px;
  margin: 0;
  white-space: pre-wrap;
  word-wrap: break-word;
  line-height: 1.55;
  max-height: 360px;
  overflow-y: auto;
}
.label-modal-note {
  margin: 14px 0 0;
  font-size: 11.5px;
  color: var(--text-med);
  line-height: 1.55;
}

/* Approver focus highlight card — shown at the very top of the inquiry
   preview when the inquiry is in awaiting-approval. Aggregates the 4-5
   things a reviewer needs to scan first: routing rule, quote total,
   methodology reliability tier, risk-flag count, pending technical
   re-assessment, plus a tail of latest reviewer audit notes. Severity
   tinting (info / warn / critical) on each row keeps the eye moving. */
.ap-highlight-card {
  background: linear-gradient(180deg, rgba(196, 160, 76, 0.10), rgba(196, 160, 76, 0.04));
  border: 1px solid var(--border);
  border-left: 4px solid var(--gold);
  border-radius: 6px;
  padding: 14px 16px 12px;
  margin: 0 0 14px;
}
.ap-highlight-card .aph-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--navy-deep, var(--navy));
  margin-bottom: 10px;
}
.ap-highlight-card .aph-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
}
.ap-highlight-card .aph-row {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 12px;
  align-items: start;
  padding: 6px 8px 6px 10px;
  border-radius: 3px;
  font-size: 12.5px;
  line-height: 1.45;
  background: rgba(255, 255, 255, 0.55);
  border-left: 3px solid var(--border-soft);
}
.ap-highlight-card .aph-row.aph-severity-info {
  border-left-color: var(--gold);
}
.ap-highlight-card .aph-row.aph-severity-warn {
  border-left-color: var(--warn, #B25A00);
  background: rgba(178, 90, 0, 0.06);
}
.ap-highlight-card .aph-row.aph-severity-critical {
  border-left-color: #B5331C;
  background: rgba(181, 51, 28, 0.07);
}
.ap-highlight-card .aph-label {
  font-weight: 700;
  color: var(--text-med);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding-top: 1px;
}
.ap-highlight-card .aph-val {
  color: var(--text-dark);
}
.ap-highlight-card .aph-val b { color: var(--navy-deep, var(--navy)); }
.ap-highlight-card .aph-val code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11.5px;
  background: rgba(0, 0, 0, 0.04);
  padding: 0 4px;
  border-radius: 2px;
}
.ap-highlight-card .aph-note {
  margin-top: 10px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--border-soft);
  border-radius: 3px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-med);
}
.ap-highlight-card .aph-note b { color: var(--navy-deep, var(--navy)); }

/* Inquiry preview · collapsible section */
.iq-preview-section {
  border: 1px solid var(--border);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.45);
  margin-bottom: 6px;
}
.iq-preview-section[open] { background: rgba(255, 255, 255, 0.6); }
.iq-preview-summary {
  list-style: none;
  cursor: pointer;
  padding: 7px 10px;
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: var(--sans);
  font-size: 10.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
}
.iq-preview-summary::-webkit-details-marker { display: none; }
.iq-preview-summary:hover { color: var(--navy-deep); background: rgba(232, 220, 196, 0.4); border-radius: 4px; }
.iq-preview-caret { display: inline-block; transition: transform 0.15s; font-size: 10px; }
.iq-preview-section[open] .iq-preview-caret { transform: rotate(90deg); }
.iq-preview-section-name { color: var(--navy-deep); }
.iq-preview-section-body {
  padding: 0 10px 8px;
  max-height: 280px;
  overflow-y: auto;
}
.iq-preview-pre {
  margin: 0;
  max-height: none;
}

/* Cap the modal body so the entire preview fits one viewport */
#modalBody { max-height: calc(100vh - 220px); overflow-y: auto; }

/* Inquiry preview · quote block */
.iq-preview-quote {
  padding: 10px 12px;
  background: rgba(255,255,255,0.6);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 4px;
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--text-dark);
}
.iq-preview-quote b { color: var(--navy-deep); }
.iq-preview-quote-total {
  font-family: var(--serif);
  font-size: 14px;
  font-weight: 700;
  color: var(--navy-deep);
  margin-top: 3px;
}
.iq-preview-quote-rule {
  font-size: 10.5px;
  color: var(--text-faint);
  margin-top: 4px;
}
.iq-preview-quote-rule code {
  font-family: var(--mono);
  background: rgba(232, 220, 196, 0.5);
  padding: 1px 5px;
  border-radius: 3px;
  font-size: 10px;
  color: var(--navy-deep);
}

/* ============================================================
   Assistant page: compact one-screen layout + archive controls
   ============================================================ */
.chat-shell {
  /* Fit within viewport: account for fixed topbar (~64px) + page-head (~80px) + padding */
  min-height: 0;
  height: calc(100vh - 200px);
  max-height: calc(100vh - 200px);
  grid-template-columns: 220px 1fr;
}
.chat-history {
  padding: 10px 10px;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.chat-history-tabs {
  display: flex;
  gap: 4px;
  background: var(--paper);
  padding: 3px;
  border-radius: var(--radius-sm);
  margin-bottom: 8px;
}
.chat-tab {
  flex: 1;
  font-size: 11px;
  letter-spacing: 0.03em;
  font-family: var(--sans);
  font-weight: 600;
  padding: 5px 8px;
  border: none;
  border-radius: 4px;
  background: transparent;
  color: var(--text-faint);
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
}
.chat-tab:hover { color: var(--navy); }
.chat-tab.active { background: rgba(255,255,255,0.85); color: var(--navy-deep); }

.chat-list { gap: 1px; overflow-y: auto; min-height: 0; flex: 1; }
.chat-list li {
  position: relative;
  padding: 7px 8px;
  padding-right: 28px;
  font-size: 11.5px;
  line-height: 1.35;
  border-radius: var(--radius-sm);
  cursor: default;
}
.chat-list li.chat-empty {
  color: var(--text-faint);
  font-style: italic;
  font-size: 11px;
  text-align: center;
  padding: 12px 8px;
  cursor: default;
}
.chat-list li.chat-empty:hover { background: transparent; }
.chat-list .ci-title {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  border: none;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.chat-list .ci-time { font-size: 9.5px; margin-top: 1px; }
.chat-list .ci-act {
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  width: 22px; height: 22px;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 4px;
  color: var(--text-faint);
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
}
.chat-list .ci-act svg { stroke: currentColor; stroke-width: 1.6; fill: none; }
.chat-list li:hover .ci-act { display: flex; }
.chat-list li.active .ci-act { display: flex; color: var(--navy); }
.chat-list .ci-act:hover { background: rgba(255,255,255,0.7); border-color: var(--border); color: var(--navy); }

.chat-stream {
  padding: 14px 18px;
  gap: 12px;
}
.msg { grid-template-columns: 26px 1fr; gap: 8px; }
.msg .av { width: 26px; height: 26px; font-size: 10px; }
.msg .body { font-size: 12px; line-height: 1.55; padding: 8px 12px; }

.chat-suggestions {
  padding: 0 18px 6px;
  gap: 6px;
}
.chat-sugg { font-size: 11px; padding: 4px 10px; border-radius: 14px; }

.chat-input-bar { padding: 10px 18px; }
.chat-input { padding: 7px 12px; font-size: 12px; }

/* Page head spacing on assistant page: keep it tight */
.page-head + .chat-shell { margin-top: 4px; }

/* New conversation button (top of chat-history sidebar) */
.btn-new-chat {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 7px 10px;
  margin-bottom: 8px;
  background: var(--navy);
  color: #fff;
  border: 1px solid var(--navy-deep);
  border-radius: 4px;
  font-size: 11.5px;
  font-family: var(--sans);
  font-weight: 600;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
}
.btn-new-chat:hover { background: var(--navy-deep); border-color: var(--gold); }
.btn-new-chat svg { stroke: currentColor; flex-shrink: 0; }

/* Conversation keyword search */
.chat-search-wrap { margin-bottom: 6px; }
.chat-search {
  width: 100%;
  font-size: 11px;
  font-family: var(--sans);
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: rgba(255,255,255,0.7);
  color: var(--text-dark);
}
.chat-search:focus { outline: none; border-color: var(--gold); }
.chat-search::placeholder { color: var(--text-faint); }

/* LLM local/external switch above the chat stream */
.chat-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px;
  border-bottom: 1px solid var(--border-soft);
  background: rgba(245, 243, 238, 0.55);
}
.llm-switch {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 2px;
}
.llm-switch-label {
  font-size: 9.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  padding: 0 6px;
}
.llm-opt {
  font-size: 10.5px;
  font-family: var(--sans);
  font-weight: 600;
  padding: 3px 10px;
  border: none;
  background: transparent;
  color: var(--text-med);
  border-radius: 3px;
  cursor: pointer;
}
.llm-opt:hover { color: var(--navy); }
.llm-opt.active { background: var(--navy); color: #fff; }
.llm-note {
  font-size: 10px;
  color: var(--text-faint);
  font-style: italic;
}

/* Compact empty state inside the chat stream */
.chat-empty-state {
  min-height: 0 !important;
  padding: 20px 18px 14px !important;
  text-align: left;
  border-left: 3px solid var(--gold-soft);
  background: var(--paper);
  border-radius: var(--radius-sm);
}
.chat-empty-state .empty-glyph { display: none; }
.chat-empty-state h3 {
  font-size: 13.5px;
  margin: 0 0 4px;
  font-family: var(--serif);
  color: var(--navy-deep);
}
.chat-empty-state p {
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--text-med);
  margin: 0;
}

/* Suggested-question chips: stack vertically on the Assistant page */
.chat-suggestions {
  flex-direction: column;
  align-items: stretch;
}
.chat-suggestions::before {
  content: "Suggested";
  display: block;
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  font-family: var(--sans);
  margin-bottom: 2px;
}
.chat-sugg {
  text-align: left;
  border-radius: 4px;
  padding: 7px 12px;
  background: rgba(255,255,255,0.55);
  border: 1px solid var(--border);
  color: var(--text-dark);
  font-family: var(--serif);
  font-size: 11.5px;
}
.chat-sugg:hover {
  background: rgba(232, 220, 196, 0.7);
  border-color: var(--gold);
  color: var(--navy-deep);
}

/* Per-message model-layer tag */
.msg-layer {
  display: inline-block;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 3px;
  margin-right: 8px;
  vertical-align: 1px;
}
.msg-layer-local    { background: rgba(155, 175, 161, 0.25); color: #4a6a55; }
.msg-layer-external { background: rgba(197, 181, 154, 0.35); color: #7a5e2a; }

/* ============================================================
   Admin page: category groups + tighter tiles
   ============================================================ */
.admin-grid {
  display: flex;
  flex-direction: column;
  gap: 14px;
  grid-template-columns: none;
}
.admin-group { display: flex; flex-direction: column; gap: 6px; }
.admin-group-head {
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
  font-family: var(--sans);
  border-bottom: 1px solid var(--border-soft);
  padding: 0 0 4px;
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.admin-group-count {
  font-family: var(--mono);
  font-size: 9px;
  color: var(--text-faint);
  background: rgba(232, 220, 196, 0.5);
  padding: 1px 5px;
  border-radius: 8px;
  letter-spacing: 0;
}
.admin-tile-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
}
.admin-tile-grid .admin-card {
  display: flex;
  flex-direction: column;
  min-height: 116px;
  padding: 10px 12px;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.45);
  border: 1px solid var(--border);
  box-sizing: border-box;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
/* Top row: icon on the left, lock badge on the right. Title sits
   underneath on its own line so longer names (e.g. "Pricing + quote
   search logic") get the full card width without wrapping. */
.admin-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.admin-tile-grid .admin-card .admin-card-title {
  font-size: 11px;
  font-weight: 600;
  margin: 0 0 3px;
  line-height: 1.25;
  color: var(--navy-deep);
  font-family: var(--sans);
  /* Single line, never wrap. Ellipsis as a graceful fallback if a
     card column is narrower than expected. */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.admin-tile-grid .admin-card .admin-desc {
  font-size: 10px;
  line-height: 1.4;
  margin: 0;
  color: var(--text-med);
  flex: 1 1 auto;
  /* Clamp to 2 lines so single-line and two-line descs share the
     same vertical rhythm, keeping every card the same height. */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.admin-tile-grid .admin-card:hover {
  background: rgba(232, 220, 196, 0.75);
  border-color: var(--gold);
}
@media (max-width: 1100px) { .admin-tile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px)  { .admin-tile-grid { grid-template-columns: 1fr; } }

/* ============================================================
   Admin: 3-tier edit lock system
   - Customer-managed (green): edit freely.
   - Tuneable (gold): editable with advisor-calibrated default.
   - Advisor-managed (red): read-only, request refresh.
   ============================================================ */

/* Top filter bar (sits above the grid). Search input on the left,
   filter toggle in the middle, lock-tier legend on the right. */
.admin-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin: 8px 0 16px;
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.admin-filter-search { flex: 1 1 220px; min-width: 200px; }
.admin-search-input {
  width: 100%;
  padding: 6px 10px;
  font-size: 12px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: #fff;
}
.admin-search-input:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px rgba(196, 160, 76, 0.18); }
.admin-filter-toggle {
  display: inline-flex;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: #fff;
  overflow: hidden;
}
.admin-filter-btn {
  padding: 5px 12px;
  font-size: 11px;
  font-family: var(--sans);
  font-weight: 600;
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--text-med);
}
.admin-filter-btn:hover { background: rgba(196, 160, 76, 0.08); }
.admin-filter-btn.is-active { background: var(--navy); color: #fff; }
.admin-filter-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 10.5px;
  color: var(--text-med);
}
.lock-legend { display: inline-flex; align-items: center; gap: 4px; }

/* Lock badges — used on tiles, audit rows, and section heads. */
.lock-badge {
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 10px;
  font-family: var(--sans);
  white-space: nowrap;
}
.lock-customer { background: rgba(76, 121, 76, 0.14); color: #2e5c2e; border: 1px solid rgba(76, 121, 76, 0.32); }
.lock-tuneable { background: rgba(196, 160, 76, 0.16); color: #7a5e2a; border: 1px solid rgba(196, 160, 76, 0.42); }
.lock-advisor  { background: rgba(176, 60, 60, 0.10); color: #8a3030; border: 1px solid rgba(176, 60, 60, 0.36); }
.lock-advisor::before { content: "🔒"; margin-right: 3px; font-size: 8.5px; }

/* Tile-level treatment: dim advisor-locked tiles slightly so they
   read as "informational" rather than "primary action". */
.admin-tile-grid .admin-card-advisor {
  background: rgba(0, 0, 0, 0.025);
  border-color: var(--border);
}
.admin-tile-grid .admin-card-advisor:hover {
  background: rgba(176, 60, 60, 0.05);
  border-color: rgba(176, 60, 60, 0.35);
}
.admin-tile-grid .admin-card-tuneable:hover {
  background: rgba(196, 160, 76, 0.08);
  border-color: var(--gold);
}
.admin-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.admin-card-head h4 { margin: 0; flex: 1 1 auto; }
.admin-card-head .lock-badge { flex-shrink: 0; }
.admin-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  flex-shrink: 0;
  border-radius: 5px;
  background: rgba(196, 160, 76, 0.10);
  color: var(--navy-deep, var(--navy));
}
.admin-card-icon svg { width: 15px; height: 15px; display: block; }
.admin-card-customer .admin-card-icon { background: rgba(76, 121, 76, 0.10); color: #2e5c2e; }
.admin-card-tuneable .admin-card-icon { background: rgba(196, 160, 76, 0.14); color: #7a5e2a; }
.admin-card-advisor  .admin-card-icon { background: rgba(176, 60, 60, 0.08);  color: #8a3030; }

/* "Affects" banner shown INSIDE the editor modal (no longer on the
   card). Sits at the very top of #modalBody, above the stub banner. */
.admin-affects-banner {
  margin: 0 0 12px;
  padding: 9px 12px;
  background: rgba(232, 220, 196, 0.50);
  border-left: 3px solid var(--gold);
  border-radius: 3px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-dark);
}
.admin-affects-key {
  display: inline-block;
  margin-right: 6px;
  font-family: var(--sans);
  font-weight: 700;
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-deep, var(--navy));
}

/* Admin layout: main grid on the left, audit panel on the right.
   Collapses to a single column on narrow viewports. */
.admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 16px;
  align-items: start;
}
.admin-audit-card { padding: 12px 14px; }
.admin-audit-card .card-head { margin-bottom: 8px; }
.admin-audit-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 480px;
  overflow-y: auto;
}
.admin-audit-empty {
  font-size: 11.5px;
  color: var(--text-faint);
  font-style: italic;
  padding: 6px 2px;
}
.admin-audit-row {
  padding: 8px 10px;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
  font-size: 11px;
  line-height: 1.5;
}
.admin-audit-head {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.admin-audit-label {
  font-weight: 700;
  color: var(--navy-deep, var(--navy));
  font-size: 11.5px;
}
.admin-audit-when {
  margin-left: auto;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
}
.admin-audit-sum {
  margin-top: 4px;
  color: var(--text-dark);
}
.admin-audit-by {
  margin-top: 2px;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
}
.admin-empty-state {
  padding: 18px;
  text-align: center;
  color: var(--text-faint);
  font-style: italic;
  font-size: 12.5px;
}

/* Advisor parameter reference link — single-line footer note at the
   end of editors whose advisor sections are now hidden (methodology,
   reliability, pricing-search, sources, etc.). */
.advisor-reference-note {
  margin-top: 14px;
  padding: 8px 12px;
  background: rgba(196, 160, 76, 0.06);
  border-left: 3px solid var(--gold);
  border-radius: 3px;
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--text-med);
}
.advisor-ref-link {
  background: none;
  border: none;
  padding: 0;
  font-family: inherit;
  font-size: inherit;
  color: var(--navy);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.advisor-ref-link:hover { color: var(--accent-warm, var(--gold)); }

/* Advisor parameter reference modal: category headers + parameter
   rows with snapshot + refresh-request button per row. */
.adv-ref-cat {
  margin: 14px 0 6px;
  font-family: var(--serif);
  font-size: 13px;
  font-weight: 700;
  color: var(--navy-deep, var(--navy));
  border-bottom: 1px solid var(--border);
  padding-bottom: 4px;
}
.adv-ref-cat:first-of-type { margin-top: 4px; }
.adv-ref-list { display: flex; flex-direction: column; gap: 8px; }
.adv-ref-row {
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
}
.adv-ref-row.is-focus {
  background: rgba(196, 160, 76, 0.10);
  border-color: var(--gold);
}
.adv-ref-row-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 4px;
}
.adv-ref-row-head h6 {
  margin: 0;
  font-family: var(--sans);
  font-size: 12.5px;
  font-weight: 700;
  color: var(--navy-deep, var(--navy));
}
.adv-ref-desc {
  margin: 0 0 6px;
  font-size: 11.5px;
  line-height: 1.55;
  color: var(--text-dark);
}
.adv-ref-snapshot {
  margin: 4px 0;
  font-size: 11px;
}
.adv-ref-snapshot summary {
  cursor: pointer;
  color: var(--text-faint);
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 600;
  padding: 2px 0;
}
.adv-ref-snapshot summary:hover { color: var(--navy); }
.adv-ref-snapshot-block {
  margin: 4px 0 0;
  padding: 8px 10px;
  background: rgba(0, 0, 0, 0.04);
  border: 1px solid var(--border-soft);
  border-radius: 3px;
  white-space: pre-wrap;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text-dark);
}
.adv-ref-cadence {
  margin-top: 6px;
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}
.adv-ref-cadence b { color: var(--text-med); font-style: normal; font-weight: 700; }

/* Locked-section treatment inside individual editors. Wraps a
   <section> with a red left border + small "Advisor-managed" badge. */
.edit-section-locked {
  position: relative;
  padding: 10px 12px;
  margin: 8px 0;
  background: rgba(176, 60, 60, 0.04);
  border: 1px solid rgba(176, 60, 60, 0.22);
  border-left: 3px solid rgba(176, 60, 60, 0.65);
  border-radius: 4px;
}
.edit-section-locked > .edit-section-h {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 0;
}
.edit-section-locked input,
.edit-section-locked textarea,
.edit-section-locked select {
  pointer-events: none;
  background: rgba(0, 0, 0, 0.03);
  color: var(--text-faint);
}
.edit-section-locked .form-hint { color: var(--text-faint); }
.edit-section-locked .advisor-action-row {
  margin-top: 6px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* Tuneable section: shows the advisor default + Reset link next to fields */
.advisor-default-hint {
  display: inline-block;
  margin-left: 8px;
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}
.advisor-reset-link {
  margin-left: 6px;
  font-size: 10.5px;
  color: var(--navy);
  background: none;
  border: none;
  cursor: pointer;
  text-decoration: underline;
  padding: 0;
}
.advisor-reset-link:hover { color: var(--accent-warm, var(--gold)); }

.advisor-current-block {
  margin: 4px 0 0;
  padding: 8px 10px;
  background: rgba(0, 0, 0, 0.04);
  border: 1px solid var(--border-soft);
  border-radius: 3px;
  white-space: pre-wrap;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text-dark);
  max-height: 160px;
  overflow-y: auto;
}

@media (max-width: 1000px) {
  .admin-layout { grid-template-columns: 1fr; }
  .admin-audit-card { order: 2; }
}

/* ============================================================
   Inquiry row: keep age single-line, ellipsis on long titles
   ============================================================ */
/* Age column never wraps */
.sp-row-list .sp-age-val,
.home-status-card .sp-age-val,
.sp-row-list .sp-age-lab,
.home-status-card .sp-age-lab {
  white-space: nowrap;
}

/* Title column allowed to shrink so ellipsis can kick in */
.home-status-card .sp-main,
.sp-row-list .sp-main { min-width: 0; }

/* ============================================================
   Knowledge page: Past projects tab (search tracking)
   ============================================================ */
.pp-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 10px;
  padding: 0 2px;
}
.pp-head-count {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.pp-head-note {
  font-size: 11px;
  color: var(--text-faint);
  font-style: italic;
}
.pp-list { display: flex; flex-direction: column; gap: 6px; }
.pp-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 10px 14px;
  background: rgba(239, 234, 217, 0.65);
  border: 1px solid var(--border);
  border-radius: 6px;
  transition: background 0.12s, border-color 0.12s;
}
.pp-row:hover {
  background: rgba(232, 220, 196, 0.85);
  border-color: var(--gold);
}
.pp-main { min-width: 0; }
.pp-title {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 3px;
}
.pp-id {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 700;
  color: var(--gold);
  background: rgba(255,255,255,0.7);
  padding: 1px 6px;
  border-radius: 3px;
  letter-spacing: 0.02em;
}
.pp-name {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--navy-deep);
  font-family: var(--serif);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.pp-meta {
  font-size: 10.5px;
  color: var(--text-med);
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 4px;
}
.pp-dot { color: var(--text-faint); }
.pp-subdomain {
  background: rgba(155, 175, 161, 0.25);
  color: #4a6a55;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.pp-cites {
  font-size: 10px;
  color: var(--text-faint);
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
}
.pp-cite-chip {
  font-family: var(--mono);
  font-size: 9.5px;
  background: rgba(255,255,255,0.55);
  border: 1px solid var(--border);
  color: var(--text-dark);
  padding: 1px 5px;
  border-radius: 3px;
}
.pp-stats {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}
.pp-hits { text-align: center; }
.pp-hits-val {
  display: block;
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  color: var(--navy-deep);
}
.pp-hits-lab {
  display: block;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  font-weight: 700;
  margin-top: 2px;
}
.pp-last { text-align: right; min-width: 110px; }
.pp-last-when { font-size: 11px; color: var(--text-dark); font-weight: 600; }
.pp-last-by { font-size: 9.5px; color: var(--text-faint); margin-top: 1px; }

/* ============================================================
   Knowledge tracking: Inquiry insights + Gap radar
   ============================================================ */

/* Shared source pills (also reused in mix bars) */
.ki-src-pill {
  display: inline-block;
  font-size: 9.5px;
  font-family: var(--sans);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 1px 7px;
  border-radius: 3px;
  border: 1px solid transparent;
}
.ki-src-pill.src-past-projects      { background: rgba(44, 74, 107, 0.15);  color: var(--navy-deep); border-color: rgba(44,74,107,0.3); }
.ki-src-pill.src-similar-inquiry    { background: rgba(44, 74, 107, 0.08);  color: var(--navy-deep); border-color: rgba(44,74,107,0.2); }
.ki-src-pill.src-internal-knowledge { background: rgba(155, 175, 161, 0.18); color: #3f5e4d; border-color: rgba(155,175,161,0.4); }
.ki-src-pill.src-sense-library      { background: rgba(197, 181, 154, 0.18); color: #6b4f1f; border-color: rgba(197,181,154,0.5); }
.ki-src-pill.src-literature         { background: rgba(155, 175, 161, 0.35); color: #3f5e4d; border-color: rgba(155,175,161,0.55); }
.ki-src-pill.src-supplier-notes     { background: rgba(197, 181, 154, 0.4);  color: #7a5e2a; border-color: rgba(197,181,154,0.7); }

.ki-section-head { margin-bottom: 8px; padding: 0 2px; }
.ki-section-head h4 {
  font-size: 12px;
  font-family: var(--sans);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--text-faint);
  margin: 0 0 2px;
}
.ki-section-sub { font-size: 10.5px; color: var(--text-faint); font-style: italic; }

/* Source-mix bars */
.ki-mix-card {
  margin-bottom: 18px;
  padding: 12px 14px;
  background: rgba(239, 234, 217, 0.5);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.ki-mix-row { display: flex; flex-direction: column; gap: 3px; margin-bottom: 8px; }
.ki-mix-row:last-child { margin-bottom: 0; }
.ki-mix-meta { display: flex; align-items: center; gap: 8px; }
.ki-mix-stats { font-size: 10px; color: var(--text-faint); font-family: var(--mono); }
.ki-mix-bar {
  position: relative;
  height: 14px;
  background: rgba(255,255,255,0.5);
  border: 1px solid var(--border);
  border-radius: 3px;
  overflow: hidden;
}
.ki-mix-fill { height: 100%; transition: width 0.3s; }
.ki-mix-fill.src-past-projects      { background: rgba(44, 74, 107, 0.65); }
.ki-mix-fill.src-similar-inquiry    { background: rgba(44, 74, 107, 0.4); }
.ki-mix-fill.src-internal-knowledge { background: rgba(155, 175, 161, 0.55); }
.ki-mix-fill.src-sense-library      { background: rgba(197, 181, 154, 0.55); }
.ki-mix-fill.src-literature         { background: rgba(155, 175, 161, 0.8); }
.ki-mix-fill.src-supplier-notes     { background: rgba(197, 181, 154, 0.85); }
.ki-mix-pct {
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  color: var(--navy-deep);
}

/* Per-inquiry insight cards (compact) */
.ki-card-list { display: flex; flex-direction: column; gap: 8px; }
.ki-card {
  padding: 8px 10px;
  background: rgba(239, 234, 217, 0.65);
  border: 1px solid var(--border);
  border-radius: 5px;
  overflow: hidden;
}
.ki-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.ki-card-title { display: flex; align-items: baseline; gap: 6px; min-width: 0; flex: 1; }
.ki-inq-no {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  color: var(--gold);
  background: rgba(255,255,255,0.7);
  padding: 1px 5px;
  border-radius: 3px;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}
.ki-card-name {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--navy-deep);
  font-family: var(--serif);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.ki-card-meta { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.ki-primary { font-size: 9.5px; color: var(--text-med); }
.ki-primary b { color: var(--navy-deep); }
.ki-coverage {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 3px;
  letter-spacing: 0.02em;
}
.ki-coverage.cov-high { background: rgba(47, 143, 79, 0.15);  color: #2f8f4f; border: 1px solid rgba(47,143,79,0.3); }
.ki-coverage.cov-med  { background: rgba(197, 181, 154, 0.4); color: #7a5e2a; border: 1px solid rgba(197,181,154,0.6); }
.ki-coverage.cov-low  { background: rgba(176, 60, 60, 0.15);  color: #b03c3c; border: 1px solid rgba(176,60,60,0.3); }

/* Source hits grid: 6 source planes side by side (responsive). Min-width:0 on
   children so long top-titles get ellipsis instead of pushing the grid out. */
.ki-hit-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 6px;
}
@media (max-width: 1280px) { .ki-hit-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px)  { .ki-hit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.ki-hit {
  min-width: 0;
  padding: 5px 7px;
  background: rgba(255,255,255,0.55);
  border: 1px solid var(--border);
  border-radius: 3px;
}
.ki-hit.ki-hit-empty { opacity: 0.45; }
.ki-hit-head {
  display: flex;
  align-items: center;
  gap: 3px;
  flex-wrap: wrap;
  margin-bottom: 2px;
}
.ki-hit-head .ki-src-pill {
  font-size: 8.5px;
  padding: 0 5px;
}
.ki-hit-count {
  font-family: var(--mono);
  font-size: 8.5px;
  color: var(--text-faint);
  font-weight: 700;
}
.ki-hit-rel {
  font-family: var(--mono);
  font-size: 8.5px;
  padding: 0 4px;
  border-radius: 2px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.ki-hit-rel.rel-high { background: rgba(47, 143, 79, 0.18); color: #2f8f4f; }
.ki-hit-rel.rel-med  { background: rgba(197, 181, 154, 0.45); color: #7a5e2a; }
.ki-hit-rel.rel-low  { background: rgba(176, 60, 60, 0.18); color: #b03c3c; }
.ki-hit-rel.rel-none { background: transparent; color: var(--text-faint); }
.ki-hit-top {
  font-size: 9.5px;
  color: var(--text-dark);
  line-height: 1.3;
  font-family: var(--serif);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Missing / edited section (compact) */
.ki-missing {
  border-top: 1px dashed var(--border);
  padding-top: 6px;
  margin-top: 3px;
}
.ki-missing-head {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-faint);
  font-weight: 700;
  margin: 0 0 4px;
  font-family: var(--sans);
}
.ki-missing-row {
  padding: 4px 7px;
  background: rgba(176, 60, 60, 0.06);
  border-left: 2px solid rgba(176, 60, 60, 0.4);
  border-radius: 3px;
  margin-bottom: 3px;
}
.ki-missing-row:last-child { margin-bottom: 0; }
.ki-missing-item {
  font-size: 10px;
  color: var(--text-dark);
  font-weight: 600;
  margin-bottom: 1px;
}
.ki-missing-meta { font-size: 9.5px; color: var(--text-med); line-height: 1.35; }
.ki-missing-meta b { color: var(--navy-deep); }

.ki-missing.ki-missing-clean {
  background: rgba(47, 143, 79, 0.08);
  border-left: 2px solid rgba(47, 143, 79, 0.4);
  border-radius: 3px;
  border-top: none;
  padding: 4px 8px;
  margin-top: 0;
  font-size: 9.5px;
  color: #3f6a4c;
  font-style: italic;
}

/* Gap radar tab */
.gr-head {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 12px;
  padding: 0 2px;
}
.gr-head-counts {
  display: flex;
  align-items: center;
  gap: 12px;
}
.gr-head-total {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.gr-head-split { display: inline-flex; gap: 6px; }
.gr-pill {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.04em;
  padding: 2px 7px;
  border-radius: 3px;
  font-weight: 600;
}
.gr-pill-int { background: rgba(70, 110, 80, 0.16); color: #2f5b3e; border: 1px solid rgba(70,110,80,0.25); }
.gr-pill-ext { background: rgba(150, 100, 50, 0.16); color: #7c4a18; border: 1px solid rgba(150,100,50,0.25); }
.gr-head-note { font-size: 11px; color: var(--text-faint); font-style: italic; line-height: 1.4; }

/* 2-column layout: Internal team capture on the left, External portfolio scan on the right. */
.gr-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: start;
}
.gr-col {
  display: flex;
  flex-direction: column;
  padding: 10px 12px;
  background: rgba(239, 234, 217, 0.4);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.gr-col-int { border-left: 3px solid rgba(70, 110, 80, 0.6); }
.gr-col-ext { border-left: 3px solid rgba(150, 100, 50, 0.6); }
.gr-col-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 8px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--border-soft);
}
.gr-col-title {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--navy-deep);
}
.gr-col-int .gr-col-title { color: #2f5b3e; }
.gr-col-ext .gr-col-title { color: #7c4a18; }
.gr-col-count {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  margin-left: auto;
  background: rgba(255,255,255,0.7);
  padding: 1px 7px;
  border-radius: 8px;
}
.gr-empty {
  list-style: none;
  padding: 14px 12px;
  font-size: 11px;
  color: var(--text-faint);
  font-style: italic;
  text-align: center;
  background: rgba(255,255,255,0.5);
  border: 1px dashed var(--border-soft);
  border-radius: 4px;
}

@media (max-width: 1100px) {
  .gr-columns { grid-template-columns: 1fr; }
}

.gr-list { list-style: none; display: flex; flex-direction: column; gap: 7px; padding: 0; margin: 0; }
.gr-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 9px 11px;
  background: rgba(255,255,255,0.65);
  border: 1px solid var(--border);
  border-left-width: 3px;
  border-radius: 5px;
}
.gr-row-top {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 2px;
}
.gr-row.sev-high { border-left-color: #b03c3c; }
.gr-row.sev-med  { border-left-color: #c4a04c; }
.gr-row.sev-low  { border-left-color: rgba(155, 175, 161, 0.7); }
.gr-row.gr-ext { background: rgba(245, 230, 210, 0.45); }

.gr-sev {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 3px;
  text-align: center;
  height: fit-content;
}
.sev-high .gr-sev { background: rgba(176,60,60,0.15); color: #b03c3c; }
.sev-med  .gr-sev { background: rgba(196,160,76,0.18); color: #8a6312; }
.sev-low  .gr-sev { background: rgba(155,175,161,0.25); color: #4a6a55; }

.gr-top-line {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
  flex-wrap: wrap;
}
.gr-class {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 3px;
}
.gr-class-int { background: rgba(70,110,80,0.18); color: #2f5b3e; }
.gr-class-ext { background: rgba(150,100,50,0.18); color: #7c4a18; }
.gr-detected {
  font-family: var(--mono);
  font-size: 9px;
  color: var(--text-faint);
  letter-spacing: 0.03em;
}

.gr-gap {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--navy-deep);
  font-family: var(--serif);
  line-height: 1.4;
  margin-bottom: 4px;
}
.gr-class-reason {
  font-size: 10px;
  color: var(--text-med);
  line-height: 1.45;
  margin-bottom: 5px;
  font-style: italic;
  padding-left: 8px;
  border-left: 2px solid rgba(155,175,161,0.5);
}
.gr-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 3px;
  flex-wrap: wrap;
}
.gr-meta-label { font-size: 9.5px; color: var(--text-faint); letter-spacing: 0.03em; text-transform: uppercase; font-family: var(--mono); }
.gr-meta-sep { color: var(--text-faint); font-size: 10px; }
.gr-check-pill {
  font-family: var(--mono);
  font-size: 9px;
  padding: 1px 5px;
  border-radius: 2px;
  background: rgba(255,255,255,0.7);
  border: 1px solid var(--border);
  color: var(--text-dark);
}
.gr-team-name { font-size: 10.5px; font-weight: 600; color: var(--navy-deep); }
.gr-team-ext { font-size: 10px; color: var(--text-faint); font-style: italic; }

.gr-affects { font-size: 9.5px; color: var(--text-faint); margin-bottom: 3px; }
.gr-affect-chip {
  font-family: var(--mono);
  font-size: 9px;
  background: rgba(255,255,255,0.7);
  border: 1px solid var(--border);
  padding: 1px 4px;
  border-radius: 2px;
  color: var(--text-dark);
}
.gr-suggested {
  font-size: 10.5px;
  color: var(--text-med);
  line-height: 1.4;
  padding-top: 3px;
}
.gr-prio-tag {
  display: inline-block;
  font-family: var(--mono);
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 1px 5px;
  margin-right: 5px;
  background: rgba(196, 160, 76, 0.22);
  color: #6b4f1f;
  border-radius: 2px;
  vertical-align: 1px;
}

/* Sense Library owner note — shown on internal gaps where the relevant
   source was Sense Library. Customer-side corrective action is the prio 1
   line above; this is the secondary expansion path (contact the curator). */
.gr-owner-note {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin-top: 6px;
  padding: 6px 9px;
  background: rgba(196, 160, 76, 0.10);
  border-left: 2px solid var(--gold);
  border-radius: 3px;
  font-size: 10.5px;
  color: var(--text-dark);
  line-height: 1.45;
}
.gr-owner-icon {
  color: var(--gold);
  font-size: 12px;
  line-height: 1;
  flex-shrink: 0;
}
.gr-owner-text { font-style: italic; }
.gr-scan-meta {
  display: flex;
  gap: 8px;
  margin-top: 6px;
  padding: 5px 8px;
  background: rgba(150,100,50,0.08);
  border-radius: 3px;
  flex-wrap: wrap;
  align-items: center;
}
.gr-scan-pill {
  font-family: var(--mono);
  font-size: 9px;
  color: #7c4a18;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.gr-scan-count { font-size: 9.5px; color: var(--text-med); }
.gr-scan-status {
  font-family: var(--mono);
  font-size: 9px;
  color: var(--text-faint);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  margin-left: auto;
}

.gr-action {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed var(--border-soft);
  display: flex;
  justify-content: flex-end;
}

/* ============================================================
   Capture flow modal (Gap radar internal → Open capture flow)
   ============================================================ */
.cap-context {
  padding: 10px 12px;
  background: rgba(239, 234, 217, 0.55);
  border: 1px solid var(--border);
  border-radius: 5px;
  margin-bottom: 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cap-meta-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  line-height: 1.5;
}
.cap-key {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  min-width: 90px;
  flex-shrink: 0;
}
.cap-affect {
  font-family: var(--mono);
  font-size: 10px;
  background: rgba(255,255,255,0.7);
  border: 1px solid var(--border);
  padding: 1px 5px;
  border-radius: 2px;
  color: var(--text-dark);
}
.cap-sev {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: 2px;
}
.cap-sev-high { background: rgba(176,60,60,0.15); color: #b03c3c; }
.cap-sev-med  { background: rgba(196,160,76,0.18); color: #8a6312; }
.cap-sev-low  { background: rgba(155,175,161,0.25); color: #4a6a55; }
.cap-path {
  font-family: var(--mono);
  font-size: 10.5px;
  background: rgba(255,255,255,0.7);
  border: 1px solid var(--border);
  padding: 2px 6px;
  border-radius: 3px;
  color: var(--navy-deep);
}

.cap-section-head {
  font-family: var(--serif);
  font-size: 12.5px;
  font-weight: 700;
  color: var(--navy-deep);
  margin: 8px 0 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border-soft);
  letter-spacing: 0.02em;
}

.cap-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
}
.cap-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cap-field-wide { grid-column: 1 / -1; }
.cap-label {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.cap-input {
  padding: 6px 10px;
  font-size: 12px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 3px;
  color: var(--text-dark);
}
.cap-input:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px rgba(196, 160, 76, 0.2); }
.cap-textarea {
  padding: 10px 12px;
  font-family: var(--mono);
  font-size: 11.5px;
  line-height: 1.55;
  color: var(--text-dark);
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 3px;
  resize: vertical;
  min-height: 200px;
}
.cap-textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px rgba(196, 160, 76, 0.2); }

/* Rich body (contenteditable variants) — used by Capture flow + Final proposal */
.cap-textarea-rich,
.fp-textarea-rich {
  display: block;
  min-height: 280px;
  max-height: 60vh;
  overflow-y: auto;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 3px;
  font-family: var(--serif);
  font-size: 13px;
  line-height: 1.65;
  color: var(--text-dark);
  white-space: normal;
}
.cap-textarea-rich:focus,
.fp-textarea-rich:focus {
  outline: none;
  border-color: var(--gold);
  box-shadow: 0 0 0 2px rgba(196, 160, 76, 0.2);
}
.cap-textarea-rich .md-heading,
.fp-textarea-rich .md-heading {
  font-family: var(--serif);
  font-weight: 700;
  color: var(--navy-deep);
  margin: 14px 0 6px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border-soft);
}
.cap-textarea-rich h3.md-heading,
.fp-textarea-rich h3.md-heading {
  font-size: 16px;
  letter-spacing: 0.01em;
}
.cap-textarea-rich h4.md-heading,
.fp-textarea-rich h4.md-heading {
  font-size: 13.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gold);
  border-bottom-color: var(--gold-soft);
}
.cap-textarea-rich h5.md-heading,
.fp-textarea-rich h5.md-heading {
  font-size: 12px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-med);
  border-bottom: none;
}
.cap-textarea-rich p,
.fp-textarea-rich p {
  margin: 0 0 10px;
}
.cap-textarea-rich p:last-child,
.fp-textarea-rich p:last-child {
  margin-bottom: 0;
}
.cap-textarea-rich b,
.fp-textarea-rich b,
.cap-textarea-rich strong,
.fp-textarea-rich strong {
  color: var(--navy-deep);
  font-weight: 700;
}
.cap-textarea-rich code,
.fp-textarea-rich code {
  font-family: var(--mono);
  font-size: 11px;
  background: rgba(196, 160, 76, 0.10);
  padding: 1px 5px;
  border-radius: 2px;
  color: var(--text-dark);
}
.md-table {
  width: 100%;
  border-collapse: collapse;
  margin: 8px 0 12px;
  font-family: var(--mono);
  font-size: 11px;
}
.md-table th,
.md-table td {
  border: 1px solid var(--border-soft);
  padding: 4px 8px;
  text-align: left;
  vertical-align: top;
}
.md-table th {
  background: rgba(196, 160, 76, 0.10);
  font-weight: 700;
  color: var(--navy-deep);
  font-family: var(--sans);
  font-size: 10.5px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.cap-owner-note {
  margin-top: 12px;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 12px;
  background: rgba(196, 160, 76, 0.10);
  border-left: 2px solid var(--gold);
  border-radius: 3px;
  font-size: 11px;
  font-style: italic;
  color: var(--text-dark);
  line-height: 1.5;
}
.cap-owner-icon { color: var(--gold); font-size: 13px; line-height: 1; flex-shrink: 0; }

@media (max-width: 760px) {
  .cap-form { grid-template-columns: 1fr; }
  .cap-key { min-width: 70px; font-size: 9px; }
}

/* ============================================================
   Final proposal modal (closed inquiries → Confirm & draft final proposal)
   Reuses cap-* patterns; renames the BEM root to fp-* for clarity.
   ============================================================ */
.fp-context {
  padding: 10px 12px;
  background: rgba(70, 110, 80, 0.08);
  border: 1px solid var(--border);
  border-left: 3px solid rgba(70, 110, 80, 0.5);
  border-radius: 5px;
  margin-bottom: 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.fp-meta-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  line-height: 1.5;
}
.fp-key {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  min-width: 96px;
  flex-shrink: 0;
}
.fp-section-head {
  font-family: var(--serif);
  font-size: 12.5px;
  font-weight: 700;
  color: var(--navy-deep);
  margin: 8px 0 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border-soft);
  letter-spacing: 0.02em;
}
.fp-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.fp-field { display: flex; flex-direction: column; gap: 4px; }
.fp-field-wide { width: 100%; }
.fp-label {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.fp-input {
  padding: 6px 10px;
  font-size: 12px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 3px;
  color: var(--text-dark);
}
.fp-input:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px rgba(196, 160, 76, 0.2); }
.fp-textarea {
  padding: 10px 12px;
  font-family: var(--serif);
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--text-dark);
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 3px;
  resize: vertical;
  min-height: 260px;
  white-space: pre-wrap;
}
.fp-textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px rgba(196, 160, 76, 0.2); }
.fp-foot-note {
  margin-top: 10px;
  font-size: 11px;
  color: var(--text-faint);
  font-style: italic;
}

/* Final-draft modal additions: reviewer-visible reference buttons (open
   the original inquiry, TA / quote artefacts, reviewer comments as
   stacked overlays), saved-draft resume hint, plain-text editor variant
   that exposes the raw template so reviewers can edit markdown directly. */
.fp-viewers {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  margin: 8px 0 12px;
  border: 1px dashed var(--border);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.5);
}
.fp-viewers-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
  margin-right: 4px;
}
.fp-saved-hint {
  margin: 4px 0 10px;
  padding: 7px 10px;
  font-size: 11.5px;
  background: rgba(196, 160, 76, 0.10);
  border-left: 3px solid var(--gold);
  border-radius: 3px;
  color: var(--text-dark);
}
.fp-textarea-plain {
  font-family: ui-monospace, SFMono-Regular, Menlo, "Segoe UI Mono", monospace;
  font-size: 12px;
  line-height: 1.55;
  min-height: 320px;
  background: #fdfcf9;
}
.fp-comments-head {
  margin: 10px 0 6px;
  font-size: 13px;
  color: var(--navy-deep, var(--navy));
}
.fp-comments-block {
  margin: 0 0 8px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid var(--border-soft);
  border-radius: 3px;
  white-space: pre-wrap;
  font-size: 12px;
  line-height: 1.55;
  color: var(--text-dark);
}

/* Quote workspace · inline refinement controls (sit directly under
   the best-hit methodology card). Three equal-width buttons in one
   row — Add parameter, Attach file, Re-run suggestion — followed by
   the list of active params + attachment pill (only visible when the
   reviewer has added one). */
.qwc-params-inline {
  margin-top: 10px;
}
.qwc-params-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
/* 3-up grid forces equal column widths so all three refinement
   buttons render at the same size regardless of label length. */
.qwc-params-actions-3up {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
.qwc-params-btn {
  /* Force identical box model across <button> and <label> elements so
     all three controls render at the same height regardless of which
     HTML tag they use under the hood. */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 100%;
  min-width: 0;
  height: 28px;
  padding: 0 10px;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  box-sizing: border-box;
}
.qwc-attach-btn {
  /* Label rendering as a button — text alignment handled by flex
     above; here we just keep the cursor consistent. */
  text-align: center;
}
.qwc-params-list {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.qwc-params-list:empty { display: none; }
.qwc-params-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 8px;
  align-items: center;
  padding: 4px 8px;
  background: #fff;
  border: 1px solid var(--border-soft);
  border-radius: 3px;
  font-size: 11.5px;
}
.qwc-params-key {
  font-weight: 700;
  color: var(--navy-deep, var(--navy));
}
.qwc-params-val {
  color: var(--text-dark);
}
.qwc-params-remove {
  border: none;
  background: transparent;
  color: var(--text-faint);
  font-size: 16px;
  cursor: pointer;
  line-height: 1;
  padding: 0 4px;
}
.qwc-params-remove:hover { color: var(--warn, #B25A00); }
.qwc-attach-row { margin-top: 6px; }
.qwc-attach-row:empty { display: none; }
.qwc-attach-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  font-size: 11px;
  background: rgba(196, 160, 76, 0.10);
  border: 1px solid var(--border);
  border-radius: 12px;
  color: var(--text-dark);
}
.qwc-attach-icon { font-size: 11px; }
.qwc-attach-name { font-weight: 600; color: var(--navy-deep, var(--navy)); }
.qwc-attach-meta { color: var(--text-faint); font-size: 10.5px; }
.qwc-attach-remove {
  border: none;
  background: transparent;
  color: var(--text-faint);
  font-size: 14px;
  cursor: pointer;
  line-height: 1;
  padding: 0 2px;
}
.qwc-attach-remove:hover { color: var(--warn, #B25A00); }

/* Approval-action modal (Approvals page → row click) */
.ap-modal-context {
  padding: 10px 12px;
  background: rgba(196, 160, 76, 0.10);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 5px;
  margin-bottom: 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ap-meta-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  line-height: 1.5;
}
.ap-key {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  min-width: 88px;
  flex-shrink: 0;
}
.ap-modal-prompt {
  font-size: 11.5px;
  color: var(--text-med);
  line-height: 1.5;
  margin-top: 10px;
  font-style: italic;
}
.ap-section-head {
  font-family: var(--serif);
  font-size: 13px;
  font-weight: 700;
  color: var(--navy-deep);
  margin: 18px 0 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border-soft);
}
.gr-action-btn {
  font-size: 10.5px;
  padding: 4px 10px;
  white-space: nowrap;
}

/* ============================================================
   Workspace: Knowledge hit narrative (replaces best-hit cards)
   ============================================================ */
.iw-kh-narrative {
  padding: 12px 16px;
  background: rgba(239, 234, 217, 0.45);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 5px;
  margin-bottom: 10px;
}
.iw-kh-narrative .kh-para {
  font-family: var(--serif);
  font-size: 12px;
  line-height: 1.7;
  color: var(--text-dark);
  margin: 0 0 10px;
}
.iw-kh-narrative .kh-para:last-child { margin-bottom: 0; }
.iw-kh-narrative b { color: var(--navy-deep); font-weight: 600; }
.iw-kh-narrative .ki-src-pill {
  vertical-align: 1px;
  font-size: 8.5px;
  padding: 1px 5px;
  margin: 0 2px;
}
.kh-attach {
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-med);
  background: rgba(197, 181, 154, 0.2);
  padding: 5px 9px;
  border-radius: 3px;
  border-left: 2px solid rgba(197, 181, 154, 0.7);
}
.kh-attach code {
  font-family: var(--mono);
  font-size: 10px;
  background: rgba(255,255,255,0.55);
  padding: 1px 5px;
  border-radius: 2px;
  color: var(--navy-deep);
}

/* Search-summary + risk-flag narrative lines */
.kh-summary {
  font-family: var(--sans);
  font-size: 11px;
  color: var(--text-med);
  padding-top: 6px;
  border-top: 1px dashed var(--border);
}
.kh-summary b { color: var(--navy-deep); font-weight: 700; font-family: var(--sans); }
.kh-risk {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-family: var(--sans);
  font-size: 10.5px;
}
.kh-risk-lab {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: #8a3a3a;
  margin-right: 4px;
}
.kh-risk-chip {
  display: inline-block;
  font-size: 10px;
  padding: 1px 7px;
  border-radius: 3px;
  background: rgba(176, 60, 60, 0.15);
  color: #8a3a3a;
  border: 1px solid rgba(176, 60, 60, 0.4);
  font-weight: 600;
}

/* Collapsible details list (Methodology / Pricing comparable / Risk flags) */
.kh-details-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.kh-details {
  border: 1px solid var(--border);
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.4);
  overflow: hidden;
}
.kh-details[open] { background: rgba(255, 255, 255, 0.6); }
.kh-details-summary {
  list-style: none;
  cursor: pointer;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
}
.kh-details-summary::-webkit-details-marker { display: none; }
.kh-details-summary:hover {
  background: rgba(232, 220, 196, 0.4);
  color: var(--navy-deep);
}
.kh-caret {
  display: inline-block;
  transition: transform 0.15s;
  font-size: 10px;
}
.kh-details[open] .kh-caret { transform: rotate(90deg); }
.kh-details-name { color: var(--navy-deep); }
.kh-details-body { padding: 8px 12px 10px; }
.kh-details-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px dashed var(--border);
}

/* Pricing comparable rows */
.kh-comp-list { list-style: none; display: flex; flex-direction: column; gap: 4px; padding: 0; margin: 0; }
.kh-comp-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  padding: 6px 9px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 11px;
}
.kh-comp-id {
  font-family: var(--mono);
  font-size: 10px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--border);
  color: var(--gold);
  padding: 1px 5px;
  border-radius: 2px;
  font-weight: 700;
}
.kh-comp-label {
  font-family: var(--serif);
  color: var(--navy-deep);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kh-comp-total {
  font-family: var(--serif);
  font-weight: 700;
  color: var(--navy-deep);
  white-space: nowrap;
}
.kh-comp-why {
  grid-column: 2 / -1;
  font-size: 10px;
  color: var(--text-faint);
  font-style: italic;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Risk flag rows (inside the Risk flags collapsible) */
.kh-risk-list { list-style: none; display: flex; flex-direction: column; gap: 4px; padding: 0; margin: 0; }
.kh-risk-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 6px 9px;
  background: rgba(176, 60, 60, 0.06);
  border: 1px solid rgba(176, 60, 60, 0.25);
  border-left-width: 3px;
  border-radius: 3px;
}
.kh-risk-why { font-size: 10.5px; color: var(--text-med); font-family: var(--serif); }

/* Methodology host inside collapsible: trim outer matrix head padding */
.kh-method-host .mm-head { padding: 0 0 6px; }
.kh-method-host .mm-scroll { margin-top: 0; }

/* ============================================================
   Section B compaction: one-screen fit
   ============================================================ */
.iw-kh-narrative {
  padding: 9px 12px;
  margin-bottom: 8px;
}
.iw-kh-narrative .kh-para {
  font-size: 11px;
  line-height: 1.6;
  margin-bottom: 6px;
}
.kh-summary { font-size: 10.5px; padding-top: 5px; }

/* Best-hit proposal banner */
.kh-proposal {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 7px 10px;
  margin-top: 8px;
  border-radius: 4px;
  border-left: 3px solid var(--gold);
  background: rgba(255, 255, 255, 0.6);
}
.kh-proposal.kh-prop-accept { border-left-color: #2f8f4f; background: rgba(47, 143, 79, 0.08); }
.kh-proposal.kh-prop-review { border-left-color: #c4a04c; background: rgba(196, 160, 76, 0.10); }
.kh-proposal.kh-prop-reject { border-left-color: #b03c3c; background: rgba(176, 60, 60, 0.08); }
.kh-prop-lab {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
}
.kh-prop-accept .kh-prop-lab { color: #2f8f4f; }
.kh-prop-review .kh-prop-lab { color: #8a6312; }
.kh-prop-reject .kh-prop-lab { color: #8a3a3a; }
.kh-prop-text {
  font-family: var(--serif);
  font-size: 10.5px;
  line-height: 1.55;
  color: var(--text-dark);
}

/* Compact collapsible summaries */
.kh-details-summary {
  padding: 6px 10px;
  font-size: 10px;
}

/* ============================================================
   Transposed matrix: stages = cols, sources = rows (numbered)
   ============================================================ */
.mm-table {
  font-size: 10.5px;
}
.mm-table th,
.mm-table td {
  padding: 4px 6px;
}
.mm-corner {
  width: 150px;
  min-width: 150px;
  font-size: 9px;
}
.mm-col-head {
  min-width: 72px;
  width: 88px;
  text-align: center;
  font-family: var(--sans);
  background: rgba(232, 220, 196, 0.55);
  padding: 3px 3px;
}
.mm-col-head .mm-stage-num {
  display: block;
  font-family: var(--mono);
  font-size: 8px;
  color: var(--gold);
  letter-spacing: 0.04em;
}
.mm-col-head .mm-stage-name {
  display: block;
  font-size: 9.5px;
  color: var(--navy-deep);
  font-family: var(--serif);
  font-weight: 600;
  line-height: 1.15;
  white-space: nowrap;
}

/* Source row head: compact — number + category pill only */
.mm-row-head {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 150px;
  max-width: 150px;
  background: rgba(239, 234, 217, 0.5);
  text-align: left;
  padding: 5px 8px !important;
}
.mm-row-head .ki-src-pill { font-size: 8.5px; padding: 1px 5px; }
.mm-row-head {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 5px !important;
  min-width: 160px;
  background: rgba(239, 234, 217, 0.5);
  text-align: left;
}
.mm-row-head .ki-src-pill { font-size: 8.5px; padding: 1px 5px; }
.mm-src-num {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  color: var(--gold);
  background: rgba(255, 255, 255, 0.7);
  border-radius: 2px;
  padding: 1px 4px;
}
.mm-best-tag {
  font-family: var(--mono);
  font-size: 8.5px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  color: #2f8f4f;
  margin-left: auto;
}
.mm-row-best > .mm-row-head { background: rgba(47, 143, 79, 0.10); }
.mm-row-best .mm-cell { background: rgba(255, 255, 255, 0.7); }

/* Low-confidence row tint: orange-translucent cells when source conf <= 85 */
.mm-row-lowconf > .mm-row-head { background: rgba(232, 144, 60, 0.18); }
.mm-row-lowconf .mm-cell { background: rgba(232, 144, 60, 0.12); }
.mm-row-lowconf .mm-cell-empty { background: rgba(232, 144, 60, 0.06); }
.mm-lowconf-tag {
  font-family: var(--mono);
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  color: #b06624;
  background: rgba(232, 144, 60, 0.25);
  padding: 1px 4px;
  border-radius: 2px;
  margin-left: auto;
}
.mm-cell {
  font-size: 10px;
  min-width: 130px;
}
.mm-hit {
  padding: 3px 0;
  gap: 4px 5px;
}
.mm-method { font-size: 10px; line-height: 1.25; }
.mm-src-label { font-size: 8.5px; }
.mm-cell .conf-track { width: 70px; height: 6px; }

/* Source selector below the matrix */
.mm-selector {
  margin-top: 8px;
  padding: 7px 10px;
  background: rgba(239, 234, 217, 0.5);
  border: 1px solid var(--border);
  border-radius: 4px;
}
.mm-selector-head {
  font-family: var(--sans);
  font-size: 9px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
  margin-bottom: 5px;
}
.mm-selector-chips {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* Category accordion in the source selector */
.mm-cat-group {
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid var(--border);
  border-radius: 4px;
  overflow: hidden;
}
.mm-cat-group[open] { background: rgba(255, 255, 255, 0.8); }
.mm-cat-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 9px;
  font-size: 10.5px;
}
.mm-cat-summary::-webkit-details-marker { display: none; }
.mm-cat-summary:hover { background: rgba(232, 220, 196, 0.5); }
.mm-cat-caret {
  display: inline-block;
  transition: transform 0.15s;
  font-size: 9px;
  color: var(--text-faint);
}
.mm-cat-group[open] .mm-cat-caret { transform: rotate(90deg); }
.mm-cat-summary .ki-src-pill { font-size: 8.5px; padding: 1px 5px; }
.mm-cat-count {
  font-family: var(--mono);
  font-size: 9px;
  color: var(--text-faint);
}
.mm-cat-selected {
  font-family: var(--mono);
  font-size: 9px;
  background: rgba(196, 160, 76, 0.25);
  color: #8a6312;
  padding: 1px 5px;
  border-radius: 2px;
  font-weight: 700;
  margin-left: auto;
}
.mm-cat-summary .mm-best-tag { margin-left: 6px; }

.mm-cat-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 4px 8px 7px 24px;
  border-top: 1px dashed var(--border-soft);
  background: rgba(239, 234, 217, 0.3);
}
.mm-cat-body .mm-src-toggle {
  flex-direction: row;
  background: rgba(255, 255, 255, 0.6);
  padding: 3px 7px;
  border-radius: 3px;
}
.mm-cat-body .mm-src-toggle.on { background: rgba(255, 255, 255, 0.9); border-color: var(--gold); }
.mm-src-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 6px;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid var(--border);
  border-radius: 3px;
  cursor: pointer;
  font-size: 10px;
}
.mm-src-toggle:hover { background: rgba(232, 220, 196, 0.7); }
.mm-src-toggle.on { background: rgba(255, 255, 255, 0.9); border-color: var(--gold); }
.mm-src-toggle input[type="checkbox"] {
  width: 12px; height: 12px;
  accent-color: var(--navy);
  margin: 0;
}
.mm-src-toggle .ki-src-pill { font-size: 8.5px; padding: 1px 5px; }
.mm-src-toggle:not(.on) .ki-src-pill { opacity: 0.5; }
.mm-src-toggle .mm-src-citation {
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--text-dark);
  max-width: 220px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
}
.mm-src-toggle .mm-src-conf {
  font-family: var(--mono);
  font-size: 9px;
  color: var(--text-faint);
  background: rgba(239, 234, 217, 0.7);
  padding: 1px 4px;
  border-radius: 2px;
}
.mm-src-toggle .mm-src-confbar { flex-shrink: 0; }
.mm-src-toggle .mm-src-reason {
  font-family: var(--serif);
  font-size: 9.5px;
  font-style: italic;
  color: var(--text-faint);
  white-space: nowrap;
  min-width: 130px;
}

/* Source-detail link icon (methodology + pricing selectors / table headers) */
.mm-src-link,
.kh-pricing-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 3px;
  color: var(--text-faint);
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
}
.mm-src-link:hover,
.kh-pricing-link:hover {
  color: var(--navy-deep);
  background: rgba(255, 255, 255, 0.6);
  border-color: var(--border);
}
.mm-src-link svg,
.kh-pricing-link svg { stroke: currentColor; }

/* Source drawer line-item table */
.sd-line-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}
.sd-line-table th,
.sd-line-table td {
  padding: 4px 8px;
  border: 1px solid var(--border-soft);
  text-align: left;
  font-family: var(--serif);
}
.sd-line-table th {
  background: rgba(232, 220, 196, 0.5);
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 700;
  color: var(--navy-deep);
  font-family: var(--sans);
}
.sd-line-table td:nth-child(2),
.sd-line-table td:nth-child(3),
.sd-line-table td:nth-child(4) {
  font-family: var(--mono);
  font-size: 10.5px;
  text-align: right;
}
.sd-na { font-size: 11px; color: var(--text-faint); font-style: italic; }

/* Per-stage document list inside the source drawer (project-grouped sources) */
.sd-stage-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sd-stage-list > li {
  padding: 6px 9px;
  background: rgba(239, 234, 217, 0.45);
  border: 1px solid var(--border);
  border-radius: 4px;
}
.sd-stage-name {
  display: block;
  font-family: var(--sans);
  font-size: 9.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
  margin-bottom: 3px;
}
.sd-doc-list {
  list-style: disc;
  margin: 0;
  padding-left: 18px;
  font-family: var(--mono);
  font-size: 10.5px;
  color: var(--text-dark);
  line-height: 1.5;
}
.mm-selector-empty { font-size: 10px; color: var(--text-faint); font-style: italic; }

/* Stage cells: shrink */
.mm-table td.mm-cell { min-width: 72px; padding: 3px 4px; vertical-align: top; }
.mm-table .mm-method { font-size: 9.5px; line-height: 1.2; white-space: normal; }
.mm-table .mm-hit { gap: 2px 4px; padding: 2px 0; }
.mm-table .mm-rank { font-size: 8.5px; padding: 0 4px; align-self: flex-start; }

/* ============================================================
   Pricing diff table: overlap / missing / unnecessary
   ============================================================ */
.kh-diff-head {
  margin-top: 8px;
  margin-bottom: 4px;
  font-family: var(--sans);
  font-size: 10px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
}
.kh-diff-head .kh-comp-id { font-size: 9.5px; }
.kh-diff-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 10.5px;
}
.kh-diff-th {
  background: rgba(232, 220, 196, 0.55);
  font-family: var(--sans);
  font-size: 8.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--navy-deep);
  text-align: left;
  padding: 3px 5px;
  border: 1px solid var(--border);
}
.kh-diff-row td { padding: 3px 5px; border: 1px solid var(--border-soft); vertical-align: top; }
.kh-diff-item { font-family: var(--serif); font-size: 10.5px; color: var(--navy-deep); }
.kh-diff-note { font-size: 9px; color: var(--text-med); font-style: italic; }
.kh-diff-chip {
  display: inline-block;
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 2px;
}
.kh-diff-chip.diff-overlap     { background: rgba(47, 143, 79, 0.18); color: #2f8f4f; }
.kh-diff-chip.diff-missing     { background: rgba(176, 60, 60, 0.18); color: #8a3a3a; }
.kh-diff-chip.diff-unnecessary { background: rgba(197, 181, 154, 0.45); color: #7a5e2a; }
.kh-diff-row.diff-overlap     { background: rgba(47, 143, 79, 0.05); }
.kh-diff-row.diff-missing     { background: rgba(176, 60, 60, 0.05); }
.kh-diff-row.diff-unnecessary { background: rgba(197, 181, 154, 0.10); }

/* Pricing diff: inquiry qty + per-candidate qty columns */
.kh-diff-th.kh-diff-th-sub {
  font-size: 8.5px;
  background: rgba(232, 220, 196, 0.4);
  font-weight: 600;
  padding: 2px 6px;
}
.kh-diff-qty {
  font-family: var(--serif);
  font-size: 11px;
  font-weight: 700;
  color: var(--navy-deep);
  text-align: center;
  white-space: nowrap;
}
.kh-diff-inq-qty {
  background: rgba(232, 220, 196, 0.35);
}
.kh-diff-cell-na {
  background: rgba(245, 243, 238, 0.4);
}

/* Multi-source pricing diff: cells per candidate */
.kh-diff-cell {
  padding: 3px 5px;
  border: 1px solid var(--border-soft);
  vertical-align: top;
  font-size: 10px;
  min-width: 80px;
}
.kh-diff-cell .kh-diff-note { white-space: normal; }
.kh-diff-cell.diff-overlap     { background: rgba(47, 143, 79, 0.07); }
.kh-diff-cell.diff-missing     { background: rgba(176, 60, 60, 0.07); }
.kh-diff-cell.diff-unnecessary { background: rgba(197, 181, 154, 0.13); }
.kh-diff-cell .kh-diff-note    { display: block; margin-top: 2px; font-size: 9.5px; }
.kh-diff-chip.diff-na          { background: transparent; color: var(--text-faint); font-style: italic; }
.kh-diff-not-needed {
  display: inline-block;
  margin-left: 6px;
  font-family: var(--mono);
  font-size: 8.5px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-faint);
  background: rgba(197, 181, 154, 0.3);
  padding: 1px 4px;
  border-radius: 2px;
}
.kh-diff-na { font-size: 10.5px; color: var(--text-faint); font-style: italic; padding: 8px 0; text-align: center; }

/* Top banner (Risk flags row + Best-hit proposal) */
.kh-top-banner {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 12px;
  margin-bottom: 8px;
}
.kh-top-banner .kh-risk { margin: 0; }
.kh-top-banner .kh-proposal { margin-top: 0; }

/* Section B footer: save / request / revise actions */
.kh-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 10px;
  padding: 7px 12px;
  background: rgba(239, 234, 217, 0.4);
  border: 1px solid var(--border);
  border-radius: 4px;
}
.kh-actions-note { font-size: 10.5px; color: var(--text-faint); font-style: italic; flex: 1; min-width: 220px; }

/* Resume / Under-review banner inserted on top of section B */
.kh-resume-banner {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 4px;
  margin-bottom: 8px;
  font-size: 11px;
  line-height: 1.4;
}
.kh-resume-banner b { color: var(--navy-deep); }
.kh-resume-save {
  background: rgba(196, 160, 76, 0.12);
  border-left: 3px solid var(--gold);
  color: var(--text-dark);
}

/* (Removed .qw-resume-banner: replaced by the action-bar
   Re-run quote suggestion button. Cached quote auto-resume is now
   surfaced via the inline action button instead of a banner.) */
.kh-resume-review {
  background: rgba(44, 74, 107, 0.10);
  border-left: 3px solid var(--navy);
  color: var(--text-dark);
}
.kh-resume-icon { font-size: 14px; line-height: 1; }
.kh-resume-note {
  flex-basis: 100%;
  font-size: 10.5px;
  color: var(--text-med);
  font-style: italic;
  margin-top: 2px;
}
.iw-meta-pulse {
  animation: kh-pulse 0.8s ease-out;
}
@keyframes kh-pulse {
  0%   { background: rgba(196, 160, 76, 0.25); }
  100% { background: transparent; }
}

/* ============================================================
   Confidence breakdown bar (compact, per candidate)
   5-signal stacked bar + total number, tooltip on hover.
   ============================================================ */
.conf-bar {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
  cursor: help;
}
.conf-track {
  display: inline-flex;
  width: 80px;
  min-width: 80px;
  flex-shrink: 0;
  height: 8px;
  background: rgba(239, 234, 217, 0.85);
  border: 1px solid var(--border);
  border-radius: 2px;
  overflow: hidden;
}
.conf-seg { min-width: 1px; }
.conf-seg { display: inline-block; height: 100%; }
/* Per-signal colors (deterministic by key) */
.conf-seg-src   { background: rgba(44, 74, 107, 0.75); }  /* Source type — navy */
.conf-seg-rec   { background: rgba(155, 175, 161, 0.85); } /* Recency — sage */
.conf-seg-cite  { background: rgba(197, 181, 154, 0.85); } /* Citation history — gold */
.conf-seg-match { background: rgba(122, 94, 42, 0.7); }    /* Match score — dark gold */
.conf-seg-dom   { background: rgba(63, 94, 77, 0.7); }     /* Domain alignment — dark sage */

.conf-total {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.conf-total.rel-high { color: #2f8f4f; }
.conf-total.rel-med  { color: #7a5e2a; }
.conf-total.rel-low  { color: #b03c3c; }
.conf-total.rel-none { color: var(--text-faint); }

/* Methodology matrix: confidence bar sits on its own line below the source label */
.mm-conf {
  grid-column: 1 / -1;
  display: block;
  margin-top: 3px;
}
.mm-cell .conf-track { width: 72px; }

/* Pricing comparable row: reserve a column for the conf bar */
.kh-comp-row {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
}
.kh-comp-conf { white-space: nowrap; }
.kh-comp-row .conf-track { width: 100px; height: 8px; }
.kh-comp-row .conf-total { font-size: 10px; }
.kh-comp-why { grid-column: 2 / -1; }

/* ============================================================
   Workspace: Best-hit summary cards (methodology + pricing)
   ============================================================ */
.iw-bh-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 10px;
}
@media (max-width: 1000px) { .iw-bh-grid { grid-template-columns: 1fr; } }

.iw-bh-card {
  padding: 10px 12px;
  background: rgba(239, 234, 217, 0.55);
  border: 1px solid var(--border);
  border-radius: 5px;
}
.iw-bh-method { border-left: 3px solid var(--navy); }
.iw-bh-pricing { border-left: 3px solid var(--gold); }

.iw-bh-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
}
.iw-bh-kind {
  font-family: var(--sans);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
  flex: 1;
}
.iw-bh-summary {
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--text-dark);
  font-family: var(--serif);
  padding-bottom: 7px;
  margin-bottom: 7px;
  border-bottom: 1px dashed var(--border);
}
.iw-bh-summary b { color: var(--navy-deep); }
.iw-bh-quote-id {
  font-family: var(--mono);
  font-size: 10px;
  background: rgba(255,255,255,0.7);
  padding: 1px 5px;
  border-radius: 2px;
  color: var(--gold);
  font-weight: 700;
  margin-right: 4px;
}
.iw-bh-quote-total {
  display: block;
  font-family: var(--serif);
  font-size: 13.5px;
  font-weight: 700;
  color: var(--navy-deep);
  margin-top: 3px;
}

.iw-bh-rat-head {
  font-family: var(--sans);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
  margin-bottom: 3px;
}
.iw-bh-rat-rec {
  font-size: 11px;
  font-weight: 600;
  color: var(--navy-deep);
  font-family: var(--serif);
  line-height: 1.4;
  margin-bottom: 2px;
}
.iw-bh-rat-text {
  font-size: 10.5px;
  color: var(--text-med);
  line-height: 1.5;
  margin-bottom: 5px;
}
.iw-bh-rat-sources {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.iw-bh-rat-sources .rat-cite {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--mono);
  font-size: 9px;
  background: rgba(255,255,255,0.7);
  border: 1px solid var(--border);
  padding: 1px 5px;
  border-radius: 2px;
  color: var(--text-dark);
}
.iw-bh-rat-sources .rat-cite-kind {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: rgba(155, 175, 161, 0.6);
}
.iw-bh-rat-sources .rat-cite-kind.verified { background: #2f8f4f; }
.iw-bh-rat-sources .rat-cite-kind.ecosystem { background: rgba(197, 181, 154, 0.85); }
.iw-bh-rat-sources .rat-cite-conf { color: var(--text-faint); }

/* ============================================================
   Workspace: Knowledge search summary (6-plane, mirrors Source insight)
   ============================================================ */
.iw-knowledge-search {
  padding: 10px 12px;
  background: rgba(239, 234, 217, 0.55);
  border: 1px solid var(--border);
  border-radius: 6px;
  margin-bottom: 14px;
  overflow: hidden;
}
.iw-ks-empty {
  font-size: 11px;
  color: var(--text-faint);
  font-style: italic;
  text-align: center;
  padding: 14px;
}
.iw-ks-top-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}
.iw-ks-coverage {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 3px;
  letter-spacing: 0.02em;
}
.iw-ks-coverage.cov-high { background: rgba(47, 143, 79, 0.15);  color: #2f8f4f; border: 1px solid rgba(47,143,79,0.3); }
.iw-ks-coverage.cov-med  { background: rgba(197, 181, 154, 0.4); color: #7a5e2a; border: 1px solid rgba(197,181,154,0.6); }
.iw-ks-coverage.cov-low  { background: rgba(176, 60, 60, 0.15);  color: #b03c3c; border: 1px solid rgba(176,60,60,0.3); }
.iw-ks-split {
  display: flex;
  height: 18px;
  border-radius: 3px;
  overflow: hidden;
  border: 1px solid var(--border);
}
.iw-ks-split-int,
.iw-ks-split-ext {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  color: #fff;
  min-width: 0;
}
.iw-ks-split-int { background: rgba(44, 74, 107, 0.8); }
.iw-ks-split-ext { background: rgba(155, 175, 161, 0.85); color: #1f3a2a; }
.iw-ks-split-int span,
.iw-ks-split-ext span {
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 4px;
}
.iw-ks-counts {
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--text-faint);
  text-align: right;
}

.iw-ks-side-label {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 4px;
  margin-bottom: 3px;
}
.iw-ks-side {
  font-family: var(--sans);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
  padding: 0 4px;
}
.iw-ks-side-int { border-left: 2px solid rgba(44, 74, 107, 0.6); }
.iw-ks-side-ext { border-left: 2px solid rgba(155, 175, 161, 0.7); }

.iw-ks-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 6px;
}
@media (max-width: 1280px) { .iw-ks-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px)  { .iw-ks-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.iw-ks-cell {
  min-width: 0;
  padding: 5px 7px;
  background: rgba(255,255,255,0.55);
  border: 1px solid var(--border);
  border-radius: 3px;
}
.iw-ks-cell.iw-ks-cell-empty { opacity: 0.45; }
.iw-ks-cell-head {
  display: flex;
  align-items: center;
  gap: 3px;
  flex-wrap: wrap;
  margin-bottom: 2px;
}
.iw-ks-cell-head .ki-src-pill { font-size: 8.5px; padding: 0 5px; }
.iw-ks-count {
  font-family: var(--mono);
  font-size: 8.5px;
  color: var(--text-faint);
  font-weight: 700;
}
.iw-ks-rel {
  font-family: var(--mono);
  font-size: 8.5px;
  padding: 0 4px;
  border-radius: 2px;
  font-weight: 700;
}
.iw-ks-rel.rel-high { background: rgba(47, 143, 79, 0.18); color: #2f8f4f; }
.iw-ks-rel.rel-med  { background: rgba(197, 181, 154, 0.45); color: #7a5e2a; }
.iw-ks-rel.rel-low  { background: rgba(176, 60, 60, 0.18); color: #b03c3c; }
.iw-ks-rel.rel-none { background: transparent; color: var(--text-faint); }
.iw-ks-top {
  font-size: 9.5px;
  color: var(--text-dark);
  line-height: 1.3;
  font-family: var(--serif);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.iw-ks-best {
  margin-top: 6px;
  padding: 5px 8px;
  background: rgba(197, 181, 154, 0.18);
  border-left: 3px solid var(--gold);
  border-radius: 3px;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.iw-ks-foot {
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px dashed var(--border);
  display: flex;
  justify-content: flex-end;
}
.iw-ks-rel-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: transparent;
  border: none;
  font-family: var(--sans);
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
  cursor: pointer;
  padding: 2px 4px;
  border-radius: 3px;
  transition: color 0.12s, background 0.12s;
}
.iw-ks-rel-link:hover {
  color: var(--navy-deep);
  background: rgba(232, 220, 196, 0.5);
  text-decoration: underline;
}
.iw-ks-rel-link svg { flex-shrink: 0; }
.iw-ks-best-lab {
  font-family: var(--mono);
  font-size: 8.5px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  font-weight: 700;
  flex-shrink: 0;
}
.iw-ks-best-cite {
  font-size: 10px;
  color: var(--text-dark);
  font-family: var(--serif);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1;
}

/* Loader steps: shrink type + ensure text never sits under the check circle.
   The 22px circle is positioned at left:0; text needs to clear it with a gap. */
.loader-steps { gap: 10px; }
.loader-steps li {
  font-size: 11.5px;
  padding-left: 38px;
  min-height: 22px;
}
/* Side accents use border-image-like layout rather than border-left so they
   don't shrink padding-left and crowd the text under the check circle. */
.loader-steps li[data-side="internal"]::after,
.loader-steps li[data-side="external"]::after {
  content: "";
  position: absolute;
  left: 26px;
  top: 4px;
  bottom: 4px;
  width: 2px;
  border-radius: 2px;
}
.loader-steps li[data-side="internal"]::after { background: rgba(44, 74, 107, 0.45); }
.loader-steps li[data-side="external"]::after { background: rgba(155, 175, 161, 0.6); }
.loader-steps li.ks-skipped {
  opacity: 0.35;
  text-decoration: line-through;
  font-style: italic;
}

/* ============================================================
   Methodology view toggle + cross-source comparison matrix
   ============================================================ */
.meth-view-toggle {
  display: inline-flex;
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 2px;
  margin: 4px 0 10px;
  gap: 2px;
}
.mvt-btn {
  font-size: 10.5px;
  font-family: var(--sans);
  font-weight: 600;
  padding: 4px 12px;
  border: none;
  background: transparent;
  color: var(--text-med);
  border-radius: 3px;
  cursor: pointer;
}
.mvt-btn:hover { color: var(--navy); }
.mvt-btn.active { background: var(--navy); color: #fff; }

.methodology-matrix { margin-top: 8px; }
/* When the matrix is rendered into section C's #clusters host, strip
   the cluster-list spacing so it reads as a single contained table. */
.clusters.clusters-as-matrix { display: block; padding: 0; }
.clusters.clusters-as-matrix > .mm-head { padding: 0 2px; }
.clusters.clusters-as-matrix > .mm-scroll { margin-top: 0; }
.mm-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 8px;
  padding: 0 2px;
}
.mm-head-title {
  font-family: var(--sans);
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
}
.mm-head-sub {
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}

.mm-scroll {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 5px;
}
.mm-table {
  width: 100%;
  border-collapse: collapse;
  background: rgba(255, 255, 255, 0.4);
  font-size: 11px;
}
.mm-table th,
.mm-table td {
  border: 1px solid var(--border-soft);
  vertical-align: top;
  padding: 6px 8px;
}
.mm-corner {
  background: rgba(232, 220, 196, 0.55);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
  text-align: left;
  width: 140px;
  min-width: 140px;
}
.mm-col-head {
  background: rgba(239, 234, 217, 0.6);
  text-align: center;
  padding: 5px 4px;
  min-width: 130px;
}
.mm-col-head .ki-src-pill { font-size: 8.5px; padding: 1px 5px; }
.mm-row-head {
  background: rgba(239, 234, 217, 0.5);
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 140px;
}
.mm-stage-num {
  font-family: var(--mono);
  font-size: 9px;
  color: var(--gold);
  letter-spacing: 0.04em;
}
.mm-stage-name {
  font-family: var(--serif);
  font-size: 11.5px;
  color: var(--navy-deep);
  font-weight: 600;
  line-height: 1.25;
}

.mm-cell {
  min-width: 140px;
  max-width: 220px;
  background: rgba(255, 255, 255, 0.55);
}
.mm-cell-empty {
  text-align: center;
  color: var(--text-faint);
  font-style: italic;
  background: rgba(245, 243, 238, 0.3);
}
.mm-hit {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 5px;
  row-gap: 1px;
  padding: 4px 0;
  border-bottom: 1px dashed var(--border-soft);
  cursor: help;
}
.mm-hit:last-child { border-bottom: none; }
.mm-hit[data-rank="1"] .mm-method { color: var(--navy-deep); font-weight: 600; }
.mm-hit[data-rank="2"] .mm-method { color: var(--text-dark); }
.mm-hit[data-rank="3"] .mm-method { color: var(--text-med); }
.mm-rank {
  font-family: var(--mono);
  font-size: 8.5px;
  font-weight: 700;
  color: var(--gold);
  padding: 0 4px;
  background: rgba(197, 181, 154, 0.25);
  border-radius: 2px;
  height: fit-content;
  align-self: start;
}
.mm-method {
  font-size: 10.5px;
  line-height: 1.3;
  font-family: var(--serif);
}
.mm-src-label {
  grid-column: 2;
  font-size: 9px;
  color: var(--text-faint);
  font-family: var(--mono);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Attachment badge (workspace, above the inquiry textarea) */
.iw-attach-badge {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 8px;
  padding: 5px 9px;
  background: rgba(197, 181, 154, 0.22);
  border: 1px solid rgba(197, 181, 154, 0.55);
  border-radius: 4px;
  font-size: 11px;
  color: var(--text-dark);
}
.iw-attach-tag {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: rgba(197, 181, 154, 0.45);
  color: #7a5e2a;
  padding: 1px 6px;
  border-radius: 3px;
}
.iw-attach-name {
  font-family: var(--serif);
  font-weight: 600;
  color: var(--navy-deep);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.iw-attach-meta { font-family: var(--mono); font-size: 9.5px; color: var(--text-faint); }
.iw-attach-clear {
  margin-left: auto;
  background: transparent;
  border: none;
  font-size: 16px;
  color: var(--text-faint);
  cursor: pointer;
  line-height: 1;
  padding: 0 4px;
}
.iw-attach-clear:hover { color: var(--navy-deep); }

/* Banner inside Knowledge search panel when attachment is considered */
.iw-ks-attach-banner {
  font-size: 10.5px;
  color: var(--text-dark);
  background: rgba(197, 181, 154, 0.18);
  border-left: 3px solid var(--gold);
  border-radius: 3px;
  padding: 5px 9px;
  margin-bottom: 7px;
  line-height: 1.45;
}
.iw-ks-attach-banner code {
  font-family: var(--mono);
  font-size: 10px;
  background: rgba(255,255,255,0.55);
  padding: 1px 5px;
  border-radius: 2px;
  color: var(--navy-deep);
}
.iw-ks-attach-icon { margin-right: 4px; }

/* Add-inquiry modal: auto-extract hint banner */
.edit-extract-hint {
  margin: 0 0 12px;
  padding: 7px 10px;
  font-size: 11.5px;
  line-height: 1.5;
  background: rgba(176, 60, 60, 0.10);
  border-left: 3px solid rgba(176, 60, 60, 0.55);
  border-radius: 3px;
  color: #8a3a3a;
}
.edit-extract-hint.ok {
  background: rgba(47, 143, 79, 0.10);
  border-left-color: rgba(47, 143, 79, 0.55);
  color: #3f6a4c;
}

/* Add-inquiry modal: attach row + filename label */
.ai-attach-row { display: flex; align-items: center; gap: 8px; }
.btn-attach-mini { padding: 4px 9px; font-size: 11px; }
.ai-attach-name {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Inquiry preview · attachment block */
.iq-preview-attach {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  background: rgba(197, 181, 154, 0.18);
  border-left: 3px solid var(--gold);
  border-radius: 4px;
  font-size: 11px;
}
.iq-preview-attach .iq-attach-icon { font-size: 14px; }
.iq-preview-attach .iq-attach-name { font-family: var(--serif); font-weight: 600; color: var(--navy-deep); }
.iq-preview-attach .iq-attach-meta { font-family: var(--mono); font-size: 9.5px; color: var(--text-faint); }

/* Edit-modal form helpers: inline hint + 3-col subgrid for nested fields */
.edit-form .form-hint {
  display: block;
  font-size: 10.5px;
  font-style: italic;
  color: var(--text-faint);
  font-weight: 400;
  margin-top: 2px;
  letter-spacing: 0;
  text-transform: none;
}
.edit-subgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 6px;
}
@media (max-width: 720px) { .edit-subgrid { grid-template-columns: repeat(2, 1fr); } }
.edit-subgrid .edit-sub {
  display: flex;
  flex-direction: column;
  font-size: 10.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
  gap: 3px;
}
.edit-subgrid .edit-sub input,
.edit-subgrid .edit-sub select {
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 3px;
  background: rgba(255,255,255,0.7);
  color: var(--text-dark);
}
.edit-subgrid .edit-sub input[type="checkbox"] {
  width: 14px; height: 14px;
  align-self: flex-start;
}

/* Custom search parameters: add + re-search section under Extracted fields */
.ext-custom-section {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--border);
}
.ext-custom-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin-bottom: 6px;
}
.ext-custom-label {
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
  font-family: var(--sans);
}
.ext-custom-list {
  list-style: none;
  margin: 0 0 8px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ext-custom-empty {
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
  padding: 3px 0;
}
.ext-custom-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto;
  gap: 8px;
  align-items: center;
  padding: 4px 8px;
  background: rgba(197, 181, 154, 0.18);
  border: 1px solid rgba(197, 181, 154, 0.5);
  border-radius: 3px;
  font-size: 11px;
}
.ext-custom-val {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--text-dark);
}
.ext-custom-remove {
  background: transparent;
  border: none;
  font-size: 15px;
  color: var(--text-faint);
  cursor: pointer;
  line-height: 1;
  padding: 0 4px;
}
.ext-custom-remove:hover { color: var(--navy-deep); }

#btnReSearch {
  margin-top: 4px;
  width: 100%;
}

/* User-added field on the extracted list shows a small 'user' pill */
.ext-list .pill {
  display: inline-block;
  margin-left: 6px;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 2px;
  background: rgba(197, 181, 154, 0.5);
  color: #7a5e2a;
}

/* File attach button + filename indicator (workspace inquiry actions) */
.iq-file-input { display: none; }
.btn-attach {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}
.btn-attach svg { flex-shrink: 0; }

/* Knowledge workspace .inquiry-actions row: enforce identical height
   across the <label class="btn-attach"> and the sibling <button class
   ="btn-primary"> so the Attach file + Re-run search controls line up
   visually. The primary button override at line ~7587 removes its
   default border, which would otherwise leave it 2px shorter than the
   ghost outline. Setting box-sizing + explicit height neutralises
   that mismatch. */
.inquiry-actions .btn {
  height: 36px;
  padding: 0 16px;
  line-height: 1;
  box-sizing: border-box;
}
.iq-file-name {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-faint);
  align-self: center;
  max-width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.inquiry-actions { flex-wrap: wrap; }

/* Knowledge source toggle panel (workspace, before Process) */
.ks-toggle-panel {
  margin: 8px 0 10px;
  padding: 8px 10px;
  background: rgba(239, 234, 217, 0.5);
  border: 1px solid var(--border);
  border-radius: 5px;
}
.ks-toggle-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 6px;
}
.ks-toggle-title {
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
  font-family: var(--sans);
}
.ks-toggle-sub { font-size: 10px; color: var(--text-faint); font-style: italic; }

.ks-toggle-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}
.ks-toggle-row:last-child { margin-bottom: 0; }
.ks-toggle-group {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--text-faint);
  min-width: 60px;
  padding-right: 6px;
  border-right: 1px solid var(--border-soft);
}
.ks-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  padding: 2px;
  border-radius: 3px;
}
.ks-toggle input[type="checkbox"] {
  width: 13px; height: 13px;
  accent-color: var(--navy);
  margin: 0;
}
.ks-toggle:hover { background: rgba(255,255,255,0.5); }
.ks-toggle input:not(:checked) ~ .ki-src-pill {
  opacity: 0.4;
  text-decoration: line-through;
}

/* Knowledge search summary: skipped cell variant */
.iw-ks-cell.iw-ks-cell-skipped {
  opacity: 0.45;
  background: repeating-linear-gradient(
    45deg,
    rgba(255,255,255,0.4),
    rgba(255,255,255,0.4) 4px,
    rgba(220,210,180,0.3) 4px,
    rgba(220,210,180,0.3) 8px
  );
}
.iw-ks-cell.iw-ks-cell-skipped .iw-ks-top { font-style: italic; color: var(--text-faint); }

/* Projects page foot note (after removing the archive placeholder) */
.page-foot-note {
  font-size: 11px;
  color: var(--text-faint);
  font-style: italic;
  margin-top: 14px;
  padding-left: 4px;
}
.page-foot-note a { color: var(--gold); text-decoration: none; border-bottom: 1px dashed var(--gold-soft); }
.page-foot-note a:hover { color: var(--navy); border-bottom-color: var(--navy); }

/* ============================================================
   Knowledge tracking: Source insight (internal vs external)
   ============================================================ */
.si-split-card {
  margin-bottom: 18px;
  padding: 12px 14px;
  background: rgba(239, 234, 217, 0.5);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.si-split-bar {
  display: flex;
  height: 56px;
  border-radius: 5px;
  overflow: hidden;
  border: 1px solid var(--border);
  margin-bottom: 14px;
}
.si-split-int,
.si-split-ext {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 6px 14px;
  color: #fff;
  transition: width 0.3s;
  min-width: 0;
}
.si-split-int { background: rgba(44, 74, 107, 0.85); }
.si-split-ext { background: rgba(155, 175, 161, 0.85); color: #1f3a2a; }
.si-split-lab {
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 700;
  opacity: 0.85;
}
.si-split-val {
  font-family: var(--mono);
  font-size: 11px;
  opacity: 0.95;
}
.si-split-pct {
  font-family: var(--serif);
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  margin-top: 2px;
}

.si-side-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 900px) { .si-side-grid { grid-template-columns: 1fr; } }

.si-side {
  padding: 9px 11px;
  background: rgba(255,255,255,0.5);
  border: 1px solid var(--border);
  border-radius: 5px;
}
.si-side-int { border-left: 3px solid rgba(44, 74, 107, 0.6); }
.si-side-ext { border-left: 3px solid rgba(155, 175, 161, 0.7); }
.si-side-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 7px;
  padding-bottom: 5px;
  border-bottom: 1px solid var(--border-soft);
}
.si-side-name {
  font-family: var(--sans);
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--navy-deep);
}
.si-side-meta { font-size: 9.5px; color: var(--text-faint); font-family: var(--mono); }

.si-sub-row {
  display: grid;
  grid-template-columns: 130px 1fr 110px;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.si-sub-row:last-child { margin-bottom: 0; }
.si-sub-bar {
  position: relative;
  height: 10px;
  background: rgba(255,255,255,0.5);
  border: 1px solid var(--border);
  border-radius: 3px;
  overflow: hidden;
}
.si-sub-fill { height: 100%; }
.si-sub-fill.src-past-projects      { background: rgba(44, 74, 107, 0.65); }
.si-sub-fill.src-similar-inquiry    { background: rgba(44, 74, 107, 0.4); }
.si-sub-fill.src-internal-knowledge { background: rgba(155, 175, 161, 0.55); }
.si-sub-fill.src-sense-library      { background: rgba(197, 181, 154, 0.55); }
.si-sub-fill.src-literature         { background: rgba(155, 175, 161, 0.8); }
.si-sub-fill.src-supplier-notes     { background: rgba(197, 181, 154, 0.85); }
.si-sub-meta { font-family: var(--mono); font-size: 9.5px; color: var(--text-faint); text-align: right; }

/* Best-suggestion winner card */
.si-winner-card {
  margin-bottom: 16px;
  padding: 10px 12px;
  background: rgba(239, 234, 217, 0.5);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.si-winner-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}
.si-winner-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 8px;
  background: rgba(255,255,255,0.7);
  border: 1px solid var(--border);
  border-radius: 4px;
}
.si-winner-count {
  font-family: var(--serif);
  font-size: 14px;
  font-weight: 700;
  color: var(--navy-deep);
  line-height: 1;
}
.si-winner-empty {
  font-size: 10.5px;
  color: var(--text-faint);
  font-style: italic;
}

/* Per-inquiry split rows */
.si-inq-section { margin-top: 4px; }
.si-inq-list { display: flex; flex-direction: column; gap: 6px; }
.si-inq-row {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 200px 100px;
  align-items: center;
  gap: 12px;
  padding: 7px 10px;
  background: rgba(255,255,255,0.55);
  border: 1px solid var(--border);
  border-left-width: 3px;
  border-radius: 4px;
}
.si-inq-row .si-inq-best {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  padding-top: 5px;
  border-top: 1px dashed var(--border);
  min-width: 0;
}
.si-best-lab {
  font-family: var(--mono);
  font-size: 8.5px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  font-weight: 700;
}
.si-best-cite {
  font-size: 9.5px;
  color: var(--text-med);
  font-family: var(--serif);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1;
}
.si-inq-row.lean-internal  { border-left-color: rgba(44, 74, 107, 0.75); }
.si-inq-row.lean-external  { border-left-color: rgba(155, 175, 161, 0.85); }
.si-inq-row.lean-balanced  { border-left-color: rgba(197, 181, 154, 0.85); }
.si-inq-info {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}
.si-inq-title {
  font-size: 11.5px;
  color: var(--navy-deep);
  font-weight: 600;
  font-family: var(--serif);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1;
}
.si-inq-lean {
  font-family: var(--mono);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 3px;
  flex-shrink: 0;
}
.lean-internal .si-inq-lean { background: rgba(44, 74, 107, 0.15); color: var(--navy-deep); }
.lean-external .si-inq-lean { background: rgba(155, 175, 161, 0.3); color: #3f5e4d; }
.lean-balanced .si-inq-lean { background: rgba(197, 181, 154, 0.4); color: #7a5e2a; }

.si-inq-bar {
  display: flex;
  height: 18px;
  border-radius: 3px;
  overflow: hidden;
  border: 1px solid var(--border);
}
.si-inq-int,
.si-inq-ext {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  color: #fff;
  min-width: 0;
}
.si-inq-int { background: rgba(44, 74, 107, 0.8); }
.si-inq-ext { background: rgba(155, 175, 161, 0.85); color: #1f3a2a; }
.si-inq-int span,
.si-inq-ext span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 4px; }
.si-inq-counts {
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--text-faint);
  text-align: right;
}

/* ============================================================
   Knowledge tracking: Captured library grouped by category
   ============================================================ */
.cl-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 12px;
  padding: 0 2px;
}
.cl-head-count {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-faint);
  font-weight: 700;
}
.cl-head-note { font-size: 11px; color: var(--text-faint); font-style: italic; }

.cl-group {
  margin-bottom: 14px;
  padding: 10px 12px;
  background: rgba(239, 234, 217, 0.5);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.cl-group-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border-soft);
}
.cl-group-count {
  font-family: var(--mono);
  font-size: 9.5px;
  color: var(--text-faint);
  margin-left: auto;
  letter-spacing: 0.02em;
}

.cl-list { list-style: none; display: flex; flex-direction: column; gap: 5px; padding: 0; margin: 0; }
.cl-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 7px 10px;
  background: rgba(255,255,255,0.55);
  border: 1px solid var(--border);
  border-radius: 4px;
}
.cl-row:hover { background: rgba(232, 220, 196, 0.7); border-color: var(--gold); }
.cl-main { min-width: 0; }
.cl-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--navy-deep);
  font-family: var(--serif);
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cl-desc {
  font-size: 10.5px;
  color: var(--text-med);
  line-height: 1.4;
  margin-bottom: 3px;
}
.cl-meta { font-size: 9.5px; color: var(--text-faint); }
.cl-meta b { color: var(--navy-deep); font-weight: 600; }
.cl-stats { text-align: center; flex-shrink: 0; min-width: 50px; }
.cl-cited-val {
  display: block;
  font-family: var(--serif);
  font-size: 16px;
  font-weight: 700;
  color: var(--navy-deep);
  line-height: 1;
}
.cl-cited-lab {
  display: block;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-faint);
  font-weight: 700;
  margin-top: 2px;
}

/* ============================================================
   Knowledge activity card: tabs nested inside the card now
   ============================================================ */
.knowledge-activity-card .knowledge-tabs {
  margin: 6px 0 12px;
  width: fit-content;
}
.knowledge-activity-card .ktab {
  font-size: 11.5px;
  padding: 5px 12px;
  letter-spacing: 0.02em;
}
.knowledge-activity-card .knowledge-panel {
  gap: 14px;
}

/* Truncate long titles + single-line meta */
.home-status-card .sp-title,
.sp-row-list .sp-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.home-status-card .sp-meta,
.sp-row-list .sp-meta {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-wrap: nowrap;
}

/* ============================================================
   Workspace compact mode (text-rich Technical assessment page)
   Shrinks card text + paddings so the surrounding whitespace
   breathes better. Targets only the inquiry workspace results
   pane; other pages are untouched.
   ============================================================ */
.iw-results .iw-head-output h2 { font-size: 18px; }
.iw-results .iw-head-output { padding-top: 14px; padding-bottom: 10px; margin-bottom: 12px; }

.iw-results .output-frame {
  padding: 16px 18px;
  background: var(--paper);
}

/* Audit summary: lighter card, more breathing room around it */
.iw-results .audit-summary {
  margin: 0 0 18px;
  padding: 10px 12px;
}
.iw-results .audit-head { margin-bottom: 7px; padding-bottom: 5px; gap: 8px; }
.iw-results .audit-head h4 { font-size: 12.5px; }
.iw-results .audit-sub { font-size: 10.5px; }
.iw-results .audit-textarea { min-height: 86px; font-size: 11px; padding: 8px 10px; line-height: 1.5; }
.iw-results .audit-status { font-size: 9.5px; }

/* Methodology + risk screening cards: less padding, smaller body */
.iw-results .methodology-risk-screen { gap: 8px; margin: 0 0 16px; padding-bottom: 0; border-bottom: none; }
.iw-results .mrs-card { padding: 8px 10px; }
.iw-results .mrs-card-head { margin-bottom: 4px; gap: 6px; }
.iw-results .mrs-eyebrow { font-size: 9px; }
.iw-results .mrs-pick { margin-bottom: 3px; gap: 6px; }
.iw-results .mrs-stage { font-size: 10.5px; }
.iw-results .mrs-citation { font-size: 11.5px; margin-bottom: 3px; line-height: 1.35; }
.iw-results .mrs-rationale { font-size: 10px; line-height: 1.45; }
.iw-results .mrs-risk-row { padding: 4px 7px; }
.iw-results .mrs-risk-name { font-size: 10.5px; }
.iw-results .mrs-risk-why { font-size: 9.5px; }
.iw-results .mrs-risk-clean { font-size: 10px; }

/* Stage tabs + per-stage suggestions */
.iw-results .methodology-tabs { padding: 4px 0 10px; margin-bottom: 12px; gap: 3px; }
.iw-results .meth-tab { padding: 5px 9px; min-width: 110px; }
.iw-results .meth-tab-num { font-size: 9px; }
.iw-results .meth-tab-label { font-size: 11px; }

.iw-results .meth-stage-head { margin-bottom: 8px; }
.iw-results .meth-stage-head h4 { font-size: 13px; }
.iw-results .meth-stage-note { font-size: 10.5px; }
.iw-results .meth-suggestions { gap: 8px; }
.iw-results .meth-suggestion { padding: 10px 12px; gap: 10px; }
.iw-results .meth-rank { font-size: 10px; min-width: 22px; height: 22px; }
.iw-results .meth-title { font-size: 12px; line-height: 1.35; }
.iw-results .meth-summary { font-size: 10.5px; line-height: 1.5; }
.iw-results .meth-actions { gap: 6px; margin-top: 6px; }
.iw-results .meth-btn { font-size: 10px; padding: 2px 7px; }
.iw-results .meth-suggestion-dim {
  opacity: 0.55;
  background: rgba(239, 234, 217, 0.35);
}
.iw-results .meth-suggestion-dim .meth-no-source {
  color: var(--text-faint);
  font-style: italic;
  font-size: 10.5px;
}

/* Output body (plain-text fallback) */
.iw-results .output-body { padding: 14px 16px; font-size: 12px; line-height: 1.6; }
.iw-results .output-meta { font-size: 10px; margin-bottom: 8px; }

/* Knowledge matrix sub-section: integrated inside the Technical assessment.
   Styled as a prominent pill-shaped toggle so reviewers spot it easily. */
.iw-results .iw-cmp-inline {
  margin-top: 18px;
  padding-top: 0;
  border-top: none;
  border-bottom: none;
}
.iw-results .iw-cmp-inline .iw-cmp-summary {
  padding: 10px 14px;
  gap: 10px;
  border: 1px solid var(--gold-soft);
  border-left: 3px solid var(--gold);
  background: rgba(196, 160, 76, 0.12);
  border-radius: 5px;
  transition: background 0.15s, border-color 0.15s;
}
.iw-results .iw-cmp-inline .iw-cmp-summary:hover {
  background: rgba(196, 160, 76, 0.18);
  border-color: var(--gold);
}
.iw-results .iw-cmp-inline[open] .iw-cmp-summary {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  background: rgba(196, 160, 76, 0.18);
  border-color: var(--gold);
}
.iw-results .iw-cmp-inline .iw-cmp-caret {
  font-size: 13px;
  color: var(--gold);
}
.iw-results .iw-cmp-inline .iw-cmp-title {
  font-family: var(--serif);
  font-size: 13.5px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--navy-deep);
  font-weight: 700;
}
.iw-results .iw-cmp-inline .iw-cmp-sub {
  font-size: 11px;
  color: var(--text-med);
}
.iw-results .iw-cmp-inline .iw-cmp-body {
  padding: 14px 14px 10px;
  border: 1px solid var(--gold-soft);
  border-top: none;
  border-radius: 0 0 5px 5px;
  background: #fff;
}

/* ============================================================
   Sense Lab refresh (Moneybird-style overlay)
   Lighter palette + softer surfaces + breathier spacing +
   drag-and-drop affordances for inquiry rows. Layered on top of
   the commercial Sense 2026 token set so we can revert by
   removing this block.
   ============================================================ */
:root {
  /* Brand palette — matches home.drsleelifesciences.com
     Warm paper + navy + gold + sage. Token names kept (--lab-*) to
     avoid sweeping every downstream rule; only the values change. */
  --lab-bg:        #F5F3EE;   /* paper — warm body bg */
  --lab-surface:   #FFFFFF;   /* card surface */
  --lab-tint:      #EFEAD9;   /* paper-soft tint */
  --lab-tint-2:    #E8DCC4;   /* cream */
  --lab-border:    #E5DFD0;   /* warm border */
  --lab-border-soft: #EFEAD9;

  /* Brand accents — navy primary, gold action, sage secondary, warm coral emphasis */
  --lab-sky:       #E0E6EC;   /* navy tint (light, backgrounds) */
  --lab-sky-deep:  #2C4A6B;   /* navy — primary accent */
  --lab-sage:      #DDE5DC;   /* sage tint */
  --lab-sage-deep: #5C7B65;   /* sage — confirms / confidence */
  --lab-coral:     #F0DCD0;   /* warm coral tint */
  --lab-coral-deep:#C77E5A;   /* accent-warm — emphasis */
  --lab-gold:      #C5B59A;   /* gold — secondary accent */
  --lab-gold-soft: #D6C9B0;
  --lab-navy-deep: #1F3550;

  /* Inter-first sans + Fraunces serif (both loaded from Google Fonts) */
  --sans-lab:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --serif-lab: "Fraunces", Georgia, "Times New Roman", serif;
}

html, body {
  background: var(--lab-bg);
  font-family: var(--sans-lab);
  font-feature-settings: "cv11", "ss01";
  line-height: 1.6;
}

/* Topbar lighter, less border */
.topbar {
  background: var(--lab-surface);
  border-bottom: 1px solid var(--lab-border-soft);
}

/* Brand wordmark — Sense Lab reads as one word, lighter weight */
.brand-name {
  font-family: var(--sans-lab);
  font-weight: 500;
  letter-spacing: -0.01em;
}
.brand-year {
  font-weight: 400;
  color: var(--lab-sky-deep);
  margin-left: 4px;
}

/* Sidebar nav — fewer borders, softer hover */
.sidebar { background: var(--lab-bg); border-right: 1px solid var(--lab-border-soft); }
.nav-item { color: var(--text-med); border-radius: 7px; padding: 9px 12px; transition: background 0.12s ease; }
.nav-item:hover { background: var(--lab-tint); color: var(--lab-sky-deep); }
.nav-item.active { background: var(--lab-sky); color: var(--lab-sky-deep); font-weight: 500; }
.nav-item.active .nav-glyph { color: var(--lab-sky-deep); }

/* Card surfaces lighter, looser */
.kpi-card, .iq-card, .ip-card, .tools-card,
.iw-pane, .ta-card, .mrs-card {
  background: var(--lab-surface);
  border: 1px solid var(--lab-border);
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(74, 111, 165, 0.04);
}

/* Section headers — friendlier */
.page-head h1 { font-weight: 600; letter-spacing: -0.015em; }
.page-sub { color: var(--text-light); }

/* Inquiry rows — draggable scaffold (Moneybird-style) */
.sp-row,
.status-pending .sp-row,
.ip-row,
.iq-row {
  cursor: grab;
  border-radius: 8px;
  transition: background 0.12s ease, border-color 0.12s ease, transform 0.08s ease;
}
.sp-row:active,
.status-pending .sp-row:active,
.ip-row:active,
.iq-row:active { cursor: grabbing; }
.sp-row[draggable="true"]:hover,
.ip-row[draggable="true"]:hover,
.iq-row[draggable="true"]:hover {
  border-color: var(--lab-sky);
  background: var(--lab-tint);
}
.sp-row.dragging,
.ip-row.dragging,
.iq-row.dragging {
  opacity: 0.55;
  transform: scale(0.99);
  border-color: var(--lab-sky-deep);
}
/* Drop zone strip (Inquiries page top). Three actions:
   Open in workspace · Defer · Do-not-process. Highlights on
   dragover and accepts the dragged inquiry row via data-action. */
.dz-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 20px;
}
.drop-zone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border: 1.5px dashed var(--lab-border);
  border-radius: 10px;
  padding: 16px 14px;
  background: var(--lab-tint);
  color: var(--text-light);
  font-weight: 500;
  text-align: center;
  transition: all 0.15s ease;
  user-select: none;
}
.drop-zone .dz-icon {
  font-size: 22px;
  line-height: 1;
  color: var(--lab-sky-deep);
}
.drop-zone .dz-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
}
.drop-zone .dz-hint {
  font-size: 11px;
  color: var(--text-faint);
}
.drop-zone.drag-over {
  border-color: var(--lab-sky-deep);
  background: var(--lab-sky);
  color: var(--lab-sky-deep);
  transform: scale(1.01);
}
.drop-zone.drag-over .dz-hint { color: var(--lab-sky-deep); }
.drop-zone.dropped { animation: dzPulse 0.4s ease; }
@keyframes dzPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.03); background: var(--lab-sage); border-color: var(--lab-sage-deep); }
}

/* Drop toast (transient confirmation) */
.dz-toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--navy-deep);
  color: var(--lab-bg);
  padding: 10px 18px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  box-shadow: 0 8px 20px rgba(31, 53, 80, 0.22);
  z-index: 9999;
  opacity: 0;
  transition: opacity 0.2s ease, transform 0.2s ease;
  pointer-events: none;
}
.dz-toast.show { opacity: 1; transform: translateX(-50%) translateY(-4px); }

/* Buttons — softer */
.btn-primary {
  background: var(--lab-sky-deep);
  border-color: var(--lab-sky-deep);
  border-radius: 7px;
}
.btn-primary:hover { background: #3D5E8F; border-color: #3D5E8F; }
.btn-ghost { border-radius: 7px; }

/* Chips — pill-style, softer */
.chip, .iq-tag, .iq-stage {
  border-radius: 999px;
  font-weight: 500;
}

/* Modal — lighter chrome */
.modal-overlay { background: rgba(31, 53, 80, 0.22); }
.modal {
  background: var(--lab-surface);
  border: 1px solid var(--lab-border);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(31, 53, 80, 0.18);
}

/* ============================================================
   Sense Lab plan tier UI (freemium PLG scaffold)
   ============================================================ */

/* Editable lab name (replaces the commercial customer slot).
   Borderless until hover/focus, so it looks like running text but
   the user discovers it's editable on hover. */
.for-block { display: inline-flex; align-items: baseline; gap: 6px; }
.for-label {
  color: var(--text-medium);
  font-size: 12px;
  font-weight: 600;
  text-transform: lowercase;
  letter-spacing: 0.02em;
}
.lab-name-input {
  background: transparent;
  border: 1px solid transparent;
  border-radius: 7px;
  padding: 4px 8px;
  font-family: var(--sans-lab);
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
  letter-spacing: -0.005em;
  min-width: 90px;
  max-width: 260px;
  width: 11ch;
  transition: background 0.12s ease, border-color 0.12s ease;
}
.lab-name-input:hover { background: var(--lab-tint); border-color: var(--lab-border-soft); }
.lab-name-input:focus { background: var(--lab-surface); border-color: var(--lab-sky); outline: none; }

/* Plan chip + dropdown */
.user-area { position: relative; display: flex; align-items: center; gap: 10px; }

.plan-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 12px;
  background: var(--lab-tint);
  border: 1px solid var(--lab-border);
  border-radius: 999px;
  font-family: var(--sans-lab);
  font-size: 12px;
  font-weight: 600;
  color: var(--text-dark);
  cursor: pointer;
  transition: background 0.12s ease, border-color 0.12s ease;
}
.plan-chip:hover { background: var(--lab-tint-2); border-color: var(--lab-sky); }
.plan-chip-static {
  cursor: default;
  user-select: none;
}
.plan-chip-static:hover {
  background: var(--lab-tint);
  border-color: var(--lab-border);
}
.plan-chip-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--text-faint); }
.plan-chip[data-plan="free"] .plan-chip-dot      { background: var(--text-faint); }
.plan-chip[data-plan="lab"] .plan-chip-dot       { background: var(--lab-sky-deep); }
.plan-chip[data-plan="institute"] .plan-chip-dot { background: var(--lab-sage-deep); }
.plan-chip-caret { color: var(--text-light); font-size: 10px; margin-left: 2px; }

.plan-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 100px;
  min-width: 360px;
  background: var(--lab-surface);
  border: 1px solid var(--lab-border);
  border-radius: 10px;
  box-shadow: 0 12px 24px rgba(31, 53, 80, 0.12);
  padding: 8px 0;
  z-index: 800;
}
.plan-dd-head {
  padding: 6px 14px 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--text-faint);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.plan-dd-item {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  width: 100%;
  padding: 9px 14px;
  background: transparent;
  border: none;
  font-family: var(--sans-lab);
  font-size: 12px;
  text-align: left;
  color: var(--text-dark);
  cursor: pointer;
  line-height: 1.45;
}
.plan-dd-item:hover { background: var(--lab-tint); }
.plan-dd-item.active { background: var(--lab-tint-2); }
.plan-dd-item b { font-weight: 600; }
.plan-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-top: 5px; flex-shrink: 0; }
.plan-dot-free      { background: var(--text-faint); }
.plan-dot-lab       { background: var(--lab-sky-deep); }
.plan-dot-institute { background: var(--lab-sage-deep); }
.plan-dd-foot {
  padding: 8px 14px 4px;
  border-top: 1px solid var(--lab-border-soft);
  margin-top: 4px;
  font-size: 11px;
  color: var(--text-faint);
}

/* Upgrade card (rendered in place of a gated page) */
.upgrade-shell {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px 24px;
  min-height: 360px;
}
.upgrade-card {
  max-width: 540px;
  width: 100%;
  background: var(--lab-surface);
  border: 1px solid var(--lab-border);
  border-radius: 14px;
  padding: 32px 32px 28px;
  box-shadow: 0 4px 12px rgba(74, 111, 165, 0.06);
}
.upgrade-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.upgrade-lock {
  font-size: 18px;
  filter: grayscale(0.3);
}
.upgrade-required-pill {
  display: inline-block;
  padding: 3px 10px;
  background: var(--lab-sky);
  color: var(--lab-sky-deep);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.upgrade-card-title {
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--text-dark);
  margin-bottom: 8px;
}
.upgrade-card-sub {
  color: var(--text-light);
  font-size: 13px;
  margin-bottom: 14px;
}
.upgrade-card-bullets {
  list-style: none;
  padding: 0;
  margin: 0 0 22px;
}
.upgrade-card-bullets li {
  padding: 7px 0 7px 22px;
  position: relative;
  font-size: 13px;
  color: var(--text-dark);
  line-height: 1.5;
}
.upgrade-card-bullets li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 7px;
  color: var(--lab-sage-deep);
  font-weight: 600;
}
.upgrade-card-cta { display: flex; gap: 10px; align-items: center; }
.upgrade-card-cta .btn { flex: 0 0 auto; }
.upgrade-card-foot {
  margin-top: 18px;
  font-size: 11px;
  color: var(--text-faint);
  border-top: 1px solid var(--lab-border-soft);
  padding-top: 12px;
}

/* Body-level plan attribute lets us hide / style nav items + CTAs
   conditionally without per-element JS.

   Free tier (Bio Google) hides collaboration / governance surfaces
   entirely from the sidebar — they are still bookmarkable URLs that
   render the upgrade card, but a researcher landing for the first
   time should not see them as visual noise. */
body[data-plan="free"] .nav-item[data-route="inquiries"],
body[data-plan="free"] .nav-item[data-route="quotes"],
body[data-plan="free"] .nav-item[data-route="approvals"],
body[data-plan="free"] .nav-item[data-route="activitylog"] {
  display: none;
}

/* Free tier inside Library: hide the Gap radar tab (lab-wide knowledge
   gap diagnostic). Vendor-curated SOP browsing stays available. */
body[data-plan="free"] .ktab[data-tab="gapradar"] {
  display: none;
}

/* Free tier = LLM-like single-page UX.
   Drops the entire sidebar so the only surface is Ask SARA. Lab+ users
   still see the full nav (handled by the absence of this override). */
body[data-plan="free"] .sidebar {
  display: none;
}
body[data-plan="free"] .shell {
  grid-template-columns: 1fr;
}
/* Hide the sidebar toggle in the topbar on Free too — nothing to toggle. */
body[data-plan="free"] .nav-toggle {
  display: none;
}
/* Free topbar reduces to just the user area (plan chip + avatar)
   on the right. No brand wordmark, no lab name slot. LLM-clean. */
body[data-plan="free"] .brand-block,
body[data-plan="free"] .for-block {
  display: none;
}
body[data-plan="free"] .topbar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
/* Free has no need for the floating chat fab — SARA is the whole page. */
body[data-plan="free"] .chat-fab,
body[data-plan="free"] #chatFab {
  display: none !important;
}
/* Override the commercial navy .page background on Free — Ask sits
   on the same paper canvas as the topbar / body, no navy slate. */
body[data-plan="free"] .page,
body[data-plan="free"] main#page,
body[data-plan="free"] .home-head,
body[data-plan="free"] .page-head {
  background: var(--lab-bg) !important;
  padding: 0;
  border: none;
}
body[data-plan="free"] .ask-shell,
body[data-plan="free"] .ask-layout {
  background: var(--lab-bg) !important;
  border: none;
}
body[data-plan="free"] .ask-layout {
  background: transparent !important;
}
body[data-plan="free"] .ask-layout .ask-sidebar {
  background: var(--lab-tint);
}
body[data-plan="free"] .ask-layout .ask-main {
  background: var(--lab-bg);
}

/* Sense Lab drops the commercial Admin tab entirely — adjustable
   parameters live inline on the working pages instead. */
.nav-item[data-route="admin"] { display: none !important; }

/* Sense Lab simplified user block — no persona switcher.
   Drops the commercial CEO / TC / Lab manager dropdown. */
.user-block-simple {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--lab-tint);
  border: 1px solid var(--lab-border);
  color: var(--lab-sky-deep);
  font-family: var(--sans-lab);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.01em;
  cursor: default;
}
.user-avatar-simple {
  display: inline-block;
  font-size: 13px;
  line-height: 1;
}

/* SARA wordmark in Ask title — coral-deep italic (defined at ask-title block below) */

/* ============================================================
   Sense Lab Ask landing (Bio Google · Free tier)
   ============================================================ */

/* New persistent 2-pane layout, left sidebar (domain + params + footer)
   stays fixed, right main pane hosts hero + input + results. Replaces
   the old ask-shell + ask-canvas centered single-column scheme. */
.ask-layout {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  min-height: calc(100vh - var(--topbar-h, 64px));
  background: var(--lab-bg);
}
.ask-sidebar {
  background: var(--lab-tint);
  border-right: 1px solid var(--lab-border-soft);
  padding: 24px 20px 16px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: var(--topbar-h, 64px);
  align-self: start;
  max-height: calc(100vh - var(--topbar-h, 64px));
  overflow-y: auto;
}
.ask-side-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ask-side-intro {
  padding: 12px 2px 2px;
  border-top: 1px solid var(--lab-border-soft);
  margin-top: auto;
}
.ask-side-intro + .ask-side-foot {
  margin-top: -16px;
}
.ask-side-desc {
  font-size: 13px;
  line-height: 1.42;
  color: var(--text-medium);
  margin: 0;
}
.ask-side-desc + .ask-side-desc {
  margin-top: 5px;
}
.ask-side-desc b {
  color: var(--lab-coral-deep);
  font-weight: 700;
  font-family: var(--serif-lab);
  font-size: 14px;
  letter-spacing: 0.005em;
}
.ask-side-desc em {
  color: var(--text-dark);
  font-style: normal;
  font-weight: 600;
}
.ask-side-desc strong {
  color: var(--lab-sky-deep);
  font-weight: 700;
  letter-spacing: -0.005em;
}
.ask-side-desc-foot {
  color: var(--text-light) !important;
  font-size: 12.5px !important;
  font-style: italic;
}
.ask-side-desc .sense-link {
  color: var(--lab-sky-deep);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.15s ease, border-color 0.15s ease;
  white-space: nowrap;
}
.ask-side-desc .sense-link strong {
  color: inherit;
}
.ask-side-desc .sense-link svg {
  width: 9px;
  height: 9px;
  margin-left: 1px;
  vertical-align: 1px;
  opacity: 0.7;
  transition: opacity 0.15s ease;
}
.ask-side-desc .sense-link:hover,
.ask-side-desc .sense-link:focus-visible {
  color: var(--lab-coral-deep);
  border-bottom-color: currentColor;
  outline: none;
}
.ask-side-desc .sense-link:hover svg,
.ask-side-desc .sense-link:focus-visible svg {
  opacity: 1;
}
.sense-plan-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 2px;
  padding: 0;
  background: none;
  border: 0;
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--lab-sky-deep);
  cursor: pointer;
  letter-spacing: 0.01em;
  border-bottom: 1px solid transparent;
  padding-bottom: 1px;
  align-self: flex-start;
  transition: color 0.15s ease, border-color 0.15s ease;
}
.sense-plan-link:hover,
.sense-plan-link:focus-visible {
  color: var(--lab-coral-deep);
  border-bottom-color: currentColor;
  outline: none;
}
.sense-plan-link svg {
  width: 11px;
  height: 11px;
  transition: transform 0.15s ease;
}
.sense-plan-link:hover svg { transform: translateX(2px); }
.ask-side-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-medium);
  margin: 0;
}
.ask-chips-vertical {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ask-chips-vertical .ask-chip {
  text-align: left;
  padding: 8px 13px;
  font-size: 13px;
  border-radius: 8px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.ask-chip-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  color: var(--lab-sky-deep);
  opacity: 0.85;
  transition: color 0.15s ease, opacity 0.15s ease;
}
.ask-chips-vertical .ask-chip.active .ask-chip-icon {
  color: var(--lab-bg);
  opacity: 1;
}
.ask-chips-vertical .ask-chip.active {
  background: var(--lab-sky-deep);
  color: var(--lab-bg);
  border-color: var(--lab-sky-deep);
}
.ask-sidebar .ask-params-row {
  grid-template-columns: 64px 1fr;
  gap: 8px;
}
.ask-sidebar .ask-params-label {
  font-size: 10px;
  letter-spacing: 0.06em;
}
.ask-sidebar .ask-pm-chip {
  padding: 4px 9px;
  font-size: 11.5px;
}
.ask-sidebar .ask-params {
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
}
.ask-sidebar .sl-foot.ask-side-foot {
  border-top: 1px solid var(--lab-border);
  padding: 10px 4px 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 11px;
  align-items: flex-start;
  text-align: left;
}
.ask-side-intro + .sl-foot.ask-side-foot {
  margin-top: -16px;
}
.ask-side-foot .sl-foot-mark { color: var(--text-medium); }
.ask-side-foot .sl-foot-row {
  display: flex;
  align-items: baseline;
  gap: 4px;
  flex-wrap: wrap;
}
.ask-side-foot .sl-foot-note {
  margin-left: 6px;
  padding: 0;
  background: none;
  border: 0;
  font-family: inherit;
  font-size: 11px;
  color: var(--lab-sky-deep);
  cursor: pointer;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  line-height: 1.2;
  transition: color 0.15s ease;
}
.ask-side-foot .sl-foot-note:hover,
.ask-side-foot .sl-foot-note:focus-visible {
  color: var(--lab-coral-deep);
  outline: none;
}

/* Edit-note popover (SARA versioning) */
.en-modal {
  position: fixed;
  inset: 0;
  background: rgba(31, 53, 80, 0.32);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9000;
  padding: 24px;
}
.en-modal.hidden { display: none; }

/* Process mapping review modal. Opens on Process click for workflow +
   verify modes. Lists subdomain required params split into "Already in
   your inquiry" (read-only) and "To define" (toggle between Not defined
   and Ready to provide; the latter reveals an input). Ask SARA commits
   the user-supplied values and closes the modal. */
.pmap-modal {
  position: fixed;
  inset: 0;
  background: rgba(31, 53, 80, 0.36);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9000;
  padding: 24px;
}
.pmap-modal.hidden { display: none; }
.pmap-card {
  background: var(--lab-surface, #FAFAF7);
  color: var(--text-dark);
  border-radius: 12px;
  box-shadow: 0 18px 48px rgba(31, 53, 80, 0.24);
  max-width: 640px;
  width: 100%;
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--lab-border-soft);
}
.pmap-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 20px 6px;
  border-bottom: 1px solid var(--lab-border-soft);
  padding-bottom: 14px;
}
.pmap-head-meta { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pmap-head h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--lab-sky-deep);
}
.pmap-sub {
  margin: 0;
  font-size: 12.5px;
  color: var(--text-medium);
}
.pmap-close {
  background: none;
  border: none;
  font-size: 22px;
  line-height: 1;
  color: var(--text-medium);
  cursor: pointer;
  padding: 0 4px;
}
.pmap-close:hover { color: var(--lab-sky-deep); }
.pmap-intro {
  margin: 12px 20px 0;
  font-size: 12.5px;
  color: var(--text-medium);
  line-height: 1.55;
}
.pmap-body {
  flex: 1;
  overflow-y: auto;
  padding: 14px 20px 4px;
}
.pmap-section + .pmap-section { margin-top: 18px; }
.pmap-section-head {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-medium);
  margin: 0 0 8px;
}
.pmap-list {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pmap-known-row {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px dashed var(--lab-border-soft);
  font-size: 12.5px;
}
.pmap-known-row:last-child { border-bottom: none; }
.pmap-known-name {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--text-medium);
}
.pmap-known-status {
  display: inline-block;
  width: 14px;
  text-align: center;
  font-size: 11px;
}
.pmap-known-row-fixed    .pmap-known-status { color: var(--lab-sage-deep, #6E8576); }
.pmap-known-row-inferred .pmap-known-status { color: var(--lab-coral-deep); }
.pmap-known-row-inferred .pmap-known-value {
  color: var(--lab-coral-deep);
  font-style: italic;
}
.pmap-todef-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 0;
  border-bottom: 1px dashed var(--lab-border-soft);
}
.pmap-todef-row:last-child { border-bottom: none; }
.pmap-todef-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.pmap-todef-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-dark);
}
.pmap-toggle {
  display: inline-flex;
  background: var(--lab-bg);
  border: 1px solid var(--lab-border-soft);
  border-radius: 999px;
  padding: 2px;
  gap: 0;
}
.pmap-toggle-btn {
  background: none;
  border: none;
  font-size: 11px;
  font-weight: 500;
  color: var(--text-medium);
  padding: 4px 12px;
  border-radius: 999px;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.12s ease;
}
.pmap-toggle-btn.active {
  background: var(--lab-sky-deep);
  color: var(--lab-bg);
  font-weight: 600;
}
.pmap-todef-input {
  display: none;
}
.pmap-todef-row.is-ready .pmap-todef-input {
  display: block;
}
.pmap-input {
  width: 100%;
  font-family: var(--sans-lab);
  font-size: 13px;
  padding: 7px 10px;
  border: 1px solid var(--lab-border);
  border-radius: 6px;
  background: var(--lab-surface);
  color: var(--text-dark);
  outline: none;
  box-sizing: border-box;
}
.pmap-input:focus {
  border-color: var(--lab-sky-deep);
  box-shadow: 0 0 0 2px rgba(74, 111, 165, 0.15);
}
.pmap-todef-hint {
  margin: 0;
  font-size: 11.5px;
  color: var(--text-light);
  line-height: 1.45;
}
.pmap-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 14px 20px 18px;
  border-top: 1px solid var(--lab-border-soft);
}
.en-card {
  background: var(--lab-surface, #FAFAF7);
  color: var(--text-dark);
  border-radius: 12px;
  box-shadow: 0 18px 48px rgba(31, 53, 80, 0.22);
  max-width: 520px;
  width: 100%;
  max-height: 86vh;
  overflow-y: auto;
  border: 1px solid var(--lab-border-soft);
}
.en-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px 12px;
  border-bottom: 1px solid var(--lab-border-soft);
  position: sticky;
  top: 0;
  background: inherit;
}
.en-head h3 {
  margin: 0;
  font-family: var(--serif-lab);
  font-weight: 600;
  font-size: 18px;
  color: var(--lab-sky-deep);
  letter-spacing: 0.005em;
}
.en-head-ver {
  font-family: var(--sans-lab);
  font-size: 12px;
  font-weight: 600;
  color: var(--text-medium);
  margin-left: 6px;
  letter-spacing: 0.02em;
  text-transform: lowercase;
}
.en-close {
  background: none;
  border: 0;
  font-size: 22px;
  line-height: 1;
  color: var(--text-medium);
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 6px;
  transition: background 0.15s ease;
}
.en-close:hover { background: var(--lab-tint); }
.en-body { padding: 16px 22px 22px; }
.en-sec + .en-sec { margin-top: 18px; }
.en-h {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-medium);
  margin: 0 0 8px;
}
.en-sub-h {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--lab-sky-deep);
  margin: 14px 0 6px;
  letter-spacing: 0;
  text-transform: none;
}
/* When a sub-head sits directly under the section title, drop its
   top margin to match the section-title-to-content rhythm; otherwise
   the first sub-section reads as further away than the rest. */
.en-h + .en-sub-h { margin-top: 8px; }
/* Intro paragraph immediately followed by a bullet list gets a small
   gap so the list doesn't crash into the line above. */
.en-p + .en-list { margin-top: 6px; }
.en-p {
  font-size: 13px;
  line-height: 1.55;
  color: var(--text-dark);
  margin: 0;
}
.en-list {
  margin: 0;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--text-dark);
}
.en-list li + li { margin-top: 4px; }
.en-list b {
  color: var(--lab-sky-deep);
  font-weight: 600;
}
.en-link {
  color: var(--lab-sky-deep);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  transition: color 0.15s ease;
}
.en-link:hover,
.en-link:focus-visible {
  color: var(--lab-coral-deep);
  outline: none;
}
.en-sec-contact {
  background: var(--lab-tint);
  border-radius: 8px;
  padding: 12px 14px;
  border: 1px solid var(--lab-border-soft);
}
.en-sec-contact .en-h { margin-bottom: 4px; }

/* Modal view-mode switching (full edit note vs plans-only compare) */
.en-modal:not([data-view="plans"]) .en-plans-view { display: none; }
.en-modal:not([data-view="plans"]) .en-title-mode-plans { display: none; }
.en-modal[data-view="plans"] .en-full-view { display: none; }
.en-modal[data-view="plans"] .en-title-mode-full { display: none; }
.en-modal[data-view="plans"] .en-card { max-width: 720px; }

.en-plans-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.en-plan-card {
  border-radius: 10px;
  padding: 14px 16px 16px;
  display: flex;
  flex-direction: column;
  background: var(--lab-surface, #FAFAF7);
  border: 1px solid var(--lab-border-soft);
}
.en-plan-open {
  background: var(--lab-tint);
}
.en-plan-paid {
  border-color: var(--lab-sky-deep);
  box-shadow: inset 0 0 0 1px var(--lab-sky-deep);
}
.en-plan-card-head {
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--lab-border-soft);
}
.en-plan-tier {
  display: block;
  font-family: var(--serif-lab);
  font-size: 16px;
  font-weight: 600;
  color: var(--lab-sky-deep);
  letter-spacing: 0.005em;
}
.en-plan-sub {
  display: block;
  font-size: 10px;
  color: var(--text-medium);
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
}
.en-plan-base {
  font-size: 12px;
  color: var(--text-medium);
  margin: 0 0 8px;
  font-style: italic;
}
.en-plan-list {
  margin: 0;
  padding-left: 18px;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--text-dark);
}
.en-plan-list li + li { margin-top: 5px; }
.en-plan-list b {
  color: var(--lab-sky-deep);
  font-weight: 600;
}
.en-plan-foot {
  font-size: 12px;
  color: var(--text-medium);
  line-height: 1.5;
  margin: 12px 0 0;
  padding-top: 10px;
  border-top: 1px solid var(--lab-border-soft);
}
@media (max-width: 540px) {
  .en-plans-grid { grid-template-columns: 1fr; }
}

/* Open access (Free) tier: drop the user-avatar dot from the topbar */
body[data-plan="free"] #userBlockSimple { display: none; }

.ask-main {
  padding: 56px 48px 80px;
  max-width: 920px;
  width: 100%;
  margin: 0 auto;
}
@media (max-width: 880px) {
  .ask-layout { grid-template-columns: 1fr; }
  .ask-sidebar {
    position: static;
    max-height: none;
    border-right: none;
    border-bottom: 1px solid var(--lab-border-soft);
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
  }
  .ask-main { padding: 32px 20px 60px; }
}

.ask-shell {
  max-width: 1240px;
  margin: 0 auto;
  padding: 56px 32px 80px;
  background: var(--lab-bg);
}
.ask-head { margin-bottom: 28px; max-width: 720px; }
.ask-greeting {
  margin: 4px 0 0;
  font-size: 13.5px;
  color: var(--text-medium);
  line-height: 1.5;
}
.ask-greeting-stamp {
  color: var(--text-light);
  font-size: 12.5px;
  margin-left: 6px;
}
.ask-title {
  font-family: var(--serif-lab);
  font-size: 44px;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--lab-sky-deep);
  margin-bottom: 14px;
  line-height: 1.1;
  display: inline-flex;
  align-items: center;
  gap: 14px;
}

/* SARA glyph: 2x2 baduk-stone arrangement of 4 circles (2 solid + 2
   hollow diagonally), echoing the Dr. S. Lee Life Sciences node logo.
   currentColor inherits the navy brand colour. */
.sara-glyph {
  width: 0.78em;
  height: 0.78em;
  color: var(--lab-sage-deep);
  flex-shrink: 0;
  transform: translateY(-0.04em);
}
/* Breathing animation on the hero glyph: each of the four circles
   drifts diagonally outward from the centre (16, 16) and back on a
   3 s ease cycle. Identity stays intact (the 2 filled + 2 outline
   pattern doesn't change), it just reads as alive while idle.
   Scoped away from the inline sidebar variant so the small 12 px
   render stays static. */
.ask-title .sara-glyph circle:nth-child(1) {
  animation: sara-drift-tl 3s ease-in-out infinite;
}
.ask-title .sara-glyph circle:nth-child(2) {
  animation: sara-drift-tr 3s ease-in-out infinite;
}
.ask-title .sara-glyph circle:nth-child(3) {
  animation: sara-drift-bl 3s ease-in-out infinite;
}
.ask-title .sara-glyph circle:nth-child(4) {
  animation: sara-drift-br 3s ease-in-out infinite;
}
@keyframes sara-drift-tl {
  0%, 100% { transform: translate(0, 0); }
  50%      { transform: translate(-1.4px, -1.4px); }
}
@keyframes sara-drift-tr {
  0%, 100% { transform: translate(0, 0); }
  50%      { transform: translate(1.4px, -1.4px); }
}
@keyframes sara-drift-bl {
  0%, 100% { transform: translate(0, 0); }
  50%      { transform: translate(-1.4px, 1.4px); }
}
@keyframes sara-drift-br {
  0%, 100% { transform: translate(0, 0); }
  50%      { transform: translate(1.4px, 1.4px); }
}
@media (prefers-reduced-motion: reduce) {
  .ask-title .sara-glyph circle { animation: none !important; }
}
/* Inline variant used in the sidebar intro paragraph next to "SARA". */
.sara-glyph-inline {
  display: inline-block;
  width: 12px;
  height: 12px;
  color: var(--lab-sage-deep);
  vertical-align: -1px;
  margin-right: 5px;
  transform: none;
}
/* Initial-mode hero, vertically centred in the viewport. Footer is
   absolute-positioned so the centred hero ignores its height. */
.ask-shell:has(.ask-canvas-initial) {
  min-height: calc(100vh - var(--topbar-h, 64px));
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-top: 32px;
  padding-bottom: 96px;
  position: relative;
}
.ask-shell:has(.ask-canvas-initial) .ask-head {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 36px;
}
.ask-shell:has(.ask-canvas-initial) .sl-foot {
  position: absolute;
  left: 32px;
  right: 32px;
  bottom: 20px;
  margin: 0;
  border-top: 1px solid var(--lab-border-soft);
  padding-top: 18px;
}
.ask-shell:has(.ask-canvas-initial) .ask-title { font-size: 52px; }
.ask-title-mark {
  color: var(--lab-sage-deep);
  font-style: italic;
  font-weight: 500;
}
.ask-sub {
  color: var(--text-med);
  font-size: 15px;
  line-height: 1.65;
}
.ask-sub b { color: var(--text-dark); font-weight: 600; }

/* Domain chip row */
.ask-domain-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.ask-domain-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-med);
  text-transform: uppercase;
  letter-spacing: 0.07em;
}
.ask-chips {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}
.ask-chip {
  background: var(--lab-surface);
  border: 1.5px solid var(--lab-border);
  border-radius: 999px;
  padding: 8px 15px;
  font-family: var(--sans-lab);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-dark);
  cursor: pointer;
  transition: all 0.12s ease;
}
.ask-chip:hover {
  border-color: var(--lab-sky-deep);
  background: var(--lab-tint);
  color: var(--lab-sky-deep);
}
.ask-chip.active {
  background: var(--lab-sky-deep);
  border-color: var(--lab-sky-deep);
  color: var(--lab-bg);
  font-weight: 600;
}
.ask-chip.active:hover {
  background: var(--lab-navy-deep);
  border-color: var(--lab-navy-deep);
  color: var(--lab-bg);
}

/* Input block */
.ask-input-block {
  background: var(--lab-surface);
  border: 1px solid var(--lab-border);
  border-radius: 12px;
  padding: 14px 14px 12px;
  box-shadow: 0 2px 6px rgba(74, 111, 165, 0.04);
}
.ask-input {
  width: 100%;
  background: transparent;
  border: none;
  outline: none;
  resize: vertical;
  min-height: 140px;
  font-family: var(--sans-lab);
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-dark);
  padding: 4px;
}
.ask-input::placeholder {
  color: var(--text-faint);
  font-style: italic;
}
.ask-input-foot {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--lab-border-soft);
}
.ask-local-source {
  flex: 1;
  min-width: 0;
}
.ask-local-source summary {
  cursor: pointer;
  font-size: 12px;
  color: var(--text-light);
  padding: 4px 0;
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ask-local-source summary::-webkit-details-marker { display: none; }
.ask-local-source summary::before {
  content: "▸";
  font-size: 10px;
  transition: transform 0.12s ease;
}
.ask-local-source[open] summary::before { transform: rotate(90deg); }
.ask-local-summary-label { font-weight: 500; }
.ask-local-summary-hint { color: var(--text-faint); margin-left: 4px; font-weight: 400; }
.ask-local-input {
  display: block;
  width: 100%;
  margin-top: 8px;
  padding: 8px 12px;
  font-family: var(--mono);
  font-size: 12px;
  background: var(--lab-tint);
  border: 1px solid var(--lab-border);
  border-radius: 7px;
  color: var(--text-dark);
}
.ask-local-input:focus { outline: none; border-color: var(--lab-sky); background: var(--lab-surface); }
.ask-local-foot {
  margin-top: 8px;
  font-size: 11px;
  color: var(--text-faint);
  line-height: 1.5;
}
.ask-process {
  padding: 10px 22px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 7px;
  flex-shrink: 0;
}

/* File attach button — left of Process. Reads a single file the
   user wants SARA to process alongside their typed question. */
.ask-attach {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  cursor: pointer;
  font-size: 13px;
  color: var(--text-medium);
  padding: 8px 12px;
  border: 1px dashed var(--lab-border);
  border-radius: 7px;
  background: var(--lab-bg);
  transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.ask-attach:hover {
  border-color: var(--lab-sky-deep);
  color: var(--lab-sky-deep);
  background: var(--lab-tint);
}
.ask-attach-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.ask-attach-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ask-attach-label-set {
  color: var(--lab-sky-deep);
  font-weight: 600;
}

/* Multi-select source picker. Inactive chips read as "off" rather
   than "available to weight in". */
.ask-params-multi .ask-pm-chip {
  opacity: 0.45;
}
.ask-params-multi .ask-pm-chip.active {
  opacity: 1;
}

/* Draft-verification output: corrections + review-required lists */
.ask-verify-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 10px 12px;
  border-radius: 7px;
  background: var(--lab-bg);
  border: 1px solid var(--lab-border-soft);
  margin-bottom: 6px;
  list-style: none;
}
.ask-verify-correction {
  background: rgba(199, 126, 90, 0.08);
  border-color: rgba(199, 126, 90, 0.30);
}
.ask-verify-review {
  background: var(--lab-tint);
}
.ask-verify-tag {
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  padding: 3px 7px;
  border-radius: 3px;
  flex-shrink: 0;
  margin-top: 1px;
}
.ask-verify-tag-fix {
  background: var(--lab-coral-deep);
  color: #fff;
}
.ask-verify-tag-review {
  background: var(--lab-sage-deep);
  color: #fff;
}
.ask-verify-body { flex: 1; }
.ask-verify-stage {
  font-weight: 600;
  font-size: 13px;
  color: var(--lab-sky-deep);
  margin-bottom: 3px;
}
.ask-verify-note {
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--text-dark);
}
.ask-verify-sep {
  list-style: none;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-medium);
  margin: 14px 0 6px;
  padding-top: 12px;
  border-top: 1px solid var(--lab-border-soft);
}

/* Inline citation superscripts inside the answer body. Each [N] in
   the answer becomes a clickable sup that jumps to the matching
   numbered source row. */
.ask-cite {
  font-size: 0.72em;
  vertical-align: super;
  line-height: 0;
  margin-left: 1px;
  font-weight: 700;
}
.ask-cite a {
  color: var(--lab-sky-deep);
  text-decoration: none;
  padding: 0 1px;
  border-bottom: 1px solid transparent;
  transition: color 0.15s ease, border-color 0.15s ease;
}
.ask-cite a:hover,
.ask-cite a:focus-visible {
  color: var(--lab-coral-deep);
  border-bottom-color: currentColor;
  outline: none;
}
.ask-cite a::before { content: "["; }
.ask-cite a::after  { content: "]"; }

/* Numbered source row. The number sits to the left of the existing
   citation block so the user can match an inline [N] to its entry. */
.ask-source-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.ask-source-num {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--lab-tint);
  color: var(--lab-sky-deep);
  font-size: 11.5px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--lab-border);
}
.ask-source-item:target .ask-source-num {
  background: var(--lab-sky-deep);
  color: var(--lab-bg);
  border-color: var(--lab-sky-deep);
}
.ask-source-item-main { flex: 1; min-width: 0; }

/* Page-level canvas. Has two modes:
   .ask-canvas-initial  single centred column, LLM-clean hero. Output
                        column hidden, params collapsed, big airy input.
   (no modifier)        2-column after Process click. Search controls
                        on the left, results on the right. */
.ask-canvas {
  display: grid;
  grid-template-columns: minmax(0, 420px) minmax(0, 1fr);
  gap: 36px;
  align-items: start;
  padding-top: 8px;
}
.ask-canvas-initial {
  grid-template-columns: minmax(0, 720px);
  justify-content: center;
}
.ask-canvas-initial .ask-output-col { display: none; }
.ask-canvas-initial .ask-input-col { position: static; gap: 22px; }

.ask-input-col {
  display: flex;
  flex-direction: column;
  gap: 18px;
  position: sticky;
  top: 84px;
}
.ask-output-col {
  display: flex;
  flex-direction: column;
  min-height: 320px;
}
@media (max-width: 980px) {
  .ask-canvas { grid-template-columns: 1fr; gap: 24px; }
  .ask-input-col { position: static; top: auto; }
}

/* Initial-mode hero polish */
.ask-canvas-initial ~ .sl-foot { margin-top: 72px; }
.ask-canvas-initial .ask-input { min-height: 160px; font-size: 15px; }
.ask-canvas-initial .ask-input-block {
  padding: 18px 18px 14px;
  box-shadow: 0 4px 14px rgba(31, 53, 80, 0.06);
}

/* Domain chips below input read as quick-starts (Claude-style skills) */
.ask-canvas-initial .ask-domain-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.ask-canvas-initial .ask-domain-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-light);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.ask-canvas-initial .ask-chips {
  justify-content: center;
  gap: 6px;
}
.ask-canvas-initial .ask-chip {
  padding: 6px 12px;
  font-size: 12.5px;
  font-weight: 500;
  border-width: 1px;
}
.ask-canvas-initial .ask-chip.active {
  background: var(--lab-tint);
  color: var(--lab-sky-deep);
  border-color: var(--lab-sky-deep);
}

/* Collapsible Search settings (closed by default) */
.ask-params-wrap {
  border: 1px solid var(--lab-border-soft);
  background: transparent;
  border-radius: 10px;
  overflow: hidden;
}
.ask-params-summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-medium);
  background: var(--lab-tint);
  user-select: none;
}
.ask-params-summary::-webkit-details-marker { display: none; }
.ask-params-summary-glyph {
  font-size: 14px;
  color: var(--lab-sky-deep);
}
.ask-params-summary-hint {
  margin-left: auto;
  font-size: 11px;
  color: var(--text-light);
  font-weight: 400;
}
.ask-params-wrap[open] .ask-params-summary {
  border-bottom: 1px solid var(--lab-border-soft);
}
.ask-params-wrap .ask-params {
  margin: 0;
  border-radius: 0;
  border: none;
  background: var(--lab-surface);
}
.ask-canvas-initial .ask-params-wrap { max-width: 540px; margin: 0 auto; width: 100%; }

/* Empty state in the output column (before Process click) */
.ask-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 280px;
  padding: 48px 32px;
  background: var(--lab-surface);
  border: 1.5px dashed var(--lab-border);
  border-radius: 14px;
  text-align: center;
}
.ask-empty-glyph {
  font-size: 36px;
  color: var(--lab-coral-deep);
  opacity: 0.7;
}
.ask-empty-text {
  font-size: 14px;
  color: var(--text-medium);
  line-height: 1.55;
}
.ask-empty.hidden { display: none; }

/* Page footer, version + company line. Sits under the canvas on
   the Ask shell, subtle separator above. */
.sl-foot {
  margin-top: 56px;
  padding: 20px 0 8px;
  border-top: 1px solid var(--lab-border-soft);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 12px;
  color: var(--text-light);
}
.sl-foot b {
  color: var(--text-medium);
  font-weight: 600;
  letter-spacing: -0.005em;
}
.sl-foot-mark { color: var(--text-medium); }
.sl-foot-sep { color: var(--text-faint); }
.sl-foot-version {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text-light);
  background: var(--lab-tint);
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--lab-border-soft);
}
.sl-foot-link {
  color: var(--lab-sky-deep);
  text-decoration: none;
  font-weight: 500;
}
.sl-foot-link:hover { text-decoration: underline; }

/* Results, confidence + answer at top, then 2-col grid for
   workflow (left) + sources/budget (right) */
.ask-results {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.ask-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}
.ask-side {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
@media (max-width: 880px) {
  .ask-grid { grid-template-columns: 1fr; }
}
.ask-conf-badge {
  background: var(--lab-sage);
  color: var(--lab-sage-deep);
  font-size: 11px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
  letter-spacing: 0.005em;
}
.ask-conf-note { font-size: 11.5px; color: var(--text-light); font-weight: 500; }

.ask-answer-card {
  background: var(--lab-surface);
  border: 1px solid var(--lab-border);
  border-radius: 12px;
  padding: 20px 22px;
  box-shadow: 0 1px 3px rgba(74, 111, 165, 0.04);
}
.ask-answer-head-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.ask-download-btn {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--lab-surface);
  border: 1px solid var(--lab-border);
  color: var(--lab-sky-deep);
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.ask-download-btn:hover {
  background: var(--lab-tint);
  border-color: var(--lab-sky-deep);
  color: var(--lab-sky-deep);
}
.ask-download-btn svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}

/* Confidence rationale collapsible — Sense 2026 "Why this score" parallel */
.ask-rationale {
  margin-top: 14px;
  border-top: 1px solid var(--lab-border-soft);
  padding-top: 12px;
}
.ask-rationale-summary {
  cursor: pointer;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-medium);
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ask-rationale-summary::-webkit-details-marker { display: none; }
.ask-rationale-summary::before {
  content: "▸";
  font-size: 10px;
  color: var(--lab-sky-deep);
  transition: transform 0.15s ease;
}
.ask-rationale[open] .ask-rationale-summary::before {
  transform: rotate(90deg);
}
.ask-rationale-total {
  font-size: 10.5px;
  font-weight: 500;
  color: var(--text-light);
  text-transform: none;
  letter-spacing: 0;
}
.ask-rationale-list {
  list-style: none;
  padding: 12px 0 0;
  margin: 0;
}
.ask-rationale-item {
  display: grid;
  grid-template-columns: 130px 48px 1fr;
  gap: 10px;
  padding: 6px 0;
  font-size: 12.5px;
  line-height: 1.5;
  border-bottom: 1px solid var(--lab-border-soft);
}
.ask-rationale-item:last-child { border-bottom: 0; }
.ask-rationale-factor {
  font-weight: 600;
  color: var(--lab-sky-deep);
}
.ask-rationale-score {
  font-weight: 700;
  text-align: right;
  color: var(--lab-sage-deep);
}
.ask-rationale-score[data-pos="neg"] { color: var(--lab-coral-deep); }
.ask-rationale-note {
  color: var(--text-dark);
}

/* Process mapping review card. Wraps the per-subdomain parameter
   checklist: what's fixed from inquiry, what SARA inferred from
   sources ([N] anchor), and what's still missing (with a hint on
   where to find it). Sits above the Answer card on workflow + verify
   modes; renders subdomain-only on quick mode. */
.ask-process-card {
  background: var(--lab-tint);
  border: 1px solid var(--lab-border-soft);
  border-radius: 10px;
  padding: 14px 16px 12px;
  margin-bottom: 16px;
}
.ask-process-card[hidden] { display: none; }
.ask-process-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.ask-process-head-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.ask-process-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-medium);
  margin: 0;
}
.ask-process-sub {
  font-size: 12.5px;
  color: var(--lab-sky-deep);
  margin: 0;
  font-weight: 500;
}
.ask-process-pill {
  background: var(--lab-sage-tint, #e3ebe5);
  color: var(--lab-sage-deep, #6E8576);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 3px 9px;
  border-radius: 999px;
  flex-shrink: 0;
}
.ask-process-list {
  margin: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
}
.ask-pm-row {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px dashed var(--lab-border-soft);
}
.ask-pm-row:last-child { border-bottom: none; }
.ask-pm-name {
  font-size: 12px;
  color: var(--text-medium);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 6px;
}
.ask-pm-status {
  display: inline-block;
  width: 14px;
  text-align: center;
  font-size: 11px;
  color: var(--text-light);
}
.ask-pm-row-fixed    .ask-pm-status { color: var(--lab-sage-deep, #6E8576); }
.ask-pm-row-inferred .ask-pm-status { color: var(--lab-coral-deep); }
.ask-pm-row-missing  .ask-pm-status { color: var(--lab-coral-deep); }
.ask-pm-value {
  font-size: 13px;
  color: var(--text-dark);
  margin: 0;
  line-height: 1.5;
}
.ask-pm-row-inferred .ask-pm-value {
  color: var(--lab-coral-deep);
  font-style: italic;
}
.ask-pm-row-missing .ask-pm-value {
  color: var(--text-light);
}
.ask-pm-hint {
  display: block;
  font-size: 11.5px;
  color: var(--text-light);
  font-style: normal;
  margin-top: 2px;
}
.ask-pm-missing-tag {
  display: inline-block;
  background: var(--lab-coral-tint, #f5e3da);
  color: var(--lab-coral-deep);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.07em;
  padding: 2px 7px;
  border-radius: 4px;
  vertical-align: middle;
  margin-right: 6px;
}
.ask-process-legend {
  margin: 10px 0 0;
  font-size: 10.5px;
  color: var(--text-light);
  line-height: 1.5;
}
.ask-pm-leg {
  font-weight: 600;
}
.ask-pm-leg-fixed    { color: var(--text-dark); }
.ask-pm-leg-inferred { color: var(--lab-coral-deep); font-style: italic; }
.ask-pm-leg-missing {
  background: var(--lab-coral-tint, #f5e3da);
  color: var(--lab-coral-deep);
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 9.5px;
  letter-spacing: 0.07em;
}
/* Quick mode: only the subdomain badge is meaningful; hide checklist
   + legend so the card collapses to a single-line subdomain stamp. */
.ask-process-card.ask-process-card-quick .ask-process-list,
.ask-process-card.ask-process-card-quick .ask-process-legend {
  display: none;
}
.ask-process-card.ask-process-card-quick {
  padding: 10px 14px;
  margin-bottom: 14px;
}
.ask-process-card.ask-process-card-quick .ask-process-head {
  margin-bottom: 0;
  align-items: center;
}

/* Methodology matrix toggle (Workflow design mode). Mirrors
   Sense 2026 technical-assessment Knowledge matrix:
   per-stage card with the recommended pick highlighted, plus
   alternative candidates each tagged with a reliability tier and
   anchored to a numbered source via [N]. */
.ask-matrix {
  margin-top: 14px;
  border-top: 1px solid var(--lab-border-soft);
  padding-top: 12px;
}
.ask-matrix-summary {
  cursor: pointer;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-medium);
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ask-matrix-summary::-webkit-details-marker { display: none; }
.ask-matrix-chev {
  font-size: 10px;
  color: var(--lab-sky-deep);
  transition: transform 0.15s ease;
  display: inline-block;
}
.ask-matrix[open] .ask-matrix-chev { transform: rotate(90deg); }
.ask-matrix-hint {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
  font-size: 10.5px;
  color: var(--text-light);
}
.ask-matrix-note {
  margin: 8px 0 0;
  font-size: 10.5px;
  line-height: 1.5;
  color: var(--text-light);
}
.ask-matrix-note b {
  color: var(--lab-sky-deep);
  font-weight: 600;
}
.ask-matrix-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
}
.ask-matrix-row {
  background: var(--lab-bg);
  border: 1px solid var(--lab-border-soft);
  border-radius: 8px;
  padding: 10px 12px;
}
.ask-matrix-row-head {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-medium);
  margin-bottom: 8px;
}
.ask-matrix-stage { color: var(--lab-sky-deep); }
.ask-matrix-cand {
  padding: 8px 10px;
  border-radius: 6px;
  background: var(--lab-surface);
  border: 1px solid var(--lab-border-soft);
  margin-bottom: 6px;
}
.ask-matrix-cand:last-child { margin-bottom: 0; }
.ask-matrix-cand-pick {
  background: rgba(110, 133, 118, 0.10);
  border-color: rgba(110, 133, 118, 0.35);
}
.ask-matrix-cand-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
  flex-wrap: wrap;
}
.ask-matrix-pick-tag {
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  background: var(--lab-sage-deep);
  color: #fff;
  padding: 2px 6px;
  border-radius: 3px;
}
.ask-matrix-cand-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--lab-sky-deep);
  flex: 1;
  min-width: 0;
}
.ask-matrix-tier {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 2px 7px;
  border-radius: 999px;
  text-transform: uppercase;
}
.ask-matrix-tier-strong { background: rgba(110, 133, 118, 0.18); color: var(--lab-sage-deep); }
.ask-matrix-tier-ok     { background: var(--lab-tint);          color: var(--lab-sky-deep); }
.ask-matrix-tier-weak   { background: rgba(199, 126, 90, 0.14); color: var(--lab-coral-deep); }
.ask-matrix-cand-rat {
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--text-dark);
}
.ask-matrix-src {
  color: var(--lab-sky-deep);
  font-weight: 700;
  text-decoration: none;
  margin-left: 2px;
}
.ask-matrix-src:hover { color: var(--lab-coral-deep); text-decoration: underline; }
.ask-answer-head {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-med);
  margin: 0;
}
.ask-answer-body {
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-dark);
}

.ask-section-head {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-med);
  margin-bottom: 12px;
}

/* Sources */
.ask-sources { padding: 0 4px; }
.ask-source-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.ask-source-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 14px;
  background: var(--lab-surface);
  border: 1px solid var(--lab-border-soft);
  border-radius: 8px;
}
.ask-source-item-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.ask-source-tier {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 3px 8px;
  border-radius: 4px;
  text-align: center;
}
.ask-source-tier-peer    { background: var(--lab-sage);     color: var(--lab-sage-deep); }
.ask-source-tier-vendor  { background: var(--lab-coral);    color: var(--lab-coral-deep); }
.ask-source-tier-curated { background: var(--lab-sky);      color: var(--lab-sky-deep); }
.ask-source-title {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--lab-sky-deep);
  text-decoration: none;
}
.ask-source-title:hover { text-decoration: underline; }
.ask-source-cite {
  font-size: 11px;
  color: var(--text-light);
  font-weight: 500;
}

/* Workflow */
.ask-workflow { padding: 0 4px; }
.ask-workflow-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}
.ask-workflow-domain {
  font-size: 11px;
  font-weight: 500;
  color: var(--lab-sky-deep);
  background: var(--lab-sky);
  padding: 3px 9px;
  border-radius: 999px;
  font-style: italic;
}
.ask-workflow-note { font-size: 12px; color: var(--text-faint); margin-bottom: 14px; }

.ask-workflow-stages {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ask-stage {
  display: grid;
  grid-template-columns: 28px 1fr;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  background: var(--lab-surface);
  border: 1px solid var(--lab-border-soft);
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.12s ease, border-color 0.12s ease;
}
.ask-stage:hover { background: var(--lab-tint); border-color: var(--lab-sky); }
.ask-stage-num {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text-faint);
  font-weight: 600;
  text-align: center;
  padding-top: 3px;
}
.ask-stage-body { min-width: 0; }
.ask-stage-name {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-med);
  margin-bottom: 3px;
}
.ask-stage-pick {
  font-size: 14px;
  color: var(--text-dark);
  font-weight: 500;
  line-height: 1.45;
}
.ask-stage-swap {
  font-size: 10px;
  color: var(--text-faint);
  margin-left: 4px;
}

.ask-workflow-cta {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--lab-border-soft);
}
.ask-save-btn {
  font-size: 13px;
  padding: 8px 18px;
  border-radius: 7px;
}
.ask-workflow-cta-hint { font-size: 11px; color: var(--text-faint); }

/* Ask parameter panel — visible search + scoring controls.
   Three chip rows (source mix · recency · methodology depth) above
   the textarea. Always editable on Free; weighting custom presets
   are Lab+ via Save preset. */
.ask-params {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 14px;
  padding: 14px 16px;
  background: var(--lab-tint);
  border: 1px solid var(--lab-border-soft);
  border-radius: 10px;
}
.ask-params-row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 14px;
  align-items: center;
}
.ask-params-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--text-med);
  text-transform: uppercase;
  letter-spacing: 0.07em;
}
.ask-params-chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.ask-pm-chip {
  background: var(--lab-surface);
  border: 1px solid var(--lab-border);
  border-radius: 999px;
  padding: 5px 11px;
  font-family: var(--sans-lab);
  font-size: 12px;
  font-weight: 500;
  color: var(--text-dark);
  cursor: pointer;
  transition: all 0.12s ease;
}
.ask-pm-chip:hover { border-color: var(--lab-sky-deep); color: var(--lab-sky-deep); }
.ask-pm-chip.active {
  background: var(--lab-sky-deep);
  border-color: var(--lab-sky-deep);
  color: #fff;
  font-weight: 600;
}

/* Budget estimate card on Ask results (Free-tier rough estimate).
   Calculated from the selected workflow's per-sample cost stack. */
.ask-budget {
  background: linear-gradient(180deg, var(--lab-surface) 0%, #FBFAF4 100%);
  border: 1px solid var(--lab-border);
  border-radius: 12px;
  padding: 18px 20px;
}
.ask-budget-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 14px;
}
.ask-budget-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-med);
}
.ask-budget-sub {
  font-size: 11px;
  color: var(--text-light);
  font-weight: 500;
}
.ask-budget-headline {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 6px;
}
.ask-budget-total {
  font-family: var(--sans-lab);
  font-size: 26px;
  font-weight: 700;
  color: var(--text-dark);
  letter-spacing: -0.02em;
}
.ask-budget-range {
  font-size: 13px;
  color: var(--text-light);
  font-weight: 500;
}
.ask-budget-meta {
  font-size: 13px;
  color: var(--text-med);
  margin-bottom: 14px;
}
.ask-budget-meta b { color: var(--text-dark); font-weight: 600; }
.ask-budget-breakdown {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
  margin-top: 4px;
  padding-top: 14px;
  border-top: 1px solid var(--lab-border-soft);
}
.ask-budget-line {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.ask-budget-line-label {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-light);
}
.ask-budget-line-val {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-dark);
}
.ask-budget-foot {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--lab-border-soft);
  font-size: 11px;
  color: var(--text-light);
  line-height: 1.5;
}
.ask-budget-foot b { color: var(--text-med); }

/* Inline upgrade modal (per-element trigger, e.g. Save workflow) */
.modal-upgrade-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9000;
  background: rgba(31, 53, 80, 0.32);
}
.modal-upgrade {
  max-width: 480px;
  width: calc(100% - 40px);
  padding: 26px 26px 22px;
  position: relative;
}
.modal-upgrade .upgrade-card-head {
  align-items: center;
  margin-bottom: 12px;
}
.modal-upgrade-close {
  margin-left: auto;
  border: none;
  background: transparent;
  font-size: 16px;
  color: var(--text-faint);
  cursor: pointer;
  padding: 4px 8px;
}
.modal-upgrade-close:hover { color: var(--text-dark); }
.modal-upgrade .upgrade-card-title {
  font-size: 18px;
  margin-bottom: 4px;
}
.modal-upgrade .upgrade-card-bullets { margin: 14px 0 18px; }
.modal-upgrade .upgrade-card-bullets li { padding: 5px 0 5px 22px; font-size: 13px; }
.modal-upgrade .upgrade-card-cta { gap: 8px; }

/* ============================================================
   Minimal white refresh — drop the warm cream/paper tone for a
   cleaner, airier white-on-white minimalist feel. Body and
   surfaces flatten to true white; sidebar + tints become a very
   light cool grey instead of gold; borders shift from gold-warm
   to neutral grey. Brand accents (SARA coral, navy primary) and
   the existing component layout are preserved.
   ============================================================ */
:root {
  --lab-bg:          #FFFFFF;
  --lab-surface:     #FFFFFF;
  --lab-tint:        #F7F7F8;
  --lab-tint-2:      #EFEFF1;
  --lab-border:      #E5E5E8;
  --lab-border-soft: #F0F0F2;

  /* Original neutral tokens some components still read directly. */
  --paper:        #FAFAFB;
  --paper-2:      #F0F0F2;
  --border:       #E5E5E8;
  --border-soft:  #F0F0F2;

  /* Cooler shadows so cards read against white cleanly. */
  --shadow-sm: 0 1px 2px rgba(20, 20, 30, 0.04);
  --shadow-md: 0 2px 8px rgba(20, 20, 30, 0.06);
  --shadow-lg: 0 8px 24px rgba(20, 20, 30, 0.08);
}

html, body { background: #FFFFFF; }

.topbar {
  background: #FFFFFF;
  border-bottom: 1px solid #ECECEE;
}
.sidebar {
  background: #FAFAFB;
  border-right: 1px solid #ECECEE;
}
.ask-sidebar {
  background: #FAFAFB;
  border-right: 1px solid #ECECEE;
}

/* Card hairline borders */
.card {
  background: #FFFFFF;
  border: 1px solid #ECECEE;
}

/* The Ask route runs its own sidebar + main split inside the
   layout, so the outer .page max-width 1320 + .ask-main max-width
   920 stack to push everything into the middle. Lift both for the
   Ask route so the shell fills the viewport horizontally. */
.page:has(.ask-layout) {
  max-width: none;
  padding: 0;
  margin: 0;
}
.ask-main {
  max-width: none;
}

/* ============================================================
   Sidebar embedded inside the inquiry input. The former
   .ask-sidebar (Search settings + SARA intro + footer) now sits
   to the right of the textarea inside .ask-input-block.
   ============================================================ */
.ask-layout:has(.ask-sidebar-embedded) {
  display: block;
}
.ask-input-block-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 18px;
  padding: 16px;
  align-items: stretch;
}
.ask-input-block-split .ask-input-main {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.ask-input-block-split .ask-input {
  flex: 1;
  min-height: 180px;
}
.ask-sidebar-embedded {
  background: var(--lab-tint);
  border: 1px solid var(--lab-border-soft);
  border-radius: 10px;
  padding: 16px 18px 14px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  position: static;
  top: auto;
  max-height: none;
  overflow-y: visible;
  align-self: stretch;
}
.ask-sidebar-embedded .ask-side-title {
  font-size: 10.5px;
  letter-spacing: 0.08em;
}
.ask-sidebar-embedded .ask-params-row {
  grid-template-columns: 1fr;
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: stretch;
}
.ask-sidebar-embedded .ask-params-label {
  font-size: 9.5px;
  letter-spacing: 0.10em;
}
.ask-sidebar-embedded .ask-side-intro {
  border-top: 1px solid var(--lab-border-soft);
  padding-top: 12px;
  margin-top: 0;
}
.ask-sidebar-embedded .ask-side-desc {
  font-size: 11.5px;
  line-height: 1.55;
}
.ask-sidebar-embedded .sl-foot.ask-side-foot {
  border-top: 1px solid var(--lab-border-soft);
  padding-top: 10px;
  font-size: 10.5px;
}
@media (max-width: 900px) {
  .ask-input-block-split {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   Centred max-width canvas + navy -> sage/grey palette swap.
   The Ask card now sits centred at ~1100 px max, mode chips live
   inside the input card, and SARA's primary accents lean on sage
   and neutral grey instead of brand navy.
   ============================================================ */
.page:has(.ask-layout) {
  max-width: 1180px;
  margin: 0 auto;
  padding: 32px 32px 56px;
}
.ask-main { max-width: 1100px; margin: 0 auto; padding: 0; }

/* Mode chips now sit at the bottom of the input-main column,
   centred under the textarea + foot. */
.ask-input-main .ask-mode-chips-wrap {
  margin-top: 12px;
  padding-top: 14px;
  border-top: 1px solid var(--lab-border-soft);
  display: flex;
  justify-content: center;
}
.ask-input-main .ask-mode-chips {
  gap: 8px;
}

/* Navy -> sage + neutral grey across the high-traffic surfaces.
   Token --lab-sky-deep stays available for legacy components but
   every conspicuous "primary" use is overridden here. */
.ask-title { color: #2A2A26; }
.ask-title-mark { color: var(--lab-sage-deep); }

/* Chip active state: sage instead of navy */
.ask-chip.active,
.ask-pm-chip.active {
  background: var(--lab-sage-deep);
  border-color: var(--lab-sage-deep);
  color: #FFFFFF;
}
.ask-chip.active:hover,
.ask-pm-chip.active:hover {
  background: #4F6B58;
  border-color: #4F6B58;
}
.ask-chip:hover,
.ask-pm-chip:hover {
  border-color: var(--lab-sage-deep);
  color: var(--lab-sage-deep);
}
.ask-chip.active .ask-chip-icon { color: #FFFFFF; }

/* Attach + sub-text accents lift to sage from navy. */
.ask-attach:hover {
  border-color: var(--lab-sage-deep);
  color: var(--lab-sage-deep);
  background: rgba(155, 175, 161, 0.08);
}
.ask-attach-label-set { color: var(--lab-sage-deep); }

/* Process card subtitle + process pill use sage. */
.ask-process-sub { color: var(--lab-sage-deep); }

/* Modal label + bold text: was navy, now neutral dark grey. */
.en-h, .en-sub-h, .en-list b { color: #2A2A26; }
.pmap-head h3 { color: var(--lab-sage-deep); }
.pmap-sub { color: #4A4A45; }
.pmap-toggle-btn.active {
  background: var(--lab-sage-deep);
}

/* Source numbered badges + tier labels use sage instead of navy. */
.ask-source-num { background: var(--lab-tint); color: var(--lab-sage-deep); }
.ask-source-tier-peer { background: var(--lab-sage); color: var(--lab-sage-deep); }

/* Confidence badge + tier badges that previously sat on navy
   foreground also pick up sage. */
.ask-conf-badge { background: var(--lab-sage); color: var(--lab-sage-deep); }

/* ============================================================
   Hide global topbar on the Ask route and reposition the Open
   access badge into the inquiry card.
   ============================================================ */
.shell:has(.ask-layout) ~ .topbar,
body:has(.ask-layout) .topbar {
  display: none;
}
body:has(.ask-layout) {
  --topbar-h: 0px;
}
body:has(.ask-layout) .shell {
  padding-top: 0;
}
body:has(.ask-layout) .page:has(.ask-layout) {
  padding-top: 20px;
}

.ask-input-block-split { position: relative; }
.ask-status-pill {
  position: absolute;
  top: 12px;
  right: 14px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--lab-tint);
  border: 1px solid var(--lab-border-soft);
  border-radius: 999px;
  padding: 3px 10px 3px 8px;
  font-size: 11px;
  font-weight: 600;
  color: var(--text-med);
  letter-spacing: 0.02em;
  z-index: 2;
}
.ask-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--lab-sage-deep);
  flex-shrink: 0;
}

/* Header (Ask SARA title + greeting) now sits inside the input
   card as the first row, spanning both columns above the
   textarea + sidebar split. */
.ask-input-block-split .ask-head {
  grid-column: 1 / -1;
  margin: 0 0 14px;
  padding-right: 80px;  /* leave room for the Open pill */
  max-width: none;
}
.ask-input-block-split .ask-title {
  font-size: 34px;
  margin-bottom: 6px;
  line-height: 1.1;
}
.ask-input-block-split .ask-greeting {
  margin-top: 2px;
}

/* LLM-style: the inquiry card sits vertically centred in the
   viewport on first load, and naturally scrolls when results
   render below it. */
body:has(.ask-layout) .page:has(.ask-layout) {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-top: 40px;
  padding-bottom: 40px;
}

/* The original .ask-layout carries min-height: calc(100vh - topbar);
   that breaks vertical-centering because the layout itself fills
   the page. Reset it for the embedded-sidebar variant so the page
   flex centring actually shrinks-to-content. */
.ask-layout:has(.ask-sidebar-embedded) {
  min-height: 0;
  background: transparent;
}

/* ============================================================
   Chalkboard inquiry card. Whole .ask-input-block-split flips
   to a dark sage backdrop with chalk-light text and Caveat
   handwritten title. The embedded sidebar stays inside the
   card with translucent chalk-on-board surfaces.
   ============================================================ */
:root { --chalk: 'Caveat', cursive; --chalk-ink: #F2EBDD; }

.ask-input-block-split {
  background: linear-gradient(135deg, #2F4A3C 0%, #243B30 100%);
  border: 1px solid #3B5A4A;
  box-shadow:
    0 6px 22px rgba(20, 30, 24, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  color: var(--chalk-ink);
}

/* Title + greeting in chalk feel */
.ask-input-block-split .ask-title {
  font-family: var(--chalk);
  color: var(--chalk-ink);
  font-size: 54px;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1;
}
.ask-input-block-split .ask-title-mark {
  color: var(--chalk-ink);
  font-style: normal;
  font-weight: 700;
}
.ask-input-block-split .sara-glyph {
  color: var(--chalk-ink);
}
.ask-input-block-split .ask-greeting {
  font-family: var(--chalk);
  color: rgba(242, 235, 221, 0.82);
  font-size: 19px;
  margin-top: 4px;
}
.ask-input-block-split .ask-greeting-stamp {
  color: rgba(242, 235, 221, 0.55);
  font-family: var(--chalk);
}

/* Status pill on dark sage */
.ask-input-block-split .ask-status-pill {
  background: rgba(242, 235, 221, 0.08);
  border-color: rgba(242, 235, 221, 0.22);
  color: rgba(242, 235, 221, 0.85);
}
.ask-input-block-split .ask-status-dot {
  background: var(--chalk-ink);
}

/* Textarea: chalk on board */
.ask-input-block-split .ask-input {
  background: transparent;
  color: var(--chalk-ink);
  font-family: var(--chalk);
  font-size: 19px;
  caret-color: var(--chalk-ink);
}
.ask-input-block-split .ask-input::placeholder {
  color: rgba(242, 235, 221, 0.42);
  font-style: italic;
}

/* Attach affordance */
.ask-input-block-split .ask-input-foot {
  border-top: 1px solid rgba(242, 235, 221, 0.14);
}
.ask-input-block-split .ask-attach {
  background: rgba(242, 235, 221, 0.04);
  border: 1px dashed rgba(242, 235, 221, 0.30);
  color: rgba(242, 235, 221, 0.80);
}
.ask-input-block-split .ask-attach:hover {
  background: rgba(242, 235, 221, 0.10);
  border-color: rgba(242, 235, 221, 0.50);
  color: var(--chalk-ink);
}

/* Mode chips: outline on board, active filled chalk */
.ask-input-block-split .ask-mode-chips-wrap {
  border-top: 1px solid rgba(242, 235, 221, 0.14);
}
.ask-input-block-split .ask-chip {
  background: rgba(242, 235, 221, 0.05);
  border: 1px solid rgba(242, 235, 221, 0.28);
  color: rgba(242, 235, 221, 0.85);
}
.ask-input-block-split .ask-chip .ask-chip-icon { color: rgba(242, 235, 221, 0.75); }
.ask-input-block-split .ask-chip:hover {
  background: rgba(242, 235, 221, 0.10);
  border-color: rgba(242, 235, 221, 0.50);
  color: var(--chalk-ink);
}
.ask-input-block-split .ask-chip.active {
  background: var(--chalk-ink);
  border-color: var(--chalk-ink);
  color: #2F4A3C;
  font-weight: 700;
  box-shadow: none;
}
.ask-input-block-split .ask-chip.active .ask-chip-icon { color: #2F4A3C; }

/* Embedded sidebar: translucent panel on board */
.ask-input-block-split .ask-sidebar-embedded {
  background: rgba(242, 235, 221, 0.04);
  border: 1px solid rgba(242, 235, 221, 0.14);
  color: var(--chalk-ink);
}
.ask-input-block-split .ask-side-title {
  color: rgba(242, 235, 221, 0.55);
  border-bottom-color: rgba(242, 235, 221, 0.14);
}
.ask-input-block-split .ask-params-label {
  color: rgba(242, 235, 221, 0.50);
}
.ask-input-block-split .ask-pm-chip {
  background: rgba(242, 235, 221, 0.04);
  border: 1px solid rgba(242, 235, 221, 0.26);
  color: rgba(242, 235, 221, 0.78);
}
.ask-input-block-split .ask-pm-chip:hover {
  background: rgba(242, 235, 221, 0.12);
  border-color: rgba(242, 235, 221, 0.46);
  color: var(--chalk-ink);
}
.ask-input-block-split .ask-pm-chip.active {
  background: var(--chalk-ink);
  border-color: var(--chalk-ink);
  color: #2F4A3C;
  font-weight: 700;
}

/* SARA intro paragraph + all bold/strong inside the card: unified
   to chalk ink so "SARA" no longer reads as a different colour. */
.ask-input-block-split .ask-side-desc {
  color: rgba(242, 235, 221, 0.82);
}
.ask-input-block-split .ask-side-desc b,
.ask-input-block-split .ask-side-desc strong,
.ask-input-block-split .ask-side-desc em {
  color: var(--chalk-ink);
}
.ask-input-block-split .sara-glyph-inline {
  color: var(--chalk-ink);
}
.ask-input-block-split .sense-link {
  color: var(--chalk-ink);
  text-decoration-color: rgba(242, 235, 221, 0.40);
}
.ask-input-block-split .sense-plan-link {
  color: var(--chalk-ink);
  border-bottom: 1px dashed rgba(242, 235, 221, 0.40);
}
.ask-input-block-split .sense-plan-link:hover {
  border-bottom-color: var(--chalk-ink);
}

/* Footer (SARA v0.1 + edit note + by Dr. S. Lee) */
.ask-input-block-split .sl-foot.ask-side-foot {
  border-top: 1px solid rgba(242, 235, 221, 0.14);
  color: rgba(242, 235, 221, 0.60);
}
.ask-input-block-split .sl-foot-mark b { color: var(--chalk-ink); }
.ask-input-block-split .sl-foot-version { color: rgba(242, 235, 221, 0.55); }
.ask-input-block-split .sl-foot-note {
  color: rgba(242, 235, 221, 0.78);
  text-decoration-color: rgba(242, 235, 221, 0.40);
}
.ask-input-block-split .sl-foot-link {
  color: var(--chalk-ink);
}

/* Swap chalk font from Caveat (very curly) to Patrick Hand (clean
   schoolroom chalk feel — readable + still handwritten). */
:root { --chalk: 'Patrick Hand', cursive; }

/* Process mapping review modal: match the inquiry card's sage
   palette instead of the legacy navy primary. */
.pmap-foot .btn-primary,
.pmap-card .btn-primary {
  background: var(--lab-sage-deep);
  border-color: var(--lab-sage-deep);
  color: #FFFFFF;
}
.pmap-foot .btn-primary:hover,
.pmap-card .btn-primary:hover {
  background: #4F6B58;
  border-color: #4F6B58;
  color: #FFFFFF;
}
.pmap-foot .btn-ghost,
.pmap-card .btn-ghost {
  background: #FFFFFF;
  border-color: var(--lab-border);
  color: var(--text-dark);
}
.pmap-foot .btn-ghost:hover,
.pmap-card .btn-ghost:hover {
  background: var(--lab-tint);
  border-color: var(--lab-sage-deep);
  color: var(--lab-sage-deep);
}

/* Embedded sidebar on chalkboard: previous alpha values were too
   dim to read against the dark sage panel. Lift every text layer
   so the sidebar reads cleanly without losing the secondary tone. */
.ask-input-block-split .ask-sidebar-embedded {
  background: rgba(242, 235, 221, 0.06);
  border-color: rgba(242, 235, 221, 0.18);
}
.ask-input-block-split .ask-side-title {
  color: rgba(242, 235, 221, 0.78);
  border-bottom-color: rgba(242, 235, 221, 0.20);
}
.ask-input-block-split .ask-params-label {
  color: rgba(242, 235, 221, 0.72);
}
.ask-input-block-split .ask-side-desc {
  color: rgba(242, 235, 221, 0.92);
}
.ask-input-block-split .ask-pm-chip {
  background: rgba(242, 235, 221, 0.07);
  border-color: rgba(242, 235, 221, 0.36);
  color: rgba(242, 235, 221, 0.92);
}
.ask-input-block-split .ask-pm-chip:hover {
  background: rgba(242, 235, 221, 0.16);
  border-color: rgba(242, 235, 221, 0.58);
  color: var(--chalk-ink);
}
.ask-input-block-split .sl-foot.ask-side-foot {
  color: rgba(242, 235, 221, 0.78);
  border-top-color: rgba(242, 235, 221, 0.20);
}
.ask-input-block-split .sl-foot-version { color: rgba(242, 235, 221, 0.70); }
.ask-input-block-split .sl-foot-note { color: rgba(242, 235, 221, 0.88); }
.ask-input-block-split .sense-plan-link {
  color: var(--chalk-ink);
  border-bottom-color: rgba(242, 235, 221, 0.58);
}

/* ============================================================
   Modern editorial pass on the chalkboard card.
   Drops the schoolroom handwriting + deep-blackboard tone for a
   softer sage surface, Fraunces serif title, and Inter body --
   "lab notebook in print", not "chalkboard in a classroom".
   ============================================================ */
.ask-input-block-split {
  background: linear-gradient(135deg, #506A5C 0%, #3F584B 100%);
  border: 1px solid rgba(242, 235, 221, 0.16);
  box-shadow:
    0 10px 32px rgba(20, 30, 24, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

/* Title in Fraunces (already loaded), modern editorial weight */
.ask-input-block-split .ask-title {
  font-family: var(--serif-lab);
  font-weight: 500;
  font-size: 40px;
  letter-spacing: -0.01em;
  line-height: 1.1;
}
.ask-input-block-split .ask-title-mark {
  font-style: italic;
  font-weight: 500;
}

/* Greeting + meta line back to clean sans */
.ask-input-block-split .ask-greeting {
  font-family: var(--sans-lab);
  font-size: 13.5px;
  color: rgba(242, 235, 221, 0.85);
  margin-top: 4px;
}
.ask-input-block-split .ask-greeting-stamp {
  font-family: var(--sans-lab);
  color: rgba(242, 235, 221, 0.62);
}

/* Textarea: Inter, not handwriting, slightly tighter so it reads
   as quiet input rather than a chalked sentence. */
.ask-input-block-split .ask-input {
  font-family: var(--sans-lab);
  font-size: 14.5px;
  line-height: 1.6;
}
.ask-input-block-split .ask-input::placeholder {
  font-style: italic;
  color: rgba(242, 235, 221, 0.48);
}

/* Sidebar: slightly lifted panel surface for the softer backdrop */
.ask-input-block-split .ask-sidebar-embedded {
  background: rgba(242, 235, 221, 0.07);
  border-color: rgba(242, 235, 221, 0.22);
}
.ask-input-block-split .ask-side-desc {
  font-family: var(--sans-lab);
}

/* ============================================================
   Invert: page background sage, inquiry card white.
   Keeps the modern editorial typography (Fraunces title +
   Inter body) but the chalkboard moves OUT of the card to
   become the room around it.
   ============================================================ */
body:has(.ask-layout) {
  background:
    radial-gradient(circle at 20% 0%, rgba(242, 235, 221, 0.06) 0%, transparent 55%),
    linear-gradient(135deg, #506A5C 0%, #3F584B 100%);
  background-attachment: fixed;
}
body:has(.ask-layout) .shell,
body:has(.ask-layout) .page:has(.ask-layout) {
  background: transparent;
}

/* Card surface back to white */
.ask-input-block-split {
  background: #FFFFFF;
  border: 1px solid rgba(80, 106, 92, 0.18);
  box-shadow:
    0 8px 30px rgba(30, 50, 40, 0.10),
    0 2px 4px rgba(30, 50, 40, 0.04);
  color: var(--text-dark);
}

/* Header content reverts to dark text on white */
.ask-input-block-split .ask-title { color: #2A2A26; }
.ask-input-block-split .ask-title-mark { color: var(--lab-sage-deep); }
.ask-input-block-split .sara-glyph { color: var(--lab-sage-deep); }
.ask-input-block-split .ask-greeting {
  color: var(--text-medium);
  font-family: var(--sans-lab);
}
.ask-input-block-split .ask-greeting-stamp {
  color: var(--text-light);
  font-family: var(--sans-lab);
}

/* Status pill on white */
.ask-input-block-split .ask-status-pill {
  background: var(--lab-tint);
  border-color: var(--lab-border-soft);
  color: var(--text-medium);
}
.ask-input-block-split .ask-status-dot { background: var(--lab-sage-deep); }

/* Textarea: dark text, white surface */
.ask-input-block-split .ask-input {
  background: transparent;
  color: var(--text-dark);
  font-family: var(--sans-lab);
  caret-color: var(--lab-sage-deep);
}
.ask-input-block-split .ask-input::placeholder {
  color: var(--text-faint);
  font-style: italic;
}

/* Attach + foot divider */
.ask-input-block-split .ask-input-foot {
  border-top: 1px solid var(--lab-border-soft);
}
.ask-input-block-split .ask-attach {
  background: var(--lab-tint);
  border: 1px dashed var(--lab-border);
  color: var(--text-medium);
}
.ask-input-block-split .ask-attach:hover {
  background: rgba(155, 175, 161, 0.10);
  border-color: var(--lab-sage-deep);
  color: var(--lab-sage-deep);
}

/* Mode chips: outline on white, sage when active */
.ask-input-block-split .ask-mode-chips-wrap {
  border-top: 1px solid var(--lab-border-soft);
}
.ask-input-block-split .ask-chip {
  background: #FFFFFF;
  border: 1px solid var(--lab-border);
  color: var(--text-dark);
}
.ask-input-block-split .ask-chip .ask-chip-icon { color: var(--lab-sage-deep); opacity: 0.85; }
.ask-input-block-split .ask-chip:hover {
  background: var(--lab-tint);
  border-color: var(--lab-sage-deep);
  color: var(--lab-sage-deep);
}
.ask-input-block-split .ask-chip.active {
  background: var(--lab-sage-deep);
  border-color: var(--lab-sage-deep);
  color: #FFFFFF;
  box-shadow: none;
}
.ask-input-block-split .ask-chip.active .ask-chip-icon { color: #FFFFFF; opacity: 1; }

/* Embedded sidebar: soft light tint */
.ask-input-block-split .ask-sidebar-embedded {
  background: var(--lab-tint);
  border: 1px solid var(--lab-border-soft);
  color: var(--text-dark);
}
.ask-input-block-split .ask-side-title {
  color: var(--text-medium);
  border-bottom-color: var(--lab-border);
}
.ask-input-block-split .ask-params-label {
  color: var(--text-medium);
}
.ask-input-block-split .ask-pm-chip {
  background: #FFFFFF;
  border: 1px solid var(--lab-border);
  color: var(--text-dark);
}
.ask-input-block-split .ask-pm-chip:hover {
  background: rgba(155, 175, 161, 0.12);
  border-color: var(--lab-sage-deep);
  color: var(--lab-sage-deep);
}
.ask-input-block-split .ask-pm-chip.active {
  background: var(--lab-sage-deep);
  border-color: var(--lab-sage-deep);
  color: #FFFFFF;
}
.ask-input-block-split .ask-side-desc {
  color: var(--text-dark);
  font-family: var(--sans-lab);
}
.ask-input-block-split .ask-side-desc b,
.ask-input-block-split .ask-side-desc strong { color: var(--lab-sage-deep); }
.ask-input-block-split .sara-glyph-inline { color: var(--lab-sage-deep); }
.ask-input-block-split .sense-link { color: var(--lab-sage-deep); }
.ask-input-block-split .sense-plan-link {
  color: var(--lab-sage-deep);
  border-bottom: 1px dashed var(--lab-sage-deep);
}

/* Footer */
.ask-input-block-split .sl-foot.ask-side-foot {
  border-top: 1px solid var(--lab-border);
  color: var(--text-medium);
}
.ask-input-block-split .sl-foot-mark b { color: var(--text-dark); }
.ask-input-block-split .sl-foot-version { color: var(--text-light); }
.ask-input-block-split .sl-foot-note { color: var(--text-medium); }
.ask-input-block-split .sl-foot-link { color: var(--lab-sage-deep); }

/* Page backdrop: switch from moss sage to the homepage #contact
   navy gradient (--navy #2C4A6B -> --navy-deep #1F3550). The
   inquiry card stays white; only the room around it changes. */
body:has(.ask-layout) {
  background:
    radial-gradient(circle at 20% 0%, rgba(197, 181, 154, 0.10) 0%, transparent 55%),
    linear-gradient(135deg, #2C4A6B 0%, #1F3550 100%);
  background-attachment: fixed;
}
/* Card edge softened to navy-friendly hairline */
.ask-input-block-split {
  border: 1px solid rgba(31, 53, 80, 0.18);
  box-shadow:
    0 10px 32px rgba(15, 25, 40, 0.22),
    0 2px 4px rgba(15, 25, 40, 0.10);
}

/* Make sure every wrapper between body and the card is
   transparent so the navy gradient bleeds right up to the card
   edge (no stray white slab behind the card). */
body:has(.ask-layout) html,
body:has(.ask-layout) .shell,
body:has(.ask-layout) .page,
body:has(.ask-layout) .page:has(.ask-layout),
body:has(.ask-layout) .ask-layout,
body:has(.ask-layout) .ask-main {
  background: transparent;
}

/* Unify the secondary text tone on the navy backdrop so the
   greeting + stamp read clearly and don't pick up the bluer
   lab-text-medium. */
.ask-input-block-split .ask-greeting { color: #2A2A26; }
.ask-input-block-split .ask-greeting-stamp { color: #6E6E66; }

/* Download note button (top of Answer card) carried legacy navy;
   shift to the unified sage palette. */
.ask-download-btn {
  background: #FFFFFF;
  border: 1px solid var(--lab-border);
  color: var(--lab-sage-deep);
}
.ask-download-btn:hover {
  background: rgba(155, 175, 161, 0.10);
  border-color: var(--lab-sage-deep);
  color: var(--lab-sage-deep);
}

/* Workflow + matrix accent text use sage. */
.ask-section-head,
.ask-workflow-domain,
.ask-source-cite,
.ask-source-title { color: var(--lab-sage-deep); }
.ask-cite a,
.ask-matrix-src { color: var(--lab-sage-deep); }
.ask-matrix-pick-tag {
  background: var(--lab-sage-deep);
  color: #FFFFFF;
}

/* Edit-note popover modal buttons share the sage palette. */
.en-modal .btn-primary {
  background: var(--lab-sage-deep);
  border-color: var(--lab-sage-deep);
  color: #FFFFFF;
}
.en-modal .btn-primary:hover {
  background: #4F6B58;
  border-color: #4F6B58;
}

/* More specific override — earlier rules set .page + .ask-main
   to white. Force them transparent on the Ask route so the body
   navy bleeds through to the card edge. */
body:has(.ask-layout) main.page,
body:has(.ask-layout) main.ask-main,
body:has(.ask-layout) #askMain.ask-main {
  background: transparent !important;
}

/* Beat the body[data-plan="free"] .page background:!important by
   layering an even more specific selector on the Ask route. */
body[data-plan="free"]:has(.ask-layout) main#page,
body[data-plan="free"]:has(.ask-layout) .page,
body[data-plan="free"]:has(.ask-layout) main.ask-main,
body[data-plan="free"]:has(.ask-layout) #askMain.ask-main {
  background: transparent !important;
}

/* Hide the global nav sidebar on the Ask route so the inquiry
   card sits centred in the full viewport, not offset by the
   220 px nav rail. */
body:has(.ask-layout) .shell {
  grid-template-columns: 1fr;
}
body:has(.ask-layout) .shell > .sidebar:not(.ask-sidebar) {
  display: none;
}

/* Page is a grid item inside the 1fr shell column; left-aligned
   by default. Force margin auto + justify-self centre so the
   max-width 1180 px page sits in the viewport centre. */
body:has(.ask-layout) main#page,
body:has(.ask-layout) .page {
  margin-left: auto !important;
  margin-right: auto !important;
  justify-self: center !important;
}

/* Switch the shell to flex on the Ask route so justify-content
   centre actually centres the page max-width inside the viewport. */
body:has(.ask-layout) .shell {
  display: flex !important;
  justify-content: center !important;
  align-items: stretch !important;
  grid-template-columns: none !important;
}
body:has(.ask-layout) main#page,
body:has(.ask-layout) .page {
  flex: 0 1 1180px;
  width: 100%;
}

/* The shell carries padding-left: var(--sidebar-w, 220px) from
   the responsive overlay layout. That padding is what's been
   shifting the centred page right. Drop it on the Ask route. */
body:has(.ask-layout) .shell {
  padding-left: 0 !important;
  padding-top: 0 !important;
}

/* Centre the Ask SARA header within the inquiry card.  The 80 px
   right-padding (for the Open pill) gets mirrored on the left so
   the optical centre stays in the card's centre line. */
.ask-input-block-split .ask-head {
  text-align: center;
  padding-left: 80px;
}
.ask-input-block-split .ask-title {
  justify-content: center;
}
.ask-input-block-split .ask-greeting {
  text-align: center;
}

/* Re-place the Ask SARA header inside the input column only,
   centred above the textarea + example placeholder. The right
   sidebar column stays unaffected; the Open pill is absolute on
   the card so no padding-mirror is needed any more. */
.ask-input-block-split .ask-head {
  grid-column: 1 / 2;
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 20px;
  text-align: center;
}
.ask-input-block-split .ask-title { justify-content: center; }
.ask-input-block-split .ask-greeting { text-align: center; }

/* Lock the grid placement explicitly so the head stacks on top of
   the input column, the input-main stays in column 1 row 2, and
   the sidebar spans both rows in column 2. */
.ask-input-block-split .ask-head {
  grid-column: 1 / 2;
  grid-row: 1;
}
.ask-input-block-split .ask-input-main {
  grid-column: 1 / 2;
  grid-row: 2;
}
.ask-input-block-split .ask-sidebar-embedded {
  grid-column: 2 / 3;
  grid-row: 1 / 3;
}

/* Pull the Ask SARA header down so it sits vertically centred
   over the textarea area, not above it. Header overlays the
   textarea with pointer-events disabled so clicks still land on
   the input. Grid row for the header collapses so the input-main
   reclaims the full card height. */
.ask-input-block-split .ask-input-main {
  position: relative;
}
.ask-input-block-split .ask-head {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  z-index: 2;
  pointer-events: none;
  margin: 0;
  grid-row: auto;
  grid-column: auto;
}
.ask-input-block-split .ask-head .ask-title,
.ask-input-block-split .ask-head .ask-greeting,
.ask-input-block-split .ask-head a,
.ask-input-block-split .ask-head button {
  pointer-events: auto;
}
/* Move the head DOM-position-wise into the input-main column by
   re-parenting via grid. Put it in row 2 column 1 just like
   input-main and let absolute positioning anchor it to that
   container. The actual positioning is via the .ask-input-main
   anchor above. */
.ask-input-block-split .ask-head {
  grid-row: 2;
  grid-column: 1 / 2;
  align-self: center;
}

/* Place the head in the SAME grid cell as the input-main (row 2,
   col 1) and use align-self centre to vertically centre it
   against the input column.  Drop the absolute positioning -- it
   was anchoring to the card rather than to .ask-input-main. */
.ask-input-block-split .ask-head {
  position: static;
  top: auto;
  left: auto;
  right: auto;
  transform: none;
  grid-row: 2;
  grid-column: 1 / 2;
  align-self: center;
  justify-self: center;
  pointer-events: none;
  z-index: 2;
  margin: 0;
}
.ask-input-block-split .ask-head > * { pointer-events: auto; }

/* New DOM: .ask-input-wrap holds the textarea and the head as
   siblings.  The wrap is the positioning anchor; head overlays
   the textarea, centred both axes.  Clicks pass through to the
   textarea via pointer-events. */
.ask-input-block-split .ask-input-wrap {
  position: relative;
}
.ask-input-block-split .ask-input-wrap .ask-head {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  z-index: 2;
  pointer-events: none;
  margin: 0;
  text-align: center;
}
.ask-input-block-split .ask-input-wrap .ask-head > * {
  pointer-events: auto;
}
.ask-input-block-split .ask-input-wrap .ask-title { justify-content: center; }
.ask-input-block-split .ask-input-wrap .ask-greeting { text-align: center; }

/* Watermark behaviour for the Ask SARA header.
   - empty textarea (placeholder visible)  -> full strength header
   - any user input (placeholder hidden)   -> header fades to a
     subtle watermark so it doesn't fight with the typed text.
   :placeholder-shown is true when the textarea is empty AND has
   a placeholder; once the user types, it flips to false and the
   :has() selector applies the watermark state. */
.ask-input-block-split .ask-input-wrap .ask-head {
  transition: opacity 220ms ease, filter 220ms ease;
}
.ask-input-block-split .ask-input-wrap:has(.ask-input:not(:placeholder-shown)) .ask-head {
  opacity: 0.12;
  filter: saturate(0.6);
}

/* Narrow the inquiry card so the inquiry sits more like an LLM
   hero box than a full-width workspace. 1100 -> 880 px. */
body:has(.ask-layout) .ask-main {
  max-width: 880px !important;
}

/* Move Ask SARA above the placeholder example. Head sits at the
   top of the textarea area; textarea content (placeholder + user
   typing) gets a padding-top equal to the head's height so the
   example reads as the next line below the title, not under it. */
.ask-input-block-split .ask-input-wrap .ask-head {
  top: 18px;
  transform: none;
}
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-top: 92px;
}

/* Repaint Ask SARA + mode chips from sage to a modern terracotta
   coral. Brand --lab-coral-deep (#C77E5A) is the warm token, but
   for the navy backdrop we use a slightly deeper, more
   desaturated variant (#B8654E) so it reads as refined coral
   rather than peach. Hover/active stay coherent. */
.ask-input-block-split .ask-title-mark { color: #B8654E; }
.ask-input-block-split .sara-glyph     { color: #B8654E; }
.ask-input-block-split .sara-glyph-inline { color: #B8654E; }
.ask-input-block-split .sense-link     { color: #B8654E; }
.ask-input-block-split .sense-plan-link {
  color: #B8654E;
  border-bottom-color: #B8654E;
}
.ask-input-block-split .ask-status-dot { background: #B8654E; }

/* Caret + textarea selection accent */
.ask-input-block-split .ask-input { caret-color: #B8654E; }

/* Attach pill hover */
.ask-input-block-split .ask-attach:hover {
  background: rgba(184, 101, 78, 0.06);
  border-color: #B8654E;
  color: #B8654E;
}

/* Mode chips: outline -> coral on hover, coral solid on active */
.ask-input-block-split .ask-chip .ask-chip-icon { color: #B8654E; }
.ask-input-block-split .ask-chip:hover {
  background: rgba(184, 101, 78, 0.06);
  border-color: #B8654E;
  color: #B8654E;
}
.ask-input-block-split .ask-chip.active {
  background: #B8654E;
  border-color: #B8654E;
  color: #FFFFFF;
}
.ask-input-block-split .ask-chip.active .ask-chip-icon { color: #FFFFFF; }

/* Process-mapping side chips inside the embedded sidebar */
.ask-input-block-split .ask-pm-chip:hover {
  background: rgba(184, 101, 78, 0.08);
  border-color: #B8654E;
  color: #B8654E;
}
.ask-input-block-split .ask-pm-chip.active {
  background: #B8654E;
  border-color: #B8654E;
  color: #FFFFFF;
}

/* Embedded sidebar emphasis bits */
.ask-input-block-split .ask-side-desc b,
.ask-input-block-split .ask-side-desc strong { color: #B8654E; }
.ask-input-block-split .sl-foot-link { color: #B8654E; }

/* "Sense Aide for Research & Analysis" sits inside <em> in the
   sidebar intro and was too dim against the tinted panel. Give
   it the SARA coral tone, slight weight, and keep the italic so
   it still reads as the SARA tagline rather than body text. */
.ask-input-block-split .ask-side-desc em {
  font-style: italic;
  font-weight: 600;
  color: #B8654E;
}

/* Shrink the embedded "Search settings" panel typography across
   the board so the side rail reads as quiet config rather than
   competing with the inquiry text. */
.ask-input-block-split .ask-side-title {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.ask-input-block-split .ask-params-label {
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.ask-input-block-split .ask-pm-chip {
  font-size: 11px;
  padding: 3px 7px;
  line-height: 1.3;
}
.ask-input-block-split .ask-side-section {
  gap: 6px;
}

/* Shrink the placeholder example slightly so the trimmed
   sentence fits on a single line within the textarea width. */
.ask-input-block-split .ask-input,
.ask-input-block-split .ask-input::placeholder {
  font-size: 13px;
}

/* Move Ask SARA back to the visual centre of the textarea and
   tighten the title line-height so the words sit closer
   together. Placeholder padding-top follows so the example
   prints just below the title without overlap. */
.ask-input-block-split .ask-input-wrap .ask-head {
  top: 50%;
  transform: translateY(-50%);
}
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-top: 150px;
}
.ask-input-block-split .ask-title {
  line-height: 1.0;
}

/* Bump textarea padding-top so the placeholder example clears
   the centred head's bottom edge (head bottom sits ~176 px below
   textarea top; 200 leaves a small breathing gap below it). */
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-top: 200px;
}

/* Final padding lift so placeholder clears head bottom + small gap */
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-top: 230px !important;
}

/* Quieter sidebar intro: shrink the SARA paragraph + Bring SARA
   CTA, and add breathing space after the CTA so the next sidebar
   block stands clear. Open status pill hidden -- the inquiry
   surface already implies the open-access stance. */
.ask-input-block-split .ask-side-desc {
  font-size: 11px;
  line-height: 1.55;
}
.ask-input-block-split .sense-plan-link {
  font-size: 11px;
  margin-bottom: 18px;
}
.ask-input-block-split .ask-status-pill {
  display: none !important;
}

/* Restore the placeholder to its native top-left position in
   the textarea. Head stays centred and overlays the empty
   middle area; placeholder sits above it as a hint at the top
   where typing will begin. */
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-top: 14px !important;
}

/* Empty state: placeholder example sits at the textarea's top-
   right corner. Once the user starts typing, alignment flips
   back to left so the typed content reads naturally. */
.ask-input-block-split .ask-input-wrap .ask-input {
  text-align: right;
}
.ask-input-block-split .ask-input-wrap .ask-input:not(:placeholder-shown) {
  text-align: left;
}

/* Smaller placeholder so it reads as a quiet hint in the top
   right corner instead of a wide sentence across the top.
   Right padding nudges it just off the corner edge. */
.ask-input-block-split .ask-input-wrap .ask-input,
.ask-input-block-split .ask-input-wrap .ask-input::placeholder {
  font-size: 11px;
}
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-right: 18px !important;
  padding-top: 10px !important;
}

/* Misread direction: user wants the placeholder at the
   textarea's TOP-LEFT corner (the card's top-left corner area),
   not top-right. Revert text-align to left and pull padding
   tight to that corner. */
.ask-input-block-split .ask-input-wrap .ask-input,
.ask-input-block-split .ask-input-wrap .ask-input:not(:placeholder-shown) {
  text-align: left !important;
}
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-left: 18px !important;
  padding-right: 14px !important;
  padding-top: 10px !important;
}

/* Move Ask SARA back to the textarea's top-left corner (no more
   vertical centring). Title aligns left, placeholder padding
   shifts down to sit below the head. */
.ask-input-block-split .ask-input-wrap .ask-head {
  top: 12px !important;
  left: 18px !important;
  right: auto !important;
  transform: none !important;
  text-align: left !important;
}
.ask-input-block-split .ask-input-wrap .ask-title {
  justify-content: flex-start !important;
}
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-top: 80px !important;
}

/* New tagline is longer than "Ask SARA" so the 40 px title wraps
   to two lines. Drop the size so "Sara, take this through the
   library." reads as one confident line. */
.ask-input-block-split .ask-title {
  font-size: 26px !important;
  line-height: 1.15 !important;
}

/* User asked to drop italic from the SARA acronym callout while
   keeping the coral colour + weight so it still reads as the
   tagline. */
.ask-input-block-split .ask-side-desc em {
  font-style: normal !important;
}

/* Move "Sara, take this through the library." to the textarea's
   top-RIGHT corner. */
.ask-input-block-split .ask-input-wrap .ask-head {
  left: auto !important;
  right: 18px !important;
  text-align: right !important;
}
.ask-input-block-split .ask-input-wrap .ask-title {
  justify-content: flex-end !important;
}

/* Back to top-LEFT corner (user reversed direction). */
.ask-input-block-split .ask-input-wrap .ask-head {
  left: 18px !important;
  right: auto !important;
  text-align: left !important;
}
.ask-input-block-split .ask-input-wrap .ask-title {
  justify-content: flex-start !important;
}

/* Tighter into the top-left corner of the textarea. */
.ask-input-block-split .ask-input-wrap .ask-head {
  top: 4px !important;
  left: 8px !important;
}

/* Move the title OUT of the textarea area to the white card's
   own top-left corner. Drop the wrap's positioning context so
   head's absolute coords resolve against the card
   (.ask-input-block-split, which is the relative parent). */
.ask-input-block-split .ask-input-wrap {
  position: static !important;
}
.ask-input-block-split .ask-head {
  top: 18px !important;
  left: 22px !important;
}

/* .ask-input-main also has position: relative; strip it so head
   anchors directly against the card (.ask-input-block-split). */
.ask-input-block-split .ask-input-main {
  position: static !important;
}

/* Re-apply with full selector specificity so this beats the
   earlier top: 4/left: 8 rule. */
.ask-input-block-split .ask-input-wrap .ask-head {
  top: 18px !important;
  left: 22px !important;
}

/* Grid layout shifts the absolute origin ~150 px below card top
   despite the wrap being static. Compensate with negative top
   so head lands at the card's actual top-left corner. */
.ask-input-block-split .ask-input-wrap .ask-head {
  top: -134px !important;
  left: -2px !important;
}

/* Place head as a normal block at the top of input-main (drop
   the absolute hack). Sara wordmark bigger, the rest of the
   tagline smaller. Placeholder sits a hair below the title. */
.ask-input-block-split .ask-input-wrap .ask-head {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  pointer-events: auto !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  text-align: left !important;
}
.ask-input-block-split .ask-title {
  font-size: 18px !important;
  line-height: 1.2 !important;
  gap: 8px !important;
}
.ask-input-block-split .ask-title-mark {
  font-size: 32px !important;
  line-height: 1 !important;
}
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-top: 4px !important;
}

/* Revert head to absolute top-left corner of the card; bump the
   SARA glyph (4-circle SVG) bigger. */
.ask-input-block-split .ask-input-wrap .ask-head {
  position: absolute !important;
  top: -134px !important;
  left: -2px !important;
  margin: 0 !important;
}
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-top: 14px !important;
}
.ask-input-block-split .ask-title .sara-glyph {
  width: 44px !important;
  height: 44px !important;
}

/* Bigger glyph pushed head down; nudge top to keep corner alignment */
.ask-input-block-split .ask-input-wrap .ask-head {
  top: -160px !important;
}

/* Match the glyph to the x-height of "a" in "Sara" (32 px Fraunces) */
.ask-input-block-split .ask-title .sara-glyph {
  width: 24px !important;
  height: 24px !important;
}

/* Pull the input column up under the title.  Card grid row 1
   shrinks so input-main (row 2) starts right after the title's
   ~60 px footprint instead of 150 px below it. */
.ask-input-block-split {
  grid-template-rows: 60px auto !important;
}
.ask-input-block-split .ask-input-wrap .ask-head {
  top: -44px !important;   /* re-tune corner alignment for new row 1 */
}

/* Disable the watermark fade -- title stays full-strength even
   when the user is typing. */
.ask-input-block-split .ask-input-wrap:has(.ask-input:not(:placeholder-shown)) .ask-head {
  opacity: 1 !important;
  filter: none !important;
}

/* Pull title further up toward the card top-left corner */
.ask-input-block-split .ask-input-wrap .ask-head {
  top: -78px !important;
}

/* Shrink row 1 further so the textarea row sits right under
   the title (head no longer hangs above an empty band). */
.ask-input-block-split {
  grid-template-rows: 12px auto !important;
}

/* Re-tune: row 1 small but not zero; head top tuned to land at
   the card's top-left corner; textarea pulled up via reduced
   input-main margin so placeholder hugs the title. */
.ask-input-block-split {
  grid-template-rows: 30px auto !important;
}
.ask-input-block-split .ask-input-wrap .ask-head {
  top: -48px !important;
}
.ask-input-block-split .ask-input-main {
  margin-top: -10px !important;
}

/* Undo the negative input-main margin -- it pulled chips + foot
   up too, leaving empty space at the card's bottom. Keep title
   at the corner; placeholder gap stays modest via the row-1
   sizing alone. */
.ask-input-block-split .ask-input-main {
  margin-top: 0 !important;
}

/* Revert grid-template-rows -- let row 1 size naturally (it
   absorbs the sidebar's intrinsic height again).  Re-tune head
   top to land at card corner under that natural row 1. */
.ask-input-block-split {
  grid-template-rows: auto auto !important;
}
.ask-input-block-split .ask-input-wrap .ask-head {
  top: -134px !important;
}

/* Re-tune top for current grid */
.ask-input-block-split .ask-input-wrap .ask-head {
  top: -159px !important;
}

/* Collapse the card grid to a single row.  Both input-main and
   sidebar live in row 1 / their own columns, so input-main now
   starts at the card top and the textarea sits right under the
   title.  Title stays absolute-anchored to the card corner. */
.ask-input-block-split {
  grid-template-rows: auto !important;
}
.ask-input-block-split .ask-input-main {
  grid-row: 1 !important;
}
.ask-input-block-split .ask-sidebar-embedded {
  grid-row: 1 !important;
}
.ask-input-block-split .ask-input-wrap .ask-head {
  top: 16px !important;
  left: 18px !important;
}
.ask-input-block-split .ask-input-wrap .ask-input {
  padding-top: 60px !important;
}

/* Wipe stale grid-related properties on head so the absolute
   positioning behaves predictably. */
.ask-input-block-split .ask-input-wrap .ask-head {
  grid-row: auto !important;
  grid-column: auto !important;
  align-self: auto !important;
  justify-self: auto !important;
}

/* Input-main is now in row 1 alongside the sidebar (which is
   taller).  Stretch input-main to match and push the mode chips
   to the bottom so the card doesn't end with empty space. */
.ask-input-block-split .ask-input-main {
  display: flex !important;
  flex-direction: column !important;
  align-self: stretch !important;
}
.ask-input-block-split .ask-input-main > .ask-mode-chips-wrap {
  margin-top: auto !important;
}

/* Move the auto top-margin from chips to the foot row so the
   Attach pill stays glued to the chips at the bottom of the
   column.  Empty space goes above the foot group, not between
   foot and chips. */
.ask-input-block-split .ask-input-main > .ask-mode-chips-wrap {
  margin-top: 0 !important;
}
.ask-input-block-split .ask-input-main > .ask-input-foot {
  margin-top: auto !important;
}

/* Drop the auto-margin trick entirely; let the textarea flex
   to fill the remaining height so there's no empty band
   anywhere. */
.ask-input-block-split .ask-input-main > .ask-input-foot {
  margin-top: 0 !important;
}
.ask-input-block-split .ask-input-wrap {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
}
.ask-input-block-split .ask-input-wrap .ask-input {
  flex: 1 1 auto !important;
}

/* Placeholder example slightly bigger; Attach pill label
   smaller so the title's example reads as the main content
   and the Attach line recedes into utility. */
.ask-input-block-split .ask-input-wrap .ask-input,
.ask-input-block-split .ask-input-wrap .ask-input::placeholder {
  font-size: 14px !important;
}
.ask-input-block-split .ask-attach-label {
  font-size: 11px !important;
}

/* Sara identity moves to plum #6E3C5C (was coral) so the
   wordmark + glyph read distinct from Claude-family terracotta.
   Mode chips, process-mapping chips, and Attach hover stay
   coral. */
.ask-input-block-split .ask-title-mark { color: #6E3C5C !important; }
.ask-input-block-split .sara-glyph { color: #6E3C5C !important; }
.ask-input-block-split .sara-glyph-inline { color: #6E3C5C !important; }
.ask-input-block-split .ask-side-desc em { color: #6E3C5C !important; }
.ask-input-block-split .ask-side-desc b,
.ask-input-block-split .ask-side-desc strong { color: #6E3C5C !important; }
.ask-input-block-split .sense-plan-link { color: #6E3C5C !important; border-bottom-color: #6E3C5C !important; }
.ask-input-block-split .ask-input { caret-color: #6E3C5C !important; }

/* Quick-advice result lives INSIDE the inquiry card.  Hide the
   input column + sidebar so the answer fills the card; show an
   "Edit inquiry" toggle that pops the form back open. */
.ask-input-block-split.has-quick-result .ask-input-main,
.ask-input-block-split.has-quick-result .ask-sidebar-embedded {
  display: none !important;
}
.ask-input-block-split.has-quick-result {
  display: block !important;
  padding: 24px !important;
}
.ask-input-block-split.has-quick-result #askResults {
  display: block !important;
  position: static !important;
  background: transparent !important;
  padding: 0 !important;
  margin-top: 12px !important;
}
.ask-edit-inquiry-toggle {
  display: none;
}
.ask-input-block-split.has-quick-result .ask-edit-inquiry-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  position: absolute;
  top: 16px;
  right: 18px;
  padding: 6px 12px;
  font-size: 11px;
  font-weight: 600;
  color: #6E3C5C;
  background: rgba(110, 60, 92, 0.08);
  border: 1px solid rgba(110, 60, 92, 0.25);
  border-radius: 999px;
  cursor: pointer;
  transition: background 150ms;
}
.ask-input-block-split.has-quick-result .ask-edit-inquiry-toggle:hover {
  background: rgba(110, 60, 92, 0.16);
}

/* Quick-result refinement: result sits where the textarea was
   (inside input-main, above foot/chips).  Workflow + process +
   budget sections hide; Sources card nests inside the Answer
   card via JS, so only Answer-with-citations is visible. */
.ask-input-block-split.has-quick-result {
  display: grid !important;
  padding: 0 !important;
}
.ask-input-block-split.has-quick-result .ask-input-wrap {
  display: none !important;
}
.ask-input-block-split.has-quick-result .ask-input-main,
.ask-input-block-split.has-quick-result .ask-sidebar-embedded {
  display: flex !important;
}
.ask-input-block-split.has-quick-result #askResults {
  display: block !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
  background: transparent !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-process-card,
.ask-input-block-split.has-quick-result #askResults .ask-grid {
  display: none !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid rgba(110, 60, 92, 0.18);
}

/* Quick-result Sources: tight inline list under the answer body. */
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources {
  margin-top: 10px !important;
  padding-top: 8px !important;
  border-top: 1px dashed rgba(110, 60, 92, 0.2) !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-section-head {
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: rgba(110, 60, 92, 0.7) !important;
  margin: 0 0 6px !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-item {
  display: grid !important;
  grid-template-columns: 18px 1fr !important;
  gap: 6px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  font-size: 11.5px !important;
  line-height: 1.4 !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-num {
  font-size: 10px !important;
  font-weight: 600 !important;
  padding: 0 !important;
  width: 18px !important;
  height: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: rgba(110, 60, 92, 0.1) !important;
  color: #6E3C5C !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-item-head {
  display: inline-flex !important;
  gap: 6px !important;
  align-items: center !important;
  margin: 0 !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-tier {
  font-size: 9px !important;
  padding: 1px 5px !important;
  border-radius: 3px !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-cite {
  font-size: 10.5px !important;
  color: rgba(0, 0, 0, 0.5) !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-title {
  font-size: 11.5px !important;
  font-weight: 500 !important;
  margin-top: 1px !important;
  display: block !important;
}

/* Quick-result: hide attach pill + mode chips, put Edit inquiry
   pill at the bottom (where the chips used to sit). */
.ask-input-block-split.has-quick-result .ask-input-foot,
.ask-input-block-split.has-quick-result .ask-mode-chips-wrap {
  display: none !important;
}
.ask-input-block-split.has-quick-result .ask-edit-inquiry-toggle {
  position: static !important;
  align-self: flex-start !important;
  margin: 18px 0 4px 18px !important;
  padding: 8px 16px !important;
  font-size: 12px !important;
}

/* Inquiry recap collapsible at top of answer card */
.ask-input-block-split.has-quick-result #askResults .ask-inquiry-recap {
  margin: 0 0 12px;
  padding: 8px 12px;
  background: rgba(110, 60, 92, 0.05);
  border: 1px solid rgba(110, 60, 92, 0.15);
  border-radius: 8px;
  font-size: 12px;
}
.ask-input-block-split.has-quick-result #askResults .ask-inquiry-recap-summary {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(110, 60, 92, 0.75);
  cursor: pointer;
  list-style: none;
}
.ask-input-block-split.has-quick-result #askResults .ask-inquiry-recap-summary::-webkit-details-marker {
  display: none;
}
.ask-input-block-split.has-quick-result #askResults .ask-inquiry-recap-summary::before {
  content: "▸ ";
  font-size: 10px;
  margin-right: 2px;
}
.ask-input-block-split.has-quick-result #askResults .ask-inquiry-recap[open] .ask-inquiry-recap-summary::before {
  content: "▾ ";
}
.ask-input-block-split.has-quick-result #askResults .ask-inquiry-recap-body {
  margin: 6px 0 0;
  padding: 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--text-dark);
  white-space: pre-wrap;
}

/* Answer body: lighter font for less weight on the screen */
.ask-input-block-split.has-quick-result #askResults .ask-answer-body {
  font-size: 13.5px !important;
  line-height: 1.55 !important;
}

/* Source item collapses to a single line: number + title + tier chip */
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-item {
  grid-template-columns: 18px 1fr auto !important;
  align-items: center !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-item-main {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-item-head {
  display: contents !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-cite {
  display: none !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-title {
  margin: 0 !important;
  flex: 1 1 auto !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-tier {
  order: 2 !important;
  flex-shrink: 0 !important;
}

/* Show the publication citation (year + author/journal) inline
   after the article title, dash-separated. */
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-cite {
  display: inline !important;
  font-size: 10.5px !important;
  font-style: italic !important;
  color: rgba(0, 0, 0, 0.55) !important;
  margin-left: 6px !important;
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-cite::before {
  content: "· ";
  margin-right: 2px;
  opacity: 0.6;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-title {
  flex: 0 1 auto !important;
  min-width: 0 !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-answer-card .ask-sources .ask-source-item-main {
  white-space: normal !important;
}

/* Keep .ask-input-wrap visible so the title (inside it) stays
   above the answer; hide just the textarea element. */
.ask-input-block-split.has-quick-result .ask-input-wrap {
  display: flex !important;
}
.ask-input-block-split.has-quick-result .ask-input-wrap .ask-input {
  display: none !important;
}

/* In quick-result mode the title flows naturally above the
   answer card.  Drop its absolute offsets so it sits at top of
   the visible wrap (textarea is hidden, so head is the only
   wrap child rendering). */
.ask-input-block-split.has-quick-result .ask-input-wrap .ask-head {
  position: static !important;
  top: auto !important;
  left: auto !important;
  margin: 0 0 12px !important;
}

/* Quick-result conversational chat bubbles.  #askResults becomes
   a vertical flex stack: user bubble (plum tint, flex-end) on
   top, Sara bubble (white, flex-start) below. */
.ask-input-block-split.has-quick-result #askResults {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-bubble {
  padding: 10px 14px !important;
  border-radius: 16px !important;
  margin: 0 !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-bubble-user {
  align-self: flex-end !important;
  max-width: 78% !important;
  background: rgba(110, 60, 92, 0.1) !important;
  color: #2A2A26 !important;
  border-top-right-radius: 4px !important;
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
}
.ask-input-block-split.has-quick-result #askResults .ask-bubble-sara.ask-answer-card {
  align-self: flex-start !important;
  width: 95% !important;
  max-width: 95% !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  border-top-left-radius: 4px !important;
}

/* Pin the title at the top of the input column and scroll the
   chat thread underneath it.  Card height is fixed via the
   input-main flex column; results becomes the scrolling region. */
.ask-input-block-split.has-quick-result .ask-input-main {
  max-height: 600px !important;
  overflow: hidden !important;
}
.ask-input-block-split.has-quick-result .ask-input-wrap {
  flex: 0 0 auto !important;
}
.ask-input-block-split.has-quick-result .ask-input-wrap .ask-head {
  position: sticky !important;
  top: 0 !important;
  background: var(--lab-bg, #FFFFFF) !important;
  z-index: 4 !important;
  padding-bottom: 8px !important;
  margin-bottom: 0 !important;
}
.ask-input-block-split.has-quick-result #askResults {
  flex: 1 1 auto !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  min-height: 0 !important;
  padding-right: 4px !important;
}
/* Slim scrollbar */
.ask-input-block-split.has-quick-result #askResults::-webkit-scrollbar {
  width: 6px;
}
.ask-input-block-split.has-quick-result #askResults::-webkit-scrollbar-thumb {
  background: rgba(110, 60, 92, 0.2);
  border-radius: 3px;
}
.ask-input-block-split.has-quick-result #askResults::-webkit-scrollbar-thumb:hover {
  background: rgba(110, 60, 92, 0.35);
}

/* Keep the inquiry surface stable -- attach pill + mode chips
   stay visible alongside the chat thread.  Edit inquiry pill
   hides since the form is already always there. */
.ask-input-block-split.has-quick-result .ask-input-foot,
.ask-input-block-split.has-quick-result .ask-mode-chips-wrap {
  display: flex !important;
}
.ask-input-block-split.has-quick-result .ask-edit-inquiry-toggle {
  display: none !important;
}
/* Textarea stays visible too -- the answer thread sits above it */
.ask-input-block-split.has-quick-result .ask-input-wrap .ask-input {
  display: block !important;
  min-height: 80px !important;
}

/* Revert -- textarea + foot + chips hide when an output shows.
   The typed inquiry text becomes a user bubble in their place;
   the answer bubble appears below.  Edit inquiry pill returns
   so the user can go back to the form. */
.ask-input-block-split.has-quick-result .ask-input-wrap .ask-input {
  display: none !important;
}
.ask-input-block-split.has-quick-result .ask-input-foot,
.ask-input-block-split.has-quick-result .ask-mode-chips-wrap {
  display: none !important;
}
.ask-input-block-split.has-quick-result .ask-edit-inquiry-toggle {
  display: inline-flex !important;
}

/* Restore card padding so the chat thread doesn't run into the
   card's right edge. */
.ask-input-block-split.has-quick-result {
  padding: 16px !important;
}

/* Chronological order: user inquiry bubble sits ABOVE Sara's
   answer card so the inquiry stays visible even when the answer
   carries a long structured block (workflow stages, verify list).
   Earlier we used column-reverse so the answer floated on top,
   but with the structured payload the bubble would clip off the
   bottom of the 600 px input pane. */
.ask-input-block-split.has-quick-result #askResults {
  flex-direction: column !important;
}

/* Process Mapping Review modal -- align button colors with the
   new plum (Sara identity) palette. */
body[data-plan="free"] .pmap-card .pmap-toggle-btn.active {
  background: #6E3C5C !important;
  border-color: #6E3C5C !important;
  color: #FFFFFF !important;
}
body[data-plan="free"] .pmap-card .pmap-toggle-btn:not(.active):hover {
  background: rgba(110, 60, 92, 0.06) !important;
  border-color: rgba(110, 60, 92, 0.35) !important;
  color: #6E3C5C !important;
}
body[data-plan="free"] .pmap-card #btnPmapAsk,
body[data-plan="free"] .pmap-card .btn.btn-primary {
  background: #6E3C5C !important;
  border-color: #6E3C5C !important;
  color: #FFFFFF !important;
}
body[data-plan="free"] .pmap-card #btnPmapAsk:hover,
body[data-plan="free"] .pmap-card .btn.btn-primary:hover {
  background: #5C2F4D !important;
  border-color: #5C2F4D !important;
}
body[data-plan="free"] .pmap-card #btnPmapCancel,
body[data-plan="free"] .pmap-card .btn.btn-ghost {
  background: #FFFFFF !important;
  border: 1px solid rgba(110, 60, 92, 0.25) !important;
  color: #6E3C5C !important;
}
body[data-plan="free"] .pmap-card #btnPmapCancel:hover,
body[data-plan="free"] .pmap-card .btn.btn-ghost:hover {
  background: rgba(110, 60, 92, 0.06) !important;
  border-color: rgba(110, 60, 92, 0.4) !important;
}
/* Header title + check icon accents */
body[data-plan="free"] .pmap-card #pmapTitle {
  color: #6E3C5C !important;
}

/* Workflow design structured summary inside the Sara bubble */
.ask-input-block-split.has-quick-result #askResults .ask-bubble-workflow {
  margin-top: 12px;
  padding: 12px 14px;
  background: rgba(110, 60, 92, 0.04);
  border: 1px solid rgba(110, 60, 92, 0.15);
  border-radius: 10px;
}
.ask-input-block-split.has-quick-result #askResults .bw-head {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(110, 60, 92, 0.8);
  margin: 0 0 8px;
}
.ask-input-block-split.has-quick-result #askResults .bw-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ask-input-block-split.has-quick-result #askResults .bw-item {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 8px;
  align-items: start;
}
.ask-input-block-split.has-quick-result #askResults .bw-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #6E3C5C;
  color: #FFFFFF;
  font-size: 11px;
  font-weight: 700;
}
.ask-input-block-split.has-quick-result #askResults .bw-stage {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(110, 60, 92, 0.85);
}
.ask-input-block-split.has-quick-result #askResults .bw-pick {
  font-size: 13px;
  line-height: 1.45;
  color: var(--text-dark);
  margin-top: 2px;
}

/* Draft verification structured summary */
.ask-input-block-split.has-quick-result #askResults .ask-bubble-verify {
  margin-top: 12px;
  padding: 12px 14px;
  background: rgba(110, 60, 92, 0.04);
  border: 1px solid rgba(110, 60, 92, 0.15);
  border-radius: 10px;
}
.ask-input-block-split.has-quick-result #askResults .bv-head {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #B85F44;
  margin: 0 0 8px;
}
.ask-input-block-split.has-quick-result #askResults .bv-head-review {
  margin-top: 12px;
  color: rgba(110, 60, 92, 0.75);
}
.ask-input-block-split.has-quick-result #askResults .bv-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ask-input-block-split.has-quick-result #askResults .bv-item {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 8px;
  align-items: start;
}
.ask-input-block-split.has-quick-result #askResults .bv-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
}
.ask-input-block-split.has-quick-result #askResults .bv-tag-fix {
  background: #B85F44;
  color: #FFFFFF;
}
.ask-input-block-split.has-quick-result #askResults .bv-tag-review {
  background: rgba(110, 60, 92, 0.12);
  color: #6E3C5C;
}
.ask-input-block-split.has-quick-result #askResults .bv-stage {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(110, 60, 92, 0.85);
}
.ask-input-block-split.has-quick-result #askResults .bv-note {
  font-size: 13px;
  line-height: 1.45;
  color: var(--text-dark);
  margin-top: 2px;
}

/* Workflow + verify modes already have a structured summary
   inside the Sara bubble.  Hide the narrative paragraph so the
   bubble shows only the structured output; the prose still goes
   into the downloaded note for the full record. */
.ask-input-block-split.has-quick-result #askResults[data-mode="workflow"] .ask-answer-body,
.ask-input-block-split.has-quick-result #askResults[data-mode="verify"] .ask-answer-body {
  display: none !important;
}

/* Workflow stage card extras: reliability tier + rationale + source */
.ask-input-block-split.has-quick-result #askResults .bw-stage-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ask-input-block-split.has-quick-result #askResults .bw-tier {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 2px 6px;
  border-radius: 4px;
  text-transform: uppercase;
}
.ask-input-block-split.has-quick-result #askResults .bw-tier-strong {
  background: rgba(45, 92, 61, 0.12);
  color: #2D5C3D;
}
.ask-input-block-split.has-quick-result #askResults .bw-tier-ok {
  background: rgba(110, 60, 92, 0.12);
  color: #6E3C5C;
}
.ask-input-block-split.has-quick-result #askResults .bw-tier-weak {
  background: rgba(184, 95, 68, 0.14);
  color: #B85F44;
}
.ask-input-block-split.has-quick-result #askResults .bw-rationale {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed rgba(110, 60, 92, 0.18);
}
.ask-input-block-split.has-quick-result #askResults .bw-rationale-summary {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(110, 60, 92, 0.75);
  cursor: pointer;
  list-style: none;
}
.ask-input-block-split.has-quick-result #askResults .bw-rationale-summary::-webkit-details-marker {
  display: none;
}
.ask-input-block-split.has-quick-result #askResults .bw-rationale-summary::before {
  content: "▸ ";
  margin-right: 2px;
  font-size: 10px;
}
.ask-input-block-split.has-quick-result #askResults .bw-rationale[open] .bw-rationale-summary::before {
  content: "▾ ";
}
.ask-input-block-split.has-quick-result #askResults .bw-rationale-text {
  margin: 6px 0 6px;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--text-dark);
}
.ask-input-block-split.has-quick-result #askResults .bw-source {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 4px 8px;
  background: rgba(110, 60, 92, 0.06);
  border-radius: 6px;
  text-decoration: none;
  font-size: 11.5px;
  color: var(--text-dark);
}
.ask-input-block-split.has-quick-result #askResults .bw-source:hover {
  background: rgba(110, 60, 92, 0.12);
}
.ask-input-block-split.has-quick-result #askResults .bw-source-num {
  font-weight: 700;
  color: #6E3C5C;
}
.ask-input-block-split.has-quick-result #askResults .bw-source-cite {
  font-style: italic;
  color: rgba(0, 0, 0, 0.6);
}
.ask-input-block-split.has-quick-result #askResults .bw-source-title {
  color: var(--text-dark);
}

/* Working-from fixed-parameter strip above the workflow list */
.ask-input-block-split.has-quick-result #askResults .bw-fixed {
  margin: 0 0 12px;
  padding: 8px 10px;
  background: rgba(110, 60, 92, 0.06);
  border-left: 2px solid #6E3C5C;
  border-radius: 0 6px 6px 0;
}
.ask-input-block-split.has-quick-result #askResults .bw-fixed-head {
  display: block;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(110, 60, 92, 0.75);
  margin-bottom: 4px;
}
.ask-input-block-split.has-quick-result #askResults .bw-fixed-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
}
.ask-input-block-split.has-quick-result #askResults .bw-fixed-item {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-size: 11.5px;
}
.ask-input-block-split.has-quick-result #askResults .bw-fixed-name {
  font-weight: 600;
  color: rgba(110, 60, 92, 0.8);
}
.ask-input-block-split.has-quick-result #askResults .bw-fixed-val {
  color: var(--text-dark);
}

/* Compact source reference and alternatives list */
.ask-input-block-split.has-quick-result #askResults .bw-srcref {
  display: inline-block;
  vertical-align: baseline;
  padding: 0 4px;
  margin-left: 2px;
  font-size: 10.5px;
  font-weight: 700;
  color: #6E3C5C;
  background: rgba(110, 60, 92, 0.1);
  border-radius: 3px;
  text-decoration: none;
}
.ask-input-block-split.has-quick-result #askResults .bw-srcref:hover {
  background: rgba(110, 60, 92, 0.18);
}
.ask-input-block-split.has-quick-result #askResults .bw-alts {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed rgba(110, 60, 92, 0.18);
}
.ask-input-block-split.has-quick-result #askResults .bw-alts-head {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(110, 60, 92, 0.65);
  margin-bottom: 6px;
}
.ask-input-block-split.has-quick-result #askResults .bw-alts-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ask-input-block-split.has-quick-result #askResults .bw-alt-row {
  display: flex;
  align-items: center;
  gap: 6px;
}
.ask-input-block-split.has-quick-result #askResults .bw-alt-name {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-dark);
}
.ask-input-block-split.has-quick-result #askResults .bw-alt-rat {
  font-size: 11.5px;
  line-height: 1.45;
  color: rgba(0, 0, 0, 0.7);
  margin-top: 2px;
}
