:root {
  color-scheme: light;
  --ink: #14213d;
  --muted: #61708a;
  --paper: #ffffff;
  --canvas: #e9edf4;
  --line: #cbd4e3;
  --line-strong: #9aa9c1;
  --blue: #155eef;
  --blue-deep: #0b3a92;
  --cyan: #0e7490;
  --cyan-soft: #e8f7fa;
  --amber: #9a5b00;
  --amber-soft: #fff6db;
  --red: #b42318;
  --red-soft: #fff0ed;
  --green: #16794b;
  --green-soft: #eaf8f0;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

* { box-sizing: border-box; }

html {
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-width: 320px;
}

a { color: inherit; }

.site-bar {
  align-items: center;
  background: rgba(20, 33, 61, 0.96);
  color: #fff;
  display: flex;
  gap: 0.8rem;
  justify-content: space-between;
  min-height: 3.25rem;
  padding: 0.6rem max(1rem, calc((100vw - 210mm) / 2));
  position: sticky;
  top: 0;
  z-index: 10;
}

.brand {
  align-items: center;
  display: flex;
  font-size: 0.88rem;
  font-weight: 750;
  gap: 0.55rem;
  letter-spacing: 0.01em;
  text-decoration: none;
}

.brand-mark {
  align-items: center;
  background: var(--blue);
  border-radius: 0.38rem;
  display: inline-flex;
  font-family: var(--mono);
  font-size: 0.72rem;
  height: 1.65rem;
  justify-content: center;
  width: 1.65rem;
}

.site-actions { display: flex; gap: 0.4rem; }

.site-actions a,
.site-actions button {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: 0.38rem;
  color: #fff;
  cursor: pointer;
  font: 650 0.76rem/1 var(--sans);
  padding: 0.52rem 0.7rem;
  text-decoration: none;
}

.site-actions a:hover,
.site-actions button:hover { background: rgba(255,255,255,0.1); }

.sheet {
  background: var(--paper);
  box-shadow: 0 1rem 3.5rem rgba(32, 47, 76, 0.16);
  margin: 1.4rem auto;
  min-height: 297mm;
  overflow: hidden;
  padding: 11mm 11mm 9mm;
  position: relative;
  width: 210mm;
}

.sheet-header {
  border-bottom: 2px solid var(--ink);
  display: grid;
  gap: 2mm;
  grid-template-columns: 1fr auto;
  padding-bottom: 3.5mm;
}

.eyebrow {
  color: var(--blue);
  font: 750 8.5pt/1 var(--mono);
  letter-spacing: 0.12em;
  margin: 0 0 1.5mm;
  text-transform: uppercase;
}

h1 {
  font-size: 24pt;
  letter-spacing: -0.035em;
  line-height: 1;
  margin: 0;
}

.chapter-pill {
  align-self: start;
  background: var(--ink);
  border-radius: 999px;
  color: #fff;
  font: 750 8.5pt/1 var(--mono);
  padding: 2.2mm 3mm;
}

.thesis {
  color: var(--muted);
  font-size: 10.5pt;
  line-height: 1.38;
  margin: 2.4mm 0 0;
  max-width: 165mm;
}

.scope-strip {
  background: var(--cyan-soft);
  border: 1px solid #a8dfe8;
  display: grid;
  gap: 3mm;
  grid-template-columns: repeat(4, 1fr);
  margin: 4mm 0;
  padding: 2.5mm 3mm;
}

.scope-item small {
  color: var(--cyan);
  display: block;
  font: 750 7.2pt/1.1 var(--mono);
  letter-spacing: 0.07em;
  margin-bottom: 1mm;
  text-transform: uppercase;
}

.scope-item strong { font-size: 9.2pt; line-height: 1.2; }

.page-grid {
  display: grid;
  gap: 3.4mm;
  grid-template-columns: 1.08fr 0.92fr;
}

.column { display: grid; gap: 3.2mm; align-content: start; }

.block {
  border-top: 1px solid var(--line-strong);
  padding-top: 2mm;
}

.block h2,
.glossary-section h2 {
  color: var(--blue-deep);
  font-size: 9pt;
  letter-spacing: 0.085em;
  line-height: 1.2;
  margin: 0 0 1.5mm;
  text-transform: uppercase;
}

.block p,
.block li,
.recall li,
.glossary-entry p,
.formula-card p {
  font-size: 8.7pt;
  line-height: 1.34;
}

.block p { margin: 0; }

.block ul,
.block ol,
.recall ol {
  margin: 0;
  padding-left: 4.6mm;
}

.block li + li,
.recall li + li { margin-top: 1mm; }

.architecture {
  background: #f6f8fc;
  border: 1px solid var(--line);
  border-radius: 1.5mm;
  padding: 2.5mm;
}

.full-diagram { margin-bottom: 3.2mm; }

.diagram-heading {
  align-items: baseline;
  display: flex;
  justify-content: space-between;
  margin-bottom: 1.5mm;
}

.diagram-heading h2 { margin: 0; }
.diagram-heading a { color: var(--blue-deep); font: 700 7.4pt/1 var(--mono); text-decoration: none; }

.diagram-frame {
  background: #f6f8fc;
  border: 1px solid var(--line);
  border-radius: 1.5mm;
  overflow: hidden;
  padding: 1.5mm;
}

.diagram-frame img { display: block; height: auto; width: 100%; }

.has-diagram .page-grid { gap: 3mm; }
.has-diagram .column { gap: 2.4mm; }
.has-diagram > .full-diagram .diagram-frame img { height: 88mm; object-fit: contain; }

.diagram-sheet {
  min-height: 210mm;
  padding: 10mm 11mm 8mm;
  width: 297mm;
}

.diagram-sheet .sheet-header { margin-bottom: 4mm; }
.diagram-sheet .diagram-frame { padding: 2mm; }
.diagram-sheet .diagram-frame img { height: 140mm; object-fit: contain; }
.diagram-sheet .diagram-notes { color: var(--muted); display: flex; font: 7.5pt/1.22 var(--mono); gap: 8mm; margin-top: 1.5mm; }
.diagram-sheet .diagram-notes span { flex: 1; }

.flow {
  align-items: stretch;
  display: flex;
  flex-wrap: wrap;
  gap: 1.2mm;
}

.node {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line-strong);
  border-radius: 1mm;
  display: inline-flex;
  font: 700 7.4pt/1.2 var(--sans);
  min-height: 7mm;
  padding: 1.2mm 2mm;
}

