/* ═══════════════════════════════════════════════════════════════════════════
   FEDERATION INTELLIGENCE — RECORDS CHROME
   fed-records.css · D2 · branch federation-os-v2
   ───────────────────────────────────────────────────────────────────────────
   Requires: fed-tokens → fed-base → fed-components → fed-shell → fed-dossier.
   Styles the ORIGINAL record class names (renderer output and frozen
   corrections markup are byte-unchanged); the ratified palette lands here.

   Ratified status semantics (labels/logic untouched, color supplementary):
     correct/kept → verified green · incorrect/missed → failed red ·
     open/on-track → command cyan · void/ambiguous/disclosure → NEUTRAL.
   Gold appears nowhere in record statuses — reserved for parent authority.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Page scaffold ────────────────────────────────────────────────────── */
.rec-page { padding-block: var(--space-6) var(--space-8); }
.rec-head { margin-bottom: var(--space-5); max-width: var(--fed-reading-max); }
.rec-head h1 {
  font-family: var(--font-fed-display);
  font-weight: 900;
  font-size: var(--heading-lg);
  line-height: var(--line-heading);
  text-transform: uppercase;
  color: var(--fed-text-display);
}
.rec-head .rec-sub {
  font-family: var(--font-fed-body);
  font-size: var(--text-base);
  line-height: var(--line-body);
  color: var(--fed-muted);
  margin-top: var(--space-3);
}

/* ── Status badges & entry borders — ratified remap on original classes ── */
.rec-scope .status-badge {
  font-family: var(--font-fed-system);
  font-size: var(--text-xs);                 /* raises legacy 9–10px to floor */
  letter-spacing: var(--system-letter-spacing);
  font-weight: 400;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid var(--fed-border-default);
  background: transparent;
  text-transform: uppercase;
  white-space: nowrap;
}
/* forecasts: shipped=CORRECT · missed=INCORRECT · progress=OPEN ·
   active=AMBIGUOUS · scheduled=VOID  — per production STATUS_MAP */
.rec-scope .status-shipped   { color: var(--fed-verified); border-color: color-mix(in srgb, var(--fed-verified) 40%, transparent); background: var(--fed-verified-soft); }
.rec-scope .status-missed    { color: var(--fed-danger);   border-color: color-mix(in srgb, var(--fed-danger) 40%, transparent);   background: color-mix(in srgb, var(--fed-danger) 10%, transparent); }
.rec-scope .status-progress  { color: var(--fed-command);  border-color: color-mix(in srgb, var(--fed-command) 40%, transparent);  background: var(--fed-command-soft); }
.rec-scope .status-active,
.rec-scope .status-scheduled { color: var(--fed-neutral);  border-color: color-mix(in srgb, var(--fed-neutral) 40%, transparent); }
/* corrections classes */
.rec-scope .status-kept       { color: var(--fed-verified); border-color: color-mix(in srgb, var(--fed-verified) 40%, transparent); background: var(--fed-verified-soft); }
.rec-scope .status-on         { color: var(--fed-command);  border-color: color-mix(in srgb, var(--fed-command) 40%, transparent);  background: var(--fed-command-soft); }
.rec-scope .status-disclosure { color: var(--fed-neutral);  border-color: color-mix(in srgb, var(--fed-neutral) 40%, transparent); }

.rec-scope .entry {
  background: var(--surface-panel);
  border: 1px solid var(--fed-border-soft);
  border-left-width: 2px;
  border-radius: var(--radius-xs);
  padding: var(--space-5);
  margin-bottom: var(--space-4);
}
.rec-scope .entry.status-shipped-border,
.rec-scope .entry.status-kept-border      { border-left-color: var(--fed-verified); }
.rec-scope .entry.status-missed-border    { border-left-color: var(--fed-danger); }
.rec-scope .entry.status-progress-border,
.rec-scope .entry.status-on-track-border  { border-left-color: var(--fed-command); }
.rec-scope .entry.status-active-border,
.rec-scope .entry.status-scheduled-border,
.rec-scope .entry.status-disclosure-border{ border-left-color: var(--fed-neutral); }

/* ── Shared entry anatomy (typography over original markup) ───────────── */
.rec-scope .entry-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; margin-bottom: var(--space-3); }
.rec-scope .entry-id-row { display: flex; align-items: baseline; gap: var(--space-3); flex-wrap: wrap; }
.rec-scope .entry-id   { font-family: var(--font-fed-system); font-size: var(--text-sm); letter-spacing: var(--system-letter-spacing); color: var(--fed-command); }
.rec-scope .entry-date,
.rec-scope .entry-domain { font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); color: var(--fed-muted); text-transform: uppercase; }
.rec-scope .entry-title { font-family: var(--font-fed-interface); font-weight: 700; font-size: var(--text-xl); line-height: var(--line-heading); color: var(--fed-text-display); margin-bottom: var(--space-3); }
.rec-scope .entry-body { font-family: var(--font-fed-body); font-size: var(--text-base); line-height: var(--line-body); color: var(--fed-text); max-width: var(--fed-reading-max); margin-bottom: var(--space-3); }
.rec-scope .entry-body a { color: var(--fed-command); }
.rec-scope .entry-foot { font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); color: var(--fed-muted); border-top: 1px solid var(--fed-border-soft); padding-top: var(--space-3); }

