/*
 * Audience edition
 * A calm, editorial school guide for learners and teachers.
 * Flat rules, generous type and clear routes replace dashboard-like decoration.
 */
:root {
  --ink: #172238;
  --muted: #5c6470;
  --paper: #f4f1e8;
  --surface: #fffdf7;
  --surface-2: #e8e4da;
  --line: #c9c3b6;
  --line-dark: #7d7b77;
  --red: #e15c37;
  --red-dark: #a9422a;
  --white: #fffefa;
  --blue: #2854b8;
  --green: #26735c;
  --gold: #ad7618;
  --max-width: 1240px;
}

html { scroll-padding-top: 6rem; }

body {
  color: var(--ink);
  background: var(--paper);
  font-size: 1rem;
  line-height: 1.75;
}

a, button, select { touch-action: manipulation; }

.container { width: min(calc(100% - 3rem), var(--max-width)); }

.site-header {
  color: var(--ink);
  background: rgba(244, 241, 232, .96);
  border-bottom: 1px solid var(--ink);
  backdrop-filter: blur(12px);
}

.site-header.is-scrolled { box-shadow: none; }

.nav-shell {
  min-height: 78px;
  gap: 1.6rem;
}

.brand { flex: 0 0 auto; }

.brand-mark {
  width: 43px;
  height: 43px;
  color: var(--white);
  background: var(--ink);
  border: 1px solid var(--ink);
  border-radius: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: .86rem;
}

.brand-type strong { color: var(--ink); font-size: .82rem; letter-spacing: .1em; }
.brand-type small { color: var(--muted); font-size: .66rem; }
.brand-credit { color: var(--muted); font-size: .58rem; letter-spacing: .02em; }

.site-nav { gap: clamp(.65rem, 1.3vw, 1.15rem); }

.site-nav > a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: .2rem 0;
  color: var(--ink);
  border-bottom: 3px solid transparent;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .02em;
}

.site-nav > a[aria-current="page"] { border-bottom-color: var(--red); }
.site-nav > a:hover { color: var(--red-dark); }

.site-nav .teacher-entry {
  padding-inline: .8rem !important;
  color: var(--white) !important;
  background: var(--ink);
  border: 1px solid var(--ink) !important;
}

.site-nav .teacher-entry:hover { color: var(--white) !important; background: var(--red-dark); }

.eyebrow {
  color: var(--red-dark);
  font-size: .69rem;
  font-weight: 800;
  letter-spacing: .14em;
}

.hero.audience-hero {
  min-height: 0;
  padding: clamp(4rem, 7vw, 6.5rem) 0 clamp(3.5rem, 6vw, 5.5rem);
  background: var(--paper);
  border-bottom: 1px solid var(--ink);
}

.audience-hero .hero-grid {
  grid-template-columns: minmax(0, 1.02fr) minmax(28rem, .78fr);
  gap: clamp(3rem, 7vw, 7rem);
  align-items: center;
}

.audience-hero h1 {
  max-width: none;
  margin: 1.1rem 0 .75rem;
  font-size: clamp(3.8rem, 6.4vw, 6.7rem);
  font-weight: 650;
  line-height: .98;
  letter-spacing: -.065em;
}

.hero h1 .accent-word { color: var(--red); font-family: inherit; font-style: normal; }
.hero h1 .accent-word::after { display: none; }

.audience-hero .page-credit {
  margin: 0 0 1.6rem;
  color: var(--muted);
  font-size: .7rem;
  letter-spacing: .05em;
}

.audience-hero .hero-lead {
  max-width: 42rem;
  color: #3e4652;
  font-size: 1.02rem;
  line-height: 1.95;
}

.hero-actions { gap: .65rem; }

.button {
  min-height: 47px;
  border-radius: 0;
  font-size: .79rem;
  font-weight: 750;
}

.button-primary { color: var(--white); background: var(--ink); border-color: var(--ink); }
.button-primary:hover { background: var(--red-dark); border-color: var(--red-dark); transform: none; }
.button-secondary { color: var(--ink); background: transparent; border-color: var(--ink); }
.button-secondary:hover { color: var(--white); background: var(--ink); transform: none; }

.access-note {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-top: 1.2rem;
  color: var(--muted);
  font-size: .74rem;
}

.access-note span { width: 7px; height: 7px; background: var(--green); }

.audience-start {
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--ink);
  border-top: 8px solid var(--ink);
}

.audience-start header { padding: 1.35rem 1.4rem 1.15rem; border-bottom: 1px solid var(--ink); }
.audience-start header p { margin: 0; color: var(--red-dark); font: 700 .65rem/1 var(--mono); letter-spacing: .13em; }
.audience-start header h2 { margin: .7rem 0 .25rem; font-size: 1.55rem; line-height: 1.2; letter-spacing: -.03em; }
.audience-start header span { color: var(--muted); font-size: .78rem; }

.audience-route {
  --route-color: var(--blue);
  display: grid;
  grid-template-columns: 2rem 1fr auto;
  gap: 1rem;
  align-items: center;
  min-height: 104px;
  padding: 1.2rem 1.25rem 1.2rem 1rem;
  color: inherit;
  border-left: 7px solid var(--route-color);
  border-bottom: 1px solid var(--line);
  text-decoration: none;
}

