:root {
  --reader-ink: oklch(22% 0.03 272);
  --reader-muted: oklch(48% 0.035 272);
  --reader-paper: oklch(98% 0.008 82);
  --reader-canvas: oklch(95% 0.014 275);
  --reader-line: oklch(86% 0.02 275);
  --reader-see: oklch(54% 0.2 272);
  --reader-see-soft: oklch(94% 0.035 272);
  --reader-build: oklch(57% 0.19 303);
  --reader-build-soft: oklch(95% 0.035 303);
  --reader-prove: oklch(72% 0.16 57);
  --reader-prove-soft: oklch(96% 0.045 57);
  --reader-established: oklch(58% 0.13 158);
  --reader-alert: oklch(57% 0.18 24);
  --reader-ui: "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
  --reader-text: Charter, "Iowan Old Style", Georgia, serif;
}

html {
  scroll-padding-top: 92px;
}

body.reader-v94 {
  min-height: 100vh;
  background:
    linear-gradient(90deg, transparent 0 48px, oklch(89% 0.025 24 / 0.5) 48px 49px, transparent 49px),
    radial-gradient(circle at 12% 0%, oklch(92% 0.045 272 / 0.7), transparent 26rem),
    var(--reader-canvas);
  color: var(--reader-ink);
  font-family: var(--reader-text);
  font-size: 18px;
  line-height: 1.66;
}

.reader-v94 .topbar {
  min-height: 72px;
  border-bottom-color: var(--reader-line);
  background: oklch(98% 0.008 82 / 0.96);
  font-family: var(--reader-ui);
}

.reader-v94 .brand-mark {
  border-radius: 4px 13px 4px 13px;
  background: var(--reader-ink);
  box-shadow: 6px 6px 0 oklch(82% 0.12 57 / 0.85);
}

.reader-v94 .brand-copy strong {
  font-size: 15px;
}

.reader-v94 .nav a {
  min-height: 44px;
  padding: 12px 14px;
  border-radius: 999px;
  font-size: 13px;
}

.reader-v94 .nav a:hover,
.reader-v94 .nav a[aria-current="page"] {
  background: var(--reader-ink);
  color: var(--reader-paper);
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: 8px;
  left: 8px;
  padding: 10px 14px;
  transform: translateY(-140%);
  border-radius: 4px;
  background: var(--reader-ink);
  color: white;
  font-family: var(--reader-ui);
}

.skip-link:focus {
  transform: translateY(0);
}

.reader-v94 a:focus-visible,
.reader-v94 button:focus-visible {
  outline: 3px solid var(--reader-prove);
  outline-offset: 3px;
}

.reader-shell,
.act-shell {
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto;
}

.reader-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
  gap: clamp(30px, 6vw, 88px);
  align-items: end;
  min-height: 66vh;
  padding: 72px 0 58px;
}

.reader-v94 .eyebrow {
  color: var(--reader-see);
  font-family: var(--reader-ui);
  font-size: 12px;
}

.reader-v94 h1,
.reader-v94 h2,
.reader-v94 h3 {
  color: var(--reader-ink);
  font-family: var(--reader-ui);
}

.reader-v94 h1 {
  max-width: 13ch;
  margin-bottom: 24px;
  font-size: clamp(48px, 7.2vw, 94px);
  line-height: 0.94;
  letter-spacing: -0.055em;
}

.reader-thesis {
  max-width: 68ch;
  font-size: clamp(18px, 2vw, 22px);
}

.reader-thesis p:last-child {
  margin-bottom: 0;
}

.reader-promise {
  position: relative;
  padding: 30px 28px 26px;
  border: 1px solid var(--reader-line);
  border-radius: 4px 32px 4px 32px;
  background: var(--reader-paper);
  box-shadow: 14px 14px 0 oklch(88% 0.025 272);
}

.reader-promise::before {
  position: absolute;
  top: -14px;
  left: 30px;
  padding: 4px 10px;
  transform: rotate(-2deg);
  background: var(--reader-prove-soft);
  content: "Contrat de lecture";
  font-family: var(--reader-ui);
  font-size: 12px;
  font-weight: 800;
}

.reader-promise strong {
  display: block;
  margin-bottom: 14px;
  font-family: var(--reader-ui);
  font-size: 21px;
  line-height: 1.25;
}

.reader-promise ul {
  padding-left: 20px;
  color: var(--reader-muted);
}

.reader-actions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin: 38px 0 18px;
  font-family: var(--reader-ui);
}

.reader-action {
  display: grid;
  min-height: 132px;
  align-content: space-between;
  padding: 18px;
  border: 1px solid var(--reader-line);
  border-radius: 3px 22px 3px 22px;
  background: var(--reader-paper);
  color: var(--reader-ink);
  font-weight: 750;
  text-decoration: none;
  transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 200ms cubic-bezier(0.16, 1, 0.3, 1);
}

