/* Override the retained source styles without changing panel markup or geometry. */
:root { --serif: "Source Serif 4", Georgia, serif; }

/* Natural-height panels: fit artwork to the width, never to the video's height. */
html, body {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  background: #f5efe2;
  font-size: 17px;
}
body { display: flow-root; }
.slide-column {
  position: static !important;
  inset: auto !important;
  max-height: none !important;
  max-width: none !important;
  width: 100% !important;
  transform: none !important;
}
.slide-column figure { margin: 0 !important; }
.slide-column :is(.slide-sheet, .source-panel, .p07-panel) {
  min-height: 0;
  max-height: none;
  aspect-ratio: auto;
}
.slide-column :is(p, li, blockquote, td, th):not(.slide-number, .source-number, .source-kicker) {
  font-size: max(16px, 1em) !important;
}
.slide-column :is(.chart-scroll, .diagram-scroll, .diagram-viewport, .map-pan, .p04-scroll, .part09-pan, .part08-diagram-scroll, .relationship-pan) {
  max-height: none !important;
  max-width: 100%;
  overflow: visible !important;
  scrollbar-gutter: auto;
}
/* Override inherited minimum widths, including focus-triggered enlargement. */
.slide-column :is(.chart-scroll, .diagram-scroll, .diagram-viewport, .map-pan, .p04-scroll, .part09-pan, .part08-diagram-scroll) > svg {
  display: block;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100%;
  height: auto !important;
}
.slide-column .relationship { min-width: 0; }
.slide-column .pan-hint { display: none; }
.slide-tools { display: none; }
/* Text charts reflow independently of diagram scale. Braces express group
   associations, not row-by-row mappings or directional movement. */
.slide-sheet.reflow-chart { font-size: 18px; line-height: 1.6; }
.slide-sheet.reflow-chart :is(p, ul, dl, li, dt, dd, small) { font-size: 18px !important; line-height: 1.6; }
.slide-sheet.reflow-chart :is(p, ul, dl) { margin: 0 0 1em; }
.slide-sheet.reflow-chart h4 { margin: 0 0 .8em; font: 600 18px/1.4 var(--sans); color: var(--ink-2); }
.slide-sheet.reflow-chart ul { padding-left: 1.2em; }
.slide-sheet.reflow-chart li { margin-bottom: .6em; }
.slide-sheet.reflow-chart dt { font-weight: 600; padding-left: 1em; position: relative; }
.slide-sheet.reflow-chart dt::before { content: '•'; position: absolute; left: 0; }
.slide-sheet.reflow-chart dd { margin: .35em 0 1.2em 1em; }
.slide-sheet.reflow-chart .reflow-qualifier { display: block; font-weight: 600; }
.slide-sheet.reflow-chart .reflow-transition { font-weight: 600; text-align: center; margin-block: 1em; }
.reflow-pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; position: relative; }
.reflow-pair > *, .reflow-nations > * { min-width: 0; overflow-wrap: anywhere; }
.reflow-pair::after { content: ''; position: absolute; left: calc(50% - 20px); top: 38px; bottom: 8px; width: 40px; background: url('association-braces.svg') center / 100% 100% no-repeat; }
.reflow-outcome { position: relative; padding-top: 46px; margin-top: 6px; }
.reflow-outcome::before { content: ''; position: absolute; top: 0; left: 6%; width: 88%; height: 30px; background: url('gathering-brace.svg') center / 100% 100% no-repeat; }
.slide-sheet.reflow-chart .reflow-box { border: 1px solid var(--ink-2); padding: .7em; }
.reflow-nations { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 32px; }
.reflow-nations section { border-top: 1px solid var(--rule); padding-top: 16px; }
.reflow-relation { column-gap: 104px; }
.reflow-relation::after { left: calc(50% - 48px); width: 96px; }
.slide-sheet.reflow-chart .reflow-relation-word { position: absolute; left: calc(50% - 44px); top: 45%; width: 88px; padding-block: 8px; background: var(--slide-paper); text-align: center; font-weight: 600; overflow-wrap: normal; z-index: 1; }
.reflow-support::after { background-image: url('support-brace.svg'); top: 0; }
.slide-sheet.reflow-chart .reflow-dashes { list-style: '— '; margin-top: .8em; }
@container (max-width: 520px) {
  .reflow-pair { grid-template-columns: minmax(0, 1fr); gap: 64px; }
  .reflow-pair::after { display: none; }
  .reflow-pair > :last-child { position: relative; }
  .reflow-pair > :last-child::before { content: ''; position: absolute; top: -56px; left: 6%; width: 88%; height: 44px; background: url('association-braces-horizontal.svg') center / 100% 100% no-repeat; }
  .reflow-support > :last-child::before { background-image: url('gathering-brace.svg'); height: 30px; }
  .reflow-relation { gap: 18px; }
  .slide-sheet.reflow-chart .reflow-relation-word { position: static; width: auto; margin: 0; padding: 34px 0; }
  .reflow-relation > :last-child::before { top: -112px; height: 102px; }
}
@container (max-width: 360px) {
  .reflow-nations { grid-template-columns: minmax(0, 1fr); }
}
@container (min-width: 1000px) {
  .reflow-nations { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media print {
  .reflow-chart { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
/* Explicit, no-JavaScript detail view; only this view requires panning. */
#enlarged:target {
  width: max(100%, 1100px) !important;
  padding-top: 52px;
}
#enlarged:target .slide-tools {
  display: flex;
  align-items: center;
  gap: 20px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  box-sizing: border-box;
  width: 100%;
  padding: 12px 18px;
  background: #fbfaf6;
  border-bottom: 1px solid #e8e0d2;
  font: 14px/1.5 sans-serif;
}
@media (max-width: 600px) {
  .slide-column :is(.slide-sheet, .source-panel) { padding: 22px 18px 38px; }
  .slide-column :is(p, li, blockquote) { overflow-wrap: break-word; }
}
@media print {
  #enlarged:target { width: 100% !important; padding-top: 0; }
  #enlarged:target .slide-tools { display: none; }
}