/* s06.css — section 06's graphic styles only (the claims horizon). Owns
   the timeline SVG's proportion, its cells (solid/dashed, hover tint,
   idle-breathe), tick marks, year labels and the reserved readout.
   Shared shell lives in research.css. Rides the black band: strokes/
   fills/text are currentColor (white), dim = rgba(255,255,255,.5), and
   the hovered year's cells go blue (#2222ff) — dashed cells stay
   dashed, just recoloured. HARD RULE: hover + the fill-on-view pass
   only ever touch pixels (opacity, stroke/fill colour, dash colour) —
   every cell's x/y/width/height is fixed at build time and never
   changes; the box is sized purely from the fixed 460x96 viewBox. */

.spec-06 {
  max-width: 480px;
}

/* fixed box: the timeline's viewBox is 460 x 96 — lock that ratio */
.spec-06 .spec-canvas {
  aspect-ratio: 460 / 96;
}

.spec-06 .spec-canvas svg {
  cursor: default;
}

.spec-06 .spec-canvas svg text {
  font-family: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;
  font-weight: 300;
  fill: currentColor;
}

.spec-06 .spec-canvas svg .sv-dim,
.spec-06 .spec-canvas svg .ch-label {
  opacity: 0.5;
}

/* resting cells: solid (arrived) ones are filled ink, dashed (forecast)
   ones are a hairline ink dash. Hover/fill never touch geometry — only
   fill/stroke colour and (dashed) stroke-opacity change. */
.spec-06 .ch-cell-solid {
  stroke-width: 1;
}

.spec-06 .ch-cell-dashed {
  stroke-width: 1;
}

/* the hovered year's cells go blue — solid cells recolor fill+stroke,
   dashed (forecast) cells recolor their dash to blue, still dashed */
.spec-06 .ch-cell.is-active.ch-cell-solid {
  fill: #2222ff;
  stroke: #2222ff;
}

.spec-06 .ch-cell.is-active.ch-cell-dashed {
  stroke: #2222ff;
  stroke-opacity: 1;
}

/* tick marks between years: a faint hairline, never a hover target */
.spec-06 .ch-ticks line {
  stroke-width: 1;
  pointer-events: none;
}

/* year labels beneath the strip; the hovered year's label inks blue */
.spec-06 .ch-label {
  transition: none;
}

.spec-06 .ch-label.is-active {
  fill: #2222ff;
  opacity: 1;
}

.spec-06 .ch-hits rect {
  cursor: pointer;
}

/* the readout: one factual line per year (or the idle placeholder) —
   rolled as plain text (NSRoll.text), dim by default */
.spec-06 .spec-readout {
  font-size: 11px;
}

/* ---------- the black band: this section rides it (follows 05), so
   flip to an inverted palette — white ink, dim at 50% white, blue
   stays #2222ff regardless of ground ---------- */
.essay-band .spec-06 .spec-canvas svg text,
.essay-band .spec-06 .spec-canvas svg .ch-cell-solid,
.essay-band .spec-06 .spec-canvas svg .ch-cell-dashed,
.essay-band .spec-06 .ch-ticks {
  color: #fff;
}

.essay-band .spec-06 .spec-canvas svg .sv-dim,
.essay-band .spec-06 .spec-canvas svg .ch-label {
  opacity: 1;
  fill: rgba(255, 255, 255, 0.5);
}

.essay-band .spec-06 .ch-label.is-active {
  fill: #2222ff;
}

.essay-band .spec-06 .spec-readout {
  color: rgba(255, 255, 255, 0.5);
}
