:root {
  /* -------- PALETTE (cleaned up 2026-06-24) -----------------------------
     Same warm "dossier" identity, but easier on the eyes for long sessions:
     a soft warm charcoal instead of harsh pure-black, panels lifted so they
     read as cards, borders you can actually see, and — the big one — a muted
     grey with real contrast (the old #6b6a64 was barely legible). Accents
     softened a touch so the reds stop shouting.
     --------------------------------------------------------------------- */
  --bg: #16161a;        /* was #08090a — warm charcoal, not a black hole */
  --surface: #1e1e24;   /* panels sit just above the page */
  --hair: #2e2d35;      /* subtle but visible borders */
  --hair-2: #3d3c46;
  --bone: #ebe8e2;      /* bright warm white — body text */
  --muted: #9c988f;     /* readable now (was #6b6a64, too dim) */
  --dossier-red: #df5e51;    /* softer coral-red, still an alert */
  --dossier-amber: #e2b24c;  /* clean gold */
  --dossier-olive: #82b35e;  /* fresh green for the wins */
  /* -------- TYPE STACK (read me) ----------------------------------------
     --display:    Archivo Narrow  → big headings, company names, brand
                                     wordmarks. Condensed, authoritative.
     --mono:       JetBrains Mono  → DATA — phone numbers, postcodes,
                                     filing codes, signal evidence, all
                                     monospaced tables and pills.
     --read:       Inter           → BODY TEXT to be read by humans.
                                     Pitches, voicemail/email scripts,
                                     master brief paragraphs, case-file
                                     synthesis. Friendlier than the old
                                     Special Elite typewriter font.
     --typewriter: alias of --read for back-compat with existing classes.
     ------------------------------------------------------------------- */
  --mono: "JetBrains Mono", monospace;
  --display: "Archivo Narrow", sans-serif;
  --read: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --typewriter: var(--read);  /* alias — existing .typewriter classes resolve here */
}

html, body {
  margin: 0;
  background: var(--bg);
  color: var(--bone);
  /* Body copy is Inter now (was the condensed display face) — far easier to
     read. Headings still set --display / --mono explicitly, so they're unchanged. */
  font-family: var(--read);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="160" height="160"><filter id="n"><feTurbulence baseFrequency="0.9" numOctaves="1" stitchTiles="stitch"/></filter><rect width="100%25" height="100%25" filter="url(%23n)" opacity="0.03"/></svg>');
  opacity: 0.03;
}

#app {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 14px;
  box-sizing: border-box;
  gap: 12px;
}

/* === classification banner === */
.classification {
  height: 32px;
  border-top: 1px solid var(--hair);
  border-bottom: 1px solid var(--hair);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  position: relative;
  overflow: hidden;
}
.classification::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.02) 1px, transparent 1px, transparent 6px);
  opacity: 0.04;
  pointer-events: none;
}
.class-left { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 8px; }
.class-actions { display: flex; gap: 8px; align-items: center; }

/* === buttons === */
.btn {
  font-family: var(--display);
  font-size: 11px;
  color: var(--bone);
  background: transparent;
  border: 1px solid var(--bone);
  padding: 6px 8px;
  cursor: pointer;
  border-radius: 2px;
  line-height: 1;
  letter-spacing: 0.05em;
  text-decoration: none;
  display: inline-block;
}
.btn:hover { background: var(--bone); color: var(--surface); }
.btn.small { padding: 4px 6px; font-size: 11px; }

/* === hero === */
.hero, .dashboard-hero {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 20px;
  align-items: center;
  background: var(--surface);
  border-top: 1px solid var(--hair);
  padding: 16px;
  box-sizing: border-box;
}
.dashboard-hero { grid-template-columns: 1fr; }
.company-name-area { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.company-name.big-display {
  font-family: var(--display);
  font-weight: 700;
  font-size: 22px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.status-stamp {
  border: 1px solid var(--dossier-red);
  color: var(--dossier-red);
  padding: 6px 8px;
  font-family: var(--mono);
  font-size: 11px;
  transform: rotate(-1.5deg);
  letter-spacing: 0.08em;
  border-radius: 2px;
}
.company-meta {
  margin-top: 6px;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

/* === gauge === */
.hero-right { display: flex; justify-content: center; align-items: center; }
.score-gauge { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.gauge-svg { width: 72px; height: 220px; overflow: visible; }
.gauge-svg .track { fill: transparent; stroke: var(--hair); stroke-width: 1.5; }
.gauge-svg .fill { fill: url(#ggrad); }
.gauge-svg .ticks line { stroke: var(--hair); stroke-width: 0.8; }
.tick-label { font-family: var(--mono); font-size: 8px; fill: var(--muted); }
.score-readout { display: flex; align-items: baseline; gap: 6px; }
.score-value { font-family: var(--display); font-size: 64px; line-height: 1; color: var(--dossier-red); font-weight: 700; }
.score-max { font-family: var(--mono); font-size: 14px; color: var(--muted); margin-bottom: 8px; }
.score-meta { font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); font-family: var(--mono); }

/* === main case layout (3 col) === */
.doc-area {
  display: grid;
  grid-template-columns: 280px 1fr 340px;
  gap: 16px;
  align-items: start;
  flex: 1 1 auto;
}
.dashboard-area { flex: 1 1 auto; }
.panel {
  background: var(--surface);
  border: 1px solid var(--hair);
  padding: 12px;
  box-sizing: border-box;
  margin-bottom: 12px;
}
.display-small {
  font-family: var(--display);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.smallcaps {
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--muted);
}
.panel-title { padding-bottom: 8px; border-bottom: 1px solid var(--hair); margin-bottom: 8px; }

/* === subject file === */
.file-list { display: flex; flex-direction: column; gap: 6px; }
.file-list .row { display: flex; gap: 8px; align-items: flex-start; border-top: 1px solid var(--hair); padding-top: 6px; }
.file-list .row:first-child { border-top: none; padding-top: 0; }
.file-list dt { width: 110px; color: var(--muted); font-family: var(--mono); font-size: 10px; text-transform: uppercase; flex-shrink: 0; }
.file-list dd { margin: 0; font-family: var(--mono); color: var(--bone); font-size: 12px; }
.red { color: var(--dossier-red); font-weight: 700; }

/* === actions panel === */
.actions-panel .action-form { display: inline-block; margin-right: 4px; margin-bottom: 4px; }
.actions-log { margin-top: 12px; padding-top: 8px; border-top: 1px solid var(--hair); }
.action-row { font-size: 11px; color: var(--muted); padding: 2px 0; }

/* === signal stack === */
.timeline { display: flex; flex-direction: column; gap: 10px; max-height: 70vh; overflow: auto; padding-right: 6px; }
.signal-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: var(--surface);
  border: 1px solid var(--hair);
  padding: 10px;
  box-sizing: border-box;
  transform: translateY(6px);
  opacity: 0;
  transition: transform 240ms ease, opacity 240ms ease, border-color 160ms ease;
  border-left: 3px solid transparent;
}
.signal-card.signal-visible { transform: translateY(0); opacity: 1; }
.signal-card:hover { border-color: var(--hair-2); }
.signal-card.w-high { padding: 14px; }
.signal-card.w-large { padding: 12px; }
.signal-card.w-mid { padding: 10px; }
.signal-card.w-small { padding: 8px; }
.sig-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.sig-title { font-family: var(--display); font-size: 13px; color: var(--bone); text-transform: uppercase; letter-spacing: 0.05em; }
.sig-body { color: var(--bone); font-family: var(--mono); font-size: 12px; }
.weight-red { border-left-color: var(--dossier-red); }
.weight-amber { border-left-color: var(--dossier-amber); }
.weight-olive { border-left-color: var(--dossier-olive); }
.weight { font-family: var(--mono); color: var(--dossier-amber); font-weight: 700; }

/* === reading + evidence === */
.reading .memo {
  padding: 10px;
  border: 1px solid rgba(255,255,255,0.02);
  margin-top: 8px;
}
/* Body reading text — Inter humanist sans, slight letter-spacing for breathing room */
.typewriter {
  font-family: var(--read);
  font-size: 14px;
  line-height: 1.6;
  letter-spacing: 0.005em;
  color: var(--bone);
  font-weight: 400;
}
.underline-red { border-bottom: 2px solid rgba(200,50,40,0.18); padding-bottom: 6px; margin-bottom: 6px; }
.subhead { margin-top: 10px; color: var(--muted); font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; }
.call-script {
  margin-top: 8px;
  font-style: normal;
  font-family: var(--typewriter);
  color: var(--bone);
  padding-left: 8px;
  border-left: 2px solid rgba(200,50,40,0.4);
  margin-left: 0;
}

.evidence-list { display: flex; flex-direction: column; gap: 6px; }
.ev-row { display: flex; align-items: center; gap: 8px; border-top: 1px solid var(--hair); padding: 6px 0; }
.ev-row:first-child { border-top: none; }
.ev-date { width: 92px; color: var(--muted); font-family: var(--mono); font-size: 11px; flex-shrink: 0; }
.ev-desc { color: var(--bone); font-size: 12px; flex: 1; font-family: var(--mono); }
.ev-source { border: 1px solid var(--hair); padding: 2px 6px; font-size: 10px; color: var(--muted); font-family: var(--mono); border-radius: 2px; flex-shrink: 0; }

/* =================================================================
   CASE FILE LAYOUT V2 (2026-05-11) — compact hero, story-first,
   collapsible evidence grid, mobile-aware.
   ================================================================= */

.hero-v2 {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 20px;
  align-items: center;
  padding: 14px 16px;
}
.hero-meta { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.company-name-line { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.company-keyfacts {
  display: flex; gap: 10px; flex-wrap: wrap;
  font-size: 11px; color: var(--muted);
  letter-spacing: 0.06em; text-transform: uppercase;
}
.company-keyfacts span { white-space: nowrap; }
.hero-score {
  display: flex; flex-direction: column; align-items: flex-end; gap: 6px; min-width: 200px;
}
.score-box { display: flex; align-items: baseline; gap: 6px; }
.score-box .score-value {
  font-size: 56px; line-height: 1; font-weight: 700;
  color: var(--dossier-red); font-family: var(--display);
}
.score-box .score-max { font-family: var(--mono); color: var(--muted); font-size: 14px; }
.score-bar {
  width: 200px; height: 5px; background: var(--hair); border-radius: 1px; overflow: hidden;
  border: 1px solid var(--hair-2);
}
.score-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--dossier-olive) 0%, var(--dossier-amber) 60%, var(--dossier-red) 100%);
}
.score-meta { font-size: 10px; }

/* Action strip — replaces left-column actions panel */
.action-strip {
  display: flex; gap: 6px; align-items: center; flex-wrap: wrap;
  padding: 8px 14px;
  border-top: 1px solid var(--hair); border-bottom: 1px solid var(--hair);
  background: rgba(255,255,255,0.012);
}
.action-strip-label { font-size: 10px; margin-right: 4px; }
.action-form-inline { display: inline; margin: 0; }
.action-log-pill { font-size: 11px; margin-left: auto; }

/* Story section — Reading + Approach side-by-side */
.story-section {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 12px;
}
.story-reading, .story-approach {
  background: var(--surface); border: 1px solid var(--hair); padding: 14px;
}
.story-reading .memo { padding: 6px 4px; font-family: var(--typewriter); font-size: 14px; line-height: 1.7; }
.story-reading .memo p { margin: 0; }
.story-approach blockquote {
  font-family: var(--typewriter); font-size: 13px; line-height: 1.7;
  padding-left: 10px; border-left: 2px solid var(--dossier-red);
  margin: 8px 0 0 0;
}

/* Signal grid — full-width with weight-sized cards */
.signal-section { padding: 14px; }
.signal-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 10px;
  margin-top: 10px;
}
.signal-grid .signal-card { opacity: 1; transform: none; }

/* Evidence grid — responsive collapsible cards */
.evidence-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 12px;
}
.evidence-card {
  background: var(--surface); border: 1px solid var(--hair); padding: 0;
  border-radius: 2px; min-width: 0;
}
.evidence-card > summary {
  list-style: none;
  cursor: pointer;
  padding: 10px 14px;
  display: flex; align-items: center; gap: 10px;
  position: relative;
}
.evidence-card > summary::-webkit-details-marker { display: none; }
.evidence-card > summary::before {
  content: "+";
  font-family: var(--mono); font-size: 14px; line-height: 13px;
  width: 16px; height: 16px; text-align: center;
  border: 1px solid var(--hair-2);
  color: var(--muted);
  border-radius: 2px;
  flex-shrink: 0;
  transition: transform 120ms;
}
.evidence-card[open] > summary::before {
  content: "−"; color: var(--bone); border-color: var(--bone);
}
.evidence-card[open] > summary { border-bottom: 1px solid var(--hair); }
.evidence-card > summary:hover::before { color: var(--dossier-amber); border-color: var(--dossier-amber); }
.ev-card-title {
  font-family: var(--display); font-size: 12px;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--bone);
}
.ev-card-count {
  font-family: var(--mono); font-size: 10px;
  padding: 1px 6px;
  border: 1px solid var(--hair-2);
  border-radius: 2px;
  color: var(--muted);
}
.ev-card-count.red { color: var(--dossier-red); border-color: var(--dossier-red); }
.ev-card-summary {
  font-size: 11px; color: var(--muted); margin-left: auto;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  min-width: 0;
}
/* Direct children of details (the open content) get padding */
.evidence-card[open] > *:not(summary) {
  padding: 10px 14px;
}
.evidence-card[open] > *:not(summary):not(:last-child) {
  padding-bottom: 4px;
}

