/* ═══════════════════════════════════════════════════════════════════
   Phase 2A — Tenders / Review / History mode elevation (2026-09-08)
   Light editorial-precision: cards read as calm instruments — hairline
   separators, e1→e2 hover lift, dot+label status pills, tabular money,
   eyebrow kickers, --s* whitespace rhythm. Every value routes through
   the token foundation at the top of app.css; no parallel palette.
   Loads after app.css, so equal-specificity rules here refine the
   Phase 1 baselines. These selectors mount only in light-chrome modes
   (immersive dark cinema overrides come later in file order, and its
   selectors are scoped to body.immersive-mode), so no dark-chrome
   guard is required.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Section rhythm — one kicker voice across all three modes ─────── */
.section-head{margin-bottom:var(--s3)}
.section-title{
  font-size:var(--fs-small);font-weight:var(--wt-bold);
  letter-spacing:var(--track-kicker);text-transform:uppercase;
  color:var(--n-500);
}
.section-meta{font-size:var(--fs-caption);color:var(--n-500);letter-spacing:.02em}
.section-meta b{font-weight:var(--wt-bold);color:var(--n-700)}

/* ── Tenders list — calm instrument cards ─────────────────────────── */
.tender-grid{gap:var(--s3)}
.tender-card{
  border:1px solid var(--n-150);border-radius:var(--r-lg);
  background:var(--n-000);box-shadow:var(--e1);padding:var(--s5);
}
.tender-card:hover{
  transform:translateY(-2px);box-shadow:var(--e2);border-color:var(--n-250);
}
.tender-card.active{
  border-color:var(--a-300);
  box-shadow:var(--e2),0 0 0 3px var(--a-050);
}
.tender-top{align-items:center}
.tender-no{font-size:var(--fs-micro);color:var(--n-500);letter-spacing:.04em}
/* status = dot + label pill */
.tender-status{
  display:inline-flex;align-items:center;gap:var(--s1);
  padding:3px var(--s2);border-radius:var(--r-pill);
  background:var(--n-100);color:var(--n-600);
  font-size:var(--fs-micro);font-weight:var(--wt-bold);
  letter-spacing:var(--track-caps);text-transform:uppercase;
  line-height:1.4;
}
.tender-status::before{
  content:"";width:5px;height:5px;border-radius:50%;
  background:currentColor;flex:none;
}
.tender-status.ready{background:var(--ok-100);color:var(--ok-500)}
.tender-status.warn{background:var(--warn-100);color:var(--warn-500)}
.tender-name{
  font-size:var(--fs-lead);font-weight:var(--wt-medium);
  line-height:var(--lh-snug);letter-spacing:-.005em;
  color:var(--n-900);margin-top:var(--s3);
}
.tender-buyer{font-size:var(--fs-small);color:var(--muted);margin-top:var(--s1);line-height:1.45}
.tender-footer{
  margin-top:var(--s4);padding-top:var(--s3);
  border-top:var(--hairline-soft);
}
.tender-value{font-size:var(--fs-lead);font-weight:var(--wt-bold);color:var(--n-900);letter-spacing:-.01em}
.tender-date{font-size:var(--fs-caption);color:var(--muted);text-align:right;line-height:1.4}

/* ── Empty states — quiet glyph + short copy ──────────────────────── */
.empty-state{
  border:1px dashed var(--n-250);border-radius:var(--r-lg);
  background:var(--n-050);padding:var(--s8) var(--s6);
  gap:var(--s1);color:var(--muted);font-size:var(--fs-body);line-height:var(--lh-body);
}
.empty-state::before{
  content:"◌";font-size:22px;line-height:1;color:var(--n-300);margin-bottom:var(--s1);
}
.empty-state strong{color:var(--n-800);font-size:var(--fs-lead);font-weight:var(--wt-medium)}

/* ── Intake / dropzone surfaces ───────────────────────────────────── */
.input-panel{border-radius:var(--r-xl);box-shadow:var(--e1);padding:var(--s6)}
.intake-box{
  background:var(--n-050);border:1px solid var(--n-150);
  border-radius:var(--r-lg);padding:var(--s5);
}
.intake-label{
  font-size:var(--fs-caption);font-weight:var(--wt-bold);
  letter-spacing:var(--track-kicker);text-transform:uppercase;
  color:var(--n-500);margin-bottom:var(--s2);
}
.dropzone{
  border:1.5px dashed var(--n-250);border-radius:var(--r-lg);
  background:var(--n-050);padding:var(--s6);
}
.dropzone:hover{border-color:var(--n-400);background:var(--n-000)}
.dropzone.drag{
  border-style:solid;border-color:var(--a-500);
  background:var(--a-050);box-shadow:0 0 0 3px var(--a-100);
}
.drop-title{font-size:var(--fs-lead);font-weight:var(--wt-medium);color:var(--n-800)}
.drop-copy{font-size:var(--fs-body);color:var(--muted);line-height:var(--lh-body)}
.dropzone .btn{margin-top:var(--s3)}
.file-chip{
  border:1px solid var(--n-150);background:var(--n-050);
  border-radius:var(--r-pill);padding:3px 9px;
  font-size:var(--fs-caption);color:var(--n-700);letter-spacing:.01em;
}
.input-actions{margin-top:var(--s4);padding-top:var(--s4);border-top:var(--hairline-soft)}

