@view-transition {
  navigation: auto;
}

html[data-assessment-flow] {
  scroll-behavior: auto;
}

#page-content {
  view-transition-name: assessment-content;
}

::view-transition-group(assessment-content) {
  animation-duration: 180ms;
  animation-timing-function: ease-out;
}

/* AI•DOOM assessment-specific presentation. Shared tokens come from the
   configured color theme and editorial-ledger component set. */
  .lever-preview {
    display: flex; flex-wrap: wrap; justify-content: center;
    gap: 0.4em 0.6em; margin: 0 0 var(--space-3);
  }
  .lever-preview span {
    font: 600 0.74rem/1 var(--font-body);
    letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--accent-text); border: 1px solid var(--line);
    background: var(--paper);
    padding: 0.45em 0.7em; border-radius: 0;
  }
  .returning {
    margin-top: var(--space-3); padding: var(--space-2) var(--space-3);
    background: var(--accent-tint); border-left: 3px solid var(--accent);
    border-radius: 0;
  }
  .returning p { margin: 0 0 var(--space-1); font-size: 0.95rem; }
  .returning .cta-secondary { margin-right: 1.2em; }
  .quiz {
    max-width: 600px; margin: 0 auto;
    background: var(--card);
    border: 1px solid var(--line);
    border-top: 3px solid var(--accent);
    border-radius: 0;
    padding: var(--space-4) var(--space-3);
    box-shadow: var(--shadow-card);
  }
  .quiz-progress { margin-bottom: var(--space-3); }
  .quiz-progress-meta {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-bottom: var(--space-1); font: 600 0.82rem/1 var(--font-body);
    color: var(--muted);
  }
  .quiz-lever-tag {
    color: var(--accent); letter-spacing: 0.1em; text-transform: uppercase; font-size: 0.74rem;
  }
  .quiz-bar { height: 3px; background: var(--line); overflow: hidden; }
  .quiz-bar-fill { height: 100%; width: 6.25%; background: var(--assessment-progress); transition: width 0.25s ease; }
  .quiz-question {
    font-size: clamp(1.3rem, 4vw, 1.6rem); margin: var(--space-3) 0 var(--space-2);
    line-height: 1.3; color: var(--ink);
  }
  .quiz fieldset {
    border: 0; margin: 0; padding: 0; min-inline-size: 0;
  }
  .quiz-options {
    display: grid; gap: 0.2em; margin: var(--space-1) 0 var(--space-3);
  }
  .quiz-opt {
    display: flex; align-items: flex-start; justify-content: flex-start;
    min-height: 48px; min-width: 44px;
    font: 500 0.97rem/1.4 var(--font-body);
    color: var(--ink); background: transparent;
    border: 0; border-radius: 0;
    cursor: pointer; padding: 0.7em 0.2em;
    text-align: left;
    transition: background 0.15s ease, color 0.15s ease, transform 0.05s ease;
  }
  .quiz-opt:hover { color: var(--accent-dk); background: var(--accent-tint); }
  .quiz-opt:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; }
  .quiz-opt.selected { color: var(--accent-dk); background: var(--accent-tint); }
  .quiz-opt:active { transform: translateY(1px); }
  .answer-context-toggle {
    display: block; min-height: 44px;
    margin: var(--space-2) 0 0;
    padding-top: var(--space-2);
    border-top: 1px solid var(--line);
  }
  .answer-context-toggle label {
    display: inline-flex; align-items: center; gap: 0.55em;
    min-height: 44px; color: var(--accent-dk); cursor: pointer;
    font: 600 0.9rem/1.3 var(--font-body);
  }
  .answer-context-toggle input {
    width: 1.1rem; height: 1.1rem; margin: 0;
    accent-color: var(--accent);
  }
  .answer-context-toggle input:focus-visible {
    outline: 2px solid var(--ring); outline-offset: 2px;
  }
  .answer-context-field {
    margin-top: var(--space-1); padding: var(--space-2);
    background: var(--accent-tint); border-left: 3px solid var(--accent);
  }
  .answer-context-field > label {
    display: block; margin-bottom: 0.45em;
    color: var(--ink); font: 600 0.82rem/1.3 var(--font-body);
  }
  .answer-context-field textarea {
    display: block; width: 100%; min-height: 5.5rem; resize: vertical;
    padding: 0.7em 0.8em; border: 1px solid var(--line); border-radius: 0;
    background: var(--paper); color: var(--ink); font: 0.95rem/1.45 var(--font-body);
  }
  .answer-context-field textarea:focus-visible {
    outline: 3px solid var(--ring); outline-offset: 1px; border-color: var(--accent-dk);
  }
  .answer-context-field .micro { margin: 0.45em 0 0; color: var(--muted); }
  .answer-continue { margin-top: var(--space-2); }
  .answer-continue .cta { margin: 0; min-width: 8rem; }
  .answer-continue .cta:disabled { cursor: not-allowed; opacity: 0.5; }
  .quiz-nav {
    display: flex; align-items: center;
    margin-top: var(--space-3); padding-top: var(--space-2);
    border-top: 1px solid var(--line);
  }
  .quiz-nav:empty { display: none; }
  .quiz-nav[hidden] { display: none !important; }
  .quiz-nav form { margin: 0; }
  .quiz-nav .cta-secondary {
    appearance: none;
    display: inline-flex; align-items: center;
    min-height: 44px; margin: 0; padding: 0.55em 0;
    color: var(--muted); background: transparent; border: 0; cursor: pointer;
    font: 600 0.9rem/1.2 var(--font-body);
    transition: color 0.15s ease, background 0.15s ease;
  }
  .quiz-nav .cta-secondary::before {
    content: "\2190"; margin-right: 0.45em; color: var(--accent);
  }
  .quiz-nav .cta-secondary:hover {
    color: var(--accent-dk); background: transparent; border: 0;
  }
  .result-score { text-align: center; margin: var(--space-2) 0 var(--space-4); }
  .result-score-num {
    font: 700 clamp(3rem, 12vw, 4.4rem)/1 var(--font-display);
    color: var(--accent-dk); letter-spacing: -0.02em;
  }
  .result-score-unit {
    font: 600 1.3rem/1 var(--font-display); color: var(--muted);
    margin-left: 0.1em;
  }
  .result-score-label {
    margin: var(--space-1) 0 0; color: var(--muted);
    font: 600 0.76rem/1.4 var(--font-body);
    letter-spacing: 0.14em; text-transform: uppercase;
  }
  .result-highlight {
    margin: var(--space-3) 0; padding: var(--space-4) var(--space-3);
    background: var(--card); border: 1px solid var(--line);
    border-top: 3px solid var(--accent); border-radius: 0;
    box-shadow: var(--shadow-card);
  }
  .result-highlight h3 { font-size: 1.4rem; margin: 0 0 var(--space-1); color: var(--accent-dk); }
  .result-purpose, .result-caveat { max-width: 58ch; color: var(--muted); }
  .result-caveat { margin: var(--space-3) auto; font-size: 0.9rem; font-style: italic; text-align: center; }
  .result-actions { margin: var(--space-3) 0; padding: var(--space-3); background: var(--accent-tint); border: 1px solid var(--line); border-radius: 0; }
  .result-actions h3 { margin: 0 0 var(--space-1); }
  .result-actions p { color: var(--muted); }
  .result-actions [data-assessment-action] { margin: 0.25em; }
  .quiz-transition { margin: var(--space-3) 0 0; color: var(--muted); font-size: 0.94rem; }
  .quiz-opt input { flex: 0 0 auto; margin-right: 0.55em; accent-color: var(--accent); }
  .result-start { margin: var(--space-2) 0 0; font-size: 0.98rem; }
  .result-start .list-head { display: block; margin-bottom: 0.4em; }
  .result-cta {
    text-align: center; margin: var(--space-4) 0; padding: var(--space-4) var(--space-3);
    background: var(--accent-tint-2); border: 1px solid var(--line);
    border-radius: 0;
  }
  .result-cta .cta { margin: 0 0 var(--space-1); }
  .result-cta .micro { max-width: 44ch; margin: var(--space-1) auto var(--space-2); }
  .result-secondary {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5em 1.4em;
    margin-top: var(--space-2);
  }
  .email-gate {
    margin: var(--space-4) 0; padding: var(--space-4) var(--space-3);
    background: var(--card); border: 1px solid var(--line);
    border-top: 3px solid var(--accent); border-radius: 0;
    box-shadow: var(--shadow-card);
  }
  .email-gate h3 { margin: 0 0 var(--space-1); font-size: 1.15rem; }
  .email-gate > p { font-size: 0.96rem; color: var(--muted); }
  .email-form {
    display: flex; flex-wrap: wrap; gap: 0.6em; align-items: flex-end; margin-top: var(--space-2);
  }
  .email-field { flex: 1 1 220px; display: flex; flex-direction: column; }
  .email-label {
    font: 600 0.72rem/1 var(--font-body); letter-spacing: 0.1em; text-transform: uppercase;
    color: var(--muted); margin-bottom: 0.4em;
  }
  .email-field input {
    min-height: 48px; font: 1rem/1.3 var(--font-body);
    padding: 0.7em 0.8em; border: 1px solid var(--accent); border-radius: 0;
    background: var(--paper); color: var(--ink);
  }
  .email-field input:focus-visible { outline: 3px solid var(--ring); outline-offset: 1px; border-color: var(--accent-dk); }
  .email-form .cta { margin: 0; }
  .email-note { font-size: 0.86rem; color: var(--accent-dk); margin: 0.4em 0 0; }
  .email-note.error { color: var(--accent); }
  @media (prefers-reduced-motion: reduce) {
    .quiz-bar-fill { transition: none; }
    .quiz-opt { transition: none; }
  }

  /* ---- Multi-assessment additions ---- */
  .meta-chip {
    display: inline-flex; align-items: baseline; gap: 0.4em;
    padding: 0.3em 0.8em; margin: 0 0.15em;
    border: 1px solid var(--line); border-radius: 0;
    font: 600 0.86rem/1 var(--font-body); color: var(--ink);
  }
  .meta-chip b { font-family: var(--font-display); }
  .meta-row { margin: var(--space-2) 0 0; }
  .dim-preview {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 0.4em 0.6em;
    margin: 0 0 var(--space-2);
  }
  .dim-preview span {
    font: 600 0.74rem/1 var(--font-body); letter-spacing: 0.08em;
    text-transform: uppercase; color: var(--accent-text);
    border: 1px solid var(--line); background: var(--paper);
    padding: 0.45em 0.7em; border-radius: 0;
  }
  .dim-preview--ai span { color: var(--accent-dk); border-color: var(--accent-dk); }
  .chart-wrap {
    margin: var(--space-4) auto;
    max-width: 700px; text-align: center;
  }
  .chart-wrap canvas {
    display: block; width: min(100%, 520px) !important;
    height: min(420px, 80vw) !important; margin: 0 auto;
  }
  .chart-wrap h3,
  .chart-wrap h4 { font-size: 1.08rem; margin: 0 0 var(--space-1); }
  .sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
  }
  .chart-wrap .chart-note { font-size: 0.84rem; color: var(--muted); margin-bottom: var(--space-2); }
  .result-section-head { margin-bottom: var(--space-2); }
  .result-section-head h3 { margin: 0 0 var(--space-1); font-size: 1.4rem; }
  .result-section-head > p:last-child { max-width: 60ch; margin: 0; color: var(--muted); }
  .result-benchmark,
  .result-patterns,
  .result-dimensions {
    margin: var(--space-5) 0;
    padding-top: var(--space-3);
    border-top: 1px solid var(--line);
  }
  .result-dimensions {
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--line);
  }
  .benchmark-stats {
    display: grid; grid-template-columns: 1fr; gap: 0.7em;
  }
  .benchmark-stat {
    padding: var(--space-2);
    border-left: 2px solid var(--line);
    text-align: left;
  }
  .benchmark-stat > span {
    display: block; color: var(--muted);
    font-size: 0.76rem; letter-spacing: 0.08em; text-transform: uppercase;
  }
  .benchmark-stat strong {
    display: block; margin: 0.35em 0 0.15em;
    color: var(--muted); font: 600 1.25rem/1.1 var(--font-display);
  }
  .benchmark-stat small {
    display: block; color: var(--muted); font-size: 0.8rem; line-height: 1.35;
  }
  .result-chart-grid {
    display: grid; grid-template-columns: 1fr; gap: var(--space-3);
  }
  .result-chart-grid .chart-wrap {
    max-width: none; margin: 0;
  }
  .result-chart-grid .chart-canvas-frame {
    position: relative;
    width: min(100%, 360px);
    aspect-ratio: 1;
    margin: 0 auto;
  }
  .result-chart-grid .chart-canvas-frame canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
  }
  .result-chart-key {
    display: flex; flex-wrap: wrap; gap: 0.5em 1.4em;
    margin: var(--space-2) 0 0; color: var(--muted); font-size: 0.8rem;
  }
  .result-key {
    display: inline-flex; align-items: center; gap: 0.45em;
  }
  .result-key::before {
    content: ""; display: inline-block; width: 1.5em; height: 0.2em;
    background: var(--accent);
  }
  .result-key-benchmark { color: var(--muted); }
  .result-key-benchmark::before {
    height: 0; background: none; border-top: 1px dashed var(--muted);
  }
  .dim-grid {
    display: grid; grid-template-columns: 1fr; gap: 0.7em;
    margin: var(--space-3) 0 0;
  }
  @media (min-width: 720px) {
    .benchmark-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .result-chart-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dim-grid { grid-template-columns: 1fr 1fr; }
  }
  .dim-card {
    padding: var(--space-2);
    background: var(--card); border: 1px solid var(--line);
    border-top: 2px solid var(--accent); text-align: left;
  }
  .dim-card.is-ai { border-top-color: var(--accent-2); }
  /* These headings receive programmatic focus; radios carry the visible control ring. */
  .quiz-question:focus,
  .assessment-complete h2:focus {
    outline: none;
  }