/* Tighter file-list inside evidence cards */
.evidence-card .file-list { gap: 6px; }
.evidence-card .file-list .row { padding-top: 6px; border-top: 1px solid var(--hair); }
.evidence-card .file-list .row:first-child { border-top: none; padding-top: 0; }
.evidence-card .officer-block:first-of-type { border-top: none; padding-top: 0; }

/* Mobile breakpoints */
@media (max-width: 900px) {
  .hero-v2 { grid-template-columns: 1fr; gap: 12px; }
  .hero-score { align-items: flex-start; min-width: 0; width: 100%; }
  .score-bar { width: 100%; max-width: 240px; }
  .story-section { grid-template-columns: 1fr; }
  .signal-grid { grid-template-columns: 1fr; }
  .evidence-grid { grid-template-columns: 1fr; }
  .action-strip { padding: 8px 10px; }
  .signal-section, .story-reading, .story-approach { padding: 12px; }
}
@media (max-width: 600px) {
  .company-name.big-display { font-size: 18px; }
  .score-box .score-value { font-size: 44px; }
  .signal-card { padding: 8px !important; }
  .sig-title { font-size: 12px; }
  .sig-body { font-size: 11px; }
}

/* =================================================================
   OPPORTUNITY TIERS — FREE / CHEAP / FAIR (Cherry-Pick brief §3)
   3-up boxes at top of case file, above the Caller's Pack.
   ================================================================= */
.opportunity-tiers {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
  margin-bottom: 12px;
}
.tier-box {
  background: var(--surface);
  border: 1px solid var(--hair);
  padding: 12px 14px;
  border-radius: 2px;
  min-width: 0;
}
.tier-box.tier-not-applicable { opacity: 0.45; }
.tier-header {
  display: flex; align-items: baseline; gap: 8px;
  padding-bottom: 8px;
  margin-bottom: 8px;
  border-bottom: 1px solid var(--hair);
}
.tier-label {
  font-family: var(--display); font-weight: 700;
  font-size: 16px; letter-spacing: 0.18em;
}
.tier-sub {
  font-size: 10px; letter-spacing: 0.04em;
  text-transform: uppercase;
}
.tier-free  .tier-label { color: var(--dossier-olive); }
.tier-cheap .tier-label { color: var(--dossier-amber); }
.tier-fair  .tier-label { color: var(--dossier-red); }
.tier-free  { border-left: 3px solid var(--dossier-olive); }
.tier-cheap { border-left: 3px solid var(--dossier-amber); }
.tier-fair  { border-left: 3px solid var(--dossier-red); }
.tier-box.tier-not-applicable { border-left-color: var(--hair-2); }

.tier-fields { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.tier-row { display: flex; flex-direction: column; gap: 1px; }
.tier-row dt {
  font-family: var(--mono); font-size: 9px;
  letter-spacing: 0.1em; text-transform: uppercase;
}
.tier-row dd {
  margin: 0; font-family: var(--mono);
  font-size: 12px; color: var(--bone); line-height: 1.45;
}
.tier-na {
  padding: 8px 0; font-size: 11px; line-height: 1.5;
  font-style: italic;
}

/* Mobile — stack to single column */
@media (max-width: 900px) {
  .opportunity-tiers { grid-template-columns: 1fr; }
}

/* =================================================================
   CALLER'S PACK LAYOUT (Cherry-Pick brief §4)
   ================================================================= */
.caller-pack {
  background: var(--surface);
  border: 1px solid var(--hair);
  padding: 14px 16px;
  margin-bottom: 12px;
}
.pack-header { margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--hair); }
.pack-header-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.pack-label {
  font-family: var(--display); font-size: 11px;
  letter-spacing: 0.14em; color: var(--muted);
  margin-left: auto;
}

.pack-mode {
  font-family: var(--display); font-weight: 700;
  font-size: 13px; letter-spacing: 0.12em;
  padding: 4px 10px;
  border: 1px solid currentColor;
  border-radius: 2px;
}
.pack-mode-free  { color: var(--dossier-olive); }
.pack-mode-cheap { color: var(--dossier-amber); }
.pack-mode-fair  { color: var(--dossier-red); }

.pack-priority {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.08em;
  padding: 3px 8px;
  border-radius: 2px;
  border: 1px solid currentColor;
}
.pack-priority-urgent     { color: var(--dossier-red); font-weight: 700; }
.pack-priority-this-week  { color: var(--dossier-amber); font-weight: 700; }
.pack-priority-soon       { color: var(--bone); }
.pack-priority-whenever   { color: var(--muted); }

.pack-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 18px;
}
.pack-section { min-width: 0; }
.pack-who { grid-column: span 2; }
.pack-anchor { grid-column: span 2; }
.pack-pitch { grid-column: span 2; }
.pack-objections { grid-column: span 2; }
.pack-win { grid-column: span 2; }

.pack-section-title {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.12em; color: var(--muted);
  margin-bottom: 4px;
}
.pack-body { font-family: var(--typewriter); font-size: 14px; line-height: 1.6; color: var(--bone); }

.pack-pitch-quote {
  margin: 6px 0 0 0;
  padding: 10px 12px;
  font-family: var(--typewriter); font-size: 15px; line-height: 1.65;
  color: var(--bone);
  border-left: 3px solid var(--dossier-red);
  background: rgba(255,255,255,0.012);
}

.pack-list {
  margin: 4px 0 0 0;
  padding-left: 16px;
  font-family: var(--mono); font-size: 12px; line-height: 1.55;
}
.pack-list li { margin-bottom: 3px; }
.pack-list-good li::marker { color: var(--dossier-olive); }
.pack-list-bad  li::marker { color: var(--dossier-red); }
.pack-list-bad  li { color: var(--bone); }

.pack-objection {
  padding: 8px 0;
  border-top: 1px dashed var(--hair);
}
.pack-objection:first-of-type { border-top: none; padding-top: 4px; }
.pack-obj-q { font-size: 12px; color: var(--dossier-amber); margin-bottom: 4px; }
.pack-obj-a { font-size: 13px; color: var(--bone); padding-left: 12px; line-height: 1.55; }

/* Outcome button colour-coding — wins olive, neutral bone, dead red */
.btn.btn-outcome-win     { border-color: var(--dossier-olive); color: var(--dossier-olive); }
.btn.btn-outcome-win:hover { background: var(--dossier-olive); color: var(--surface); }
.btn.btn-outcome-neutral { border-color: var(--bone); color: var(--bone); }
.btn.btn-outcome-red     { border-color: var(--dossier-red); color: var(--dossier-red); }
.btn.btn-outcome-red:hover { background: var(--dossier-red); color: var(--surface); }

.pack-fallback {
  background: rgba(200,57,42,0.04);
  border-color: var(--dossier-red);
}

/* Print-friendly — when CEO prints a Caller's Pack, hide chrome */
@media print {
  .classification, .doc-footer, .action-strip, .dashboard-area, .signal-section,
  .evidence-grid, .hero-score, .archetype-badge, .status-stamp,
  nav, .class-actions { display: none !important; }
  body, #app { background: white !important; color: black !important; padding: 0; }
  body::before { display: none !important; }
  .caller-pack {
    background: white !important; border: none !important;
    padding: 0 !important; color: black !important;
  }
  .pack-section-title, .pack-mode, .pack-priority, .pack-label { color: black !important; }
  .pack-pitch-quote {
    background: white !important; border-left-color: black !important;
    color: black !important;
  }
  .pack-body, .pack-obj-a { color: black !important; }
  .pack-obj-q { color: #555 !important; }
  .pack-list-good li::marker, .pack-list-bad li::marker { color: black !important; }
  .pack-list-bad li, .pack-list li { color: black !important; }
}

/* Mobile — collapse pack-grid to single column at narrow widths */
@media (max-width: 700px) {
  .pack-grid { grid-template-columns: 1fr; gap: 10px; }
  .pack-who, .pack-anchor, .pack-pitch, .pack-objections, .pack-win { grid-column: span 1; }
}

/* === archetype badges === */
.archetype-badge {
  display: inline-block;
  padding: 4px 8px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  border-radius: 2px;
  border: 1px solid currentColor;
  text-transform: uppercase;
  font-weight: 700;
}
.archetype-pill {
  display: inline-block;
  padding: 2px 6px;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.05em;
  border-radius: 2px;
  border: 1px solid currentColor;
  text-transform: uppercase;
  white-space: nowrap;
}
.archetype-red    { color: var(--dossier-red); }
.archetype-amber  { color: var(--dossier-amber); }
.archetype-olive  { color: var(--dossier-olive); }

/* === Cherry-Pick mode picker (Sprint C Priority 2) === */
.hero-subtitle {
  margin-top: 4px; margin-bottom: 4px;
  font-size: 11px; letter-spacing: 0.06em;
}
.mode-picker {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: 12px;
  padding: 8px 14px;
  border-top: 1px solid var(--hair);
  border-bottom: 1px solid var(--hair);
  background: rgba(255,255,255,0.012);
}
.mode-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 12px;
  font-family: var(--display); font-size: 11px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--muted);
  border: 1px solid var(--hair-2);
  border-radius: 2px;
  text-decoration: none;
}
.mode-pill:hover {
  color: var(--bone); border-color: var(--bone);
}
.mode-pill-active {
  color: var(--bone); border-color: var(--bone);
  background: rgba(255,255,255,0.04);
  font-weight: 700;
}
.mode-pill-count {
  font-size: 10px;
  padding: 1px 6px;
  border: 1px solid currentColor;
  border-radius: 2px;
  opacity: 0.7;
}
@media (max-width: 700px) {
  .mode-picker { padding: 8px 10px; gap: 6px; }
  .mode-pill { padding: 5px 8px; font-size: 10px; }
}

