/*
 * css/assessment-dark.css — S80 Phase 2 dark assessment surface (structural shell).
 * Consumes the dark foundation cascade (components/css/foundation/index.css);
 * replaces the cream stack (style.css + the 7 cream CSS + the inline <style>).
 * var(--*) only — zero :root, zero retired-palette hex. Structural shell:
 * clean + on-foundation + contract-complete; the experiential movements are
 * designed on top next.
 */

/* §3 seam: the --taste-* domain register tokens (consumed by the engine's
 * getTasteSignature ts.color) are now canonical in
 * components/css/foundation/foundation-tokens.css — no local redefinition here. */

.m8c-05-assessment,
.m8c-05-assessment *,
.m8c-05-assessment *::before,
.m8c-05-assessment *::after { box-sizing: border-box; }

.m8c-05-assessment {
  margin: 0;
  background: var(--ground);
  color: var(--text);
  font-family: "Inter", system-ui, sans-serif;
  overflow-x: hidden;
}

.m8c-05-assessment .hidden { display: none !important; }

/* fade-in utility (CSS-only reveal; no GSAP) */
.m8c-05-assessment .fade-in { opacity: 0; transform: translateY(8px); transition: opacity var(--dur-slow, 600ms) var(--ease-out), transform var(--dur-slow, 600ms) var(--ease-out); }
.m8c-05-assessment .fade-in.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment .fade-in { transition: none; opacity: 1; transform: none; }
}

/* ── Layout shell ──────────────────────────────────────────────────────────── */
.m8c-05-assessment main,
.m8c-05-assessment .assessment-shell {
  max-width: var(--content-max, 1280px);
  margin: 0 auto;
  padding: var(--space-xl, 4rem) var(--space-gutter, 2rem) var(--space-section, 6rem); /* A+B — raise the hero (smaller top offset) */
}

/* ── Intro ─────────────────────────────────────────────────────────────────── */
/* S80 Movement I — 2-col intro: copy left (constrained to the measure), the calibrating
   FiveAxisModel right. Stacks on mobile. Layout only — the model's own styling is the
   FiveAxisModel primitive (.strata--calibrating). */
.m8c-05-assessment #assessment-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-2xl);
  align-items: start; /* A+B — top-anchor so the CTA sits above the fold at 1440x800 */
  transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out); /* H */
}
.m8c-05-assessment #assessment-intro.is-leaving { opacity: 0; transform: translateY(-12px); } /* H — the hand-off beat */
.m8c-05-assessment .assessment-intro__copy { max-width: var(--measure, 62ch); }
.m8c-05-assessment .assessment-intro__model { position: relative; }
/* (path a) substrate canvas — a sensing field scoped to the model column, behind the
   strata. Hidden in the default css echo; the data-substrate-echo switch flips it on. */
.m8c-05-assessment .intro-substrate { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
.m8c-05-assessment .assessment-intro__model .strata { position: relative; z-index: 1; }
.m8c-05-assessment #assessment-intro[data-substrate-echo="css"] .intro-substrate { display: none; }      /* default: CSS register echo (cleaner) */
.m8c-05-assessment #assessment-intro[data-substrate-echo="canvas"] .intro-substrate { display: block; }  /* switch: literal home-substrate field */
@media (max-width: 900px) {
  .m8c-05-assessment #assessment-intro { grid-template-columns: 1fr; gap: var(--space-lg); }
}
.m8c-05-assessment .assessment-intro__eyebrow {
  color: var(--lime); font-family: "JetBrains Mono", monospace; font-weight: 700;
  text-transform: uppercase; letter-spacing: var(--tracking-label, 0.08em); font-size: var(--fs-mono-label, 0.75rem);
}
.m8c-05-assessment .assessment-intro__title { font-size: var(--fs-section, clamp(2rem, 1.2rem + 3.9vw, 5rem)); line-height: 1.08; margin: var(--space-md) 0; color: var(--text); }
.m8c-05-assessment .assessment-intro__lead { color: var(--text-2); font-size: var(--fs-body); line-height: var(--lh-body, 1.6); max-width: var(--measure, 62ch); }
.m8c-05-assessment .assessment-intro__lead em { color: var(--lime); font-style: italic; } /* C — the can/should pivot = the ONLY lime in the subhead, used sparingly (no full-lime body) */
.m8c-05-assessment .assessment-intro__meta { color: var(--text-3); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); letter-spacing: var(--tracking-label, 0.08em); margin-top: var(--space-md); }
.m8c-05-assessment #start-btn {
  margin-top: var(--space-lg);
  display: inline-flex; align-items: center; gap: var(--space-2xs);
  font-family: "JetBrains Mono", monospace; font-weight: 700; text-transform: uppercase;
  letter-spacing: var(--tracking-label, 0.08em); font-size: 0.9375rem;
  background: var(--lime); color: var(--ground); border: 0; cursor: pointer;
  padding: var(--space-md) var(--space-lg); box-shadow: var(--glow-lime-soft);
  transition: transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.m8c-05-assessment #start-btn:hover { transform: translateY(-2px); box-shadow: var(--glow-lime); }

/* H — intro→Q1 hand-off beat: the calibrating surface fades up and out, the questioning
   surface fades in (the protagonist shifting from orienting to reading). Subtle. */
.m8c-05-assessment #assessment-active.is-entering { opacity: 0; }
.m8c-05-assessment #assessment-active.is-entered { opacity: 1; transition: opacity var(--dur-slow, 680ms) var(--ease-out); }
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment #assessment-intro { transition: none; }
  .m8c-05-assessment #assessment-intro.is-leaving { opacity: 1; transform: none; }
  .m8c-05-assessment #assessment-active.is-entering,
  .m8c-05-assessment #assessment-active.is-entered { opacity: 1; transition: none; }
}

/* ── Progress rail (strata) + signal ticker ────────────────────────────────── */
.m8c-05-assessment .signal-ticker-slot { min-height: 0; flex: 0 0 auto; }
/* M2 v2 — the rail is the app-shell's PINNED TOP ROW in normal flow (mechanism a). It is NOT a
   sticky overlay: in the non-scrolling shell the option region is the only scroll container and it
   sits BELOW the rail, so the rail never needs to stick. flex:0 0 auto reserves its FULL height so
   the step row begins after the rail's box — the prompt is framed below it, never sliced under it.
   (Previously position:sticky z-40 + default flex-shrink let the rail paint past its flow box and
   over the prompt — measured ~17px overlap on P1.) */
.m8c-05-assessment .assessment-progress-rail {
  flex: 0 0 auto;                        /* reserve full height — never shrink under the painted box */
  background: var(--ground);
  padding: var(--space-xs) 0;            /* M2 compacted — reclaim frame height so long questions fit small viewports */
  margin-bottom: var(--space-sm);        /* clearance: frame the question below the rail, not flush */
  border-bottom: 1px solid var(--hairline);
}
.m8c-05-assessment .assessment-progress-rail__eyebrow {
  display: flex; justify-content: space-between; font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem); color: var(--text-3); text-transform: uppercase;
  letter-spacing: var(--tracking-label, 0.08em); margin-bottom: var(--space-2xs);
}
.m8c-05-assessment .assessment-progress-rail__strata { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-sm); } /* 5 phases: pulse + 4 strata */
.m8c-05-assessment .assessment-progress-rail__stratum-label { font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); color: var(--text-2); margin: 0 0 4px; text-transform: lowercase; }
.m8c-05-assessment .assessment-progress-rail__stratum-name { font-size: 0.75rem; color: var(--text-3); margin: 0 0 var(--space-2xs); }
.m8c-05-assessment .assessment-progress-rail__meter { height: 3px; background: var(--hairline); position: relative; overflow: hidden; }
.m8c-05-assessment .assessment-progress-rail__meter-fill { display: block; height: 100%; width: 0; background: var(--lime); transition: width var(--dur-base, 380ms) var(--ease-out), background-color var(--dur-base) var(--ease-out); }

/* M2 — THREE STATES (kills the flat run-on wall): only the ACTIVE phase shows its
   descriptor sub-label; completed + upcoming are quiet label-only waypoints. */
.m8c-05-assessment .assessment-progress-rail__stratum-name { display: none; }                                    /* default: descriptor hidden */
.m8c-05-assessment .assessment-progress-rail__stratum[data-state="active"] { opacity: 1; }                        /* current: prominent */
.m8c-05-assessment .assessment-progress-rail__stratum[data-state="active"] .assessment-progress-rail__stratum-name { display: block; color: var(--text-2); } /* ONLY active shows the descriptor */
.m8c-05-assessment .assessment-progress-rail__stratum[data-state="active"] .assessment-progress-rail__stratum-label { color: var(--lime); }
.m8c-05-assessment .assessment-progress-rail__stratum[data-state="active"] .assessment-progress-rail__meter-fill { background: var(--lime); box-shadow: var(--glow-lime-soft); }
.m8c-05-assessment .assessment-progress-rail__stratum[data-state="done"] { opacity: 0.55; }                       /* completed: quiet passed waypoint */
.m8c-05-assessment .assessment-progress-rail__stratum[data-state="done"] .assessment-progress-rail__meter-fill { background: var(--text-2); }
.m8c-05-assessment .assessment-progress-rail__stratum[data-state="upcoming"] { opacity: 0.4; }                    /* upcoming: compressed/dimmed */