/* ── Forecast anatomy: CLAIM → STATUS → CRITERIA/EVIDENCE → RESOLUTION →
     VERIFICATION (emphasis via CSS; renderer output untouched) ─────────── */
.rec-scope .fc-prob { display: flex; align-items: baseline; gap: var(--space-3); margin-bottom: var(--space-4); }
.rec-scope .fc-prob .p { font-family: var(--font-fed-display); font-weight: 700; font-size: var(--heading-sm); color: var(--fed-command); }
.rec-scope .fc-prob .plabel { font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); color: var(--fed-muted); text-transform: uppercase; }
.rec-scope .fc-rows { display: grid; gap: var(--space-2); }
.rec-scope .fc-row { display: grid; grid-template-columns: 120px 1fr; gap: var(--space-3); align-items: baseline; }
@media (max-width: 639px) { .rec-scope .fc-row { grid-template-columns: 1fr; gap: 2px; } }
.rec-scope .fc-row .k { font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); color: var(--fed-muted); text-transform: uppercase; }
.rec-scope .fc-row .v { font-family: var(--font-fed-body); font-size: var(--text-sm); line-height: var(--line-body); color: var(--fed-text); overflow-wrap: anywhere; }
.rec-scope .fc-row .v a { color: var(--fed-command); }
/* The hash is intentional and inspectable — a verification artifact */
.rec-scope .fc-row .v.hash {
  font-family: var(--font-fed-system);
  font-size: var(--text-xs);
  letter-spacing: 0.02em;
  color: var(--fed-text);
  background: color-mix(in srgb, var(--fed-space) 60%, transparent);
  border: 1px solid var(--fed-border-default);
  border-left: 2px solid var(--fed-verified);
  border-radius: var(--radius-xs);
  padding: var(--space-2) var(--space-3);
  user-select: all;
}
.rec-scope .fc-resolution { border: 1px solid var(--fed-border-default); border-radius: var(--radius-xs); padding: var(--space-4); margin-top: var(--space-4); display: grid; gap: var(--space-2); }
.rec-scope .fc-resolution.correct   { border-left: 2px solid var(--fed-verified); }
.rec-scope .fc-resolution.incorrect { border-left: 2px solid var(--fed-danger); }
.rec-scope .fc-resolution .rlabel { font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); text-transform: uppercase; color: var(--fed-text); }
.rec-scope .fc-resolution .rnote  { font-family: var(--font-fed-body); font-size: var(--text-sm); line-height: var(--line-body); color: var(--fed-text); }
.rec-scope .fc-brier { font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); color: var(--fed-muted); }