/* === daily brief panel === */
.daily-brief-panel {
  border-color: var(--hair-2);
  margin-bottom: 16px;
}
.brief-text {
  font-family: var(--typewriter);
  font-size: 13px;
  line-height: 1.6;
  color: var(--bone);
  white-space: pre-wrap;
  padding: 10px 6px 6px 6px;
}

/* === financial trajectory table === */
.trajectory-panel .trajectory-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--mono);
  font-size: 11px;
  margin-top: 6px;
}
.trajectory-table thead th {
  text-align: left;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.1em;
  color: var(--muted);
  text-transform: uppercase;
  padding: 4px 6px;
  border-bottom: 1px solid var(--hair);
}
.trajectory-table tbody td {
  padding: 4px 6px;
  border-bottom: 1px solid var(--hair);
  white-space: nowrap;
}
.trajectory-table tbody tr:last-child td { border-bottom: none; }
.trajectory-table tbody td.olive { color: var(--dossier-olive); }
.trajectory-table tbody td.red { color: var(--dossier-red); font-weight: 700; }

/* === officer narrative === */
.officer-block { padding: 8px 0; border-top: 1px solid var(--hair); }
.officer-block:first-of-type { border-top: none; padding-top: 4px; }
.officer-head { font-size: 13px; }
.officer-name { color: var(--bone); font-weight: 600; letter-spacing: 0.02em; }
.officer-meta { font-size: 11px; margin-top: 2px; }
.officer-portfolio { margin-top: 6px; padding-left: 8px; border-left: 1px solid var(--hair-2); }
.portfolio-row {
  font-size: 11px;
  padding: 3px 0;
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}
.portfolio-link { color: var(--bone); text-decoration: none; border-bottom: 1px dotted var(--hair-2); }
.portfolio-link:hover { color: var(--dossier-amber); border-bottom-color: var(--dossier-amber); }
.portfolio-status { font-size: 10px; padding: 1px 4px; border: 1px solid var(--hair); border-radius: 2px; }
.portfolio-score { font-size: 10px; }

/* === charges narrative === */
.bbl-banner {
  padding: 6px 8px;
  margin-bottom: 8px;
  border: 1px solid var(--dossier-red);
  background: rgba(200, 57, 42, 0.04);
  font-size: 11px;
  border-radius: 2px;
}
.charge-row { padding: 6px 0; border-top: 1px solid var(--hair); }
.charge-row:first-of-type { border-top: none; padding-top: 0; }
.charge-head {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 12px;
}
.charge-lender { color: var(--bone); font-weight: 600; }
.charge-status { font-size: 10px; padding: 1px 4px; border: 1px solid var(--hair); border-radius: 2px; }
.charge-meta { font-size: 11px; margin-top: 2px; }
.bbl-tag {
  font-size: 10px;
  padding: 1px 4px;
  color: var(--dossier-red);
  border: 1px solid var(--dossier-red);
  border-radius: 2px;
  letter-spacing: 0.05em;
}

/* === footer === */
.doc-footer {
  height: 32px;
  border-top: 1px solid var(--hair);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 12px;
  font-family: var(--mono);
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.06em;
}

.mono { font-family: var(--mono); }
.muted { color: var(--muted); }

/* === dashboard table === */
.case-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--mono);
  font-size: 12px;
}
.case-table thead th {
  text-align: left;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  color: var(--muted);
  text-transform: uppercase;
  padding: 8px 10px;
  border-bottom: 1px solid var(--hair-2);
}
.case-table tbody tr {
  border-bottom: 1px solid var(--hair);
}
.case-table tbody tr:hover { background: rgba(255,255,255,0.02); }
.case-table tbody td { padding: 8px 10px; vertical-align: middle; }
.case-table .row-flag .score-cell { color: var(--dossier-red); font-weight: 700; font-size: 14px; }
.case-table .row-watch .score-cell { color: var(--dossier-amber); font-weight: 700; }
.case-table .row-low .score-cell { color: var(--muted); }
.case-table .conf-cell { color: var(--muted); }
.row-link {
  color: var(--bone);
  text-decoration: none;
  font-family: var(--display);
  font-size: 13px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.row-link:hover { color: var(--dossier-amber); }
.signal-name { color: var(--bone); }
.actions-taken { color: var(--dossier-olive); margin-left: 4px; }

@media (max-width: 1100px) {
  .doc-area { grid-template-columns: 240px 1fr 280px; }
}
@media (max-width: 900px) {
  .doc-area { grid-template-columns: 1fr; }
  .hero { grid-template-columns: 1fr; }
}

/* =================================================================
   PREMISES PANEL — map + address card (innovation memo 2026-05-14)
   ================================================================= */
.premises-panel {
  background: var(--surface);
  border: 1px solid var(--hair);
  border-left: 3px solid var(--dossier-amber);
  padding: 12px 14px;
  margin-bottom: 12px;
  border-radius: 2px;
}
.premises-grid {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 16px;
  align-items: stretch;
}
.premises-map-wrap { min-width: 0; }
.premises-map {
  width: 100%;
  height: 200px;
  border: 1px solid var(--hair-2);
  background: #0a0c10;
  border-radius: 2px;
  overflow: hidden;
  filter: saturate(0.7) contrast(0.95);  /* keep map subordinate to dossier palette */
}
.premises-map-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.premises-meta { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.premises-label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  color: var(--dossier-amber);
  margin-bottom: 6px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--hair);
}
.premises-fields { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.prem-row { display: flex; flex-direction: column; gap: 1px; }
.prem-row dt {
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.prem-row dd {
  margin: 0;
  font-size: 12px;
  color: var(--bone);
  line-height: 1.45;
}
.prem-links { display: flex; gap: 10px; flex-wrap: wrap; }
.prem-links a {
  color: var(--bone);
  text-decoration: none;
  border: 1px solid var(--hair-2);
  padding: 2px 6px;
  font-size: 10px;
  letter-spacing: 0.08em;
  border-radius: 2px;
}
.prem-links a:hover {
  color: var(--dossier-amber);
  border-color: var(--dossier-amber);
}
/* Highlight the high-utility view links — Street View and Mapillary */
.ext-view-streetview {
  color: var(--dossier-amber) !important;
  border-color: var(--dossier-amber) !important;
  font-weight: 700;
}
.ext-view-streetview:hover {
  background: var(--dossier-amber);
  color: var(--surface) !important;
}
.ext-view-mapillary {
  color: var(--dossier-olive) !important;
  border-color: var(--dossier-olive) !important;
}
.ext-view-mapillary:hover {
  background: var(--dossier-olive);
  color: var(--surface) !important;
}

/* === Wikimedia Commons photo strip === */
.wikimedia-photos {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed var(--hair);
}
.wiki-label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  color: var(--dossier-amber);
  margin-bottom: 8px;
}
.wiki-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
}
.wiki-photo {
  display: block;
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--bg);
  border: 1px solid var(--hair);
  border-radius: 2px;
  transition: border-color 120ms, transform 120ms;
}
.wiki-photo:hover {
  border-color: var(--dossier-amber);
  transform: scale(1.02);
}
.wiki-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(0.95) saturate(0.9);
}
.wiki-note {
  margin-top: 6px;
  font-size: 10px;
  letter-spacing: 0.08em;
  opacity: 0.7;
}

/* Leaflet layer-control styling — dossier-themed */
.leaflet-control-layers {
  background: var(--surface) !important;
  border: 1px solid var(--hair-2) !important;
  color: var(--bone) !important;
}
.leaflet-control-layers-toggle {
  filter: invert(0.85) sepia(0.2);
}
.leaflet-control-layers-expanded {
  font-family: var(--mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.06em;
}
.leaflet-control-attribution {
  background: rgba(8, 9, 10, 0.75) !important;
  color: var(--muted) !important;
  font-size: 9px !important;
}
.leaflet-control-attribution a {
  color: var(--dossier-amber) !important;
}

/* Mobile — stack */
@media (max-width: 800px) {
  .premises-grid { grid-template-columns: 1fr; }
  .premises-map { height: 180px; }
}

/* =================================================================
   RESIGNATION CASCADE BANNER (pre-distress signal, innovation memo §3)
   ================================================================= */
.cascade-banner {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  margin-bottom: 12px;
  background: rgba(200, 57, 42, 0.06);
  border: 1px solid var(--dossier-red);
  border-left: 4px solid var(--dossier-red);
  border-radius: 2px;
}
.cascade-tag {
  font-family: var(--mono);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--dossier-red);
  text-transform: uppercase;
  white-space: nowrap;
  padding: 3px 8px;
  border: 1px solid var(--dossier-red);
  border-radius: 2px;
}
.cascade-text {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--bone);
  line-height: 1.5;
}
.cascade-text strong { color: var(--dossier-red); font-weight: 700; }

/* =================================================================
   OFFICER-GRAPH PANEL — "The People" (innovation memo §3 Section 2)
   ================================================================= */
.officer-panel {
  background: var(--surface);
  border: 1px solid var(--hair);
  border-left: 3px solid var(--dossier-olive);
  padding: 12px 14px;
  margin-bottom: 12px;
  border-radius: 2px;
}
.officer-panel-header {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding-bottom: 8px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--hair);
}
.officer-panel-label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  color: var(--dossier-olive);
}
.officer-panel-count { font-size: 11px; letter-spacing: 0.08em; }

.officer-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 12px;
}
.officer-cards-single { grid-template-columns: 1fr; }

.officer-card-v2 {
  background: var(--bg);
  border: 1px solid var(--hair);
  padding: 10px 12px;
  border-radius: 2px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ocv-head { display: flex; flex-direction: column; gap: 3px; }
.ocv-name {
  font-family: var(--display);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.04em;
  color: var(--bone);
  text-transform: uppercase;
}
.ocv-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--bone);
}
.ocv-meta span {
  padding: 1px 6px;
  border: 1px solid var(--hair-2);
  border-radius: 2px;
}
.ocv-meta span.muted { color: var(--muted); }
.ocv-sub { font-size: 10px; letter-spacing: 0.06em; }

