/* threads.css — §12 inter-arc threads on the Ascent spine. Prefix: .th- only.
   The shared state classes .is-lit / .is-dim are defined ONCE in lenses.css and
   MUST NOT be redefined here (PHASE2-CONTRACT §1). This file only scopes thread
   colour/weight; opacity dimming is inherited from the shared classes via group
   compositing. Inherits design tokens (--ink, --serif, etc.) from styles.css. */

/* === the thread weave ===================================================== */
/* A thread = a bowed cubic from spine→spine. Decorative (the parent <g id="threads">
   is aria-hidden); meaning is duplicated as text in the arc page + L2 ridge. */
.th-thread {
  pointer-events: none; /* never steal taps from arc nodes / stations underneath */
}

.th-curve {
  fill: none;
  stroke-width: 1.4;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke; /* keep hairlines crisp through semantic zoom */
}

/* seed = forward set-up: dashed ascender, warm ink + arrowhead (marker-end). */
.th-seed .th-curve {
  stroke: var(--accent, #9a6a2f);
  stroke-dasharray: 5 4;
}

/* callback = a thread back to an earlier rung: solid descender, cool ink + dot. */
.th-callback .th-curve {
  stroke: var(--link, #3a5a78);
  stroke-dasharray: none;
}

/* prereq (defensive — absent from current data): styled like a seed. */
.th-prereq .th-curve {
  stroke: var(--accent, #9a6a2f);
  stroke-dasharray: 2 3;
}

/* endpoint markers inherit the path stroke colour via fill:context-stroke (set in
   the SVG); nothing to colour here. Group opacity (.is-dim) composites over them. */

/* === thread labels (focus mode only) ===================================== */
.th-label {
  font-family: var(--sans, system-ui, sans-serif);
  font-size: 13px;
  fill: var(--ink, #2a2622);
  paint-order: stroke;
  stroke: var(--paper, #f7f3ec);
  stroke-width: 3px;        /* halo so the label reads over the spine/bands */
  stroke-linejoin: round;
}

/* When a lens dims a thread, fade its label with it (compound selector — this is
   USING the shared class, not redefining it). */
.th-thread.is-dim .th-label {
  fill: var(--ink, #2a2622);
}

/* === reduced motion ====================================================== */
/* No JS animation here; the shared .is-lit/.is-dim transitions are already killed
   under reduced-motion in lenses.css. Nothing further required. */