:root {
  color-scheme: dark;
  --ink: #0b090a;
  --ink-soft: #151012;
  --paper: #e7e0d5;
  --paper-muted: #aaa19a;
  --rule: #34292c;
  --blood: #a40f1b;
  --blood-bright: #d12532;
  --warning: #c65f16;
  --warning-bright: #ef7c27;
  --font-sans: "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  --font-serif: "Slabo 13px", Georgia, serif;
  --day-width: 9px;
  --mobile-section-height: 100svh;
  --mobile-panel-height: min(76svh, 40rem);
  font-family: var(--font-sans);
  font-optical-sizing: auto;
}

* { box-sizing: border-box; }
html { background: var(--ink); scroll-behavior: smooth; }
html.is-timeline-jumping { scroll-behavior: auto !important; scroll-snap-type: none !important; }
body { margin: 0; min-width: 320px; background: var(--ink); color: var(--paper); }
body.is-panel-open { overflow: hidden; }
button, a { font: inherit; }
a { color: inherit; }

.skip-link {
  position: fixed; left: 1rem; top: -4rem; z-index: 100;
  padding: .75rem 1rem; background: var(--paper); color: var(--ink);
}
.skip-link:focus { top: 1rem; }

.hero { position: relative; }
.masthead {
  min-height: 86px; display: flex; align-items: center; justify-content: space-between;
  gap: 2rem; padding: 1.25rem clamp(1.25rem, 4vw, 4.5rem);
  border-bottom: 1px solid var(--rule); background: rgba(11, 9, 10, .97);
}
.identity { display: flex; align-items: center; gap: 1rem; }
.memorial-mark {
  width: 46px; height: 46px; flex: 0 0 auto; display: grid; place-items: center; overflow: hidden;
  border: 1px solid #4a3b40; border-radius: 50%; background: #131012;
}
.memorial-mark img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 38%; filter: contrast(1.08); }
.eyebrow, .kicker {
  margin: 0 0 .35rem; color: var(--paper-muted); font-size: .75rem; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
}
h1, h2 { margin: 0; font-family: var(--font-serif); font-weight: 400; }
h1 { font-size: clamp(1.25rem, 2vw, 1.65rem); }
.language { display: flex; align-items: center; gap: .45rem; color: var(--paper-muted); }
.lang-button {
  border: 0; padding: .4rem .25rem; background: transparent; color: var(--paper-muted); cursor: pointer;
  font-size: .85rem; font-weight: 800; letter-spacing: .08em;
}
.lang-button.is-active { color: var(--paper); border-bottom: 1px solid var(--paper); }
.lang-button:focus-visible, .timeline-cta:focus-visible, .event-marker:focus-visible, .panel-nav:focus-visible, .source-link:focus-visible {
  outline: 2px solid var(--blood-bright); outline-offset: 4px;
}