/* ── Scoreboard / legend / meta / verify chrome ───────────────────────── */
.rec-scope .page-meta, .rec-scope #pageMeta { display: flex; gap: var(--space-4); flex-wrap: wrap; font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); color: var(--fed-muted); text-transform: uppercase; margin-bottom: var(--space-4); }
.rec-scoreboard { display: grid; grid-template-columns: auto 1fr 1fr; gap: var(--space-5); align-items: start; border: 1px solid var(--fed-border-default); border-radius: var(--radius-sm); background: var(--surface-panel); padding: var(--space-5); margin-bottom: var(--space-5); }
@media (max-width: 1023px) { .rec-scoreboard { grid-template-columns: 1fr; } }
.rec-scope .score-big { font-family: var(--font-fed-display); font-weight: 900; font-size: var(--heading-lg); line-height: 1; color: var(--fed-text-display); }
.rec-scope .score-big.good { color: var(--fed-verified); }
.rec-scope .score-big.bad  { color: var(--fed-danger); }
.rec-scope #brierRef { font-family: var(--font-fed-body); font-size: var(--text-sm); line-height: var(--line-body); color: var(--fed-muted); max-width: 42ch; }
.rec-scope #recordLine, .rec-scope #openLine { display: flex; gap: var(--space-5); }
.rec-scope .record-cell .num { font-family: var(--font-fed-display); font-weight: 700; font-size: var(--heading-sm); color: var(--fed-text-display); }
.rec-scope .record-cell .num.correct { color: var(--fed-verified); }
.rec-scope .record-cell .num.incorrect { color: var(--fed-danger); }
.rec-scope .record-cell .num.open { color: var(--fed-command); }
.rec-scope .record-cell .cap { font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); color: var(--fed-muted); text-transform: uppercase; }
.rec-scope .legend { display: flex; gap: var(--space-4); flex-wrap: wrap; margin-bottom: var(--space-5); }
.rec-scope .legend-item { display: inline-flex; align-items: center; gap: var(--space-2); font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); color: var(--fed-muted); }
.rec-scope .calib { border: 1px solid var(--fed-border-soft); border-radius: var(--radius-xs); background: var(--surface-panel); padding: var(--space-5); margin-top: var(--space-5); }
.rec-scope .calib table { width: 100%; border-collapse: collapse; font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: 0.04em; }
.rec-scope .calib th, .rec-scope .calib td { text-align: left; padding: var(--space-2) var(--space-3); border-bottom: 1px solid var(--fed-border-soft); color: var(--fed-text); }
.rec-scope .calib th { color: var(--fed-muted); text-transform: uppercase; }
.rec-scope .sample-banner { border: 1px solid color-mix(in srgb, var(--fed-warning) 45%, transparent); border-left: 2px solid var(--fed-warning); border-radius: var(--radius-xs); background: color-mix(in srgb, var(--fed-warning) 6%, transparent); padding: var(--space-4); margin-bottom: var(--space-5); font-family: var(--font-fed-body); font-size: var(--text-sm); color: var(--fed-text); }
.rec-verify { border: 1px solid var(--fed-border-default); border-left: 2px solid var(--fed-verified); border-radius: var(--radius-xs); background: var(--surface-panel); padding: var(--space-5); margin-top: var(--space-6); display: grid; gap: var(--space-2); font-family: var(--font-fed-body); font-size: var(--text-sm); line-height: var(--line-body); color: var(--fed-text); }
.rec-verify a { color: var(--fed-command); }
.rec-scope .loading { font-family: var(--font-fed-system); font-size: var(--text-sm); letter-spacing: var(--system-letter-spacing); color: var(--fed-muted); padding: var(--space-6); border: 1px dashed var(--fed-border-default); border-radius: var(--radius-xs); }

/* ── Corrections chrome: toolbar / stats / permanence strip ───────────── */
.rec-scope .rec-log-title { font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing-wide); text-transform: uppercase; color: var(--fed-muted); margin-bottom: var(--space-4); }
.rec-scope .cl-search { width: 100%; box-sizing: border-box; background: var(--surface-panel); border: 1px solid var(--fed-border-default); border-radius: var(--radius-xs); color: var(--fed-text); font-family: var(--font-fed-body); font-size: var(--text-base); padding: var(--space-3) var(--space-8) var(--space-3) var(--space-4); }
.rec-scope .cl-search:focus { border-color: var(--fed-command); outline: var(--focus-width) solid var(--focus-color); outline-offset: 1px; }
.rec-scope .cl-search-wrap { position: relative; margin-bottom: var(--space-3); }
.rec-scope .cl-search-x { position: absolute; right: var(--space-3); top: 50%; transform: translateY(-50%); color: var(--fed-muted); cursor: pointer; font-size: var(--text-lg); padding: var(--space-1); opacity: 0; pointer-events: none; }
.rec-scope .cl-search-x.show { opacity: 1; pointer-events: auto; }
.rec-scope .cl-chips { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-bottom: var(--space-5); }
.rec-scope .cl-chip { display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--touch-target-min); padding: var(--space-2) var(--space-3); font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); text-transform: uppercase; background: transparent; border: 1px solid var(--fed-border-default); border-radius: 999px; color: var(--fed-muted); cursor: pointer; }
.rec-scope .cl-chip.is-active { color: var(--fed-command); border-color: var(--fed-command); background: var(--fed-command-soft); }
.rec-scope .cl-chip-n { color: var(--fed-text); }
.rec-stats { display: flex; gap: var(--space-6); flex-wrap: wrap; border: 1px solid var(--fed-border-default); border-radius: var(--radius-sm); background: var(--surface-panel); padding: var(--space-5); margin-bottom: var(--space-5); }
.rec-stats .cl-stat { display: grid; gap: 2px; }
.rec-stats .cl-stat-v { font-family: var(--font-fed-display); font-weight: 700; font-size: var(--heading-sm); color: var(--fed-text-display); }
.rec-stats .cl-stat-k { font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing); color: var(--fed-muted); text-transform: uppercase; }
.rec-permanence { border: 1px solid var(--fed-border-default); border-left: 2px solid var(--fed-verified); border-radius: var(--radius-xs); background: var(--surface-panel); padding: var(--space-5); margin-top: var(--space-6); display: grid; gap: var(--space-2); }
.rec-permanence .k { font-family: var(--font-fed-system); font-size: var(--text-xs); letter-spacing: var(--system-letter-spacing-wide); text-transform: uppercase; color: var(--fed-verified); }
.rec-permanence p { font-family: var(--font-fed-body); font-size: var(--text-sm); line-height: var(--line-body); color: var(--fed-text); max-width: var(--fed-reading-max); }
.rec-permanence a { color: var(--fed-command); }