.ocv-portfolio {
  padding-top: 8px;
  border-top: 1px dashed var(--hair);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ocv-portfolio-head {
  font-size: 10px;
  letter-spacing: 0.12em;
  color: var(--muted);
  margin-bottom: 2px;
}
.ocv-portfolio-head strong { color: var(--bone); font-weight: 700; }
.ocv-portfolio-head .olive { color: var(--dossier-olive); }

.ocv-portfolio-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  padding: 2px 0;
  flex-wrap: wrap;
}
.ocv-portfolio-date {
  width: 80px;
  flex-shrink: 0;
  font-size: 10px;
}
.ocv-portfolio-link {
  color: var(--bone);
  text-decoration: none;
  border-bottom: 1px dotted var(--hair-2);
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ocv-portfolio-link:hover { color: var(--dossier-amber); border-bottom-color: var(--dossier-amber); }
.ocv-portfolio-status {
  font-size: 9px;
  padding: 1px 4px;
  border: 1px solid currentColor;
  border-radius: 2px;
  letter-spacing: 0.08em;
}
.ocv-portfolio-status.red { color: var(--dossier-red); }
.ocv-portfolio-status.olive { color: var(--dossier-olive); }
.ocv-portfolio-score {
  font-size: 10px;
  color: var(--dossier-amber);
  font-weight: 700;
}
.ocv-portfolio-more, .ocv-portfolio-empty {
  font-size: 10px;
  font-style: italic;
  margin-top: 4px;
}

@media (max-width: 700px) {
  .officer-cards { grid-template-columns: 1fr; }
}

/* =================================================================
   CMD-K COMMAND PALETTE (innovation memo §4 — feature 3)
   ================================================================= */
.cmdk-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.65);
  z-index: 1000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 10vh;
  backdrop-filter: blur(2px);
}
.cmdk-overlay[hidden] { display: none; }
.cmdk-modal {
  width: min(680px, 92vw);
  background: var(--surface);
  border: 1px solid var(--hair-2);
  border-radius: 2px;
  box-shadow:
    0 24px 80px rgba(0, 0, 0, 0.7),
    0 0 0 1px rgba(232, 228, 220, 0.04),
    inset 0 0 30px rgba(212, 167, 61, 0.025);
  overflow: hidden;
}
.cmdk-input {
  width: 100%;
  box-sizing: border-box;
  background: var(--bg);
  border: none;
  border-bottom: 1px solid var(--hair-2);
  color: var(--bone);
  font-family: var(--mono);
  font-size: 16px;
  padding: 14px 16px;
  outline: none;
  letter-spacing: 0.02em;
  caret-color: var(--dossier-amber);
}
.cmdk-input::placeholder { color: var(--muted); }
.cmdk-input:focus { border-bottom-color: var(--dossier-amber); }
.cmdk-results {
  max-height: 50vh;
  overflow-y: auto;
  padding: 4px 0;
}
.cmdk-result {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 9px 14px;
  text-decoration: none;
  color: var(--bone);
  border-left: 2px solid transparent;
  cursor: pointer;
}
.cmdk-result:hover, .cmdk-result.active {
  background: rgba(232, 228, 220, 0.045);
  border-left-color: var(--dossier-amber);
}
.cmdk-name {
  font-family: var(--display);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cmdk-meta {
  font-size: 10px;
  white-space: nowrap;
  color: var(--muted);
  letter-spacing: 0.06em;
}
.cmdk-score {
  font-size: 11px;
  color: var(--dossier-amber);
  font-weight: 700;
  padding: 1px 5px;
  border: 1px solid var(--dossier-amber);
  border-radius: 2px;
}
.cmdk-status {
  font-size: 9px;
  padding: 1px 4px;
  border: 1px solid var(--dossier-red);
  color: var(--dossier-red);
  border-radius: 2px;
  letter-spacing: 0.08em;
}
.cmdk-empty {
  padding: 18px 14px;
  text-align: center;
  font-size: 11px;
  letter-spacing: 0.1em;
}
.cmdk-hint {
  display: flex;
  gap: 16px;
  padding: 8px 14px;
  border-top: 1px solid var(--hair);
  font-size: 10px;
  letter-spacing: 0.08em;
  align-items: center;
}
.cmdk-hint kbd {
  background: var(--hair);
  padding: 1px 5px;
  border-radius: 2px;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--bone);
  margin-right: 4px;
  border: 1px solid var(--hair-2);
}

/* =================================================================
   ACQUISITION BANNER — press-confirmed strategic acquisition override
   (Zen Software finding, 2026-05-14)
   ================================================================= */
.acquisition-banner {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 18px;
  margin-bottom: 12px;
  background: rgba(212, 167, 61, 0.06);
  border: 1.5px solid var(--dossier-amber);
  border-left: 4px solid var(--dossier-amber);
  border-radius: 2px;
}
.acq-tag {
  font-family: var(--mono);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.18em;
  color: var(--dossier-amber);
  text-transform: uppercase;
}
.acq-body {
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.55;
  color: var(--bone);
}
.acq-body strong {
  color: var(--dossier-amber);
  font-weight: 700;
}

/* =================================================================
   PRESS PANEL — news hits per company (innovation memo §2 / news.py)
   ================================================================= */