main { overflow: hidden; }
.context {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(18rem, .55fr); gap: 3rem;
  padding: clamp(2.5rem, 5vw, 5rem) clamp(1.25rem, 4vw, 4.5rem) 2.5rem;
}
.context::before {
  content: ""; position: absolute; z-index: -2; inset: 0;
  background: url("static/bg_header_edited.png") center 48% / cover no-repeat;
  opacity: .5; filter: contrast(1.12) brightness(.78);
}
.context::after {
  content: ""; position: absolute; z-index: -1; inset: 0;
  background: linear-gradient(90deg, rgba(11,9,10,.78) 0%, rgba(11,9,10,.56) 58%, rgba(11,9,10,.74) 100%),
              linear-gradient(180deg, rgba(11,9,10,.12), rgba(11,9,10,.7));
}
.context h2 { max-width: 22ch; font-size: clamp(2rem, 4vw, 4.25rem); line-height: .98; letter-spacing: -.03em; }
.context-copy > p:last-child { max-width: 62ch; margin: 1.25rem 0 0; color: #c4bbb4; font-size: 1rem; line-height: 1.65; }
.summary { display: grid; align-content: end; margin: 0; border-top: 1px solid var(--rule); }
.summary div { display: flex; justify-content: space-between; gap: 1rem; padding: .95rem 0; border-bottom: 1px solid var(--rule); }
.summary dt { max-width: 17rem; color: var(--paper-muted); font-size: .78rem; line-height: 1.35; text-transform: uppercase; letter-spacing: .08em; }
.summary dd { margin: 0; color: #fff6ea; font-family: var(--font-serif); font-size: clamp(1.9rem, 3vw, 2.6rem); line-height: .9; text-shadow: 0 0 20px rgba(209,37,50,.2); }
.timeline-cta { display: none; }

.timeline-shell { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); background: #090708; }
.timeline-heading, .timeline-toolbar {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem;
  padding: 1.4rem clamp(1.25rem, 4vw, 4.5rem);
}
.timeline-heading h2 { font-size: clamp(1.8rem, 3vw, 3rem); }
.legend { display: flex; flex-wrap: wrap; gap: 1.25rem; color: var(--paper-muted); font-size: .78rem; }
.legend > span { display: flex; align-items: center; gap: .55rem; }
.legend-short { display: none; }
.legend-cross { position: relative; width: 13px; height: 13px; }
.legend-cross::before, .legend-cross::after { content: ""; position: absolute; background: var(--paper); }
.legend-cross::before { left: 5px; width: 2px; height: 13px; }
.legend-cross::after { top: 5px; width: 13px; height: 2px; }
.legend-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--blood-bright); box-shadow: 0 0 0 4px rgba(209,37,50,.18); }
.legend-dot-democracy { background: var(--warning-bright); box-shadow: 0 0 0 4px rgba(239,124,39,.16); }
.timeline-toolbar { align-items: center; padding-top: 0; padding-bottom: .9rem; }
.instruction { margin: 0; color: var(--paper-muted); font-size: .8rem; }
.scroll-progress { width: min(25vw, 260px); height: 1px; background: var(--rule); }
.scroll-progress span { display: block; width: 0; height: 2px; transform: translateY(-.5px); background: var(--blood-bright); }