.quiz-question,
.assessment-complete h2 {
  scroll-margin-top: var(--chrome-offset);
}

/* ---- Focused assessment shell and result treatment --------------------- */
.assessment-shell-bar {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-height: var(--site-nav-height);
  max-width: 832px;
  margin: 0 auto;
  padding: 0 var(--gutter);
  border-bottom: 1px solid var(--line);
}
body[data-assessment-start] .assessment-shell-bar {
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--paper);
}
.assessment-shell-brand {
  color: var(--ink);
  text-decoration: none;
}
.assessment-shell-bar .assessment-shell-meta {
  margin-left: auto;
  color: var(--muted);
  font: 600 0.72rem/1 var(--font-body);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.assessment-shell-exit {
  color: var(--muted);
  font: 600 0.72rem/1 var(--font-body);
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
}
body[data-assessment-start] #assessment-component {
  max-width: 780px;
  margin: 0 auto;
  padding: var(--space-4) var(--gutter) var(--space-6);
}
body[data-assessment-start] #assessment-component > .wrap {
  max-width: none;
  margin: 0;
}
.assessment-start-card {
  padding: var(--space-3);
  border-top-width: 2px;
  box-shadow: none;
}
body[data-assessment-start] #assessment-component[data-assessment-mode="booting"] {
  min-height: calc(100svh - var(--site-nav-height));
}
.assessment-readiness {
  margin: var(--space-2) 0 0;
  color: var(--muted);
}
.assessment-init-error {
  margin-top: var(--space-2);
  color: var(--ink);
  font-weight: 600;
}
.assessment-start-card .cta {
  display: block;
  width: 100%;
  margin: var(--space-2) 0;
  text-align: center;
}
.assessment-reassurance {
  margin-bottom: 0;
}
.assessment-disclosure {
  margin-top: var(--space-2);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.assessment-disclosure summary {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-2); min-height: 44px;
  color: var(--ink); cursor: pointer; font-size: 0.86rem;
  font-weight: 600; list-style: none;
}
.assessment-disclosure summary::-webkit-details-marker { display: none; }
.assessment-disclosure summary::after {
  content: "+"; color: var(--accent); font-size: 1.2rem; font-weight: 400;
}
.assessment-disclosure[open] summary::after { content: "\2212"; }
.assessment-disclosure summary:focus-visible {
  outline: 2px solid var(--ring); outline-offset: -2px;
}
.assessment-disclosure p {
  margin: 0 0 var(--space-2); color: var(--muted);
  font-size: 0.84rem; line-height: 1.5;
}
.quiz-progress-meta {
  gap: var(--space-2);
  min-width: 0;
}
.quiz-lever-tag {
  min-width: 0;
  text-align: right;
}
.quiz-opt input:focus-visible {
  outline: 2px solid var(--ring);
  outline-offset: 2px;
}
.quiz-opt:has(input:focus-visible) {
  outline: 3px solid var(--ring);
  outline-offset: 2px;
}
.dim-card-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--space-2);
}
.dim-card-name {
  margin: 0.35em 0 0.45em; color: var(--ink);
  font: 700 1.1rem/1.2 var(--font-display);
}
.dim-card-val {
  color: var(--ink); font: 700 1.35rem/1 var(--font-display);
}
.dim-card-cat {
  color: var(--muted); font-size: 0.7rem;
  letter-spacing: 0.08em; text-transform: uppercase;
}
.dim-card-meter {
  height: 6px; margin: 0 0 var(--space-1);
  background: var(--line); overflow: hidden;
}
.dim-card-meter-fill {
  display: block; height: 100%; background: var(--accent);
}
.dim-card.is-ai .dim-card-meter-fill { background: var(--accent-2); }
.dim-card-interpretation {
  margin: 0; color: var(--ink); font-size: 0.86rem; font-weight: 600;
}
.dim-card-benchmark {
  margin: 0.35em 0 0; color: var(--muted); font-size: 0.78rem;
}
.dim-card-more {
  margin-top: var(--space-2); border-top: 1px solid var(--line);
}
.dim-card-more summary {
  display: flex; align-items: center; justify-content: space-between;
  min-height: 44px; color: var(--muted); cursor: pointer;
  font-size: 0.82rem; font-weight: 600; list-style: none;
}
.dim-card-more summary::-webkit-details-marker { display: none; }
.dim-card-more summary::after { content: "+"; color: var(--accent); font-size: 1.1rem; font-weight: 400; }
.dim-card-more[open] summary::after { content: "\2212"; }
.dim-card-more summary:focus-visible {
  outline: 2px solid var(--ring); outline-offset: -2px;
}
.dim-card-more-body p { margin: 0 0 var(--space-1); font-size: 0.86rem; }
.dim-card-more-body p:last-child { margin-bottom: var(--space-2); color: var(--muted); }
.email-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.6em;
  align-items: end;
}
.email-field {
  min-width: 0;
}
.email-form > label {
  display: inline-flex;
  align-items: center;
  gap: 0.45em;
  grid-column: 1 / -1;
  min-height: 44px;
}
.email-form > label input:focus-visible {
  outline: 2px solid var(--ring);
  outline-offset: 2px;
}
.email-form .email-privacy,
.email-form .cta,
.email-form .email-note {
  grid-column: 1 / -1;
}
.email-form .email-privacy {
  flex: none;
  margin: 0;
}
.email-form .cta {
  justify-self: start;
}
.assessment-reset {
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px solid var(--line);
  text-align: center;
}
.assessment-reset > p:first-child {
  margin: 0 0 var(--space-1);
  color: var(--muted);
}
.assessment-reset .email-note {
  min-height: 1.4em;
  margin-bottom: 0;
}
.assessment-reset button:disabled {
  cursor: wait;
  opacity: 0.65;
}