/* M2 — mobile: compact to a meter-marker row; the active phase's descriptor breaks out
   full-width below the markers (prominent), non-active labels collapse. No overflow. */
@media (max-width: 560px) {
  .m8c-05-assessment .assessment-progress-rail__strata { gap: var(--space-2xs); position: relative; padding-bottom: 1.5em; }
  .m8c-05-assessment .assessment-progress-rail__stratum-label { display: none; }
  .m8c-05-assessment .assessment-progress-rail__stratum[data-state="active"] .assessment-progress-rail__stratum-name {
    display: block; position: absolute; left: 0; right: 0; bottom: 0; margin: 0; font-size: 11px;
  }
}

/* ── Question card (BEM) ───────────────────────────────────────────────────── */
/* The card is the app-shell sub-grid: a flex column filling the question column. The header
   (back + eyebrow + prompt) pins at the top; __options is the 1fr scroll region (see below).
   The protagonist lives in the step's model slot beside the card. */
.m8c-05-assessment .assessment-question-card { display: flex; flex-direction: column; min-height: 0; padding: 0; overflow: hidden; }
.m8c-05-assessment .assessment-question-card__main { display: flex; flex-direction: column; min-height: 0; flex: 1 1 auto; }

/* ── M2 STEP FRAME — the question surface is FIXED and does NOT scroll ─────────────────────
   During a question: nav (sticky) + #assessment-active fill the viewport exactly → the PAGE
   never scrolls. The question (left) + carried protagonist (right) fit the frame; if a step
   genuinely overflows, the question COLUMN scrolls INTERNALLY (the page still never scrolls). */
.m8c-05-assessment.assessment-questioning main { padding-top: 0; padding-bottom: 0; }
/* the footer sits after <main>; hide it during a question so nothing extends the page below the frame */
.m8c-05-assessment.assessment-questioning .site-footer { display: none; }
/* ── M2 STEP FRAME v2 — canonical app-shell: dvh viewport + compress-then-SCROLL ──────────────
   The shell = the real visible area (100dvh − sticky nav; 100vh FALLBACK first for progressive
   enhancement). dvh tracks the live visible viewport, so it adapts to browser chrome and zoom —
   no fixed-pixel frame height. The shell NEVER scrolls (overflow:hidden) and stacks its children
   as a column: ticker (auto) + progress rail (auto, pinned) + step (1fr). Scroll is RESTORED but
   CONTAINED: the option list inside the card is the only scrollable region (overflow-y:auto, see
   __options). Most questions compress to fit the 1fr with no scroll; the tallest scroll within the
   option region only. window.scrollY stays 0; prompt + rail stay pinned outside the scroll. */
.m8c-05-assessment.assessment-questioning #assessment-active {
  height: calc(100vh - var(--nav-h, 66px));   /* fallback — browsers without dvh */
  height: calc(100dvh - var(--nav-h, 66px));  /* real visible viewport — adapts to chrome/zoom live */
  display: flex; flex-direction: column; overflow: hidden; /* SHELL never scrolls */
}
.m8c-05-assessment .assessment-step {
  flex: 1 1 auto; min-height: 0; overflow: hidden;        /* the 1fr middle region */
  display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: var(--space-xl);
  align-items: stretch; padding-block: var(--space-xs);
}
/* question column — fills the step; the CARD inside is the app-shell sub-grid (pinned header +
   scrollable option region). The column itself never scrolls — the option region does. */
.m8c-05-assessment #assessment-flow { min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.m8c-05-assessment #assessment-flow > * { width: 100%; flex: 1 1 auto; min-height: 0; } /* the mounted step fills the column */
/* non-question mounts (state-C transition, post-taste prompt) get an overflow-y floor so a tall
   one on a short viewport stays reachable instead of clipping. */
.m8c-05-assessment #assessment-flow > .assessment-transition-stage,
.m8c-05-assessment #assessment-flow > .post-taste-prompt { overflow-y: auto; }
.m8c-05-assessment .assessment-step__model { min-height: 0; align-self: center; overflow: hidden; }
@media (max-width: 900px) {
  .m8c-05-assessment .assessment-step { grid-template-columns: 1fr; padding-block: var(--space-2xs); }
  .m8c-05-assessment .assessment-step__model { display: none; } /* mobile: protagonist hidden so the question fits the frame */
}
/* ── Admin/VC rationale review mode (?admin_key) ───────────────────────────────────────────
   The "// why this question" rationale is appended to the card for ADMIN review only (customers
   never see it — gated in JS). Make the CARD MAIN the scroll region so prompt + options + the
   rationale are all reachable WITHOUT a shell/page scrollbar (window.scrollY stays 0). The option
   list does not scroll independently in this mode. Customer flow (no .assessment-rationale-admin)
   is untouched. */
.m8c-05-assessment.assessment-rationale-admin .assessment-question-card__main { overflow-y: auto; min-height: 0; }
.m8c-05-assessment.assessment-rationale-admin .assessment-question-card__options { flex: 0 0 auto; overflow-y: visible; }
.m8c-05-assessment.assessment-rationale-admin .assessment-side-card { margin-top: var(--space-md); }
.m8c-05-assessment .assessment-question-card__back-btn {
  background: none; border: 0; color: var(--text-3); font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem); cursor: pointer; padding: 0 0 var(--space-xs);
}
.m8c-05-assessment .assessment-question-card__back-btn:hover { color: var(--text); }
.m8c-05-assessment .assessment-question-card__eyebrow {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2xs);
  color: var(--text-3); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem);
  text-transform: uppercase; letter-spacing: var(--tracking-label, 0.08em); margin: 0 0 var(--space-2xs);
}
.m8c-05-assessment .assessment-question-card__eyebrow-pill { color: var(--lime); border: 1px solid var(--hairline-strong, var(--hairline)); padding: 1px 6px; }
.m8c-05-assessment .assessment-question-card__eyebrow-id { color: var(--text-2); }
.m8c-05-assessment .assessment-question-card__prompt { font-size: clamp(1.05rem, 0.92rem + 0.5vw, 1.35rem); line-height: 1.2; color: var(--text); margin: 0 0 var(--space-xs); max-width: 42ch; }
/* options: single column by default; TWO-COLUMN for short-label long lists (7+, JS adds --grid)
   so the longest question (P3, 9 options) fits the frame — no inner scroll, ever. */
.m8c-05-assessment .assessment-question-card__options { display: grid; grid-template-columns: 1fr; gap: var(--space-3xs); flex: 1 1 auto; min-height: 0; overflow-y: auto; align-content: start; } /* the 1fr scroll region — compresses to fit, scrolls only when the tallest questions overflow */
.m8c-05-assessment .assessment-question-card__options--grid { grid-template-columns: repeat(2, 1fr); }
.m8c-05-assessment .assessment-question-card__option {
  display: flex; align-items: baseline; gap: var(--space-sm); width: 100%; text-align: left;
  background: var(--surface-1, rgba(255,255,255,0.02)); color: var(--text); border: 1px solid var(--hairline);
  padding: var(--space-2xs) var(--space-sm); cursor: pointer; font: inherit; position: relative; /* compact: 1-line ~38px, 2-line ~58px */
  transition: border-color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
}
/* GRID mode (P3 / sub-industry): narrow columns force long industry labels to wrap 2–3 lines.
   Tighten type so even a 3-line wrap caps at ~70px → 5 rows fit the frame at small viewports. */
.m8c-05-assessment .assessment-question-card__options--grid .assessment-question-card__option-body { font-size: 0.9375rem; line-height: 1.2; }
/* Sub-flow active (taste reasoning / follow-up / CU2 / sub-industry / adaptive): the original
   options were already answered — collapse them so the appended sub-flow fits the no-scroll
   frame. Without this, the taste reasoning buttons land below the fold and are unreachable
   (no page scroll, no inner scroll) — the user cannot advance. Primary hook is the JS-set
   .has-subflow class (engine-independent); the :has() form is kept as a redundant backstop. */
.m8c-05-assessment .assessment-question-card.has-subflow .assessment-question-card__options,
.m8c-05-assessment .assessment-question-card:has(.taste-reasoning-options, .assessment-followup-card, .cu2-freetext, .sub-industry-container) .assessment-question-card__options { display: none; }
/* When the taste reasoning is active, the scenario prompt has been read — let it recede so the
   reasoning question (the now-primary choice) + its options fit the frame on short viewports. */
