/* ============================================================
   Raising Agents — Lab registry chrome
   Companion to base.css / notebook.css / round03.css / pen-marks.css

   Adds:
     · count-strip   — homepage + lab-page brand counter
     · exp-meta      — Experiment Card metadata block (every /lab/exp/* page)
     · status-badge  — confirmed / preregistered / heuristic / pending / null / overturned / withdrawn / running
     · exp-claim-boundary
     · replication-block
     · lab-feed-row  — homepage feed of latest experiments
   ============================================================ */

/* ── Count strip ─────────────────────────────────────────── */

.count-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 18px 32px;
  align-items: baseline;
  padding: 18px 0;
  border-top: 2px solid var(--ink);
  border-bottom: 1px solid var(--rule);
  margin: 24px 0 36px;
  font-family: var(--mono);
  font-size: 13px;
  color: var(--ink-3);
}
.count-strip .count-num {
  font-family: var(--serif);
  font-size: 28px;
  font-weight: 500;
  color: var(--ink);
  margin-right: 6px;
  letter-spacing: -0.01em;
  font-feature-settings: "tnum" 1, "lnum" 1;
}
.count-strip .count-item { display: inline-flex; align-items: baseline; gap: 6px; }
.count-strip .count-label { text-transform: uppercase; letter-spacing: 0.08em; font-size: 11px; }
.count-strip .count-sep { color: var(--rule); }

/* ── Status badge ────────────────────────────────────────── */

.status-badge {
  display: inline-block;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 3px;
  border: 1px solid currentColor;
  vertical-align: 0.05em;
  white-space: nowrap;
  margin-left: 6px;
}
/* CONFIRMED badge uses saturated #1e6a3a (high-contrast UI label).
   --pen-pass (oklch 0.58 0.09 150) is the dusty-sage annotation ink —
   intentionally different weight. See base.css:--pen-pass. */
.status-badge.confirmed     { color: #1e6a3a; background: rgba(30,106,58,0.08); }
.status-badge.preregistered { color: #6a4f1e; background: rgba(106,79,30,0.08); }
.status-badge.running       { color: #1e4f6a; background: rgba(30,79,106,0.08); }
.status-badge.heuristic     { color: #4a4a52; background: rgba(74,74,82,0.08); }
.status-badge.pending       { color: #6a6a52; background: rgba(106,106,82,0.06); }
.status-badge.null          { color: #6a1e4f; background: rgba(106,30,79,0.08); }
.status-badge.overturned    { color: #c52e2e; background: rgba(197,46,46,0.08); }
.status-badge.withdrawn     { color: #595962; background: rgba(89,89,98,0.06); }

/* ── Experiment page · metadata block ────────────────────── */

.exp-meta {
  border-top: 2px solid var(--ink);
  border-bottom: 1px solid var(--rule);
  padding: 24px 0;
  margin: 28px 0 36px;
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 14px 28px;
  max-width: 880px;
}
.exp-meta dt {
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--ink-3);
  align-self: baseline;
}
.exp-meta dd {
  margin: 0;
  font-family: var(--mono);
  font-size: 14px;
  color: var(--ink);
  line-height: 1.5;
}
.exp-meta dd code { background: rgba(0,0,0,0.06); padding: 1px 6px; border-radius: 3px; font-family: var(--mono); font-size: 13px; }
.exp-meta dd a { color: var(--ink); }
.exp-meta dd .status-badge { margin-left: 0; }

/* ── Claim boundary ──────────────────────────────────────── */

.exp-claim-boundary {
  border-left: 3px solid var(--ink-3);
  padding: 4px 0 4px 18px;
  margin: 22px 0;
  color: var(--ink-2);
  max-width: 68ch;
}
.exp-claim-boundary .kicker {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: 4px;
}

/* ── Replication block ───────────────────────────────────── */

.replication-block {
  background: var(--code-bg, #1c1c22);
  color: var(--code-fg, #f0f0ea);
  padding: 18px 22px;
  border-radius: 6px;
  margin: 18px 0 24px;
  font-family: var(--mono);
  font-size: 14px;
  max-width: 880px;
}
.replication-block .replication-cmd { display: block; }
.replication-block .replication-note { display: block; margin-top: 10px; color: rgba(240,240,234,0.65); font-size: 12px; }
.replication-block code { background: transparent; color: inherit; padding: 0; }

/* ── Homepage lab feed ───────────────────────────────────── */

.lab-feed { margin: 24px 0 12px; }
.lab-feed .lab-feed-list { list-style: none; padding: 0; margin: 18px 0; }
.lab-feed .lab-feed-row {
  border-top: 1px solid var(--rule);
  padding: 16px 0;
  display: grid;
  grid-template-columns: 100px 1fr auto;
  gap: 16px 24px;
  align-items: baseline;
}
.lab-feed .lab-feed-row:last-child { border-bottom: 1px solid var(--rule); }
.lab-feed .lab-feed-id {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-3);
  letter-spacing: 0.06em;
  line-height: 1.4;
}
.lab-feed .lab-feed-title { margin: 0; font-size: 17px; font-family: var(--serif); line-height: 1.3; }
.lab-feed .lab-feed-title a { text-decoration: none; }
.lab-feed .lab-feed-meta { font-family: var(--mono); font-size: 11px; color: var(--ink-3); margin: 4px 0 0; }
.lab-feed .lab-feed-result {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--ink);
  text-align: right;
  white-space: nowrap;
  line-height: 1.5;
  font-feature-settings: "tnum" 1, "lnum" 1;
}
.lab-feed .lab-feed-result strong { display: block; font-family: var(--serif); font-weight: 500; font-size: 18px; }
.lab-feed .lab-feed-cta { margin-top: 18px; font-family: var(--mono); font-size: 13px; }

/* ── Filter taxonomy bar (Lab page header) ───────────────── */

.taxonomy-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 18px 0 8px;
  font-family: var(--mono);
  font-size: 11px;
}
.taxonomy-bar .taxonomy-label {
  color: var(--ink-3);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  align-self: center;
  margin-right: 6px;
}

/* ── Responsive ──────────────────────────────────────────── */

@media (max-width: 720px) {
  .exp-meta { grid-template-columns: 1fr; gap: 4px 0; max-width: 100%; }
  .exp-meta dt { margin-top: 12px; }
  .lab-feed .lab-feed-row { grid-template-columns: 1fr; gap: 4px; }
  .lab-feed .lab-feed-result { text-align: left; }
}