@media (max-width: 600px) {
  body[data-assessment-start] .assessment-shell-meta {
    display: none;
  }
  body[data-assessment-start] .assessment-shell-exit {
    margin-left: auto;
  }
  body[data-assessment-start] #assessment-component {
    padding: var(--space-3) var(--gutter) var(--space-5);
  }
  header#view-intro .hero-inner {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
  }
  header#view-intro .hero-cta-card {
    order: -1;
    margin-top: 0;
  }
  header#view-intro .hero-text {
    order: 2;
  }
  .assessment-start-card {
    padding: var(--space-3) var(--space-2);
  }
  #view-intro .assessment-start-card {
    display: flex;
    flex-direction: column;
  }
  #view-intro .assessment-start-card .cta {
    order: -1;
    margin-top: 0;
  }
  .quiz-progress-meta {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.25rem;
  }
  .quiz-lever-tag {
    text-align: left;
  }
  .chart-wrap canvas {
    width: min(100%, 320px) !important;
    height: auto !important;
    aspect-ratio: 1;
  }
  .result-chart-grid .chart-canvas-frame {
    width: min(100%, 320px);
  }
  .email-form {
    grid-template-columns: 1fr;
  }
  .email-form .cta {
    justify-self: stretch;
    width: 100%;
  }
}

@media (min-width: 601px) and (max-width: 859px) {
  .assessment-start-card {
    max-width: 600px;
    margin-inline: auto;
  }
}

/* Expanded profile, inventory, and two-score flow. */
.quiz-help {
  margin: calc(-1 * var(--space-1)) 0 var(--space-3);
  color: var(--muted);
  font-size: 0.92rem;
}
.profile-grid {
  display: grid;
  gap: 0.55rem;
}
.profile-grid > label,
.profile-grid fieldset > legend,
[data-inventory-other] > label {
  margin-top: var(--space-1);
  color: var(--ink);
  font: 600 0.82rem/1.3 var(--font-body);
}
.profile-grid select,
.profile-grid input:not([type="range"]):not([type="checkbox"]),
[data-inventory-other] input {
  width: 100%;
  min-height: 48px;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
  font: 1rem/1.3 var(--font-body);
}
.profile-grid select:focus-visible,
.profile-grid input:focus-visible,
[data-inventory-other] input:focus-visible {
  outline: 3px solid var(--ring);
  outline-offset: 1px;
}
.revenue-range {
  margin-top: var(--space-2) !important;
  padding-top: var(--space-2) !important;
  border-top: 1px solid var(--line) !important;
}
.revenue-range input[type="range"] {
  width: 100%;
  margin: var(--space-2) 0 var(--space-1);
  accent-color: var(--accent);
}
.revenue-range output {
  display: block;
  min-height: 1.5em;
  color: var(--accent-dk);
  font-weight: 700;
}
.privacy-choice {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  margin-top: var(--space-1);
}
.privacy-choice input,
.inventory-options input {
  width: 1.1rem;
  height: 1.1rem;
  accent-color: var(--accent);
}
.inventory-options {
  max-height: none;
}
[data-inventory-other] {
  margin: var(--space-2) 0;
  padding: var(--space-2);
  background: var(--accent-tint);
  border-left: 3px solid var(--accent);
}
.result-score-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2);
  margin: var(--space-2) 0 var(--space-3);
}
.result-score-grid .result-score {
  margin: 0;
  padding: var(--space-2);
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  background: var(--card);
}
.result-score-grid .result-score--leader {
  border-top-color: var(--accent-2);
}
.result-score-grid .list-head {
  margin-top: 0;
}
@media (min-width: 720px) {
  .result-score-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0s !important;
    animation-duration: 0s !important;
  }
  ::view-transition-group(root),
  ::view-transition-old(root),
  ::view-transition-new(root),
  ::view-transition-group(assessment-content),
  ::view-transition-old(assessment-content),
  ::view-transition-new(assessment-content) {
    animation: none !important;
  }
}
.result-score-meaning {
  margin: var(--space-1) auto 0;
  max-width: 42ch;
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.45;
}
.result-score-grid .meta-chip {
  flex-wrap: wrap;
}
.meta-chip small {
  flex-basis: 100%;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 500;
}
.dim-card-band {
  margin: var(--space-1) 0 0;
  color: var(--muted);
  font-size: 0.78rem;
}
.dim-card-band .list-head {
  display: inline;
  margin-right: 0.2em;
}
.chart-text-summary {
  margin: var(--space-2) 0 0;
  color: var(--ink);
  font-size: 0.84rem;
  line-height: 1.45;
}
.chart-canvas-frame {
  position: relative;
  width: 100%;
  min-height: 280px;
  aspect-ratio: 1.25;
}
.chart-canvas-frame canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}
.benchmark-dimensions {
  margin-top: var(--space-2);
  padding-top: var(--space-2);
  border-top: 1px solid var(--line);
}
.benchmark-dimension {
  margin: 0.45em 0 0;
  color: var(--muted);
  font-size: 0.82rem;
}
.benchmark-dimension strong {
  color: var(--ink);
}
.result-action-status {
  min-height: 1.4em;
  margin: var(--space-2) 0 0;
  color: var(--muted);
  font-size: 0.82rem;
}
.assessment-complete .result-secondary button {
  appearance: none;
  font: inherit;
  cursor: pointer;
}
.assessment-complete .result-secondary button:focus-visible {
  outline: 3px solid var(--ring);
  outline-offset: 2px;
}
.assessment-complete .result-secondary > a,
.assessment-complete .result-secondary > button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.assessment-complete [data-result-action="copy-link"],
.assessment-complete [data-result-action="print"] {
  background: transparent;
}
@media (min-width: 720px) {
  .chart-canvas-frame { min-height: 320px; }
}