.m8c-05-assessment .assessment-question-card.has-taste-reasoning .assessment-question-card__prompt,
.m8c-05-assessment .assessment-question-card:has(.taste-reasoning-options) .assessment-question-card__prompt { font-size: 1rem; line-height: 1.3; margin-bottom: var(--space-2xs); }
/* Sub-flow active: __main (pinned prompt + collapsed options) takes natural height; the appended
   sub-flow (a card sibling of __main) becomes the 1fr scroll region so a tall one (e.g. the
   sub-industry picker) stays reachable rather than clipping. */
.m8c-05-assessment .assessment-question-card.has-subflow .assessment-question-card__main { flex: 0 0 auto; }
.m8c-05-assessment .assessment-question-card.has-subflow > .taste-reasoning-options,
.m8c-05-assessment .assessment-question-card.has-subflow > .assessment-followup-card,
.m8c-05-assessment .assessment-question-card.has-subflow > .cu2-freetext,
.m8c-05-assessment .assessment-question-card.has-subflow > .sub-industry-container,
.m8c-05-assessment .assessment-question-card.has-subflow > .assessment-adaptive { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.m8c-05-assessment .assessment-question-card__option:hover:not([disabled]) { border-color: var(--text-3); }
.m8c-05-assessment .assessment-question-card__option[disabled] { opacity: 0.4; cursor: default; }
.m8c-05-assessment .assessment-question-card__option--selected { border-color: var(--lime); background: color-mix(in srgb, var(--lime) 10%, transparent); }
.m8c-05-assessment .assessment-question-card__option--na { color: var(--text-3); font-style: italic; }
.m8c-05-assessment .assessment-question-card__option-key { color: var(--lime); font-family: "JetBrains Mono", monospace; font-weight: 700; min-width: 1.5em; }
.m8c-05-assessment .assessment-question-card__option-body { color: var(--text); flex: 1; line-height: 1.25; }
/* ── Mobile (≤600px): single column reads cleaner than cramped 2-col at 390px. Compact the
   type so long-sentence options wrap to 2 lines (~55px) not 3 (~91px) → every question fits
   the frame with no page scroll. Hover-only pick affordance is dropped (useless on touch). */
@media (max-width: 600px) {
  .m8c-05-assessment .assessment-question-card__options--grid { grid-template-columns: 1fr; }
  .m8c-05-assessment .assessment-question-card__prompt { font-size: 1.05rem; }
  .m8c-05-assessment .assessment-question-card__option,
  .m8c-05-assessment .option-button,
  .m8c-05-assessment .follow-up-option,
  .m8c-05-assessment .taste-reasoning-btn { padding: var(--space-2xs) var(--space-sm); }
  .m8c-05-assessment .assessment-question-card__option-body { font-size: 0.9375rem; line-height: 1.3; }
  .m8c-05-assessment .assessment-question-card__option-pick { display: none; }
  .m8c-05-assessment .sub-industry-container,
  .m8c-05-assessment .assessment-followup-card,
  .m8c-05-assessment .taste-reasoning-options,
  .m8c-05-assessment .cu2-freetext,
  .m8c-05-assessment .assessment-adaptive { margin-top: var(--space-2xs); } /* reclaim the last few px so the sub-flow + skip fit cleanly */
  .m8c-05-assessment .sub-industry-prompt,
  .m8c-05-assessment .assessment-followup-card__prompt,
  .m8c-05-assessment .taste-reasoning-lead,
  .m8c-05-assessment .cu2-freetext-prompt,
  .m8c-05-assessment .assessment-adaptive__prompt { margin-bottom: var(--space-2xs); }
}
.m8c-05-assessment .assessment-question-card__option-pick { color: var(--text-3); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); opacity: 0; transition: opacity var(--dur-fast) var(--ease-out); }
.m8c-05-assessment .assessment-question-card__option:hover .assessment-question-card__option-pick { opacity: 1; }

/* Side card (rationale) */
.m8c-05-assessment .assessment-side-card__panel { border-left: 2px solid var(--hairline-strong, var(--hairline)); padding-left: var(--space-md); }
.m8c-05-assessment .assessment-side-card__label { color: var(--lime); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); text-transform: uppercase; margin: 0 0 var(--space-sm); }
.m8c-05-assessment .assessment-side-card__title { color: var(--text); font-size: 1rem; line-height: 1.4; margin: 0 0 var(--space-sm); }
.m8c-05-assessment .assessment-side-card__title em { color: var(--lime); font-style: italic; }
.m8c-05-assessment .assessment-side-card__body { color: var(--text-2); font-size: 0.875rem; line-height: var(--lh-body, 1.6); margin: 0 0 var(--space-sm); }
.m8c-05-assessment .assessment-side-card__why { color: var(--text-3); font-size: 0.8125rem; line-height: 1.5; margin: 0; }
.m8c-05-assessment .assessment-side-card__why b { color: var(--text-2); }
.m8c-05-assessment .question-insight { color: var(--text-2); font-size: 0.875rem; border-left: 2px solid var(--lime); padding-left: var(--space-md); margin-top: var(--space-md); }

/* ── Sub-industry / follow-up / taste-reasoning / CU2 / adaptive / post-taste ─ */
.m8c-05-assessment .sub-industry-container,
.m8c-05-assessment .assessment-followup-card,
.m8c-05-assessment .taste-reasoning-options,
.m8c-05-assessment .cu2-freetext,
.m8c-05-assessment .assessment-adaptive { margin-top: var(--space-sm); display: flex; flex-direction: column; gap: var(--space-2xs); max-width: var(--measure, 62ch); }
/* sub-industry can carry many options → compact two-column grid so it fits the frame (no inner scroll) */
.m8c-05-assessment .sub-industry-container { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-3xs); max-width: none; }
@media (max-width: 600px) { .m8c-05-assessment .sub-industry-container { grid-template-columns: 1fr; } }
.m8c-05-assessment .sub-industry-prompt,
.m8c-05-assessment .assessment-followup-card__prompt,
.m8c-05-assessment .taste-reasoning-lead,
.m8c-05-assessment .cu2-freetext-prompt,
.m8c-05-assessment .assessment-adaptive__prompt,
.m8c-05-assessment .assessment-adaptive__framing { color: var(--text); margin: 0 0 var(--space-sm); }
.m8c-05-assessment .assessment-adaptive__framing { color: var(--text-3); font-size: 0.875rem; }
.m8c-05-assessment .option-button,
.m8c-05-assessment .follow-up-option,
.m8c-05-assessment .taste-reasoning-btn {
  text-align: left; background: var(--surface-1, rgba(255,255,255,0.02)); color: var(--text);
  border: 1px solid var(--hairline); padding: var(--space-2xs) var(--space-sm); cursor: pointer; font: inherit; font-size: 0.9375rem; line-height: 1.2;
  transition: border-color var(--dur-fast) var(--ease-out);
}
.m8c-05-assessment .option-button:hover,
.m8c-05-assessment .follow-up-option:hover,
.m8c-05-assessment .taste-reasoning-btn:hover { border-color: var(--lime); }

/* ── Beat 2 — the second click (the designed moment) ────────────────────────── */
/* E3 — lean-in: mono-label eyebrow + the verbatim engine lead-in. */
.m8c-05-assessment .taste-reasoning-eyebrow {
  font-size: var(--fs-mono-label); letter-spacing: var(--tracking-label); text-transform: uppercase;
  color: var(--text-3); margin: var(--space-sm) 0 var(--space-2xs);
}
.m8c-05-assessment .taste-reasoning-lead { font-size: var(--fs-body); line-height: var(--lh-body); color: var(--text); }
/* E4 — reasoning options as quieter siblings (override the shared option styling above):
   --text-2 on transparent; hover lifts to --text + --hairline-strong; --lime is reserved for
   the SELECTED flash — the only accent mid-flow (no domain/register color pre-result). */
.m8c-05-assessment .taste-reasoning-btn { background: transparent; color: var(--text-2); }
.m8c-05-assessment .taste-reasoning-btn:hover,
.m8c-05-assessment .taste-reasoning-btn:focus-visible { color: var(--text); border-color: var(--hairline-strong); }
.m8c-05-assessment .taste-reasoning-btn--selected { color: var(--text); border-color: var(--lime); }
.m8c-05-assessment .taste-reasoning-btn[disabled] { cursor: default; }
/* E1 — the chosen call PINS: keep the options container (override the generic has-subflow
   collapse) so the selected option holds as a condensed call (wrapping — full text visible)
   with a 2px --lime left edge (accent, NOT a register); the unchosen options hide. */