.reader-action::before {
  color: var(--act-color, var(--reader-see));
  content: attr(data-acte);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.reader-action:hover {
  transform: translateY(-4px);
  box-shadow: 8px 9px 0 color-mix(in oklch, var(--act-color, var(--reader-see)) 20%, white);
}

.reader-action.see { --act-color: var(--reader-see); }
.reader-action.build { --act-color: var(--reader-build); }
.reader-action.prove { --act-color: var(--reader-prove); }

.configuration-band,
.reader-limit {
  display: grid;
  grid-template-columns: minmax(240px, 0.75fr) minmax(0, 1.25fr) auto;
  gap: 28px;
  align-items: center;
  margin: 30px 0 80px;
  padding: 28px 30px;
  border-top: 1px solid var(--reader-ink);
  border-bottom: 1px solid var(--reader-ink);
  background: var(--reader-paper);
}

.configuration-band h2,
.reader-limit h2 {
  margin: 0;
  font-size: 24px;
  line-height: 1.15;
}

.configuration-band p,
.reader-limit p {
  margin: 0;
}

.section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.45fr);
  gap: 48px;
  align-items: end;
  margin-bottom: 36px;
}

.section-heading h2 {
  max-width: 18ch;
  margin: 0;
  font-size: clamp(34px, 5vw, 64px);
  line-height: 0.98;
  letter-spacing: -0.045em;
}

.journey-rail {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: gesture;
}

.journey-step {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) minmax(170px, auto);
  gap: 24px;
  align-items: center;
  min-height: 150px;
  padding: 26px 0;
  border-top: 1px solid var(--reader-line);
}

.journey-step:last-child {
  border-bottom: 1px solid var(--reader-line);
}

.journey-number {
  font-family: var(--reader-ui);
  font-size: 15px;
  font-weight: 850;
}

.journey-body h3 {
  margin-bottom: 8px;
  font-size: 25px;
  line-height: 1.18;
}

.journey-body p {
  max-width: 67ch;
  margin-bottom: 0;
}

.journey-object {
  color: var(--reader-see);
  font-family: var(--reader-ui);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.journey-step > a,
.proof-link,
.text-link {
  min-height: 44px;
  padding: 11px 14px;
  border: 1px solid var(--reader-line);
  border-radius: 999px;
  background: var(--reader-paper);
  color: var(--reader-ink);
  cursor: pointer;
  font-family: var(--reader-ui);
  font-size: 13px;
  font-weight: 750;
  text-align: center;
  text-decoration: none;
}

.case-intro {
  padding: 100px 0 40px;
}

.case-composition {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  gap: 18px;
}

.case-side {
  display: grid;
  gap: 18px;
}

.case-feature {
  min-height: 230px;
  padding: 30px;
  border: 1px solid var(--reader-line);
  border-radius: 3px 28px 3px 28px;
  background: var(--reader-paper);
}

.case-feature.noria {
  display: flex;
  min-height: 478px;
  flex-direction: column;
  justify-content: flex-end;
  background: var(--reader-see-soft);
}

.case-feature.oree { background: var(--reader-build-soft); }
.case-feature.kairn { background: var(--reader-prove-soft); }

.case-feature span {
  font-family: var(--reader-ui);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.case-feature h3 {
  margin: 8px 0 12px;
  font-size: 38px;
}

.reader-deep-link {
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
  margin: 40px 0 90px;
  padding: 20px 0;
  border-bottom: 1px solid var(--reader-line);
}

.reader-footer {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  padding: 30px max(24px, calc((100vw - 1240px) / 2));
  border-top: 1px solid var(--reader-line);
  background: var(--reader-paper);
  color: var(--reader-muted);
  font-family: var(--reader-ui);
  font-size: 13px;
}

.reader-footer nav {
  display: flex;
  gap: 18px;
}

/* Pages Voir, Construire et Démontrer */
.act-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 60px;
  align-items: end;
  min-height: 56vh;
  padding: 72px 0 58px;
}

.act-hero::after {
  position: absolute;
  right: 0;
  bottom: 42px;
  width: 180px;
  height: 180px;
  border: 1px solid var(--act-color);
  border-radius: 50%;
  content: "";
  opacity: 0.28;
}

.act-hero h1 {
  max-width: 12ch;
}

.act-hero-note {
  position: relative;
  z-index: 1;
  padding: 24px;
  border: 1px solid var(--reader-line);
  background: var(--reader-paper);
  box-shadow: 10px 10px 0 var(--act-soft);
}

.act-hero-note strong {
  display: block;
  margin-bottom: 8px;
  font-family: var(--reader-ui);
}

.act-voir { --act-color: var(--reader-see); --act-soft: var(--reader-see-soft); }
.act-construire { --act-color: var(--reader-build); --act-soft: var(--reader-build-soft); }
.act-demontrer { --act-color: var(--reader-prove); --act-soft: var(--reader-prove-soft); }

.act-page .eyebrow,
.act-page .section-code,
.act-page .chapter-number {
  color: var(--act-color);
}

.act-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 52px;
  align-items: start;
  padding-bottom: 90px;
}