/* ---- Executive result narrative ----------------------------------------- */
.result-pattern,
.result-gap,
.result-start-panel,
.result-leader-signals {
  margin: var(--space-2) 0;
  padding: var(--space-2);
  background: var(--card);
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent-2);
}
.result-pattern h3,
.result-gap h3,
.result-start-panel h3 {
  margin: 0 0 var(--space-1);
  color: var(--accent-dk);
  font-size: 1.35rem;
}
.result-pattern p:last-child,
.result-gap p:last-child,
.result-start-panel p:last-child {
  margin-bottom: 0;
}
.result-gap {
  margin: var(--space-1) 0;
  padding: var(--space-1) 0 var(--space-1) var(--space-2);
  background: transparent;
  border: 0;
  border-left: 3px solid var(--accent);
}
.result-start-panel {
  border-top: 3px solid var(--accent);
  border-left-width: 1px;
}
.result-start-panel .result-caveat {
  margin: var(--space-2) 0 0;
  max-width: none;
  text-align: left;
}
.result-score-note {
  margin: var(--space-1) 0 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.4;
}
.result-readout-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2);
  margin: var(--space-3) 0;
}
.result-readout-grid .result-highlight {
  margin: 0;
}
.result-readout-grid .result-highlight {
  padding: var(--space-2);
}
.result-readout-grid .result-highlight h3 {
  font-size: 1.15rem;
}
.result-readout-grid .result-highlight p {
  font-size: 0.86rem;
  line-height: 1.4;
}
.result-highlight--constraint {
  border-top-color: var(--accent-2);
}
.leader-signal-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-1);
  margin: 0;
  padding: 0;
  list-style: none;
}
.leader-signal {
  min-width: 0;
  padding: var(--space-2);
  border: 1px solid var(--line);
  background: var(--accent-tint);
}
.leader-signal-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-1);
}
.leader-signal-head span {
  min-width: 0;
  font-weight: 600;
}
.leader-signal-head strong {
  flex: 0 0 auto;
  color: var(--accent-dk);
  font: 700 1.1rem/1 var(--font-display);
}
.leader-signal-head small {
  color: var(--muted);
  font: 600 0.72rem/1 var(--font-body);
}
.leader-signal-meter {
  height: 0.35rem;
  margin: var(--space-1) 0 0.35rem;
  overflow: hidden;
  background: var(--line);
}
.leader-signal-meter span {
  display: block;
  height: 100%;
  background: var(--accent-2);
}
.leader-signal p {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
}
.leader-signal--empty {
  color: var(--muted);
}
.result-leader-signals > .result-signal-summary {
  margin-top: var(--space-1);
}
.result-signal-summary {
  margin: var(--space-2) 0 0;
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.45;
}
@media (min-width: 720px) {
  .result-readout-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .leader-signal-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ---- Result chart comprehension ----------------------------------------- */
.result-patterns .result-section-head .section-label {
  margin: 0 0 var(--space-1);
}
.result-chart-grid {
  align-items: stretch;
  gap: var(--space-3);
}
.result-chart-grid .chart-wrap {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: var(--space-2);
  background: var(--card);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-soft);
  text-align: left;
}
.result-chart-grid .chart-wrap figcaption {
  flex: 0 0 auto;
}
.chart-kicker {
  margin: 0 0 0.45em;
  color: var(--accent);
  font: 600 0.72rem/1 var(--font-body);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.result-chart-grid .chart-wrap h4 {
  margin-bottom: var(--space-1);
  color: var(--ink);
  font-size: 1.2rem;
  line-height: 1.2;
}
.result-chart-grid .chart-note {
  max-width: 48ch;
  margin: 0;
  line-height: 1.45;
}
.chart-axis-notes {
  display: grid;
  gap: 0.55rem;
  margin: var(--space-2) 0 0;
}
.chart-axis-notes p {
  margin: 0;
  padding-left: 0.7rem;
  border-left: 2px solid var(--accent);
  font-size: 0.8rem;
  line-height: 1.35;
}
.chart-axis-notes p + p {
  border-left-color: var(--accent-2);
}
.chart-axis-notes strong,
.chart-axis-notes span {
  display: block;
}
.chart-axis-notes strong {
  color: var(--ink);
  font-weight: 700;
}
.chart-axis-notes span {
  color: var(--muted);
}
.result-chart-grid .chart-canvas-frame {
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: var(--space-2) 0 0;
  aspect-ratio: 1.08;
}
.result-chart-grid [data-result-chart-card="radar"] .chart-canvas-frame {
  aspect-ratio: 1.04;
}
.result-chart-grid .chart-canvas-frame canvas {
  width: 100% !important;
  height: 100% !important;
}
.chart-text-summary {
  flex: 0 0 auto;
  margin-top: var(--space-2);
  padding-top: var(--space-2);
  border-top: 1px solid var(--line);
  font-size: 0.88rem;
  line-height: 1.5;
}
.chart-annotation {
  flex: 0 0 auto;
  margin: var(--space-1) 0 0;
  color: var(--accent-dk);
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.4;
}
.result-chart-key {
  flex: 0 0 auto;
  margin: var(--space-1) 0 0;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.4;
}
.chart-fallback-note {
  margin: var(--space-2) 0 0;
  padding: var(--space-1) var(--space-2);
  border-left: 3px solid var(--accent-2);
  background: var(--accent-tint);
  color: var(--ink);
  font-size: 0.84rem;
  line-height: 1.45;
}
.chart-fallback-note[hidden] {
  display: none;
}
@media (min-width: 720px) {
  .result-chart-grid .chart-canvas-frame {
    min-height: 22rem;
  }
  .result-chart-grid [data-result-chart-card="radar"] .chart-canvas-frame {
    min-height: 21rem;
  }
}
@media (max-width: 600px) {
  .result-chart-grid .chart-wrap {
    padding: var(--space-2) var(--space-1);
  }
  .result-chart-grid .chart-canvas-frame,
  .result-chart-grid [data-result-chart-card="radar"] .chart-canvas-frame {
    aspect-ratio: 1;
  }
  .result-benchmark,
  .result-patterns,
  .result-dimensions {
    margin-block: var(--space-4);
    padding-top: var(--space-2);
  }
  .result-dimensions {
    padding-bottom: var(--space-2);
  }
  .result-score-grid {
    gap: var(--space-1);
    margin-block: var(--space-2);
  }
  .result-score-grid .result-score {
    padding: var(--space-1) var(--space-2);
  }
  .result-score-grid .meta-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-1);
    margin-top: var(--space-1);
  }
  .result-score-grid .meta-chip {
    min-width: 0;
    margin: 0;
  }
  .result-readout-grid {
    margin-block: var(--space-2);
  }
  .result-start-panel {
    margin-block: var(--space-2);
    padding: var(--space-2);
  }
}