.m8c-05-assessment .assessment-question-card.has-taste-reasoning .assessment-question-card__options { display: block; }
.m8c-05-assessment .assessment-question-card.has-taste-reasoning .assessment-question-card__option:not(.assessment-question-card__option--selected) { display: none; }
.m8c-05-assessment .assessment-question-card.has-taste-reasoning .assessment-question-card__option--selected {
  background: transparent; border: 0; border-left: 2px solid var(--lime); border-radius: 0;
  color: var(--text); padding: var(--space-2xs) var(--space-sm); cursor: default;
  /* D1 — the pinned call WRAPS: the full call text stays visible, never clipped mid-sentence. */
  white-space: normal; overflow-wrap: anywhere;
}
.m8c-05-assessment .assessment-question-card.has-taste-reasoning .assessment-question-card__option--selected .assessment-question-card__option-pick { display: none; }
.m8c-05-assessment .sub-industry-skip,
.m8c-05-assessment .cu2-skip,
.m8c-05-assessment .post-taste-skip,
.m8c-05-assessment .assessment-adaptive__skip { color: var(--text-3); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); margin-top: var(--space-sm); }
.m8c-05-assessment .other-industry-input,
.m8c-05-assessment .cu2-freetext-input,
.m8c-05-assessment .assessment-adaptive__input,
.m8c-05-assessment .post-taste-textarea {
  background: var(--surface-1, rgba(255,255,255,0.03)); color: var(--text);
  border: 1px solid var(--hairline); padding: var(--space-sm) var(--space-md); font: inherit; width: 100%;
}
.m8c-05-assessment .cu2-freetext-submit,
.m8c-05-assessment .assessment-adaptive__submit,
.m8c-05-assessment .post-taste-submit { align-self: flex-start; margin-top: var(--space-sm); background: var(--lime); color: var(--ground); border: 0; padding: var(--space-sm) var(--space-lg); font-family: "JetBrains Mono", monospace; font-weight: 700; text-transform: uppercase; letter-spacing: var(--tracking-label, 0.08em); cursor: pointer; }

/* ── Transition stage (State C) ────────────────────────────────────────────── */
.m8c-05-assessment .assessment-transition-stage { padding: var(--space-section, 6rem) 0; max-width: var(--measure, 62ch); }
.m8c-05-assessment .assessment-transition-stage__eyebrow { color: var(--lime); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); text-transform: uppercase; margin: 0 0 var(--space-md); }
.m8c-05-assessment .assessment-transition-stage__title { font-size: var(--fs-subhead, 1.75rem); color: var(--text); margin: 0 0 var(--space-md); }
.m8c-05-assessment .assessment-transition-stage__body { color: var(--text-2); line-height: var(--lh-body, 1.6); margin: 0 0 var(--space-lg); }

/* ── Capture stage (State D) ───────────────────────────────────────────────── */
.m8c-05-assessment .email-capture-screen { max-width: var(--measure, 62ch); margin: 0 auto; padding: var(--space-xl) 0; }
.m8c-05-assessment .assessment-capture-stage__eyebrow { color: var(--lime); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); text-transform: uppercase; margin: 0 0 var(--space-md); }
.m8c-05-assessment .assessment-capture-stage__heading { font-size: var(--fs-subhead, 1.75rem); color: var(--text); margin: 0 0 var(--space-sm); }
.m8c-05-assessment .assessment-capture-stage__lede { color: var(--text-2); line-height: var(--lh-body, 1.6); margin: 0 0 var(--space-lg); }
.m8c-05-assessment .assessment-capture-stage__fields { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-sm); margin-bottom: var(--space-md); }
.m8c-05-assessment .assessment-capture-stage__fields input { background: var(--surface-1, rgba(255,255,255,0.03)); color: var(--text); border: 1px solid var(--hairline); padding: var(--space-sm) var(--space-md); font: inherit; }
.m8c-05-assessment .assessment-capture-stage__fields input:focus-visible { outline: 2px solid var(--lime); outline-offset: 1px; }
.m8c-05-assessment #capture-email, .m8c-05-assessment #capture-role { grid-column: 1 / -1; }
@media (max-width: 560px) { .m8c-05-assessment .assessment-capture-stage__fields { grid-template-columns: 1fr; } }
.m8c-05-assessment .assessment-capture-stage__submit { background: var(--lime); color: var(--ground); border: 0; padding: var(--space-md) var(--space-lg); font-family: "JetBrains Mono", monospace; font-weight: 700; text-transform: uppercase; letter-spacing: var(--tracking-label, 0.08em); cursor: pointer; }
.m8c-05-assessment .assessment-capture-stage__submit[disabled] { opacity: 0.5; cursor: default; }
.m8c-05-assessment .capture-error { color: var(--state-critical); font-size: 0.875rem; margin-top: var(--space-sm); }
.m8c-05-assessment .assessment-capture-stage__manifest { margin-top: var(--space-lg); border-top: 1px solid var(--hairline); padding-top: var(--space-md); }
.m8c-05-assessment .assessment-capture-stage__manifest-head { color: var(--lime); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); text-transform: uppercase; margin: 0 0 var(--space-sm); }
.m8c-05-assessment .assessment-capture-stage__manifest-list { color: var(--text-2); padding-left: 1.2em; line-height: 1.7; margin: 0; }

/* ── Results ───────────────────────────────────────────────────────────────── */
/* F9 — brief-as-hero: the results stack becomes a flex column so CSS `order` can promote the
   #executive-brief-section to the HERO directly under the verdict, demoting the read-chapters
   one tier BELOW it. CSS-ORDER ONLY — zero DOM mutation, zero new selector exposure; the M4
   un-hide / close-gate / scroll-gating chain is reference-based and order-blind (Phase-0).
   .hidden children are display:none (collapse); .result-section spacing is padding + border-top
   (no vertical margins → no margin-collapse), so the column renders identical spacing. Every
   direct child is ordered explicitly so none defaults to order:0 and jumps ahead of the verdict. */
.m8c-05-assessment .assessment-results { max-width: var(--content-max, 1280px); margin: 0 auto; display: flex; flex-direction: column; }
.m8c-05-assessment .assessment-results > #email-capture-screen { order: 0; }
.m8c-05-assessment .assessment-results > .results-header { order: 1; }       /* the verdict still opens (the snap's earned drama) */
.m8c-05-assessment .assessment-results > #executive-brief-section { order: 2; } /* the brief leads — the hero, by position + scale + space */
.m8c-05-assessment .assessment-results > #detailed-results { order: 3; }     /* the read-chapters demote one tier, scroll-revealed below */
.m8c-05-assessment .assessment-results > #reveal-close { order: 4; }
.m8c-05-assessment .assessment-results > #share-card { order: 5; }
.m8c-05-assessment .assessment-results > #team-comparison { order: 6; }
.m8c-05-assessment .assessment-results > #feedback-card { order: 7; }
.m8c-05-assessment .assessment-results > .retake-wrapper { order: 8; }       /* failure-path in-place fallback sits last, as today */
.m8c-05-assessment .result-section { padding: var(--space-xl) 0; border-top: 1px solid var(--hairline); }
.m8c-05-assessment .result-section-title { color: var(--lime); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); font-weight: 700; text-transform: uppercase; letter-spacing: var(--tracking-label, 0.08em); margin-bottom: var(--space-md); } /* X2 — chapter eyebrows at the proven mono-label 700 */
.m8c-05-assessment .results-header { padding: var(--space-section, 6rem) 0 var(--space-lg); text-align: center; }
.m8c-05-assessment .verdict-badge { display: inline-block; font-family: "JetBrains Mono", monospace; font-weight: 700; text-transform: uppercase; letter-spacing: var(--tracking-label, 0.08em); color: var(--lime); font-size: var(--fs-subhead, 1.75rem); }
.m8c-05-assessment .verdict-bar { height: 4px; background: var(--hairline); max-width: 320px; margin: var(--space-md) auto; overflow: hidden; }
.m8c-05-assessment .verdict-bar-fill { height: 100%; width: 0; background: var(--lime); transition: width var(--dur-slow, 680ms) var(--ease-out); }
.m8c-05-assessment .verdict-score { display: block; color: var(--text); font-size: var(--fs-section, 3rem); font-weight: 700; }
.m8c-05-assessment .verdict-summary { color: var(--text-2); font-weight: 500; max-width: var(--measure, 62ch); margin: var(--space-md) auto 0; line-height: var(--lh-body, 1.6); }
.m8c-05-assessment .verdict-framing { color: var(--text-3); font-weight: 500; font-style: italic; max-width: var(--measure, 62ch); margin: var(--space-sm) auto 0; }

/* Layer bars */
.m8c-05-assessment .layer-row { display: grid; grid-template-columns: 1fr; gap: var(--space-2xs); padding: var(--space-sm) 0; }
.m8c-05-assessment .layer-label { display: flex; align-items: baseline; gap: var(--space-sm); flex-wrap: wrap; }
.m8c-05-assessment .layer-name { color: var(--text); font-weight: 500; }
.m8c-05-assessment .layer-score-label { color: var(--text-2); font-family: "JetBrains Mono", monospace; font-size: 0.875rem; font-weight: 700; margin-left: auto; }
.m8c-05-assessment .layer-score-label.not-assessed, .m8c-05-assessment .layer-score-label.insufficient-data { color: var(--text-3); }
.m8c-05-assessment .constraint-tag { color: var(--ground); background: var(--lime); font-family: "JetBrains Mono", monospace; font-size: 0.625rem; text-transform: uppercase; padding: 1px 6px; }
.m8c-05-assessment .quick-assessment-note, .m8c-05-assessment .limited-data-note { color: var(--text-3); font-size: 0.75rem; font-weight: 500; }
.m8c-05-assessment .layer-bar { height: 6px; background: var(--hairline); overflow: hidden; }
.m8c-05-assessment .layer-bar-fill { height: 100%; width: 0; background: var(--lime); }
.m8c-05-assessment .layer-row.is-constraint .layer-name { color: var(--lime); }

