/* dossier.css: THE STANDARD (1.18, PR 5). The landing (/stock-market-game/)
   as a dossier: the sticky table of contents, the at-a-glance spec sheet,
   the figures, the timeframe row, the specimen grid. Linked after
   sections.css by the landing (the `dossier` head flag), by the rulebook and
   the documents for the index rail and the figures (PR 6), and by the comps. */
/* ── the dossier (/stock-market-game/) ───────────────────────────────── */
/* its own head (1.21): the crumb, the h1, the lede; no stage */
.dhead { display: grid; gap: var(--s4); padding-top: var(--sec-y-minor); }
.dhead > * { margin: 0; }
.dhead h1 { max-width: 20ch; }
.dhead .t-lede { max-width: 62ch; }
.dhead + .dossier { padding-top: var(--s8); }
.dossier { display: grid; gap: var(--s7); max-width: var(--w-page); margin: 0 auto; padding: var(--sec-y-minor) var(--gutter) 0; }
@media (min-width: 900px) { .dossier { grid-template-columns: 240px 1fr; align-items: start; } .toc { position: sticky; top: calc(var(--site-head-h) + var(--s5)); } }
.toc { display: grid; gap: 2px; }
.toc .t-label { color: var(--ink-mute); margin: 0 0 var(--s3); }
.toc a { display: flex; align-items: center; min-height: 40px; color: var(--ink-mute); font: 400 15px/1.3 var(--sans); text-decoration: none !important; border-left: 1px solid var(--hair); padding-left: var(--s4); }
.toc a.is-on, .toc a:hover { color: var(--ink); border-left-color: var(--gold); }
@media (max-width: 899px) { .toc { display: flex; overflow-x: auto; gap: var(--s2); position: sticky; top: var(--site-head-h); z-index: 5; background: rgba(var(--void-rgb), 0.92); backdrop-filter: blur(8px); margin: 0 calc(-1 * var(--gutter)); padding: var(--s2) var(--gutter); scrollbar-width: none; } .toc .t-label { display: none; } .toc a { flex: none; border: 1px solid var(--hair); border-radius: 999px; padding: 0 14px; min-height: 44px; } }
.dossier__main { display: grid; gap: var(--s8); max-width: 760px; }
.dossier__main > section { display: grid; gap: var(--s4); scroll-margin-top: calc(var(--site-head-h) + var(--s5)); }
.spec { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s5); margin: 0; border-top: 1px solid var(--hair); }
@media (min-width: 720px) { .spec { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.spec div { padding: var(--s4) 0; border-bottom: 1px solid var(--hair); }
.spec dt { font: 600 12px/1.3 var(--mono); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-mute); margin: 0 0 6px; }
.spec dd { margin: 0; font: 600 18px/1.3 var(--num); color: var(--ink); }
.figure { position: relative; overflow: hidden; padding: var(--s5); display: grid; gap: var(--s3); }
.figure__plot { position: relative; }
.figure__plot .film__tags { position: absolute; inset: 0; pointer-events: none; }
.figure svg { width: 100%; height: auto; display: block; overflow: visible; }
.figure figcaption { font: 600 12px/1.4 var(--mono); letter-spacing: 0.12em; color: var(--ink-mute); }
.candle-anat .wick { stroke: var(--ink2); stroke-width: 2; }
.candle-anat .body-up { fill: var(--up); }
.candle-anat .body-dn { fill: var(--down); }
.candle-anat .lab { stroke: var(--hair-strong); stroke-width: 1; }
@media (max-width: 599px) { .candle-anat .ftag { display: none; } }
.tfrow { display: flex; gap: 4px; padding: 4px; border-radius: 14px; border: 1px solid var(--hair); background: var(--void); width: max-content; }
.tfrow span { min-width: 56px; min-height: 40px; display: grid; place-items: center; border-radius: 10px; font: 700 14px/1 var(--num); color: var(--ink2); }
.tfrow span.on { color: var(--void); background: linear-gradient(180deg, var(--gold-lt), var(--gold)); }
.specimen { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5); max-width: 640px; margin: 0; padding: 0; list-style: none; }
.specimen .device { width: 100%; }
.specimen figcaption { text-align: left; font: 400 14px/1.45 var(--sans); letter-spacing: 0; text-transform: none; }
.specimen figcaption b { display: block; color: var(--ink); font: 600 15px/1.3 var(--sans); letter-spacing: 0; text-transform: none; margin-bottom: 2px; }