.audience-route:last-child { border-bottom: 0; }
.audience-route:hover { color: inherit; background: #f2eee3; }
.route-elementary { --route-color: var(--red); }
.route-middle { --route-color: var(--green); }
.route-high { --route-color: var(--blue); }
.route-teacher { --route-color: var(--gold); }
.route-number { align-self: start; color: var(--muted); font: .7rem/1.2 var(--mono); }
.route-copy { display: grid; }
.route-copy strong { font-size: 1.08rem; }
.route-copy small { color: var(--route-color); font-size: .72rem; font-weight: 750; }
.route-copy em { margin-top: .2rem; color: var(--muted); font-size: .73rem; font-style: normal; }
.audience-route b { font-size: 1.2rem; }

.stats-strip {
  margin-top: 0;
  color: var(--ink);
  background: var(--surface);
  border: 0;
  border-bottom: 1px solid var(--ink);
}

.stat-item { min-height: 86px; border-color: var(--line); }
.stat-item strong { font-size: 1.8rem; }

.section { padding: clamp(5.5rem, 9vw, 8.5rem) 0; }
.section-tight { padding: clamp(4rem, 7vw, 6.5rem) 0; }
.section-head { margin-bottom: clamp(2.5rem, 5vw, 4.2rem); }
.section-head h2 { font-size: clamp(2.5rem, 4.7vw, 4.8rem); line-height: 1.04; }

.school-grid, .featured-grid, .material-grid { gap: 1px; background: var(--ink); border: 1px solid var(--ink); }
.school-card, .deck-card, .material-card { background: var(--surface); border: 0; border-radius: 0; }
.school-card { min-height: 370px; padding: 2.1rem; border-top: 8px solid var(--red); }
.school-card.middle { border-top-color: var(--green); }
.school-card.high { border-top-color: var(--blue); }
.school-card h3 { font-size: 2.7rem; }
.school-card p { color: #49515c; font-size: .93rem; line-height: 1.85; }

.teacher-callout {
  padding: clamp(4.5rem, 8vw, 7rem) 0;
  color: var(--white);
  background: var(--ink);
  border-top: 10px solid var(--gold);
}

.teacher-callout-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(3rem, 8vw, 8rem); align-items: end; }
.teacher-callout .eyebrow { color: #e9b955; }
.teacher-callout h2 { margin: .8rem 0 0; font-size: clamp(2.4rem, 4.4vw, 4.5rem); line-height: 1.08; letter-spacing: -.045em; }
.teacher-callout-copy p { color: #d8dce4; line-height: 1.95; }
.teacher-callout .button-primary { color: var(--ink); background: var(--white); border-color: var(--white); }
.teacher-callout .button-secondary { color: var(--white); border-color: #aab1be; }

/* Interior pages: the actual material appears within the first viewport. */
.page-hero {
  padding: clamp(3.8rem, 7vw, 6rem) 0 clamp(3rem, 5vw, 4.5rem);
  background: #e7ebf2;
  border-bottom: 1px solid var(--ink);
}

.page-hero .container {
  display: grid;
  grid-template-columns: 10.5rem minmax(0, 1fr);
  gap: .5rem clamp(2rem, 5vw, 5rem);
  align-items: start;
}

.page-kicker {
  grid-column: 1;
  grid-row: 1 / span 5;
  writing-mode: horizontal-tb;
  padding-top: .8rem;
  border-top: 5px solid var(--red);
  color: var(--ink);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .12em;
}

.page-kicker span { display: block; margin-bottom: .6rem; color: var(--red-dark); font: 1.6rem/1 Georgia, serif; }
.page-hero h1 { grid-column: 2; max-width: 12em; margin: 0; font-size: clamp(3rem, 5.2vw, 5.5rem); line-height: 1.04; letter-spacing: -.055em; }
.page-hero .page-credit, .page-hero .hero-lead, .page-hero .process-rail, .page-hero .stats-strip, .page-hero .audience-note-grid { grid-column: 2; }
.page-hero .page-credit { margin: .25rem 0 .7rem; }
.page-hero .hero-lead { max-width: 54rem; margin-top: .55rem; color: #46505f; font-size: .98rem; line-height: 1.9; }

.audience-note-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  margin-top: 1.5rem;
  background: #9ba5b4;
  border: 1px solid #9ba5b4;
}

.audience-note-grid > :is(div, a) {
  display: grid;
  grid-template-columns: 5rem minmax(0, 1fr);
  align-items: baseline;
  gap: 1rem;
  min-width: 0;
  padding: .9rem 1rem;
  color: var(--ink);
  text-decoration: none;
  background: rgba(255,255,255,.72);
}

.audience-note-grid > a {
  position: relative;
  padding-right: 3.25rem;
  transition: background-color .18s ease, color .18s ease;
}

.audience-note-grid > a::after {
  position: absolute;
  top: 50%;
  right: 1rem;
  content: "→";
  color: var(--red-dark);
  font-size: 1rem;
  transform: translateY(-50%);
}

.audience-note-grid > a:hover { background: var(--white); }
.audience-note-grid > a:focus-visible { z-index: 1; outline: 3px solid var(--blue); outline-offset: -3px; }
.audience-note-grid b { color: var(--blue); font-size: .75rem; }
.audience-note-grid span { min-width: 0; font-size: .78rem; line-height: 1.55; overflow-wrap: anywhere; }

.toolbar { top: 78px; background: var(--surface); border-bottom: 1px solid var(--ink); box-shadow: none; }
.filter-chip, .select-field select { min-height: 44px; border-radius: 0; }
.filter-chip[aria-pressed="true"] { color: var(--white); background: var(--ink); }
.catalog-section { padding-top: 3.2rem; }

.approach-section {
  padding: clamp(4.5rem, 8vw, 7rem) 0;
  color: var(--white);
  background: #20252d;
  border-bottom: 1px solid var(--ink);
}

.approach-head {
  display: grid;
  grid-template-columns: minmax(18rem, .85fr) minmax(22rem, 1.15fr);
  gap: clamp(2rem, 6vw, 7rem);
  align-items: end;
  margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
}

.approach-head .eyebrow { color: #e5bb5b; }
.approach-head h2 { max-width: 8em; margin: .8rem 0 0; color: var(--white); font-size: clamp(2.8rem, 5vw, 5rem); line-height: 1.02; letter-spacing: -.05em; }
.approach-head > p { max-width: 39rem; margin: 0; color: #c8cdd4; font-size: .92rem; line-height: 1.9; }

.approach-ledger { border-top: 1px solid #68717d; }

.approach-row {
  display: grid;
  grid-template-columns: 3rem 12rem minmax(14rem, 1.05fr) minmax(14rem, 1fr) minmax(16rem, 1.15fr);
  gap: clamp(1rem, 2.5vw, 2.5rem);
  align-items: start;
  padding: 1.45rem 0 1.55rem;
  border-bottom: 1px solid #68717d;
}

.approach-number { color: #e5bb5b; font: .72rem/1.2 var(--mono); letter-spacing: .1em; }
.approach-name p { margin: 0 0 .35rem; color: #9ba8b8; font: .63rem/1.2 var(--mono); letter-spacing: .08em; }
.approach-name h3 { margin: 0; color: var(--white); font-family: var(--serif); font-size: 1.18rem; line-height: 1.3; }
.approach-question, .approach-evidence, .approach-caution { display: grid; gap: .48rem; }
.approach-row b { color: #98a7ba; font-size: .64rem; letter-spacing: .08em; }
.approach-row span:not(.approach-number) { color: #eef0f3; font-size: .78rem; line-height: 1.65; }
.approach-caution span { color: #c7ccd3 !important; }
.approach-caution a { width: fit-content; color: #f0c96e; font-size: .7rem; font-weight: 800; text-decoration: none; border-bottom: 1px solid #f0c96e; }
.approach-caution a:hover { color: var(--white); border-color: var(--white); }
.approach-footnote { max-width: 56rem; margin: 2rem 0 0 15rem; color: #aeb7c2; font-size: .76rem; line-height: 1.75; }

.route-studio-section { padding: clamp(3.5rem, 7vw, 6rem) 0; background: #f0eadc; border-bottom: 1px solid var(--ink); }
.route-studio { display: grid; grid-template-columns: .72fr 1.15fr .9fr; gap: clamp(1.5rem, 4vw, 4rem); align-items: start; }
.route-studio-copy { padding-top: .8rem; border-top: 6px solid var(--red); }
.route-studio-copy h2 { max-width: 9ch; margin: .7rem 0 1rem; font-size: clamp(2.3rem, 4vw, 4rem); line-height: 1.05; letter-spacing: -.05em; }
.route-studio-copy > p:last-child { color: var(--muted); font-size: .82rem; line-height: 1.7; }
.route-studio form, .route-studio-result { display: grid; gap: 1rem; }
.route-studio label { display: grid; gap: .5rem; }
.route-studio label > span { font-size: .7rem; font-weight: 800; }
.route-studio textarea, .route-studio select { width: 100%; padding: .8rem; color: inherit; background: rgba(255,255,255,.55); border: 1px solid var(--ink); border-radius: 0; font: inherit; line-height: 1.65; }
.route-studio-fields { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.route-studio-result { min-height: 18rem; padding: 1.2rem; color: var(--white); background: var(--ink); }
.route-studio-result > p { margin: 0; color: #c8ced7; font-size: .78rem; line-height: 1.75; }
.route-studio-result article { padding-top: .8rem; border-top: 1px solid #68717d; }
.route-studio-result article > span, .route-studio-result article b { color: #efbd6b; font: 700 .61rem/1.4 var(--mono); letter-spacing: .08em; }
.route-studio-result article h3 { margin: .25rem 0; font-family: var(--serif); font-size: 1.1rem; }
.route-studio-result article p { margin: 0; font-size: .73rem; line-height: 1.65; }
.route-studio-result article small { display: block; margin-top: .25rem; color: #c8ced7; line-height: 1.55; }
.route-studio-result label > span { color: #efbd6b; }
.route-studio-result textarea { color: var(--white); background: #2b3440; border-color: #778293; }

.approach-ledger { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: #68717d; border: 1px solid #68717d; }
.practice-card { min-width: 0; color: var(--ink); background: #f4f0e7; }
.practice-visual { aspect-ratio: 16 / 7; background-repeat: no-repeat; background-position: left top; background-size: 300% 200%; border-bottom: 1px solid var(--ink); }
.practice-card-body { display: grid; gap: 1rem; padding: clamp(1.2rem, 2.3vw, 2rem); }
.practice-card-meta { display: flex; justify-content: space-between; gap: 1rem; color: var(--red-dark); font: 700 .63rem/1.4 var(--mono); letter-spacing: .08em; }
.practice-card h3 { max-width: 15ch; margin: 0; font-size: clamp(1.65rem, 2.7vw, 2.55rem); line-height: 1.12; letter-spacing: -.04em; }
.practice-card-body > p { min-height: 3.2em; margin: 0; color: #46505f; font-family: var(--serif); line-height: 1.65; }
.practice-first { display: grid; grid-template-columns: 5rem 1fr; gap: 1rem; padding-top: .9rem; border-top: 1px solid #a8a397; }
.practice-first span { color: var(--red-dark); font-size: .62rem; font-weight: 800; }
.practice-first strong { font-size: .78rem; line-height: 1.65; }
.practice-actions { display: flex; flex-wrap: wrap; gap: 0; }
.practice-actions .button { margin-right: -1px; }
.practice-external { align-self: center; margin-left: .8rem; color: var(--red-dark); font-size: .7rem; font-weight: 800; }
.practice-card details { padding-top: .7rem; border-top: 1px solid #a8a397; }
.practice-card summary { font-size: .68rem; font-weight: 800; cursor: pointer; }
.practice-card details p, .practice-card details a { display: block; margin: .7rem 0 0; color: #4c5561; font-size: .7rem; line-height: 1.65; }
.practice-card details a { color: var(--red-dark); }
.catalog-head h2 { margin: .35rem 0 0; font-size: clamp(2rem, 3.5vw, 3.4rem); line-height: 1.1; letter-spacing: -.04em; }
.catalog-head > div:last-child { display: grid; justify-items: end; }
.practice-lab-dialog { width: min(68rem, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); padding: 0; color: var(--ink); background: var(--paper); border: 1px solid var(--ink); }
.practice-lab-body { padding: clamp(1rem, 3vw, 2.5rem); }

.deck-card { border-left: 6px solid var(--red); }
.deck-card:nth-child(3n + 2) { border-left-color: var(--green); }
.deck-card:nth-child(3n + 3) { border-left-color: var(--blue); }
.deck-cover { border-radius: 0; }
.deck-cover::after { border-radius: 0; }
.material-card { border-top: 6px solid var(--blue); }
.material-card:nth-child(2n + 1) { border-top-color: var(--green); }

.curriculum-hero {
  padding: clamp(4.5rem, 8vw, 7rem) 0 3.5rem;
  background: var(--paper);
  border-bottom: 1px solid var(--ink);
}

.curriculum-hero h1 { font-size: clamp(3.3rem, 6.1vw, 6.5rem); }
.curriculum-ledger { margin-top: clamp(3rem, 6vw, 5.2rem); }

.curriculum-entry { color: var(--white); background: var(--ink); border-bottom: 1px solid var(--white); }
.curriculum-entry .container { display: grid; grid-template-columns: 13rem 1fr; align-items: stretch; }
.curriculum-entry p { display: grid; align-content: center; margin: 0; padding: 1rem 1.2rem 1rem 0; border-right: 1px solid #6c7482; font-size: .73rem; line-height: 1.5; }
.curriculum-entry p span { color: #e9b955; font: .65rem/1 var(--mono); letter-spacing: .11em; }
.curriculum-entry .container > div { display: grid; grid-template-columns: repeat(4, 1fr); }
.curriculum-entry a { display: grid; min-height: 82px; padding: 1rem 1.2rem; color: var(--white); border-right: 1px solid #6c7482; text-decoration: none; }
.curriculum-entry a:hover { background: var(--red-dark); }
.curriculum-entry b { font-size: .9rem; }
.curriculum-entry small { color: #cbd0da; font-size: .67rem; }

.curriculum-section { padding: clamp(5rem, 9vw, 8rem) 0; }
.curriculum-section-head h2 { font-size: clamp(2.6rem, 4.8vw, 4.9rem); }
.course-switch button { min-height: 64px; }

.site-footer { border-top: 1px solid var(--ink); }
.site-footer .brand-mark { color: var(--ink); background: var(--white); }

@media (max-width: 1000px) {
  .nav-toggle { display: inline-flex; }
  .site-nav {
    position: absolute;
    top: calc(100% + 1px);
    right: 1.5rem;
    left: 1.5rem;
    display: none;
    gap: 0;
    padding: .55rem 1rem 1rem;
    color: var(--ink);
    background: var(--surface);
    border: 1px solid var(--ink);
    box-shadow: none;
  }
  .site-nav.is-open { display: flex; }
  .site-nav > a { width: 100%; padding: .55rem .35rem; border-bottom: 1px solid var(--line); }
  .site-nav .teacher-entry { margin-top: .55rem; justify-content: center; }
  .audience-hero .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(23rem, .8fr); gap: 2.5rem; }
  .audience-hero h1 { font-size: clamp(3.5rem, 7vw, 5.3rem); }
  .approach-row { grid-template-columns: 3rem 10rem minmax(0, 1fr) minmax(0, 1fr); }
  .approach-caution { grid-column: 3 / span 2; }
  .approach-footnote { margin-left: 13rem; }
  .route-studio { grid-template-columns: .8fr 1.2fr; }
  .route-studio-result { grid-column: 1 / -1; grid-template-columns: repeat(2, 1fr); min-height: 0; }
  .route-studio-result > p, .route-studio-result > label { grid-column: 1 / -1; }
}

@media (max-width: 840px) {
  .container { width: min(calc(100% - 2rem), var(--max-width)); }
  .audience-hero .hero-grid, .teacher-callout-grid { grid-template-columns: 1fr; }
  .audience-hero h1 { max-width: 10ch; }
  .audience-start { max-width: 42rem; }
  .page-hero .container { grid-template-columns: 1fr; gap: .7rem; }
  .page-kicker { grid-column: 1; grid-row: auto; max-width: 12rem; }
  .page-hero h1, .page-hero .page-credit, .page-hero .hero-lead, .page-hero .process-rail, .page-hero .stats-strip, .page-hero .audience-note-grid { grid-column: 1; }
  .page-hero h1 { margin-top: .5rem; }
  .approach-head { grid-template-columns: 1fr; align-items: start; }
  .approach-row { grid-template-columns: 2.5rem minmax(0, 1fr); gap: .75rem 1rem; }
  .approach-name { grid-column: 2; }
  .approach-question, .approach-evidence, .approach-caution { grid-column: 2; padding-top: .45rem; }
  .approach-footnote { margin-left: 3.5rem; }
  .route-studio { grid-template-columns: 1fr; }
  .route-studio-result { grid-column: auto; }
  .approach-ledger { grid-template-columns: 1fr; }
  .curriculum-entry .container { grid-template-columns: 1fr; }
  .curriculum-entry p { padding-right: 0; border-right: 0; border-bottom: 1px solid #6c7482; }
}

@media (max-width: 600px) {
  .route-studio-fields, .route-studio-result { grid-template-columns: 1fr; }
  .route-studio-result > p, .route-studio-result > label { grid-column: auto; }
  .practice-card-body { padding: 1.1rem; }
  .practice-first { grid-template-columns: 1fr; gap: .3rem; }
  .practice-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .practice-actions .button { justify-content: center; margin: 0 0 -1px; }
  .practice-external { grid-column: 1 / -1; margin: .7rem 0 0; }
  .catalog-head { align-items: start; }
  .catalog-head > div:last-child { justify-items: start; }
}

@media (max-width: 600px) {
  .nav-shell { min-height: 68px; }
  .brand-mark { width: 39px; height: 39px; }
  .brand-type strong { font-size: .74rem; }
  .brand-type small { display: none; }
  .brand-credit { font-size: .53rem; }
  .site-nav { top: 69px; right: 1rem; left: 1rem; max-height: calc(100vh - 82px); overflow: auto; }
  .hero.audience-hero { padding-top: 3.2rem; }
  .audience-hero h1 { font-size: clamp(3.1rem, 15vw, 4.4rem); }
  .audience-hero .hero-lead { font-size: .94rem; }
  .hero-actions .button { width: 100%; justify-content: space-between; }
  .audience-route { min-height: 96px; }
  .section-head h2, .teacher-callout h2 { font-size: clamp(2.25rem, 11vw, 3.2rem); }
  .school-card { min-height: 0; }
  .page-hero { padding-top: 3rem; }
  .page-hero h1 { font-size: clamp(2.65rem, 12vw, 3.7rem); }
  .audience-note-grid { grid-template-columns: 1fr; }
  .audience-note-grid > :is(div, a) { grid-template-columns: 4rem minmax(0, 1fr); }
  .toolbar { top: auto; }
  [data-page="inquiry"] .process-rail { margin-top: 2rem; }
  [data-page="inquiry"] .rail-step {
    min-width: 0;
    min-height: 58px;
    padding: 1rem .7rem .75rem 2rem;
    line-height: 1.45;
  }
  [data-page="inquiry"] .rail-step::before,
  [data-page="inquiry"] .rail-step:first-child::before {
    top: 1.08rem;
    right: auto;
    left: .65rem;
  }
  .inquiry-toolbar { padding: .75rem 0; }
  .inquiry-toolbar .filter-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 0;
    border-top: 1px solid var(--ink);
    border-left: 1px solid var(--ink);
  }
  .inquiry-toolbar .filter-chip {
    width: 100%;
    min-width: 0;
    padding: .65rem .75rem;
    border-right: 1px solid var(--ink);
    border-bottom: 1px solid var(--ink);
    text-align: left;
    white-space: normal;
  }
  .inquiry-toolbar .filter-chip:first-child { grid-column: 1 / -1; }
  .inquiry-toolbar .select-field,
  .inquiry-toolbar .select-field select { width: 100%; }
  .curriculum-hero { padding-top: 3.6rem; }
  .curriculum-hero h1 { font-size: clamp(2.75rem, 12.5vw, 4rem); }
  .curriculum-entry .container > div { grid-template-columns: 1fr 1fr; }
  .curriculum-entry a:nth-child(2n) { border-right: 0; }
  .curriculum-entry a:nth-child(-n + 2) { border-bottom: 1px solid #6c7482; }
}

/* Learning modes — an editorial course reader and radio desk. */
.learning-hero {
  padding: clamp(5rem, 10vw, 9rem) 0 clamp(4rem, 8vw, 7rem);
  border-bottom: 1px solid var(--ink);
}

.learning-hero h1 {
  max-width: 13ch;
  margin: 0;
  font-size: clamp(3.5rem, 7.2vw, 7.4rem);
  font-weight: 620;
  letter-spacing: -.07em;
  line-height: .99;
}

.learning-hero h1 em {
  color: var(--red);
  font-family: var(--serif);
  font-weight: 500;
  font-style: normal;
}

.learning-hero > .container > p:last-child {
  max-width: 47rem;
  margin: 2.2rem 0 0 auto;
  padding-top: 1.2rem;
  border-top: 1px solid var(--ink);
  color: #424b58;
  line-height: 1.95;
}

.learning-mode-section { padding: 0 0 clamp(5rem, 9vw, 8rem); }
.learning-mode-grid { display: grid; grid-template-columns: repeat(3, 1fr); padding: 0; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); border-left: 1px solid var(--ink); }

.learning-mode-card {
  --mode-color: var(--blue);
  display: grid;
  grid-template-columns: auto 1fr;
  min-height: 32rem;
  align-content: start;
  gap: .5rem 1rem;
  padding: 2rem;
  color: inherit;
  border-top: 9px solid var(--mode-color);
  border-right: 1px solid var(--ink);
  text-decoration: none;
}

.learning-mode-card:last-child { border-right: 0; }
.learning-mode-card[data-mode="pages"] { --mode-color: var(--green); }
.learning-mode-card[data-mode="podcast"] { --mode-color: var(--gold); }
.learning-mode-card:hover { color: inherit; background: var(--surface); }
.mode-number { color: var(--mode-color); font: 1.7rem/1 Georgia, serif; }
.mode-label { align-self: center; font: 700 .63rem/1.4 var(--mono); letter-spacing: .1em; }
.learning-mode-card h2 { grid-column: 1 / -1; margin: 4rem 0 1rem; font-size: clamp(2.3rem, 3.6vw, 3.9rem); line-height: 1.07; letter-spacing: -.055em; }
.learning-mode-card h3 { grid-column: 1 / -1; margin: 4rem 0 1rem; font-size: clamp(2.1rem, 3.2vw, 3.3rem); line-height: 1.07; letter-spacing: -.055em; }
.learning-mode-card p { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: .91rem; line-height: 1.9; }
.learning-mode-card strong { grid-column: 1 / -1; align-self: end; margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--ink); font-size: .82rem; }
.learning-mode-card strong span { float: right; }
.home-learning-section { color: var(--white); background: var(--ink); }
.home-learning-section .section-head > p { color: #cbd1da; }
.home-learning-grid { color: var(--ink); background: var(--paper); }
.home-learning-grid .learning-mode-card { min-height: 25rem; }

.cross-media-section { padding: clamp(5rem, 9vw, 8rem) 0; background: var(--surface); border-top: 1px solid var(--ink); }
.cross-media-list { border-top: 1px solid var(--ink); }
.cross-media-row { display: grid; grid-template-columns: 4rem minmax(18rem, .9fr) minmax(30rem, 1.1fr); gap: 1.5rem; align-items: stretch; border-bottom: 1px solid var(--ink); }
.topic-number { padding-top: 1.5rem; color: var(--muted); font: 1.25rem/1 Georgia, serif; }
.topic-summary { padding: 1.35rem 1.5rem 1.35rem 0; }
.topic-summary p { margin: 0 0 .35rem; color: var(--red-dark); font: 700 .64rem/1.3 var(--mono); letter-spacing: .08em; }
.topic-summary h3 { margin: 0; font-size: 1.35rem; letter-spacing: -.025em; }
.topic-summary span { display: block; margin-top: .55rem; color: var(--muted); font-size: .76rem; line-height: 1.55; }
.topic-media-links { display: grid; grid-template-columns: repeat(3, 1fr); border-left: 1px solid var(--ink); }
.topic-media-links a { display: grid; grid-template-columns: auto 1fr; gap: .2rem .65rem; align-content: center; min-height: 9rem; padding: 1rem; color: inherit; border-right: 1px solid var(--ink); text-decoration: none; }
.topic-media-links a:last-child { border-right: 0; }
.topic-media-links a:hover { color: var(--white); background: var(--ink); }
.topic-media-links span { grid-row: 1 / span 2; color: var(--red); font: .75rem/1 var(--mono); }
.topic-media-links b { font-size: .86rem; }
.topic-media-links small { color: var(--muted); font-size: .67rem; }
.topic-media-links a:hover small { color: #d3d8df; }

.compact-learning-head { padding: clamp(3.8rem, 7vw, 6rem) 0; background: #e5eadf; border-bottom: 1px solid var(--ink); }
.compact-learning-head .container { display: grid; grid-template-columns: 1fr .8fr; gap: clamp(3rem, 8vw, 8rem); align-items: end; }
.compact-learning-head h1 { margin: 0; font-size: clamp(3.5rem, 6.5vw, 6.7rem); line-height: 1; letter-spacing: -.065em; }
.compact-learning-head .page-credit { margin-top: 1rem; }
.compact-learning-head .container > p { margin: 0; padding-top: 1.2rem; border-top: 3px solid var(--ink); line-height: 1.9; }

.mode-switch { position: sticky; z-index: 20; top: 78px; color: var(--ink); background: var(--surface); border-bottom: 1px solid var(--ink); }
.mode-switch .container { display: grid; grid-template-columns: repeat(3, 1fr); }
.mode-switch a { display: flex; gap: .8rem; align-items: center; min-height: 58px; padding: .65rem 1rem; color: inherit; border-right: 1px solid var(--ink); text-decoration: none; font-size: .76rem; font-weight: 750; }
.mode-switch a:first-child { border-left: 1px solid var(--ink); }
.mode-switch a span { color: var(--red-dark); font: .65rem/1 var(--mono); }
.mode-switch a:hover, .mode-switch a[aria-current="page"] { color: var(--white); background: var(--ink); }
.mode-switch a:hover span, .mode-switch a[aria-current="page"] span { color: #f0b55e; }
.mode-switch + .toolbar { top: 136px; }

.reading-section { padding: clamp(4rem, 7vw, 6rem) 0 8rem; }
.reading-layout { display: grid; grid-template-columns: 16rem minmax(0, 1fr); gap: clamp(3rem, 7vw, 8rem); align-items: start; }
.reading-index { position: sticky; top: 156px; border-top: 4px solid var(--ink); }
.reading-index button { display: grid; grid-template-columns: 2.2rem 1fr; gap: .6rem; width: 100%; padding: 1rem .2rem; color: inherit; background: transparent; border: 0; border-bottom: 1px solid var(--line); text-align: left; cursor: pointer; }
.reading-index button > span:first-child { color: var(--muted); font: .72rem/1.5 var(--mono); }
.reading-index button > span:last-child { display: grid; }
.reading-index small { color: var(--muted); font-size: .62rem; }
.reading-index b { font-size: .79rem; }
.reading-index button:hover, .reading-index button[aria-current="true"] { color: var(--red-dark); }
.reading-index button[aria-current="true"] { border-bottom: 3px solid var(--red); }

.learning-article { max-width: 52rem; scroll-margin-top: 10rem; }
.article-head { padding-bottom: 4rem; border-bottom: 1px solid var(--ink); }
.article-meta { display: flex; flex-wrap: wrap; gap: .4rem; }
.article-meta span { padding: .25rem .55rem; border: 1px solid var(--ink); font: 700 .63rem/1.3 var(--mono); }
.article-kicker { margin: 3rem 0 .8rem; color: var(--red-dark); font: 700 .66rem/1 var(--mono); letter-spacing: .12em; }
.article-head h1 { max-width: 12ch; margin: 0; font-size: clamp(3rem, 5vw, 5.1rem); line-height: 1.06; letter-spacing: -.06em; }
.article-question { margin: 2.2rem 0 0; padding: 1.2rem 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); font-family: var(--serif); font-size: clamp(1.25rem, 2.2vw, 1.75rem); line-height: 1.6; }
.article-introduction { margin: 2rem 0 0; color: #3d4652; font-size: 1.02rem; line-height: 2; }
.article-media-actions { display: flex; margin-top: 2.2rem; }

.article-toc { display: grid; grid-template-columns: 1fr 1fr; margin: 2.5rem 0 5rem; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.article-toc a { display: flex; gap: .8rem; padding: .75rem; color: inherit; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); text-decoration: none; font-size: .74rem; }
.article-toc span { color: var(--red-dark); font: .65rem/1.8 var(--mono); }

.article-section { padding: 0 0 5rem; scroll-margin-top: 10rem; }
.article-section-label { margin: 0 0 1rem; color: var(--red-dark); font: 700 .65rem/1.4 var(--mono); letter-spacing: .11em; }
.article-section h2, .pitfall-section h2, .article-check h2 { max-width: 17ch; margin: 0 0 1.5rem; font-size: clamp(2rem, 3.5vw, 3.15rem); line-height: 1.12; letter-spacing: -.045em; }
.article-section > p:not(.article-section-label) { font-size: 1rem; line-height: 2; }
.article-section ol { margin: 2rem 0 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; counter-reset: point; }
.article-section li { display: grid; grid-template-columns: 2.5rem 1fr; gap: .5rem; padding: .8rem 0; border-bottom: 1px solid var(--line); font-weight: 650; counter-increment: point; }
.article-section li::before { color: var(--red-dark); font: .7rem/1.8 var(--mono); content: "0" counter(point); }

.before-after { margin: 1rem 0 6rem; padding: 2rem; color: var(--white); background: var(--ink); }
.before-after .article-section-label { color: #efbd6b; }
.before-after > div { display: grid; grid-template-columns: 6rem 1fr; gap: 1rem; padding: 1rem 0; border-top: 1px solid #687386; }
.before-after > div span { color: #efbd6b; font: .65rem/1.8 var(--mono); }
.before-after > div p { margin: 0; font-family: var(--serif); font-size: 1.2rem; line-height: 1.7; }
.before-after strong { display: block; margin-top: 1.5rem; color: #cfd5df; font-size: .8rem; line-height: 1.8; }

.pitfall-section { margin-bottom: 6rem; padding: 2rem 0; border-top: 6px solid var(--red); border-bottom: 1px solid var(--ink); }
.pitfall-section ul { margin: 0; padding: 0; list-style: none; }
.pitfall-section li { padding: .8rem 0; border-top: 1px solid var(--line); }
.pitfall-section li::before { margin-right: .7rem; color: var(--red); content: "×"; }

.article-check { padding: 3rem; background: #e6e2d5; scroll-margin-top: 10rem; }
.article-check details { border-top: 1px solid var(--ink); }
.article-check details:last-child { border-bottom: 1px solid var(--ink); }
.article-check summary { padding: 1rem 0; font-size: .8rem; font-weight: 750; cursor: pointer; }
.article-check details p { margin: 0; padding: 0 0 1.2rem; line-height: 1.9; }
.article-attempt { display: grid; gap: .65rem; margin-top: 2rem; }
.article-attempt > span { color: var(--red-dark); font: 800 .66rem/1.5 var(--mono); }
.article-attempt textarea { width: 100%; padding: 1rem; color: inherit; background: rgba(255,255,255,.48); border: 1px solid var(--ink); border-radius: 0; font: inherit; line-height: 1.85; resize: vertical; }
.article-attempt small { color: var(--muted); font-size: .68rem; line-height: 1.6; }
.article-support-actions { display: flex; margin-top: 1rem; }
.article-support-actions button { min-height: 44px; padding: .65rem 1rem; color: inherit; background: transparent; border: 1px solid var(--ink); border-right: 0; border-radius: 0; font-weight: 800; cursor: pointer; }
.article-support-actions button:last-child { border-right: 1px solid var(--ink); }
.article-support-actions button:disabled { cursor: not-allowed; opacity: .4; }
.article-support-result { display: none; margin-top: 1rem; padding: 1rem; background: #f4eee2; border-left: 7px solid #efbd6b; }
.article-support-result.is-visible { display: block; }
.article-support-result span { color: var(--red-dark); font: 800 .6rem/1.4 var(--mono); }
.article-support-result p { margin: .5rem 0 0; line-height: 1.85; }
.article-support-result small { display: block; margin-top: .7rem; color: var(--muted); font-size: .68rem; }
.article-support-result.article-answer { border-left-color: var(--green); }
.article-footer { display: grid; grid-template-columns: 1fr auto; gap: .6rem 2rem; margin-top: 4rem; padding-top: 1.5rem; border-top: 1px solid var(--ink); }
.article-footer p { grid-row: 1 / span 2; margin: 0; color: var(--muted); }
.article-footer a { font-size: .78rem; font-weight: 750; }

.podcast-page { background: #202834; }
.podcast-page .site-header { background: rgba(244, 241, 232, .98); }
.podcast-hero { padding: clamp(4.5rem, 8vw, 7rem) 0; color: var(--white); background: #202834; border-bottom: 1px solid #697383; }
.podcast-hero-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(3rem, 8vw, 8rem); align-items: end; }
.podcast-hero .eyebrow { color: #efbd6b; }
.podcast-hero h1 { margin: 0; font-size: clamp(3.5rem, 6.6vw, 6.8rem); line-height: .98; letter-spacing: -.065em; }
.podcast-hero h1 em { color: #efbd6b; font-family: var(--serif); font-weight: 500; font-style: normal; }
.podcast-hero .page-credit { color: #b9c1cc; }
.podcast-hero .container > div:first-child > p:last-child { max-width: 42rem; margin-top: 2rem; color: #cbd1da; line-height: 1.95; }

.radio-mark { padding: 1.5rem; border: 1px solid #9ba6b4; border-top: 8px solid #efbd6b; }
.radio-mark > span { color: #aeb8c5; font: .66rem/1 var(--mono); letter-spacing: .16em; }
.radio-mark > strong { display: block; margin: .4rem 0 2rem; color: var(--white); font: 400 clamp(3rem, 6vw, 6rem)/1 Georgia, serif; letter-spacing: -.06em; }
.radio-mark > div { display: flex; height: 7rem; align-items: center; gap: .35rem; border-top: 1px solid #687383; border-bottom: 1px solid #687383; }
.radio-mark i { flex: 1; height: 1.4rem; max-height: 5.8rem; background: #efbd6b; }
.radio-mark i:nth-child(4n + 1) { height: 4.8rem; }
.radio-mark i:nth-child(4n + 2) { height: 2.7rem; }
.radio-mark i:nth-child(4n + 3) { height: 5.7rem; }
.radio-mark i:nth-child(8n) { height: 3.8rem; }

.mode-switch-dark { position: static; color: var(--white); background: #202834; border-color: #697383; }
.mode-switch-dark a { border-color: #697383; }
.mode-switch-dark a[aria-current="page"], .mode-switch-dark a:hover { color: var(--ink); background: #efbd6b; }
.mode-switch-dark a[aria-current="page"] span, .mode-switch-dark a:hover span { color: var(--red-dark); }

.now-playing { position: sticky; z-index: 15; top: 78px; display: flex; gap: 1rem; justify-content: center; padding: .8rem 1rem; color: var(--ink); background: #efbd6b; border-bottom: 1px solid var(--ink); }
.now-playing span { font: 700 .63rem/1.8 var(--mono); letter-spacing: .1em; }
.now-playing strong { font-size: .76rem; }
.podcast-section { padding: clamp(4rem, 8vw, 7rem) 0 8rem; color: var(--white); background: #202834; }
.podcast-guide { display: flex; justify-content: space-between; gap: 3rem; margin-bottom: 4rem; padding-bottom: 1.2rem; border-bottom: 1px solid #697383; }
.podcast-guide p { max-width: 42rem; margin: 0; color: #cbd1da; line-height: 1.9; }
.podcast-guide span { color: #efbd6b; font: .65rem/1.8 var(--mono); letter-spacing: .09em; }
.podcast-list { border-top: 1px solid #697383; }
.podcast-episode { scroll-margin-top: 9rem; padding: 2.3rem 0 3rem; border-bottom: 1px solid #697383; }
.podcast-episode > header { display: grid; grid-template-columns: 5rem minmax(18rem, .9fr) minmax(20rem, 1.1fr); gap: 1.5rem; align-items: start; }
.episode-number { color: #efbd6b; font: .74rem/1.5 var(--mono); }
.episode-title p { margin: 0 0 .35rem; color: #aeb8c5; font: .63rem/1.3 var(--mono); }
.episode-title h2 { margin: 0; color: var(--white); font-size: clamp(1.7rem, 3vw, 2.8rem); line-height: 1.15; letter-spacing: -.04em; }
.episode-question { margin: 0; padding-left: 1.5rem; border-left: 1px solid #697383; color: #e4e7eb; font-family: var(--serif); font-size: 1.15rem; line-height: 1.7; }
.episode-description { margin: 1.5rem 0 1.2rem 6.5rem; color: #b9c1cc; font-size: .82rem; }
.podcast-episode audio { display: block; width: calc(100% - 6.5rem); height: 48px; margin-left: 6.5rem; accent-color: #efbd6b; }
.episode-actions { display: flex; gap: 1.5rem; margin: 1rem 0 0 6.5rem; }
.episode-actions a { color: #efbd6b; font-size: .72rem; font-weight: 750; }
.transcript { margin: 2rem 0 0 6.5rem; border-top: 1px solid #697383; }
.transcript summary { padding: 1rem 0; color: #dce1e7; font-size: .76rem; font-weight: 750; cursor: pointer; }
.transcript > div { max-width: 48rem; padding: 1rem 0 2rem; }
.transcript p { color: #c5ccd6; font-size: .92rem; line-height: 2; }
.podcast-page .site-footer { color: var(--ink); background: var(--paper); }

@media (max-width: 1000px) {
  .learning-mode-grid { grid-template-columns: 1fr; }
  .learning-mode-card { min-height: 20rem; border-right: 0; border-bottom: 1px solid var(--ink); }
  .learning-mode-card:last-child { border-bottom: 0; }
  .learning-mode-card h2 { margin-top: 2rem; }
  .cross-media-row { grid-template-columns: 3rem 1fr; }
  .topic-media-links { grid-column: 2; border-top: 1px solid var(--ink); }
  .reading-layout { grid-template-columns: 13rem minmax(0, 1fr); gap: 3rem; }
  .podcast-episode > header { grid-template-columns: 4rem 1fr; }
  .episode-question { grid-column: 2; margin-top: 1rem; }
}

@media (max-width: 840px) {
  .learning-hero h1 { font-size: clamp(3.2rem, 12vw, 5rem); }
  .compact-learning-head .container, .podcast-hero-grid, .reading-layout { grid-template-columns: 1fr; }
  .reading-index { position: static; display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--ink); }
  .reading-index button { border-right: 1px solid var(--line); }
  .learning-article { max-width: none; }
  .podcast-guide { display: grid; }
}

@media (max-width: 600px) {
  .learning-hero { padding-top: 3.5rem; }
  .learning-hero h1 { font-size: clamp(2.8rem, 14vw, 4rem); }
  .learning-hero > .container > p:last-child { margin-left: 0; }
  .learning-mode-card { padding: 1.5rem; }
  .cross-media-row { grid-template-columns: 2rem 1fr; gap: .8rem; }
  .topic-summary { padding-right: 0; }
  .topic-media-links { grid-template-columns: 1fr; }
  .topic-media-links a { min-height: 4.7rem; border-right: 0; border-bottom: 1px solid var(--ink); }
  .topic-media-links a:last-child { border-bottom: 0; }
  .compact-learning-head h1, .podcast-hero h1 { font-size: clamp(2.8rem, 14vw, 4.2rem); }
  .mode-switch { top: 68px; }
  .mode-switch a { justify-content: center; min-height: 52px; padding: .5rem .25rem; font-size: .66rem; text-align: center; }
  .mode-switch a span { display: none; }
  .reading-index { grid-template-columns: 1fr 1fr; }
  .article-head h1 { font-size: clamp(2.7rem, 13vw, 4rem); }
  .article-media-actions { display: grid; }
  .article-media-actions .button-secondary { border-top: 0; border-left: 1px solid var(--ink); }
  .article-toc { grid-template-columns: 1fr; }
  .before-after, .article-check { padding: 1.3rem; }
  .before-after > div { grid-template-columns: 1fr; }
  .article-footer { grid-template-columns: 1fr; }
  .article-footer p { grid-row: auto; }
  .radio-mark { margin-top: 2rem; }
  .now-playing { top: 68px; justify-content: flex-start; }
  .podcast-episode > header { grid-template-columns: 1fr; }
  .episode-question { grid-column: 1; padding: 1rem 0 0; border-top: 1px solid #697383; border-left: 0; }
  .episode-description, .podcast-episode audio, .episode-actions, .transcript { width: 100%; margin-left: 0; }
  .episode-actions { display: grid; gap: .6rem; }
  .mode-switch + .toolbar { top: 120px; }
  .player-head { justify-content: flex-end; padding-inline: .65rem; }
  .player-title { display: none; }
  .player-head [data-related-page],
  .player-head [data-related-podcast],
  .player-head [data-hint-toggle] { display: inline-flex; min-height: 32px; padding-inline: 7px; font-size: .55rem; }
  .player-head-actions { gap: 5px; }
}

/* Unit learning — every concept is taught, connected, practised, and checked in place. */
.unit-learning-page { background: var(--paper); }
.unit-loading-credit { margin: 4rem auto; text-align: center; }
.unit-learning-hero { padding: clamp(4rem, 8vw, 7.5rem) 0 clamp(3rem, 6vw, 5.5rem); color: var(--paper); background: var(--ink); border-bottom: 1px solid #646b77; }
.unit-breadcrumb { display: flex; gap: .7rem; margin-bottom: 3.5rem; color: #b8bec7; font: .67rem/1.6 var(--mono); letter-spacing: .08em; }
.unit-breadcrumb a { color: #efbd6b; }
.unit-learning-hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(3rem, 8vw, 8rem); align-items: end; }
.unit-learning-hero .eyebrow { color: #efbd6b; }
.unit-learning-hero h1 { max-width: 14ch; margin: .8rem 0 0; font-size: clamp(3rem, 5.5vw, 5.8rem); line-height: 1; letter-spacing: -.065em; }
.unit-learning-hero .page-credit { color: #b8bec7; }
.unit-central-question { padding: 1.7rem 0; border-top: 7px solid #efbd6b; border-bottom: 1px solid #6d7684; }
.unit-central-question span { display: block; margin-bottom: 1rem; color: #efbd6b; font: .68rem/1.4 var(--mono); letter-spacing: .1em; }
.unit-central-question strong { display: block; font-family: var(--serif); font-size: clamp(1.45rem, 2.6vw, 2.4rem); font-weight: 500; line-height: 1.55; }
.unit-scenario { max-width: 67rem; margin: 4rem 0 0; padding-left: clamp(0rem, 8vw, 8rem); color: #d3d7de; font-family: var(--serif); font-size: clamp(1rem, 1.6vw, 1.25rem); line-height: 2; }

.unit-progress-bar { position: sticky; z-index: 20; top: 78px; background: #efbd6b; border-bottom: 1px solid var(--ink); }
.unit-progress-bar .container { display: grid; grid-template-columns: 12rem minmax(12rem, 1fr) 20rem; gap: 1.5rem; align-items: center; min-height: 68px; }
.unit-progress-bar .container > div { display: grid; }
.unit-progress-bar span, .unit-progress-bar label { font: .62rem/1.5 var(--mono); letter-spacing: .08em; }
.unit-progress-bar strong { font-size: .78rem; }
.unit-progress-bar progress { width: 100%; height: 7px; appearance: none; border: 0; background: #dca84f; }
.unit-progress-bar progress::-webkit-progress-bar { background: #dca84f; }
.unit-progress-bar progress::-webkit-progress-value { background: var(--ink); }
.unit-progress-bar progress::-moz-progress-bar { background: var(--ink); }
.unit-progress-bar label { display: grid; grid-template-columns: auto 1fr; gap: .7rem; align-items: center; }
.unit-progress-bar select { width: 100%; min-width: 0; padding: .5rem 2rem .5rem .6rem; color: var(--ink); background: #f3d99b; border: 1px solid var(--ink); border-radius: 0; font: 700 .7rem/1.3 var(--sans); }

.unit-orientation { padding: clamp(5rem, 9vw, 8rem) 0; }
.unit-orientation > .container { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(3rem, 8vw, 8rem); }
.learning-label { margin: 0 0 1rem; color: var(--red-dark); font: 700 .66rem/1.4 var(--mono); letter-spacing: .11em; }
.unit-outcome h2 { max-width: 13ch; margin: 0; font-size: clamp(2.4rem, 4.8vw, 4.9rem); line-height: 1.08; letter-spacing: -.055em; }
.unit-outcome > p:not(.learning-label) { max-width: 42rem; margin: 2rem 0; font-family: var(--serif); font-size: 1.18rem; line-height: 1.9; }
.unit-outcome > div { padding: 1.2rem 0; border-top: 5px solid var(--red); border-bottom: 1px solid var(--ink); }
.unit-outcome > div span { display: block; margin-bottom: .55rem; color: var(--red-dark); font: .65rem/1.4 var(--mono); }
.unit-outcome > div strong { font-size: .95rem; line-height: 1.75; }
.unit-concept-roles { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.unit-concept-roles section { min-width: 0; border-right: 1px solid var(--ink); }
.unit-concept-roles section > p { margin: 0; padding: .75rem 1rem; color: var(--paper); background: var(--ink); border-bottom: 1px solid var(--ink); font: .65rem/1.4 var(--mono); }
.unit-concept-roles section + section > p { color: var(--ink); background: #dcd8cc; }
.unit-concept-roles a { display: grid; grid-template-columns: 5.4rem 1fr; gap: .7rem; padding: .8rem 1rem; color: inherit; border-bottom: 1px solid var(--line); text-decoration: none; font-size: .76rem; line-height: 1.45; }
.unit-concept-roles a:hover { color: var(--white); background: var(--red-dark); }
.unit-concept-roles a span { font: .59rem/1.5 var(--mono); }
.all-core-note { display: block; padding: 1rem; color: var(--muted); font-size: .76rem; }

.unit-learning-entry { display: grid; grid-template-columns: 9rem 1fr; gap: .25rem 1rem; margin: 2rem 0; padding: 1.2rem; color: var(--paper); background: var(--ink); border-top: 6px solid #efbd6b; text-decoration: none; }
.unit-learning-entry:hover { background: var(--red-dark); }
.unit-learning-entry span { grid-row: 1 / span 2; color: #efbd6b; font: .62rem/1.5 var(--mono); letter-spacing: .08em; }
.unit-learning-entry strong { font-family: var(--serif); font-size: 1.05rem; }
.unit-learning-entry small { color: #c9ced5; font-size: .72rem; line-height: 1.6; }
.concept-row summary strong { display: flex; gap: .7rem; align-items: baseline; }
.concept-row summary strong em { display: block; margin-left: auto; color: var(--muted); font: normal .6rem/1.45 var(--mono); }
.concept-row summary strong small { flex: 0 0 auto; padding: .2rem .4rem; color: var(--red-dark); border: 1px solid currentColor; font: 700 .55rem/1 var(--mono); }
.concept-learn-link { display: inline-block; margin-top: 1rem; color: var(--red-dark); font-size: .72rem; font-weight: 750; }

.unit-sequence { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--surface); }
.unit-sequence .container { display: grid; grid-template-columns: repeat(7, 1fr); overflow-x: auto; }
.unit-sequence a { position: relative; display: grid; min-width: 9.5rem; min-height: 9rem; align-content: space-between; padding: 1rem; color: inherit; border-right: 1px solid var(--ink); text-decoration: none; }
.unit-sequence a:first-child { border-left: 1px solid var(--ink); }
.unit-sequence a::after { position: absolute; right: .7rem; bottom: .7rem; width: 9px; height: 9px; border: 1px solid var(--ink); content: ""; }
.unit-sequence a.is-complete::after { background: var(--green); }
.unit-sequence a > span { color: var(--red-dark); font: .67rem/1 var(--mono); }
.unit-sequence a > small { align-self: end; color: var(--muted); font: .58rem/1.4 var(--mono); }
.unit-sequence a > strong { font-size: .8rem; line-height: 1.45; }

.unit-concept-lessons { background: var(--paper); }
.unit-concept { scroll-margin-top: 9rem; padding: clamp(5rem, 9vw, 9rem) 0; border-bottom: 1px solid var(--ink); }
.unit-concept:nth-child(even) { background: #e8e4d9; }
.unit-concept-head { width: min(calc(100% - 3rem), var(--max-width)); margin: 0 auto clamp(3rem, 6vw, 5.5rem); }
.unit-concept-head > div { display: flex; gap: .8rem; align-items: center; margin-bottom: 1.5rem; }
.unit-concept-head > div span { font: .66rem/1 var(--mono); letter-spacing: .1em; }
.unit-concept-head i { padding: .32rem .55rem; border: 1px solid var(--ink); font: 700 .58rem/1 var(--mono); font-style: normal; }
.unit-concept-head i[data-concept-role="core"] { color: var(--white); background: var(--red-dark); border-color: var(--red-dark); }
.unit-concept-head > p { margin: 0 0 .5rem; color: var(--muted); font: .7rem/1.4 var(--mono); }
.unit-concept-head h2 { max-width: 18ch; margin: 0; font-size: clamp(3rem, 5.5vw, 5.5rem); line-height: .98; letter-spacing: -.065em; }
.concept-formal-name { display: flex; gap: .8rem; align-items: baseline; margin-top: 1.35rem; padding-top: .9rem; border-top: 1px solid var(--ink); }
.concept-formal-name span { color: var(--red-dark); font: 700 .62rem/1.4 var(--mono); letter-spacing: .08em; }
.concept-formal-name strong { font-family: var(--serif); font-size: clamp(1rem, 1.7vw, 1.35rem); }
.concept-learning-grid { display: grid; width: min(calc(100% - 3rem), var(--max-width)); margin: 0 auto; grid-template-columns: repeat(12, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.concept-learning-grid > section { min-width: 0; padding: clamp(1.5rem, 3.5vw, 3rem); border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.concept-learning-grid h3 { margin: 0 0 1.3rem; font-size: clamp(1.45rem, 2.5vw, 2.4rem); line-height: 1.25; letter-spacing: -.035em; }
.concept-learning-grid p { line-height: 1.9; }
.concept-judgment { grid-column: span 5; color: var(--paper); background: var(--ink); }
.concept-judgment .learning-label { color: #efbd6b; }
.concept-judgment blockquote { margin: 2rem 0; padding: 1.5rem 0; color: #efbd6b; border-top: 1px solid #727986; border-bottom: 1px solid #727986; font-family: var(--serif); font-size: clamp(1.2rem, 2.1vw, 1.75rem); line-height: 1.7; }
.concept-judgment > p:last-child { color: #cdd2da; font-size: .83rem; }
.concept-explanation { grid-column: span 7; display: grid; align-content: center; background: var(--surface); }
.concept-explanation > p:not(.learning-label) { max-width: 38rem; font-family: var(--serif); font-size: clamp(1.08rem, 1.7vw, 1.35rem); }
.concept-language-order { display: grid; gap: .45rem; margin-top: 1.5rem; padding: 1rem 0; border-top: 5px solid var(--red); border-bottom: 1px solid var(--ink); }
.concept-language-order span { color: var(--muted); font: 700 .58rem/1.5 var(--mono); letter-spacing: .06em; }
.concept-language-order strong { font-family: var(--serif); font-size: .92rem; line-height: 1.55; }
.concept-key-terms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1.4rem; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.concept-key-terms details { min-width: 0; background: var(--paper); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.concept-key-terms summary { display: grid; gap: .25rem; min-height: 3.5rem; align-content: center; padding: .7rem; color: var(--red-dark); font: 700 .64rem/1.4 var(--mono); cursor: pointer; }
.concept-key-terms summary small { color: var(--muted); font-size: .58rem; }
.concept-key-terms details > p { margin: 0; padding: 0 .7rem .8rem; font-family: var(--sans); font-size: .7rem; line-height: 1.7; }
.concept-correction { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--ink); }
.concept-correction span, .concept-example aside span, .concept-transfer span, .unit-source-note span { display: block; margin-bottom: .55rem; color: var(--red-dark); font: 700 .6rem/1.4 var(--mono); letter-spacing: .08em; }
.concept-correction strong { display: block; font-size: .82rem; line-height: 1.75; }
.concept-mechanism { grid-column: span 7; }
.concept-mechanism ol { margin: 2rem 0 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; counter-reset: mechanism; }
.concept-mechanism li { display: grid; grid-template-columns: 9rem 1fr; gap: 1.25rem; padding: 1.1rem 0; border-bottom: 1px solid var(--line); counter-increment: mechanism; }
.concept-mechanism li span { color: var(--red-dark); font: 700 .65rem/1.5 var(--mono); }
.concept-mechanism li span::before { margin-right: .65rem; content: "0" counter(mechanism); }
.concept-mechanism li p { margin: 0; font-size: .86rem; }
.concept-boundary { margin-top: 1.5rem; padding: 1.1rem 0 0; border-top: 5px solid var(--blue); }
.concept-boundary span { display: block; margin-bottom: .45rem; color: var(--blue); font: 700 .6rem/1.4 var(--mono); letter-spacing: .08em; }
.concept-boundary p { margin: 0; font-size: .78rem; }
.concept-example { grid-column: span 5; background: #ece4d5; }
.concept-example > p:not(.learning-label) { font-family: var(--serif); font-size: 1.12rem; line-height: 1.9; }
.concept-example aside { margin-top: 2rem; padding: 1.2rem 0; border-top: 5px solid var(--red); border-bottom: 1px solid var(--ink); }
.concept-example aside p { margin: 0; font-size: .78rem; }
.concept-prerequisites { grid-column: 1 / -1; }
.concept-prerequisites > div { display: grid; grid-template-columns: repeat(3, 1fr); margin: 2rem calc(clamp(1.5rem, 3.5vw, 3rem) * -1) calc(clamp(1.5rem, 3.5vw, 3rem) * -1); border-top: 1px solid var(--ink); }
.concept-prerequisites article { min-height: 15rem; padding: 1.5rem; border-right: 1px solid var(--ink); }
.concept-prerequisites article:last-child { border-right: 0; }
.concept-prerequisites article > span { color: var(--red-dark); font: .62rem/1.5 var(--mono); }
.concept-prerequisites h4 { margin: .7rem 0; font-size: 1rem; line-height: 1.5; }
.concept-prerequisites article p { color: var(--muted); font-size: .78rem; }
.concept-prerequisites a { color: var(--red-dark); font-size: .68rem; font-weight: 750; }
.concept-action { grid-column: span 7; }
.concept-action > p:not(.learning-label) { max-width: 42rem; font-family: var(--serif); font-size: 1.15rem; }
.concept-action label, .synthesis-task label { display: grid; gap: .5rem; margin-top: 2rem; }
.concept-action label span, .synthesis-task label span { font: 700 .66rem/1.4 var(--mono); letter-spacing: .07em; }
.concept-action textarea, .synthesis-task textarea { width: 100%; padding: 1rem; color: var(--ink); background: rgba(255, 255, 255, .5); border: 1px solid var(--ink); border-radius: 0; font: inherit; line-height: 1.8; resize: vertical; }
.concept-action textarea:focus, .synthesis-task textarea:focus { outline: 3px solid #efbd6b; outline-offset: 2px; }
.model-response { margin-top: 1rem; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.model-response summary { padding: .8rem 0; font-size: .75rem; font-weight: 750; cursor: pointer; }
.model-response p { margin: 0; padding: 1rem 0 .5rem; font-family: var(--serif); font-size: .88rem; }
.model-response small { display: block; padding-bottom: 1rem; color: var(--muted); font-size: .68rem; line-height: 1.65; }
.concept-check { grid-column: span 5; color: var(--paper); background: #293443; }
.concept-check .learning-label { color: #efbd6b; }
.concept-check h3 { font-size: clamp(1.25rem, 2vw, 1.8rem); }
.concept-quiz { display: grid; gap: .75rem; margin-top: 1.5rem; }
.concept-quiz button { display: grid; grid-template-columns: 2rem 1fr; gap: .8rem; width: 100%; padding: 1rem; color: var(--paper); background: transparent; border: 1px solid #7b8796; border-radius: 0; text-align: left; font: inherit; font-size: .78rem; line-height: 1.7; cursor: pointer; }
.concept-quiz button:hover, .concept-quiz button[aria-pressed="true"] { color: var(--ink); background: #efbd6b; border-color: #efbd6b; }
.concept-quiz button span { font: 700 .75rem/1.7 var(--mono); }
.quiz-feedback { display: none; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #7b8796; }
.quiz-feedback.is-visible { display: block; }
.quiz-feedback strong { color: #efbd6b; font-family: var(--serif); }
.quiz-feedback p { margin: .6rem 0 0; color: #d1d6dd; font-size: .76rem; }
.concept-gate { grid-column: 1 / -1; background: #ddd8ca; border-top: 7px solid var(--red); }
.concept-gate > strong { display: block; margin: 1.5rem 0; font-family: var(--serif); font-size: 1.1rem; line-height: 1.75; }
.concept-gate details { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.concept-gate summary { padding: .75rem 0; font-size: .75rem; font-weight: 750; cursor: pointer; }
.concept-gate details div { padding: .5rem 0 1rem; }
.concept-gate details p { margin: .5rem 0; font-size: .76rem; }
.concept-complete { width: 100%; min-height: 48px; margin-top: 1.2rem; color: var(--paper); background: var(--ink); border: 1px solid var(--ink); border-radius: 0; font: 750 .76rem/1.4 var(--sans); cursor: pointer; }
.concept-complete[aria-pressed="true"] { color: var(--ink); background: #efbd6b; }
.concept-relations { grid-column: 1 / -1; }
.concept-relation-list { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 1.5rem; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.concept-relation-list a { display: grid; min-height: 13rem; align-content: start; gap: .7rem; padding: 1.1rem; color: inherit; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); text-decoration: none; }
.concept-relation-list a:hover { background: #ece4d5; }
.concept-relation-list a span, .concept-relation-list a small { color: var(--muted); font: .58rem/1.45 var(--mono); }
.concept-relation-list a strong { font-family: var(--serif); font-size: 1rem; line-height: 1.45; }
.concept-relation-list a p { margin: 0; font-size: .72rem; line-height: 1.75; }
.concept-relation-list a small { margin-top: auto; }
.concept-scj-foundations { margin-top: 2rem; padding-top: 1rem; border-top: 5px solid var(--blue); }
.concept-scj-foundations > p { margin: 0 0 .8rem; color: var(--blue); font: 700 .62rem/1.4 var(--mono); letter-spacing: .08em; }
.concept-scj-foundations a { display: grid; grid-template-columns: minmax(12rem, .55fr) minmax(12rem, .7fr) 1.4fr; gap: 1rem; align-items: baseline; padding: .9rem 0; color: inherit; border-top: 1px solid var(--line); text-decoration: none; }
.concept-scj-foundations a span { color: var(--muted); font: .6rem/1.5 var(--mono); }
.concept-scj-foundations a strong { font-family: var(--serif); font-size: .9rem; }
.concept-scj-foundations a small { color: var(--muted); font-size: .7rem; line-height: 1.7; }
.relation-prompt { margin: 2rem 0 0; padding: 1.2rem 0; border-top: 5px solid var(--red); font-family: var(--serif); font-size: 1.05rem; }
.concept-transfer { margin-top: 1.5rem; padding: 1.2rem 0 0; border-top: 1px solid var(--ink); }
.concept-transfer p { margin: 0; font-size: .8rem; }
.unit-course-deck-link { display: grid; gap: .55rem; margin-top: 1.5rem; padding: 1.2rem; color: var(--paper); background: var(--ink); border-left: 7px solid #efbd6b; text-decoration: none; }
.unit-course-deck-link:hover { background: var(--red-dark); }
.unit-course-deck-link span { color: #efbd6b; font: 700 .6rem/1.4 var(--mono); letter-spacing: .08em; }
.unit-course-deck-link strong { font-family: var(--serif); font-size: .92rem; }
.unit-source-note { margin: 1.2rem 0 0; padding-top: 1rem; border-top: 1px solid var(--ink); }
.unit-source-note a { color: var(--red-dark); font-size: .72rem; line-height: 1.7; }

.unit-curriculum-standard { padding: clamp(5rem, 9vw, 8rem) 0; color: var(--paper); background: #25303d; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.unit-curriculum-standard header { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 7vw, 7rem); align-items: end; }
.unit-curriculum-standard .learning-label { grid-column: 1 / -1; margin-bottom: 0; color: #efbd6b; }
.unit-curriculum-standard h2 { max-width: 16ch; margin: 0; font-size: clamp(2.6rem, 5.2vw, 5.4rem); line-height: 1.02; letter-spacing: -.06em; }
.unit-curriculum-standard header > p:last-child { margin: 0; color: #c9d0d9; font-family: var(--serif); font-size: 1rem; line-height: 1.9; }
.curriculum-standard-grid { display: grid; grid-template-columns: repeat(2, 1fr); margin-top: 4rem; border-top: 1px solid #77818d; border-left: 1px solid #77818d; }
.curriculum-standard-grid article { min-height: 13rem; padding: 1.5rem; border-right: 1px solid #77818d; border-bottom: 1px solid #77818d; }
.curriculum-standard-grid span, .curriculum-source-ledger span, .curriculum-practical > div:first-child > span { color: #efbd6b; font: 700 .63rem/1.4 var(--mono); letter-spacing: .08em; }
.curriculum-standard-grid p { margin: 1.2rem 0 0; font-family: var(--serif); font-size: 1rem; line-height: 1.85; }
.curriculum-source-ledger { display: grid; grid-template-columns: 1fr 1fr; margin-top: 2rem; border-top: 6px solid #efbd6b; border-bottom: 1px solid #77818d; }
.curriculum-source-ledger a { display: grid; gap: .45rem; padding: 1.2rem 1.2rem 1.2rem 0; color: inherit; border-right: 1px solid #77818d; text-decoration: none; }
.curriculum-source-ledger a + a { padding-left: 1.2rem; border-right: 0; }
.curriculum-source-ledger a:hover strong { color: #efbd6b; }
.curriculum-source-ledger strong { font-family: var(--serif); font-size: .92rem; line-height: 1.6; }
.curriculum-source-ledger small { color: #bfc7d1; font: .65rem/1.5 var(--mono); }
.curriculum-practical { display: grid; grid-template-columns: .65fr 1.35fr; gap: 2.5rem; margin-top: 4rem; padding-top: 2rem; border-top: 1px solid #77818d; }
.curriculum-practical h3 { margin: .7rem 0; font-size: clamp(1.55rem, 2.6vw, 2.3rem); }
.curriculum-practical > div:first-child p { color: #c9d0d9; font-size: .78rem; line-height: 1.8; }
.curriculum-practical > div:nth-child(2) { border-top: 1px solid #77818d; }
.curriculum-practical > div:nth-child(2) a { display: grid; grid-template-columns: 7rem 1fr auto; gap: 1rem; align-items: baseline; padding: .9rem 0; color: inherit; border-bottom: 1px solid #77818d; text-decoration: none; }
.curriculum-practical > div:nth-child(2) a:hover { color: #efbd6b; }
.curriculum-practical small { color: #bfc7d1; font: .58rem/1.4 var(--mono); }
.curriculum-practical strong { font-family: var(--serif); font-size: .82rem; line-height: 1.5; }
.curriculum-practical a span { color: #efbd6b; font: .59rem/1.4 var(--mono); }
.curriculum-practice-index { grid-column: 2; justify-self: start; color: #efbd6b; font-size: .7rem; font-weight: 750; }
.concept-curriculum-facets { margin-top: 1.3rem; padding-top: 1rem; border-top: 5px solid #b8892b; }
.concept-curriculum-facets > span { display: block; margin-bottom: .55rem; color: #8b681d; font: 700 .6rem/1.4 var(--mono); letter-spacing: .08em; }
.concept-curriculum-facets p { display: grid; grid-template-columns: minmax(8rem, auto) minmax(9rem, auto) 1fr; gap: .8rem; margin: 0; padding: .65rem 0; border-top: 1px solid var(--line); font-size: .72rem; line-height: 1.65; }
.concept-curriculum-facets b { color: #8b681d; font: 700 .64rem/1.5 var(--mono); }
.concept-curriculum-facets i { color: var(--muted); font-style: normal; }

.unit-synthesis { padding: clamp(6rem, 11vw, 11rem) 0; color: var(--paper); background: #202834; }
.unit-synthesis > .container { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 9vw, 9rem); }
.unit-synthesis .eyebrow, .synthesis-task > span, .synthesis-transfer span { color: #efbd6b; }
.synthesis-head h2 { margin: 1rem 0 0; font-size: clamp(3rem, 5.8vw, 5.9rem); line-height: 1; letter-spacing: -.06em; }
.synthesis-task { padding-top: 1.5rem; border-top: 7px solid #efbd6b; }
.synthesis-task > span, .synthesis-transfer span { font: .66rem/1.4 var(--mono); letter-spacing: .1em; }
.synthesis-task > p { font-family: var(--serif); font-size: clamp(1.15rem, 2vw, 1.55rem); line-height: 1.8; }
.synthesis-task textarea { color: var(--paper); background: #293443; border-color: #828c99; }
.synthesis-task dl { display: grid; grid-template-columns: 1fr 1fr; margin: 2rem 0 0; border-top: 1px solid #78828f; border-left: 1px solid #78828f; }
.synthesis-task dl div { padding: 1rem; border-right: 1px solid #78828f; border-bottom: 1px solid #78828f; }
.synthesis-task dt { color: #efbd6b; font: .63rem/1.4 var(--mono); }
.synthesis-task dd { margin: .5rem 0 0; color: #d1d6dd; font-size: .8rem; line-height: 1.8; }
.synthesis-transfer { margin-top: 2rem; padding: 1rem 0; border-top: 1px solid #78828f; border-bottom: 1px solid #78828f; }
.synthesis-transfer strong { display: block; margin-top: .5rem; color: var(--white); font-family: var(--serif); font-size: 1.05rem; line-height: 1.7; }
.synthesis-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 2rem; }
.unit-synthesis .button-secondary { color: var(--paper); border-color: #78828f; }

@media (max-width: 960px) {
  .unit-progress-bar .container { grid-template-columns: 10rem 1fr; }
  .unit-progress-bar label { grid-column: 1 / -1; padding-bottom: .7rem; }
  .unit-orientation > .container, .unit-synthesis > .container { grid-template-columns: 1fr; }
  .unit-concept-roles { max-width: 46rem; }
  .concept-prerequisites > div { grid-template-columns: 1fr 1fr; }
  .unit-curriculum-standard header { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .unit-learning-hero-grid { grid-template-columns: 1fr; }
  .unit-learning-hero h1 { font-size: clamp(2.7rem, 13vw, 4.2rem); }
  .unit-scenario { margin-top: 2.5rem; padding-left: 0; }
  .unit-progress-bar { top: 68px; }
  .unit-progress-bar .container { grid-template-columns: 1fr; gap: .4rem; padding-block: .65rem; }
  .unit-progress-bar label { display: none; }
  .unit-concept-roles { grid-template-columns: 1fr; }
  .unit-concept-roles section { border-bottom: 1px solid var(--ink); }
  .unit-sequence .container { width: 100%; }
  .unit-concept-head, .concept-learning-grid { width: min(calc(100% - 2rem), var(--max-width)); }
  .unit-concept-head h2 { font-size: clamp(2.7rem, 14vw, 4.3rem); }
  .concept-formal-name { align-items: flex-start; flex-direction: column; }
  .concept-key-terms { grid-template-columns: 1fr; }
  .concept-judgment, .concept-explanation, .concept-mechanism, .concept-example, .concept-action, .concept-check, .concept-gate { grid-column: 1 / -1; }
  .concept-mechanism li { grid-template-columns: 1fr; gap: .35rem; }
  .concept-prerequisites > div, .concept-relation-list { grid-template-columns: 1fr; }
  .curriculum-standard-grid, .curriculum-source-ledger, .curriculum-practical { grid-template-columns: 1fr; }
  .curriculum-standard-grid article { min-height: 0; }
  .curriculum-source-ledger a, .curriculum-source-ledger a + a { padding: 1rem 0; border-right: 0; }
  .curriculum-source-ledger a + a { border-top: 1px solid #77818d; }
  .curriculum-practical > div:nth-child(2) a { grid-template-columns: 5rem 1fr; }
  .curriculum-practical > div:nth-child(2) a span { grid-column: 2; }
  .curriculum-practice-index { grid-column: 1; }
  .concept-curriculum-facets p { grid-template-columns: 1fr; gap: .2rem; }
  .concept-scj-foundations a { grid-template-columns: 1fr; gap: .35rem; }
  .concept-prerequisites article { min-height: 0; border-bottom: 1px solid var(--ink); }
  .concept-prerequisites article:last-child { border-bottom: 0; }
  .synthesis-task dl { grid-template-columns: 1fr; }
  .synthesis-actions { display: grid; }
}

/* Information education principles — a quiet editorial manifesto. */
.foundation-page { background: var(--paper); }
.foundation-hero { padding: clamp(5rem, 10vw, 9rem) 0 clamp(3rem, 7vw, 6rem); border-bottom: 1px solid var(--ink); }
.foundation-hero > .container { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(3rem, 9vw, 9rem); align-items: end; }
.foundation-hero h1 { max-width: 10ch; margin: .8rem 0 1.2rem; font-size: clamp(3.6rem, 7.5vw, 7.7rem); line-height: .94; letter-spacing: -.07em; }
.foundation-hero div > p:last-child { max-width: 42rem; font-family: var(--serif); font-size: 1.08rem; line-height: 1.9; }
.foundation-hero aside { padding: 1.5rem 0; border-top: 8px solid var(--ink); border-bottom: 1px solid var(--ink); }
.foundation-hero aside > span { color: var(--red-dark); font: 700 .65rem/1.4 var(--mono); letter-spacing: .08em; }
.foundation-hero aside > strong { display: block; margin: 1.5rem 0 2.5rem; font-family: var(--serif); font-size: clamp(1.35rem, 2.6vw, 2.2rem); line-height: 1.55; }
.foundation-hero aside label { display: grid; gap: .5rem; font: 700 .65rem/1.4 var(--mono); }
.foundation-hero select { min-height: 44px; padding: .6rem; color: var(--ink); background: var(--surface); border: 1px solid var(--ink); border-radius: 0; font: inherit; }
.foundation-progress { position: sticky; z-index: 7; top: 78px; color: var(--paper); background: var(--ink); border-bottom: 1px solid #555f6b; }
.foundation-progress .container { display: grid; grid-template-columns: auto auto minmax(8rem, 1fr) repeat(3, auto); gap: 1rem; align-items: center; min-height: 58px; }
.foundation-progress span { color: #efbd6b; font: .62rem/1 var(--mono); }
.foundation-progress strong { font: .68rem/1 var(--mono); }
.foundation-progress progress { width: 100%; height: 7px; appearance: none; border: 0; background: #626b76; }
.foundation-progress progress::-webkit-progress-bar { background: #626b76; }
.foundation-progress progress::-webkit-progress-value { background: #efbd6b; }
.foundation-progress a { padding: .5rem .7rem; color: #cfd4db; border: 1px solid #68727e; text-decoration: none; font: .62rem/1.3 var(--mono); }
.foundation-progress a.is-complete { color: var(--ink); background: #efbd6b; border-color: #efbd6b; }
.foundation-stage { scroll-margin-top: 9rem; padding: clamp(5rem, 9vw, 9rem) 0; border-bottom: 1px solid var(--ink); }
.foundation-stage:nth-child(even) { background: #e8e4d9; }
.foundation-stage > header { width: min(calc(100% - 3rem), var(--max-width)); margin: 0 auto clamp(3rem, 6vw, 5rem); }
.foundation-stage > header > div { display: flex; gap: .7rem; align-items: center; }
.foundation-stage > header > div span, .foundation-stage > header > p { font: .65rem/1.4 var(--mono); }
.foundation-stage > header i { padding: .3rem .5rem; color: var(--paper); background: var(--red-dark); font: 700 .58rem/1 var(--mono); font-style: normal; }
.foundation-stage > header > p { margin: 1.5rem 0 .5rem; color: var(--muted); }
.foundation-stage h2 { max-width: 18ch; margin: 0; font-size: clamp(2.8rem, 5.3vw, 5.3rem); line-height: 1.03; letter-spacing: -.055em; }
.stage-language-note { display: inline-block; margin-top: 1.25rem; padding-top: .75rem; color: var(--red-dark); border-top: 1px solid var(--ink); font: 700 .62rem/1.5 var(--mono); letter-spacing: .05em; }
.foundation-stage-grid { display: grid; width: min(calc(100% - 3rem), var(--max-width)); margin: 0 auto; grid-template-columns: repeat(12, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.foundation-stage-grid > section { min-width: 0; padding: clamp(1.5rem, 3.5vw, 3rem); border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.foundation-stage-grid h3 { margin: 0 0 1.3rem; font-size: clamp(1.4rem, 2.4vw, 2.2rem); line-height: 1.3; }
.foundation-misconception { grid-column: span 5; color: var(--paper); background: var(--ink); }
.foundation-misconception .learning-label { color: #efbd6b; }
.foundation-misconception blockquote { margin: 1.5rem 0; padding: 1.2rem 0; color: #efbd6b; border-top: 1px solid #6c7580; border-bottom: 1px solid #6c7580; font-family: var(--serif); font-size: 1.15rem; line-height: 1.75; }
.foundation-misconception > p:last-child { color: #d1d6dd; font-size: .8rem; line-height: 1.8; }
.foundation-terms { grid-column: span 7; background: var(--surface); }
.foundation-terms > div { margin-top: 2rem; border-top: 1px solid var(--ink); }
.foundation-terms article { display: grid; grid-template-columns: 12rem 1fr; gap: 1.5rem; padding: 1.2rem 0; border-bottom: 1px solid var(--line); }
.foundation-terms h4, .foundation-terms p { margin: 0; }
.foundation-terms h4 { color: var(--ink); font-family: var(--serif); font-size: 1rem; line-height: 1.55; }
.foundation-terms p { font-size: .78rem; line-height: 1.75; }
.foundation-term-name > p { display: grid; gap: .25rem; margin-top: .65rem; color: var(--red-dark); font: 700 .62rem/1.45 var(--mono); }
.foundation-term-name > p span { color: var(--muted); font-size: .56rem; letter-spacing: .06em; }
.foundation-term-body details { margin-top: .7rem; border-top: 1px solid var(--line); }
.foundation-term-body summary { padding: .55rem 0; color: var(--red-dark); font-size: .67rem; font-weight: 750; cursor: pointer; }
.foundation-process { grid-column: span 7; }
.foundation-process ol { margin: 2rem 0 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; counter-reset: foundation-step; }
.foundation-process li { display: grid; grid-template-columns: 8rem 1fr; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line); counter-increment: foundation-step; }
.foundation-process li span { color: var(--red-dark); font: 700 .63rem/1.5 var(--mono); }
.foundation-process li span::before { margin-right: .5rem; content: "0" counter(foundation-step); }
.foundation-process li p { margin: 0; font-size: .8rem; line-height: 1.8; }
.foundation-activity { grid-column: span 5; background: #ece4d5; }
.foundation-activity h3 { font-family: var(--serif); font-size: 1.15rem; line-height: 1.75; }
.foundation-activity label { display: grid; gap: .5rem; margin-top: 1.5rem; font: 700 .65rem/1.4 var(--mono); }
.foundation-activity textarea { width: 100%; padding: 1rem; color: var(--ink); background: rgba(255,255,255,.55); border: 1px solid var(--ink); border-radius: 0; font: 400 .82rem/1.8 var(--sans); resize: vertical; }
.foundation-activity details { margin-top: 1rem; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.foundation-activity summary { padding: .8rem 0; font-size: .72rem; font-weight: 750; cursor: pointer; }
.foundation-activity details p { font-family: var(--serif); font-size: .82rem; line-height: 1.8; }
.foundation-check { grid-column: span 7; color: var(--paper); background: #293443; }
.foundation-check .learning-label { color: #efbd6b; }
.foundation-check > div { display: grid; gap: .8rem; }
.foundation-check button { display: grid; grid-template-columns: 2rem 1fr; gap: .8rem; padding: 1rem; color: var(--paper); background: transparent; border: 1px solid #7b8796; border-radius: 0; text-align: left; font: 400 .8rem/1.7 var(--sans); cursor: pointer; }
.foundation-check button:hover, .foundation-check button[aria-pressed="true"] { color: var(--ink); background: #efbd6b; border-color: #efbd6b; }
.foundation-check button span { font: 700 .74rem/1.7 var(--mono); }
.foundation-check aside { display: none; margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid #7b8796; }
.foundation-check aside.is-visible { display: block; }
.foundation-check aside strong { color: #efbd6b; font-family: var(--serif); }
.foundation-check aside p { color: #d1d6dd; font-size: .76rem; line-height: 1.8; }
.foundation-evidence { grid-column: span 5; background: #ddd8ca; border-top: 7px solid var(--red); }
.foundation-evidence > strong { display: block; font-family: var(--serif); font-size: 1.05rem; line-height: 1.8; }
.foundation-evidence button { width: 100%; min-height: 48px; margin-top: 1.5rem; color: var(--paper); background: var(--ink); border: 1px solid var(--ink); border-radius: 0; font: 750 .75rem/1.4 var(--sans); cursor: pointer; }
.foundation-evidence button[aria-pressed="true"] { color: var(--ink); background: #efbd6b; }
.foundation-connections { grid-column: 1 / -1; background: var(--surface); }
.foundation-connections > p:not(.learning-label) { max-width: 50rem; color: var(--muted); font-size: .82rem; line-height: 1.8; }
.foundation-connections > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 2rem; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.foundation-connections a { display: flex; min-height: 13rem; padding: 1.35rem; color: inherit; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); flex-direction: column; text-decoration: none; }
.foundation-connections a:hover { background: #efe7d9; }
.foundation-connections a span, .foundation-connections a small { color: var(--red-dark); font: 700 .6rem/1.6 var(--mono); }
.foundation-connections a strong { margin-top: .65rem; font-family: var(--serif); font-size: 1rem; line-height: 1.5; }
.foundation-connections a p { margin: .8rem 0 1rem; color: var(--muted); font-size: .74rem; line-height: 1.75; }
.foundation-connections a small { margin-top: auto; color: var(--muted); }
.foundation-next { padding: clamp(6rem, 11vw, 10rem) 0; color: var(--paper); background: #202834; }
.foundation-next h2 { margin: 1rem 0; font-size: clamp(3rem, 6vw, 6rem); line-height: 1; }
.foundation-next p:not(.eyebrow) { max-width: 44rem; color: #d1d6dd; font-family: var(--serif); font-size: 1.1rem; line-height: 1.8; }
.foundation-next .button { margin-top: 1.5rem; }

@media (max-width: 800px) {
  .foundation-hero > .container { grid-template-columns: 1fr; }
  .foundation-progress .container { grid-template-columns: auto 1fr; padding-block: .7rem; }
  .foundation-progress progress { grid-column: 1 / -1; }
  .foundation-progress a { display: none; }
  .foundation-stage > header, .foundation-stage-grid { width: min(calc(100% - 2rem), var(--max-width)); }
  .foundation-misconception, .foundation-terms, .foundation-process, .foundation-activity, .foundation-check, .foundation-evidence, .foundation-connections { grid-column: 1 / -1; }
  .foundation-terms article, .foundation-process li { grid-template-columns: 1fr; gap: .35rem; }
  .foundation-connections > div { grid-template-columns: 1fr; }
  .foundation-connections a { min-height: 0; }
}

/* Elementary studio — the archive stays deep, while the learner sees one job at a time. */
.foundation-hero-child { padding: clamp(2.8rem, 6vw, 5rem) 0 clamp(2.2rem, 4vw, 3.5rem); background: #f4efe4; border-bottom: 1px solid var(--ink); }
.foundation-hero-child > .container { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(2.5rem, 8vw, 7rem); align-items: end; }
.foundation-hero-child h1 { max-width: 16ch; margin: .7rem 0 1rem; font-family: var(--serif); font-size: clamp(2.7rem, 5vw, 4.8rem); font-weight: 500; line-height: 1.08; letter-spacing: -.055em; }
.foundation-hero-child div > p:last-child { max-width: 43rem; font-size: .9rem; line-height: 1.9; }
.foundation-hero-child aside { padding: 1.3rem 0; border-top: 7px solid #d7a733; border-bottom: 1px solid var(--ink); }
.foundation-hero-child aside > span { color: var(--red-dark); font: 700 .61rem/1.4 var(--mono); }
.foundation-hero-child aside > strong { display: block; margin: 1rem 0 1.6rem; font-family: var(--serif); font-size: 1.25rem; line-height: 1.55; }
.foundation-hero-child label { display: grid; gap: .45rem; font: 700 .62rem/1.4 var(--mono); }
.foundation-hero-child select { min-height: 44px; padding: .65rem; color: inherit; background: transparent; border: 1px solid var(--ink); border-radius: 0; font: inherit; }
.foundation-stage-switch { background: #e4ded1; border-bottom: 1px solid var(--ink); }
.foundation-stage-switch .container { display: grid; grid-template-columns: repeat(3, 1fr); }
.foundation-stage-switch button { position: relative; display: grid; min-height: 8.5rem; padding: 1rem; color: inherit; background: transparent; border: 0; border-left: 1px solid var(--ink); border-radius: 0; text-align: left; cursor: pointer; }
.foundation-stage-switch button:last-child { border-right: 1px solid var(--ink); }
.foundation-stage-switch button:hover { background: #eee7da; }
.foundation-stage-switch button[aria-current="true"] { color: var(--paper); background: #27313e; box-shadow: inset 0 6px 0 #efbd6b; }
.foundation-stage-switch span { color: var(--red-dark); font: 800 .7rem/1.4 var(--mono); }
.foundation-stage-switch button[aria-current="true"] span { color: #efbd6b; }
.foundation-stage-switch strong { max-width: 25ch; align-self: end; font-family: var(--serif); font-size: .9rem; line-height: 1.55; }
.foundation-stage-switch i { position: absolute; top: 1rem; right: 1rem; color: var(--green); font: normal 800 .58rem/1 var(--mono); }
.foundation-studio { padding: clamp(3rem, 7vw, 6.5rem) 0; background: var(--paper); scroll-margin-top: 5rem; }
.foundation-studio > .container { max-width: 72rem; }
.foundation-studio > .container > header { display: flex; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--ink); }
.foundation-studio > .container > header div { display: flex; gap: .75rem; align-items: center; }
.foundation-studio > .container > header span, .foundation-studio > .container > header p { margin: 0; color: var(--muted); font: 700 .62rem/1.5 var(--mono); }
.foundation-studio > .container > header strong { padding: .3rem .55rem; color: var(--paper); background: var(--red-dark); font-size: .68rem; }
.foundation-stepper { display: grid; grid-template-columns: repeat(5, 1fr); border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.foundation-stepper button { display: grid; min-height: 5rem; padding: .8rem; align-content: space-between; color: var(--muted); background: #eee8dc; border: 0; border-right: 1px solid var(--ink); border-radius: 0; text-align: left; cursor: pointer; }
.foundation-stepper button:last-child { border-right: 0; }
.foundation-stepper button[aria-current="true"] { color: var(--paper); background: var(--ink); box-shadow: inset 0 5px 0 #efbd6b; }
.foundation-stepper button:disabled { cursor: not-allowed; opacity: .48; }
.foundation-stepper span { color: var(--red-dark); font: 800 .61rem/1 var(--mono); }
.foundation-stepper button[aria-current="true"] span { color: #efbd6b; }
.foundation-stepper strong { font-size: .72rem; }
.foundation-work { min-height: 38rem; padding: clamp(2.5rem, 6vw, 5.5rem) 0 2rem; }
.foundation-work > h2 { max-width: 18ch; margin: .5rem 0 2rem; font-family: var(--serif); font-size: clamp(2rem, 4.8vw, 4.4rem); font-weight: 500; line-height: 1.18; letter-spacing: -.045em; }
.foundation-scene, .foundation-do { display: grid; max-width: 56rem; padding: clamp(1.5rem, 4vw, 3.2rem); color: var(--paper); background: #27313e; border-left: 10px solid #efbd6b; }
.foundation-scene span, .foundation-do span { color: #efbd6b; font: 800 .63rem/1.4 var(--mono); }
.foundation-scene strong, .foundation-do strong { margin-top: 1rem; font-family: var(--serif); font-size: clamp(1.15rem, 2.2vw, 1.8rem); font-weight: 500; line-height: 1.7; }
.foundation-scene p { margin: 1.2rem 0 0; color: #d4d9df; font-size: .75rem; line-height: 1.75; }
.foundation-record { display: grid; max-width: 56rem; gap: .65rem; margin-top: 1.6rem; padding: 1.2rem; background: #ece3d3; border-left: 7px solid var(--red); }
.foundation-record > span { color: var(--red-dark); font-size: .75rem; font-weight: 800; }
.foundation-record textarea { width: 100%; padding: 1rem; color: inherit; background: rgba(255,255,255,.62); border: 1px solid var(--ink); border-radius: 0; font: inherit; font-size: 1rem; line-height: 1.9; resize: vertical; }
.foundation-record small { color: var(--muted); font-size: .68rem; line-height: 1.6; }
.foundation-spoken { display: flex; max-width: 56rem; gap: .7rem; align-items: center; margin-top: .8rem; padding: .9rem 1rem; background: #f3eddc; border: 1px solid var(--line); font-size: .8rem; font-weight: 750; }
.foundation-spoken input { width: 1.35rem; height: 1.35rem; accent-color: var(--green); }
.foundation-three-moves { max-width: 56rem; margin: 2rem 0 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.foundation-three-moves li { display: grid; grid-template-columns: 3.5rem 1fr; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.foundation-three-moves li > span { display: grid; width: 2.2rem; height: 2.2rem; place-items: center; color: var(--paper); background: var(--red-dark); font: 800 .7rem/1 var(--mono); }
.foundation-three-moves b { font-family: var(--serif); }
.foundation-three-moves p { margin: .3rem 0 0; color: var(--muted); font-size: .78rem; line-height: 1.7; }
.foundation-calm-note { max-width: 46rem; color: var(--muted); line-height: 1.85; }
.foundation-term-focus { max-width: 56rem; margin-top: 2rem; padding: clamp(1.5rem, 4vw, 3rem); background: #eee6d7; border-top: 9px solid var(--red); border-bottom: 1px solid var(--ink); }
.term-position { display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: center; }
.term-position span { color: var(--red-dark); font: 800 .62rem/1 var(--mono); }
.term-position progress { width: 100%; height: 6px; accent-color: var(--red); }
.foundation-term-focus h3 { margin: 2rem 0 1rem; font-family: var(--serif); font-size: clamp(1.8rem, 4vw, 3.6rem); font-weight: 500; }
.foundation-term-focus > p { max-width: 40rem; font-size: 1rem; line-height: 1.9; }
.foundation-term-focus details { margin-top: 1.5rem; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.foundation-term-focus summary { padding: .85rem 0; color: var(--red-dark); font-size: .73rem; font-weight: 800; cursor: pointer; }
.foundation-term-focus details > strong { font-family: var(--serif); font-size: 1.1rem; }
.foundation-term-focus details p { font-size: .74rem; line-height: 1.75; }
.term-actions { display: flex; justify-content: space-between; margin-top: 1.2rem; }
.term-actions button, .foundation-work-actions button { min-height: 44px; padding: .7rem 1rem; color: inherit; background: transparent; border: 1px solid var(--ink); border-radius: 0; font-weight: 800; cursor: pointer; }
.term-actions button:disabled { opacity: .35; }
.foundation-model { max-width: 56rem; margin-top: 1rem; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.foundation-model summary { padding: .9rem 0; font-size: .72rem; font-weight: 800; cursor: pointer; }
.foundation-model p { font-size: .78rem; line-height: 1.8; }
.foundation-check-simple { display: grid; max-width: 56rem; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.foundation-check-simple button { display: grid; min-height: 13rem; padding: 1.2rem; align-content: space-between; color: inherit; background: #f2ecdf; border: 0; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); border-radius: 0; text-align: left; cursor: pointer; }
.foundation-check-simple button[aria-pressed="true"] { color: var(--paper); background: #27313e; box-shadow: inset 0 6px 0 #efbd6b; }
.foundation-check-simple span { color: var(--red-dark); font: 800 .72rem/1 var(--mono); }
.foundation-check-simple button[aria-pressed="true"] span { color: #efbd6b; }
.foundation-check-simple strong { font-family: var(--serif); font-size: 1rem; font-weight: 500; line-height: 1.7; }
.foundation-quiz-feedback { max-width: 56rem; margin: 0; padding: 1rem; color: var(--muted); border: 1px solid var(--ink); border-top: 0; font-size: .75rem; line-height: 1.75; }
.foundation-proof-list { max-width: 56rem; margin-top: 1.5rem; border-top: 6px solid var(--green); border-bottom: 1px solid var(--ink); }
.foundation-proof-list > span { display: block; padding: .8rem 0; color: var(--green); font: 800 .62rem/1 var(--mono); }
.foundation-proof-list p { margin: 0; padding: .8rem 0 .8rem 1.8rem; border-top: 1px solid var(--line); font-size: .76rem; }
.foundation-proof-list p::before { margin-left: -1.8rem; margin-right: .7rem; content: "□"; }
.foundation-proof-list p.is-done::before { color: var(--green); content: "✓"; font-weight: 900; }
.foundation-complete { width: min(100%, 56rem); min-height: 50px; margin-top: 1rem; color: var(--paper); background: var(--ink); border: 1px solid var(--ink); border-radius: 0; font-weight: 800; cursor: pointer; }
.foundation-complete:disabled { cursor: not-allowed; opacity: .42; }
.foundation-help { max-width: 56rem; margin-top: 1rem; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.foundation-help summary { padding: .8rem 0; color: var(--red-dark); font-size: .73rem; font-weight: 800; cursor: pointer; }
.foundation-help p { display: grid; gap: .3rem; margin: 0; padding: .8rem; background: #ece5d8; border-top: 1px solid var(--line); font-size: .73rem; line-height: 1.75; }
.foundation-help b { color: var(--red-dark); }
.foundation-work-actions { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1rem; align-items: center; padding-top: 1rem; border-top: 1px solid var(--ink); }
.foundation-work-actions button:last-child { justify-self: end; color: var(--paper); background: var(--ink); }
.foundation-work-actions button:disabled { cursor: not-allowed; opacity: .4; }
.foundation-work-actions p { margin: 0; color: var(--muted); font: 700 .62rem/1.5 var(--mono); text-align: center; }
.foundation-adult-reference { background: #e4ded2; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.foundation-adult-reference > summary { display: grid; width: min(calc(100% - 3rem), var(--max-width)); min-height: 5.8rem; margin: 0 auto; grid-template-columns: 13rem 1fr; align-items: center; cursor: pointer; }
.foundation-adult-reference > summary span { color: var(--red-dark); font: 800 .61rem/1.4 var(--mono); }
.foundation-adult-reference > summary strong { font-family: var(--serif); }
.foundation-adult-reference > div { display: grid; width: min(calc(100% - 3rem), var(--max-width)); margin: 0 auto 2rem; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.foundation-adult-reference section { min-width: 0; padding: 1.2rem; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.foundation-adult-reference h3 { margin: 0 0 1rem; font-family: var(--serif); font-size: 1rem; }
.foundation-adult-reference p, .foundation-adult-reference small { font-size: .69rem; line-height: 1.75; }
.foundation-adult-reference a { display: grid; gap: .25rem; padding: .6rem 0; color: inherit; border-top: 1px solid var(--line); text-decoration: none; }
.foundation-adult-reference a strong { font-size: .72rem; }
.foundation-adult-reference a small { color: var(--muted); }
[data-foundation-reader][data-band="1–2年"] .foundation-work { font-size: 1.06rem; }
[data-foundation-reader][data-band="1–2年"] .foundation-studio { background: #f7f0df; }
[data-foundation-reader][data-band="3–4年"] .foundation-studio { background: #f2eee5; }
[data-foundation-reader][data-band="5–6年"] .foundation-studio { background: var(--paper); }
@media (max-width: 760px) {
  .foundation-hero-child > .container { grid-template-columns: 1fr; }
  .foundation-hero-child h1 { font-size: clamp(2.7rem, 13vw, 4.3rem); }
  .foundation-stage-switch .container { width: 100%; overflow-x: auto; grid-template-columns: repeat(3, minmax(12rem, 12rem)); }
  .foundation-stage-switch button { min-height: 7.6rem; }
  .foundation-stepper { width: calc(100% + 2rem); margin-left: -1rem; grid-template-columns: repeat(5, minmax(7.5rem, 7.5rem)); overflow-x: auto; }
  .foundation-work { min-height: 34rem; }
  .foundation-check-simple, .foundation-adult-reference > div { grid-template-columns: 1fr; }
  .foundation-check-simple button { min-height: 9rem; }
  .foundation-work-actions { grid-template-columns: 1fr 1fr; }
  .foundation-work-actions p { grid-column: 1 / -1; grid-row: 1; }
  .foundation-work-actions button { grid-row: 2; }
  .foundation-adult-reference > summary { grid-template-columns: 1fr; gap: .35rem; align-content: center; }
}

.guidelines-page { background: var(--paper); }
.guidelines-hero { padding: clamp(4rem, 8vw, 7rem) 0; border-bottom: 1px solid var(--ink); }
.guidelines-hero-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(24rem, 1.1fr); gap: clamp(3rem, 8vw, 8rem); align-items: center; }
.guidelines-hero h1 { margin: .8rem 0 0; font-size: clamp(3.8rem, 5.5vw, 6rem); line-height: .98; letter-spacing: -.075em; }
.guidelines-hero h1 em { color: var(--red); font-family: var(--serif); font-weight: 500; font-style: normal; }
.guidelines-hero .page-credit { margin-top: 1.5rem; }
.guidelines-hero-story > p { margin: 0 0 1.4rem; padding-top: 1.2rem; border-top: 7px solid var(--ink); font-family: var(--serif); font-size: clamp(1rem, 1.8vw, 1.35rem); line-height: 1.85; }
.guidelines-hero-story figure { margin: 0; }
.guidelines-hero-story img { display: block; width: 100%; height: auto; }
.guidelines-hero-story figcaption { padding: .8rem 0 0; color: var(--muted); font-size: .7rem; line-height: 1.7; }

.guidelines-index { color: var(--paper); background: var(--ink); border-bottom: 1px solid var(--paper); }
.guidelines-index .container { display: grid; grid-template-columns: repeat(5, 1fr); }
.guidelines-index a { display: flex; min-height: 72px; gap: .8rem; align-items: center; padding: 1rem; color: inherit; border-right: 1px solid #606977; text-decoration: none; font-size: .73rem; font-weight: 750; line-height: 1.5; }
.guidelines-index a:first-child { border-left: 1px solid #606977; }
.guidelines-index a:hover { background: var(--red-dark); }
.guidelines-index span { color: #efbd6b; font: .62rem/1 var(--mono); }

.guidelines-capabilities, .guidelines-curriculum, .guidelines-continuity, .lesson-standard, .guidelines-routes { padding: clamp(5rem, 9vw, 9rem) 0; scroll-margin-top: 6rem; }
.guidelines-section-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, .75fr); gap: 1.5rem clamp(3rem, 8vw, 8rem); align-items: end; margin-bottom: clamp(3rem, 6vw, 5rem); }
.guidelines-section-head .eyebrow { grid-column: 1 / -1; }
.guidelines-section-head h2 { margin: 0; font-size: clamp(2.8rem, 5.4vw, 5.4rem); line-height: 1.02; letter-spacing: -.06em; }
.guidelines-section-head > p:last-child { margin: 0; padding-top: 1.2rem; border-top: 1px solid var(--ink); color: var(--muted); line-height: 1.9; }

.guidelines-capabilities { border-bottom: 1px solid var(--ink); }
.capability-pillars { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; padding: 0; border-top: 6px solid var(--ink); border-left: 1px solid var(--ink); list-style: none; }
.capability-pillars li { display: grid; min-height: 23rem; align-content: start; padding: 1.5rem; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.capability-pillars li > span { color: var(--red-dark); font: 700 .68rem/1 var(--mono); }
.capability-pillars h3 { margin: 3rem 0 1rem; font-family: var(--serif); font-size: clamp(1.35rem, 2.3vw, 2rem); line-height: 1.45; text-wrap: balance; }
.capability-pillars p { margin: 0; color: #444c57; font-size: .8rem; line-height: 1.85; }
.capability-pillars small { align-self: end; margin-top: auto; padding-top: 1.1rem; border-top: 1px solid #a9a49a; color: var(--muted); font-size: .64rem; line-height: 1.7; }
.capability-pillars small strong { display: block; margin-top: .25rem; color: var(--ink); font-size: .72rem; text-wrap: balance; }
.capability-note { display: grid; grid-template-columns: minmax(14rem, .65fr) 1.35fr; gap: 2rem; margin-top: 1.5rem; padding: 1.4rem 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.capability-note strong { color: var(--red-dark); font-family: var(--serif); font-size: 1.1rem; }
.capability-note p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.8; }

.lesson-standard { background: #e8e4d9; border-bottom: 1px solid var(--ink); }
.binary-story { display: grid; grid-template-columns: minmax(18rem, .9fr) minmax(20rem, 1.1fr); gap: 1.5rem 3rem; margin: 0 0 2.5rem; padding: 2rem; color: var(--paper); background: #25303d; border-top: 7px solid #efbd6b; }
.binary-story figcaption { grid-column: 1 / -1; color: #efbd6b; font-family: var(--serif); font-size: clamp(1.25rem, 2.4vw, 2rem); font-weight: 700; }
.binary-story-sequence { display: grid; grid-template-columns: 1fr auto 1fr auto 1.3fr auto 1.3fr; gap: .6rem; align-items: center; }
.binary-story-sequence span, .binary-story-sequence strong { display: grid; min-height: 5rem; place-items: center; border: 1px solid #7e8895; font: 800 clamp(1.8rem, 4vw, 3.8rem)/1 var(--mono); }
.binary-story-sequence strong { color: #25303d; background: #efbd6b; border-color: #efbd6b; }
.binary-story-sequence i { color: #efbd6b; font-style: normal; }
.binary-place { display: grid; gap: .65rem; align-content: center; }
.binary-place > span { display: grid; grid-template-columns: 5rem repeat(4, 1fr); gap: .65rem; align-items: center; }
.binary-place b { font-size: .7rem; }
.binary-place i { width: 1.15rem; height: 1.15rem; justify-self: center; background: transparent; border: 2px solid #9ba5b1; border-radius: 50%; }
.binary-place i.is-on { background: #efbd6b; border-color: #efbd6b; box-shadow: 0 0 0 4px rgb(239 189 107 / 15%); }
.binary-story > p { grid-column: 1 / -1; margin: 0; padding-top: 1.2rem; border-top: 1px solid #77818d; color: #d3d9e0; line-height: 1.9; }
.lesson-steps { display: grid; grid-template-columns: repeat(6, 1fr); margin: 0; padding: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); list-style: none; }
.lesson-steps li { display: grid; min-height: 12rem; align-content: space-between; padding: 1rem; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.lesson-steps span { color: var(--red-dark); font: .7rem/1 var(--mono); }
.lesson-steps strong { font-size: .95rem; line-height: 1.55; }
.lesson-steps small { color: var(--muted); font-size: .67rem; line-height: 1.65; }

.guidelines-continuity { color: var(--paper); background: #202834; }
.guidelines-continuity header { display: grid; grid-template-columns: minmax(0, .85fr) minmax(18rem, 1.15fr); gap: 1.5rem 3rem; align-items: end; margin-bottom: 4rem; }
.guidelines-continuity .eyebrow { grid-column: 1 / -1; color: #efbd6b; }
.guidelines-continuity h2 { margin: 0; font-size: clamp(3rem, 5.8vw, 5.8rem); line-height: 1; letter-spacing: -.06em; }
.guidelines-continuity header > p:last-child { margin: 0; padding-top: 1.2rem; color: #cbd1da; border-top: 1px solid #78828f; line-height: 1.9; }
.continuity-table { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 2.5rem; border-top: 1px solid #78828f; border-left: 1px solid #78828f; }
.continuity-table article { display: grid; min-height: 25rem; align-content: start; padding: 1.6rem; border-right: 1px solid #78828f; border-bottom: 1px solid #78828f; }
.continuity-table span { color: #efbd6b; font: 700 .68rem/1.5 var(--mono); }
.continuity-table h3 { margin: 3rem 0 1rem; font-family: var(--serif); font-size: clamp(1.4rem, 2.5vw, 2.2rem); line-height: 1.45; }
.continuity-table p { margin: 0; color: #cbd1da; line-height: 1.9; }
.continuity-table strong { align-self: end; margin-top: auto; padding-top: 1rem; border-top: 1px solid #78828f; color: var(--white); font-size: .75rem; line-height: 1.7; }

.guidelines-curriculum { background: #e8e4d9; border-bottom: 1px solid var(--ink); }
.curriculum-disclosures { border-top: 6px solid var(--ink); }
.curriculum-disclosures details { border-bottom: 1px solid var(--ink); }
.curriculum-disclosures summary { display: grid; grid-template-columns: 11rem 1fr auto; gap: 1.5rem; align-items: center; min-height: 5.4rem; padding: 1rem 0; cursor: pointer; list-style: none; }
.curriculum-disclosures summary::-webkit-details-marker { display: none; }
.curriculum-disclosures summary::after { content: "＋"; width: 2.2rem; text-align: center; color: var(--red-dark); font-size: 1.4rem; }
.curriculum-disclosures details[open] summary::after { content: "−"; }
.curriculum-disclosures summary span { color: var(--red-dark); font: 700 .68rem/1.5 var(--mono); }
.curriculum-disclosures summary strong { font-family: var(--serif); font-size: clamp(1.05rem, 2vw, 1.5rem); }
.curriculum-disclosures details > div { padding: .5rem 3.7rem 2rem 12.5rem; }
.curriculum-disclosures p { margin: 0 0 1.2rem; color: var(--muted); line-height: 1.85; }
.curriculum-disclosures ul { margin: 0; padding: 0; border-top: 1px solid #aaa397; list-style: none; }
.curriculum-disclosures li { padding: .75rem 0; border-bottom: 1px solid #aaa397; font-size: .78rem; line-height: 1.65; }
.curriculum-disclosures nav { display: flex; flex-wrap: wrap; gap: .7rem 1.3rem; margin-top: 1.3rem; }
.curriculum-disclosures a { color: var(--red-dark); font-size: .72rem; font-weight: 750; }
.curriculum-unit-groups { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 5fr); gap: 1.8rem; }
.curriculum-unit-groups h3 { margin: 0 0 .7rem; font-size: 1.1rem; }
.curriculum-unit-groups nav { grid-column: 1 / -1; }
.curriculum-source-roles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.curriculum-source-roles p { display: grid; gap: .5rem; margin: 0; padding-top: 1rem; border-top: 1px solid #aaa397; }
.curriculum-source-roles strong { color: var(--ink); }
.curriculum-status-note { display: grid; grid-template-columns: minmax(16rem, .7fr) 1.3fr; gap: 2rem; margin-top: 2.5rem; padding: 1.5rem 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.curriculum-status-note strong { color: var(--red-dark); font-family: var(--serif); font-size: 1rem; }
.curriculum-status-note p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.8; }

.guidelines-routes header { display: flex; justify-content: space-between; gap: 2rem; align-items: end; margin-bottom: 3rem; }
.guidelines-routes h2 { max-width: 14ch; margin: 0; font-size: clamp(2.8rem, 5vw, 5rem); line-height: 1; letter-spacing: -.055em; }
.guidelines-routes .container > div { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.guidelines-routes a { display: grid; min-height: 14rem; align-content: space-between; padding: 1.3rem; color: inherit; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); text-decoration: none; }
.guidelines-routes a:hover { color: var(--paper); background: var(--ink); }
.guidelines-routes a strong { font-family: var(--serif); font-size: 1.25rem; line-height: 1.5; }
.guidelines-routes a small { color: var(--muted); font-size: .72rem; line-height: 1.6; }
.guidelines-routes a:hover small { color: #cbd1da; }

@media (max-width: 1120px) {
  .site-nav { gap: .55rem; }
  .site-nav > a { font-size: .7rem; }
  .guidelines-routes .container > div { grid-template-columns: 1fr 1fr; }
  .lesson-steps { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 840px) {
  .guidelines-hero-grid, .guidelines-section-head, .guidelines-continuity header, .binary-story { grid-template-columns: 1fr; }
  .guidelines-hero h1 { font-size: clamp(3.5rem, 18vw, 5.5rem); }
  .guidelines-index .container { width: 100%; grid-template-columns: 1fr 1fr; }
  .guidelines-index a:nth-child(odd) { border-left: 0; }
  .capability-pillars, .continuity-table { grid-template-columns: 1fr; }
  .capability-pillars li, .continuity-table article { min-height: 18rem; }
  .curriculum-disclosures details > div { padding-left: 0; }
  .curriculum-source-roles { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .guidelines-hero h1 { font-size: clamp(3rem, 13.5vw, 4.25rem); }
  .lesson-standard .guidelines-section-head h2 { font-size: clamp(2.2rem, 9.5vw, 3.7rem); }
  .guidelines-index .container, .guidelines-routes .container > div, .lesson-steps, .curriculum-unit-groups { grid-template-columns: 1fr; }
  .guidelines-index a { min-height: 58px; border-left: 1px solid #606977 !important; }
  .guidelines-section-head h2, .guidelines-continuity h2, .guidelines-routes h2 { font-size: clamp(2.5rem, 13vw, 3.7rem); }
  .capability-pillars li, .continuity-table article { min-height: 0; }
  .capability-pillars h3, .continuity-table h3 { margin-top: 2rem; }
  .capability-note, .curriculum-status-note { grid-template-columns: 1fr; gap: .7rem; }
  .binary-story { padding: 1.2rem; }
  .binary-story-sequence { gap: .35rem; }
  .binary-story-sequence span, .binary-story-sequence strong { min-height: 4rem; font-size: 1.8rem; }
  .binary-place > span { grid-template-columns: 4rem repeat(4, 1fr); gap: .35rem; }
  .lesson-steps li { min-height: 9.5rem; }
  .curriculum-disclosures summary { grid-template-columns: 1fr auto; gap: .4rem 1rem; }
  .curriculum-disclosures summary span { grid-column: 1; }
  .curriculum-disclosures summary strong { grid-column: 1; }
  .curriculum-disclosures summary::after { grid-column: 2; grid-row: 1 / 3; }
  .curriculum-disclosures details > div { padding-right: 0; }
  .guidelines-routes a { min-height: 10rem; }
}

/* Learning studio — one idea, one visible decision, one next action. */
.unit-learner-orientation { padding: clamp(3.5rem, 7vw, 6rem) 0; background: #e9e3d7; border-bottom: 1px solid var(--ink); }
.unit-learner-orientation > .container { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(18rem, .75fr); gap: clamp(2rem, 7vw, 7rem); align-items: end; }
.unit-learner-orientation span { display: block; margin-bottom: .8rem; color: var(--red-dark); font: 700 .64rem/1.4 var(--mono); letter-spacing: .1em; }
.unit-learner-orientation h2 { max-width: 22ch; margin: 0; font-family: var(--serif); font-size: clamp(1.7rem, 3.3vw, 3.25rem); font-weight: 500; line-height: 1.5; letter-spacing: -.025em; }
.unit-learner-orientation p { max-width: 44rem; margin: 1.3rem 0 0; color: var(--muted); line-height: 1.9; }
.unit-learner-orientation aside { padding: 1.4rem 0 0; border-top: 7px solid var(--red); }
.unit-learner-orientation aside strong { display: block; font-family: var(--serif); font-size: 1.08rem; line-height: 1.8; }
.unit-learner-orientation aside > a { display: inline-flex; margin-top: 1.4rem; color: var(--red-dark); font-size: .78rem; font-weight: 800; }
.unit-learner-orientation aside small { display: block; margin-top: .75rem; }
.unit-learner-orientation aside small a { color: var(--muted); font: .6rem/1.5 var(--mono); }

.unit-sequence { position: relative; background: #f7f3ea; }
.unit-sequence .container { grid-template-columns: repeat(7, minmax(10.4rem, 1fr)); scrollbar-color: var(--red) #d8d0c3; }
.unit-sequence button { position: relative; display: grid; min-width: 10.4rem; min-height: 9.75rem; align-content: space-between; padding: 1rem; color: inherit; background: transparent; border: 0; border-right: 1px solid var(--ink); border-radius: 0; text-align: left; cursor: pointer; }
.unit-sequence button:first-child { border-left: 1px solid var(--ink); }
.unit-sequence button::after { position: absolute; right: .75rem; bottom: .75rem; width: 10px; height: 10px; border: 1px solid var(--ink); content: ""; }
.unit-sequence button:hover { background: #ebe2d2; }
.unit-sequence button.is-current { color: var(--paper); background: var(--ink); }
.unit-sequence button.is-current::before { position: absolute; top: 0; right: 0; left: 0; height: 6px; background: #efbd6b; content: ""; }
.unit-sequence button.is-current::after { border-color: #efbd6b; }
.unit-sequence button.is-complete::after { background: var(--green); }
.unit-sequence button > span { color: var(--red-dark); font: 700 .67rem/1 var(--mono); }
.unit-sequence button.is-current > span { color: #efbd6b; }
.unit-sequence button > small { color: var(--muted); font: .58rem/1.4 var(--mono); }
.unit-sequence button.is-current > small, .unit-sequence button.is-current > i { color: #bfc4ca; }
.unit-sequence button > strong { margin-top: 1.25rem; font-family: var(--serif); font-size: .94rem; line-height: 1.55; }
.unit-sequence button > i { align-self: end; padding-right: 1.1rem; color: var(--muted); font: normal .58rem/1.45 var(--mono); }

.unit-concept-lessons { min-height: 58rem; background: var(--paper); }
.learning-studio { scroll-margin-top: 8.5rem; }
.learning-studio-head { display: grid; width: min(calc(100% - 3rem), var(--max-width)); margin: 0 auto; padding: clamp(4rem, 8vw, 7rem) 0 2.5rem; grid-template-columns: minmax(0, 1fr) auto; border-bottom: 1px solid var(--ink); }
.learning-studio-head > div { grid-column: 1 / -1; display: flex; gap: .8rem; align-items: center; margin-bottom: 1.1rem; }
.learning-studio-head > div span { font: 700 .65rem/1 var(--mono); letter-spacing: .08em; }
.learning-studio-head i { padding: .28rem .52rem; color: var(--red-dark); border: 1px solid currentColor; font: normal 700 .56rem/1 var(--mono); }
.learning-studio-head > p { margin: 0 0 .35rem; color: var(--muted); font: .64rem/1.4 var(--mono); }
.learning-studio-head h2 { grid-column: 1; max-width: 17ch; margin: 0; font-size: clamp(2.7rem, 5.2vw, 5.35rem); line-height: 1.02; letter-spacing: -.065em; }
.learning-studio-head > small { grid-column: 2; align-self: end; max-width: 24rem; padding: .8rem 0 .2rem 1.5rem; color: var(--muted); border-left: 5px solid var(--red); font: .68rem/1.65 var(--mono); }

.learning-beats { display: grid; width: min(calc(100% - 3rem), var(--max-width)); margin: 0 auto; grid-template-columns: repeat(5, 1fr); border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.learning-beats button { display: grid; min-width: 0; min-height: 5.9rem; padding: .85rem; color: var(--muted); background: #e6e0d5; border: 0; border-right: 1px solid var(--ink); border-radius: 0; text-align: left; cursor: pointer; }
.learning-beats button:last-child { border-right: 0; }
.learning-beats button:disabled { cursor: not-allowed; opacity: .55; }
.learning-beats button.is-open { color: var(--ink); background: #f6f2e9; }
.learning-beats button.is-current { color: var(--paper); background: var(--ink); box-shadow: inset 0 6px 0 #efbd6b; }
.learning-beats button span { color: var(--red-dark); font: 700 .58rem/1 var(--mono); }
.learning-beats button.is-current span { color: #efbd6b; }
.learning-beats button strong { align-self: end; font-size: .74rem; line-height: 1.45; }

.learning-beat-stage { width: min(calc(100% - 3rem), var(--max-width)); margin: 0 auto; padding: clamp(3rem, 6vw, 5.5rem) 0 clamp(4rem, 7vw, 6rem); }
.learning-beat { min-height: 31rem; }
.learning-beat[hidden] { display: none; }
.learning-beat > h3 { max-width: 18ch; margin: 0 0 clamp(2rem, 4vw, 3.5rem); font-family: var(--serif); font-size: clamp(2rem, 4.3vw, 4.2rem); font-weight: 500; line-height: 1.18; letter-spacing: -.045em; }
.learning-beat > p:not(.learning-label, .beat-question) { max-width: 46rem; color: var(--muted); line-height: 1.9; }
.beat-question { max-width: 54rem; margin: 2rem 0 0; padding: 1rem 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); font-family: var(--serif); font-size: clamp(1.05rem, 1.7vw, 1.35rem); line-height: 1.75; }

.scene-board { position: relative; display: grid; max-width: 62rem; min-height: 18rem; padding: clamp(2rem, 5vw, 4rem); align-content: center; color: var(--paper); background: #25303d; overflow: hidden; }
.scene-board::after { position: absolute; right: -5rem; bottom: -7rem; width: 22rem; height: 22rem; border: 1px solid #727d8b; border-radius: 50%; content: ""; }
.scene-board > span { position: relative; z-index: 1; margin-bottom: 1.5rem; color: #efbd6b; font: 700 .63rem/1.4 var(--mono); letter-spacing: .1em; }
.scene-board p { position: relative; z-index: 1; max-width: 42rem; margin: 0; font-family: var(--serif); font-size: clamp(1.2rem, 2.3vw, 2rem); line-height: 1.75; }

.scene-board:has(.media-story-figure) { grid-template-columns: minmax(0, 1fr) minmax(15rem, 22rem); gap: clamp(1.5rem, 4vw, 3.5rem); }
.scene-board:has(.media-story-figure) > span { grid-column: 1 / -1; }
.media-story-figure { position: relative; z-index: 1; margin: 0; background: #efe7d8; border: 1px solid currentColor; }
.media-story-image { width: 100%; aspect-ratio: 1; background-image: url("../illustrations/decks/unit-h1-1-m3.png"); background-repeat: no-repeat; background-size: 300% 200%; }
.media-story-image.is-scene-0 { background-position: 0 0; }
.media-story-image.is-scene-1 { background-position: 50% 0; }
.media-story-image.is-scene-2 { background-position: 100% 0; }
.media-story-image.is-scene-3 { background-position: 0 100%; }
.media-story-image.is-scene-4 { background-position: 50% 100%; }
.media-story-image.is-scene-5 { background-position: 100% 100%; }
.media-story-figure figcaption { padding: .65rem .8rem; color: var(--muted); background: #f4eee3; font: .6rem/1.55 var(--mono); }
.scene-board .media-story-figure { color: var(--ink); }

.media-source-card { display: grid; margin: 0 0 2rem; grid-template-columns: minmax(15rem, .78fr) minmax(0, 1.22fr); color: var(--ink); background: #f2eadc; border: 1px solid var(--ink); }
.media-source-card > .media-story-figure { border: 0; border-right: 1px solid var(--ink); }
.media-source-card > div { padding: clamp(1.2rem, 3vw, 2.4rem); }
.media-source-card > div > span, .headline-audit header span, .headline-builder > div > span { color: var(--red-dark); font: 700 .62rem/1.45 var(--mono); letter-spacing: .06em; }
.media-source-card h4, .headline-audit h4, .headline-builder h4 { max-width: 22ch; margin: .55rem 0 1.25rem; font-family: var(--serif); font-size: clamp(1.2rem, 2vw, 1.75rem); line-height: 1.45; }
.media-source-card dl { display: grid; margin: 0; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.media-source-card dl div { padding: .85rem; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.media-source-card dt { color: var(--muted); font: .58rem/1.4 var(--mono); }
.media-source-card dd { margin: .45rem 0 0; font-family: var(--serif); font-size: 1.45rem; }
.media-source-card blockquote { margin: 1rem 0 0; padding: .8rem 1rem; background: #fffaf1; border-left: 5px solid #d79a33; font-family: var(--serif); line-height: 1.7; }
.media-source-card > div > p { display: grid; margin: 1rem 0 0; grid-template-columns: 9rem 1fr; gap: 1rem; align-items: center; }
.media-source-card > div > p strong { color: var(--red-dark); font-family: var(--serif); font-size: 1.35rem; }
.media-source-card > div > p small { color: var(--muted); line-height: 1.55; }

.decision-pair { display: grid; margin-top: 2rem; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.decision-pair button { display: grid; min-height: 18rem; align-content: space-between; padding: clamp(1.4rem, 3vw, 2.7rem); color: inherit; background: #f5f0e6; border: 0; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); border-radius: 0; text-align: left; cursor: pointer; }
.decision-pair button:hover { background: #ece2d2; }
.decision-pair button[aria-pressed="true"] { color: var(--paper); background: #2a3440; box-shadow: inset 0 7px 0 #efbd6b; }
.decision-pair button span { color: var(--red-dark); font: 700 .66rem/1 var(--mono); }
.decision-pair button[aria-pressed="true"] span { color: #efbd6b; }
.decision-pair button strong { max-width: 27ch; font-family: var(--serif); font-size: clamp(1rem, 1.9vw, 1.5rem); font-weight: 500; line-height: 1.65; }
.choice-response { display: none; padding: 1.1rem 0; border-bottom: 1px solid var(--ink); }
.choice-response.is-visible { display: flex; gap: 1rem; justify-content: space-between; }
.choice-response strong { font-size: .82rem; }
.choice-response small { color: var(--muted); font-size: .68rem; }

.process-ribbon { display: grid; margin: 2.3rem 0; grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr)); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.process-ribbon > div { position: relative; display: grid; min-height: 11.5rem; padding: 1rem; align-content: space-between; background: #f5f0e6; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.process-ribbon > div:not(:last-child)::after { position: absolute; z-index: 2; top: 50%; right: -14px; display: grid; width: 27px; height: 27px; place-items: center; color: var(--paper); background: var(--red-dark); border-radius: 50%; content: "→"; font: 700 .72rem/1 var(--mono); transform: translateY(-50%); }
.process-ribbon span { color: var(--red-dark); font: 700 .62rem/1 var(--mono); }
.process-ribbon strong { font-family: var(--serif); font-size: 1.05rem; line-height: 1.5; }
.process-ribbon small { color: var(--muted); font: .58rem/1.5 var(--mono); }
.headline-audit { margin: 2rem 0; }
.headline-audit > header { display: flex; justify-content: space-between; gap: 1rem; align-items: end; padding: 0 0 1rem; border-bottom: 7px solid var(--blue); }
.headline-audit > header h4 { margin-bottom: 0; }
.headline-audit > header > strong { color: var(--blue); font: 700 1rem/1 var(--mono); }
.headline-audit > .media-story-figure { display: grid; margin-top: 1rem; grid-template-columns: minmax(12rem, 20rem) 1fr; align-items: center; }
.headline-audit > .media-story-figure .media-story-image { max-width: 20rem; }
.headline-audit > .media-story-figure figcaption { align-self: stretch; display: grid; padding: 1.5rem; place-items: center start; font-size: .72rem; }
.headline-audit-list { display: grid; margin-top: 1rem; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.headline-audit-list article { display: grid; min-height: 16rem; padding: 1rem; align-content: space-between; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.headline-audit-list article.is-correct { box-shadow: inset 0 6px 0 var(--green); }
.headline-audit-list article.is-wrong { box-shadow: inset 0 6px 0 var(--red); }
.headline-audit-list p { margin: 0 0 1rem; font-family: var(--serif); font-size: 1rem; line-height: 1.65; }
.headline-audit-list label { display: grid; gap: .45rem; }
.headline-audit-list label span { color: var(--muted); font-size: .63rem; font-weight: 700; }
.headline-audit-list select, .headline-builder select { width: 100%; padding: .75rem; color: var(--ink); background: #fffaf1; border: 1px solid var(--ink); border-radius: 0; font: 700 .75rem/1.4 var(--sans); }
.headline-audit-list small { min-height: 3.6rem; margin-top: .7rem; color: var(--muted); font-size: .66rem; line-height: 1.55; }
.headline-audit-list .is-correct small { color: var(--green); }
.headline-audit-list .is-wrong small { color: var(--red-dark); }
.headline-audit-summary { display: grid; padding: 1rem; grid-template-columns: 16rem 1fr; gap: 1rem; background: #eee6d8; border: 1px solid var(--ink); border-top: 0; }
.headline-audit-summary.is-complete { color: var(--paper); background: var(--green); }
.headline-audit-summary p { margin: 0; font-size: .72rem; line-height: 1.6; }
.learning-model > aside { display: grid; grid-template-columns: 9rem 1fr; gap: 1.5rem; padding: 1.2rem 0; border-top: 6px solid var(--blue); border-bottom: 1px solid var(--ink); }
.learning-model > aside span { color: var(--blue); font: 700 .61rem/1.5 var(--mono); }
.learning-model > aside strong { font-family: var(--serif); font-size: 1.05rem; line-height: 1.75; }

.media-transformation-figure { margin: 0 0 clamp(2.3rem, 5vw, 4rem); color: var(--ink); background: #eee5d6; border: 1px solid var(--ink); }
.media-transformation-canvas { display: grid; min-height: 25rem; grid-template-columns: minmax(11rem, 1fr) minmax(5.5rem, .42fr) minmax(12rem, 1.06fr) minmax(5.5rem, .42fr) minmax(11rem, 1fr); overflow: hidden; }
.media-transform-stage { position: relative; display: grid; min-width: 0; padding: clamp(1rem, 2vw, 1.6rem); align-content: space-between; background: #f8f3e9; }
.media-transform-stage header { display: flex; gap: .65rem; align-items: center; padding-bottom: .75rem; border-bottom: 1px solid var(--ink); }
.media-transform-stage header span { color: var(--red-dark); font: 700 .62rem/1 var(--mono); }
.media-transform-stage header strong { font: 600 .88rem/1.2 var(--serif); }
.media-transform-stage > small { margin-top: 1rem; color: var(--muted); font: .58rem/1.5 var(--mono); }
.media-survey-sheet { position: relative; margin: 1.3rem .45rem .8rem 0; padding: 1.1rem; background: #fffdf8; border: 1px solid var(--ink); box-shadow: .42rem .42rem 0 #d6c6ad; transform: rotate(-1.6deg); }
.media-survey-sheet::after { position: absolute; top: -1px; right: -1px; width: 1.5rem; height: 1.5rem; background: linear-gradient(225deg, #eee5d6 50%, transparent 51%); border-top: 1px solid var(--ink); border-right: 1px solid var(--ink); content: ""; }
.media-survey-sheet > b { display: block; max-width: 12ch; font-family: var(--serif); font-size: .85rem; line-height: 1.45; }
.media-answer-dots { display: grid; margin: 1rem 0; grid-template-columns: repeat(10, 1fr); gap: .25rem; }
.media-answer-dots i { width: .62rem; aspect-ratio: 1; background: var(--green); border: 1px solid var(--ink); border-radius: 50%; }
.media-answer-dots i.is-no { background: #f8f3e9; }
.media-survey-sheet p { display: flex; margin: 0; gap: .35rem; align-items: baseline; }
.media-survey-sheet p strong { color: var(--red-dark); font: 700 1.45rem/1 var(--serif); }
.media-survey-sheet p span { color: var(--muted); font: .58rem/1.4 var(--mono); }
.media-transform-link { position: relative; z-index: 2; display: grid; padding: 1rem .55rem; place-content: center; place-items: center; color: var(--paper); background: #2b3541; border-inline: 1px solid var(--ink); text-align: center; }
.media-transform-link::after { position: absolute; top: 50%; right: -11px; width: 20px; height: 20px; background: #2b3541; border-top: 1px solid var(--ink); border-right: 1px solid var(--ink); content: ""; transform: translateY(-50%) rotate(45deg); }
.media-transform-link strong { margin-top: .85rem; color: #f2bf64; font: 600 1.05rem/1.2 var(--serif); }
.media-transform-link small { max-width: 6rem; margin-top: .35rem; color: #d7dce2; font: .55rem/1.45 var(--mono); }
.media-copy-sheets { position: relative; width: 3.5rem; height: 3.2rem; }
.media-copy-sheets i { position: absolute; display: block; width: 2.3rem; height: 2.75rem; background: #fff9ee; border: 1px solid #1a222c; }
.media-copy-sheets i:nth-child(1) { top: 0; left: 0; opacity: .55; }
.media-copy-sheets i:nth-child(2) { top: .24rem; left: .42rem; opacity: .75; }
.media-copy-sheets i:nth-child(3) { top: .48rem; left: .84rem; }
.media-copy-sheets i::before, .media-copy-sheets i::after { position: absolute; left: .35rem; width: 1.45rem; height: 1px; background: #69727e; content: ""; }
.media-copy-sheets i::before { top: .65rem; }
.media-copy-sheets i::after { top: 1rem; }
.media-edit-sheet { position: relative; display: grid; margin: 1.3rem 0 .8rem; gap: .75rem; padding: 1rem; background: #fffdf8; border: 1px solid var(--ink); box-shadow: -.36rem .36rem 0 #cfbfa8; transform: rotate(1deg); }
.media-edit-sheet::before { position: absolute; top: -.65rem; right: .8rem; width: 4.8rem; height: 1.05rem; background: rgba(240, 188, 82, .68); content: ""; transform: rotate(-4deg); }
.media-edit-sheet p { display: grid; margin: 0; grid-template-columns: 3.3rem 1fr; gap: .55rem; align-items: center; }
.media-edit-sheet p i { padding: .3rem .35rem; color: var(--paper); background: var(--blue); font: normal 700 .53rem/1 var(--mono); text-align: center; }
.media-edit-sheet p b, .media-edit-sheet p s { min-width: 0; font-family: var(--serif); font-size: .74rem; line-height: 1.35; text-decoration-thickness: 2px; }
.media-edit-sheet .is-selected { padding: .42rem; outline: 2px solid var(--blue); outline-offset: -2px; }
.media-edit-sheet .is-emphasized b { display: inline-block; width: max-content; padding: .12rem .34rem; color: var(--paper); background: var(--red-dark); font-size: 1.35rem; }
.media-edit-sheet .is-omitted { opacity: .46; }
.media-edit-sheet .is-omitted i { background: var(--red-dark); }
.media-edit-sheet .is-omitted s { text-decoration-style: double; }
.media-share-mark { position: relative; width: 4.2rem; height: 3.5rem; }
.media-share-mark i { position: absolute; width: .9rem; aspect-ratio: 1; background: #fff9ee; border: 2px solid #f2bf64; border-radius: 50%; }
.media-share-mark i:nth-child(1) { top: 1.25rem; left: 0; }
.media-share-mark i:nth-child(2) { top: 0; right: 0; }
.media-share-mark i:nth-child(3) { right: 0; bottom: 0; }
.media-share-mark::before, .media-share-mark::after { position: absolute; left: .75rem; width: 2.85rem; height: 2px; background: #f2bf64; content: ""; transform-origin: left center; }
.media-share-mark::before { top: 1.55rem; transform: rotate(-25deg); }
.media-share-mark::after { top: 1.8rem; transform: rotate(25deg); }
.media-post-card { display: grid; margin: 1.2rem auto .75rem; padding: 1rem; place-items: center; width: min(100%, 10rem); aspect-ratio: 4 / 5; background: #fffdf8; border: 1px solid var(--ink); box-shadow: .42rem .42rem 0 #d6c6ad; transform: rotate(-1deg); }
.media-post-card span { justify-self: stretch; padding-bottom: .45rem; color: var(--muted); border-bottom: 1px solid var(--ink); font: 700 .52rem/1 var(--mono); }
.media-post-card strong { color: var(--red-dark); font: 700 clamp(2.2rem, 4vw, 3.4rem)/1 var(--serif); }
.media-post-card b { padding: .28rem .65rem; color: var(--paper); background: var(--ink); font: 600 .92rem/1 var(--serif); }
.media-viewers { position: relative; display: grid; width: min(100%, 10.5rem); margin: 0 auto; grid-template-columns: repeat(9, 1fr); gap: .22rem; }
.media-viewers i { position: relative; height: 1.1rem; }
.media-viewers i::before { position: absolute; top: 0; left: 50%; width: .42rem; aspect-ratio: 1; background: var(--blue); border-radius: 50%; content: ""; transform: translateX(-50%); }
.media-viewers i::after { position: absolute; right: .14rem; bottom: 0; left: .14rem; height: .55rem; background: var(--blue); border-radius: .5rem .5rem 0 0; content: ""; }
.media-viewers i:nth-child(3n) { opacity: .58; }
.media-transformation-figure figcaption { display: grid; padding: 1rem 1.2rem; grid-template-columns: auto 1fr; gap: .7rem; color: var(--paper); background: var(--green); border-top: 1px solid var(--ink); font-size: .75rem; line-height: 1.55; }
.media-transformation-figure figcaption strong { font-family: var(--serif); font-size: 1rem; }

.media-interpretation-figure { margin: clamp(2.5rem, 5vw, 4.5rem) 0 0; color: var(--ink); background: #f8f3e9; border: 1px solid var(--ink); }
.media-interpretation-figure > header { display: grid; padding: 1rem 1.25rem; grid-template-columns: 9rem 1fr; gap: 1rem; color: var(--paper); background: var(--ink); }
.media-interpretation-figure > header span { color: #f2bf64; font: 700 .62rem/1.5 var(--mono); }
.media-interpretation-figure > header strong { font-family: var(--serif); font-size: 1rem; line-height: 1.5; }
.media-interpretation-pair { position: relative; display: grid; grid-template-columns: 1fr 1fr; }
.media-interpretation-pair::before { position: absolute; z-index: 2; top: -1px; left: 50%; width: 1px; height: calc(100% + 1px); background: var(--ink); content: ""; }
.media-reading { position: relative; display: grid; min-height: 19rem; padding: clamp(1.2rem, 3vw, 2.1rem); grid-template-columns: minmax(9rem, 1fr) 6.5rem; gap: 1rem; align-items: center; overflow: hidden; }
.media-reading.is-post { background: #eee5d6; }
.media-reading-object { position: relative; z-index: 1; display: grid; min-height: 11rem; padding: 1rem; align-content: space-between; background: #fffdf8; border: 1px solid var(--ink); box-shadow: .45rem .45rem 0 #d3c4ad; transform: rotate(-1.3deg); }
.media-reading-object > span { padding-bottom: .45rem; color: var(--muted); border-bottom: 1px solid var(--ink); font: 700 .54rem/1 var(--mono); }
.media-reading-object > b { max-width: 14ch; font-family: var(--serif); font-size: .8rem; line-height: 1.45; }
.media-reading-object > strong { color: var(--red-dark); font: 700 clamp(1.45rem, 3vw, 2.25rem)/1.05 var(--serif); }
.media-reading-object > i { color: var(--muted); font: normal .54rem/1.45 var(--mono); }
.is-post .media-reading-object { width: min(100%, 9.5rem); min-height: 12.5rem; margin-inline: auto; place-items: center; transform: rotate(1.5deg); }
.is-post .media-reading-object > span { justify-self: stretch; }
.is-post .media-reading-object > strong { font-size: clamp(2.5rem, 5vw, 4rem); }
.is-post .media-reading-object > b { padding: .3rem .7rem; color: var(--paper); background: var(--ink); font-size: .85rem; }
.is-post .media-reading-object > i { display: grid; gap: .15rem; text-align: center; opacity: .5; }
.media-reader { position: relative; align-self: end; height: 9.5rem; }
.media-reader .head { position: absolute; z-index: 2; top: .1rem; left: 50%; width: 3rem; height: 3.35rem; background: #d5a27e; border: 1px solid var(--ink); border-radius: 48% 48% 44% 44%; transform: translateX(-50%); }
.media-reader .head::before { position: absolute; top: -.28rem; right: -.2rem; left: -.2rem; height: 1.55rem; background: #26303b; border: 1px solid var(--ink); border-radius: 70% 62% 30% 28%; content: ""; transform: rotate(-4deg); }
.media-reader .head::after { position: absolute; top: 1.85rem; right: .52rem; width: .38rem; height: .22rem; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); content: ""; transform: rotate(-8deg); }
.media-reader .body { position: absolute; right: .15rem; bottom: -1.8rem; left: .15rem; height: 7.6rem; background: #2f4d78; border: 1px solid var(--ink); border-radius: 48% 48% 0 0; transform: perspective(10rem) rotateX(4deg); }
.media-reader .body::before { position: absolute; top: 0; left: 50%; width: 1.4rem; height: 2.4rem; background: #f7f1e7; clip-path: polygon(0 0, 50% 55%, 100% 0, 75% 100%, 25% 100%); content: ""; transform: translateX(-50%); }
.media-reader.is-misled .head::after { width: .5rem; height: .5rem; border: 0; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--ink); }
.media-reader.is-misled .body { background: #6a3e45; }
.media-reading > p { z-index: 3; grid-column: 1 / -1; display: grid; margin: 0; padding: .7rem .9rem; grid-template-columns: 9rem 1fr; gap: .6rem; align-items: center; background: #f2bf64; border: 1px solid var(--ink); }
.media-reading > p span { font: 700 .55rem/1.4 var(--mono); }
.media-reading > p strong { font-family: var(--serif); font-size: .86rem; line-height: 1.45; }
.media-interpretation-figure figcaption { display: grid; padding: 1rem 1.25rem; grid-template-columns: auto 1fr; gap: .8rem; border-top: 1px solid var(--ink); font-size: .75rem; line-height: 1.55; }
.media-interpretation-figure figcaption strong { color: var(--red-dark); font-family: var(--serif); font-size: 1rem; }

.formal-reveal { display: grid; grid-template-columns: 12rem 1fr; padding: clamp(1.5rem, 3.5vw, 3rem) 0; border-top: 8px solid var(--red); border-bottom: 1px solid var(--ink); }
.formal-reveal span { color: var(--red-dark); font: 700 .64rem/1.4 var(--mono); }
.formal-reveal strong { font-family: var(--serif); font-size: clamp(1.65rem, 3vw, 3rem); line-height: 1.25; }
.formal-reveal p { grid-column: 2; margin: 1.2rem 0 0; max-width: 48rem; line-height: 1.9; }
.term-ledger { display: grid; margin-top: 2rem; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.term-ledger details { border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.term-ledger summary { display: grid; min-height: 5rem; padding: 1rem; align-content: center; cursor: pointer; }
.term-ledger summary span { font-family: var(--serif); }
.term-ledger summary small { margin-top: .25rem; color: var(--muted); font: .58rem/1.4 var(--mono); }
.term-ledger details p { margin: 0; padding: 0 1rem 1rem; font-size: .76rem; line-height: 1.75; }
.misconception-note { display: grid; margin-top: 2rem; grid-template-columns: 12rem 1fr; padding: 1rem 0; border-top: 5px solid #efbd6b; border-bottom: 1px solid var(--ink); }
.misconception-note span { color: var(--red-dark); font: 700 .62rem/1.5 var(--mono); }
.misconception-note p { margin: 0; font-family: var(--serif); line-height: 1.75; }

.apply-prompt { display: grid; grid-template-columns: 12rem 1fr; padding: 1.6rem 0; border-top: 8px solid var(--red); border-bottom: 1px solid var(--ink); }
.apply-prompt span, .apply-work span { color: var(--red-dark); font: 700 .62rem/1.5 var(--mono); }
.apply-prompt strong { max-width: 48rem; font-family: var(--serif); font-size: clamp(1.1rem, 2vw, 1.6rem); line-height: 1.7; }
.headline-builder { display: grid; margin-top: 1.5rem; grid-template-columns: minmax(15rem, .7fr) minmax(0, 1.3fr); background: #f2eadc; border: 1px solid var(--ink); }
.headline-builder > .media-story-figure { border: 0; border-right: 1px solid var(--ink); }
.headline-builder > div { padding: clamp(1.2rem, 3vw, 2.4rem); }
.headline-builder-controls { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.headline-builder-controls label { display: grid; gap: .45rem; padding: .8rem; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.headline-builder-controls label > span { color: var(--muted); font: 700 .6rem/1.4 var(--mono); }
.headline-builder blockquote { margin: 1rem 0 0; padding: 1.1rem; background: #fffaf1; border-left: 7px solid var(--red); font-family: var(--serif); font-size: 1.15rem; line-height: 1.7; }
.headline-builder blockquote.is-correct { border-left-color: var(--green); }
.headline-builder > div > p { margin: .7rem 0 0; color: var(--muted); font-size: .7rem; line-height: 1.6; }
.apply-work { display: grid; margin-top: 2rem; grid-template-columns: .75fr 1.25fr; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.apply-work > * { min-width: 0; padding: clamp(1.3rem, 3vw, 2.2rem); border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.apply-work p { font-family: var(--serif); font-size: 1.05rem; line-height: 1.8; }
.apply-work small { color: var(--muted); line-height: 1.7; }
.apply-work label { display: grid; gap: .7rem; }
.apply-work textarea { width: 100%; padding: 1rem; color: var(--ink); background: rgba(255, 255, 255, .48); border: 1px solid var(--ink); border-radius: 0; font: inherit; line-height: 1.8; resize: vertical; }
.success-check { display: grid; margin: 1.5rem 0 0; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.success-check > div { padding: 1rem; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.success-check dt { color: var(--red-dark); font: 700 .61rem/1.5 var(--mono); }
.success-check dd { margin: .65rem 0 0; font-family: var(--serif); line-height: 1.7; }
.next-concept { width: 100%; min-height: 48px; color: var(--ink); background: transparent; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; font: 750 .76rem/1.4 var(--sans); cursor: pointer; }
.next-concept:hover { color: var(--paper); background: var(--red-dark); }
.beat-actions { display: flex; justify-content: space-between; gap: 1rem; margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--ink); }
.beat-actions .button { min-width: 12rem; border-radius: 0; }
.beat-actions button:disabled { cursor: not-allowed; opacity: .45; }
.beat-gate-message { margin: .75rem 0 0; color: var(--red-dark); font: 700 .65rem/1.6 var(--mono); text-align: right; }
.beat-gate-message.is-ready { color: var(--green); }

.evidence-entry { display: grid; max-width: 62rem; gap: .65rem; margin-top: 1.5rem; padding: 1.25rem; background: #ede5d8; border-left: 7px solid var(--red); }
.evidence-entry > span { color: var(--red-dark); font: 800 .7rem/1.55 var(--sans); }
.evidence-entry textarea { width: 100%; padding: 1rem; color: var(--ink); background: rgba(255,255,255,.58); border: 1px solid var(--ink); border-radius: 0; font: inherit; line-height: 1.8; resize: vertical; }
.evidence-entry small { color: var(--muted); font-size: .66rem; line-height: 1.65; }

.knowledge-check { margin-top: 2rem; padding: clamp(1.3rem, 3vw, 2.2rem); color: var(--paper); background: #27313e; border-top: 7px solid #efbd6b; }
.knowledge-check > span { color: #efbd6b; font: 700 .61rem/1.5 var(--mono); }
.knowledge-check h4 { max-width: 42rem; margin: .7rem 0 1.3rem; font-family: var(--serif); font-size: 1.25rem; line-height: 1.6; }
.knowledge-check > div { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #697482; border-left: 1px solid #697482; }
.knowledge-check button { min-height: 8rem; padding: 1rem; color: var(--paper); background: transparent; border: 0; border-right: 1px solid #697482; border-bottom: 1px solid #697482; border-radius: 0; text-align: left; font: .77rem/1.75 var(--sans); cursor: pointer; }
.knowledge-check button:hover, .knowledge-check button[aria-pressed="true"] { color: var(--ink); background: #efbd6b; }
.knowledge-check > p { margin: .9rem 0 0; color: #d2d7dd; font-size: .68rem; }

.learner-support { display: grid; margin-top: 2rem; padding: 1.2rem 0; grid-template-columns: 15rem 1fr; gap: 1.5rem; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.learner-support > div:first-child span { display: block; color: var(--red-dark); font: 700 .6rem/1.5 var(--mono); }
.learner-support > div:first-child strong { display: block; margin-top: .45rem; font-family: var(--serif); line-height: 1.6; }
.support-causes { display: grid; grid-template-columns: repeat(3, 1fr); }
.support-causes button { padding: .8rem; color: inherit; background: transparent; border: 1px solid var(--line); border-radius: 0; font: 700 .67rem/1.55 var(--sans); cursor: pointer; }
.support-causes button + button { border-left: 0; }
.support-causes button:hover { color: var(--paper); background: var(--ink); }
.support-response { display: none; grid-column: 2; margin: 0; padding: 1rem; background: #efe5d3; font-size: .75rem; line-height: 1.75; }
.support-response.is-visible { display: grid; gap: .35rem; }
.support-response b { color: var(--red-dark); font-size: .65rem; }

.completion-gate { margin-top: 1.5rem; padding: 1rem 0; border-top: 6px solid var(--green); border-bottom: 1px solid var(--ink); }
.completion-gate span, .early-finisher span { color: var(--green); font: 700 .61rem/1.5 var(--mono); }
.completion-gate strong { display: block; margin-top: .45rem; font-family: var(--serif); font-size: 1.05rem; line-height: 1.65; }
.completion-gate p { margin: .55rem 0 0; color: var(--muted); font-size: .7rem; }
.concept-complete:disabled { cursor: not-allowed; opacity: .45; }
.early-finisher { margin-top: 1.5rem; padding: 1.2rem; background: #e5e0d2; border-left: 7px solid #efbd6b; }
.early-finisher span { color: var(--red-dark); }
.early-finisher strong { display: block; margin-top: .45rem; font-family: var(--serif); line-height: 1.65; }
.early-finisher p { margin: .6rem 0 0; color: var(--muted); font-size: .75rem; line-height: 1.75; }

.learning-reference, .unit-reference { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: #e7e1d7; }
.learning-reference > summary, .unit-reference > summary { display: grid; width: min(calc(100% - 3rem), var(--max-width)); min-height: 6rem; margin: 0 auto; padding: 1.2rem 0; grid-template-columns: 12rem 1fr; align-items: center; cursor: pointer; }
.learning-reference > summary span, .unit-reference > summary span { color: var(--red-dark); font: 700 .61rem/1.5 var(--mono); }
.learning-reference > summary strong, .unit-reference > summary strong { font-family: var(--serif); font-size: 1.05rem; }
.learning-reference-body { display: grid; width: min(calc(100% - 3rem), var(--max-width)); margin: 0 auto 3rem; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.learning-reference-body > section { min-width: 0; padding: 1.3rem; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.learning-reference-body h4 { margin: 0 0 1rem; font-family: var(--serif); }
.learning-reference-body p, .learning-reference-body li, .learning-reference-body dd { font-size: .72rem; line-height: 1.75; }
.learning-reference-body ul { margin: 0; padding: 0; list-style: none; }
.learning-reference-body li + li { border-top: 1px solid var(--line); }
.learning-reference-body a { display: grid; gap: .2rem; padding: .65rem 0; color: inherit; text-decoration: none; }
.learning-reference-body a span { color: var(--red-dark); font: .55rem/1.4 var(--mono); }
.learning-reference-body a small { color: var(--muted); font-size: .62rem; }
.learning-reference-body dl, .unit-reference dl { margin: 0; }
.learning-reference-body dl > div, .unit-reference dl > div { padding: .65rem 0; border-top: 1px solid var(--line); }
.learning-reference-body dt, .unit-reference dt { color: var(--red-dark); font: 700 .57rem/1.4 var(--mono); }
.learning-reference-body dd, .unit-reference dd { margin: .35rem 0 0; }
.unit-reference { padding: clamp(2.5rem, 5vw, 4rem) 0; background: #27313e; border-color: #707986; color: var(--paper); }
.unit-reference > summary { border-top: 1px solid #707986; border-bottom: 1px solid #707986; }
.unit-reference > summary span { color: #efbd6b; }
.unit-reference > div { display: grid; width: min(calc(100% - 3rem), var(--max-width)); margin: 2rem auto 0; grid-template-columns: 1.5fr .5fr; gap: 3rem; }
.unit-reference dl > div { border-color: #65707d; }
.unit-reference dt { color: #efbd6b; }
.unit-reference nav { display: grid; align-content: start; }
.unit-reference nav a { padding: .75rem 0; color: var(--paper); border-top: 1px solid #65707d; font-size: .72rem; }

/* Learner-first unit pages: reveal only the decision needed now. */
.unit-learning-hero.is-learner-first { padding-bottom: clamp(2.7rem, 5vw, 4.5rem); }
.unit-learning-hero.is-learner-first .unit-breadcrumb { margin-bottom: clamp(2rem, 4vw, 3.2rem); }
.unit-learning-hero.is-learner-first h1 { font-size: clamp(2.8rem, 5vw, 5.2rem); text-wrap: balance; }
.unit-learning-hero.is-learner-first .unit-central-question { align-self: center; }
.unit-learning-hero.is-learner-first .unit-scenario { display: grid; max-width: 64rem; margin-top: clamp(2rem, 4vw, 3.2rem); padding: 1.4rem 0 0; grid-template-columns: minmax(0, 1fr) auto; gap: 2rem; align-items: end; border-top: 1px solid #626d7b; font-family: var(--sans); font-size: .92rem; line-height: 1.9; }
.unit-learning-hero.is-learner-first .unit-scenario p { max-width: 52rem; margin: 0; }
.unit-learning-hero.is-learner-first .unit-scenario .button { color: var(--ink); background: #efbd6b; border-color: #efbd6b; white-space: nowrap; }
.unit-learning-hero.is-learner-first .unit-scenario .button:hover { color: var(--white); background: var(--red-dark); border-color: var(--red-dark); }

.unit-learner-orientation { padding: 0; }
.unit-learner-orientation > .container { display: block; }
.unit-goal-disclosure { border-right: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.unit-goal-disclosure > summary { display: grid; min-height: 5.6rem; padding: 1rem 1.3rem; grid-template-columns: 12rem 1fr; gap: 1rem; align-items: center; cursor: pointer; list-style: none; }
.unit-goal-disclosure > summary::-webkit-details-marker { display: none; }
.unit-goal-disclosure > summary::after { justify-self: end; grid-column: 3; content: "+"; font: 500 1.5rem/1 var(--serif); }
.unit-goal-disclosure[open] > summary::after { content: "−"; }
.unit-goal-disclosure > summary span { margin: 0; }
.unit-goal-disclosure > summary strong { font-family: var(--serif); font-size: 1.05rem; }
.unit-goal-disclosure > div { display: grid; padding: clamp(1.5rem, 4vw, 3rem); grid-template-columns: minmax(0, 1.2fr) minmax(17rem, .8fr); gap: clamp(2rem, 6vw, 6rem); border-top: 1px solid var(--ink); }
.unit-goal-disclosure h2 { max-width: 30ch; font-size: clamp(1.35rem, 2.5vw, 2.25rem); line-height: 1.55; }
.unit-goal-disclosure p { max-width: 42rem; }
.unit-goal-disclosure aside { padding-top: 1rem; border-top: 6px solid var(--red); }
.unit-goal-disclosure aside > strong { display: block; font-family: var(--serif); line-height: 1.65; }
.unit-goal-disclosure aside > div { display: flex; gap: 1rem; margin-top: 1rem; flex-wrap: wrap; }
.unit-goal-disclosure aside a { color: var(--red-dark); font-size: .72rem; font-weight: 800; }

.unit-route { padding: clamp(2.8rem, 5vw, 4.5rem) 0; background: #f7f3ea; border-bottom: 1px solid var(--ink); }
.unit-route header { display: grid; margin-bottom: 1.4rem; grid-template-columns: 10rem 1fr; gap: .2rem 1rem; align-items: end; }
.unit-route header span { color: var(--red-dark); font: 700 .65rem/1.4 var(--mono); letter-spacing: .1em; }
.unit-route header h2 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.8rem); }
.unit-route header p { grid-column: 2; max-width: 44rem; margin: .4rem 0 0; color: var(--muted); font-size: .78rem; }
.unit-route nav { display: grid; grid-template-columns: repeat(7, minmax(9.2rem, 1fr)); overflow-x: auto; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.unit-route button { display: grid; min-width: 9.2rem; min-height: 8.8rem; padding: 1rem; align-content: space-between; color: inherit; background: var(--surface); border: 0; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); border-radius: 0; text-align: left; cursor: pointer; }
.unit-route button:hover { background: #ebe2d2; }
.unit-route button.is-current { color: var(--paper); background: var(--ink); box-shadow: inset 0 6px 0 #efbd6b; }
.unit-route button > span { color: var(--red-dark); font: 700 .65rem/1 var(--mono); }
.unit-route button.is-current > span { color: #efbd6b; }
.unit-route button > strong { font-family: var(--serif); font-size: .92rem; line-height: 1.5; }
.unit-route button > small { color: var(--muted); font: .58rem/1.4 var(--mono); }
.unit-route button.is-current > small { color: #c8cdd4; }
.unit-route button.is-complete:not(.is-current) > small { color: var(--green); font-weight: 800; }

.learning-studio-head { padding-top: clamp(3.2rem, 6vw, 5.3rem); }
.learning-studio-head h2 { max-width: 27ch; font-size: clamp(2.2rem, 4.2vw, 4.2rem); line-height: 1.12; }
.learning-studio-head > small { max-width: 29rem; font-family: var(--sans); font-size: .75rem; line-height: 1.75; }
.learning-studio-head > small b { color: var(--red-dark); font-size: .68rem; }
.learning-beat-stage { width: min(calc(100% - 3rem), 1080px); }
.learning-beat > h3 { max-width: 25ch; font-size: clamp(1.85rem, 3.5vw, 3.4rem); }
.scene-board { max-width: none; grid-template-columns: minmax(0, 1.35fr) minmax(15rem, .65fr); gap: 1rem 2.5rem; }
.scene-board > span { grid-column: 1 / -1; }
.scene-board > p { grid-column: 1; align-self: center; font-size: clamp(1.08rem, 2vw, 1.65rem); }

.consultation-figure { position: relative; z-index: 1; grid-column: 2; margin: 0; padding: 1.2rem; background: #19222d; border: 1px solid #667384; }
.consultation-people { display: grid; grid-template-columns: repeat(5, 1fr); gap: .65rem; }
.consultation-people > i, .consultation-figure figcaption i { display: block; width: 100%; aspect-ratio: 1; border: 2px solid currentColor; border-radius: 50% 50% 42% 42%; }
.consultation-people > i::after { display: block; width: 64%; height: 32%; margin: 78% auto 0; background: currentColor; border-radius: 50% 50% 0 0; content: ""; }
.consultation-figure .is-helped { color: #75c6a7; }
.consultation-figure .is-waiting { color: #efbd6b; }
.consultation-figure figcaption { display: grid; gap: .45rem; margin-top: 1.5rem; font-size: .66rem; }
.consultation-figure figcaption span { display: grid; grid-template-columns: .85rem 1fr; gap: .55rem; align-items: center; }

.evidence-sorter { margin: clamp(2rem, 4vw, 3.2rem) 0 0; border-top: 8px solid var(--red); }
.evidence-sorter > header { display: flex; min-height: 6rem; padding: 1rem 0; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--ink); }
.evidence-sorter > header span { color: var(--red-dark); font: 700 .62rem/1.4 var(--mono); letter-spacing: .08em; }
.evidence-sorter > header h4 { margin: .35rem 0 0; font-family: var(--serif); font-size: clamp(1.25rem, 2vw, 1.75rem); }
.evidence-sorter > header > strong { font: 700 1.15rem/1 var(--mono); }
.evidence-sorter > p { max-width: 45rem; color: var(--muted); font-size: .76rem; }
.evidence-sort-list { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.evidence-sort-list article { display: grid; min-width: 0; min-height: 15rem; padding: 1rem; grid-template-columns: 2rem 1fr; gap: .6rem 1rem; align-content: start; background: var(--surface); border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.evidence-sort-list article.is-correct { box-shadow: inset 6px 0 0 var(--green); }
.evidence-sort-list article.is-wrong { box-shadow: inset 6px 0 0 var(--red); }
.evidence-sort-list article > span { color: var(--red-dark); font: 700 .64rem/1.4 var(--mono); }
.evidence-sort-list article > p { min-height: 4.8rem; margin: 0; font-family: var(--serif); font-size: 1rem; line-height: 1.7; }
.evidence-sort-list label { grid-column: 2; display: grid; gap: .35rem; }
.evidence-sort-list label span { color: var(--muted); font-size: .65rem; font-weight: 700; }
.evidence-sort-list select { width: 100%; padding: .72rem 2rem .72rem .7rem; color: var(--ink); background: #fffefa; border: 1px solid var(--ink); border-radius: 0; font: 700 .73rem/1.4 var(--sans); }
.evidence-sort-list small { grid-column: 2; min-height: 3rem; color: var(--muted); font-size: .67rem; line-height: 1.55; }
.evidence-sort-list .is-correct small { color: var(--green); }
.evidence-sort-list .is-wrong small { color: var(--red-dark); }
.sort-summary { display: grid; padding: 1rem; grid-template-columns: 12rem 1fr; gap: 1rem; background: #eee6d8; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.sort-summary.is-complete { color: var(--paper); background: var(--green); }
.sort-summary p { margin: 0; font-size: .72rem; }

.synthesis-disclosure { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.synthesis-disclosure > summary { display: grid; min-height: 7rem; padding: 1.3rem 0; grid-template-columns: 12rem 1fr auto; gap: 1rem; align-items: center; cursor: pointer; list-style: none; }
.synthesis-disclosure > summary::-webkit-details-marker { display: none; }
.synthesis-disclosure > summary span { color: #efbd6b; font: 700 .64rem/1.4 var(--mono); }
.synthesis-disclosure > summary strong { font-family: var(--serif); font-size: clamp(1.25rem, 2.2vw, 2rem); }
.synthesis-disclosure > summary::after { content: "+"; font: 500 1.8rem/1 var(--serif); }
.synthesis-disclosure[open] > summary::after { content: "−"; }
.synthesis-disclosure > div { padding-bottom: 3rem; }

@media (max-width: 760px) {
  .unit-learning-hero { padding-top: 3rem; }
  .unit-learning-hero-grid, .unit-learner-orientation > .container { grid-template-columns: 1fr; }
  .unit-learning-hero h1 { font-size: clamp(2.7rem, 15vw, 4.4rem); }
  .unit-learning-hero.is-learner-first .unit-scenario { grid-template-columns: 1fr; gap: 1rem; }
  .unit-learning-hero.is-learner-first .unit-scenario .button { justify-self: start; white-space: normal; }
  .unit-progress-bar { top: 62px; }
  .unit-progress-bar .container { grid-template-columns: 1fr auto; min-height: 74px; gap: .8rem; }
  .unit-progress-bar progress { grid-column: 1 / -1; grid-row: 2; margin-bottom: .65rem; }
  .unit-progress-bar label { grid-column: 2; grid-row: 1; font-size: 0; }
  .unit-progress-bar label select { width: 8.5rem; font-size: .64rem; }
  .unit-sequence .container { width: 100%; grid-template-columns: repeat(7, minmax(9.5rem, 9.5rem)); }
  .unit-sequence button { min-width: 9.5rem; min-height: 8.6rem; }
  .unit-goal-disclosure > summary { grid-template-columns: 1fr auto; gap: .45rem 1rem; }
  .unit-goal-disclosure > summary span, .unit-goal-disclosure > summary strong { grid-column: 1; }
  .unit-goal-disclosure > summary::after { grid-column: 2; grid-row: 1 / span 2; }
  .unit-goal-disclosure > div { grid-template-columns: 1fr; }
  .unit-route header { grid-template-columns: 1fr; }
  .unit-route header p { grid-column: 1; }
  .unit-route nav { grid-template-columns: repeat(7, minmax(9.5rem, 9.5rem)); }
  .learning-studio-head { grid-template-columns: 1fr; }
  .learning-studio-head h2, .learning-studio-head > small { grid-column: 1; }
  .learning-studio-head > small { margin-top: 1.2rem; padding-left: .8rem; }
  .learning-beats { width: 100%; grid-template-columns: repeat(5, minmax(8.3rem, 8.3rem)); overflow-x: auto; }
  .learning-beats button { min-height: 5.3rem; }
  .learning-beat { min-height: 30rem; }
  .scene-board { grid-template-columns: 1fr; padding: 1.4rem; }
  .scene-board:has(.media-story-figure), .media-source-card, .headline-builder { grid-template-columns: 1fr; }
  .scene-board > span, .scene-board > p, .consultation-figure { grid-column: 1; }
  .scene-board:has(.media-story-figure) > span { grid-column: 1; }
  .media-source-card > .media-story-figure, .headline-builder > .media-story-figure { border-right: 0; border-bottom: 1px solid var(--ink); }
  .media-source-card dl, .headline-builder-controls { grid-template-columns: 1fr; }
  .media-source-card > div > p, .headline-audit-summary { grid-template-columns: 1fr; }
  .headline-audit > .media-story-figure { grid-template-columns: 1fr; }
  .headline-audit > .media-story-figure .media-story-image { max-width: none; }
  .headline-audit-list { grid-template-columns: 1fr; }
  .headline-audit-list article { min-height: 11rem; }
  .consultation-figure { margin-top: 1rem; }
  .evidence-sort-list { grid-template-columns: 1fr; }
  .evidence-sort-list article { min-height: 0; }
  .sort-summary { grid-template-columns: 1fr; }
  .decision-pair, .term-ledger, .apply-work, .success-check, .learning-reference-body, .unit-reference > div { grid-template-columns: 1fr; }
  .decision-pair button { min-height: 11rem; }
  .process-ribbon { grid-template-columns: 1fr; }
  .process-ribbon > div { min-height: 7rem; }
  .process-ribbon > div:not(:last-child)::after { top: auto; right: 1rem; bottom: -14px; content: "↓"; transform: none; }
  .media-transformation-canvas { grid-template-columns: 1fr; }
  .media-transform-stage { min-height: 18rem; }
  .media-transform-link { min-height: 8.5rem; border: 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
  .media-transform-link::after { top: auto; right: 50%; bottom: -11px; transform: translateX(50%) rotate(135deg); }
  .media-copy-sheets { height: 2.7rem; }
  .media-transformation-figure figcaption { grid-template-columns: 1fr; gap: .2rem; }
  .media-interpretation-figure > header, .media-interpretation-figure figcaption { grid-template-columns: 1fr; gap: .3rem; }
  .media-interpretation-pair { grid-template-columns: 1fr; }
  .media-interpretation-pair::before { top: 50%; left: 0; width: 100%; height: 1px; }
  .media-reading { min-height: 17rem; padding: 1.2rem; grid-template-columns: minmax(9rem, 1fr) 5.4rem; }
  .media-reading > p { grid-template-columns: 1fr; gap: .2rem; }
  .media-reader { height: 8rem; }
  .formal-reveal, .misconception-note, .apply-prompt, .learning-model > aside, .learning-reference > summary, .unit-reference > summary { grid-template-columns: 1fr; gap: .8rem; }
  .formal-reveal p { grid-column: 1; }
  .choice-response { display: none; }
  .choice-response.is-visible { display: grid; }
  .knowledge-check > div, .learner-support { grid-template-columns: 1fr; }
  .support-causes { grid-template-columns: 1fr; }
  .support-causes button + button { border-top: 0; border-left: 1px solid var(--line); }
  .support-response { grid-column: 1; }
  .beat-actions .button { min-width: 0; flex: 1; padding-inline: .8rem; }
  .unit-reference > div { gap: 1.5rem; }
  .synthesis-disclosure > summary { grid-template-columns: 1fr auto; }
  .synthesis-disclosure > summary span, .synthesis-disclosure > summary strong { grid-column: 1; }
  .synthesis-disclosure > summary::after { grid-column: 2; grid-row: 1 / span 2; }
}