/* ---- Shareable result artifact ------------------------------------------- */
.result-artifact-head {
  margin: 0 0 var(--space-3);
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  background: var(--accent-tint);
}
.result-artifact-head h1 {
  margin: var(--space-1) 0;
  color: var(--ink);
  font: 700 clamp(1.8rem, 5vw, 2.8rem)/1.05 var(--font-display);
}
.result-artifact-date,
.result-artifact-source {
  margin: 0;
  color: var(--muted);
  font-size: 0.82rem;
}
.result-artifact-caveat {
  max-width: 62ch;
  margin: var(--space-2) 0 0;
  color: var(--ink);
  font-size: 0.92rem;
  font-weight: 600;
}
.result-artifact-source {
  display: none;
  margin: 0 0 var(--space-2);
  overflow-wrap: anywhere;
}
.result-share-actions {
  margin: var(--space-3) 0;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  background: var(--card);
}
.result-share-actions h3 {
  margin: 0 0 var(--space-1);
  color: var(--ink);
  font-size: 1.2rem;
}
.result-share-actions > p {
  max-width: 62ch;
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
}
.result-share-actions .result-secondary {
  justify-content: flex-start;
  margin-top: var(--space-2);
}
.result-action-status[data-state="success"] {
  color: var(--accent-dk);
  font-weight: 600;
}
.result-action-status[data-state="error"] {
  color: var(--accent-2);
  font-weight: 600;
}
.report-page {
  padding-bottom: var(--space-5);
}
.report-unavailable {
  max-width: 62ch;
  margin: var(--space-4) auto;
  padding: var(--space-4) var(--space-3);
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent-2);
  background: var(--card);
}
.report-unavailable h1 {
  margin: var(--space-1) 0 var(--space-2);
}
.report-unavailable-note,
.report-shared-note {
  color: var(--muted);
  font-size: 0.88rem;
}
.report-unavailable .cta {
  margin-top: var(--space-2);
}
.report-shared-note {
  margin: var(--space-2) 0 0;
}
.result-mode-shared .email-gate {
  display: none;
}

/* =========================================================================
   Editorial-ledger assessment skin

   The assessment keeps its functional DOM and transport contracts. This
   layer gives the landing, active flow, and result artifact one consistent
   archival vocabulary using only the configured semantic color roles.
   ========================================================================= */

/* ---- Assessment landing ----------------------------------------------- */
.assessment-intro {
  position: relative;
  isolation: isolate;
  overflow: visible;
  clip-path: inset(calc(0px - var(--assessment-weather-overhang)) 0 0);
  padding: var(--space-5) var(--gutter) var(--space-6);
}
.assessment-cursor-weather {
  position: absolute;
  inset: calc(0px - var(--assessment-weather-overhang)) 0 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}
.assessment-cursor-weather__canvas {
  display: block;
  width: 100%;
  height: 100%;
}
.assessment-hero {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(18rem, 4fr);
  gap: var(--space-5) var(--space-6);
  width: min(100%, var(--wide-width));
  margin-inline: auto;
}
.assessment-wordmark-lockup {
  grid-column: 1 / -1;
  min-width: 0;
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--line);
}
.assessment-wordmark {
  max-width: none;
  margin: 0;
  color: var(--ink);
  font: 600 clamp(3rem, 10vw, 8rem)/0.92 var(--font-secondary);
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.assessment-wordmark-accent {
  color: var(--accent);
}
.assessment-expansion {
  margin: var(--space-2) 0 0;
  color: var(--muted);
  font: 600 clamp(0.62rem, 1.1vw, 0.78rem)/1.5 var(--font-body);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.assessment-hero-copy h2 {
  max-width: 27ch;
  margin: 0 0 var(--space-2);
  font-size: clamp(2rem, 3.8vw, 3.4rem);
  line-height: 1.02;
}
.assessment-hero-copy p {
  max-width: 54ch;
  margin: 0;
  color: var(--muted);
  font-size: 1.05rem;
  line-height: 1.6;
}
.assessment-hero-action {
  align-self: end;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-top: 4px solid var(--accent);
  background: var(--surface-low);
  box-shadow: var(--shadow-card);
}
.assessment-hero-action .cta {
  display: block;
  width: 100%;
  margin: 0;
  text-align: center;
}
.assessment-hero-action .micro {
  margin: var(--space-2) 0 0;
  text-align: center;
}
.assessment-overview {
  padding: var(--space-6) var(--gutter);
  border-top: 1px solid var(--line);
  background: var(--surface-low);
}
.assessment-overview-inner {
  display: grid;
  grid-template-columns: minmax(18rem, 4fr) minmax(0, 8fr);
  column-gap: var(--space-4);
  width: min(100%, var(--wide-width));
  margin-inline: auto;
}
.assessment-overview-head {
  min-width: 0;
}
.assessment-overview-head h2 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(2rem, 4vw, 3.4rem);
}
.assessment-score-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
  min-width: 0;
  margin: 0;
}
.assessment-score-grid article {
  min-width: 0;
  padding: var(--space-3) 0;
  border-top: 2px solid var(--line);
}
.assessment-score-grid h3 {
  margin: 0 0 var(--space-1);
  font-size: 1.25rem;
}
.assessment-score-grid p {
  margin: 0;
  color: var(--muted);
}
.assessment-overview .assessment-disclosure {
  grid-column: 1 / -1;
  width: 100%;
  margin: var(--space-4) 0 0;
}
.assessment-overview .assessment-disclosure p {
  max-width: 90ch;
}
.assessment-footer {
  padding: var(--space-3) var(--gutter);
  border-top: 1px solid var(--line);
  background: var(--paper);
}
.assessment-footer nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-1) var(--space-3);
  width: min(100%, var(--wide-width));
  margin-inline: auto;
}
.assessment-footer a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--muted);
  font: 600 0.8rem/1.2 var(--font-body);
}
.assessment-footer a:hover {
  color: var(--accent-text);
}