/* ── Review — the decision card is the hero ───────────────────────── */
.review-top{gap:var(--s3)}
.decision-card{
  position:relative;overflow:hidden;
  padding:var(--s6) var(--s7);border-radius:var(--r-xl);
  border-color:var(--n-150);box-shadow:var(--e2);
}
/* status rail — unambiguous ready/warn at arm's length, still classy */
.decision-card::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--n-200);
}
.decision-card.ready{border-color:var(--ok-line)}
.decision-card.ready::before{background:var(--ok-500)}
.decision-card.warn{border-color:var(--warn-line)}
.decision-card.warn::before{background:var(--warn-500)}
/* state line becomes a pill */
.decision-state{
  display:inline-flex;align-items:center;gap:var(--s2);
  padding:4px 10px;border-radius:var(--r-pill);
  background:var(--n-100);color:var(--n-600);
  font-size:var(--fs-caption);font-weight:var(--wt-bold);
  letter-spacing:var(--track-kicker);text-transform:uppercase;
}
.decision-card.ready .decision-state{background:var(--ok-100);color:var(--ok-500)}
.decision-card.warn .decision-state{background:var(--warn-100);color:var(--warn-500)}
.state-mark{width:7px;height:7px;flex:none}
.decision-head{
  font-size:var(--fs-head);font-weight:var(--wt-bold);
  letter-spacing:-.01em;line-height:var(--lh-snug);
  margin-top:var(--s4);color:var(--n-900);
}
.decision-copy{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--muted);margin-top:var(--s2);max-width:520px}

/* value card — quiet instrument next to the hero */
.value-card{box-shadow:var(--e1);display:flex;flex-direction:column;border-color:var(--n-150);border-radius:var(--r-xl);padding:var(--s6)}
.value-label{
  font-size:var(--fs-caption);font-weight:var(--wt-bold);
  letter-spacing:var(--track-kicker);text-transform:uppercase;color:var(--n-500);
}
.big-number{
  font-size:var(--fs-display);font-weight:var(--wt-bold);
  letter-spacing:-.02em;line-height:var(--lh-tight);
  margin-top:var(--s2);color:var(--n-900);
}
.value-sub{font-size:var(--fs-small);color:var(--muted);margin-top:var(--s2)}
.value-bar{height:6px;background:var(--n-100);margin-top:auto;border-radius:var(--r-pill)}
.value-bar i{background:var(--a-500);border-radius:inherit;transition:width var(--dur-slow) var(--ease)}

/* ── Review hubs — five quiet doors into the evidence ─────────────── */
.review-grid{gap:var(--s3)}
.review-hub{
  border:1px solid var(--n-150);border-radius:var(--r-lg);
  background:var(--n-000);box-shadow:var(--e1);padding:var(--s4) var(--s5);
}
.review-hub:hover{
  transform:translateY(-2px);box-shadow:var(--e2);border-color:var(--n-250);
}
.review-hub.reviewed{
  border-color:var(--ok-line);
  background:linear-gradient(180deg,var(--ok-100),var(--n-000) 55%);
}
.hub-top{align-items:center}
.hub-icon{
  width:30px;height:30px;border-radius:var(--r-sm);
  background:var(--n-075);color:var(--n-700);
  transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease);
}
.review-hub:hover .hub-icon{background:var(--a-050);color:var(--a-600)}
.reviewed .hub-icon{background:var(--ok-100);color:var(--ok-500)}
.reviewed:hover .hub-icon{background:var(--ok-100);color:var(--ok-500)}
.hub-check{
  display:inline-grid;place-items:center;width:18px;height:18px;
  border-radius:50%;background:var(--ok-100);color:var(--ok-500);
  font-size:var(--fs-caption);font-weight:var(--wt-bold);
}
.hub-title{
  font-size:var(--fs-body);font-weight:var(--wt-bold);
  letter-spacing:.01em;color:var(--n-900);margin-top:var(--s3);
}
.hub-copy{font-size:var(--fs-small);color:var(--muted);line-height:1.5;margin-top:var(--s1)}
.hub-action{
  margin-top:var(--s3);font-size:var(--fs-caption);font-weight:var(--wt-bold);
  letter-spacing:.04em;color:var(--a-600);
}