.timeline-plot { position: relative; }
.timeline-scroll {
  position: relative; width: 100%; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
  scrollbar-width: none; cursor: grab; touch-action: pan-x pan-y; -webkit-overflow-scrolling: touch;
}
.timeline-scroll::-webkit-scrollbar { display: none; }
.timeline-scroll:active { cursor: grabbing; }
.timeline-stage { position: relative; height: 640px; min-width: 100%; }
#mortality-canvas { position: absolute; inset: 0; display: block; }
#day-highlight { position: absolute; z-index: 4; pointer-events: none; filter: drop-shadow(0 0 5px rgba(255,238,217,.38)); }
.event-layer, .year-layer { position: absolute; inset: 0; pointer-events: none; }
.event-marker {
  position: absolute; z-index: 6; left: var(--x); top: calc(var(--anchor-y) - var(--stem)); width: 1px; height: var(--stem);
  pointer-events: auto; border: 0; padding: 0; background: transparent; color: var(--paper); text-align: left; cursor: pointer;
}
.event-marker::before {
  content: ""; position: absolute; z-index: 2; left: -4px; bottom: -4px; width: 8px; height: 8px; border-radius: 50%;
  background: var(--blood-bright); box-shadow: 0 0 0 5px rgba(209,37,50,.14), 0 0 12px rgba(209,37,50,.35);
}
.event-stem {
  position: absolute; z-index: 0; left: 0; top: calc(-1 * var(--label-lift)); width: 1px; height: calc(100% + var(--label-lift));
  background: linear-gradient(rgba(164,15,27,.32), var(--blood));
}
.event-label {
  position: absolute; z-index: 1; left: 50%; bottom: calc(100% + 10px + var(--label-lift)); width: 8.25rem; min-height: 3.7rem;
  transform: translateX(-50%); padding: .5rem .45rem .35rem; border: 0; border-top: 1px solid rgba(164,15,27,.72);
  background: linear-gradient(135deg, rgba(35,29,31,.72), rgba(9,7,8,.5) 64%, rgba(25,13,16,.58));
  -webkit-backdrop-filter: blur(14px) saturate(1.22);
  backdrop-filter: blur(14px) saturate(1.22);
  box-shadow: 0 8px 26px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.07), inset 0 0 0 1px rgba(255,255,255,.025);
}
.event-marker time { display: block; margin-bottom: .28rem; color: var(--paper-muted); font-size: .68rem; letter-spacing: .04em; white-space: nowrap; }
.event-marker .event-title { display: -webkit-box; overflow: hidden; font-family: var(--font-serif); font-size: .8rem; line-height: 1.23; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.event-marker:hover .event-label, .event-marker:focus-visible .event-label { border-color: var(--blood-bright); background: linear-gradient(135deg, rgba(64,24,29,.76), rgba(14,9,10,.54) 68%, rgba(38,12,17,.62)); }
.event-marker.is-selected .event-label {
  border-color: var(--blood-bright);
  background: linear-gradient(135deg, rgba(112,18,28,.76), rgba(43,8,13,.57) 68%, rgba(75,12,20,.65));
  box-shadow: 0 10px 28px rgba(164,15,27,.16), inset 0 1px 0 rgba(255,255,255,.09), inset 0 0 0 1px rgba(255,255,255,.03);
}
.event-marker.is-selected .event-title { color: #fff; }
.event-marker.is-democracy-event::before {
  background: var(--warning-bright); box-shadow: 0 0 0 5px rgba(239,124,39,.14), 0 0 12px rgba(239,124,39,.35);
}
.event-marker.is-democracy-event .event-stem {
  background: linear-gradient(rgba(198,95,22,.3), var(--warning));
}
.event-marker.is-democracy-event .event-label { border-top-color: rgba(239,124,39,.74); }
.event-marker.is-democracy-event:hover .event-label,
.event-marker.is-democracy-event:focus-visible .event-label {
  border-color: var(--warning-bright); background: linear-gradient(135deg, rgba(72,39,17,.76), rgba(18,11,8,.54) 68%, rgba(45,24,11,.62));
}
.event-marker.is-democracy-event.is-selected .event-label {
  border-color: var(--warning-bright); background: linear-gradient(135deg, rgba(126,59,16,.78), rgba(51,24,8,.58) 68%, rgba(87,39,11,.66));
  box-shadow: 0 10px 28px rgba(198,95,22,.18), inset 0 1px 0 rgba(255,255,255,.09), inset 0 0 0 1px rgba(255,255,255,.03);
}
.event-marker:hover .event-title, .event-marker:focus-visible .event-title { color: #fff; }
.event-marker.is-peak-event .event-label { top: 0; bottom: auto; z-index: 3; }
.event-marker:focus-visible { outline: none; }
.event-marker:focus-visible .event-label { outline: 2px solid var(--blood-bright); outline-offset: 3px; }
.year-label { position: absolute; top: 30px; color: #877b7f; font: 700 .72rem/1 var(--font-sans); letter-spacing: .14em; }
.death-axis {
  position: absolute; z-index: 10; inset: 0 auto 0 0; width: 64px; pointer-events: none;
  background: linear-gradient(90deg, rgba(9,7,8,.99) 0%, rgba(9,7,8,.92) 62%, transparent 100%);
  border-right: 1px solid rgba(90,73,79,.28);
}
.axis-tick { position: absolute; right: 13px; width: 42px; text-align: right; transform: translateY(-50%); color: #93888b; font-size: .68rem; font-variant-numeric: tabular-nums; }
.axis-tick::after { content: ""; position: absolute; left: calc(100% + 6px); top: 50%; width: 7px; height: 1px; background: #67545a; }
.axis-title {
  position: absolute; left: 7px; top: 72px; width: 44px; color: #776b6f; font-size: .58rem; font-weight: 700;
  line-height: 1.4; letter-spacing: .09em; text-align: right; text-transform: uppercase;
}
.hover-card {
  position: fixed; z-index: 30; width: 178px; padding: .75rem .8rem; pointer-events: none;
  border: 1px solid #57464c; background: rgba(28,22,25,.96); box-shadow: 0 10px 28px rgba(0,0,0,.35);
  color: var(--paper); font-size: .75rem; line-height: 1.4;
}
.hover-card strong { display: block; margin-bottom: .2rem; font-family: var(--font-serif); font-size: 1rem; }
.hover-card hr { height: 1px; margin: .55rem 0; border: 0; background: #4c3c41; }
.hover-card b { color: #d4c9c2; font-weight: 700; text-transform: capitalize; }
.method-note { margin: 0; padding: .85rem clamp(1.25rem, 4vw, 4.5rem); border-top: 1px solid var(--rule); color: #8f8487; font-size: .72rem; }
.timeline-range-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.timeline-range {
  display: block; width: calc(100% - clamp(2.5rem, 8vw, 9rem)); height: 28px; margin: 0 clamp(1.25rem, 4vw, 4.5rem) .35rem;
  --range-progress: 0%;
  -webkit-appearance: none; appearance: none; border: 0; border-radius: 0; background: transparent;
  accent-color: var(--blood-bright); cursor: ew-resize; touch-action: pan-x;
}
.timeline-range::-webkit-slider-runnable-track {
  -webkit-appearance: none; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, var(--blood) 0 var(--range-progress), #46383d var(--range-progress) 100%);
}
.timeline-range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 30px; height: 10px; margin-top: -4px;
  border: 1px solid #92505b; border-radius: 2px; background: #643640;
  box-shadow: 0 0 0 2px rgba(7,5,6,.9), 0 2px 8px rgba(0,0,0,.38);
}
.timeline-range::-moz-range-track { height: 2px; border-radius: 2px; background: #46383d; }
.timeline-range::-moz-range-progress { height: 2px; background: var(--blood); }
.timeline-range::-moz-range-thumb {
  width: 30px; height: 10px; border: 1px solid #92505b; border-radius: 2px; background: #643640;
  box-shadow: 0 0 0 2px rgba(7,5,6,.9), 0 2px 8px rgba(0,0,0,.38);
}
.timeline-range:focus-visible { outline: 2px solid var(--blood-bright); outline-offset: 2px; }

.method { min-height: 78vh; display: flex; flex-direction: column; padding: clamp(3rem, 7vw, 7rem) clamp(1.25rem, 4vw, 4.5rem) 1.5rem; }
.method h2 { max-width: 24ch; font-size: clamp(2rem, 4vw, 3.8rem); line-height: 1.05; }
.method h2 span, .method h2 strong { display: block; }
.method h2 strong { color: #fff5e8; font-weight: 700; white-space: nowrap; }
.method-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(14rem, .9fr) minmax(12rem, .7fr); gap: clamp(1.5rem, 4vw, 4rem); margin-top: clamp(2rem, 4vw, 3.5rem); }
.method-statement { margin: 0; max-width: 47rem; color: #d0c6bf; font-size: clamp(1.05rem, 1.45vw, 1.3rem); line-height: 1.7; }
.method-resources { display: grid; align-content: start; gap: 1.25rem; }
.sources-disclosure { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.sources-disclosure summary { padding: .8rem 0; color: var(--paper); font-size: .82rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.sources-disclosure ul { margin: 0 0 1rem; padding-left: 1.15rem; color: #ada3a0; font-size: .78rem; line-height: 1.45; }
.sources-disclosure li + li { margin-top: .45rem; }
.sources-disclosure a, .election-link { text-decoration-color: #6c555d; text-underline-offset: 3px; }
.election-link { color: #e4c7cb; font-size: .86rem; line-height: 1.45; }
.share-block { align-self: start; }
.share-actions { display: grid; gap: .45rem; }
.share-actions button {
  min-height: 2.4rem; padding: .55rem .7rem; border: 1px solid #44363a; background: rgba(30,23,26,.5); color: #d8cfca;
  text-align: left; cursor: pointer; transition: border-color .18s ease, background .18s ease;
}
.share-actions button:hover, .share-actions button:focus-visible { border-color: var(--blood-bright); background: rgba(74,20,27,.45); outline: none; }
.share-status { min-height: 1.2em; margin: .55rem 0 0; color: #a99ea0; font-size: .72rem; }
.poem { width: min(100%, 42rem); margin: clamp(2rem, 5vw, 4rem) 0 0; color: #746b6d; }
.poem blockquote { margin: 0; padding: 0; border: 0; font-family: var(--font-serif); font-size: .82rem; line-height: 1.58; }
.poem blockquote span { display: block; }
.poem figcaption { margin-top: .65rem; font-size: .62rem; letter-spacing: .055em; text-transform: uppercase; }
.poem cite { font-style: normal; }
.credits { margin: auto 0 0; padding-top: 3rem; color: #61585a; font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }

.event-panel {
  position: fixed; z-index: 60; top: 0; right: 0; width: min(32rem, 94vw); height: 100dvh; overflow-y: auto;
  overscroll-behavior: contain;
  padding: clamp(2rem, 6vw, 4.5rem); transform: translateX(102%); transition: transform .36s cubic-bezier(.22,.75,.18,1);
  border-left: 1px solid #614b52; background: #211a1d; box-shadow: -30px 0 60px rgba(0,0,0,.35);
}
.event-panel.is-open { transform: translateX(0); }
.event-panel.is-democracy { border-left-color: #76502f; }
.event-panel.is-democracy .panel-type,
.event-panel.is-democracy .panel-nav { color: var(--warning-bright); }
.event-panel.is-democracy blockquote { border-left-color: var(--warning); }
.panel-date, .panel-type { margin: 0 0 .35rem; color: var(--paper-muted); font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.panel-type { margin-bottom: 1.5rem; color: #c67a86; }
.panel-meta-row { position: relative; }
.panel-meta { min-width: 0; }
.panel-nav {
  position: absolute; top: -.35rem; display: grid; place-items: center; width: 2rem; height: 2rem; padding: 0; border: 0;
  background: transparent; color: var(--blood-bright); cursor: pointer;
  font-size: 1.55rem; line-height: 1; transition: color .18s ease, transform .18s ease;
}
.panel-nav-prev { right: calc(100% + .7rem); }
.panel-nav-next { left: calc(100% + .7rem); }
.panel-nav:hover { color: #f04450; transform: translateX(var(--nav-shift, 0)); }
.panel-nav-prev:hover { --nav-shift: -2px; }
.panel-nav-next:hover { --nav-shift: 2px; }
.panel-nav[hidden] { display: none; }
.event-panel h2 { font-size: clamp(2rem, 5vw, 3.6rem); line-height: 1.03; }
.panel-summary { margin: 1.5rem 0 0; color: #cec5bf; font-size: 1.05rem; line-height: 1.7; }
blockquote { margin: 2rem 0 0; padding-left: 1.25rem; border-left: 3px solid var(--blood); font-family: var(--font-serif); font-size: 1.45rem; line-height: 1.35; }
.image-evidence, .video-evidence { margin: 2.25rem 0 0; }
.image-evidence { overflow: hidden; border: 1px solid #57464c; background: #0d0a0b; }
.image-evidence img { display: block; width: 100%; max-height: 22rem; object-fit: cover; filter: saturate(.72) contrast(1.05); }
.image-evidence figcaption { padding: .7rem .8rem .8rem; color: #aaa09c; font-size: .78rem; line-height: 1.45; }
.media-sequence { margin-top: 2.5rem; }
.media-sequence > .eyebrow { margin-bottom: .9rem; }
.media-sequence-items { display: grid; gap: 1.15rem; }
.media-item { margin: 0; overflow: hidden; border: 1px solid #57464c; background: #0d0a0b; }
.media-item img { display: block; width: 100%; max-height: 22rem; object-fit: cover; filter: saturate(.72) contrast(1.06); }
.media-item figcaption { padding: .72rem .8rem .82rem; color: #aaa09c; font-size: .78rem; line-height: 1.45; }
.media-item .video-frame { border: 0; border-bottom: 1px solid #57464c; }
.video-frame { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border: 1px solid #57464c; background: #0d0a0b; }
.video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-caption { margin: .7rem 0 0; color: #aaa09c; font-size: .78rem; line-height: 1.45; }
.evidence-card { margin-top: 3rem; padding: 1.25rem; border: 1px solid var(--rule); background: #191416; }
.evidence-card p:not(.eyebrow) { line-height: 1.45; }
.evidence-card a { display: inline-block; margin-top: .5rem; color: #d7a5ad; text-underline-offset: 4px; }
.extra-sources { margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid var(--rule); }
.extra-sources > p { margin: 0; color: var(--paper-muted); font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.extra-sources ul { margin: .45rem 0 0; padding-left: 1.1rem; color: #d7a5ad; }
.extra-sources li + li { margin-top: .3rem; }
.extra-sources a { margin-top: 0; }
.panel-scrim { position: fixed; z-index: 50; inset: 0; overscroll-behavior: none; background: rgba(5,3,4,.08); }

@media (max-width: 760px) {
  html { scroll-snap-type: y proximity; }
  .hero, .timeline-shell, .method { scroll-snap-align: start; }
  .hero {
    height: var(--mobile-section-height); min-height: var(--mobile-section-height);
    display: flex; flex-direction: column; isolation: isolate; overflow: hidden;
    background: #090708;
  }
  .hero::before {
    content: ""; position: absolute; z-index: -2; inset: 0;
    background: url("static/mobile_hero.jpg") 55% center / cover no-repeat;
    filter: contrast(1.08) brightness(.76);
  }
  .hero::after {
    content: ""; position: absolute; z-index: -1; inset: 0;
    background: linear-gradient(180deg, rgba(7,5,6,.48) 0%, rgba(7,5,6,.22) 34%, rgba(7,5,6,.74) 72%, rgba(7,5,6,.96) 100%),
                linear-gradient(90deg, rgba(7,5,6,.56), rgba(7,5,6,.12));
  }
  .masthead { min-height: 68px; gap: .75rem; padding: .95rem 1rem; border-bottom-color: rgba(231,224,213,.14); background: transparent; }
  .identity { gap: 0; min-width: 0; }
  .identity > div { min-width: 0; }
  .memorial-mark { display: none; }
  h1 { font-size: clamp(1.05rem, 5vw, 1.35rem); }
  .language { flex: 0 0 auto; }
  .eyebrow { font-size: .7rem; }
  .context {
    flex: 1; display: flex; flex-direction: column; gap: 1.25rem; padding: clamp(1.4rem, 6svh, 3.4rem) 1rem 1.15rem;
  }
  .context::before, .context::after { display: none; }
  .context h2 { max-width: 13ch; font-size: clamp(2.45rem, 12.7vw, 4rem); line-height: .92; }
  .context-copy > p:last-child { max-width: 34rem; margin-top: 1rem; color: #d4cbc4; font-size: .93rem; line-height: 1.5; }
  .summary { width: 100%; align-content: start; margin-top: auto; border-top-color: rgba(231,224,213,.2); }
  .summary { border-top: 0; }
  .summary div { align-items: end; padding: .7rem 0; border-bottom: 0; }
  .summary dt { max-width: 13rem; font-size: .66rem; }
  .summary dd { font-size: clamp(2rem, 9vw, 2.75rem); }
  .timeline-cta {
    display: flex; align-items: center; justify-content: center; width: 100%; min-height: 2.7rem; margin-top: .1rem;
    border: 1px solid rgba(231,224,213,.28); background: rgba(10,8,9,.24); color: #e8e0d7;
    -webkit-appearance: none; appearance: none; cursor: pointer;
    font-size: .76rem; font-weight: 650; letter-spacing: .09em; text-decoration: none; text-transform: uppercase;
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  }
  .timeline-shell {
    height: var(--mobile-section-height); min-height: var(--mobile-section-height);
    display: flex; flex-direction: column; overflow: hidden;
  }
  .timeline-heading {
    flex: 0 0 auto; display: grid; grid-template-columns: 1fr; align-items: end;
    gap: .5rem; padding: .7rem .75rem .45rem;
  }
  .timeline-heading h2 { font-size: clamp(1.45rem, 7vw, 1.85rem); line-height: .95; }
  .timeline-heading .eyebrow { margin-bottom: .2rem; font-size: .58rem; }
  .legend { justify-self: start; flex-wrap: nowrap; gap: .75rem; font-size: .6rem; white-space: nowrap; }
  .legend > span { gap: .25rem; }
  .legend-long { display: none; }
  .legend-short { display: inline; }
  .legend-cross { width: 9px; height: 9px; }
  .legend-cross::before { left: 4px; width: 1px; height: 9px; }
  .legend-cross::after { top: 4px; width: 9px; height: 1px; }
  .legend-dot { width: 6px; height: 6px; box-shadow: 0 0 0 3px rgba(209,37,50,.15); }
  .legend-dot-democracy { box-shadow: 0 0 0 3px rgba(239,124,39,.14); }
  .timeline-toolbar { flex: 0 0 auto; align-items: center; gap: .6rem; padding: .2rem .75rem .5rem; }
  .instruction { max-width: 32rem; font-size: .64rem; line-height: 1.35; }
  .scroll-progress { width: 100%; }
  .timeline-plot { flex: 1 1 auto; min-height: 0; overflow: hidden; }
  .timeline-scroll, .timeline-stage { height: 100%; }
  .timeline-scroll { cursor: default; }
  .death-axis { width: 56px; }
  .axis-tick { right: 11px; }
  .event-label { width: 7.3rem; }
  .timeline-range { flex: 0 0 auto; width: calc(100% - 1.5rem); margin: 0 .75rem .15rem; }
  .method-note { flex: 0 0 auto; max-height: 3.3rem; overflow: hidden; padding: .48rem .75rem .55rem; font-size: .58rem; line-height: 1.35; }
  .method {
    height: var(--mobile-section-height); min-height: var(--mobile-section-height);
    overflow-y: auto; padding: clamp(2.2rem, 7svh, 4rem) 1rem .85rem;
  }
  .method h2 { max-width: 100%; font-size: clamp(2rem, 9vw, 3.7rem); line-height: .94; }
  .method-grid { grid-template-columns: 1fr; gap: 1.35rem; margin-top: clamp(1.7rem, 5svh, 2.6rem); }
  .method-statement { font-size: .98rem; line-height: 1.58; }
  .sources-disclosure summary { padding: .65rem 0; font-size: .74rem; }
  .sources-disclosure ul { font-size: .72rem; }
  .election-link { font-size: .78rem; }
  .share-block > .eyebrow { margin-bottom: .55rem; }
  .share-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem; }
  .share-actions button { min-height: 2.2rem; padding: .45rem .55rem; font-size: .74rem; }
  .poem { margin-top: 1.25rem; }
  .poem blockquote { font-size: .7rem; line-height: 1.42; }
  .poem figcaption { margin-top: .45rem; font-size: .52rem; }
  .credits { padding-top: 1.4rem; font-size: .56rem; }
  .event-panel {
    top: auto; bottom: 0; width: 100%; height: var(--mobile-panel-height); padding: 2.4rem 1.15rem 2rem;
    transform: translateY(102%); border-top: 1px solid #614b52; border-left: 0; overscroll-behavior: contain; touch-action: pan-y;
  }
  .event-panel.is-open { transform: translateY(0); }
  .panel-meta-row { display: grid; grid-template-columns: 1.75rem minmax(0, 1fr) 1.75rem; align-items: start; gap: .35rem; }
  .panel-meta { grid-column: 2; }
  .panel-nav { position: static; width: 1.75rem; height: 1.75rem; font-size: 1.35rem; }
  .panel-nav-prev { grid-column: 1; grid-row: 1; }
  .panel-nav-next { grid-column: 3; grid-row: 1; }
  .event-panel h2 { font-size: clamp(1.65rem, 8.3vw, 2.55rem); }
  .panel-summary { font-size: 1rem; line-height: 1.6; }
  blockquote { margin-top: 1.5rem; font-size: 1.25rem; }
  .media-item img, .image-evidence img { max-height: 16rem; }
}

@media (max-width: 760px) {
  html.mobile-short .method { padding: .9rem 1rem .55rem; }
  html.mobile-short .method h2 { font-size: 1.9rem; line-height: .92; }
  html.mobile-short .method-grid { gap: .65rem; margin-top: .8rem; }
  html.mobile-short .method-statement { font-size: .78rem; line-height: 1.34; }
  html.mobile-short .method-resources { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: .65rem; }
  html.mobile-short .sources-disclosure summary { padding: .4rem 0; font-size: .64rem; }
  html.mobile-short .election-link { font-size: .67rem; }
  html.mobile-short .share-block > .eyebrow { margin-bottom: .35rem; }
  html.mobile-short .share-actions { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .25rem; }
  html.mobile-short .share-actions button { min-height: 1.8rem; padding: .3rem .2rem; font-size: .58rem; text-align: center; }
  html.mobile-short .share-status { min-height: .7em; margin-top: .2rem; font-size: .58rem; }
  html.mobile-short .poem { margin-top: .65rem; }
  html.mobile-short .poem blockquote { font-size: .59rem; line-height: 1.32; }
  html.mobile-short .poem figcaption { margin-top: .3rem; font-size: .46rem; }
  html.mobile-short .credits { padding-top: .45rem; font-size: .48rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .event-panel { transition: none; }
}