/* Taste card */
.m8c-05-assessment .taste-card { border-left: 3px solid var(--lime); padding-left: var(--space-md); }
.m8c-05-assessment .taste-header { display: flex; align-items: baseline; gap: var(--space-sm); }
.m8c-05-assessment .taste-name { font-size: var(--fs-subhead, 1.5rem); font-weight: 700; color: var(--lime); }
.m8c-05-assessment .taste-description { color: var(--text-2); font-weight: 500; line-height: var(--lh-body, 1.6); margin: var(--space-sm) 0; max-width: var(--measure, 62ch); }
.m8c-05-assessment .taste-characterization { color: var(--text-2); font-weight: 500; line-height: var(--lh-body, 1.6); max-width: var(--measure, 62ch); }
.m8c-05-assessment .taste-dimensions { display: grid; gap: var(--space-sm); margin-top: var(--space-md); max-width: 480px; }
.m8c-05-assessment .taste-dim { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--space-sm); }
.m8c-05-assessment .taste-dim-label { color: var(--text-2); font-size: 0.875rem; }
.m8c-05-assessment .taste-dim-track { grid-column: 1 / -1; height: 4px; background: var(--hairline); overflow: hidden; }
.m8c-05-assessment .taste-dim-bar { height: 100%; width: 0; background: var(--lime); transition: width var(--dur-base, 380ms) var(--ease-out); }
.m8c-05-assessment .taste-dim-value { color: var(--text-3); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); font-weight: 700; } /* X5 — collapse the 0.8125rem sub-size to mono-label; lime override at :658, 700 band-value weight */

/* Constraint + benchmark */
.m8c-05-assessment .constraint-block h4 { color: var(--text); font-size: var(--fs-subhead, 1.5rem); font-weight: 700; margin: 0 0 var(--space-sm); } /* X1 — the binding constraint is the loudest heading via WEIGHT+SCALE (text/700/subhead); lime stays scarce — the chapter eyebrow carries it (hero doctrine) */
.m8c-05-assessment .constraint-block p { color: var(--text-2); font-weight: 500; line-height: var(--lh-body, 1.6); max-width: var(--measure, 62ch); margin: 0; }
.m8c-05-assessment .benchmark-line { color: var(--text-3); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); font-weight: 500; padding: var(--space-md) 0; }

/* ── Brief ─────────────────────────────────────────────────────────────────── */
/* F4 (C1) visual stability — reserve the forge frame on the SECTION (which holds BOTH the
   rail and the brief container), not just .brief-text-container: this absorbs the rail's
   own collapse on first delta (it still goes .hidden for the M4 c1 gate, but the section's
   reserved height means the close below does NOT jump at the rail->stream handoff) AND
   gives the streaming brief a stable frame so early growth doesn't reflow the close. The
   reserve is a HEURISTIC (final brief length is unknown a priori) — sized to cover the
   rail + the first section without a viewport-sized empty gap; conductor-tunable. As the
   brief streams past the reserve the section grows naturally (and scroll-follow, C2, tracks
   the growing bottom so the genuine growth is followed, not seen as a jump). */
.m8c-05-assessment #executive-brief-section { min-height: 24rem; }
/* F8 (C5) forge-becomes-keepsake — as the close's ARTIFACT beat (the keepsake) enters, the
   forge gently recedes so the kept artifact takes the foreground (the cream/lime keepsake is
   already visually dominant on dark, so a SUBTLE settle-back is enough — no heavy dim that
   would bury the 100/100 brief, no DOM-restructuring morph). Opacity-only (the dwell beacon
   reads geometry, untouched). The true cross-element FLIP morph was scoped out per Phase 0
   (dark↔cream is jarring + needs a DOM restructure) — this is the restrained handoff. */
.m8c-05-assessment #executive-brief-section.is-handed-off { opacity: 0.72; transition: opacity var(--dur-reveal) var(--ease-out); }
@media (prefers-reduced-motion: reduce) { .m8c-05-assessment #executive-brief-section.is-handed-off { transition: none; } }
.m8c-05-assessment .brief-divider { border: 0; border-top: 1px solid var(--hairline); margin: 0 0 var(--space-md); }
.m8c-05-assessment .brief-status { color: var(--text-2); font-weight: 500; font-style: italic; }
.m8c-05-assessment .brief-text-container { color: var(--text-2); font-weight: 500; line-height: var(--lh-body, 1.6); max-width: var(--measure, 62ch); } /* X2 — streamed brief body at the weight floor */
.m8c-05-assessment .brief-section-header { color: var(--text); font-size: 1.125rem; font-weight: 700; margin: var(--space-lg) 0 var(--space-sm); } /* X2 — in-stream headings 600-700 on dark */
.m8c-05-assessment .brief-paragraph { margin: 0 0 var(--space-md); }
.m8c-05-assessment .brief-paragraph strong { color: var(--text); }
.m8c-05-assessment .brief-list { padding-left: 1.2em; margin: 0 0 var(--space-md); }
.m8c-05-assessment .brief-list li { margin-bottom: var(--space-2xs); }

/* ── Forge choreography (F7 per-section settle + F2 follow affordance) ──────────
   F7 — each brief section settles in as its real ## boundary streams (REAL section order,
   never staged diagnostic layers). GATED to .is-streaming so the verified-complete
   re-render does NOT re-animate every section at once. F2 — the "jump to latest" pill,
   shown only while the reader has scrolled up off the live stream (the controller adds/
   removes .hidden). Tokens only; reduced-motion zeroes the settle (the follow itself is a
   JS no-op under reduced-motion). The crescendo (F5) is the emergent rhythm wait→write→
   arrival — its peak is the close/keepsake settle, not a %-bar. */
@keyframes forge-section-settle { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.m8c-05-assessment .brief-text-container.is-streaming .brief-section-header { animation: forge-section-settle var(--dur-slow) var(--ease-out) both; }
.m8c-05-assessment .brief-jump-latest {
  position: fixed;
  left: 50%;
  bottom: var(--space-lg);
  transform: translateX(-50%);
  z-index: 20;
  background: var(--surface-2);
  color: var(--text);
  font-weight: 700; /* register affordance — reads as an action, clears the X2 floor */
  border: 1px solid var(--hairline-strong);
  border-radius: 999px;
  padding: var(--space-2xs) var(--space-md);
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: var(--glow-lime-soft);
}
.m8c-05-assessment .brief-jump-latest:hover { color: var(--lime); }
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment .brief-text-container.is-streaming .brief-section-header { animation: none; }
}

/* ── Beat 0 — S3 taste threshold (gear-shift interstitial) ──────────────────── */
.m8c-05-assessment .assessment-taste-threshold {
  max-width: var(--measure);
  margin: 0 auto;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out);
}
.m8c-05-assessment .assessment-taste-threshold.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment .assessment-taste-threshold { transition: none; opacity: 1; transform: none; }
}
.m8c-05-assessment .assessment-taste-threshold__eyebrow {
  font-size: var(--fs-mono-label); letter-spacing: var(--tracking-label); text-transform: uppercase;
  color: var(--text-3); margin: 0 0 var(--space-md);
}
.m8c-05-assessment .assessment-taste-threshold__headline {
  font-size: var(--fs-subhead); line-height: var(--lh-subhead); font-weight: 600;
  color: var(--text); margin: 0 0 var(--space-md);
}
.m8c-05-assessment .assessment-taste-threshold__body {
  font-size: var(--fs-body); line-height: var(--lh-body); color: var(--text-2); margin: 0 0 var(--space-lg);
}
.m8c-05-assessment .assessment-taste-threshold__cta {
  font: inherit; font-size: var(--fs-body); color: var(--text);
  background: transparent; border: 1px solid var(--hairline-strong); border-radius: var(--radius-md);
  padding: var(--space-sm) var(--space-lg); cursor: pointer;
  transition: border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.m8c-05-assessment .assessment-taste-threshold__cta:hover,
.m8c-05-assessment .assessment-taste-threshold__cta:focus-visible { border-color: var(--lime); background: var(--surface-1); }

/* ── Beat 1 — taste SCENARIO register (additive tier-3 modifier; one render entry) ── */
.m8c-05-assessment .assessment-question-card--taste { transition-duration: var(--dur-slow); }
/* D2 — taste fold bias: the four long-sentence calls must sit in-frame without scrolling at
   viewport heights >=640px. The compress band (prompt scale + boxed padding + option gap +
   option padding) is height-responsive (vh clamps) so it tightens BEFORE the option region's
   overflow-y scroll engages; scroll stays the floor only below ~640px. */
.m8c-05-assessment .assessment-question-card--taste .assessment-question-card__prompt {
  font-size: clamp(1.05rem, 0.92rem + 0.5vh, var(--fs-subhead)); line-height: 1.3;
  background: var(--surface-1); border: 1px solid var(--hairline);
  padding: clamp(var(--space-2xs), 1.3vh, var(--space-md)); border-radius: var(--radius-md);
}
.m8c-05-assessment .assessment-question-card--taste .assessment-question-card__options { gap: clamp(var(--space-3xs), 1vh, var(--space-sm)); }
.m8c-05-assessment .assessment-question-card--taste .assessment-question-card__option { padding: var(--space-3xs) var(--space-sm); }
.m8c-05-assessment .assessment-question-card--taste .assessment-question-card__option-body { line-height: 1.25; }

/* ── Brief action cards (S80 — dark skin of the cream renderBrief structure:
   urgency horizon-group cards + neutral what-to-do-group + non-card lead-in) ── */
.m8c-05-assessment .horizon-group {
  margin: var(--space-md) 0;
  padding: var(--space-md);
  background: var(--surface-1);
  border-radius: var(--radius-md);
  border-left: 2px solid var(--accent);
  opacity: 0;
  transform: translateY(8px);
  transition: opacity var(--dur-slow, 600ms) var(--ease-out), transform var(--dur-slow, 600ms) var(--ease-out);
}
.m8c-05-assessment .horizon-group.visible { opacity: 1; transform: none; }
.m8c-05-assessment .horizon-group.urgency-week { border-left-color: var(--text-2); }
.m8c-05-assessment .horizon-group.urgency-month { border-left-color: var(--text-3); }
.m8c-05-assessment .horizon-label {
  font-size: 0.75rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--accent); margin-bottom: var(--space-2xs);
}
.m8c-05-assessment .horizon-subtitle { font-size: 0.875rem; color: var(--text-2); font-weight: 500; margin: 0 0 var(--space-sm); }
.m8c-05-assessment .horizon-action {
  padding: var(--space-sm) 0;
  border-top: 1px solid var(--surface-2);
  color: var(--text);
  font-weight: 500; /* X2 — the brief's Right Now / This Week / This Month moves are load-bearing prose */
}
.m8c-05-assessment .horizon-action strong { color: var(--text); }
.m8c-05-assessment .what-to-do-leadin { color: var(--text-2); font-weight: 500; margin: 0 0 var(--space-sm); }
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment .horizon-group { transition: none; opacity: 1; transform: none; }
}

