:root {
  --visual-paper: #f7f7f2;
  --visual-white: #fff;
  --visual-ink: #171717;
  --visual-muted: #5f615f;
  --visual-line: #c8c8c2;
  --visual-red: #e0002b;
  --visual-red-soft: #fff0f3;
  --visual-dark-line: #343434;
  color: var(--visual-ink);
  background: var(--visual-paper);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.45;
}

* { box-sizing: border-box; }

html { min-width: 320px; scroll-behavior: smooth; }

body { margin: 0; background: var(--visual-paper); }

a { color: inherit; }

button, select { font: inherit; }

.visual-skip {
  position: absolute;
  z-index: 10;
  top: -3rem;
  left: 1rem;
  padding: .65rem .8rem;
  color: var(--visual-white);
  background: var(--visual-ink);
}

.visual-skip:focus { top: .75rem; }

.visual-header {
  position: relative;
  z-index: 5;
  top: 0;
  border-bottom: 1px solid var(--visual-line);
  background: rgba(247, 247, 242, .96);
  backdrop-filter: blur(12px);
}

.visual-header-inner {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  gap: 1.2rem;
  align-items: center;
  width: min(1240px, calc(100% - 3rem));
  min-height: 4.5rem;
  margin: 0 auto;
}

.visual-brand {
  display: inline-flex;
  gap: .65rem;
  align-items: center;
  color: var(--visual-ink);
  text-decoration: none;
}

.visual-brand img { display: block; width: 34px; height: 34px; }

.visual-brand span { display: grid; gap: .06rem; }

.visual-brand small,
.visual-eyebrow,
.visual-section-number,
.visual-detail-label {
  color: var(--visual-red);
  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.visual-brand strong { font-size: .82rem; letter-spacing: .02em; }

.visual-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
}

.visual-nav a {
  color: var(--visual-ink);
  font-size: .78rem;
  font-weight: 700;
  text-decoration: none;
}

.visual-nav a:hover,
.visual-nav a:focus-visible,
.visual-action-link:hover,
.visual-action-link:focus-visible { color: var(--visual-red); }

.visual-language-label {
  color: var(--visual-muted);
  font-size: .7rem;
}

.visual-language {
  min-height: 2.25rem;
  padding: .35rem 2rem .35rem .6rem;
  border: 1px solid var(--visual-line);
  color: var(--visual-ink);
  background: var(--visual-white);
}

.visual-banner {
  width: min(1240px, calc(100% - 3rem));
  margin: 1rem auto 0;
  padding: .75rem 1rem;
  border-left: 4px solid var(--visual-red);
  color: var(--visual-ink);
  background: var(--visual-red-soft);
  font-size: .82rem;
}

.visual-main { width: min(1240px, calc(100% - 3rem)); margin: 0 auto; }

/* The guide is a route first, then a collection of reference boards. Keep
   those decisions visible in the layout without changing the content model. */
.visual-main > [id] { scroll-margin-top: 5.75rem; }

:where(a, button, select, summary):focus-visible {
  outline: 3px solid var(--visual-red);
  outline-offset: 3px;
}

:where(a, button, select, summary) { touch-action: manipulation; }

img { max-width: 100%; }

h1,
h2,
h3 { text-wrap: balance; }

.visual-entry-nav {
  display: grid;
  grid-template-columns: minmax(230px, .72fr) minmax(0, 1.28fr);
  gap: 2rem;
  align-items: start;
  padding: clamp(1.9rem, 4vw, 3.25rem) 0 clamp(2.2rem, 4.5vw, 3.75rem);
  border-bottom: 1px solid var(--visual-line);
  border-top: 5px solid var(--visual-red);
}

.visual-entry-heading {
  display: block;
  min-width: 0;
}

.visual-entry-heading > * { min-width: 0; }

.visual-entry-kicker {
  color: var(--visual-red);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.visual-entry-heading h2 {
  max-width: 19ch;
  margin: .45rem 0 0;
  font-size: clamp(2rem, 4vw, 3.6rem);
  line-height: .98;
  letter-spacing: -.06em;
}

.visual-entry-heading > p {
  max-width: 42rem;
  margin: 1.2rem 0 0;
  color: var(--visual-muted);
  font-size: .92rem;
}

.visual-entry-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--visual-dark-line);
}

.visual-entry-list li { display: flex; min-width: 0; }

.visual-entry-card {
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: .6rem;
  width: 100%;
  min-height: 12rem;
  padding: 1rem;
  color: var(--visual-ink);
  background: var(--visual-white);
  text-decoration: none;
  transition: transform .18s ease, color .18s ease, background-color .18s ease;
}

.visual-entry-card:hover,
.visual-entry-card:focus-visible {
  color: var(--visual-white);
  background: var(--visual-ink);
  transform: translateY(-3px);
}

.visual-entry-card:focus-visible { outline-offset: -3px; }

.visual-entry-index {
  color: var(--visual-red);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .13em;
}

.visual-entry-card strong {
  font-size: 1.05rem;
  line-height: 1.08;
}

.visual-entry-card span:not(.visual-entry-index) {
  color: var(--visual-muted);
  font-size: .8rem;
  line-height: 1.45;
}

.visual-entry-card:hover span:not(.visual-entry-index),
.visual-entry-card:focus-visible span:not(.visual-entry-index) { color: #d7d7d2; }

.visual-entry-card em {
  color: var(--visual-red);
  font-size: .75rem;
  font-style: normal;
  font-weight: 800;
  line-height: 1.35;
}

.visual-hero-actions { margin: 1.25rem 0 0; }

.visual-hero-action {
  min-height: 2.75rem;
  margin-top: 0;
  padding: .7rem .85rem;
  border: 1px solid var(--visual-ink);
  color: var(--visual-ink);
  text-decoration: none;
}

.visual-hero-action:hover,
.visual-hero-action:focus-visible {
  color: var(--visual-white);
  background: var(--visual-red);
}

.visual-entry-card strong,
.visual-entry-card span,
.visual-entry-card em,
.visual-section-heading > p,
.visual-boundary { overflow-wrap: anywhere; }

.visual-hero {
  display: grid;
  grid-template-columns: 8rem minmax(0, 1fr);
  gap: 2rem;
  padding: clamp(3.25rem, 4.5vw, 4rem) 0 clamp(2rem, 3vw, 2.75rem);
  border-bottom: 1px solid var(--visual-line);
}

.visual-hero-index {
  display: grid;
  align-content: start;
  gap: .45rem;
  padding-top: .45rem;
  color: var(--visual-red);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
}

.visual-hero-index strong { color: var(--visual-ink); font-size: 3.5rem; line-height: .9; letter-spacing: -.08em; }

.visual-hero-copy { max-width: 64rem; }

.visual-hero h1 {
  max-width: 20ch;
  margin: .9rem 0 1.2rem;
  font-size: clamp(3rem, 7vw, 6.4rem);
  line-height: .92;
  letter-spacing: -.075em;
}

.visual-lede { max-width: 42rem; margin: 0; font-size: clamp(1.05rem, 1.8vw, 1.35rem); line-height: 1.55; }

.visual-boundary {
  max-width: 52rem;
  margin: 1.2rem 0 0;
  padding-top: .9rem;
  border-top: 1px solid var(--visual-line);
  color: var(--visual-muted);
  font-size: .8rem;
}

.visual-goal-section,
.visual-route-section,
.visual-journey-section,
.visual-capability-section,
.visual-maturity-section,
.visual-concept-section,
.visual-action-boundary-section,
.visual-map-section,
.visual-evidence-section,
.visual-receipt-section,
.visual-gallery-section,
.visual-how-section { padding: 4.25rem 0; border-bottom: 1px solid var(--visual-line); }

/* Keep the route-first hierarchy after the shared section rhythm is declared. */
.visual-primary-section { padding-top: clamp(4.75rem, 8vw, 6rem); }
.visual-gallery-section.visual-primary-section { padding-top: clamp(3.2rem, 5vw, 4.25rem); }
.visual-primary-section { border-top: 4px solid var(--visual-red); }
.visual-primary-section .visual-section-heading > * { min-width: 0; }
.visual-primary-section .visual-section-number { color: var(--visual-red); font-size: .78rem; }
.visual-gallery-section.visual-primary-section { border-top-color: var(--visual-ink); }
.visual-gallery-section .visual-section-heading h2 { font-size: clamp(1.8rem, 3.5vw, 3rem); }
.visual-gallery-section .visual-section-heading > p { font-size: .86rem; }

.visual-section-heading {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(260px, 1.15fr);
  gap: 2rem;
  align-items: end;
  margin-bottom: 1.6rem;
}

.visual-section-heading h2 { margin: .4rem 0 0; font-size: clamp(1.9rem, 4vw, 3.5rem); line-height: 1; letter-spacing: -.06em; }

.visual-section-heading > p { max-width: 42rem; margin: 0; color: var(--visual-muted); font-size: .92rem; }

.visual-section-number { display: inline-block; margin-right: .5rem; color: var(--visual-ink); }

.visual-route-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
  gap: 1px;
  background: var(--visual-dark-line);
}

.visual-route-nav {
  min-width: 0;
  padding: 1.2rem;
  background: var(--visual-white);
}

.visual-route-nav ol {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.visual-route-node {
  display: grid;
  width: 100%;
  align-content: space-between;
  min-height: 7.2rem;
  padding: .85rem;
  border: 1px solid var(--visual-ink);
  color: var(--visual-ink);
  background: var(--visual-white);
  text-align: left;
  cursor: pointer;
}

.visual-route-node:hover,
.visual-route-node:focus-visible,
.visual-route-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }

