/* Preregistration dashboard v0 (T6-research, 22 September 2026).
   Design tokens only (css/brand.css). States are always named in text; the border style is a
   second, non-colour cue. At 720px and below every row becomes a stacked card, so the page never
   scrolls sideways at 390px. */
/* The research pages load research/research.css, not css/brand.css, so the brand tokens this
   dashboard uses are carried here, scoped to .prd, at css/brand.css's own values: without them every
   rule below that names one was dropped and the live page showed no cards, borders or row separation
   (read at 390 and 1440, 23 September 2026). tests/test_prereg_dashboard_tokens.py holds each value
   equal to brand.css's. research.css's own tokens (the fonts, gold, radius) stay the page's, and
   --max-width is left out, so the dashboard keeps the 72rem width it has always rendered at. */
.prd {
  --accent-link: hsl(200, 50%, 35%);
  --border: hsl(38, 18%, 84%);
  --border-strong: hsl(38, 16%, 76%);
  --font-mono: 'JetBrains Mono', 'IBM Plex Mono', 'Menlo', monospace;
  --gold-bg: hsla(38, 62%, 48%, 0.10);
  --gold-border: hsla(38, 55%, 50%, 0.22);
  --gold-text: hsl(38, 72%, 31%);
  --green: hsl(152, 45%, 36%);
  --green-bg: hsla(152, 45%, 36%, 0.08);
  --hairline: #e7e5e0;
  --ink: hsl(200, 18%, 15%);
  --ink-dim: hsl(200, 8%, 41%);
  --ink-sec: hsl(200, 10%, 38%);
  --paper-card: #ffffff;
  --radius-lg: 14px;
  --radius-sm: 7px;
  --shadow-sm: 0 1px 3px rgba(28, 28, 25, 0.06);
  --space-2xs: 0.125rem;
  --space-lg: 1rem;
  --space-md: 0.75rem;
  --space-sm: 0.5rem;
  --space-xl: 1.5rem;
  --space-xs: 0.25rem;
}


.prd { max-width: var(--max-width, 72rem); margin: 0 auto; padding: var(--space-xl) var(--space-md); color: var(--ink); font-family: var(--font-body); }
.prd-draft { margin: 0 0 var(--space-md); padding: var(--space-sm) var(--space-md); border: 2px dashed var(--gold-border); border-radius: var(--radius); background: var(--gold-bg); color: var(--ink); }
.prd-kicker { margin: 0 0 var(--space-2xs); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-text); font-weight: 600; }
.prd-head h2 { margin: 0 0 var(--space-sm); font-family: var(--font-display); font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem); line-height: 1.15; }
.prd-fresh { margin: 0; color: var(--ink-sec); font-size: .92rem; line-height: 1.6; }
.prd-stale { margin: var(--space-sm) 0 0; padding: var(--space-sm) var(--space-md); border-left: 4px solid var(--gold); background: var(--gold-bg); border-radius: var(--radius-sm); }

.prd-counts { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin: var(--space-lg) 0; padding: 0; }
.prd-counts > div { flex: 1 1 10rem; margin: 0; padding: var(--space-sm) var(--space-md); background: var(--paper-card); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.prd-counts dt { font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-sec); }
.prd-counts dd { margin: var(--space-2xs) 0 0; font-family: var(--font-display); font-size: 1.75rem; line-height: 1; }

.prd-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--paper-card); box-shadow: var(--shadow-sm); }
.prd-table-wrap:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
.prd-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.prd-table caption { caption-side: top; text-align: left; padding: var(--space-md); color: var(--ink-sec); font-size: .85rem; line-height: 1.55; }
.prd-table th, .prd-table td { padding: var(--space-sm) var(--space-md); text-align: left; vertical-align: top; border-top: 1px solid var(--hairline); }
.prd-table thead th { font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-sec); border-top: 0; border-bottom: 2px solid var(--gold-border); }
/* The study's title leads its row. Its size is set here, on the row header itself, because the site chrome sets every
   th to 11px on a phone for table labels, and an inherited size loses to that; this selector is the more specific one. */
.prd-table tbody th { font-weight: 500; font-size: .95rem; line-height: 1.4; }
/* On a wide screen the title gets the room it needs and the one-word columns keep theirs, so no title runs to ten
   short lines beside a half-empty column. */
@media (min-width: 721px) {
  .prd-table thead th:nth-child(1) { width: 31%; }
  .prd-table thead th:nth-child(2) { width: 10%; }
  .prd-table thead th:nth-child(3) { width: 21%; }
  .prd-table thead th:nth-child(4) { width: 28%; }
  .prd-table thead th:nth-child(5) { width: 10%; }
}
/* Below a laptop's width the registration column narrows, so its stamp may take two lines rather than push the table
   sideways. */