/* ---- Focused assessment chrome ----------------------------------------- */
.assessment-shell-bar {
  max-width: none;
  min-height: var(--site-nav-height);
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--line);
}
.assessment-shell-inner {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  width: min(100%, var(--wide-width));
  min-height: 4rem;
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.assessment-shell-brand {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 44px;
  border: 0;
}
.assessment-shell-wordmark {
  margin: 0;
  color: var(--ink);
  font: 600 1.05rem/1 var(--font-secondary);
  letter-spacing: -0.02em;
  text-transform: none;
  white-space: nowrap;
}
.assessment-shell-wordmark .assessment-wordmark-accent {
  color: var(--accent);
}
.assessment-shell-bar .assessment-shell-meta {
  margin-left: auto;
}
.assessment-theme-toggle {
  width: 44px;
  height: 44px;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 0;
  background: var(--surface-low);
  color: var(--ink);
}
.assessment-theme-toggle {
  font-size: 0;
}
.assessment-theme-toggle::before {
  content: "Aa";
  font: 600 0.9rem/1 var(--font-display);
  letter-spacing: 0.02em;
}
:root[data-mode="dark"] .assessment-theme-toggle,
:root[data-mode="dark"] .assessment-theme-toggle:hover,
.assessment-theme-toggle:hover {
  border-color: var(--accent);
  background: var(--accent-tint);
  color: var(--ink);
}
.assessment-shell-exit {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-inline: var(--space-1);
  border: 0;
}
.assessment-shell-exit::before {
  content: "↗";
  margin-right: 0.4rem;
  color: var(--accent-text);
}

/* ---- Active diagnostic ledger ------------------------------------------ */
body[data-assessment-start] #assessment-component {
  width: min(100%, var(--wide-width));
  max-width: none;
  min-height: calc(100svh - 4rem);
  padding: var(--space-5) var(--gutter) var(--space-7);
}
body[data-assessment-start] #assessment-component > .wrap {
  width: 100%;
  padding: 0;
}
.quiz {
  display: grid;
  grid-template-columns: minmax(13rem, 3fr) minmax(0, 9fr);
  grid-template-rows: auto auto 1fr;
  column-gap: var(--space-4);
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 1px solid var(--line);
  border-top: 1px solid var(--line);
  background: var(--card);
  box-shadow: var(--shadow-card);
}
.quiz-progress {
  position: sticky;
  top: calc(4rem + var(--space-2));
  grid-column: 1;
  grid-row: 1 / span 3;
  align-self: start;
  min-width: 0;
  min-height: 18rem;
  margin: 0;
  padding: var(--space-3);
  border-right: 1px solid var(--line);
  background: var(--surface-low);
}
.quiz-progress::before {
  content: "AI•DOOM / Working ledger";
  display: block;
  margin-bottom: var(--space-4);
  color: var(--muted);
  font: 700 0.65rem/1.4 var(--font-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.quiz-progress-meta {
  display: grid;
  gap: var(--space-1);
  margin: 0;
  padding-top: var(--space-2);
  border-top: 1px solid var(--line);
}
.quiz-progress-meta > span:first-child {
  color: var(--ink);
  font: 500 1.7rem/1.05 var(--font-display);
}
.quiz-lever-tag {
  min-width: 0;
  text-align: left;
  overflow-wrap: anywhere;
}
.quiz-bar {
  height: 4px;
  margin-top: var(--space-3);
  background: var(--line);
}
.quiz-question,
.quiz-help,
.quiz > form {
  grid-column: 2;
  min-width: 0;
}
.quiz-question {
  grid-row: 1;
  max-width: 24ch;
  margin: 0;
  padding: var(--space-4) var(--space-4) var(--space-1) 0;
  color: var(--ink);
  font: 500 clamp(2rem, 3.6vw, 3.1rem)/1.03 var(--font-display);
  letter-spacing: -0.025em;
}
.quiz-help {
  grid-row: 2;
  max-width: 66ch;
  margin: 0;
  padding: 0 var(--space-4) var(--space-3) 0;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.9rem;
}
.quiz > form {
  grid-row: 3;
  padding: var(--space-3) var(--space-4) var(--space-4) 0;
}
.quiz-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0 0 var(--space-3);
  padding: 1px;
  background: var(--line);
}
@media (min-width: 37.51rem) {
  .quiz-options .quiz-opt:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}
.quiz-opt {
  position: relative;
  align-items: flex-start;
  min-width: 0;
  min-height: 64px;
  margin: 0;
  padding: var(--space-2);
  border: 0;
  background: var(--paper);
  color: var(--ink);
  font-size: 0.92rem;
  line-height: 1.45;
}
.quiz-opt:hover {
  background: var(--accent-tint);
  color: var(--ink);
}
.quiz-opt.selected {
  z-index: 1;
  background: var(--accent-tint);
  color: var(--ink);
  box-shadow: inset 3px 0 0 var(--accent);
}
.quiz-opt input {
  width: 1.15rem;
  height: 1.15rem;
  margin: 0.1rem 0.65rem 0 0;
}
.quiz-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  margin-top: var(--space-3);
  padding-top: var(--space-2);
  border-top: 1px solid var(--line);
}
.quiz-actions .quiz-nav {
  margin: 0;
  padding: 0;
  border: 0;
}
.quiz-actions .answer-continue {
  margin: 0 0 0 auto;
}
.answer-continue .cta {
  min-width: 10rem;
  text-align: center;
}
.answer-context-toggle,
.quiz-nav {
  border-color: var(--line);
}
.answer-context-field,
[data-inventory-other] {
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent);
  background: var(--surface-low);
}
.profile-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-1) var(--space-3);
}
.profile-grid > *,
.profile-grid > [data-other-for],
.profile-grid > fieldset {
  min-width: 0;
}
.profile-grid .revenue-range,
.profile-grid .privacy-choice,
.profile-grid > button,
.profile-grid > .quiz-nav {
  grid-column: 1 / -1;
}
.assessment-start-card {
  display: block;
  width: min(100%, 44rem);
  margin-inline: auto;
  padding: var(--space-4);
  border-top: 4px solid var(--accent);
}
.assessment-start-card h2 {
  margin-top: var(--space-1);
  font-size: clamp(2rem, 5vw, 3rem);
}
.assessment-readiness {
  padding-left: var(--space-2);
  border-left: 3px solid var(--accent-2);
}
.assessment-error,
.assessment-reset-error,
#assessment-component[data-error="true"] > [role="alert"],
#assessment-component > [role="alert"] {
  max-width: 46rem;
  margin: var(--space-4) auto;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-top: 4px solid var(--accent-2);
  background: var(--card);
}
.assessment-error [role="alert"],
.assessment-reset-error [role="alert"] {
  font: 500 1.5rem/1.2 var(--font-display);
}

/* ---- Executive result folio -------------------------------------------- */
.assessment-complete {
  width: 100%;
  max-width: none;
}
.result-artifact-head {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(14rem, 4fr);
  gap: var(--space-1) var(--space-4);
  margin-bottom: var(--space-4);
  padding: var(--space-4);
  border-top-width: 4px;
  background: var(--surface-low);
  box-shadow: var(--shadow-soft);
}
.result-artifact-head .section-label,
.result-artifact-head h1 {
  grid-column: 1;
}
.result-artifact-head h1 {
  max-width: 14ch;
  font-size: clamp(2.8rem, 6vw, 5.2rem);
  line-height: 0.95;
}
.result-artifact-date,
.result-artifact-caveat {
  grid-column: 2;
}
.result-artifact-date {
  align-self: end;
  padding-bottom: var(--space-1);
  border-bottom: 1px solid var(--line);
  font-family: var(--font-mono);
}
.result-artifact-caveat {
  margin: 0;
}
.assessment-complete > .section-head {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(14rem, 4fr);
  gap: var(--space-1) var(--space-4);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--line);
}
.assessment-complete > .section-head .section-label,
.assessment-complete > .section-head h2 {
  grid-column: 1;
}
.assessment-complete > .section-head .result-purpose {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: end;
  margin: 0;
  padding-left: var(--space-2);
  border-left: 3px solid var(--accent);
}
.result-score-grid,
.result-readout-grid,
.benchmark-stats,
.dim-grid,
.leader-signal-list {
  gap: 1px;
  padding: 1px;
  background: var(--line);
}
.dim-grid .dim-card:last-child:nth-child(odd),
.leader-signal-list .leader-signal:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}
.result-score-grid .result-score,
.result-readout-grid .result-highlight,
.benchmark-stat,
.dim-card,
.leader-signal {
  margin: 0;
  border: 0;
  background: var(--card);
  box-shadow: none;
}
.result-score-grid .result-score {
  padding: var(--space-3);
  border-top: 4px solid var(--accent);
}
.result-score-grid .result-score--leader {
  border-top-color: var(--accent-2);
}
.result-score-num {
  font-weight: 500;
  font-size: clamp(4rem, 9vw, 7rem);
}
.result-score-unit {
  font-family: var(--font-body);
  font-size: 1rem;
}
.result-pattern,
.result-gap,
.result-start-panel,
.result-leader-signals,
.result-share-actions,
.email-gate,
.result-cta {
  border-radius: 0;
  box-shadow: none;
}
.result-pattern {
  margin-top: var(--space-3);
  padding: var(--space-3);
  border-left-width: 4px;
  background: var(--surface-low);
}
.result-gap {
  padding-left: var(--space-3);
}
.result-start-panel {
  padding: var(--space-3);
  background: var(--accent-tint);
}
.result-benchmark,
.result-patterns,
.result-dimensions {
  margin-block: var(--space-6);
  padding-top: var(--space-3);
  border-top: 3px double var(--line);
}
.result-section-head h3,
.result-benchmark > h3 {
  font-size: clamp(1.8rem, 3vw, 2.7rem);
}
.benchmark-stat {
  padding: var(--space-3);
  border-left: 0;
}
.result-chart-grid .chart-wrap {
  padding: var(--space-3);
  background: var(--surface-low);
  box-shadow: none;
}
.dim-card {
  padding: var(--space-3);
  border-top: 3px solid var(--accent);
}
.dim-card.is-ai {
  border-top-color: var(--accent-2);
}
.result-cta,
.result-share-actions,
.email-gate {
  padding: var(--space-3);
  border: 1px solid var(--line);
}
.result-cta {
  text-align: left;
  background: var(--accent-tint);
  border-top: 4px solid var(--accent);
}
.result-cta > p {
  max-width: 62ch;
}
.result-cta .result-secondary {
  justify-content: flex-start;
}
.result-share-actions {
  background: var(--surface-low);
}
.email-gate {
  background: var(--card);
}
.email-gate h3,
.result-cta h3,
.result-share-actions h3 {
  font-size: clamp(1.5rem, 2.5vw, 2rem);
}
.email-note.error,
.result-action-status[data-state="error"] {
  color: var(--ink);
  border-left: 3px solid var(--accent-2);
  padding-left: var(--space-1);
}