.act-summary {
  position: sticky;
  top: 94px;
  padding: 18px 0;
  border-top: 3px solid var(--act-color);
  border-bottom: 1px solid var(--reader-line);
  font-family: var(--reader-ui);
}

.act-summary strong {
  display: block;
  margin-bottom: 12px;
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.act-summary a {
  display: block;
  padding: 8px 0;
  color: var(--reader-muted);
  font-size: 13px;
  line-height: 1.3;
  text-decoration: none;
}

.act-summary a:hover {
  color: var(--act-color);
}

.chapter-block {
  margin-bottom: 84px;
}

.chapter-heading {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 22px;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 2px solid var(--reader-ink);
}

.chapter-number {
  font-family: var(--reader-ui);
  font-size: 42px;
  font-weight: 850;
  line-height: 1;
}

.chapter-heading h2 {
  max-width: 24ch;
  margin: 0;
  font-size: clamp(30px, 4vw, 50px);
  line-height: 1.02;
  letter-spacing: -0.04em;
}

.memory-section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  gap: 36px;
  padding: 34px 0 42px;
  border-bottom: 1px solid var(--reader-line);
}

.memory-section:nth-of-type(even) .section-main {
  padding-left: 30px;
  border-left: 1px solid var(--act-color);
}

.section-code {
  display: block;
  margin-bottom: 8px;
  font-family: var(--reader-ui);
  font-size: 13px;
  font-weight: 850;
  letter-spacing: 0.1em;
}

.memory-section h3 {
  max-width: 28ch;
  margin-bottom: 16px;
  font-size: 28px;
  line-height: 1.15;
}

.section-idea {
  max-width: 67ch;
  margin-bottom: 22px;
  font-size: 19px;
}

.paragraph-path {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: paragraph;
}

.paragraph-path li {
  position: relative;
  padding: 8px 0 8px 42px;
  color: var(--reader-muted);
  counter-increment: paragraph;
}

.paragraph-path li::before {
  position: absolute;
  left: 0;
  width: 28px;
  height: 28px;
  border: 1px solid var(--reader-line);
  border-radius: 50%;
  content: counter(paragraph);
  color: var(--act-color);
  font-family: var(--reader-ui);
  font-size: 12px;
  font-weight: 800;
  line-height: 27px;
  text-align: center;
}

.section-output {
  display: grid;
  align-content: start;
  gap: 14px;
}

.object-card,
.annex-bridge,
.status-note {
  padding: 16px;
  border: 1px solid var(--reader-line);
  background: var(--reader-paper);
  font-family: var(--reader-ui);
  font-size: 13px;
  line-height: 1.45;
}

.object-card {
  border-top: 4px solid var(--act-color);
}

.object-card span,
.annex-bridge span,
.status-note span {
  display: block;
  margin-bottom: 5px;
  color: var(--reader-muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.object-card strong,
.annex-bridge strong {
  display: block;
}

.annex-bridge {
  border-style: dashed;
  text-decoration: none;
}

.annex-bridge:hover {
  border-color: var(--act-color);
}

.status-note {
  background: var(--act-soft);
}

.compare-system {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin: 28px 0 36px;
}

.compare-system article {
  padding: 22px;
  border-top: 5px solid var(--reader-line);
  background: var(--reader-paper);
}

.compare-system article:nth-child(2) { border-color: var(--reader-prove); }
.compare-system article:nth-child(3) { border-color: var(--reader-see); }
.compare-system h3 { font-size: 18px; }
.compare-system p { margin: 0; font-size: 16px; }

.next-act {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
  margin: 20px 0 80px;
  padding: 30px;
  border: 1px solid var(--reader-ink);
  background: var(--reader-paper);
}

/* Tiroir de preuve */
.proof-drawer {
  position: fixed;
  z-index: 60;
  top: 72px;
  right: 0;
  bottom: 0;
  width: min(480px, 100vw);
  overflow-y: auto;
  padding: 26px;
  transform: translateX(105%);
  border-left: 1px solid var(--reader-ink);
  background: var(--reader-paper);
  box-shadow: -20px 0 50px oklch(22% 0.03 272 / 0.14);
  transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1);
}

.proof-drawer[data-open="true"] {
  transform: translateX(0);
}

.proof-drawer-header {
  display: flex;
  gap: 20px;
  align-items: start;
  justify-content: space-between;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--reader-line);
}

.proof-drawer-header h2 {
  margin: 4px 0 0;
  font-size: 26px;
  line-height: 1.15;
}

.proof-close {
  min-width: 44px;
  min-height: 44px;
  border: 1px solid var(--reader-line);
  border-radius: 50%;
  background: white;
  cursor: pointer;
  font-size: 20px;
}

.proof-status {
  display: inline-flex;
  margin: 18px 0;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--reader-see-soft);
  font-family: var(--reader-ui);
  font-size: 12px;
  font-weight: 850;
}