/* ── Post-brief enrichment-confirm banner (S80 — shown only on enrichment success) ── */
.m8c-05-assessment .brief-enrichment-confirm {
  margin: var(--space-md) 0 0;
  font-size: 0.875rem;
  color: var(--text-2);
  opacity: 0;
  transition: opacity var(--dur-slow, 600ms) var(--ease-out);
}
.m8c-05-assessment .brief-enrichment-confirm.visible { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment .brief-enrichment-confirm { transition: none; opacity: 1; }
}
.m8c-05-assessment .brief-chunk { display: block; margin-bottom: var(--space-2xs); }
.m8c-05-assessment .brief-loading { display: inline-flex; align-items: center; gap: var(--space-2xs); color: var(--text-3); font-family: "JetBrains Mono", monospace; font-size: var(--fs-mono-label, 0.75rem); font-weight: 500; }
.m8c-05-assessment .brief-spinner { width: 10px; height: 10px; border: 2px solid var(--hairline); border-top-color: var(--lime); border-radius: 50%; animation: m8c05-spin 0.8s linear infinite; }
@keyframes m8c05-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .m8c-05-assessment .brief-spinner { animation: none; } }

/* ── M4 Phase A — THE SNAP (model-becomes-results + the verdict snap) ─────────
   A2 — #assessment-active persists at results (.is-results, set by enterResultsStage).
   The questioning chrome (rail, ticker, the mounted step) exits at --dur-base; JS
   collapses it after the fade. The FiveAxisModel holds alone in its column; the score
   fill grammar itself lives in FiveAxisModel.css (RESULTS-READ block). */
.m8c-05-assessment #assessment-active.is-results .assessment-progress-rail,
.m8c-05-assessment #assessment-active.is-results .signal-ticker-slot,
.m8c-05-assessment #assessment-active.is-results #assessment-flow > :not(.results-header) {
  opacity: 0;
  transition: opacity var(--dur-base) var(--ease-out);
}
.m8c-05-assessment #assessment-active.is-results .assessment-step { align-items: center; }
/* A3 — the verdict snap takes the vacated question column, beside the held model.
   The cluster keeps its anatomy (ids untouched); only the stage placement restyles. */
.m8c-05-assessment #assessment-active.is-results .results-header {
  text-align: left;
  padding: var(--space-md) 0;
  border-top: 0;
}
/* A′ B6 — the verdict children rise 12px + fade at --dur-reveal, staggered
   eyebrow → gloss +150 → score +300 → summary +500. The bar element rides with
   the score; its WIDTH tween starts at the bar-onset beat ("bar animates after
   score"). Delays live only on .is-entered so the skip's snap-instant kills them. */
.m8c-05-assessment #assessment-active.is-results .results-header > * {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out);
}
.m8c-05-assessment #assessment-active.is-results .results-header.is-entered > * { opacity: 1; transform: none; }
.m8c-05-assessment #assessment-active.is-results .results-header.is-entered > #verdict-badge { transition-delay: 150ms; }
.m8c-05-assessment #assessment-active.is-results .results-header.is-entered > #verdict-bar,
.m8c-05-assessment #assessment-active.is-results .results-header.is-entered > #verdict-score { transition-delay: 300ms; }
.m8c-05-assessment #assessment-active.is-results .results-header.is-entered > #verdict-summary,
.m8c-05-assessment #assessment-active.is-results .results-header.is-entered > #verdict-framing { transition-delay: 500ms; }
.m8c-05-assessment #assessment-active.is-results .verdict-bar { margin: var(--space-md) 0; }
.m8c-05-assessment #assessment-active.is-results .verdict-summary,
.m8c-05-assessment #assessment-active.is-results .verdict-framing { margin-left: 0; margin-right: 0; }

/* A′ B1/B6 — the model stages toward center (scale 1.12, compositor-only) for the
   readings, then glides to rest at arrival. --stage-shift is JS-measured at B1. */
.m8c-05-assessment #assessment-active.is-results .assessment-step__model { overflow: visible; }
.m8c-05-assessment #assessment-active.is-results .strata--reading {
  transition: transform var(--dur-slow) var(--ease-out);
  transform-origin: center;
}
.m8c-05-assessment #assessment-active.is-results .strata--reading.is-staged {
  transform: translateX(var(--stage-shift, 0px)) scale(1.12);
}

/* A′2 — snap-instant: the skip lands the settled state with zero motion */
.m8c-05-assessment .snap-instant,
.m8c-05-assessment .snap-instant *,
.m8c-05-assessment .snap-instant *::before,
.m8c-05-assessment .snap-instant *::after { transition: none !important; animation: none !important; }

/* A′4 — the readout eyebrow (replaces the h2: the read needs a register, not a headline) */
.m8c-05-assessment .readout-eyebrow {
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  font-weight: 700; /* X2 — the verdict register label, promoted with its sibling eyebrows */
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-2);
  margin: 0 0 var(--space-sm);
}

/* A′3 — retake as a register affordance (mono-label, hairline underline — never a
   default button); hidden through the snap, enters at B6 in the read's footer. */
.m8c-05-assessment #retake-btn {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--hairline);
  border-radius: 0;
  padding: 0 0 2px;
  cursor: pointer;
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text);
  font-weight: 700; /* Gap A — RETAKE is a peak-end ACTION (M5 retake_started), not the dimmest text */
  border-bottom-color: var(--hairline-strong);
  transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.m8c-05-assessment #retake-btn:hover { color: var(--lime); border-bottom-color: var(--lime); }

@media (max-width: 900px) {
  /* mobile: the model (hidden during questioning) returns for the snap, above the verdict */
  .m8c-05-assessment #assessment-active.is-results .assessment-step { display: flex; flex-direction: column; }
  .m8c-05-assessment #assessment-active.is-results .assessment-step__model { display: block; order: 1; }
  .m8c-05-assessment #assessment-active.is-results #assessment-flow { order: 2; }
  .m8c-05-assessment #assessment-active.is-results .strata--reading.is-staged { transform: none; } /* B1 mobile: position only */
}
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment #assessment-active.is-results .assessment-progress-rail,
  .m8c-05-assessment #assessment-active.is-results .signal-ticker-slot,
  .m8c-05-assessment #assessment-active.is-results #assessment-flow > :not(.results-header),
  .m8c-05-assessment #assessment-active.is-results .results-header > *,
  .m8c-05-assessment #assessment-active.is-results .strata--reading { transition: none; }
  .m8c-05-assessment .verdict-bar-fill { transition: none; }
}