.press-panel {
  background: var(--surface);
  border: 1px solid var(--hair);
  border-left: 3px solid var(--bone);
  padding: 10px 14px;
  margin-bottom: 12px;
  border-radius: 2px;
}
.press-panel-header {
  display: flex;
  gap: 12px;
  align-items: baseline;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--hair);
  margin-bottom: 6px;
}
.press-label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  color: var(--bone);
}
.press-count { font-size: 11px; }
.press-list {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.press-item {
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 12px;
  padding: 4px 0;
  flex-wrap: wrap;
}
.press-date { width: 92px; flex-shrink: 0; font-size: 10px; }
.press-class {
  font-size: 9px;
  padding: 1px 5px;
  border: 1px solid var(--hair-2);
  border-radius: 2px;
  letter-spacing: 0.1em;
  white-space: nowrap;
}
.press-class-acquisition_by {
  color: var(--dossier-amber);
  border-color: var(--dossier-amber);
}
.press-class-distress {
  color: var(--dossier-red);
  border-color: var(--dossier-red);
}
.press-link {
  color: var(--bone);
  text-decoration: none;
  border-bottom: 1px dotted var(--hair-2);
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.press-link:hover {
  color: var(--dossier-amber);
  border-bottom-color: var(--dossier-amber);
}
.press-link-noref {
  color: var(--muted);
  flex: 1;
}
.press-pub {
  font-size: 10px;
  letter-spacing: 0.08em;
}

@media print {
  .press-panel, .acquisition-banner { display: none !important; }
}

/* =================================================================
   PRINT — operator-takeaway pre-call brief (innovation memo §4 — feature 10)
   One sheet of A4. Hero name + address + key director + Caller's Pack.
   Everything else hidden — operator carries paper to a site visit.
   ================================================================= */
@media print {
  /* Page setup */
  @page { size: A4; margin: 12mm; }

  body, #app {
    background: white !important;
    color: black !important;
    padding: 0 !important;
    font-size: 11pt !important;
    line-height: 1.4 !important;
  }
  body::before, .body-public::after { display: none !important; }

  /* Kill all chrome */
  .classification, .doc-footer,
  .action-strip, .cmdk-overlay,
  .signal-section, .evidence-grid,
  .opportunity-tiers,
  .cascade-banner,
  .officer-panel,
  nav, .class-actions,
  .premises-map, .premises-map-wrap,
  .pack-fallback,
  .story-section { display: none !important; }

  /* Hero — compact, ink-saving */
  .hero, .hero-v2 {
    display: block !important;
    background: white !important;
    border: none !important;
    padding: 0 0 6mm 0 !important;
    border-bottom: 1.5pt solid black !important;
    margin-bottom: 6mm !important;
  }
  .hero-meta { display: block !important; }
  .company-name.big-display {
    font-size: 20pt !important;
    color: black !important;
    letter-spacing: 0.04em !important;
    margin-bottom: 2mm !important;
  }
  .company-keyfacts {
    color: #333 !important;
    font-size: 9pt !important;
    letter-spacing: 0.02em !important;
  }
  .archetype-badge {
    border: 1pt solid black !important;
    color: black !important;
    background: white !important;
  }
  .status-stamp { display: none !important; }
  .hero-score { display: none !important; }

  /* Premises — keep address only, no map */
  .premises-panel {
    display: block !important;
    border: none !important;
    border-top: 1pt solid #888 !important;
    padding: 4mm 0 !important;
    margin: 0 0 4mm 0 !important;
    background: white !important;
  }
  .premises-grid { display: block !important; }
  .premises-map-wrap { display: none !important; }
  .premises-meta { color: black !important; }
  .premises-label { color: black !important; font-weight: 700 !important; }
  .prem-row dt, .prem-row dd { color: black !important; }
  .prem-row dd { font-size: 11pt !important; }
  .prem-links { display: none !important; }

  /* Caller's Pack — the main payload */
  .caller-pack {
    background: white !important;
    border: none !important;
    border-top: 1pt solid #888 !important;
    padding: 4mm 0 !important;
    margin: 0 !important;
    color: black !important;
    page-break-inside: avoid;
  }
  .pack-header {
    border-bottom: 0.5pt solid #888 !important;
    margin-bottom: 4mm !important;
    padding-bottom: 2mm !important;
  }
  .pack-mode, .pack-priority, .pack-label,
  .pack-section-title,
  .pack-body, .pack-obj-a, .pack-pitch-quote,
  .pack-list li {
    color: black !important;
  }
  .pack-pitch-quote {
    background: white !important;
    border-left: 2pt solid black !important;
    font-size: 12pt !important;
    padding: 3mm 4mm !important;
  }
  .pack-mode, .pack-priority {
    border: 1pt solid black !important;
    color: black !important;
  }
  .pack-grid {
    display: block !important;
  }
  .pack-section { margin-bottom: 4mm !important; page-break-inside: avoid; }
  .pack-obj-q { color: #444 !important; }
  .pack-list-good li::marker,
  .pack-list-bad li::marker { color: black !important; }

  /* Print-only footer */
  body::after {
    content: "PROSPECTOR pre-call brief — print at risk of disclosure if dropped. Shred after the call.";
    display: block !important;
    margin-top: 8mm;
    padding-top: 2mm;
    border-top: 0.5pt solid #888;
    font-size: 7pt;
    color: #777;
    font-family: var(--mono);
    text-align: center;
  }

  /* Hide print-only chrome elements that would otherwise show */
  .btn, button, .user-chip, .logout-form { display: none !important; }
}

/* =================================================================
   SOURCING CHANNELS — Option B layer (relationship-mode UI)
   ================================================================= */
.sourcing-hero {
  border-left: 3px solid var(--dossier-olive);
}
.sourcing-pills {
  border-color: var(--dossier-olive);
}
.sourcing-pills .mode-pill-active {
  border-color: var(--dossier-olive);
  color: var(--dossier-olive);
  background: rgba(107, 142, 78, 0.06);
}
.sourcing-table {
  font-size: 12px;
}
.sourcing-table .dist-cell {
  width: 70px;
  white-space: nowrap;
}
.dist-value { font-size: 14px; color: var(--bone); font-weight: 700; }
.dist-unit  { font-size: 10px; margin-left: 1px; }

.sourcing-band-0to5mi .dist-value {
  color: var(--dossier-olive);
}
.sourcing-band-5to10mi .dist-value {
  color: var(--dossier-amber);
}
.sourcing-band-10to20mi .dist-value {
  color: var(--bone);
}
.sourcing-band-20miplus .dist-value {
  color: var(--muted);
}

/* Type pills */
.sourcing-type-pill {
  display: inline-block;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.1em;
  padding: 2px 6px;
  border: 1px solid var(--hair-2);
  border-radius: 2px;
  text-transform: uppercase;
  white-space: nowrap;
}
.sourcing-type-house_clearance { color: var(--dossier-olive); border-color: var(--dossier-olive); }
.sourcing-type-probate_clearance { color: var(--dossier-amber); border-color: var(--dossier-amber); }
.sourcing-type-bereavement_clearance { color: var(--dossier-amber); border-color: var(--dossier-amber); }
.sourcing-type-charity_clearance { color: var(--bone); border-color: var(--bone); }
.sourcing-type-auction_house { color: var(--dossier-red); border-color: var(--dossier-red); }
.sourcing-type-hospice_clearance { color: var(--dossier-amber); border-color: var(--dossier-amber); }
.sourcing-type-solicitor_probate { color: var(--muted); border-color: var(--muted); }
.sourcing-type-antique_dealer { color: var(--dossier-amber); border-color: var(--dossier-amber); }

.script-id {
  font-size: 9px;
  margin-left: 4px;
  padding: 1px 4px;
  border: 1px solid var(--hair-2);
  border-radius: 2px;
}

/* Status pills */
.status-pill {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.1em;
  padding: 2px 6px;
  border: 1px solid currentColor;
  border-radius: 2px;
  white-space: nowrap;
}
.status-new        { color: var(--muted); }
.status-queued     { color: var(--bone); }
.status-contacted  { color: var(--dossier-amber); }
.status-engaged    { color: var(--dossier-olive); font-weight: 700; }
.status-dead       { color: var(--dossier-red); opacity: 0.7; }
.status-opt_out    { color: var(--dossier-red); }

/* Tags */
.tags-cell { max-width: 200px; }
.tag {
  display: inline-block;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.06em;
  padding: 1px 5px;
  margin: 1px 2px 1px 0;
  border: 1px solid var(--hair-2);
  border-radius: 2px;
  color: var(--muted);
}
.tag-antiques-buyer    { color: var(--dossier-amber); border-color: var(--dossier-amber); }
.tag-whatsapp-friendly { color: var(--dossier-olive); border-color: var(--dossier-olive); }
.tag-family-run        { color: var(--bone); border-color: var(--hair-2); }
.tag-specialist-probate { color: var(--dossier-amber); border-color: var(--dossier-amber); }
.tag-verified          { color: var(--dossier-olive); border-color: var(--dossier-olive); }
.tag-charity           { color: var(--bone); border-color: var(--hair-2); }
.tag-specialist        { color: var(--dossier-amber); border-color: var(--dossier-amber); }
.tag-competitor-flag   { color: var(--dossier-red); border-color: var(--dossier-red); }
.tag-established       { color: var(--dossier-olive); border-color: var(--hair-2); }

/* Row tinting by status */
.sourcing-row.sourcing-status-engaged {
  background: rgba(107, 142, 78, 0.05);
}
.sourcing-row.sourcing-status-dead {
  opacity: 0.55;
}

/* === Detail page === */
.sourcing-script-box {
  text-align: center;
  border: 2px solid var(--dossier-olive);
  padding: 10px 18px;
  border-radius: 2px;
}
.script-id-big {
  font-family: var(--mono);
  font-size: 36px;
  font-weight: 700;
  color: var(--dossier-olive);
  line-height: 1;
}
.tags-panel { margin-bottom: 12px; }
.tags-strip { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.notes-panel .memo { padding: 6px; }

/* Outcome form */
.outcome-form { display: flex; flex-direction: column; gap: 10px; }
.outcome-form .form-row { display: flex; flex-direction: column; gap: 4px; }
.outcome-form .form-row-inline { flex-direction: row; gap: 14px; align-items: center; }
.outcome-form label { font-size: 10px; letter-spacing: 0.1em; }
.outcome-form select,
.outcome-form input,
.outcome-form textarea {
  background: var(--bg);
  border: 1px solid var(--hair-2);
  color: var(--bone);
  font-family: var(--mono);
  font-size: 13px;
  padding: 8px 10px;
  border-radius: 2px;
}
.outcome-form select:focus,
.outcome-form input:focus,
.outcome-form textarea:focus {
  outline: none;
  border-color: var(--dossier-olive);
}

/* Outcome history */
.outcomes-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.outcome-entry {
  border-left: 2px solid var(--hair-2);
  padding: 6px 0 6px 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: baseline;
  font-size: 12px;
}
.outcome-entry.outcome-engaged_saved_number,
.outcome-entry.outcome-lead_received,
.outcome-entry.outcome-deal_closed {
  border-left-color: var(--dossier-olive);
}
.outcome-entry.outcome-opt_out,
.outcome-entry.outcome-no_interest {
  border-left-color: var(--dossier-red);
  opacity: 0.7;
}
.outcome-date { width: 130px; flex-shrink: 0; }
.outcome-type { font-weight: 700; }
.outcome-deal { color: var(--dossier-olive); font-weight: 700; }
.outcome-notes {
  flex-basis: 100%;
  margin-top: 4px;
  padding-left: 12px;
  font-size: 13px;
  line-height: 1.5;
}

/* =================================================================
   CALL SCRIPT PANEL — verbatim script on sourcing detail pages
   (management addendum 2026-05-15)
   ================================================================= */
.call-script-panel {
  background: var(--surface);
  border: 1.5px solid var(--dossier-amber);
  border-left: 4px solid var(--dossier-amber);
  padding: 16px 20px;
  margin: 14px 0;
  border-radius: 2px;
}
.call-script-header {
  padding-bottom: 10px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--hair);
}
.cs-tag {
  font-family: var(--mono);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.12em;
  color: var(--dossier-amber);
  text-transform: uppercase;
}
.cs-tone {
  font-size: 11px;
  letter-spacing: 0.06em;
  margin-top: 4px;
  font-style: italic;
}
.cs-context {
  background: rgba(212, 167, 61, 0.04);
  border-left: 2px solid var(--hair-2);
  padding: 8px 12px;
  font-size: 12px;
  line-height: 1.55;
  margin-bottom: 12px;
  color: var(--bone);
}
.cs-block {
  margin: 14px 0;
}
.cs-block-label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.18em;
  color: var(--muted);
  margin-bottom: 6px;
}
.cs-quote {
  margin: 0;
  padding: 14px 18px;
  background: var(--bg);
  border-left: 3px solid var(--hair-2);
  border-radius: 2px;
  font-family: var(--read);
  font-size: 15px;
  line-height: 1.65;
  color: var(--bone);
  font-weight: 400;
}
.cs-quote-main {
  border-left-color: var(--dossier-red);
  font-size: 17px;          /* a touch larger — this is read aloud */
  line-height: 1.6;
  font-weight: 450;          /* slightly heavier so it reads as 'the line' */
  background: rgba(200, 57, 42, 0.03);
}
.cs-flag {
  margin-top: 6px;
  padding: 4px 10px;
  background: rgba(200, 57, 42, 0.05);
  border-left: 2px solid var(--dossier-red);
  color: var(--dossier-red);
  font-size: 11px;
  letter-spacing: 0.06em;
}
.cs-objection {
  padding: 8px 0;
  border-top: 1px dashed var(--hair);
}
.cs-objection:first-of-type { border-top: none; }
.cs-obj-q {
  color: var(--dossier-amber);
  font-size: 12px;
  margin-bottom: 4px;
}
.cs-obj-a {
  color: var(--bone);
  font-size: 13px;
  line-height: 1.55;
  padding-left: 12px;
}
.cs-tips {
  margin-top: 14px;
  padding-top: 10px;
  border-top: 1px solid var(--hair);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cs-tip {
  display: flex;
  gap: 10px;
  align-items: baseline;
  font-size: 12px;
  line-height: 1.55;
}
.cs-tip-tag {
  flex-shrink: 0;
  width: 80px;
  font-size: 9px;
  letter-spacing: 0.12em;
  color: var(--dossier-olive);
  padding: 2px 6px;
  border: 1px solid var(--dossier-olive);
  border-radius: 2px;
  text-align: center;
}
.script-ref {
  scroll-margin-top: 20px;
}
.scripts-toc-list {
  list-style: none;
  padding-left: 0;
  margin: 6px 0 0 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.toc-link {
  color: var(--bone);
  text-decoration: none;
  border-bottom: 1px dotted var(--hair-2);
  font-size: 12px;
  letter-spacing: 0.05em;
}
.toc-link:hover { color: var(--dossier-amber); border-bottom-color: var(--dossier-amber); }
.phone-prominent {
  font-size: 14px !important;
  color: var(--dossier-amber);
  font-weight: 700;
}

/* === Tappable phone links — critical for mobile cold-calling ============ */
.phone-link {
  color: var(--dossier-amber);
  text-decoration: none;
  font-weight: 600;
  border-bottom: 1px dotted rgba(212, 167, 61, 0.4);
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.phone-link:hover,
.phone-link:active {
  color: var(--bone);
  background: var(--dossier-amber);
  border-bottom-color: transparent;
  padding: 2px 4px;
  border-radius: 2px;
}
.phone-link-secondary {
  font-size: 10px;
  color: var(--muted);
  font-weight: 400;
}
.phone-cell {
  min-width: 140px;
}

/* === Mobile card-mode for sourcing list table ============================
   On screens < 720px, drop the table layout and stack each firm as a card.
   Reason: 8-column horizontal-scroll table is unusable on a phone, which
   is the device the caller is literally holding. */
@media (max-width: 720px) {
  .sourcing-table { display: block; }
  .sourcing-table thead { display: none; }
  .sourcing-table tbody { display: block; }
  .sourcing-table tr.sourcing-row {
    display: block;
    padding: 12px 14px;
    border: 1px solid var(--hair);
    border-radius: 2px;
    margin-bottom: 10px;
    background: var(--surface);
    border-left-width: 3px;
  }
  .sourcing-table tr.sourcing-row.sourcing-band-0to5mi   { border-left-color: var(--dossier-olive); }
  .sourcing-table tr.sourcing-row.sourcing-band-5to10mi  { border-left-color: var(--dossier-amber); }
  .sourcing-table tr.sourcing-row.sourcing-band-10to20mi { border-left-color: var(--bone); }
  .sourcing-table tr.sourcing-row.sourcing-band-20miplus { border-left-color: var(--muted); }
  .sourcing-table td { display: block; padding: 3px 0 !important; border: none !important; }

  /* Distance + firm name = the headline */
  .sourcing-table td.dist-cell {
    display: inline-block;
    margin-right: 10px;
    font-size: 16px !important;
  }
  .sourcing-table td.dist-cell + td {
    display: inline-block;
  }
  .sourcing-table td.dist-cell + td .row-link {
    font-size: 15px;
  }

  /* Phone link gets prominent treatment — main mobile action */
  .sourcing-table td.phone-cell {
    margin-top: 6px;
    padding: 6px 0 !important;
  }
  .sourcing-table td.phone-cell .phone-link {
    display: inline-block;
    padding: 8px 14px;
    background: rgba(212, 167, 61, 0.08);
    border: 1px solid var(--dossier-amber);
    border-radius: 2px;
    font-size: 15px;
    border-bottom: 1px solid var(--dossier-amber);
  }

  /* Less-critical fields shrink */
  .sourcing-table td.tags-cell,
  .sourcing-table td.signal-cell { font-size: 11px; }
  .sourcing-table td.mono.muted { font-size: 11px; }
}

/* Hide the cmd-K hint footer on touch devices — no keyboard available */
@media (hover: none) and (pointer: coarse) {
  .cmdk-overlay { display: none !important; }
  /* (cmd-K palette only makes sense with a physical keyboard) */
}

/* ============================================================
   Mobile polish (≤ 480px — Android phones in portrait)
   ============================================================ */
@media (max-width: 480px) {
  /* Top nav (DASHBOARD / SOURCING / chip / SIGN OUT) — let it wrap */
  .class-actions {
    flex-wrap: wrap;
    gap: 6px;
    row-gap: 4px;
  }
  .class-actions .btn { font-size: 10px; padding: 4px 6px; }
  .user-chip { font-size: 10px; padding: 3px 6px; }

  /* Hero subtitle — tighter to leave room for the list */
  .sourcing-hero .hero-subtitle {
    font-size: 11px;
    line-height: 1.45;
  }
  .sourcing-hero .company-name.big-display {
    font-size: 17px;
    letter-spacing: 0.04em;
  }
  .sourcing-hero .company-meta {
    font-size: 11px;
    line-height: 1.6;
  }

  /* Campaign + type pills — pack tighter, shrink labels */
  .mode-picker { padding: 6px 8px; gap: 5px; }
  .mode-pill {
    padding: 5px 8px;
    font-size: 10px;
    letter-spacing: 0.06em;
  }
  .mode-pill-count {
    font-size: 9px;
    padding: 1px 4px;
  }

  /* Hide zero-count pills entirely on the smallest screens —
     dedicated to "what's actionable" */
  .mode-pill-empty { display: none; }

  /* Truncate over-long labels on phones — keep them on one line */
  .mode-pill-label { white-space: nowrap; }
}

/* On mid-phone widths (481-720px) — still hide truly-empty pills */
@media (max-width: 720px) {
  .mode-pill-empty {
    opacity: 0.4;
  }
}

/* Larger touch targets for outcome form buttons on mobile */
@media (max-width: 720px) {
  .outcome-form select,
  .outcome-form input,
  .outcome-form textarea {
    font-size: 16px !important;  /* iOS won't zoom on focus if >= 16px */
    padding: 12px 14px !important;
  }
  .outcome-form .btn.btn-cta {
    width: 100%;
    padding: 16px;
    font-size: 14px;
  }
  .action-strip {
    flex-wrap: wrap;
    gap: 8px;
  }
  .action-strip .btn {
    flex: 1 1 auto;
    min-height: 44px;  /* Apple HIG / Material Design touch target */
    padding: 10px 8px;
  }
}

/* Collapsible voicemail / email blocks on detail page (don't crowd the main pitch) */
.cs-collapsible {
  margin: 10px 0;
  padding: 0;
  border-top: 1px dashed var(--hair);
}
.cs-collapsible > summary {
  cursor: pointer;
  padding: 6px 0;
  list-style: none;
  font-family: var(--mono);
}
.cs-collapsible > summary::-webkit-details-marker { display: none; }
.cs-collapsible > summary::before {
  content: "▸ ";
  color: var(--dossier-amber);
  margin-right: 4px;
}
.cs-collapsible[open] > summary::before { content: "▾ "; }
.cs-collapsible > summary:hover { color: var(--dossier-amber); }

.cs-email-template {
  font-size: 12px !important;
  line-height: 1.55 !important;
}

/* Master pre-call brief styling — make it distinctive */
.master-brief-panel {
  border-color: var(--dossier-red);
  border-left-width: 5px;
}
.cs-meta-grid { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.cs-meta-row { display: flex; flex-direction: column; gap: 4px; }

/* Screen-only style for the PRINT BRIEF button */
.btn.btn-print-brief {
  margin-left: 8px;
  border-color: var(--dossier-amber);
  color: var(--dossier-amber);
}
.btn.btn-print-brief:hover {
  background: var(--dossier-amber);
  color: var(--surface);
}

/* ============================================================ */
/* MISSION A — operator UX: landing, call mode, summary         */
/* ============================================================ */

/* ---- Common chips + buttons ---- */

.btn.btn-huge {
  font-size: 18px;
  padding: 20px 36px;
  letter-spacing: 0.12em;
  font-weight: 700;
}
.btn.btn-large {
  font-size: 14px;
  padding: 12px 22px;
  font-weight: 600;
}

/* ---- Operator landing ---- */

.operator-hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
}
.campaign-switcher {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  font-size: 11px;
}
.campaign-chip {
  display: inline-block;
  padding: 6px 12px;
  border: 1px solid var(--hair-2);
  color: var(--text);
  text-decoration: none;
  letter-spacing: 0.1em;
  border-radius: 1px;
  font-family: var(--mono);
  background: var(--surface);
}
.campaign-chip:hover {
  border-color: var(--dossier-amber);
  color: var(--dossier-amber);
}
.campaign-chip-active {
  background: var(--dossier-red);
  color: var(--surface);
  border-color: var(--dossier-red);
}
.campaign-chip-active:hover {
  background: var(--dossier-red);
  color: var(--surface);
}

.panel-resume {
  border-left: 5px solid var(--dossier-amber);
}
.resume-body {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  padding-top: 8px;
}
.resume-stats {
  font-size: 12px;
  color: var(--text);
}

.panel-brief {
  border-left: 5px solid var(--dossier-olive);
}
.brief-text {
  font-family: var(--read);
  font-size: 16px;
  line-height: 1.6;
  margin: 8px 0 14px;
  color: var(--text);
}
.brief-breakdown {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 11px;
}
.brief-chip {
  display: inline-block;
  padding: 4px 10px;
  border: 1px solid var(--hair-2);
  letter-spacing: 0.08em;
  font-family: var(--mono);
  font-weight: 600;
}
.brief-chip-callback {
  border-color: var(--dossier-amber);
  color: var(--dossier-amber);
}
.brief-chip-followup {
  border-color: var(--dossier-olive);
  color: var(--dossier-olive);
}
.brief-chip-continuity {
  border-color: var(--dossier-red);
  color: var(--dossier-red);
}
.brief-chip-new {
  border-color: var(--text);
  color: var(--text);
}
.brief-chip-retry {
  border-color: var(--hair-2);
  color: var(--text);
  opacity: 0.7;
}
.brief-detail {
  font-size: 10px;
  opacity: 0.6;
}

.panel-start {
  text-align: center;
  padding: 28px 16px;
  background: linear-gradient(180deg, var(--surface) 0%, rgba(200,57,42,0.04) 100%);
  border: 2px solid var(--dossier-red);
}
.start-form { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.start-meta { font-size: 11px; opacity: 0.7; max-width: 640px; }

.panel-history {
  border-left: 5px solid var(--hair-2);
}
.history-stats {
  font-size: 12px;
  padding-top: 8px;
}

/* ---- Call Mode ---- */

.callmode-hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
}
.callmode-progress {
  text-align: right;
}
.progress-num {
  font-family: var(--display);
  font-size: 36px;
  font-weight: 700;
  color: var(--dossier-amber);
  line-height: 1;
}
.progress-current { color: var(--dossier-red); }
.progress-sep { color: var(--hair-2); margin: 0 4px; }
.progress-total { color: var(--text); }
.progress-meta {
  font-size: 10px;
  letter-spacing: 0.1em;
  margin-top: 4px;
  color: var(--text);
  opacity: 0.65;
}

.panel-firm-identity {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px;
}
.phone-mega {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 24px;
  background: var(--dossier-red);
  color: var(--surface);
  text-decoration: none;
  border: 2px solid var(--dossier-red);
  font-weight: 700;
  transition: transform 0.05s;
}
.phone-mega:hover {
  background: var(--dossier-amber);
  border-color: var(--dossier-amber);
}
.phone-mega:active {
  transform: scale(0.99);
}
.phone-mega .phone-icon { font-size: 24px; }
.phone-mega .phone-number {
  font-family: var(--mono);
  font-size: 26px;
  letter-spacing: 0.04em;
}
.phone-secondary {
  display: inline-block;
  padding: 8px 14px;
  border: 1px solid var(--hair-2);
  color: var(--text);
  text-decoration: none;
  font-size: 14px;
  width: fit-content;
}
.phone-secondary:hover { border-color: var(--dossier-amber); color: var(--dossier-amber); }

.firm-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 6px 16px;
  font-size: 12px;
  line-height: 1.5;
}
.firm-meta-grid > div { padding: 2px 0; }
.firm-meta-grid a { color: var(--dossier-amber); }

.panel-script summary,
.panel-history summary {
  cursor: pointer;
  list-style: none;
  padding: 8px 0;
}
.panel-script summary::-webkit-details-marker,
.panel-history summary::-webkit-details-marker { display: none; }
.panel-script summary::before,
.panel-history summary::before {
  content: "▸ ";
  color: var(--dossier-amber);
  margin-right: 4px;
}
.panel-script[open] summary::before,
.panel-history[open] summary::before { content: "▾ "; }

.script-body {
  padding: 12px 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.script-section {
  border-left: 2px solid var(--hair);
  padding-left: 12px;
}
.script-label {
  font-size: 10px;
  letter-spacing: 0.12em;
  margin-bottom: 4px;
  display: block;
}
.script-pitch {
  font-family: var(--read);
  font-size: 16px;
  line-height: 1.6;
  margin: 0;
}
.script-main-pitch {
  font-size: 17px;
  font-weight: 450;
  color: var(--text);
}
.script-objections {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.script-objections li {
  font-size: 13px;
  line-height: 1.5;
  padding: 8px 12px;
  background: rgba(212,167,61,0.04);
  border-left: 2px solid var(--dossier-amber);
}

.history-body { padding: 12px 0; }
.history-section { margin-bottom: 16px; }
.history-label {
  font-size: 10px;
  letter-spacing: 0.12em;
  margin-bottom: 6px;
  display: block;
}
.history-list, .notes-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.history-list li, .notes-list li {
  padding: 6px 0;
  border-top: 1px dashed var(--hair);
  font-size: 12px;
}
.history-date, .notes-date {
  font-size: 11px;
  opacity: 0.6;
  margin-right: 8px;
}
.notes-body {
  margin: 4px 0 0;
  font-family: var(--read);
  font-size: 13px;
  line-height: 1.55;
}

/* Outcome pill — used in history list */
.outcome-pill {
  display: inline-block;
  padding: 2px 8px;
  font-size: 10px;
  letter-spacing: 0.08em;
  font-family: var(--mono);
  font-weight: 700;
  border: 1px solid var(--hair-2);
  margin-right: 6px;
}
.outcome-pill.outcome-engaged_saved_number,
.outcome-pill.outcome-engaged { background: var(--dossier-olive); color: var(--surface); border-color: var(--dossier-olive); }
.outcome-pill.outcome-callback_scheduled,
.outcome-pill.outcome-follow_up_scheduled { background: var(--dossier-amber); color: var(--surface); border-color: var(--dossier-amber); }
.outcome-pill.outcome-no_answer { color: var(--text); }
.outcome-pill.outcome-left_message { color: var(--text); }
.outcome-pill.outcome-no_interest { color: var(--text); opacity: 0.7; }
.outcome-pill.outcome-dead_end,
.outcome-pill.outcome-opt_out { background: var(--dossier-red); color: var(--surface); border-color: var(--dossier-red); }

/* ---- Outcome buttons (the 6) ---- */

.panel-outcome { border-color: var(--dossier-amber); }
.outcome-form .outcome-notes {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 12px;
}
.outcome-form .outcome-notes label {
  font-size: 10px;
  letter-spacing: 0.1em;
}
.outcome-form .outcome-notes textarea {
  font-family: var(--read);
  font-size: 14px;
  padding: 10px 12px;
  background: var(--surface);
  border: 1px solid var(--hair-2);
  color: var(--text);
  resize: vertical;
  min-height: 44px;
}

.outcome-buttons {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  margin: 12px 0;
}
.outcome-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 14px 8px;
  background: var(--surface);
  border: 2px solid var(--hair-2);
  color: var(--text);
  font-family: var(--mono);
  font-weight: 700;
  letter-spacing: 0.08em;
  cursor: pointer;
  text-align: center;
  transition: all 0.08s;
  min-height: 70px;
}
.outcome-btn:hover {
  border-color: var(--text);
  background: rgba(255,255,255,0.04);
}
.outcome-btn-selected {
  background: var(--dossier-amber) !important;
  color: var(--surface) !important;
  border-color: var(--dossier-amber) !important;
}
.outcome-btn-engaged { border-color: var(--dossier-olive); color: var(--dossier-olive); }
.outcome-btn-engaged:hover { background: var(--dossier-olive); color: var(--surface); }
.outcome-btn-callback { border-color: var(--dossier-amber); color: var(--dossier-amber); }
.outcome-btn-callback:hover { background: var(--dossier-amber); color: var(--surface); }
.outcome-btn-deadend { border-color: var(--dossier-red); color: var(--dossier-red); }
.outcome-btn-deadend:hover { background: var(--dossier-red); color: var(--surface); }

.outcome-icon { font-size: 22px; line-height: 1; }
.outcome-label { font-size: 12px; }
.outcome-hint { font-size: 9px; letter-spacing: 0.06em; opacity: 0.7; }

.callback-chips {
  padding: 14px;
  background: rgba(212,167,61,0.06);
  border-left: 3px solid var(--dossier-amber);
  margin: 8px 0;
}
.callback-chips > label {
  font-size: 10px;
  letter-spacing: 0.1em;
  display: block;
  margin-bottom: 8px;
}
.chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.callback-chip {
  padding: 8px 14px;
  background: var(--surface);
  border: 1px solid var(--dossier-amber);
  color: var(--dossier-amber);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  cursor: pointer;
}
.callback-chip:hover {
  background: var(--dossier-amber);
  color: var(--surface);
}
.callback-chip-selected {
  background: var(--dossier-amber);
  color: var(--surface);
}
.callback-display {
  margin-top: 8px;
  font-size: 12px;
  color: var(--dossier-amber);
}
#callback-custom {
  display: block;
  margin-top: 8px;
  padding: 8px 10px;
  background: var(--surface);
  border: 1px solid var(--dossier-amber);
  color: var(--text);
  font-family: var(--mono);
}

.outcome-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding-top: 8px;
  border-top: 1px dashed var(--hair);
}
.session-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  padding: 12px 0 0;
  margin-top: 12px;
  border-top: 1px dashed var(--hair);
}

/* ============================================================ */
/* LIBRARY toolbar + pagination (sourcing list at scale)         */
/* ============================================================ */

.library-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
  padding: 10px 14px;
  background: var(--surface);
  border: 1px solid var(--hair-2);
}
.library-search {
  flex: 1 1 320px;
  min-width: 220px;
}
.library-search input[type="search"] {
  width: 100%;
  padding: 10px 14px;
  background: var(--surface);
  border: 1px solid var(--hair-2);
  color: var(--text);
  font-family: var(--mono);
  font-size: 13px;
}
.library-search input[type="search"]:focus {
  border-color: var(--dossier-amber);
  outline: none;
}
.library-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  font-size: 11px;
}
.library-controls label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.library-controls select {
  padding: 6px 10px;
  background: var(--surface);
  border: 1px solid var(--hair-2);
  color: var(--text);
  font-family: var(--mono);
  font-size: 11px;
}
.library-controls select:focus {
  border-color: var(--dossier-amber);
  outline: none;
}