/* ---- Responsive and interaction safeguards ----------------------------- */
@media (max-width: 56.24rem) {
  .assessment-hero,
  .result-artifact-head,
  .assessment-complete > .section-head {
    grid-template-columns: 1fr;
  }
  .assessment-hero {
    gap: var(--space-4);
  }
  .assessment-hero-copy {
    max-width: 46rem;
  }
  .assessment-hero-action {
    width: min(100%, 30rem);
  }
  .assessment-overview-inner {
    grid-template-columns: 1fr;
  }
  .assessment-score-grid {
    margin-top: var(--space-3);
  }
  .result-artifact-date,
  .result-artifact-caveat,
  .assessment-complete > .section-head .result-purpose {
    grid-column: 1;
  }
  .assessment-complete > .section-head .result-purpose {
    grid-row: auto;
    margin-top: var(--space-2);
  }
  .quiz {
    display: block;
  }
  .quiz-progress {
    position: static;
    min-height: 0;
    padding: var(--space-2) var(--space-3);
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .quiz-progress::before {
    margin-bottom: var(--space-2);
  }
  .quiz-progress-meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
  }
  .quiz-progress-meta > span:first-child {
    font-size: 1.35rem;
  }
  .quiz-lever-tag {
    text-align: right;
  }
  .quiz-bar {
    margin-top: var(--space-2);
  }
  .quiz-question {
    max-width: 28ch;
    padding: var(--space-3) var(--space-3) var(--space-1);
  }
  .quiz-help {
    padding: 0 var(--space-3) var(--space-2);
  }
  .quiz > form {
    padding: var(--space-3);
  }
}
@media (max-width: 37.5rem) {
  .assessment-intro {
    padding: var(--space-4) var(--gutter) var(--space-5);
  }
  .assessment-hero {
    gap: var(--space-3);
  }
  .assessment-wordmark-lockup {
    padding-bottom: var(--space-3);
  }
  .assessment-wordmark {
    font-size: clamp(2.45rem, 12vw, 4rem);
    letter-spacing: -0.025em;
  }
  .assessment-expansion {
    max-width: 34rem;
    letter-spacing: 0.08em;
  }
  .assessment-hero-action {
    width: 100%;
  }
  .assessment-overview {
    padding-block: var(--space-5);
  }
  .assessment-score-grid {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .assessment-shell-brand {
    flex: 1 1 auto;
    margin-right: auto;
  }
  .assessment-shell-inner {
    min-height: 3.5rem;
    gap: var(--space-1);
  }
  .assessment-theme-toggle {
    flex: 0 0 44px;
  }
  .assessment-shell-exit {
    padding: 0;
  }
  body[data-assessment-start] #assessment-component {
    min-height: calc(100svh - 3.5rem);
    padding: var(--space-3) var(--gutter) var(--space-6);
  }
  .quiz-progress {
    padding: var(--space-2);
  }
  .quiz-progress::before {
    display: none;
  }
  .quiz-progress-meta {
    align-items: flex-start;
    flex-direction: column;
  }
  .quiz-lever-tag {
    text-align: left;
  }
  .quiz-question {
    padding: var(--space-3) var(--space-2) var(--space-1);
    font-size: clamp(1.9rem, 10vw, 2.5rem);
  }
  .quiz-help {
    padding: 0 var(--space-2) var(--space-2);
  }
  .quiz > form {
    padding: var(--space-2);
  }
  .quiz-options {
    grid-template-columns: 1fr;
  }
  .quiz-opt {
    min-height: 58px;
  }
  .quiz-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .quiz-actions .answer-continue {
    margin-left: 0;
  }
  .answer-continue {
    justify-content: stretch;
  }
  .answer-continue .cta {
    width: 100%;
  }
  .profile-grid {
    grid-template-columns: 1fr;
  }
  .profile-grid .revenue-range,
  .profile-grid .privacy-choice,
  .profile-grid > button,
  .profile-grid > .quiz-nav {
    grid-column: auto;
  }
  .result-artifact-head {
    padding: var(--space-3) var(--space-2);
  }
  .result-artifact-head h1 {
    font-size: clamp(2.6rem, 14vw, 3.8rem);
  }
  .result-score-grid .result-score,
  .result-pattern,
  .result-start-panel,
  .result-leader-signals,
  .result-chart-grid .chart-wrap,
  .dim-card,
  .result-cta,
  .result-share-actions,
  .email-gate {
    padding: var(--space-2);
  }
  .result-score-grid .meta-row {
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(assessment-content),
  ::view-transition-old(assessment-content),
  ::view-transition-new(assessment-content) {
    animation: none;
  }
}

/* ---- Three-facet instrument: item formats ------------------------------ */
.quiz-scale {
  display: grid; gap: var(--space-1);
  margin: var(--space-2) 0 var(--space-3);
}
.quiz-scale-labels {
  display: flex; justify-content: space-between;
  color: var(--muted); font: 600 0.76rem/1.3 var(--font-body);
  letter-spacing: 0.06em; text-transform: uppercase;
}
.quiz-scale-range {
  width: 100%; height: 44px; margin: 0;
  accent-color: var(--accent); cursor: pointer;
}
.quiz-scale-range:focus-visible { outline: 3px solid var(--ring); outline-offset: 4px; }
.quiz-scale-range:disabled { opacity: 0.45; cursor: not-allowed; }
.quiz-scale-output {
  display: block; min-height: 2.6rem;
  color: var(--accent-dk); font: 700 1.6rem/1.2 var(--font-display);
  text-align: center;
}
.quiz-scale[data-answered="false"] .quiz-scale-output {
  color: var(--muted); font: 600 0.9rem/1.3 var(--font-body);
  padding-top: 0.6rem;
}
.quiz-scale-na {
  display: inline-flex; align-items: center; gap: 0.55em;
  min-height: 44px; color: var(--ink); cursor: pointer;
  font: 500 0.92rem/1.3 var(--font-body);
}
.quiz-scale-na input { width: 1.1rem; height: 1.1rem; margin: 0; accent-color: var(--accent); }
.quiz-scale-na input:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
.quiz-opt input[data-exclusive] + span { font-style: italic; }
.profile-grid select {
  min-height: 48px; padding: 0.6em 0.8em;
  border: 1px solid var(--line); border-radius: 0;
  background: var(--paper); color: var(--ink); font: 1rem/1.3 var(--font-body);
}
.profile-grid select:focus-visible { outline: 3px solid var(--ring); outline-offset: 1px; }
.profile-grid input[type="text"], .profile-grid input:not([type]) {
  min-height: 44px; padding: 0.6em 0.8em; width: 100%;
  border: 1px solid var(--line); border-radius: 0;
  background: var(--paper); color: var(--ink); font: 1rem/1.3 var(--font-body);
}
.profile-grid label { color: var(--ink); font: 600 0.82rem/1.3 var(--font-body); }

/* ---- Three-facet result ------------------------------------------------- */
.facet-grid {
  display: grid; grid-template-columns: 1fr; gap: 0.7em;
  margin: var(--space-3) 0;
}
.facet-card {
  padding: var(--space-3) var(--space-2);
  background: var(--card); border: 1px solid var(--line);
  border-top: 3px solid var(--accent); text-align: center;
  box-shadow: var(--shadow-card);
}
.facet-card--leader { border-top-color: var(--facet-leader); }
.facet-card--organization { border-top-color: var(--facet-organization); }
.facet-card--conditions { border-top-color: var(--facet-conditions); }
.facet-card .list-head { margin: 0 0 var(--space-1); }
.facet-card-score { margin: 0; }
.facet-card-score .result-score-num { font-size: clamp(2.4rem, 8vw, 3.4rem); }
.facet-card-question { margin: var(--space-2) 0 0; color: var(--muted); font-size: 0.86rem; line-height: 1.45; }
.facet-card-percentile { min-height: 1.4em; margin: var(--space-1) 0 0; color: var(--ink); font: 600 0.82rem/1.4 var(--font-body); }
.facet-card-percentile:empty { display: none; }
.result-pattern-guidance { margin-top: var(--space-1); color: var(--ink); font-weight: 600; }

.result-gap, .result-start-panel, .result-consistency, .result-benchmark {
  margin: var(--space-4) 0; padding-top: var(--space-3);
  border-top: 1px solid var(--line);
}
.gap-row { margin: var(--space-2) 0 var(--space-3); }
.gap-row-head {
  display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-2);
  margin-bottom: 0.5em; font: 600 0.9rem/1.3 var(--font-body); color: var(--ink);
}
.gap-row-head strong { font: 700 1.2rem/1 var(--font-display); color: var(--accent-dk); }
.gap-track {
  position: relative; height: 12px; margin: 0.4em 0;
  background: var(--line);
}
.gap-bar { position: absolute; top: 3px; height: 6px; background: var(--accent-2); }
.gap-dot {
  position: absolute; top: -4px; width: 20px; height: 20px; margin-left: -10px;
  border-radius: 50%; border: 2px solid var(--accent-contrast); background: var(--accent);
  box-shadow: var(--shadow-soft);
}
.gap-dot--leader, .gap-key--leader::before { background: var(--facet-leader); }
.gap-dot--organization, .gap-key--organization::before { background: var(--facet-organization); }
.gap-dot--conditions, .gap-key--conditions::before { background: var(--facet-conditions); }
.gap-row-legend { display: flex; gap: 1.4em; margin: 0.6em 0 0; color: var(--muted); font-size: 0.82rem; }
.gap-key { display: inline-flex; align-items: center; gap: 0.45em; }
.gap-key::before { content: ""; display: inline-block; width: 0.75em; height: 0.75em; border-radius: 50%; }