/* ── M4 B1 — THE READ: chapters ────────────────────────────────────────────────
   Opacity-only hiding (content stays selector-reachable); Ch.1 arrives PLAIN —
   no rise, weight from stillness (disclosure register). */
.m8c-05-assessment .reveal-chapter {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out);
}
.m8c-05-assessment .reveal-chapter--plain { transform: none; transition: opacity var(--dur-slow) var(--ease-out); }
.m8c-05-assessment .reveal-chapter.visible { opacity: 1; transform: none; }

/* B1 Ch.2 — the domain chip (og-badge anatomy): mono chip beside the archetype
   name; the FRAME chip alone carries the soft lime glow (status-light idiom). */
.m8c-05-assessment .taste-domain-chip {
  display: inline-block;
  font-family: "JetBrains Mono", monospace;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-2);
  border: 1px solid var(--hairline-strong);
  padding: 2px 8px;
}
.m8c-05-assessment .taste-domain-chip[data-domain="frame"] {
  color: var(--lime);
  border-color: var(--lime);
  box-shadow: var(--glow-lime-soft);
}
/* B1 Ch.2 — the derivation strip reads in the og-badge grammar: code + name mono,
   value in lime (the fills are already lime via .taste-dim-bar). */
.m8c-05-assessment .taste-dim-label { font-family: "JetBrains Mono", monospace; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; color: var(--text-2); text-transform: uppercase; } /* X2/X3 — band-label register (matches the /r/ card dim-label 700) */
.m8c-05-assessment .taste-dim-label b { color: var(--text); font-weight: 700; margin-right: 2px; }
.m8c-05-assessment .taste-dim-value { color: var(--text); } /* converge to the /r/ band-value grammar (text, not lime); lime lives in the bar-fill only — keeps lime scarce */

/* ── M4 B2 — the designed-dark slots (Ch.4) ──────────────────────────────────── */
.m8c-05-assessment .context-slots { display: grid; gap: var(--space-md); margin-top: var(--space-md); max-width: var(--measure, 62ch); }
.m8c-05-assessment .context-slot {
  background: var(--surface-1);
  border: 1px solid var(--hairline);
  padding: var(--space-md);
}
.m8c-05-assessment .context-slot__heading,
.m8c-05-assessment .context-slot__eyebrow {
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-2);
  font-weight: 700; /* X2 — slot headings at the proven mono-label 700 */
  margin: 0 0 var(--space-sm);
}
.m8c-05-assessment .context-slot__track { height: 4px; background: var(--hairline); margin: 0 0 var(--space-sm); } /* unlit — no percentile math ships in M4 */
.m8c-05-assessment .context-slot__gate {
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem); /* X5 — fold the 0.625rem sub-size onto mono-label */
  font-weight: 700;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-2); /* X2 — the cohort-count proof-of-life off the dimmest token */
  margin: 0;
}
.m8c-05-assessment .context-slot__dots { display: flex; gap: var(--space-2xs); margin: 0 0 var(--space-sm); }
.m8c-05-assessment .context-slot__dot { width: 14px; height: 14px; border-radius: 50%; border: 1px solid var(--hairline-strong); background: transparent; } /* ghost members */
.m8c-05-assessment .context-slot__copy { color: var(--text-2); font-size: 0.875rem; font-weight: 500; line-height: var(--lh-body, 1.6); margin: 0; } /* X2 — slot prose off the dim register */

/* ── M4 C1 — the stage rail (event-driven wait) ──────────────────────────────── */
.m8c-05-assessment .stage-rail { display: grid; gap: var(--space-2xs); margin: 0 0 var(--space-md); }
.m8c-05-assessment .stage-rail__step {
  display: flex;
  align-items: baseline;
  gap: var(--space-2xs);
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-2);
  font-weight: 500; /* X2/X4 — the named stages prove real work; off the dimmest token + weight floor */
}
.m8c-05-assessment .stage-rail__dot { width: 8px; height: 8px; border-radius: 50%; border: 1px solid var(--hairline-strong); background: transparent; flex: 0 0 auto; align-self: center; }
.m8c-05-assessment .stage-rail__step[data-state="active"] { color: var(--text); font-weight: 700; } /* X1/X4 — the running stage is the focal point of the wait */
.m8c-05-assessment .stage-rail__step[data-state="active"] .stage-rail__dot { background: var(--lime); border-color: var(--lime); box-shadow: var(--glow-lime-soft); }
.m8c-05-assessment .stage-rail__step[data-state="done"] { color: var(--text-2); }
.m8c-05-assessment .stage-rail__step[data-state="done"] .stage-rail__dot { background: var(--text-3); border-color: var(--text-3); }
.m8c-05-assessment .stage-rail__detail { color: var(--text); font-weight: 700; text-transform: none; letter-spacing: 0.02em; } /* X4 — the company anchor (the proof-of-effort value-lead) reads as the loudest line */
.m8c-05-assessment .stage-rail.is-dissolving { opacity: 0; transition: opacity var(--dur-base) var(--ease-out); }

/* ── F10 — the editorial milestone wait: the REAL research signals ─────────────────
   Each milestone is a genuine web_search query the server issued; they ACCUMULATE as a calm,
   capped sequence (most-recent-N + a "+N earlier" fold) so the reader watches considered
   research — the felt proof of work, restraint over a console feed. Tier-3 emits none, so the
   list stays empty (honest — no invented milestones). Reduced-motion keeps the INFORMATION
   (the milestones) and drops only the staged entrance. */
.m8c-05-assessment .stage-rail__step[data-step="reading"] { flex-wrap: wrap; }
.m8c-05-assessment .stage-rail__signals {
  flex: 1 0 100%;                              /* drop to its own line under the dot+label+detail row */
  list-style: none;
  margin: var(--space-2xs) 0 0;
  padding-left: calc(8px + var(--space-2xs)); /* indent under the status dot */
  display: grid;
  gap: 2px;
}
.m8c-05-assessment .stage-rail__signal {
  color: var(--text-2);
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  font-weight: 500;                            /* X2 — the searches sit at the weight floor; the company anchor stays the loud line */
  letter-spacing: 0.02em;
  text-transform: none;
  animation: forge-signal-in var(--dur-base) var(--ease-out) both;
}
.m8c-05-assessment .stage-rail__signal--more { color: var(--text-3); font-weight: 500; }    /* the fold reads quietest — quieted by color, held at the X2 weight floor */
.m8c-05-assessment .stage-rail__signal--synth { color: var(--text); font-weight: 700; }     /* the synthesis beat is the live, in-progress line */
@keyframes forge-signal-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment .stage-rail__signal { animation: none; opacity: 1; transform: none; }
}

/* ── F11 — the Discernment Canon (the ambient backdrop above the steps) ────────────
   A DIFFERENT register from the mono "searched:" signals: editorial Inter prose, clearly
   reflection — never a process step, never a fake search (the honesty gate is visible). One
   card at a time, calm, generous space. RECEDES (smaller + dimmer) when real signals arrive
   (real > filler). Inside #stage-rail, so it shares the rail's is-dissolving/hidden dissolve
   for free. Collapses to nothing before the first card and after a clear. */
.m8c-05-assessment .stage-rail__canon {
  max-width: var(--measure, 62ch);
  margin: 0 0 var(--space-md);
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--hairline);   /* a quiet line: reflection above, process below */
  transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out);
}
.m8c-05-assessment .stage-rail__canon:empty { margin: 0; padding: 0; border: 0; }  /* collapsed before the first card / after dissolve */
.m8c-05-assessment .stage-rail__canon.is-swapping { opacity: 0; }                  /* the quiet cross-fade */
.m8c-05-assessment .stage-rail__canon-eyebrow {
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-3);                        /* the source label reads quiet — the body carries the weight */
  font-weight: 500;
  margin: 0 0 var(--space-2xs);
}
.m8c-05-assessment .stage-rail__canon-body {
  font-family: "Inter", system-ui, sans-serif; /* the reflection register — NOT mono, never a signal */
  color: var(--text-2);
  font-size: 1.0625rem;
  line-height: var(--lh-body, 1.6);
  font-weight: 500;
  margin: 0;
}
/* the receded state — F12.4 frog-vision: real research arrived, so the canon settles back to
   GROUND (dimmer + smaller + a gentle settle) so the arriving real signal is the FIGURE that pops
   against the canon's stillness. The transition (above) eases it back; reduced-motion zeroes it. */
.m8c-05-assessment .stage-rail__canon.is-receded { opacity: 0.42; transform: translateY(-3px) scale(0.97); transform-origin: left top; }
.m8c-05-assessment .stage-rail__canon.is-receded .stage-rail__canon-body { font-size: 0.9375rem; color: var(--text-3); font-weight: 500; }
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment .stage-rail__canon { transition: none; }
  .m8c-05-assessment .stage-rail__canon.is-swapping { opacity: 1; }  /* no fade — the card swaps in place, info intact */
}