.discovery-pill {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  padding: 8px 14px;
  margin-bottom: 12px;
  background: rgba(212, 167, 61, 0.05);
  border-left: 3px solid var(--dossier-amber);
  font-size: 11px;
}

.library-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
  padding: 16px 0 8px;
  font-size: 11px;
  letter-spacing: 0.05em;
}
.page-link {
  display: inline-block;
  padding: 6px 10px;
  border: 1px solid var(--hair-2);
  color: var(--text);
  text-decoration: none;
  font-family: var(--mono);
  font-weight: 600;
}
.page-link:hover {
  border-color: var(--dossier-amber);
  color: var(--dossier-amber);
}
.page-link-active {
  background: var(--dossier-red);
  color: var(--surface);
  border-color: var(--dossier-red);
}
.page-link-active:hover {
  background: var(--dossier-red);
  color: var(--surface);
}
.page-link-disabled {
  opacity: 0.35;
  cursor: not-allowed;
  pointer-events: none;
}
.page-ellipsis {
  padding: 6px 4px;
  color: var(--hair-2);
}
.page-meta {
  margin-left: auto;
  font-family: var(--mono);
  font-size: 10px;
}

@media (max-width: 720px) {
  .library-toolbar { flex-direction: column; align-items: stretch; }
  .library-controls { justify-content: space-between; }
  .library-pagination { font-size: 10px; gap: 3px; }
  .page-link { padding: 5px 8px; }
}