.priority-lead {
  padding: var(--space-3); background: var(--accent-tint);
  border-left: 3px solid var(--accent);
}
.priority-lead h4 { margin: 0.2em 0 0.4em; font: 700 1.35rem/1.2 var(--font-display); color: var(--accent-dk); }
.priority-lead p:last-child { margin: 0; }
.priority-rest { list-style: none; margin: var(--space-2) 0 0; padding: 0; display: grid; gap: 0.6em; }
.priority-rest li { padding: var(--space-2); border: 1px solid var(--line); background: var(--card); }
.priority-rest li strong { font: 700 1.05rem/1.2 var(--font-display); color: var(--ink); }
.priority-rest li small { color: var(--muted); margin-left: 0.4em; }
.priority-rest li p { margin: 0.4em 0 0; color: var(--muted); font-size: 0.9rem; }

.consistency-flags { margin: var(--space-2) 0 0; padding-left: 1.2em; color: var(--muted); font-size: 0.9rem; }
.consistency-flags li { margin: 0.3em 0; }
.consistency-flags strong { color: var(--ink); }

.benchmark-facets { display: grid; grid-template-columns: 1fr; gap: 0.7em; margin: var(--space-2) 0; }
.benchmark-facets:empty { display: none; }
.benchmark-composition { margin: var(--space-1) 0 0; color: var(--muted); font-size: 0.82rem; line-height: 1.5; }
.benchmark-composition:empty { display: none; }

.result-chart-grid--three { grid-template-columns: 1fr; }
.result-chart-grid .chart-canvas-frame--radar { width: min(100%, 380px); aspect-ratio: 1; }
.result-chart-grid .chart-canvas-frame--bars { width: 100%; aspect-ratio: auto; min-height: 420px; }
.result-chart-grid .chart-canvas-frame--scatter { width: min(100%, 360px); aspect-ratio: 1; }
.facet-legend {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 0.4em 1.2em;
  margin: var(--space-2) 0 0; padding: 0; list-style: none;
  color: var(--muted); font: 600 0.76rem/1.3 var(--font-body);
}
.facet-legend-item { display: inline-flex; align-items: center; gap: 0.45em; }
.facet-legend-item::before { content: ""; display: inline-block; width: 0.75em; height: 0.75em; border-radius: 50%; }
.facet-legend-item--leader::before { background: var(--facet-leader); }
.facet-legend-item--organization::before { background: var(--facet-organization); }
.facet-legend-item--conditions::before { background: var(--facet-conditions); }

.dim-group { margin: var(--space-3) 0 0; }
.dim-group-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.4em 1em; margin-bottom: var(--space-1); }
.dim-group-head h4 { margin: 0; font: 700 1.15rem/1.2 var(--font-display); color: var(--ink); }
.dim-group-head p { margin: 0; color: var(--muted); font-size: 0.88rem; }
.dim-card--leader { border-top-color: var(--facet-leader); }
.dim-card--organization { border-top-color: var(--facet-organization); }
.dim-card--conditions { border-top-color: var(--facet-conditions); }
.dim-card--leader .dim-card-meter-fill { background: var(--facet-leader); }
.dim-card--organization .dim-card-meter-fill { background: var(--facet-organization); }
.dim-card--conditions .dim-card-meter-fill { background: var(--facet-conditions); }
.dim-card-meter { position: relative; }
.dim-card-meter-fill { position: relative; z-index: 1; }
.dim-card-cohort-band {
  position: absolute; top: -2px; bottom: -2px; z-index: 0;
  background: var(--cohort-band); border-left: 1px solid var(--muted); border-right: 1px solid var(--muted);
}
.dim-card-cohort-band[hidden] { display: none; }
.dim-card-strength { margin: 0.2em 0 0; color: var(--muted); font-size: 0.78rem; }
.dim-card[data-strength="thin"] .dim-card-val,
.dim-card[data-strength="mixed"] .dim-card-val { color: var(--muted); }
.dim-card[data-strength="mixed"] .dim-card-strength { color: var(--accent-2); font-weight: 600; }
.dim-card-benchmark[hidden] { display: none; }

@media (min-width: 720px) {
  .facet-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .benchmark-facets { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
  .result-chart-grid--three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .result-chart-grid--three [data-result-chart-card="bars"] { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  .gap-dot, .gap-bar { transition: none; }
}
@media (max-width: 600px) {
  .result-chart-grid .chart-canvas-frame--radar,
  .result-chart-grid .chart-canvas-frame--scatter { width: min(100%, 320px); }
  .result-chart-grid .chart-canvas-frame--bars { min-height: 380px; }
}

/* Result headline: the pattern outcome is a full sentence, so give it room and
   a calmer size than the marketing section heads. */
:root[data-component-set] .assessment-complete > .section-head h2 {
  max-width: 30ch;
  font-size: clamp(1.7rem, 3.1vw, 2.5rem);
  line-height: 1.18;
  letter-spacing: -0.01em;
}
.priority-rest li .list-head {
  display: block;
  margin-bottom: 0.3em;
}
:root[data-component-set] .assessment-complete > .section-head {
  grid-template-columns: minmax(0, 1.35fr) minmax(14rem, 1fr);
  max-width: none;
}
@media (max-width: 859px) {
  :root[data-component-set] .assessment-complete > .section-head {
    grid-template-columns: 1fr;
  }
}

/* Inline step problems and unmeasured gap rows */
.assessment-step-alert {
  max-width: 600px; margin: 0 auto var(--space-2);
  padding: var(--space-2) var(--space-3);
  background: var(--accent-2-tint); border-left: 3px solid var(--accent-2);
  color: var(--ink); font: 600 0.95rem/1.4 var(--font-body);
}
.gap-row--unmeasured .gap-row-legend { color: var(--muted); font-style: italic; }

/* The three result views fill their cards: side by side from tablet width up,
   the bars view spanning the full row, each canvas frame the full card width. */
.result-chart-grid .chart-canvas-frame--radar,
.result-chart-grid .chart-canvas-frame--scatter {
  width: 100%;
  max-width: none;
  aspect-ratio: 1;
}
.result-chart-grid .chart-canvas-frame--bars {
  width: 100%;
  min-height: 460px;
}
@media (min-width: 720px) {
  .result-chart-grid--three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .result-chart-grid--three [data-result-chart-card="bars"] { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .result-chart-grid .chart-canvas-frame--radar,
  .result-chart-grid .chart-canvas-frame--scatter { width: 100%; }
}