/* ── F13 — the wait-legibility layers (the stage-rail Dynamic Checklist) ───────────
   L1 the expectation line · L2 the active-step pulse · L3 the sub-beat rotation. All three make
   the frozen 'reading' window legible + alive WITHOUT faking a percentage. */

/* L1 — the expectation line: a quiet, honest frame for the wait. Hidden until the wait is underway
   (data-stage set); shares the rail dissolve. Honest uncertainty ("usually"), not a countdown. */
.m8c-05-assessment .stage-rail__expectation {
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-3);
  font-weight: 500;
  margin: 0 0 var(--space-md);
}
.m8c-05-assessment #stage-rail[data-stage=""] .stage-rail__expectation { display: none; } /* hidden pre-wait */

/* L2 — the active-step pulse: an alive, indeterminate "this is working" signal on the running
   step's lime indicator (no percentage). A calm opacity breathe — restraint, not a loud ping.
   Reduced-motion zeroes it (the step stays clearly active by color/state). */
@keyframes stage-dot-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
.m8c-05-assessment .stage-rail__step[data-state="active"] .stage-rail__dot { animation: stage-dot-pulse 1.6s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment .stage-rail__step[data-state="active"] .stage-rail__dot { animation: none; }
}

/* L3 — the dynamic-checklist sub-beat: the reading step's real sub-work, rotating on a calm cadence
   so the frozen window always shows forward motion. A SEPARATE line from the company anchor
   (.stage-rail__detail stays c1-safe). Cross-fade between beats; reduced-motion zeroes the fade. */
.m8c-05-assessment .stage-rail__substep {
  flex: 1 0 100%;                              /* its own line under the dot+label+detail row */
  color: var(--text-2);
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  letter-spacing: 0.02em;
  text-transform: none;
  font-weight: 500;
  margin: var(--space-2xs) 0 0;
  padding-left: calc(8px + var(--space-2xs)); /* indent under the status dot, aligned with the signals */
  transition: opacity var(--dur-fast) var(--ease-out);
}
.m8c-05-assessment .stage-rail__substep:empty { display: none; }   /* before the first sub-beat */
.m8c-05-assessment .stage-rail__substep.is-fading { opacity: 0; }  /* the quiet cross-fade */
@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment .stage-rail__substep { transition: none; }
}

/* ── M4 C4 — the retry affordance (register, like the retake) ────────────────── */
.m8c-05-assessment .brief-retry {
  display: inline-block;
  margin-top: var(--space-sm);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--hairline);
  border-radius: 0;
  padding: 0 0 2px;
  cursor: pointer;
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-3);
  transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.m8c-05-assessment .brief-retry:hover { color: var(--text); border-bottom-color: var(--hairline-strong); }

/* ── M4 R2 — Ch.6 THE CLOSE: a THREE-BEAT SEQUENCE (peak-end) ─────────────────
   The container just becomes present (is-entered, kept for the suite's close gate);
   the MOTION lives in the three .close-beat children, each fading in on the prior's
   settle (~600ms apart, JS-sequenced). Single-purpose beats: seal → artifact →
   horizon. Quiet end after horizon. */
.m8c-05-assessment .reveal-close {
  max-width: var(--measure, 62ch);
  padding: var(--space-xl) 0 var(--space-lg);
}
.m8c-05-assessment .close-beat {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out);
}
.m8c-05-assessment .close-beat.is-entered { opacity: 1; transform: none; }
.m8c-05-assessment .close-rule { border: 0; border-top: 1px solid var(--hairline); margin: 0 0 var(--space-md); }
/* Gap B — the on-screen keepsake card container; the card itself is self-styled cream.
   Gap B v2 — MOVE 4 (edge): top breathing room so the cream card reads as a distinct framed
   artifact lifted off the dark page (a clean share-crop). MOVE 2 (arrival): a restrained,
   inevitable-feeling settle that RIDES the artifact beat's existing .is-entered toggle — the
   beat owns the opacity fade, the keepsake adds only the transform settle (no double-fade),
   so the three-beat sequence + durations are untouched. Valence rides --keepsake-* vars ONLY,
   so the single `transition` lives on the base and reduced-motion can zero it once. */
.m8c-05-assessment .close-keepsake {
  margin: var(--space-lg) auto var(--space-md);
  max-width: 720px;
  --keepsake-rise: 12px;
  --keepsake-dur: var(--dur-slow);
  transform: translateY(var(--keepsake-rise)) scale(0.99);
  transition: transform var(--keepsake-dur) var(--ease-out);
}
/* Valence-aware (MOVE 2): read the EXISTING register surfaced by enterCloseWhenReady. Sober =
   quieter + slower (less travel, the beat-weight 820ms — gravity arrives in stillness); celebrate
   = a touch more life via travel, never a bounce (HARD BAN: no celebration-theater). */
.m8c-05-assessment [data-close-register="sober"] .close-keepsake { --keepsake-rise: 7px; --keepsake-dur: var(--dur-reveal); }
.m8c-05-assessment [data-close-register="celebrate"] .close-keepsake { --keepsake-rise: 16px; }
.m8c-05-assessment .close-beat.is-entered .close-keepsake { transform: none; }
.m8c-05-assessment .close-eyebrow {
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  font-weight: 700; /* X2/X1 — the seal is the peak-end opening MOMENT, hero-eyebrow register (lime/700) */
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--lime);
  margin: 0 0 var(--space-sm);
}
.m8c-05-assessment .reveal-close .brief-enrichment-confirm { opacity: 1; margin: 0 0 var(--space-md); font-size: var(--fs-body); font-weight: 500; } /* rides the close's single entrance; X2 — body voice at body size/weight */
.m8c-05-assessment .close-share { margin: 0 0 var(--space-md); }
.m8c-05-assessment .close-badge { display: block; width: 100%; max-width: 360px; border: 1px solid var(--hairline); margin: 0 0 var(--space-sm); }
.m8c-05-assessment .close-share-actions { display: flex; gap: var(--space-md); margin: 0 0 var(--space-2xs); }
.m8c-05-assessment .close-share-btn {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--hairline);
  border-radius: 0;
  padding: 0 0 2px;
  cursor: pointer;
  font: inherit;
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text);
  font-weight: 700; /* Gap A — the share ACTIONS (M5 link_shared) read as CTAs above the muted meta */
  border-bottom-color: var(--hairline-strong);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.m8c-05-assessment .close-share-btn:hover { color: var(--text); border-bottom-color: var(--hairline-strong); }
.m8c-05-assessment .close-share-microcopy {
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem); /* X5 — collapse the lone 0.625rem sub-size onto mono-label */
  font-weight: 500;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-2);
  margin: 0;
}
.m8c-05-assessment .close-dated {
  font-family: "JetBrains Mono", monospace;
  font-size: var(--fs-mono-label, 0.75rem);
  font-weight: 700; /* X1/X2 — the horizon closing MOMENT lands at primary, not the dimmest token */
  letter-spacing: 0.04em;
  color: var(--text);
  margin: 0 0 var(--space-sm);
}
.m8c-05-assessment .reveal-close .retake-wrapper { margin: 0; }

@media (prefers-reduced-motion: reduce) {
  .m8c-05-assessment .reveal-chapter,
  .m8c-05-assessment .close-beat,
  .m8c-05-assessment .close-keepsake,
  .m8c-05-assessment .stage-rail.is-dissolving { transition: none; }
}

/* A3 — verdict badge states on dark (foundation tokens only). The severity gradient
   lives in the BAR density (cream doctrine, D-S55-VERDICT-MAPPING — style.css:2089-2100
   kept all five tiers uniform ink and let #verdict-bar carry the signal); the dark badge
   register differentiates by VALUE: the two healthy tiers earn the lime registers, the
   middle/low tiers hold full text presence (a hard verdict deserves full presence, not
   dimming), Explorer recedes (the honest not-yet). */
.m8c-05-assessment .verdict-badge.verdict-strong { color: var(--lime); }
.m8c-05-assessment .verdict-badge.verdict-significant { color: var(--lime-banked); }
.m8c-05-assessment .verdict-badge.verdict-material,
.m8c-05-assessment .verdict-badge.verdict-minor,
.m8c-05-assessment .verdict-badge.verdict-critical { color: var(--text); }
.m8c-05-assessment .verdict-badge.verdict-explorer { color: var(--text-2); }

/* A3 — honest-insufficiency treatment for an all-N/A layer row (the class was a styling
   no-op on the live page; the 'Insufficient data' label carried it alone). */
.m8c-05-assessment .layer-row-insufficient .layer-name { color: var(--text-3); }
.m8c-05-assessment .layer-row-insufficient .layer-bar { opacity: 0.55; }