.visual-route-node span { color: var(--visual-red); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.visual-route-node strong { font-size: .92rem; line-height: 1.1; }

/* Keep every selectable map node aligned when localized labels have different lengths. */
.visual-goal-node,
.visual-journey-node,
.visual-concept-node,
.visual-map-node,
.visual-evidence-node,
.visual-reading-loop-node,
.visual-triage-node,
.visual-board-explorer-node { width: 100%; }

.visual-route-detail {
  display: grid;
  align-content: center;
  gap: .7rem;
  min-height: 17rem;
  padding: 1.5rem;
  color: var(--visual-white);
  background: var(--visual-ink);
}

.visual-route-detail h3 { max-width: 16ch; margin: 0; color: var(--visual-white); font-size: clamp(1.55rem, 2.8vw, 2.4rem); line-height: .98; letter-spacing: -.05em; }
.visual-route-detail p { margin: 0; color: #d7d7d2; font-size: .84rem; line-height: 1.5; }
.visual-route-detail .visual-detail-label { color: #ff526f; }
.visual-route-next { display: grid; gap: .2rem; margin-top: .35rem !important; padding-top: .7rem; border-top: 1px solid #555; }
.visual-route-next span { color: #aaa; font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-route-next strong { color: var(--visual-white); font-size: .86rem; }
.visual-route-detail .visual-action-link { color: #ff526f; }

.visual-route-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-route-fallback summary { cursor: pointer; font-weight: 800; }
.visual-route-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-route-fallback ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-route-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-route-fallback li strong { font-size: .85rem; }
.visual-route-fallback li span { color: var(--visual-muted); font-size: .78rem; }
.visual-route-fallback li em { color: var(--visual-red); font-size: .72rem; font-style: normal; line-height: 1.4; }
.visual-route-fallback li a { font-size: .75rem; }

.visual-map-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
  gap: 1px;
  background: var(--visual-dark-line);
}

.visual-goal-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .8fr);
  gap: 1px;
  background: var(--visual-dark-line);
}

.visual-journey-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
  gap: 1px;
  background: var(--visual-dark-line);
}

.visual-concept-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
  gap: 1px;
  background: var(--visual-dark-line);
}

.visual-concept-graph {
  position: relative;
  min-height: 31rem;
  padding: 1.2rem;
  overflow: hidden;
  background: var(--visual-white);
}

.visual-concept-graph::before,
.visual-concept-graph::after {
  position: absolute;
  z-index: 0;
  background: var(--visual-line);
  content: '';
}

.visual-concept-graph::before { top: 50%; right: 1.2rem; left: 1.2rem; height: 1px; }
.visual-concept-graph::after { top: 1.2rem; bottom: 1.2rem; left: 50%; width: 1px; }

.visual-concept-center {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: grid;
  width: min(12rem, 30%);
  aspect-ratio: 1;
  align-content: center;
  gap: .35rem;
  padding: .8rem;
  border: 3px solid var(--visual-ink);
  color: var(--visual-white);
  background: var(--visual-ink);
  text-align: center;
  transform: translate(-50%, -50%);
}

.visual-concept-center span { color: var(--visual-red); font-size: .82rem; font-weight: 800; line-height: 1.1; }
.visual-concept-center small { color: #ddd; font-size: .68rem; line-height: 1.25; }

.visual-concept-nodes {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(3, minmax(0, 1fr));
  gap: .9rem;
  min-height: 28.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.visual-concept-node {
  display: grid;
  align-content: space-between;
  min-height: 7rem;
  padding: .8rem;
  border: 1px solid var(--visual-ink);
  color: var(--visual-ink);
  background: rgba(255, 255, 255, .94);
  text-align: left;
  cursor: pointer;
}

.visual-concept-node:hover,
.visual-concept-node:focus-visible,
.visual-concept-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }

.visual-concept-node span { color: var(--visual-red); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.visual-concept-node strong { font-size: .94rem; line-height: 1.08; }

.visual-concept-detail {
  display: grid;
  align-content: start;
  gap: .7rem;
  min-height: 31rem;
  padding: 1.5rem;
  color: var(--visual-white);
  background: var(--visual-ink);
}

.visual-concept-detail h3 { max-width: 14ch; margin: 0; color: var(--visual-white); font-size: clamp(1.55rem, 2.8vw, 2.4rem); line-height: .98; letter-spacing: -.05em; }
.visual-concept-detail p { margin: 0; color: #d7d7d2; font-size: .84rem; line-height: 1.5; }
.visual-concept-detail .visual-detail-label { color: #ff526f; }
.visual-concept-next { display: grid; gap: .2rem; margin-top: .35rem !important; padding-top: .7rem; border-top: 1px solid #555; }
.visual-concept-next span { color: #aaa; font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-concept-next strong { color: var(--visual-white); font-size: .86rem; }
.visual-concept-detail .visual-action-link { color: #ff526f; }
.visual-concept-figure { display: grid; gap: .45rem; margin: .2rem 0 0; }
.visual-concept-figure a { display: grid; gap: .35rem; color: inherit; text-decoration: none; }
.visual-concept-figure img { display: block; width: 100%; max-height: 15rem; object-fit: contain; border: 1px solid #555; background: var(--visual-white); }
.visual-concept-figure a:hover img, .visual-concept-figure a:focus-visible img { border-color: var(--visual-red); }
.visual-concept-figure figcaption { color: #aaa; font-size: .68rem; line-height: 1.4; }

.visual-concept-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-concept-fallback summary { cursor: pointer; font-weight: 800; }
.visual-concept-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-concept-fallback ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-concept-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-concept-fallback li strong { font-size: .85rem; }
.visual-concept-fallback li span { color: var(--visual-muted); font-size: .78rem; }
.visual-concept-fallback li em { color: var(--visual-red); font-size: .72rem; font-style: normal; line-height: 1.4; }

.visual-action-boundary-workspace { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr); gap: 1px; background: var(--visual-dark-line); }
.visual-action-boundary-graph { position: relative; min-height: 27rem; padding: 1.2rem; overflow: hidden; background: var(--visual-white); }
.visual-action-boundary-center { position: absolute; z-index: 2; top: 1.2rem; left: 50%; display: grid; gap: .25rem; width: min(16rem, 76%); padding: .65rem .85rem; border: 2px solid var(--visual-ink); color: var(--visual-white); background: var(--visual-ink); text-align: center; transform: translateX(-50%); }
.visual-action-boundary-center span { color: var(--visual-red); font-size: .8rem; font-weight: 800; line-height: 1.1; }
.visual-action-boundary-center small { color: #ddd; font-size: .67rem; line-height: 1.25; }
.visual-action-boundary-nodes { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .65rem; align-items: stretch; min-height: 24.5rem; margin: 0; padding: 4.5rem 0 .5rem; list-style: none; }
.visual-action-boundary-nodes li { position: relative; display: flex; min-width: 0; }
.visual-action-boundary-nodes li:not(:last-child)::after { position: absolute; z-index: 2; top: 50%; right: -.55rem; color: var(--visual-red); content: '→'; font-size: 1.25rem; font-weight: 800; transform: translateY(-50%); }
.visual-action-boundary-node { display: grid; align-content: space-between; width: 100%; min-height: 11rem; padding: .8rem; border: 1px solid var(--visual-ink); color: var(--visual-ink); background: rgba(255, 255, 255, .94); text-align: left; cursor: pointer; }
.visual-action-boundary-node:hover,
.visual-action-boundary-node:focus-visible,
.visual-action-boundary-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }
.visual-action-boundary-node span { color: var(--visual-red); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.visual-action-boundary-node strong { font-size: .92rem; line-height: 1.08; }
.visual-action-boundary-detail { display: grid; align-content: center; gap: .7rem; min-height: 27rem; padding: 2rem; color: var(--visual-white); background: var(--visual-ink); }
.visual-action-boundary-detail h3 { max-width: 14ch; margin: 0; color: var(--visual-white); font-size: clamp(1.7rem, 3vw, 2.8rem); line-height: .98; letter-spacing: -.05em; }
.visual-action-boundary-detail p { margin: 0; color: #d7d7d2; font-size: .86rem; line-height: 1.55; }
.visual-action-boundary-detail .visual-detail-label { color: #ff526f; }
.visual-action-boundary-next { display: grid; gap: .2rem; margin-top: .5rem !important; padding-top: .75rem; border-top: 1px solid #555; }
.visual-action-boundary-next span { color: #aaa; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-action-boundary-next strong { color: var(--visual-white); font-size: .9rem; }
.visual-action-boundary-detail .visual-action-link { color: #ff526f; }
.visual-action-boundary-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-action-boundary-fallback summary { cursor: pointer; font-weight: 800; }
.visual-action-boundary-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-action-boundary-fallback ol { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-action-boundary-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-action-boundary-fallback li strong { font-size: .82rem; }
.visual-action-boundary-fallback li span { color: var(--visual-muted); font-size: .76rem; }
.visual-action-boundary-fallback li em { color: var(--visual-red); font-size: .72rem; font-style: normal; line-height: 1.4; }
.visual-action-boundary-fallback li a { font-size: .75rem; }
.visual-action-boundary-figure { display: grid; grid-template-columns: minmax(180px, .4fr) minmax(0, 1fr); gap: 1rem; align-items: center; margin: 1px 0 0; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-action-boundary-figure a { display: grid; gap: .5rem; color: inherit; text-decoration: none; }
.visual-action-boundary-figure img { display: block; width: 100%; max-height: 18rem; object-fit: contain; border: 1px solid var(--visual-line); background: var(--visual-paper); }
.visual-action-boundary-figure a:hover img, .visual-action-boundary-figure a:focus-visible img { border-color: var(--visual-red); }
.visual-action-boundary-figure figcaption { color: var(--visual-muted); font-size: .8rem; line-height: 1.5; }

.visual-journey-graph { position: relative; min-height: 27rem; padding: 1.2rem; overflow: hidden; background: var(--visual-white); }
.visual-journey-graph::before,
.visual-journey-graph::after { position: absolute; z-index: 0; background: var(--visual-line); content: ''; }
.visual-journey-graph::before { top: 50%; right: 1.2rem; left: 1.2rem; height: 1px; }
.visual-journey-graph::after { top: 1.2rem; bottom: 1.2rem; left: 50%; width: 1px; }
.visual-journey-center {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: grid;
  width: min(10rem, 28%);
  aspect-ratio: 1;
  align-content: center;
  gap: .35rem;
  padding: .8rem;
  border: 3px solid var(--visual-ink);
  color: var(--visual-white);
  background: var(--visual-ink);
  text-align: center;
  pointer-events: none;
  transform: translate(-50%, -50%);
}
.visual-journey-center span { color: var(--visual-red); font-size: .82rem; font-weight: 800; line-height: 1.1; }
.visual-journey-center small { color: #ddd; font-size: .68rem; line-height: 1.25; }
.visual-journey-nodes { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 1rem; min-height: 24.5rem; margin: 0; padding: 0; list-style: none; }
.visual-journey-node { display: grid; align-content: space-between; min-height: 8rem; padding: .85rem; border: 1px solid var(--visual-ink); color: var(--visual-ink); background: rgba(255, 255, 255, .94); text-align: left; cursor: pointer; }
.visual-journey-node:hover, .visual-journey-node:focus-visible, .visual-journey-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }
.visual-journey-node span { color: var(--visual-red); font-size: .68rem; font-weight: 800; letter-spacing: .12em; }
.visual-journey-node strong { font-size: .98rem; line-height: 1.1; }
.visual-journey-detail { display: grid; align-content: start; gap: .7rem; min-height: 27rem; padding: 1.5rem; color: var(--visual-white); background: var(--visual-ink); }
.visual-journey-detail h3 { max-width: 15ch; margin: 0; color: var(--visual-white); font-size: clamp(1.55rem, 2.8vw, 2.4rem); line-height: .98; letter-spacing: -.05em; }
.visual-journey-detail p { margin: 0; color: #d7d7d2; font-size: .84rem; line-height: 1.5; }
.visual-journey-detail .visual-detail-label { color: #ff526f; }
.visual-journey-next { display: grid; gap: .2rem; margin-top: .35rem !important; padding-top: .7rem; border-top: 1px solid #555; }
.visual-journey-next span { color: #aaa; font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-journey-next strong { color: var(--visual-white); font-size: .86rem; }
.visual-journey-figure { display: grid; gap: .45rem; margin: .2rem 0 0; }
.visual-journey-figure a { display: grid; gap: .35rem; color: inherit; text-decoration: none; }
.visual-journey-figure img { display: block; width: 100%; max-height: 17rem; object-fit: contain; border: 1px solid #555; background: var(--visual-white); }
.visual-journey-figure figcaption { color: #aaa; font-size: .68rem; line-height: 1.4; }
.visual-journey-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-journey-fallback summary { cursor: pointer; font-weight: 800; }
.visual-journey-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-journey-fallback ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-journey-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-journey-fallback li strong { font-size: .82rem; }
.visual-journey-fallback li span { color: var(--visual-muted); font-size: .76rem; }

.visual-capability-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
  gap: 1px;
  background: var(--visual-dark-line);
}

.visual-capability-graph {
  position: relative;
  min-height: 36rem;
  padding: 1.2rem;
  overflow: hidden;
  background: var(--visual-white);
}

.visual-capability-graph::before {
  position: absolute;
  z-index: 0;
  top: 3.5rem;
  bottom: 1.2rem;
  left: 2.3rem;
  width: 2px;
  background: var(--visual-line);
  content: '';
}

.visual-capability-center {
  position: relative;
  z-index: 2;
  display: grid;
  gap: .25rem;
  width: min(18rem, 100%);
  margin-bottom: .8rem;
  padding: .65rem .85rem;
  border: 2px solid var(--visual-ink);
  color: var(--visual-white);
  background: var(--visual-ink);
}

.visual-capability-center span { color: var(--visual-red); font-size: .8rem; font-weight: 800; line-height: 1.1; }
.visual-capability-center small { color: #ddd; font-size: .67rem; line-height: 1.25; }

.visual-capability-nodes {
  position: relative;
  z-index: 1;
  display: grid;
  gap: .55rem;
  margin: 0;
  padding: 0 0 0 1rem;
  list-style: none;
}

.visual-capability-nodes li { position: relative; display: flex; min-width: 0; }
.visual-capability-nodes li:not(:last-child)::after { position: absolute; bottom: -.55rem; left: .8rem; color: var(--visual-red); content: '↓'; font-size: 1rem; font-weight: 800; }

.visual-capability-node {
  display: flex;
  align-items: center;
  gap: .8rem;
  width: 100%;
  min-height: 3.35rem;
  padding: .7rem .85rem;
  border: 1px solid var(--visual-ink);
  color: var(--visual-ink);
  background: rgba(255, 255, 255, .96);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.visual-capability-node:hover,
.visual-capability-node:focus-visible,
.visual-capability-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }
.visual-capability-node span { min-width: 2.1rem; color: var(--visual-red); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.visual-capability-node strong { font-size: .96rem; line-height: 1.08; }

.visual-capability-detail {
  display: grid;
  align-content: start;
  gap: .7rem;
  min-height: 36rem;
  padding: 1.5rem;
  color: var(--visual-white);
  background: var(--visual-ink);
}

.visual-capability-detail h3 { max-width: 14ch; margin: 0; color: var(--visual-white); font-size: clamp(1.55rem, 2.8vw, 2.4rem); line-height: .98; letter-spacing: -.05em; }
.visual-capability-detail p { margin: 0; color: #d7d7d2; font-size: .84rem; line-height: 1.5; }
.visual-capability-detail .visual-detail-label { color: #ff526f; }
.visual-capability-stats { color: #ff526f !important; font-family: Consolas, 'Courier New', monospace; font-size: .72rem !important; letter-spacing: .04em; }
.visual-capability-next { display: grid; gap: .2rem; margin-top: .35rem !important; padding-top: .7rem; border-top: 1px solid #555; }
.visual-capability-next span { color: #aaa; font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-capability-next strong { color: var(--visual-white); font-size: .86rem; }
.visual-capability-detail .visual-action-link { color: #ff526f; }
.visual-capability-figure { display: grid; gap: .45rem; margin: .2rem 0 0; }
.visual-capability-figure a { display: grid; gap: .35rem; color: inherit; text-decoration: none; }
.visual-capability-figure img { display: block; width: 100%; max-height: 20rem; object-fit: contain; border: 1px solid #555; background: var(--visual-white); }
.visual-capability-figure a:hover img, .visual-capability-figure a:focus-visible img { border-color: var(--visual-red); }
.visual-capability-figure figcaption { color: #aaa; font-size: .68rem; line-height: 1.4; }

.visual-capability-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-capability-fallback summary { cursor: pointer; font-weight: 800; }
.visual-capability-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-capability-fallback ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-capability-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-capability-fallback li strong { font-size: .82rem; }
.visual-capability-fallback li span { color: var(--visual-muted); font-size: .76rem; }
.visual-capability-fallback li a { font-size: .75rem; }

.visual-maturity-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
  gap: 1px;
  background: var(--visual-dark-line);
}

.visual-maturity-graph {
  position: relative;
  min-height: 34rem;
  padding: 1.2rem;
  overflow: hidden;
  background: var(--visual-white);
}

.visual-maturity-graph::before {
  position: absolute;
  z-index: 0;
  top: 4.2rem;
  bottom: 1.2rem;
  left: 2.3rem;
  width: 2px;
  background: var(--visual-line);
  content: '';
}

.visual-maturity-center {
  position: relative;
  z-index: 2;
  display: grid;
  gap: .25rem;
  width: min(18rem, 100%);
  margin-bottom: .8rem;
  padding: .65rem .85rem;
  border: 2px solid var(--visual-ink);
  color: var(--visual-white);
  background: var(--visual-ink);
}

.visual-maturity-center span { color: var(--visual-red); font-size: .8rem; font-weight: 800; line-height: 1.1; }
.visual-maturity-center small { color: #ddd; font-size: .67rem; line-height: 1.25; }

.visual-maturity-nodes {
  position: relative;
  z-index: 1;
  display: grid;
  gap: .55rem;
  margin: 0;
  padding: 0 0 0 1rem;
  list-style: none;
}

.visual-maturity-nodes li { position: relative; display: flex; min-width: 0; }
.visual-maturity-nodes li:not(:last-child)::after { position: absolute; bottom: -.55rem; left: .8rem; color: var(--visual-red); content: '↓'; font-size: 1rem; font-weight: 800; }

.visual-maturity-node {
  display: flex;
  align-items: center;
  gap: .8rem;
  width: 100%;
  min-height: 3.45rem;
  padding: .7rem .85rem;
  border: 1px solid var(--visual-ink);
  color: var(--visual-ink);
  background: rgba(255, 255, 255, .96);
  text-align: left;
  cursor: pointer;
}

.visual-maturity-node:hover,
.visual-maturity-node:focus-visible,
.visual-maturity-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }
.visual-maturity-node span { min-width: 2.1rem; color: var(--visual-red); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.visual-maturity-node strong { font-size: .94rem; line-height: 1.08; }

.visual-maturity-detail {
  display: grid;
  align-content: start;
  gap: .7rem;
  min-height: 34rem;
  padding: 1.5rem;
  color: var(--visual-white);
  background: var(--visual-ink);
}

.visual-maturity-detail h3 { max-width: 15ch; margin: 0; color: var(--visual-white); font-size: clamp(1.55rem, 2.8vw, 2.4rem); line-height: .98; letter-spacing: -.05em; }
.visual-maturity-detail p { margin: 0; color: #d7d7d2; font-size: .84rem; line-height: 1.5; }
.visual-maturity-detail .visual-detail-label { color: #ff526f; }
.visual-maturity-support,
.visual-maturity-limit,
.visual-maturity-next { display: grid; gap: .2rem; margin-top: .35rem !important; padding-top: .7rem; border-top: 1px solid #555; }
.visual-maturity-support span,
.visual-maturity-limit span,
.visual-maturity-next span { color: #aaa; font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-maturity-support strong,
.visual-maturity-limit strong,
.visual-maturity-next strong { color: var(--visual-white); font-size: .86rem; font-weight: 400; }
.visual-maturity-support strong { color: #ff526f; }
.visual-maturity-detail .visual-action-link { color: #ff526f; }

.visual-maturity-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-maturity-fallback summary { cursor: pointer; font-weight: 800; }
.visual-maturity-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-maturity-fallback ol { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-maturity-fallback li { display: grid; gap: .35rem; min-width: 0; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-maturity-fallback li strong { font-size: .82rem; }
.visual-maturity-fallback li span,
.visual-maturity-fallback li small { color: var(--visual-muted); font-size: .76rem; line-height: 1.4; }
.visual-maturity-fallback li small { display: block; }
.visual-maturity-fallback li em { color: var(--visual-red); font-size: .72rem; font-style: normal; line-height: 1.4; }
.visual-maturity-fallback li a { font-size: .75rem; }

.visual-maturity-figure { display: grid; grid-template-columns: minmax(180px, .4fr) minmax(0, 1fr); gap: 1rem; align-items: center; margin: 1px 0 0; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-maturity-figure a { display: grid; gap: .5rem; color: inherit; text-decoration: none; }
.visual-maturity-figure img { display: block; width: 100%; max-height: 18rem; object-fit: contain; border: 1px solid var(--visual-line); background: var(--visual-paper); }
.visual-maturity-figure a:hover img, .visual-maturity-figure a:focus-visible img { border-color: var(--visual-red); }
.visual-maturity-figure figcaption { color: var(--visual-muted); font-size: .8rem; line-height: 1.5; }

.visual-goal-graph { position: relative; min-height: 27rem; padding: 1.2rem; overflow: hidden; background: var(--visual-white); }
.visual-goal-graph::before,
.visual-goal-graph::after { position: absolute; z-index: 0; background: var(--visual-line); content: ''; }
.visual-goal-graph::before { top: 50%; right: 1.2rem; left: 1.2rem; height: 1px; }
.visual-goal-graph::after { top: 1.2rem; bottom: 1.2rem; left: 50%; width: 1px; }
.visual-goal-center {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: grid;
  width: min(11rem, 30%);
  aspect-ratio: 1;
  align-content: center;
  gap: .35rem;
  padding: .8rem;
  border: 3px solid var(--visual-ink);
  color: var(--visual-white);
  background: var(--visual-ink);
  text-align: center;
  transform: translate(-50%, -50%);
}
.visual-goal-center span { color: var(--visual-red); font-size: .82rem; font-weight: 800; line-height: 1.1; }
.visual-goal-center small { color: #ddd; font-size: .68rem; line-height: 1.25; }
.visual-goal-nodes { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 1rem; min-height: 24.5rem; margin: 0; padding: 0; list-style: none; }
.visual-goal-node { display: grid; align-content: space-between; min-height: 8rem; padding: .85rem; border: 1px solid var(--visual-ink); color: var(--visual-ink); background: rgba(255, 255, 255, .94); text-align: left; cursor: pointer; }
.visual-goal-node:hover, .visual-goal-node:focus-visible, .visual-goal-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }
.visual-goal-node span { color: var(--visual-red); font-size: .68rem; font-weight: 800; letter-spacing: .12em; }
.visual-goal-node strong { font-size: .98rem; line-height: 1.1; }
.visual-goal-detail { display: grid; align-content: start; gap: .7rem; min-height: 27rem; padding: 1.5rem; color: var(--visual-white); background: var(--visual-ink); }
.visual-goal-detail h3 { max-width: 15ch; margin: 0; color: var(--visual-white); font-size: clamp(1.55rem, 2.8vw, 2.4rem); line-height: .98; letter-spacing: -.05em; }
.visual-goal-detail p { margin: 0; color: #d7d7d2; font-size: .84rem; line-height: 1.5; }
.visual-goal-detail .visual-detail-label { color: #ff526f; }
.visual-goal-next { display: grid; gap: .2rem; margin-top: .35rem !important; padding-top: .7rem; border-top: 1px solid #555; }
.visual-goal-next span { color: #aaa; font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-goal-next strong { color: var(--visual-white); font-size: .86rem; }
.visual-goal-figure { display: grid; gap: .45rem; margin: .2rem 0 0; }
.visual-goal-figure a { display: grid; gap: .35rem; color: inherit; text-decoration: none; }
.visual-goal-figure img { display: block; width: 100%; max-height: 17rem; object-fit: contain; border: 1px solid #555; background: var(--visual-white); }
.visual-goal-figure figcaption { color: #aaa; font-size: .68rem; line-height: 1.4; }
.visual-goal-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-goal-fallback summary { cursor: pointer; font-weight: 800; }
.visual-goal-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-goal-fallback ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-goal-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-goal-fallback li strong { font-size: .82rem; }
.visual-goal-fallback li span { color: var(--visual-muted); font-size: .76rem; }

.visual-triage-workspace { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr); gap: 1px; background: var(--visual-dark-line); }
.visual-triage-graph { position: relative; min-height: 27rem; padding: 1.2rem; overflow: hidden; background: var(--visual-white); }
.visual-triage-graph::before,
.visual-triage-graph::after { position: absolute; z-index: 0; background: var(--visual-line); content: ''; }
.visual-triage-graph::before { top: 50%; right: 1.2rem; left: 1.2rem; height: 1px; }
.visual-triage-graph::after { top: 1.2rem; bottom: 1.2rem; left: 50%; width: 1px; }
.visual-triage-center { position: absolute; z-index: 2; top: 50%; left: 50%; display: grid; width: min(9.5rem, 27%); aspect-ratio: 1; align-content: center; gap: .35rem; padding: .8rem; border: 3px solid var(--visual-ink); color: var(--visual-white); background: var(--visual-ink); text-align: center; pointer-events: none; transform: translate(-50%, -50%); }
.visual-triage-center span { color: var(--visual-red); font-size: .8rem; font-weight: 800; line-height: 1.1; }
.visual-triage-center small { color: #ddd; font-size: .67rem; line-height: 1.25; }
.visual-triage-nodes { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: .85rem; min-height: 24.5rem; margin: 0; padding: 0; list-style: none; }
.visual-triage-node { display: grid; align-content: space-between; min-height: 8rem; padding: .85rem; border: 1px solid var(--visual-ink); color: var(--visual-ink); background: rgba(255, 255, 255, .94); text-align: left; cursor: pointer; }
.visual-triage-node:hover, .visual-triage-node:focus-visible, .visual-triage-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }
.visual-triage-node span { color: var(--visual-red); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.visual-triage-node strong { font-size: .96rem; line-height: 1.08; }
.visual-triage-detail { display: grid; align-content: center; gap: .7rem; min-height: 27rem; padding: 2rem; color: var(--visual-white); background: var(--visual-ink); }
.visual-triage-detail h3 { max-width: 14ch; margin: 0; color: var(--visual-white); font-size: clamp(1.7rem, 3vw, 2.8rem); line-height: .98; letter-spacing: -.05em; }
.visual-triage-detail p { margin: 0; color: #d7d7d2; font-size: .86rem; line-height: 1.55; }
.visual-triage-detail .visual-detail-label { color: #ff526f; }
.visual-triage-next { display: grid; gap: .2rem; margin-top: .5rem !important; padding-top: .75rem; border-top: 1px solid #555; }
.visual-triage-next span { color: #aaa; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-triage-next strong { color: var(--visual-white); font-size: .9rem; }
.visual-triage-detail .visual-action-link { color: #ff526f; }
.visual-triage-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-triage-fallback summary { cursor: pointer; font-weight: 800; }
.visual-triage-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-triage-fallback ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-triage-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-triage-fallback li strong { font-size: .85rem; }
.visual-triage-fallback li span { color: var(--visual-muted); font-size: .78rem; }
.visual-triage-fallback li em { color: var(--visual-red); font-size: .72rem; font-style: normal; line-height: 1.4; }
.visual-triage-figure { display: grid; grid-template-columns: minmax(180px, .4fr) minmax(0, 1fr); gap: 1rem; align-items: center; margin: 1px 0 0; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-triage-figure a { display: grid; gap: .5rem; color: inherit; text-decoration: none; }
.visual-triage-figure img { display: block; width: 100%; max-height: 18rem; object-fit: contain; border: 1px solid var(--visual-line); background: var(--visual-paper); }
.visual-triage-figure a:hover img, .visual-triage-figure a:focus-visible img { border-color: var(--visual-red); }
.visual-triage-figure figcaption { color: var(--visual-muted); font-size: .8rem; line-height: 1.5; }

.visual-map-graph { position: relative; min-height: 25rem; padding: 1.2rem; overflow: hidden; background: var(--visual-white); }

.visual-map-graph::before,
.visual-map-graph::after { position: absolute; z-index: 0; background: var(--visual-line); content: ''; }

.visual-map-graph::before { top: 50%; right: 1.2rem; left: 1.2rem; height: 1px; }
.visual-map-graph::after { top: 1.2rem; bottom: 1.2rem; left: 50%; width: 1px; }

.visual-map-center {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: grid;
  width: min(10rem, 28%);
  aspect-ratio: 1;
  align-content: center;
  gap: .35rem;
  padding: .8rem;
  border: 3px solid var(--visual-ink);
  color: var(--visual-white);
  background: var(--visual-ink);
  text-align: center;
  transform: translate(-50%, -50%);
}

.visual-map-center span { color: var(--visual-red); font-size: .82rem; font-weight: 800; line-height: 1.1; }
.visual-map-center small { color: #ddd; font-size: .68rem; line-height: 1.25; }

.visual-map-nodes {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  min-height: 22.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.visual-map-node {
  display: grid;
  align-content: space-between;
  min-height: 7rem;
  padding: .85rem;
  border: 1px solid var(--visual-ink);
  color: var(--visual-ink);
  background: rgba(255, 255, 255, .94);
  text-align: left;
  cursor: pointer;
}

.visual-map-node:hover,
.visual-map-node:focus-visible,
.visual-map-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }

.visual-map-node span { color: var(--visual-red); font-size: .68rem; font-weight: 800; letter-spacing: .12em; }
.visual-map-node strong { font-size: 1.05rem; line-height: 1.05; }

.visual-map-detail { display: grid; align-content: center; gap: .7rem; min-height: 25rem; padding: 2rem; color: var(--visual-white); background: var(--visual-ink); }
.visual-map-detail h3 { max-width: 14ch; margin: 0; color: var(--visual-white); font-size: clamp(1.7rem, 3vw, 2.8rem); line-height: .98; letter-spacing: -.05em; }
.visual-map-detail p { margin: 0; color: #d7d7d2; font-size: .86rem; line-height: 1.55; }
.visual-map-detail .visual-detail-label { color: #ff526f; }
.visual-map-next { display: grid; gap: .2rem; margin-top: .5rem !important; padding-top: .75rem; border-top: 1px solid #555; }
.visual-map-next span { color: #aaa; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-map-next strong { color: var(--visual-white); font-size: .9rem; }

.visual-action-link { display: inline-flex; gap: .55rem; align-items: center; width: fit-content; margin-top: .4rem; color: var(--visual-red); font-size: .8rem; font-weight: 800; text-decoration: underline; text-underline-offset: .22rem; }
.visual-map-detail .visual-action-link { color: #ff526f; }

.visual-map-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-map-fallback summary { cursor: pointer; font-weight: 800; }
.visual-map-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-map-fallback ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-map-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-map-fallback li strong { font-size: .85rem; }
.visual-map-fallback li span { color: var(--visual-muted); font-size: .78rem; }

.visual-evidence-workspace { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr); gap: 1px; background: var(--visual-dark-line); }
.visual-evidence-graph { position: relative; min-height: 27rem; padding: 1.2rem; overflow: hidden; background: var(--visual-white); }
.visual-evidence-graph::before,
.visual-evidence-graph::after { position: absolute; z-index: 0; background: var(--visual-line); content: ''; }
.visual-evidence-graph::before { top: 50%; right: 1.2rem; left: 1.2rem; height: 1px; }
.visual-evidence-graph::after { top: 1.2rem; bottom: 1.2rem; left: 50%; width: 1px; }
.visual-evidence-center { position: absolute; z-index: 2; top: 50%; left: 50%; display: grid; width: min(9.5rem, 27%); aspect-ratio: 1; align-content: center; gap: .35rem; padding: .8rem; border: 3px solid var(--visual-ink); color: var(--visual-white); background: var(--visual-ink); text-align: center; transform: translate(-50%, -50%); }
.visual-evidence-center span { color: var(--visual-red); font-size: .8rem; font-weight: 800; line-height: 1.1; }
.visual-evidence-center small { color: #ddd; font-size: .67rem; line-height: 1.25; }
.visual-evidence-nodes { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(0, 1fr)); gap: .85rem; min-height: 24.5rem; margin: 0; padding: 0; list-style: none; }
.visual-evidence-nodes li:nth-child(1) { grid-area: 1 / 1; }
.visual-evidence-nodes li:nth-child(2) { grid-area: 1 / 3; }
.visual-evidence-nodes li:nth-child(3) { grid-area: 3 / 1; }
.visual-evidence-nodes li:nth-child(4) { grid-area: 3 / 3; }
.visual-evidence-nodes li:nth-child(5) { grid-area: 3 / 2; }
.visual-evidence-node { display: grid; align-content: space-between; min-height: 6rem; padding: .8rem; border: 1px solid var(--visual-ink); color: var(--visual-ink); background: rgba(255, 255, 255, .94); text-align: left; cursor: pointer; }
.visual-evidence-node:hover,
.visual-evidence-node:focus-visible,
.visual-evidence-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }
.visual-evidence-node span { color: var(--visual-red); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.visual-evidence-node strong { font-size: .98rem; line-height: 1.05; }
.visual-evidence-detail { display: grid; align-content: center; gap: .7rem; min-height: 27rem; padding: 2rem; color: var(--visual-white); background: var(--visual-ink); }
.visual-evidence-detail h3 { max-width: 14ch; margin: 0; color: var(--visual-white); font-size: clamp(1.7rem, 3vw, 2.8rem); line-height: .98; letter-spacing: -.05em; }
.visual-evidence-detail p { margin: 0; color: #d7d7d2; font-size: .86rem; line-height: 1.55; }
.visual-evidence-detail .visual-detail-label { color: #ff526f; }
.visual-evidence-next { display: grid; gap: .2rem; margin-top: .5rem !important; padding-top: .75rem; border-top: 1px solid #555; }
.visual-evidence-next span { color: #aaa; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-evidence-next strong { color: var(--visual-white); font-size: .9rem; }
.visual-evidence-detail .visual-action-link { color: #ff526f; }
.visual-evidence-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-evidence-fallback summary { cursor: pointer; font-weight: 800; }
.visual-evidence-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-evidence-fallback ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-evidence-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-evidence-fallback li strong { font-size: .85rem; }
.visual-evidence-fallback li span { color: var(--visual-muted); font-size: .78rem; }
.visual-evidence-fallback li em { color: var(--visual-red); font-size: .72rem; font-style: normal; line-height: 1.4; }
.visual-evidence-figure { display: grid; grid-template-columns: minmax(180px, .4fr) minmax(0, 1fr); gap: 1rem; align-items: center; margin: 1px 0 0; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-evidence-figure a { display: grid; gap: .5rem; color: inherit; text-decoration: none; }
.visual-evidence-figure img { display: block; width: 100%; max-height: 18rem; object-fit: contain; border: 1px solid var(--visual-line); background: var(--visual-paper); }
.visual-evidence-figure a:hover img, .visual-evidence-figure a:focus-visible img { border-color: var(--visual-red); }
.visual-evidence-figure figcaption { color: var(--visual-muted); font-size: .8rem; line-height: 1.5; }

.visual-reading-loop-workspace { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr); gap: 1px; background: var(--visual-dark-line); }
.visual-reading-loop-graph { position: relative; min-height: 27rem; padding: 1.2rem; overflow: hidden; background: var(--visual-white); }
.visual-reading-loop-graph::before,
.visual-reading-loop-graph::after { position: absolute; z-index: 0; background: var(--visual-line); content: ''; }
.visual-reading-loop-graph::before { top: 50%; right: 1.2rem; left: 1.2rem; height: 1px; }
.visual-reading-loop-graph::after { top: 1.2rem; bottom: 1.2rem; left: 50%; width: 1px; }
.visual-reading-loop-center { position: absolute; z-index: 2; top: 50%; left: 50%; display: grid; width: min(9.5rem, 27%); aspect-ratio: 1; align-content: center; gap: .35rem; padding: .8rem; border: 3px solid var(--visual-ink); color: var(--visual-white); background: var(--visual-ink); text-align: center; transform: translate(-50%, -50%); }
.visual-reading-loop-center span { color: var(--visual-red); font-size: .8rem; font-weight: 800; line-height: 1.1; }
.visual-reading-loop-center small { color: #ddd; font-size: .67rem; line-height: 1.25; }
.visual-reading-loop-nodes { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(0, 1fr)); gap: .85rem; min-height: 24.5rem; margin: 0; padding: 0; list-style: none; }
.visual-reading-loop-nodes li:nth-child(1) { grid-area: 1 / 1; }
.visual-reading-loop-nodes li:nth-child(2) { grid-area: 1 / 3; }
.visual-reading-loop-nodes li:nth-child(3) { grid-area: 2 / 1; }
.visual-reading-loop-nodes li:nth-child(4) { grid-area: 2 / 3; }
.visual-reading-loop-nodes li:nth-child(5) { grid-area: 3 / 1; }
.visual-reading-loop-nodes li:nth-child(6) { grid-area: 3 / 3; }
.visual-reading-loop-node { display: grid; align-content: space-between; min-height: 6rem; padding: .8rem; border: 1px solid var(--visual-ink); color: var(--visual-ink); background: rgba(255, 255, 255, .94); text-align: left; cursor: pointer; }
.visual-reading-loop-node:hover,
.visual-reading-loop-node:focus-visible,
.visual-reading-loop-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }
.visual-reading-loop-node span { color: var(--visual-red); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.visual-reading-loop-node strong { font-size: .96rem; line-height: 1.05; }
.visual-reading-loop-detail { display: grid; align-content: center; gap: .7rem; min-height: 27rem; padding: 2rem; color: var(--visual-white); background: var(--visual-ink); }
.visual-reading-loop-detail h3 { max-width: 14ch; margin: 0; color: var(--visual-white); font-size: clamp(1.7rem, 3vw, 2.8rem); line-height: .98; letter-spacing: -.05em; }
.visual-reading-loop-detail p { margin: 0; color: #d7d7d2; font-size: .86rem; line-height: 1.55; }
.visual-reading-loop-detail .visual-detail-label { color: #ff526f; }
.visual-reading-loop-next { display: grid; gap: .2rem; margin-top: .5rem !important; padding-top: .75rem; border-top: 1px solid #555; }
.visual-reading-loop-next span { color: #aaa; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-reading-loop-next strong { color: var(--visual-white); font-size: .9rem; }
.visual-reading-loop-detail .visual-action-link { color: #ff526f; }
.visual-reading-loop-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-reading-loop-fallback summary { cursor: pointer; font-weight: 800; }
.visual-reading-loop-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-reading-loop-fallback ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-reading-loop-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-reading-loop-fallback li strong { font-size: .85rem; }
.visual-reading-loop-fallback li span { color: var(--visual-muted); font-size: .78rem; }
.visual-reading-loop-fallback li em { color: var(--visual-red); font-size: .72rem; font-style: normal; line-height: 1.4; }
.visual-reading-loop-figure { display: grid; grid-template-columns: minmax(180px, .4fr) minmax(0, 1fr); gap: 1rem; align-items: center; margin: 1px 0 0; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-reading-loop-figure a { display: grid; gap: .5rem; color: inherit; text-decoration: none; }
.visual-reading-loop-figure img { display: block; width: 100%; max-height: 18rem; object-fit: contain; border: 1px solid var(--visual-line); background: var(--visual-paper); }
.visual-reading-loop-figure a:hover img, .visual-reading-loop-figure a:focus-visible img { border-color: var(--visual-red); }
.visual-reading-loop-figure figcaption { color: var(--visual-muted); font-size: .8rem; line-height: 1.5; }

.visual-receipt-workspace { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr); gap: 1px; background: var(--visual-dark-line); }
.visual-receipt-graph { position: relative; min-height: 27rem; padding: 1.2rem; overflow: hidden; background: var(--visual-white); }
.visual-receipt-graph::before { position: absolute; z-index: 0; top: 1.2rem; bottom: 1.2rem; left: 50%; width: 1px; background: var(--visual-line); content: ''; }
.visual-receipt-center { position: absolute; z-index: 2; top: 50%; left: 50%; display: grid; width: min(9.5rem, 27%); aspect-ratio: 1; align-content: center; gap: .35rem; padding: .8rem; border: 3px solid var(--visual-ink); color: var(--visual-white); background: var(--visual-ink); text-align: center; transform: translate(-50%, -50%); }
.visual-receipt-center span { color: var(--visual-red); font-size: .8rem; font-weight: 800; line-height: 1.1; }
.visual-receipt-center small { color: #ddd; font-size: .67rem; line-height: 1.25; }
.visual-receipt-nodes { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(0, 1fr)); gap: .85rem; min-height: 24.5rem; margin: 0; padding: 0; list-style: none; }
.visual-receipt-nodes li:nth-child(1) { grid-area: 1 / 1; }
.visual-receipt-nodes li:nth-child(2) { grid-area: 1 / 2; }
.visual-receipt-nodes li:nth-child(3) { grid-area: 2 / 1; }
.visual-receipt-nodes li:nth-child(4) { grid-area: 2 / 2; }
.visual-receipt-nodes li:nth-child(5) { grid-area: 3 / 1 / 4 / 3; justify-self: center; width: min(100%, 18rem); }
.visual-receipt-node { display: grid; align-content: space-between; min-height: 6rem; padding: .8rem; border: 1px solid var(--visual-ink); color: var(--visual-ink); background: rgba(255, 255, 255, .94); text-align: left; cursor: pointer; }
.visual-receipt-node:hover,
.visual-receipt-node:focus-visible,
.visual-receipt-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }
.visual-receipt-node span { color: var(--visual-red); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.visual-receipt-node strong { font-size: .96rem; line-height: 1.05; }
.visual-receipt-detail { display: grid; align-content: center; gap: .7rem; min-height: 27rem; padding: 2rem; color: var(--visual-white); background: var(--visual-ink); }
.visual-receipt-detail h3 { max-width: 14ch; margin: 0; color: var(--visual-white); font-size: clamp(1.7rem, 3vw, 2.8rem); line-height: .98; letter-spacing: -.05em; }
.visual-receipt-detail p { margin: 0; color: #d7d7d2; font-size: .86rem; line-height: 1.55; }
.visual-receipt-detail .visual-detail-label { color: #ff526f; }
.visual-receipt-next { display: grid; gap: .2rem; margin-top: .5rem !important; padding-top: .75rem; border-top: 1px solid #555; }
.visual-receipt-next span { color: #aaa; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-receipt-next strong { color: var(--visual-white); font-size: .9rem; }
.visual-receipt-detail .visual-action-link { color: #ff526f; }
.visual-receipt-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-receipt-fallback summary { cursor: pointer; font-weight: 800; }
.visual-receipt-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-receipt-fallback ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-receipt-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-receipt-fallback li strong { font-size: .85rem; }
.visual-receipt-fallback li span { color: var(--visual-muted); font-size: .78rem; }
.visual-receipt-fallback li em { color: var(--visual-red); font-size: .72rem; font-style: normal; line-height: 1.4; }
.visual-receipt-figure { display: grid; grid-template-columns: minmax(180px, .4fr) minmax(0, 1fr); gap: 1rem; align-items: center; margin: 1px 0 0; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-receipt-figure a { display: grid; gap: .5rem; color: inherit; text-decoration: none; }
.visual-receipt-figure img { display: block; width: 100%; max-height: 18rem; object-fit: contain; border: 1px solid var(--visual-line); background: var(--visual-paper); }
.visual-receipt-figure a:hover img, .visual-receipt-figure a:focus-visible img { border-color: var(--visual-red); }
.visual-receipt-figure figcaption { color: var(--visual-muted); font-size: .8rem; line-height: 1.5; }

.visual-board-explorer { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .92fr); gap: 1px; background: var(--visual-dark-line); }
.visual-board-explorer-graph { position: relative; min-height: 31rem; padding: 1.2rem; overflow: hidden; background: var(--visual-white); }
.visual-board-explorer-graph::before,
.visual-board-explorer-graph::after { position: absolute; z-index: 0; background: var(--visual-line); content: ''; }
.visual-board-explorer-graph::before { top: 50%; right: 1.2rem; left: 1.2rem; height: 1px; }
.visual-board-explorer-graph::after { top: 1.2rem; bottom: 1.2rem; left: 50%; width: 1px; }
.visual-board-explorer-center { position: absolute; z-index: 2; top: 50%; left: 50%; display: grid; width: min(10rem, 28%); aspect-ratio: 1; align-content: center; gap: .3rem; padding: .8rem; border: 3px solid var(--visual-ink); color: var(--visual-white); background: var(--visual-ink); text-align: center; transform: translate(-50%, -50%); }
.visual-board-explorer-center span { color: #ff526f; font-size: .66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.visual-board-explorer-center strong { font-size: .95rem; line-height: 1.1; }
.visual-board-explorer-nodes { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(0, 1fr)); gap: .85rem; min-height: 28.5rem; margin: 0; padding: 0; list-style: none; }
.visual-board-explorer-node { display: grid; align-content: space-between; min-height: 7rem; padding: .8rem; border: 1px solid var(--visual-ink); color: var(--visual-ink); background: rgba(255, 255, 255, .95); text-align: left; cursor: pointer; }
.visual-board-explorer-node:hover,
.visual-board-explorer-node:focus-visible,
.visual-board-explorer-node.is-selected { color: var(--visual-white); background: var(--visual-ink); }
.visual-board-explorer-node span { color: var(--visual-red); font-size: .67rem; font-weight: 800; letter-spacing: .12em; }
.visual-board-explorer-node strong { font-size: .9rem; line-height: 1.1; }
.visual-board-explorer-node small { color: var(--visual-muted); font-size: .68rem; line-height: 1.2; }
.visual-board-explorer-node.is-selected small,
.visual-board-explorer-node:hover small,
.visual-board-explorer-node:focus-visible small { color: #d7d7d2; }
.visual-board-explorer-detail { display: grid; align-content: start; gap: .7rem; min-height: 31rem; padding: 1.6rem; color: var(--visual-white); background: var(--visual-ink); }
.visual-board-explorer-detail h3 { max-width: 18ch; margin: 0; color: var(--visual-white); font-size: clamp(1.5rem, 2.7vw, 2.45rem); line-height: .98; letter-spacing: -.05em; }
.visual-board-explorer-detail .visual-detail-label { color: #ff526f; }
.visual-board-explorer-figure { display: grid; grid-template-columns: minmax(120px, .52fr) minmax(0, 1fr); gap: .75rem; align-items: center; margin: 0; }
.visual-board-explorer-figure a { display: grid; gap: .4rem; color: inherit; text-decoration: none; }
.visual-board-explorer-figure img { display: block; width: 100%; max-height: 12rem; object-fit: contain; border: 1px solid #555; background: var(--visual-paper); }
.visual-board-explorer-figure a:hover img, .visual-board-explorer-figure a:focus-visible img { border-color: var(--visual-red); }
.visual-board-explorer-figure figcaption { color: #d7d7d2; font-size: .78rem; line-height: 1.45; }
.visual-board-explorer-notes { display: grid; gap: 1px; background: #555; }
.visual-board-explorer-notes article { display: grid; grid-template-columns: 2rem 1fr; gap: .2rem .6rem; padding: .65rem .75rem; background: #202020; }
.visual-board-explorer-notes article > span { color: #ff526f; font-size: .66rem; font-weight: 800; }
.visual-board-explorer-notes strong { color: var(--visual-white); font-size: .75rem; }
.visual-board-explorer-notes p { grid-column: 2; margin: 0; color: #d7d7d2; font-size: .76rem; line-height: 1.4; }
.visual-board-explorer-next { display: grid; gap: .15rem; margin: 0; padding-top: .65rem; border-top: 1px solid #555; }
.visual-board-explorer-next span { color: #aaa; font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; }
.visual-board-explorer-next strong { color: var(--visual-white); font-size: .82rem; }
.visual-board-explorer-detail .visual-action-link { color: #ff526f; }
.visual-board-explorer-fallback { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-board-explorer-fallback summary { cursor: pointer; font-weight: 800; }
.visual-board-explorer-fallback > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-board-explorer-fallback ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.visual-board-explorer-fallback li { display: grid; gap: .35rem; padding-top: .75rem; border-top: 2px solid var(--visual-red); }
.visual-board-explorer-fallback li strong { font-size: .85rem; }
.visual-board-explorer-fallback li span { color: var(--visual-muted); font-size: .78rem; line-height: 1.4; }

.visual-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--visual-dark-line); }
.visual-gallery-more { margin-top: 1px; padding: 1rem 1.2rem; background: var(--visual-white); }
.visual-gallery-more summary { cursor: pointer; font-weight: 800; }
.visual-gallery-more > p { max-width: 48rem; color: var(--visual-muted); font-size: .82rem; }
.visual-gallery-more .visual-gallery { margin-top: 1rem; }
.visual-card { display: grid; grid-template-rows: auto auto 1fr auto; gap: .8rem; min-width: 0; padding: 1rem; background: var(--visual-white); }
.visual-card:hover, .visual-card:focus-within { background: #fffafb; }
.visual-card-link { display: grid; gap: .55rem; color: inherit; text-decoration: none; }
.visual-card-link img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: contain; border: 1px solid var(--visual-line); background: var(--visual-paper); }
.visual-locale-note { display: block; margin-top: .1rem; padding-top: .45rem; border-top: 1px solid var(--visual-line); color: var(--visual-muted); font-size: .66rem; line-height: 1.4; }
.visual-locale-note[hidden] { display: none; }
.visual-card-link:hover img, .visual-card-link:focus-visible img { border-color: var(--visual-red); }
.visual-card-stage { color: var(--visual-red); font-size: .65rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.visual-card h3 { margin: 0; font-size: 1.05rem; line-height: 1.12; letter-spacing: -.02em; }
.visual-card p { margin: 0; color: var(--visual-muted); font-size: .8rem; line-height: 1.5; }
.visual-card .visual-action-link { margin-top: .2rem; }

.visual-how-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(260px, 1.05fr); gap: 2rem; align-items: start; }
.visual-how-steps { display: grid; gap: 1px; margin: 0; padding: 0; list-style: none; background: var(--visual-dark-line); }
.visual-how-steps li { display: grid; grid-template-columns: 2.4rem 1fr; gap: .35rem .7rem; padding: 1rem; background: var(--visual-white); }
.visual-how-steps li > span { grid-row: span 2; color: var(--visual-red); font-size: .72rem; font-weight: 800; }
.visual-how-steps strong { font-size: .9rem; }
.visual-how-steps p { margin: 0; color: var(--visual-muted); font-size: .8rem; }
.visual-how-figure { margin: 0; padding: 1rem; background: var(--visual-white); }
.visual-how-figure a { display: grid; gap: .6rem; }
.visual-how-figure img { display: block; width: 100%; max-height: 36rem; object-fit: contain; border: 1px solid var(--visual-line); background: var(--visual-paper); }
.visual-image-link { color: var(--visual-red); font-size: .78rem; font-weight: 800; text-decoration: underline; text-underline-offset: .2rem; }
.visual-how-figure figcaption { margin-top: .8rem; color: var(--visual-muted); font-size: .78rem; line-height: 1.5; }
.visual-how-copy > .visual-action-link { margin-top: 1.2rem; }

.visual-footer { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; width: min(1240px, calc(100% - 3rem)); margin: 0 auto; padding: 2rem 0 3rem; color: var(--visual-muted); font-size: .72rem; }
.visual-footer-site { color: var(--visual-ink); font-weight: 800; text-underline-offset: .2rem; }
.visual-footer-site:hover, .visual-footer-site:focus-visible { color: var(--visual-red); }
.visual-noscript { width: min(1240px, calc(100% - 3rem)); margin: 1rem auto; padding: 1rem; border-left: 4px solid var(--visual-red); background: var(--visual-red-soft); }

@media (max-width: 900px) {
  .visual-header-inner { grid-template-columns: auto 1fr auto; gap: .8rem; }
  .visual-nav { grid-column: 1 / -1; grid-row: 2; padding-bottom: .7rem; }
  .visual-language-label { justify-self: end; }
  .visual-hero { grid-template-columns: 4.5rem minmax(0, 1fr); gap: 1rem; }
  .visual-entry-nav { display: block; }
  .visual-entry-heading { display: grid; grid-template-columns: minmax(0, .85fr) minmax(260px, 1.15fr); gap: 2rem; align-items: end; margin-bottom: 1.5rem; }
  .visual-entry-heading > p { margin: 0; }
  .visual-entry-heading { grid-template-columns: 1fr; gap: .8rem; }
  .visual-entry-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .visual-route-workspace, .visual-goal-workspace, .visual-journey-workspace, .visual-capability-workspace, .visual-maturity-workspace, .visual-concept-workspace, .visual-action-boundary-workspace, .visual-triage-workspace, .visual-map-workspace, .visual-evidence-workspace, .visual-reading-loop-workspace, .visual-receipt-workspace, .visual-board-explorer, .visual-how-grid { grid-template-columns: 1fr; }
  .visual-map-detail, .visual-evidence-detail, .visual-reading-loop-detail, .visual-receipt-detail { min-height: 0; }
  .visual-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .visual-header-inner, .visual-main, .visual-banner, .visual-footer, .visual-noscript { width: min(100% - 1.4rem, 1240px); }
  .visual-header-inner { grid-template-columns: 1fr auto; min-height: 4.2rem; }
  .visual-nav { gap: .7rem; overflow-x: auto; flex-wrap: nowrap; white-space: nowrap; }
  .visual-language-label { display: none; }
  .visual-language { min-width: 8rem; }
  .visual-hero { grid-template-columns: 1fr; gap: .65rem; padding: 1rem 0; }
  /* Keep the first useful choice in view even when a locale needs more lines. */
  .visual-hero-copy { max-width: none; }
  .visual-hero h1 { font-size: clamp(2.35rem, 11vw, 4.2rem); line-height: .9; }
  .visual-hero .visual-lede { line-height: 1.32; }
  .visual-hero .visual-boundary { line-height: 1.3; }
  .visual-hero-index { display: flex; align-items: baseline; gap: .6rem; }
  .visual-hero-index strong { font-size: 2.4rem; }
  .visual-hero h1 { max-width: 12ch; margin: .65rem 0 .75rem; }
  .visual-lede { font-size: .95rem; }
  .visual-boundary { margin-top: .55rem; padding-top: .45rem; font-size: .75rem; }
  .visual-hero-actions { margin-top: .55rem; }
  .visual-entry-nav { padding: .9rem 0 2.5rem; }
  .visual-entry-heading { gap: .35rem; margin-bottom: .4rem; }
  .visual-entry-heading h2 { font-size: 1.9rem; line-height: .92; }
  .visual-entry-heading > p { font-size: .78rem; line-height: 1.35; }
  .visual-entry-list { grid-template-columns: 1fr; }
  .visual-entry-card { min-height: 9.5rem; padding: .85rem; }
  .visual-entry-card:hover, .visual-entry-card:focus-visible { transform: none; }
  .visual-hero-action { min-height: 2.9rem; }
  .visual-route-section, .visual-goal-section, .visual-journey-section, .visual-capability-section, .visual-maturity-section, .visual-concept-section, .visual-action-boundary-section, .visual-map-section, .visual-evidence-section, .visual-reading-loop-section, .visual-receipt-section, .visual-gallery-section, .visual-how-section { padding: 3rem 0; }
  .visual-primary-section { padding-top: 3.75rem; }
  .visual-gallery-section.visual-primary-section { padding-top: 2.75rem; }
  .visual-section-heading { grid-template-columns: 1fr; gap: .7rem; }
  .visual-section-heading h2 { font-size: 2.3rem; }
  .visual-goal-graph, .visual-map-graph { min-height: 0; padding: .75rem; }
  .visual-route-nav { padding: .75rem; }
  .visual-route-nav ol { grid-template-columns: 1fr; gap: .65rem; }
  .visual-route-node { min-height: 5.4rem; padding: .7rem; }
  .visual-route-detail { min-height: 0; padding: 1.25rem; }
  .visual-route-detail h3 { max-width: none; font-size: 2rem; }
  .visual-route-fallback { padding: .8rem; }
  .visual-route-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-goal-graph::before, .visual-goal-graph::after { display: none; }
  .visual-goal-center { position: static; display: flex; width: auto; min-height: 0; aspect-ratio: auto; align-items: baseline; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; padding: .7rem .8rem; transform: none; text-align: left; }
  .visual-goal-nodes { grid-template-rows: none; min-height: 0; gap: .65rem; }
  .visual-goal-node { min-height: 5.4rem; padding: .7rem; }
  .visual-goal-detail { min-height: 0; padding: 1.25rem; }
  .visual-goal-detail h3 { max-width: none; font-size: 2rem; }
  .visual-goal-fallback { padding: .8rem; }
  .visual-goal-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-journey-graph { min-height: 0; padding: .75rem; }
  .visual-journey-graph::before, .visual-journey-graph::after { display: none; }
  .visual-journey-center { position: static; display: flex; width: auto; min-height: 0; aspect-ratio: auto; align-items: baseline; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; padding: .7rem .8rem; transform: none; text-align: left; }
  .visual-journey-nodes { grid-template-rows: none; min-height: 0; gap: .65rem; }
  .visual-journey-node { min-height: 5.4rem; padding: .7rem; }
  .visual-journey-detail { min-height: 0; padding: 1.25rem; }
  .visual-journey-detail h3 { max-width: none; font-size: 2rem; }
  .visual-journey-fallback { padding: .8rem; }
  .visual-journey-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-capability-graph { min-height: 0; padding: .75rem; }
  .visual-capability-graph::before { top: 3.2rem; bottom: .75rem; left: 1.85rem; }
  .visual-capability-center { width: auto; margin-bottom: .75rem; padding: .7rem .8rem; }
  .visual-capability-nodes { gap: .65rem; padding-left: .7rem; }
  .visual-capability-node { min-height: 4rem; padding: .7rem; }
  .visual-capability-detail { min-height: 0; padding: 1.25rem; }
  .visual-capability-detail h3 { max-width: none; font-size: 2rem; }
  .visual-capability-figure { grid-template-columns: 1fr; gap: .8rem; }
  .visual-capability-figure img { max-height: 22rem; }
  .visual-capability-fallback { padding: .8rem; }
  .visual-capability-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-maturity-graph { min-height: 0; padding: .75rem; }
  .visual-maturity-graph::before { top: 3.2rem; bottom: .75rem; left: 1.85rem; }
  .visual-maturity-center { width: auto; margin-bottom: .75rem; padding: .7rem .8rem; }
  .visual-maturity-nodes { gap: .65rem; padding-left: .7rem; }
  .visual-maturity-node { min-height: 4rem; padding: .7rem; }
  .visual-maturity-detail { min-height: 0; padding: 1.25rem; }
  .visual-maturity-detail h3 { max-width: none; font-size: 2rem; }
  .visual-maturity-fallback { padding: .8rem; }
  .visual-maturity-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-maturity-figure { grid-template-columns: 1fr; gap: .8rem; padding: .8rem; }
  .visual-maturity-figure img { max-height: 20rem; }
  .visual-concept-graph { min-height: 0; padding: .75rem; }
  .visual-concept-graph::before, .visual-concept-graph::after { display: none; }
  .visual-concept-center { position: static; display: flex; width: auto; min-height: 0; aspect-ratio: auto; align-items: baseline; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; padding: .7rem .8rem; transform: none; text-align: left; }
  .visual-concept-nodes { grid-template-columns: 1fr; grid-template-rows: none; min-height: 0; gap: .65rem; }
  .visual-concept-node { min-height: 5.4rem; padding: .7rem; }
  .visual-concept-detail { min-height: 0; padding: 1.25rem; }
  .visual-concept-detail h3 { max-width: none; font-size: 2rem; }
  .visual-concept-fallback { padding: .8rem; }
  .visual-concept-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-action-boundary-graph { min-height: 0; padding: .75rem; }
  .visual-action-boundary-center { position: static; display: flex; width: auto; min-height: 0; align-items: baseline; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; padding: .7rem .8rem; transform: none; text-align: left; }
  .visual-action-boundary-nodes { grid-template-columns: 1fr; gap: .65rem; min-height: 0; padding: 0; }
  .visual-action-boundary-nodes li:not(:last-child)::after { display: none; }
  .visual-action-boundary-node { min-height: 5.4rem; padding: .7rem; }
  .visual-action-boundary-detail { min-height: 0; padding: 1.25rem; }
  .visual-action-boundary-detail h3 { max-width: none; font-size: 2rem; }
  .visual-action-boundary-fallback { padding: .8rem; }
  .visual-action-boundary-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-action-boundary-figure { grid-template-columns: 1fr; gap: .8rem; padding: .8rem; }
  .visual-action-boundary-figure img { max-height: 20rem; }
  .visual-triage-graph { min-height: 0; padding: .75rem; }
  .visual-triage-graph::before, .visual-triage-graph::after { display: none; }
  .visual-triage-center { position: static; display: flex; width: auto; min-height: 0; aspect-ratio: auto; align-items: baseline; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; padding: .7rem .8rem; transform: none; text-align: left; }
  .visual-triage-nodes { grid-template-columns: 1fr; grid-template-rows: none; min-height: 0; gap: .65rem; }
  .visual-triage-node { min-height: 5.4rem; padding: .7rem; }
  .visual-triage-detail { min-height: 0; padding: 1.25rem; }
  .visual-triage-detail h3 { max-width: none; font-size: 2rem; }
  .visual-triage-fallback { padding: .8rem; }
  .visual-triage-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-triage-figure { grid-template-columns: 1fr; gap: .8rem; padding: .8rem; }
  .visual-triage-figure img { max-height: 20rem; }
  .visual-map-graph::before, .visual-map-graph::after { display: none; }
  .visual-map-center { position: static; display: flex; width: auto; min-height: 0; aspect-ratio: auto; align-items: baseline; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; padding: .7rem .8rem; transform: none; text-align: left; }
  .visual-map-nodes { grid-template-rows: none; min-height: 0; gap: .65rem; }
  .visual-map-node { min-height: 5.4rem; padding: .7rem; }
  .visual-map-detail { padding: 1.25rem; }
  .visual-map-detail h3 { max-width: none; font-size: 2rem; }
  .visual-map-fallback { padding: .8rem; }
  .visual-map-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-evidence-graph { min-height: 0; padding: .75rem; }
  .visual-evidence-graph::before, .visual-evidence-graph::after { display: none; }
  .visual-evidence-center { position: static; display: flex; width: auto; min-height: 0; aspect-ratio: auto; align-items: baseline; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; padding: .7rem .8rem; transform: none; text-align: left; }
  .visual-evidence-nodes { grid-template-columns: 1fr; grid-template-rows: none; gap: .65rem; min-height: 0; }
  .visual-evidence-nodes li:nth-child(n) { grid-area: auto; }
  .visual-evidence-node { min-height: 5.4rem; padding: .7rem; }
  .visual-evidence-detail { padding: 1.25rem; }
  .visual-evidence-detail h3 { max-width: none; font-size: 2rem; }
  .visual-evidence-fallback { padding: .8rem; }
  .visual-evidence-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-evidence-figure { grid-template-columns: 1fr; gap: .8rem; padding: .8rem; }
  .visual-evidence-figure img { max-height: 20rem; }
  .visual-reading-loop-graph { min-height: 0; padding: .75rem; }
  .visual-reading-loop-graph::before, .visual-reading-loop-graph::after { display: none; }
  .visual-reading-loop-center { position: static; display: flex; width: auto; min-height: 0; aspect-ratio: auto; align-items: baseline; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; padding: .7rem .8rem; transform: none; text-align: left; }
  .visual-reading-loop-nodes { grid-template-columns: 1fr; grid-template-rows: none; gap: .65rem; min-height: 0; }
  .visual-reading-loop-nodes li:nth-child(n) { grid-area: auto; }
  .visual-reading-loop-node { min-height: 5.4rem; padding: .7rem; }
  .visual-reading-loop-detail { padding: 1.25rem; }
  .visual-reading-loop-detail h3 { max-width: none; font-size: 2rem; }
  .visual-reading-loop-fallback { padding: .8rem; }
  .visual-reading-loop-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-reading-loop-figure { grid-template-columns: 1fr; gap: .8rem; padding: .8rem; }
  .visual-reading-loop-figure img { max-height: 20rem; }
  .visual-receipt-graph { min-height: 0; padding: .75rem; }
  .visual-receipt-graph::before { display: none; }
  .visual-receipt-center { position: static; display: flex; width: auto; min-height: 0; aspect-ratio: auto; align-items: baseline; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; padding: .7rem .8rem; transform: none; text-align: left; }
  .visual-receipt-nodes { grid-template-columns: 1fr; grid-template-rows: none; gap: .65rem; min-height: 0; }
  .visual-receipt-nodes li:nth-child(n) { grid-area: auto; width: auto; }
  .visual-receipt-node { min-height: 5.4rem; padding: .7rem; }
  .visual-receipt-detail { padding: 1.25rem; }
  .visual-receipt-detail h3 { max-width: none; font-size: 2rem; }
  .visual-receipt-fallback { padding: .8rem; }
  .visual-receipt-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-receipt-figure { grid-template-columns: 1fr; gap: .8rem; padding: .8rem; }
  .visual-receipt-figure img { max-height: 20rem; }
  .visual-board-explorer-graph { min-height: 0; padding: .75rem; }
  .visual-board-explorer-graph::before, .visual-board-explorer-graph::after { display: none; }
  .visual-board-explorer-center { position: static; display: flex; width: auto; min-height: 0; aspect-ratio: auto; align-items: baseline; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; padding: .7rem .8rem; transform: none; text-align: left; }
  .visual-board-explorer-nodes { grid-template-columns: 1fr; grid-template-rows: none; min-height: 0; gap: .65rem; }
  .visual-board-explorer-node { min-height: 5.4rem; padding: .7rem; }
  .visual-board-explorer-detail { min-height: 0; padding: 1.25rem; }
  .visual-board-explorer-detail h3 { max-width: none; font-size: 2rem; }
  .visual-board-explorer-figure { grid-template-columns: 1fr; }
  .visual-board-explorer-figure img { max-height: 20rem; }
  .visual-board-explorer-fallback { padding: .8rem; }
  .visual-board-explorer-fallback ol { grid-template-columns: 1fr; gap: .8rem; }
  .visual-gallery { grid-template-columns: 1fr; }
  .visual-card { grid-template-columns: minmax(0, 7rem) minmax(0, 1fr); grid-template-rows: auto 1fr auto; gap: .65rem .8rem; padding: .75rem; }
  .visual-card-link { grid-row: 1 / -1; }
  .visual-card-link img { aspect-ratio: 3 / 4; }
  .visual-card-stage, .visual-card h3, .visual-card p { grid-column: 2; }
  .visual-card .visual-action-link { grid-column: 2; }
  .visual-footer { display: grid; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media (max-width: 374px) {
  .visual-hero { gap: .5rem; padding: .65rem 0 .7rem; }
  .visual-hero-index strong { font-size: 2.2rem; }
  .visual-hero h1 { margin-top: .5rem; margin-bottom: .55rem; font-size: clamp(2.25rem, 11vw, 3.25rem); }
  .visual-lede { font-size: .9rem; line-height: 1.3; }
  .visual-boundary { margin-top: .4rem; padding-top: .35rem; font-size: .68rem; line-height: 1.25; }
  .visual-hero-actions { margin-top: .4rem; }
  .visual-hero-action { min-height: 2.45rem; }
  .visual-entry-nav { padding-top: .75rem; }
  .visual-entry-heading { margin-bottom: .35rem; }
  .visual-entry-heading h2 { font-size: 1.6rem; }
  .visual-entry-heading > p { font-size: .7rem; line-height: 1.25; }
  .visual-primary-section { padding-top: 3.25rem; }
  .visual-gallery-section.visual-primary-section { padding-top: 2.5rem; }
}