/* ============================================================ */
/* SIMPLIFICATION 2026-05-18 — /list with pinned warm-proven    */
/* Doctrine: warm-proven renders as categorically distinct class */
/* (inbox-pinned pattern), not just a higher-priority tag.       */
/* ============================================================ */

/* === FILTER BAR === */
.filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 18px;
  align-items: flex-end;
  padding: 14px 16px;
  margin-bottom: 14px;
  background: var(--surface);
  border: 1px solid var(--hair-2);
  font-size: 11px;
}
.filter-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.filter-group label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--text);
  opacity: 0.75;
}
.filter-group select,
.filter-group input[type="search"] {
  padding: 7px 10px;
  background: var(--surface);
  border: 1px solid var(--hair-2);
  color: var(--text);
  font-family: var(--mono);
  font-size: 12px;
  min-width: 140px;
}
.filter-group select:focus,
.filter-group input[type="search"]:focus {
  border-color: var(--dossier-amber);
  outline: none;
}
.filter-search { flex: 1 1 240px; }
.filter-search input[type="search"] { width: 100%; min-width: 200px; }

/* === DOCTRINE ALARM (visible across the list when live_feeder ≤ 1) === */
.universe-stats {
  display: flex;
  gap: 12px;
  align-items: center;
  font-size: 11px;
}
.stat-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 6px 12px;
  border: 1px solid var(--hair-2);
}
.stat-chip-num {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 700;
}
.stat-chip-label {
  font-size: 9px;
  letter-spacing: 0.12em;
  opacity: 0.75;
}
.stat-chip-feeders {
  border-color: var(--dossier-amber);
  color: var(--dossier-amber);
}
/* Legacy doctrine alarm — only on the retired /list surface. Kept STATIC: the
   flashing pulse was removed 2026-06-24 (nothing flashes for no reason now).
   The old .doctrine-strip on the classification bar is gone entirely — its
   replacement is the calm .freshness-pill. */
.doctrine-alarm {
  padding: 8px 14px;
  background: var(--dossier-red);
  color: var(--surface);
  font-weight: 700;
  letter-spacing: 0.1em;
  font-size: 11px;
}

/* === PINNED WARM-PROVEN SECTION (the dedicated visual class) === */
.pinned-warm-proven {
  margin: 0 0 24px;
  background: linear-gradient(180deg,
              rgba(200, 57, 42, 0.10) 0%,
              rgba(200, 57, 42, 0.03) 100%);
  border: 2px solid var(--dossier-red);
  border-left-width: 6px;
  padding: 16px 18px;
}
.pinned-header {
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px dashed var(--dossier-red);
}
.pinned-title {
  font-family: var(--display);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--dossier-red);
  text-transform: uppercase;
}
.pinned-subtitle {
  font-size: 11px;
  line-height: 1.5;
  margin-top: 4px;
  opacity: 0.85;
}
.pinned-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pinned-row {
  background: var(--surface);
  border: 1px solid rgba(200, 57, 42, 0.4);
}
.pinned-row-link {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  text-decoration: none;
  color: var(--text);
}
.pinned-row-link:hover {
  background: rgba(200, 57, 42, 0.06);
}
.pinned-row-main {
  flex: 1 1 60%;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pinned-row-name {
  font-family: var(--display);
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.pinned-row-meta {
  font-size: 11px;
  letter-spacing: 0.04em;
}
.pinned-row-evidence {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
}
.prize-badge {
  display: inline-block;
  padding: 2px 8px;
  background: var(--dossier-red);
  color: var(--surface);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.1em;
  font-weight: 700;
}
.wtn-badge {
  display: inline-block;
  padding: 3px 8px;
  border: 1px solid var(--dossier-amber);
  color: var(--dossier-amber);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.1em;
  font-weight: 600;
}
.needs-data {
  color: var(--dossier-amber);
  font-style: italic;
}

/* === MAIN LIST — tier badges + visual class === */
.list-row {
  border-left: 3px solid transparent;
}
.list-row.tier-warm-proven { border-left-color: var(--dossier-red); }
.list-row.tier-feeder      { border-left-color: var(--dossier-amber); }
.list-row.tier-prospect    { border-left-color: var(--dossier-olive); }
.list-row.tier-toxic       { border-left-color: var(--dossier-amber); opacity: 0.85; }
.list-row.tier-untriaged   { border-left-color: var(--hair-2); }

.tier-badge {
  display: inline-block;
  padding: 3px 9px;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.1em;
  font-weight: 700;
  border: 1px solid var(--hair-2);
  white-space: nowrap;
}
.tier-badge-tier-warm-proven { background: var(--dossier-red);   color: var(--surface); border-color: var(--dossier-red); }
.tier-badge-tier-feeder      { background: var(--dossier-amber); color: var(--surface); border-color: var(--dossier-amber); }
.tier-badge-tier-prospect    { color: var(--dossier-olive); border-color: var(--dossier-olive); }
.tier-badge-tier-toxic       { color: var(--dossier-amber); border-color: var(--dossier-amber); }
.tier-badge-tier-untriaged   { opacity: 0.7; }

.risk-badge {
  display: inline-block;
  padding: 2px 6px;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.06em;
  font-weight: 700;
  background: var(--dossier-amber);
  color: var(--surface);
  margin-left: 6px;
}

/* === BUSINESS CARD === */
.card-hero.tier-warm-proven {
  border-left: 6px solid var(--dossier-red);
  background: linear-gradient(90deg, rgba(200, 57, 42, 0.07) 0%, transparent 100%);
}
.card-hero.tier-feeder {
  border-left: 6px solid var(--dossier-amber);
  background: linear-gradient(90deg, rgba(212, 167, 61, 0.07) 0%, transparent 100%);
}

.panel-evidence {
  border-left: 5px solid var(--dossier-red);
  background: rgba(200, 57, 42, 0.04);
}
.evidence-text {
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.6;
  white-space: pre-wrap;
  margin: 0;
  padding: 8px 0;
}

.panel-feeder-status {
  border-left: 5px solid var(--dossier-amber);
}
.feeder-status-track {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 0;
  flex-wrap: wrap;
}
.track-step {
  flex: 1 1 120px;
  text-align: center;
  padding: 10px 8px;
  background: var(--surface);
  border: 1px dashed var(--hair-2);
  font-size: 11px;
  font-family: var(--mono);
  font-weight: 700;
  letter-spacing: 0.05em;
}
.track-step .muted { font-size: 9px; font-weight: 400; }
.track-active {
  background: var(--dossier-amber);
  color: var(--surface);
  border: 1px solid var(--dossier-amber);
}
.track-active.track-prize {
  background: var(--dossier-olive);
  border-color: var(--dossier-olive);
}
.track-arrow {
  font-family: var(--display);
  font-size: 18px;
  color: var(--hair-2);
}
.feeder-status-form {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  padding: 14px 0 0;
  margin-top: 10px;
  border-top: 1px dashed var(--hair);
  font-size: 11px;
}
.feeder-status-form label {
  display: flex;
  align-items: center;
  gap: 6px;
}
.feeder-status-form select {
  padding: 7px 10px;
  background: var(--surface);
  border: 1px solid var(--hair-2);
  color: var(--text);
  font-family: var(--mono);
  font-size: 12px;
}
.feeder-status-form select:focus {
  border-color: var(--dossier-amber);
  outline: none;
}

.panel-risk { padding: 12px 0; }
.risk-banner {
  padding: 12px 16px;
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  margin-bottom: 8px;
}
.risk-competitor {
  background: rgba(200, 57, 42, 0.15);
  color: var(--dossier-red);
  border-left: 4px solid var(--dossier-red);
}
.risk-toxic {
  background: rgba(212, 167, 61, 0.15);
  color: var(--dossier-amber);
  border-left: 4px solid var(--dossier-amber);
}

.contacts-grid {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 0;
}
.contact-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 12px;
  padding: 6px 0;
  border-top: 1px dashed var(--hair);
  font-size: 13px;
}
.contact-row:first-child { border-top: none; }
.contact-label {
  flex: 0 0 90px;
  font-size: 10px;
  letter-spacing: 0.12em;
  font-weight: 600;
  color: var(--text);
  opacity: 0.65;
}
.contact-value { flex: 1; }
.contact-gap {
  color: var(--dossier-amber);
  font-style: italic;
}

.actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 10px;
}