@media (max-width: 1023px) {
  .prd-ts { white-space: normal; }
}
.prd-id { display: block; font-family: var(--font-mono); font-size: .74rem; color: var(--ink-dim); }
.prd-state { display: inline-block; padding: .1rem .5rem; border-radius: var(--radius-sm); border: 1px solid var(--border-strong); font-size: .72rem; letter-spacing: .06em; white-space: nowrap; }
.prd-state--registered { border: 2px solid var(--green); background: var(--green-bg); font-weight: 600; }
.prd-state--design-draft { border-style: dashed; }
.prd-state--design-draft-blocked { border-style: dotted; border-width: 2px; }
.prd-state--submitted-pending-approval { border-style: double; border-width: 3px; }
.prd-state--none { color: var(--ink-sec); }
.prd-ts { display: inline-block; margin: 0 0 var(--space-2xs); padding: .1rem .5rem; border-radius: var(--radius-sm); border: 3px double var(--gold-text, #885e16); font-size: .72rem; letter-spacing: .06em; font-weight: 600; white-space: nowrap; }
.prd-ts-note { display: block; margin: 0 0 var(--space-xs); color: var(--ink-sec); font-size: .8rem; }
.prd-count--timestamp { border-style: double; border-width: 3px; }
.prd-ident { display: inline-block; margin-left: var(--space-2xs); font-family: var(--font-mono); font-size: .78rem; color: var(--accent-link); min-height: 44px; line-height: 44px; }
.prd-note { display: block; margin-top: var(--space-2xs); color: var(--ink-sec); font-size: .8rem; }
.prd-methods { margin-top: var(--space-xl); max-width: 44rem; }
.prd-methods h3 { font-family: var(--font-display); font-size: 1.2rem; margin: 0 0 var(--space-sm); }
.prd-methods p { color: var(--ink-sec); line-height: 1.65; }

@media (max-width: 720px) {
  .prd { padding: var(--space-lg) var(--space-md); }
  .prd-table-wrap { overflow-x: visible; border: 0; background: transparent; box-shadow: none; }
  .prd-table, .prd-table tbody, .prd-table tr, .prd-table th, .prd-table td { display: block; width: 100%; }
  .prd-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .prd-table caption { display: block; padding: 0 0 var(--space-sm); } /* a block table would otherwise wrap the caption in a shrink-to-fit anonymous table (read at 390, 23 Sep 2026) */
  .prd-table tr { margin: 0 0 var(--space-sm); padding: var(--space-sm) 0; background: var(--paper-card); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
  .prd-table th, .prd-table td { border-top: 0; padding: var(--space-2xs) var(--space-md); }
  .prd-table td::before { content: attr(data-label); display: block; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-dim); }
  .prd-state { white-space: normal; }
}

@media print {
  .prd-stale, .prd-table-wrap { box-shadow: none; }
  .prd-table-wrap { overflow: visible; }
  .prd-ident::after { content: " (" attr(href) ")"; }
}

/* The row's relations (PM D196 B, 24 September 2026): what a study runs after, what its result unlocks, and what it is a
   budget version of. Each sits on its own line under the title, small and calm; each unit link is a 44 px target. */
.prd-marks { display: block; margin-top: var(--space-xs); }
.prd-mark { display: block; font-size: .8rem; line-height: 1.45; color: var(--ink-sec); font-weight: 400; }
.prd-mark a { display: inline-flex; align-items: center; min-height: 44px; }
.prd-mark-why { color: var(--ink-dim); }

/* PM D199 landing 1 and its correction (24 September 2026): each deciding proposition with its own instrument state,
   the paper a follow-on follows on, the compact dated proof with its full line in a detail, work already run and the
   units withdrawn or superseded. Every link in the table keeps a 44px target (G-MOBILE-PARITY). */
.prd-table td a, .prd-table th a { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; }
.prd-pairs { list-style: none; margin: 0; padding: 0; }
.prd-pairs li { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--space-xs); margin: 0 0 var(--space-2xs); }
/* a blocked pairing's reason can run to five lines in a narrow column; it is given a reading line height, not the
   table's tight one */
.prd-pair-why, .prd-line { display: block; flex-basis: 100%; font-size: .78rem; line-height: 1.45; color: var(--ink-dim); }
.prd-follows, .prd-evidence { display: block; font-size: .8rem; color: var(--ink-sec); }
.prd-proof summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; font-size: .8rem; color: var(--accent-link); }
.prd-proof p { margin: var(--space-2xs) 0 0; font-size: .8rem; line-height: 1.5; color: var(--ink-sec); }
.prd-withdrawn { margin-top: var(--space-xl); max-width: 44rem; }
.prd-withdrawn h3 { font-family: var(--font-display); font-size: 1.2rem; margin: 0 0 var(--space-sm); }
.prd-withdrawn p, .prd-withdrawn li { color: var(--ink-sec); line-height: 1.65; }

/* The operator's ask of 26 September 2026, about 21:55Z ("studies not assigned to predictions"): each unit's links to
   the predictions as the map draws them, in the map's signed words, the laws its predictions fall under, and the paper
   it follows on or the map's own words where it has no link yet. The words name each link's strength, as the map's
   do, so status is never shown by colour alone. */
.prd-links, .prd-laws { list-style: none; margin: var(--space-2xs) 0 0; padding: 0; }
.prd-link { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--space-xs); margin: 0 0 var(--space-2xs); }
.prd-link-word { font-family: var(--font-mono); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-dim); }
.prd-link-note { display: block; flex-basis: 100%; font-size: .78rem; color: var(--ink-dim); }
.prd-laws { margin-top: var(--space-xs); padding-top: var(--space-2xs); border-top: 1px solid var(--hairline); }
.prd-laws li { font-size: .78rem; line-height: 1.5; color: var(--ink-sec); margin: 0 0 var(--space-2xs); }
.prd-law { font-family: var(--font-mono); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--gold-text); }
.prd-law-status { display: block; font-size: .74rem; color: var(--ink-sec); }
.prd-law-props { font-family: var(--font-mono); color: var(--ink); }
.prd-links-none { margin: 0; font-size: .8rem; line-height: 1.5; color: var(--ink-sec); }
.prd-links-none .prd-link-word { margin-right: var(--space-2xs); }