.proof-drawer-section {
  padding: 18px 0;
  border-bottom: 1px solid var(--reader-line);
}

.proof-drawer-section h3 {
  margin-bottom: 8px;
  font-size: 16px;
}

.proof-drawer-section p,
.proof-drawer-section li {
  font-size: 16px;
}

.proof-drawer-section ul {
  margin-bottom: 0;
  padding-left: 20px;
}

.proof-app-link {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  margin: 2px 0 12px;
  padding: 10px 14px;
  border: 1px solid var(--reader-ink);
  border-radius: 999px;
  background: var(--reader-ink);
  color: white;
  font-family: var(--reader-ui);
  font-size: 13px;
  font-weight: 850;
  text-decoration: none;
}

.proof-app-link:hover,
.proof-app-link:focus-visible {
  background: var(--reader-see);
  color: var(--reader-ink);
}

.proof-internal-route {
  font-family: var(--reader-mono);
  font-size: 13px !important;
}

.proof-access-condition,
.proof-route-missing {
  color: var(--reader-muted);
}

.proof-error {
  color: var(--reader-alert);
}

@media (max-width: 980px) {
  body.reader-v94 {
    background: var(--reader-canvas);
  }

  .reader-v94 .topbar {
    flex-wrap: wrap;
  }

  .reader-v94 .brand,
  .reader-v94 .toolbar {
    min-width: auto;
  }

  .reader-v94 .nav {
    order: 3;
    width: 100%;
    justify-content: flex-start;
  }

  .reader-shell,
  .act-shell {
    width: min(100% - 28px, 760px);
  }

  .reader-hero,
  .act-hero,
  .section-heading,
  .configuration-band,
  .reader-limit,
  .case-composition,
  .act-layout,
  .memory-section {
    grid-template-columns: 1fr;
  }

  .reader-hero,
  .act-hero {
    min-height: auto;
    padding-top: 48px;
  }

  .reader-actions,
  .compare-system {
    grid-template-columns: 1fr;
  }

  .reader-action {
    min-height: 96px;
  }

  .journey-step {
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .journey-step > a,
  .journey-step > button {
    grid-column: 2;
    justify-self: start;
  }

  .act-summary {
    position: static;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }

  .act-summary strong {
    grid-column: 1 / -1;
  }

  .memory-section:nth-of-type(even) .section-main {
    padding-left: 0;
    border-left: 0;
  }

  .section-output {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  body.reader-v94 {
    font-size: 17px;
  }

  .reader-v94 .toolbar {
    display: none;
  }

  .reader-v94 .topbar {
    gap: 6px;
    padding: 9px 14px 7px;
  }

  .reader-v94 .brand {
    width: 100%;
  }

  .reader-v94 .brand-copy span {
    white-space: nowrap;
  }

  .reader-v94 .nav {
    flex: 0 0 100%;
  }

  .reader-v94 .nav a {
    min-height: 38px;
    padding: 9px 9px;
    font-size: 11.5px;
  }

  .reader-v94 h1 {
    font-size: 48px;
  }

  .reader-actions,
  .section-output,
  .act-summary,
  .reader-footer,
  .next-act {
    grid-template-columns: 1fr;
  }

  .reader-footer {
    display: grid;
  }

  .reader-footer nav {
    display: grid;
  }

  .chapter-heading {
    grid-template-columns: 50px minmax(0, 1fr);
  }

  .chapter-number {
    font-size: 30px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

@media print {
  body.reader-v94 {
    background: white;
    font-size: 11pt;
  }

  .reader-shell,
  .act-shell {
    width: auto;
  }

  .act-summary,
  .reader-footer,
  .proof-drawer,
  .reader-actions,
  .reader-deep-link {
    display: none !important;
  }

  .reader-hero,
  .act-hero {
    min-height: auto;
    padding: 20mm 0 10mm;
  }

  .memory-section {
    break-inside: avoid;
  }
}

/* ---- Titre agréé et lexique du titre (accueil V9.4, 2026-08-03) ---- */
.reader-v94 h1.title-agreed {
  max-width: 24ch;
  margin-bottom: 10px;
  font-size: clamp(34px, 4.6vw, 58px);
  line-height: 1.12;
  letter-spacing: -0.03em;
}

.reader-hero {
  min-height: 52vh;
  align-items: center;
}

.th {
  padding: 0 2px;
  background-image: linear-gradient(transparent 68%, var(--th-soft, var(--reader-see-soft)) 68%);
}

.th-relation { --th-soft: oklch(90% 0.06 272); }
.th-actif { --th-soft: oklch(90% 0.08 158); }
.th-cabinet { --th-soft: oklch(93% 0.08 57); }
.th-kmia { --th-soft: oklch(92% 0.07 303); }

.title-sub {
  max-width: 60ch;
  color: var(--reader-muted);
  font-family: var(--reader-ui);
  font-size: clamp(16px, 1.8vw, 20px);
  font-weight: 600;
}

.title-lexicon { padding: 6px 0 30px; }

.title-lexicon .visually-strong {
  margin: 4px 0 22px;
  font-size: clamp(22px, 2.6vw, 30px);
  letter-spacing: -0.02em;
}

.lexicon-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
}

.lexicon-card {
  --lx: var(--reader-see);
  padding: 22px 20px 20px;
  border: 1px solid var(--reader-line);
  border-top: 4px solid var(--lx);
  border-radius: 4px 18px 4px 18px;
  background: var(--reader-paper);
}

.lexicon-card dt {
  margin-bottom: 10px;
  color: var(--lx);
  font-family: var(--reader-ui);
  font-size: 15px;
  font-weight: 800;
  line-height: 1.25;
}

.lexicon-card dd {
  margin: 0;
  color: var(--reader-muted);
  font-family: var(--reader-text);
  font-size: 15.5px;
  line-height: 1.55;
}

.lx-relation { --lx: var(--reader-see); }
.lx-actif { --lx: var(--reader-established); }
.lx-cabinet { --lx: oklch(52% 0.14 57); }
.lx-kmia { --lx: var(--reader-build); }

.reader-why { padding: 10px 0 30px; }

.reader-why h2 {
  margin-bottom: 14px;
  font-size: clamp(26px, 3.2vw, 38px);
  letter-spacing: -0.025em;
}

@media (max-width: 1080px) {
  .lexicon-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .lexicon-grid { grid-template-columns: 1fr; }
  .reader-hero { min-height: auto; }
}

.audience-band { padding: 6px 0 30px; }

.audience-band .visually-strong {
  margin: 4px 0 20px;
  font-size: clamp(22px, 2.6vw, 30px);
  letter-spacing: -0.02em;
}

.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.audience-grid li {
  padding: 20px 20px 18px;
  border: 1px solid var(--reader-line);
  border-left: 4px solid var(--reader-ink);
  border-radius: 4px 18px 4px 18px;
  background: var(--reader-paper);
}

.audience-grid strong {
  display: block;
  margin-bottom: 8px;
  font-family: var(--reader-ui);
  font-size: 16px;
  line-height: 1.3;
}

.audience-grid p {
  margin: 0;
  color: var(--reader-muted);
  font-family: var(--reader-text);
  font-size: 15.5px;
  line-height: 1.55;
}

@media (max-width: 900px) {
  .audience-grid { grid-template-columns: 1fr; }
}

/* ── Encadrés du corps (ouverture de chapitre, à emporter, repère de projection) ──
   Ajoutés le 4 août 2026 : le PDF les stylait (print_jury.css), le site les rendait plats. */
.reader-v94 .ouverture-chapitre,
.reader-v94 .conclusions-usage,
.reader-v94 .repere-projection {
  border-radius: 12px;
  padding: 1.1rem 1.4rem;
  margin: 1.6rem 0;
  line-height: 1.6;
}
.reader-v94 .ouverture-chapitre { border-left: 4px solid #4338CA; background: #F5F5FF; }
.reader-v94 .conclusions-usage  { border-left: 4px solid #BE185D; background: #FDF6F9; }
.reader-v94 .repere-projection  { border-left: 4px solid #B45309; background: #FFFBEB; }
.reader-v94 .titre-actions,
.reader-v94 .titre-conclusions,
.reader-v94 .titre-repere {
  font-variant: small-caps;
  font-weight: 700;
  letter-spacing: 0.06em;
  margin: 0 0 0.5rem;
}
.reader-v94 .titre-actions { color: #4338CA; }
.reader-v94 .titre-conclusions { color: #BE185D; }
.reader-v94 .titre-repere { color: #B45309; }
.reader-v94 .ouverture-chapitre ul,
.reader-v94 .conclusions-usage ul,
.reader-v94 .repere-projection ul { margin: 0.4rem 0 0.4rem 1.2rem; padding: 0; }

/* ── Refonte pédagogique du 30 août 2026 : boîte à outils, pont ISO, cas, parole de terrain ── */
.reader-v94 .boite-outils,
.reader-v94 .pont-iso,
.reader-v94 .cas,
.reader-v94 .verbatim {
  border-radius: 12px;
  padding: 1rem 1.3rem;
  margin: 1.4rem 0;
  line-height: 1.55;
}
.reader-v94 .boite-outils { border-left: 4px solid #0F766E; background: #F0FDFA; font-size: 0.95em; }
.reader-v94 .boite-outils table { margin: 0.4rem 0; font-size: 0.93em; }
.reader-v94 .pont-iso { border: 1px solid #C7D2FE; border-left: 4px solid #6366F1; background: #F8F8FF; font-size: 0.93em; }
.reader-v94 .pont-iso p { margin: 0.15rem 0; }
.reader-v94 .cas { border-left: 4px solid #B45309; background: #FFF7ED; font-style: normal; }
.reader-v94 .verbatim { border-left: 4px solid #6B7280; background: #F9FAFB; }
.reader-v94 .titre-outils {
  font-variant: small-caps; font-weight: 700; letter-spacing: 0.06em; margin: 0 0 0.5rem; color: #0F766E;
}


/* ==========================================================================
   BARRE DE NAVIGATION UNIQUE DU SITE (31 août 2026)

   Une seule barre pour les quarante-trois pages de surface, les trente-deux
   pages de lecture, les vingt-cinq pages d'annexes et la bibliographie. Le
   bloc HTML est produit par `scripts/appliquer_barre.py`, qui sert aussi les
   trois générateurs : la mise en forme et le balisage ne peuvent plus diverger.

   Tout est porté par la classe « barre-site », posée sur le <header> : la
   barre se met donc en forme même sur une page qui ne charge pas `styles.css`
   ni la classe `reader-v94` sur son corps (`etude.html`, gabarit à part).

   Deux niveaux : les sept entrées du texte et de ses appareils tiennent en
   ligne à 1 280 px ; le reste du site vit dans un menu « Plus », un <details>
   natif — pas de JavaScript, ouverture au clavier par Entrée ou Espace.

   La pastille « Méridien : … » est posée par `pont-app.js` dans `.topbar .nav` :
   elle est renvoyée à droite ci-dessous, sans être touchée.
   ========================================================================== */

header.topbar.barre-site {
  position: sticky;
  z-index: 30;
  top: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 10px;
  min-height: 60px;
  padding: 8px 18px;
  border-bottom: 1px solid var(--reader-line, #ded7cb);
  background: oklch(98% 0.008 82 / 0.96);
  backdrop-filter: blur(14px);
  color: var(--reader-ink, #26212f);
  font-family: var(--reader-ui, "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif);
}

/* La marque : le sigle, le nom du site, sa signature — identiques partout. */
.barre-site .brand {
  display: flex;
  min-width: auto;
  align-items: center;
  gap: 10px;
  color: inherit;
  text-decoration: none;
}

.barre-site .brand-mark {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 4px 13px 4px 13px;
  background: var(--reader-ink, #26212f);
  box-shadow: 5px 5px 0 oklch(82% 0.12 57 / 0.85);
  color: #fff;
  font-size: 15px;
  font-weight: 900;
  letter-spacing: 0.02em;
}

.barre-site .brand-copy {
  display: grid;
  gap: 1px;
}

.barre-site .brand-copy strong {
  font-size: 14px;
  line-height: 1.15;
}

.barre-site .brand-copy span {
  color: var(--reader-muted, #6b6880);
  font-size: 11px;
  line-height: 1.15;
  white-space: nowrap;
}

header.topbar.barre-site .nav {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  overflow: visible;
}

header.topbar.barre-site .nav > a,
header.topbar.barre-site .nav-plus > summary {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  padding: 8px 7px;
  border-radius: 999px;
  color: var(--reader-muted, #5e6371);
  font-size: 12.5px;
  font-weight: 650;
  line-height: 1.15;
  text-decoration: none;
  white-space: nowrap;
}

.barre-site .nav-plus > summary {
  cursor: pointer;
  list-style: none;
}

.barre-site .nav-plus > summary::-webkit-details-marker {
  display: none;
}

.barre-site .nav > a:hover,
.barre-site .nav-plus > summary:hover {
  background: oklch(93% 0.022 82);
  color: var(--reader-ink, #26212f);
}

/* La page affichée. */
.barre-site .nav > a[aria-current="page"] {
  background: var(--reader-ink, #26212f);
  color: var(--reader-paper, #fbf8f2);
}

/* La rubrique dont dépend une page secondaire : marquée, jamais confondue
   avec l'adresse courante. */
.barre-site .nav > a[data-rubrique="active"],
.barre-site .nav-plus-menu a[data-rubrique="active"] {
  background: oklch(91% 0.03 82);
  color: var(--reader-ink, #26212f);
  box-shadow: inset 0 0 0 1px oklch(80% 0.05 82);
}

/* Le menu « Plus » : un <details> natif. */
.barre-site .nav-plus {
  position: relative;
}

.barre-site .nav-plus > summary::after {
  margin-left: 5px;
  color: currentColor;
  content: "▾";
  font-size: 10px;
}

.barre-site .nav-plus[open] > summary::after {
  content: "▴";
}

.barre-site .nav-plus.est-courant > summary {
  background: var(--reader-ink, #26212f);
  color: var(--reader-paper, #fbf8f2);
}

.barre-site .nav-plus-menu {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  left: 0;
  display: grid;
  min-width: 208px;
  max-width: min(280px, 86vw);
  padding: 6px;
  border: 1px solid var(--reader-line, #ded7cb);
  border-radius: 12px;
  background: var(--reader-paper, #fdfaf5);
  box-shadow: 0 16px 36px oklch(30% 0.04 60 / 0.18);
}

.barre-site .nav-plus-menu a {
  padding: 9px 12px;
  border-radius: 8px;
  color: var(--reader-muted, #5e6371);
  font-size: 12.5px;
  font-weight: 650;
  text-decoration: none;
  white-space: nowrap;
}

.barre-site .nav-plus-menu a:hover {
  background: oklch(93% 0.022 82);
  color: var(--reader-ink, #26212f);
}

.barre-site .nav-plus-menu a[aria-current="page"] {
  background: var(--reader-ink, #26212f);
  color: var(--reader-paper, #fbf8f2);
}

/* La pastille de connexion, posée par pont-app.js, tient le bout de la barre.
   Elle est resserrée pour que la ligne entière tienne à 1 280 px. */
header.topbar.barre-site .nav .statut-meridien {
  margin-left: auto;
  padding: 3px 9px;
  font-size: 0.74rem;
}

/* Les actions propres à la page. Si la ligne déborde malgré tout, elles
   passent à la ligne suivante en restant alignées à droite. */
header.topbar.barre-site .toolbar {
  display: flex;
  min-width: auto;
  margin-left: auto;
  justify-content: flex-end;
  gap: 6px;
}

header.topbar.barre-site .toolbar .button {
  min-height: 34px;
  padding: 7px 12px;
  font-size: 12px;
}

/* Une page qui porte deux actions (les cartes Mermaid : plein écran et
   impression) demande 54 px de plus qu'il n'y en a à 1 280 px : la signature
   du site cède, la navigation reste entière sur une seule ligne. */
header.topbar.barre-site:has(.toolbar .button ~ .button) .brand-copy span {
  display: none;
}

.barre-site a:focus-visible,
.barre-site summary:focus-visible,
.barre-site button:focus-visible {
  outline: 3px solid var(--reader-prove, #d99a3c);
  outline-offset: 2px;
}

@media (max-width: 1240px) {
  /* Sous 1 240 px, la signature du site cède la place aux liens. */
  .barre-site .brand-copy span {
    display: none;
  }

  header.topbar.barre-site .nav > a,
  header.topbar.barre-site .nav-plus > summary {
    padding: 8px 6px;
    font-size: 12px;
  }
}

@media (max-width: 900px) {
  header.topbar.barre-site {
    padding: 8px 14px;
  }

  .barre-site .brand {
    order: 1;
  }

  header.topbar.barre-site .toolbar {
    order: 2;
    margin-left: auto;
  }

  header.topbar.barre-site .nav {
    order: 3;
    flex: 1 0 100%;
    padding-top: 2px;
  }

  header.topbar.barre-site .nav .statut-meridien {
    margin-left: 4px;
  }
}

@media (max-width: 620px) {
  header.topbar.barre-site {
    gap: 0 6px;
    padding: 7px 12px;
  }

  .barre-site .toolbar {
    display: none;
  }

  .barre-site .brand-mark {
    width: 28px;
    height: 28px;
    box-shadow: 3px 3px 0 oklch(82% 0.12 57 / 0.85);
    font-size: 13px;
  }

  .barre-site .brand-copy strong {
    font-size: 13px;
  }

  header.topbar.barre-site .nav > a,
  header.topbar.barre-site .nav-plus > summary {
    min-height: 30px;
    padding: 5px 6px;
    font-size: 11px;
  }

  header.topbar.barre-site .nav .statut-meridien {
    margin-left: 4px;
    padding: 2px 8px;
    font-size: 0.66rem;
  }

  .barre-site .nav-plus-menu {
    right: 0;
    left: auto;
  }
}

@media print {
  header.topbar.barre-site {
    display: none !important;
  }
}

/* Aides de lecture et ajustements d’accessibilité, sans changer la présentation validée. */
.proof-drawer[aria-hidden="true"] { visibility:hidden; }
header.topbar.barre-site .nav > a[data-assistant-lecture] { background:var(--reader-build-soft); color:var(--reader-ink); border:1px solid var(--reader-line); }
header.topbar.barre-site .nav > a.nav-whatsapp { display:inline-flex; align-items:center; gap:6px; color:#216642; background:#eff7f1; border:1px solid #cfe1d4; }
header.topbar.barre-site .nav > a.nav-whatsapp[hidden] { display:none; }
.barre-site .nav-plus-menu { max-height:calc(100dvh - 160px); overflow-y:auto; }
.reader-home .frise-rail { max-width:100%; }
.reader-home .audience-grid ol { margin:12px 0 0; padding-left:20px; }
.reader-home .audience-grid ol li { border:0; background:none; padding:0; margin:0 0 10px; }
.reader-home .reader-deep-link { padding-block:18px; }
@media(max-width:800px) {
  header.topbar.barre-site .nav { flex-wrap:wrap; }
  body.reader-v94.act-page .act-hero h1 { max-width:100%; font-size:clamp(36px,6vw,48px); line-height:1.1; }
  .act-hero { gap:24px; }
  header.topbar.barre-site .nav .statut-meridien { display:inline-flex; }
}
@media(prefers-reduced-motion:reduce) { .reader-action { transition:none; } html { scroll-behavior:auto; } }
/* Le lien actif reste lisible sur la pastille sombre de la version de référence. */
body.reader-v94 header.topbar.barre-site .nav > a[aria-current="page"] {
  background:var(--reader-ink); color:var(--reader-paper);
}

/* L’assistant accompagne la lecture, y compris après le défilement. */
.assistant-permanent { position:fixed; left:20px; bottom:20px; z-index:850; display:flex; align-items:center; gap:10px; padding:10px 18px 10px 12px; border:1px solid #c7bef1; border-radius:999px; background:#5d4ab5; color:white!important; text-decoration:none; box-shadow:0 6px 22px #40338033; font:750 16px/1.2 var(--reader-ui); }
.assistant-permanent small { display:block; margin-top:4px; font-size:11px; font-weight:500; }
.assistant-signe { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#ffffff22; font-size:23px; }
.assistant-permanent:hover { background:#44308d; }
.assistant-permanent:focus-visible { outline:3px solid #a994ef; outline-offset:4px; }
body.reader-v94 { padding-bottom:85px; }
body.reader-v94 .bib-shell,body.reader-v94 .leo-shell { padding-top:40px; }
body.reader-v94 .bib-shell h1,body.reader-v94 .leo-shell h1 { font-size:clamp(36px,4.5vw,58px); font-weight:800; line-height:1.12; letter-spacing:-.04em; }
body.reader-v94 .bib-cat,body.reader-v94 .leo-etat { padding:22px; background:var(--reader-paper); border:1px solid var(--reader-line); border-radius:4px 16px 4px 16px; }
body.reader-v94 .bib-outils { position:static; background:transparent; }
@media(max-width:600px) { .assistant-permanent { left:12px; bottom:12px; padding:8px 14px 8px 10px; }.assistant-permanent small{font-size:10px} }
@media print { .assistant-permanent,.leo-bouton{display:none!important} body.reader-v94{padding-bottom:0} }

/* Accès aux fichiers remis, distinct du texte figé des annexes. */
.telechargement-annexe{margin:18px 0;padding:14px 18px;border:1px solid #dbd2e4;border-radius:8px;background:#f6f2f9;font:600 14px/1.5 system-ui,sans-serif}.telechargement-annexe a{color:#58416f;text-decoration:none}

/* Le passage complet reste dans la lecture, puis peut occuper toute la page. */
.lecture-fenetre{box-sizing:border-box;width:min(1060px,calc(100vw - 40px));height:90dvh;max-width:none;max-height:none;padding:0;border:1px solid var(--reader-line);border-radius:14px;background:var(--reader-paper);color:var(--reader-ink);box-shadow:0 24px 80px #18132640;overflow:hidden}
.lecture-fenetre[open]{display:flex;flex-direction:column}
.lecture-fenetre::backdrop{background:#21182e66}
.lecture-fenetre-barre{display:flex;align-items:center;flex-wrap:wrap;gap:8px;flex:none;padding:12px 16px;border-bottom:1px solid var(--reader-line);background:var(--reader-paper);font:13px/1.4 var(--reader-ui)}
.lecture-fenetre-ariane{display:flex;flex:1;align-items:center;flex-wrap:wrap;gap:8px;font:600 14px/1.4 var(--reader-ui)}
.lecture-fenetre-barre :is(button,a){border:1px solid var(--reader-line);border-radius:7px;padding:8px 11px;background:transparent;color:var(--reader-ink);font:500 13px/1.4 var(--reader-ui);text-decoration:none;cursor:pointer}
.lecture-fenetre-barre :is(button,a):hover{background:var(--reader-see-soft)}
.lecture-fenetre-barre :is(button,a):focus-visible{outline:2px solid var(--reader-see);outline-offset:3px}
.lecture-fenetre iframe{display:block;width:100%;flex:1;min-height:0;border:0;background:var(--reader-paper)}
.lecture-fenetre.lecture-fenetre-grande{width:100vw;height:100dvh;margin:0;border:0;border-radius:0}
.lecture-ariane-retour a:last-child{font-weight:700;text-decoration:underline;text-underline-offset:3px}
.memory-section{scroll-margin-top:150px}
@media(max-width:600px){.lecture-fenetre{width:calc(100vw - 16px);height:96dvh}.lecture-fenetre-barre{padding:10px;gap:6px}.lecture-fenetre-ariane{flex-basis:100%}.lecture-fenetre-barre :is(button,a){font-size:12px;padding:7px 9px}}
@media print{.lecture-fenetre,.lecture-ariane-retour{display:none!important}}

/* L'entrée de l'application existe même avant la vérification de session. */
header.topbar.barre-site .nav > .statut-meridien{display:inline-flex;align-items:center;order:2;flex-shrink:0;margin-left:auto;border:1px solid #cfe1d4;background:#eff7f1;color:#216642;padding:8px 12px}