.history-notes {
  font-size: 12px;
  margin-top: 4px;
  padding-left: 8px;
  border-left: 2px solid var(--hair);
  font-family: var(--read);
  color: var(--text);
  opacity: 0.85;
}

@media (max-width: 720px) {
  .filter-bar { gap: 10px; padding: 10px 12px; }
  .filter-group select, .filter-group input[type="search"] { min-width: 120px; }
  .pinned-row-link { gap: 6px; padding: 10px 12px; }
  .pinned-row-name { font-size: 14px; }
  .feeder-status-track { gap: 4px; }
  .track-step { font-size: 10px; padding: 8px 4px; }
  .track-arrow { display: none; }
  .contact-label { flex: 0 0 70px; font-size: 9px; }
}

.autoadvance-banner {
  padding: 10px 14px;
  background: var(--dossier-olive);
  color: var(--surface);
  text-align: center;
  font-weight: 700;
  letter-spacing: 0.1em;
  margin-top: 8px;
}

/* ---- Session summary ---- */

.summary-area { display: flex; flex-direction: column; gap: 16px; }

.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 12px;
  margin: 12px 0;
}
.stat {
  text-align: center;
  padding: 14px 8px;
  background: var(--surface);
  border: 1px solid var(--hair-2);
}
.stat-num {
  font-family: var(--display);
  font-size: 36px;
  line-height: 1;
  font-weight: 700;
}
.stat-label {
  font-size: 10px;
  letter-spacing: 0.1em;
  margin-top: 4px;
  opacity: 0.75;
}
.stat-engaged .stat-num { color: var(--dossier-olive); }
.stat-callback .stat-num { color: var(--dossier-amber); }
.stat-deadend .stat-num { color: var(--dossier-red); }
.stats-meta {
  font-size: 11px;
  opacity: 0.7;
  text-align: center;
}

.engaged-list, .callbacks-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.engaged-list li, .callbacks-list li {
  padding: 10px 0;
  border-top: 1px dashed var(--hair);
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: baseline;
}
.engaged-list li:first-child, .callbacks-list li:first-child { border-top: none; }
.callback-when {
  color: var(--dossier-amber);
  font-weight: 700;
  min-width: 160px;
}
.callback-notes {
  flex-basis: 100%;
  font-size: 12px;
  margin-top: 4px;
}

.tomorrow-line {
  font-family: var(--read);
  font-size: 15px;
  line-height: 1.6;
  margin: 8px 0 14px;
}
.summary-actions {
  display: flex;
  gap: 12px;
  align-items: center;
  padding-top: 6px;
}

/* ---- Mobile call-mode polish ---- */
@media (max-width: 720px) {
  .phone-mega { padding: 14px 16px; gap: 10px; }
  .phone-mega .phone-number { font-size: 20px; }
  .phone-mega .phone-icon { font-size: 18px; }
  .outcome-buttons { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .outcome-btn { min-height: 64px; padding: 10px 6px; }
  .outcome-btn .outcome-label { font-size: 11px; }
  .stats-grid { grid-template-columns: repeat(3, 1fr); }
  .stat-num { font-size: 26px; }
  .progress-num { font-size: 28px; }
  .btn.btn-huge { font-size: 15px; padding: 16px 22px; }
}

/* =====================================================================
   TOOLTIPS (added 2026-06-24) — plain-English explainers on hover.
   Any element with data-tip="..." shows it. A dotted underline + help
   cursor signals "hover me" so new users find them.
   ===================================================================== */
[data-tip] { position: relative; cursor: help; }
.has-tip { border-bottom: 1px dotted var(--muted); }
[data-tip]:hover::after,
[data-tip]:focus::after {
  content: attr(data-tip);
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  z-index: 200;
  width: max-content;
  max-width: 280px;
  white-space: normal;
  background: var(--surface);
  color: var(--bone);
  border: 1px solid var(--hair-2);
  border-radius: 7px;
  padding: 9px 11px;
  font-family: var(--read);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
  box-shadow: 0 8px 24px rgba(0,0,0,0.45);
  pointer-events: none;
}
/* a small caret up to the trigger */
[data-tip]:hover::before {
  content: "";
  position: absolute;
  left: 12px;
  top: calc(100% + 2px);
  z-index: 201;
  border: 6px solid transparent;
  border-bottom-color: var(--hair-2);
  pointer-events: none;
}
/* tooltips that would clip on the right edge can opt to anchor right */
[data-tip].tip-right:hover::after { left: auto; right: 0; }
[data-tip].tip-right:hover::before { left: auto; right: 12px; }

/* A little ⓘ marker you can drop next to a label to advertise a tooltip */
.tip-dot {
  display: inline-flex; align-items: center; justify-content: center;
  width: 14px; height: 14px; margin-left: 4px;
  border-radius: 50%; border: 1px solid var(--muted);
  color: var(--muted); font-size: 9px; font-weight: 700;
  font-family: var(--read); line-height: 1; vertical-align: middle;
}
[data-tip]:hover .tip-dot { color: var(--dossier-amber); border-color: var(--dossier-amber); }

/* =====================================================================
   FRESHNESS PILL (added 2026-06-24) — replaces the old "ACTIVE SOURCES /
   STRUCTURAL EXPOSURE" jargon strip. Admin-only. Plain English, calm,
   only goes amber/red if the hunt actually stalls. No flashing.
   ===================================================================== */
.freshness-pill {
  display: inline-flex; align-items: center; gap: 6px;
  margin-left: 12px; padding: 2px 9px;
  border-radius: 4px; font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.04em; white-space: nowrap;
  border: 1px solid var(--hair-2);
}
.freshness-live  { color: var(--dossier-olive); border-color: rgba(130,179,94,0.4);
                   background: rgba(130,179,94,0.08); }
.freshness-quiet { color: var(--dossier-amber); border-color: rgba(226,178,76,0.4);
                   background: rgba(226,178,76,0.08); }
.freshness-stale { color: var(--dossier-red); border-color: rgba(223,94,81,0.45);
                   background: rgba(223,94,81,0.08); }

/* =====================================================================
   MOBILE / PHONE (added 2026-06-25) — make the closer's surfaces work in
   one hand. The two killers fixed here: the nav bar was a fixed 32px strip
   with overflow:hidden (buttons got CLIPPED on a phone), and the worklist
   was an 8-column table (unusable narrow). Now the nav wraps and the
   worklist becomes a stack of tappable cards with the phone number front
   and centre.
   ===================================================================== */
@media (max-width: 680px) {
  #app { padding: 8px; gap: 10px; }

  /* Nav: let the classification bar grow + wrap instead of clipping. */
  .classification { height: auto; min-height: 32px; overflow: visible;
    flex-wrap: wrap; padding: 6px 10px; gap: 4px 8px; }
  .class-left { white-space: normal; max-width: 100%; }
  .class-actions { flex-wrap: wrap; gap: 6px; }
  .class-actions .btn { font-size: 11px; padding: 6px 9px; min-height: 36px; }
  .freshness-pill { margin-left: 0; }

  /* Hero stats sit under the title rather than squashing it. */
  .dashboard-hero .universe-stats { margin-top: 8px; }

  /* Home: one tile per row. */
  .reason-grid { grid-template-columns: 1fr; }

  /* Filter bar stacks full-width; 16px inputs stop iOS auto-zoom. */
  .filter-bar { flex-direction: column; align-items: stretch; gap: 8px; }
  .filter-bar .mode-picker { flex-wrap: wrap; justify-content: flex-start; }
  .filter-bar .filter-group, .filter-bar .filter-search { width: 100%; }
  .filter-bar .filter-search input, .filter-bar select {
    width: 100%; box-sizing: border-box; font-size: 16px; }
  .filter-bar .btn-cta { width: 100%; min-height: 44px; }
  .sort-hint { display: none; }   /* no column headers to tap in card mode */

  /* WORKLIST: 8-col table -> stack of tappable cards. */
  .board-cards, .board-cards tbody { display: block; width: 100%; }
  .board-cards thead { display: none; }
  .board-cards tr.list-row {
    display: flex; flex-direction: column; gap: 5px;
    padding: 13px 14px; margin-bottom: 11px;
    border: 1px solid var(--hair); border-left: 4px solid var(--hair-2);
    border-radius: 9px; background: var(--surface); }
  .board-cards tr.list-row:hover { background: var(--surface); }
  .board-cards tr.row-chasing { border-left-color: var(--dossier-amber); }
  .board-cards tr.row-won { border-left-color: var(--dossier-olive); }
  .board-cards td { display: block; padding: 0 !important; border: none !important; }

  /* card field order: state · company · why · phone · distance · kit · OPEN */
  .board-cards td.col-state    { order: 1; }
  .board-cards td.col-company  { order: 2; }
  .board-cards td.col-company .row-link { font-size: 17px; }
  .board-cards td.col-why      { order: 3; font-size: 12px; }
  .board-cards td.col-call     { order: 4; margin-top: 2px; font-size: 13px !important; }
  .board-cards td.col-distance { order: 5; font-size: 12px; }
  .board-cards td.col-distance::before { content: "📍 "; }
  .board-cards td.col-kit      { order: 6; font-size: 12px; }
  .board-cards td.col-kit::before { content: "💷 "; }
  .board-cards td.col-status   { display: none; }   /* shown by the card's left border + state pill */
  .board-cards td.col-open     { order: 7; margin-top: 8px; }
  .board-cards td.col-open .btn {
    display: block; width: 100%; box-sizing: border-box; text-align: center;
    padding: 13px !important; min-height: 46px; font-size: 14px; }

  /* The phone number is the main action on a phone — make it a fat tap target. */
  .board-cards td.col-call .phone-link {
    display: inline-block; margin-top: 5px; padding: 9px 16px;
    background: rgba(226,178,76,0.1); border: 1px solid var(--dossier-amber);
    border-radius: 7px; font-size: 16px; }

  /* Admin LOGINS panel: let the add-login form + action buttons stack. */
  .add-login-form { flex-direction: column; align-items: stretch; }
  .add-login-form input, .add-login-form select { width: 100%; box-sizing: border-box; font-size: 16px; }
}