/* review footer strip */
.review-footer{
  margin-top:var(--s4);border-color:var(--n-150);border-radius:var(--r-lg);
  box-shadow:var(--e1);padding:var(--s4) var(--s5);
}
.review-check{font-size:var(--fs-body);color:var(--muted)}
.review-ready-note{font-size:var(--fs-small);font-weight:var(--wt-medium);color:var(--ok-500);letter-spacing:.02em}

/* ── Hub drawer content — detail blocks & ledgers ─────────────────── */
.detail-stack{gap:var(--s3)}
.detail-block{
  border-color:var(--n-150);border-radius:var(--r-md);
  padding:var(--s4);box-shadow:var(--e1);
}
.detail-block h3{
  font-size:var(--fs-small);font-weight:var(--wt-bold);
  letter-spacing:.02em;color:var(--n-800);margin:0 0 var(--s2);
}
.detail-block p{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--muted)}
.kv-mini{font-size:var(--fs-body);row-gap:6px}
.kv-mini .k{color:var(--n-500);font-size:var(--fs-small);letter-spacing:.02em;padding-top:1px}
.section-total{font-size:var(--fs-small);padding:9px 0;border-bottom:var(--hairline-soft)}
.section-total b{font-weight:var(--wt-medium)}
.risk-row{align-items:flex-start;gap:var(--s4)}
.candidate-row{font-size:var(--fs-small);padding:7px 0}

/* ── Tables — editorial eyebrow headers, ledger rows ──────────────── */
.table-wrap{border-color:var(--n-150);border-radius:var(--r-md);box-shadow:var(--e1)}
.table-wrap table{font-size:var(--fs-small)}
.table-wrap th{
  font-size:var(--fs-micro);font-weight:var(--wt-bold);
  letter-spacing:var(--track-kicker);text-transform:uppercase;
  color:var(--n-500);background:var(--n-050);
  padding:9px var(--s3);border-bottom:var(--hairline);
}
.table-wrap td{padding:9px var(--s3);border-bottom:var(--hairline-soft)}
.table-wrap tbody tr:last-child td{border-bottom:0}

/* ── History — archival rows + comparison cards ───────────────────── */
.history-list{gap:var(--s3)}
.history-row{
  border-color:var(--n-150);border-radius:var(--r-lg);
  box-shadow:var(--e1);padding:var(--s4) var(--s5);
  grid-template-columns:minmax(0,1fr) auto auto;
}
.history-row:hover{transform:translateY(-1px);box-shadow:var(--e2);border-color:var(--n-250)}
.history-no{font-size:var(--fs-micro);letter-spacing:.04em;color:var(--n-500)}
.history-name{
  font-size:var(--fs-lead);font-weight:var(--wt-medium);
  letter-spacing:-.005em;color:var(--n-900);margin-top:var(--s1);
}
.history-sub{font-size:var(--fs-small);margin-top:2px}
.history-label{
  font-size:var(--fs-micro);font-weight:var(--wt-bold);
  letter-spacing:var(--track-kicker);text-transform:uppercase;color:var(--n-500);
}
.history-number{
  font-size:var(--fs-lead);font-weight:var(--wt-bold);
  letter-spacing:-.01em;color:var(--n-900);margin-top:var(--s1);
}
.history-date{font-size:var(--fs-small)}

/* deferred render (Phase 3): completed-tender rows skip layout/paint until
   they approach the viewport; block estimate re-measured on first render. */
.history-row{content-visibility:auto;contain-intrinsic-block-size:auto 64px}
/* compare layout (history drill-down) — previously unstyled */
.comparison{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.compare-card{
  background:var(--n-050);border:1px solid var(--n-150);
  border-radius:var(--r-lg);padding:var(--s4) var(--s5);
}
.compare-label{
  font-size:var(--fs-caption);font-weight:var(--wt-bold);
  letter-spacing:var(--track-kicker);text-transform:uppercase;color:var(--n-500);
}
.compare-value{
  font-family:var(--mono);font-variant-numeric:tabular-nums;
  font-size:var(--fs-head);font-weight:var(--wt-bold);
  letter-spacing:-.02em;color:var(--n-900);margin-top:6px;
}

/* ── Motion — one quiet rise, disabled under reduced motion ───────── */
.tender-card:active,.review-hub:active{transform:translateY(0);box-shadow:var(--e1)}
@media (prefers-reduced-motion: no-preference){
  @keyframes modesRise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
  .tender-card,.review-hub,.history-row{animation:modesRise .34s var(--ease) backwards}
  .tender-card:nth-child(2),.review-hub:nth-child(2){animation-delay:.035s}
  .tender-card:nth-child(3),.review-hub:nth-child(3){animation-delay:.07s}
  .tender-card:nth-child(4),.review-hub:nth-child(4){animation-delay:.105s}
  .tender-card:nth-child(5),.review-hub:nth-child(5){animation-delay:.14s}
  .tender-card:nth-child(6){animation-delay:.175s}
}