.node.primary { background: #edf4ff; border-color: #82aaff; color: var(--blue-deep); }
.node.store { background: var(--amber-soft); border-color: #e0b75e; color: #694000; }
.node.async { background: var(--green-soft); border-color: #8bc8a6; color: #105d3b; }
.node.edge { background: var(--red-soft); border-color: #efaaa0; color: #7a271a; }
.arrow { align-items: center; color: var(--muted); display: inline-flex; font-size: 8pt; }

.flow-note {
  color: var(--muted);
  font: 7.2pt/1.35 var(--mono);
  margin-top: 1.5mm;
}

.decision-grid { display: grid; gap: 1.4mm; }

.decision {
  display: grid;
  gap: 2mm;
  grid-template-columns: 25mm 1fr;
}

.decision strong { color: var(--ink); font-size: 8.2pt; }
.decision span { color: #3d4d67; font-size: 8.2pt; line-height: 1.28; }

.code-line,
.formula {
  background: #f2f5fa;
  border-left: 2px solid var(--blue);
  color: #24324a;
  display: block;
  font: 7.7pt/1.35 var(--mono);
  margin: 1.5mm 0 0;
  overflow-wrap: anywhere;
  padding: 1.4mm 2mm;
}

.term {
  border-bottom: 1px dotted var(--blue);
  color: var(--blue-deep);
  text-decoration: none;
}

.term:hover { background: #edf4ff; }

.tradeoffs {
  display: grid;
  gap: 2mm;
  grid-template-columns: 1fr 1fr;
}

.callout {
  border: 1px solid var(--line);
  border-radius: 1.2mm;
  padding: 2mm;
}

.callout h3 {
  font: 750 7.5pt/1.15 var(--mono);
  letter-spacing: 0.05em;
  margin: 0 0 1.2mm;
  text-transform: uppercase;
}

.callout.good { background: var(--green-soft); border-color: #a7d8bc; }
.callout.risk { background: var(--red-soft); border-color: #f1b8af; }
.callout ul { padding-left: 4mm; }
.callout li { font-size: 7.8pt; }

.recall {
  background: var(--ink);
  border-radius: 1.5mm;
  color: #fff;
  padding: 2.7mm 3mm;
}

.recall h2 { color: #86b9ff; margin-bottom: 1.5mm; }
.recall li { font-size: 8.2pt; }

.sheet-footer {
  align-items: center;
  border-top: 1px solid var(--line);
  bottom: 5mm;
  color: var(--muted);
  display: flex;
  font: 7.2pt/1 var(--mono);
  justify-content: space-between;
  left: 11mm;
  padding-top: 2mm;
  position: absolute;
  right: 11mm;
}

.sheet-footer a { color: var(--blue-deep); text-decoration: none; }
.sheet-footer .source-credit { color: var(--cyan); }

.catalog-sheet { padding-bottom: 13mm; }

.casebook-sheet .sheet-header { padding-bottom: 3mm; }
.casebook-sheet .catalog-intro { margin: 2.5mm 0; }
.casebook-sheet .system-list { gap: 1.5mm 2.2mm; }
.casebook-sheet .system-card { gap: 0.8mm; grid-template-columns: 7.5mm 1fr auto; min-height: 15mm; padding: 1.8mm 2.2mm; }
.casebook-sheet .system-card h2 { font-size: 9.7pt; }
.casebook-sheet .system-card p { display: -webkit-box; font-size: 7.1pt; line-height: 1.2; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.casebook-sheet .system-card .kind { font-size: 6.35pt; }
.casebook-sheet .reference-links { margin-top: 2mm; }
.casebook-sheet .reference-card { padding: 2mm 2.5mm; }
.casebook-sheet .reference-card span { font-size: 7.3pt; }
.compact-intro p { font-size: 9pt; line-height: 1.3; }

.db-patterns-sheet .scope-strip { margin-block: 3mm; }
.db-patterns-sheet .column { gap: 2.2mm; }
.db-patterns-sheet .block p,
.db-patterns-sheet .block li { font-size: 8.35pt; line-height: 1.3; }

.catalog-intro {
  display: grid;
  gap: 5mm;
  grid-template-columns: 1.45fr 0.55fr;
  margin: 5mm 0;
}

.catalog-intro p { color: var(--muted); font-size: 11pt; line-height: 1.45; margin: 0; }

.legend {
  background: var(--ink);
  border-radius: 1.5mm;
  color: #fff;
  font: 8pt/1.45 var(--mono);
  padding: 3mm;
}

.system-list {
  display: grid;
  gap: 2.5mm;
  grid-template-columns: 1fr 1fr;
}

.system-card {
  border: 1px solid var(--line);
  border-left: 3px solid var(--blue);
  border-radius: 1.5mm;
  display: grid;
  gap: 1mm;
  grid-template-columns: 9mm 1fr auto;
  min-height: 19mm;
  padding: 2.5mm;
  text-decoration: none;
}

.system-card:hover { background: #f7f9fd; border-color: #82aaff; }
.system-card .num { color: var(--blue); font: 800 9pt/1 var(--mono); }
.system-card h2 { font-size: 10.5pt; margin: 0; }
.system-card p { color: var(--muted); font-size: 7.8pt; line-height: 1.3; margin: 0.8mm 0 0; }
.system-card .kind { color: var(--cyan); font: 700 7pt/1 var(--mono); text-transform: uppercase; }

.reference-links {
  display: grid;
  gap: 2.5mm;
  grid-template-columns: 1fr 1fr;
  margin-top: 4mm;
}

.reference-card {
  background: var(--cyan-soft);
  border: 1px solid #a8dfe8;
  border-radius: 1.5mm;
  padding: 3mm;
  text-decoration: none;
}

.reference-card strong { display: block; font-size: 10pt; }
.reference-card span { color: var(--muted); font-size: 8pt; }

.glossary-grid {
  columns: 3;
  column-gap: 5mm;
  margin-top: 4mm;
}

.glossary-entry {
  break-inside: avoid;
  border-top: 1px solid var(--line);
  margin: 0 0 2.2mm;
  padding-top: 1.4mm;
}

.glossary-entry h2 {
  color: var(--blue-deep);
  font-size: 8.3pt;
  margin: 0 0 0.7mm;
}

.glossary-entry p { color: #3d4d67; font-size: 7.45pt; line-height: 1.27; margin: 0; }

.formula-grid {
  display: grid;
  gap: 3mm;
  grid-template-columns: 1fr 1fr;
  margin-top: 4mm;
}

.formula-card {
  border: 1px solid var(--line);
  border-radius: 1.5mm;
  break-inside: avoid;
  padding: 2.7mm;
}

.formula-card h2 { color: var(--blue-deep); font-size: 9.5pt; margin: 0 0 1mm; }
.formula-card p { color: var(--muted); font-size: 8pt; margin: 1.2mm 0 0; }
.formula-card .formula { margin-top: 0; }

.nines { border-collapse: collapse; margin-top: 2mm; width: 100%; }
.nines td, .nines th { border-bottom: 1px solid var(--line); font-size: 7.6pt; padding: 1mm; text-align: left; }
.nines th { color: var(--muted); font-family: var(--mono); }

@media (max-width: 850px) {
  .site-bar { padding-inline: 1rem; }
  .sheet { margin: 0; min-height: 100vh; padding: 1.25rem; width: 100%; }
  .sheet-header { grid-template-columns: 1fr; }
  h1 { font-size: 2rem; }
  .chapter-pill { justify-self: start; }
  .scope-strip { grid-template-columns: 1fr 1fr; }
  .page-grid, .catalog-intro, .system-list, .reference-links, .formula-grid { grid-template-columns: 1fr; }
  .sheet-footer { margin-top: 1.5rem; position: static; }
  .glossary-grid { columns: 1; }
  .diagram-sheet { min-height: 100vh; width: 100%; }
}

@media print {
  @page { margin: 0; size: A4 portrait; }
  html, body { background: #fff; }
  .site-bar { display: none; }
  .sheet {
    box-shadow: none;
    height: 297mm;
    margin: 0;
    min-height: 297mm;
    page-break-after: always;
    width: 210mm;
  }
  .term { border-bottom-color: var(--line-strong); color: inherit; }
  .diagram-sheet { height: 210mm; min-height: 210mm; page: diagram; width: 297mm; }
}

@page diagram { margin: 0; size: A4 landscape; }

/* ─── A3 SHEET LAYOUTS ─── */

.sheet-a3 {
  background: var(--paper);
  box-shadow: 0 1rem 3.5rem rgba(32, 47, 76, 0.16);
  margin: 1.4rem auto;
  min-height: 420mm;
  overflow: hidden;
  padding: 11mm 13mm 14mm;
  position: relative;
  width: 297mm;
}

.sheet-a3-land {
  background: var(--paper);
  box-shadow: 0 1rem 3.5rem rgba(32, 47, 76, 0.16);
  margin: 1.4rem auto;
  min-height: 297mm;
  overflow: hidden;
  padding: 10mm 13mm 12mm;
  position: relative;
  width: 420mm;
}

.page-grid-3 {
  display: grid;
  gap: 3.4mm;
  grid-template-columns: 1fr 1fr 1fr;
}

/* ─── BREADCRUMB ─── */

.breadcrumb {
  color: var(--muted);
  font: 7.5pt/1 var(--mono);
  margin-bottom: 2.5mm;
}

.breadcrumb a { color: var(--blue); text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }
.breadcrumb > * + *::before { content: " › "; }

/* ─── SIBLING NAV ─── */

.sibling-nav {
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: 1mm;
  margin-bottom: 4mm;
  padding-bottom: 2.5mm;
}

.sibling-nav a {
  border: 1px solid var(--line);
  border-radius: 0.35rem;
  color: var(--muted);
  font: 650 7.2pt/1 var(--mono);
  padding: 1.2mm 2.2mm;
  text-decoration: none;
}

.sibling-nav a:hover { background: #f0f4fb; color: var(--ink); }

.sibling-nav a[aria-current="page"] {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}

/* ─── PROVENANCE BADGES ─── */

.badge {
  border-radius: 0.28rem;
  display: inline-block;
  font: 700 6.5pt/1 var(--mono);
  letter-spacing: 0.07em;
  margin-left: 1mm;
  padding: 0.6mm 1.3mm;
  text-transform: uppercase;
  vertical-align: middle;
  white-space: nowrap;
}

.badge.verified  { background: var(--green-soft);  color: var(--green); }
.badge.derived   { background: var(--cyan-soft);   color: var(--cyan); }
.badge.inferred  { background: var(--amber-soft);  color: var(--amber); }
.badge.open      { background: var(--red-soft);    color: var(--red); }

/* ─── HUB PAGE NAVIGATION CARDS ─── */

.hub-page-grid {
  display: grid;
  gap: 2.5mm;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 3.5mm;
}

.hub-page-card {
  background: #f7f9fd;
  border: 1px solid var(--line);
  border-left: 3px solid var(--blue);
  border-radius: 1.5mm;
  display: flex;
  flex-direction: column;
  gap: 1.5mm;
  padding: 2.5mm;
  text-decoration: none;
}

.hub-page-card:hover { background: #edf4ff; border-left-color: #2563eb; }
.hub-page-card strong { color: var(--blue-deep); display: block; font-size: 9pt; }
.hub-page-card span { color: var(--muted); font-size: 7.5pt; line-height: 1.3; }

/* ─── DECISION ENTRIES ─── */

.decision-entry {
  border-top: 1.5px solid var(--line-strong);
  padding-top: 2.5mm;
}

.decision-entry + .decision-entry { margin-top: 3.5mm; }

.decision-entry > h3 {
  color: var(--blue-deep);
  font-size: 9pt;
  letter-spacing: 0.07em;
  margin: 0 0 2mm;
  text-transform: uppercase;
}

.decision-field {
  display: grid;
  font-size: 8.4pt;
  gap: 0 2.5mm;
  grid-template-columns: 32mm 1fr;
  line-height: 1.32;
  margin-bottom: 1.3mm;
}

.decision-field dt {
  color: var(--muted);
  font-family: var(--mono);
  font-size: 7.2pt;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding-top: 0.3mm;
  text-transform: uppercase;
}

.decision-field dd { color: var(--ink); margin: 0; }

/* ─── CLAIM TABLE ─── */

.claim-table {
  border-collapse: collapse;
  font-size: 8pt;
  margin-top: 2mm;
  width: 100%;
}

.claim-table th {
  background: #f2f5fa;
  border-bottom: 1.5px solid var(--line-strong);
  color: var(--muted);
  font: 700 7pt/1 var(--mono);
  padding: 1.5mm 2mm;
  text-align: left;
  text-transform: uppercase;
}

.claim-table td {
  border-bottom: 1px solid var(--line);
  line-height: 1.3;
  padding: 1.5mm 2mm;
  vertical-align: top;
}

.claim-table tr:last-child td { border-bottom: none; }

/* ─── PAGE GLOSSARY (contextual terms panel) ─── */

.page-glossary {
  background: #f7f9fd;
  border: 1px solid var(--line);
  border-radius: 1.5mm;
  padding: 2.5mm 3mm;
}

.page-glossary > h2 {
  color: var(--blue-deep);
  font-size: 8.5pt;
  letter-spacing: 0.08em;
  margin: 0 0 1.5mm;
  text-transform: uppercase;
}

.page-glossary-list { display: grid; gap: 1.8mm; }

.page-term { border-top: 1px solid var(--line); padding-top: 1.2mm; }
.page-term strong { color: var(--ink); display: block; font-size: 7.8pt; margin-bottom: 0.3mm; }
.page-term p { color: var(--muted); font-size: 7.1pt; line-height: 1.24; margin: 0; }

/* ─── SEQUENCE DIAGRAM ─── */

.seq-actors {
  border-bottom: 2px solid var(--line-strong);
  display: flex;
  gap: 1mm;
  margin-bottom: 2.5mm;
  padding-bottom: 2mm;
}

.seq-actor {
  background: var(--ink);
  border-radius: 1mm;
  color: #fff;
  flex: 1;
  font: 700 6.5pt/1 var(--mono);
  padding: 1.3mm 1mm;
  text-align: center;
}

.seq-steps { display: grid; gap: 2mm; }

.seq-step {
  align-items: baseline;
  display: grid;
  gap: 0 2mm;
  grid-template-columns: 5mm 1fr;
}

.seq-num { color: var(--blue); font: 800 7.5pt/1.6 var(--mono); }

.seq-body { font-size: 8pt; line-height: 1.3; }

.seq-from-to {
  color: var(--muted);
  display: block;
  font: 6.8pt/1.2 var(--mono);
  margin-bottom: 0.3mm;
}

.seq-action { color: var(--ink); }

.seq-note {
  background: var(--amber-soft);
  border: 1px solid #d4a640;
  border-radius: 1mm;
  color: #694000;
  display: inline-block;
  font: 7pt/1.3 var(--mono);
  margin-top: 0.5mm;
  padding: 0.7mm 1.4mm;
}

/* ─── A3 RESPONSIVE ─── */

@media (max-width: 1160px) {
  .sheet-a3, .sheet-a3-land {
    margin: 0;
    min-height: 100vh;
    padding: 1.25rem;
    width: 100%;
  }

  .hub-page-grid { grid-template-columns: 1fr 1fr; }
  .page-grid-3 { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 720px) {
  .hub-page-grid, .page-grid-3 { grid-template-columns: 1fr; }

  .p2p-view .column,
  .p2p-view .block,
  .architecture-view .column,
  .architecture-view .block { min-width: 0; }

  .p2p-view .claim-table,
  .architecture-view .claim-table { table-layout: fixed; }

  .p2p-view .claim-table th,
  .p2p-view .claim-table td,
  .architecture-view .claim-table th,
  .architecture-view .claim-table td { overflow-wrap: anywhere; padding-inline: 0.35rem; }
}

/* ─── A3 FOOTER ALIGNMENT ─── */

.sheet-a3 .sheet-footer,
.sheet-a3-land .sheet-footer { left: 13mm; right: 13mm; }

/* ─── HIDE NAV CHROME IN TIGHT PRINT LAYOUTS ─── */

@media print {
  .diagram-sheet .breadcrumb,
  .diagram-sheet .sibling-nav { display: none; }
}

/* ─── A3 PRINT ─── */

@page a3-portrait  { margin: 0; size: A3 portrait; }
@page a3-landscape { margin: 0; size: A3 landscape; }

@media print {
  .sheet-a3 {
    box-shadow: none;
    height: 420mm;
    min-height: 420mm;
    page: a3-portrait;
    page-break-after: always;
    width: 297mm;
  }

  .sheet-a3-land {
    box-shadow: none;
    height: 297mm;
    min-height: 297mm;
    page: a3-landscape;
    page-break-after: always;
    width: 420mm;
  }
}

/* ─── WEB-NATIVE EXERCISE LAYOUT ─── */

.exercise-view { background: var(--paper); }

.exercise-page {
  box-sizing: border-box;
  margin: 0 auto 4rem;
  max-width: 1080px;
  padding: 2.5rem 3rem;
}

.exercise-page-wide { max-width: 1380px; }

/* Exercise-page typography scale — rem-based for screen */
.exercise-page .block p,
.exercise-page .block li,
.exercise-page .recall li { font-size: 0.875rem; line-height: 1.55; }

.exercise-page .block h2 { font-size: 0.7rem; letter-spacing: 0.1em; margin-bottom: 0.6rem; }

.exercise-page h1 { font-size: 2rem; }

.exercise-page .thesis { font-size: 1rem; line-height: 1.5; }

.exercise-page .eyebrow { font-size: 0.68rem; }

.exercise-page .scope-strip { margin: 1.25rem 0; }

.exercise-page .scope-item small { font-size: 0.65rem; }
.exercise-page .scope-item strong { font-size: 0.875rem; }

.exercise-page .sibling-nav { margin-bottom: 1.75rem; gap: 0.35rem; padding-bottom: 1rem; }
.exercise-page .sibling-nav a { font-size: 0.7rem; padding: 0.35rem 0.65rem; }

.exercise-page .breadcrumb { font-size: 0.72rem; margin-bottom: 1rem; }

.exercise-page .page-grid,
.exercise-page .page-grid-3 { gap: 1.75rem; }

.exercise-page .column { gap: 1.25rem; }

.exercise-page .block { padding-top: 0.75rem; }
.exercise-page .block ul,
.exercise-page .block ol { padding-left: 1.25rem; }
.exercise-page .block li + li { margin-top: 0.3rem; }

.exercise-page .decision strong { font-size: 0.82rem; }
.exercise-page .decision span { font-size: 0.82rem; line-height: 1.45; }
.exercise-page .decision-grid { gap: 0.6rem; }
.exercise-page .decision { gap: 0 0.75rem; grid-template-columns: 6rem 1fr; }

.exercise-page .code-line,
.exercise-page .formula { font-size: 0.78rem; padding: 0.4rem 0.6rem; margin-top: 0.5rem; }

.exercise-page .recall { padding: 0.85rem 1rem; }
.exercise-page .recall h2 { font-size: 0.7rem; margin-bottom: 0.5rem; }
.exercise-page .recall li { font-size: 0.84rem; }

.exercise-page .callout { padding: 0.6rem 0.75rem; }
.exercise-page .callout h3 { font-size: 0.68rem; margin-bottom: 0.4rem; }
.exercise-page .callout li { font-size: 0.78rem; }

.exercise-page .sheet-footer { font-size: 0.72rem; position: static; border-top: 1px solid var(--line); margin-top: 2.5rem; padding-top: 0.75rem; }

.exercise-page .decision-entry { padding-top: 1rem; }
.exercise-page .decision-entry + .decision-entry { margin-top: 1.25rem; }
.exercise-page .decision-entry > h3 { font-size: 0.78rem; margin-bottom: 0.75rem; }
.exercise-page .decision-field { font-size: 0.84rem; gap: 0 1rem; grid-template-columns: 7rem 1fr; margin-bottom: 0.4rem; }
.exercise-page .decision-field dt { font-size: 0.68rem; }

.exercise-page .claim-table th { font-size: 0.65rem; padding: 0.4rem 0.6rem; }
.exercise-page .claim-table td { font-size: 0.8rem; padding: 0.4rem 0.6rem; }

.exercise-page .seq-actor { font-size: 0.62rem; padding: 0.4rem 0.25rem; }
.exercise-page .seq-body { font-size: 0.82rem; }
.exercise-page .seq-from-to { font-size: 0.68rem; }
.exercise-page .seq-note { font-size: 0.7rem; }
.exercise-page .seq-steps { gap: 0.85rem; }

.exercise-page .badge { font-size: 0.6rem; padding: 0.18rem 0.38rem; }

@media (max-width: 1160px) {
  .exercise-page,
  .exercise-page-wide { padding: 1.5rem 1.25rem; }
}

@media print {
  .exercise-page {
    box-shadow: none;
    height: 420mm;
    margin: 0;
    min-height: 420mm;
    padding: 11mm 13mm;
    page: a3-portrait;
    page-break-after: always;
    width: 297mm;
  }

  .exercise-page-wide {
    height: 297mm;
    min-height: 297mm;
    padding: 11mm 13mm;
    page: a3-landscape;
    width: 420mm;
  }
}

/* ─── GLOSSARY SIDEBAR ─── */

.gl-sidebar {
  background: var(--paper);
  border-left: 1px solid var(--line);
  bottom: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: fixed;
  right: 0;
  top: 3.25rem;
  width: 280px;
  z-index: 20;
}

.gl-sidebar[hidden] { display: none; }

@media (max-width: 900px) {
  .gl-sidebar {
    border-left: none;
    border-top: 1px solid var(--line);
    height: 55vh;
    left: 0;
    top: auto;
    width: 100%;
  }
}

.gl-header {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  padding: 0.6rem 0.9rem;
}

.gl-title {
  font: 700 0.8rem/1 var(--mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.gl-close {
  background: none;
  border: none;
  color: var(--muted);
  cursor: pointer;
  font-size: 0.9rem;
  padding: 0.2rem;
}

.gl-search-wrap {
  border-bottom: 1px solid var(--line);
  padding: 0.6rem 0.9rem;
}

.gl-search {
  background: var(--canvas);
  border: 1px solid var(--line);
  border-radius: 0.3rem;
  font: 0.78rem var(--sans);
  padding: 0.4rem 0.6rem;
  width: 100%;
}

.gl-body {
  flex: 1;
  font-size: 0.78rem;
  overflow-y: auto;
  padding: 0.5rem 0;
}

.gl-section-head {
  color: var(--muted);
  font: 700 0.68rem/1 var(--mono);
  letter-spacing: 0.08em;
  padding: 0.5rem 0.9rem 0.3rem;
  text-transform: uppercase;
}

.gl-entry {
  border-bottom: 1px solid var(--line);
  padding: 0.5rem 0.9rem;
}

.gl-entry strong {
  color: var(--ink);
  display: block;
  font-size: 0.78rem;
  margin-bottom: 0.18rem;
}

.gl-entry p {
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.35;
  margin: 0;
}

.gl-entry[hidden] { display: none; }

.gl-toggle {
  background: var(--ink);
  border: none;
  border-radius: 0.4rem 0 0 0.4rem;
  bottom: 2rem;
  color: #fff;
  cursor: pointer;
  font: 650 0.72rem/1 var(--mono);
  letter-spacing: 0.06em;
  padding: 0.55rem 0.7rem;
  position: fixed;
  right: 0;
  text-transform: uppercase;
  z-index: 21;
}

.gl-toggle:hover { background: var(--blue-deep); }

/* Sidebar overlays — no content shift */
.gl-sidebar { box-shadow: -4px 0 20px rgba(20, 33, 61, 0.12); }

@media print {
  .gl-sidebar,
  .gl-toggle { display: none; }
}