:root {
  --ink: #1d211c;
  --ink-soft: #394039;
  --paper: #eee7d7;
  --paper-light: #f7f2e8;
  --paper-deep: #d8ccb4;
  --rust: #a9462e;
  --rust-dark: #7b3022;
  --moss: #486351;
  --blue: #496772;
  --line: #b9ad95;
  --line-dark: #565d53;
  --muted: #726c60;
  --page: 1460px;
  --serif: "Noto Serif TC", "Songti TC", "PMingLiU", "Microsoft JhengHei", serif;
  --sans: "Noto Sans TC", "Microsoft JhengHei", sans-serif;
}

* { box-sizing: border-box; }
html {
  font-size: 17px;
  scroll-behavior: smooth;
  text-size-adjust: 100%;
  text-spacing-trim: trim-start;
  text-autospace: normal;
}
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 20% 10%, rgba(73, 103, 114, .055) 0 1px, transparent 1.5px) 0 0 / 13px 13px,
    var(--paper-light);
  font-family: var(--sans);
  font-synthesis: none;
  font-kerning: normal;
  line-height: 1.85;
  text-rendering: optimizeLegibility;
}
:where(p, li, figcaption) { line-break: strict; word-break: normal; overflow-wrap: anywhere; hanging-punctuation: allow-end; }
:where(h1, h2, h3) { line-break: strict; word-break: normal; overflow-wrap: anywhere; text-wrap: balance; }
body:has(dialog[open]) { overflow: hidden; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a { color: inherit; }
img { max-width: 100%; }
[hidden] { display: none !important; }

.skip-link {
  position: fixed;
  z-index: 100;
  left: 12px;
  top: -60px;
  padding: 10px 15px;
  color: var(--paper-light);
  background: var(--ink);
}
.skip-link:focus { top: 12px; }
.page-width { width: min(var(--page), calc(100% - 64px)); margin-inline: auto; }

.site-header {
  position: sticky;
  z-index: 20;
  top: 0;
  min-height: 76px;
  padding: 0 max(24px, calc((100vw - var(--page)) / 2));
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr);
  align-items: stretch;
  color: var(--paper-light);
  background: var(--ink);
  border-bottom: 1px solid #343a32;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  width: max-content;
  color: inherit;
  text-decoration: none;
}
.brand-mark {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid #899080;
  color: #f3d7ae;
  font-family: var(--serif);
  font-size: 1.2rem;
}
.brand b, .brand small { display: block; }
.brand b { font-family: var(--serif); font-size: 1.08rem; letter-spacing: 0; }
.brand small { color: #aeb3a5; font-size: .68rem; }
.site-nav { display: flex; align-items: stretch; }
.site-nav a {
  min-width: 106px;
  padding: 0 16px;
  display: grid;
  place-items: center;
  color: #c7cabf;
  text-decoration: none;
  border-inline-start: 1px solid #3c4238;
  font-size: .92rem;
  transition: color .18s ease, background .18s ease;
}
.site-nav a:last-child { border-inline-end: 1px solid #3c4238; }
.site-nav a:hover, .site-nav a:focus-visible, .site-nav a[aria-current="page"] {
  color: #fff8e9;
  background: #343b32;
}
.site-nav a[aria-current="page"] { box-shadow: inset 0 -3px var(--rust); }
.archive-total { align-self: center; justify-self: end; margin: 0; color: #aeb3a5; font-size: .8rem; }

.home-intro {
  min-height: 480px;
  padding: 78px 0 62px;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  gap: clamp(48px, 8vw, 130px);
  align-items: end;
}
.kicker {
  margin: 0 0 18px;
  color: var(--rust);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: 0;
}
.home-title h1, .page-intro h1 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 700;
  letter-spacing: 0;
}
.home-title h1 { max-width: 820px; font-size: 6rem; line-height: 1.12; }
.home-lede { padding-left: 26px; border-left: 2px solid var(--rust); }
.home-lede > p { margin: 0; color: var(--ink-soft); font-family: var(--serif); font-size: 1.1rem; line-height: 2; }
.home-actions { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 10px 24px; }
.text-command {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--rust-dark);
  font-size: .92rem;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}
.text-command:hover, .text-command:focus-visible { color: var(--blue); }

.contact-strip { padding: 56px 0 66px; background: var(--ink); color: var(--paper); }
.section-heading {
  margin-bottom: 30px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
}
.section-heading > div { display: flex; align-items: baseline; gap: 17px; }
.section-heading h2 { margin: 0; font-family: var(--serif); font-size: 2.5rem; line-height: 1.3; }
.section-heading > p { max-width: 460px; margin: 0; color: inherit; opacity: .68; font-size: .9rem; }
.section-number { margin: 0; color: var(--rust); font: 800 .74rem/1 var(--sans); letter-spacing: 0; }
.contact-grid { display: grid; grid-template-columns: 1.35fr .85fr .85fr .85fr .85fr; gap: 2px; background: #55594e; }
.contact-item {
  position: relative;
  min-width: 0;
  min-height: 310px;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: #2d302a;
  color: white;
  text-align: left;
  cursor: pointer;
}
.contact-item img { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(.72) contrast(1.04); transition: transform .35s ease, filter .35s ease; }
.contact-item:hover img, .contact-item:focus-visible img { transform: scale(1.025); filter: saturate(.95); }
.contact-caption { position: absolute; inset: auto 0 0; padding: 54px 16px 14px; background: linear-gradient(transparent, rgba(12, 14, 12, .88)); }
.contact-caption b, .contact-caption small { display: block; }
.contact-caption b { font-family: var(--serif); font-size: .98rem; line-height: 1.45; }
.contact-caption small { color: #d7d0c0; font-size: .72rem; }

.era-entry { padding: 78px 0 88px; }
.era-rail { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.era-link {
  min-height: 118px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: var(--ink);
  background: rgba(255,255,255,.24);
  border: 0;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  text-align: left;
  cursor: pointer;
}
.era-link:hover, .era-link:focus-visible { color: var(--paper-light); background: var(--moss); }
.era-link b { font-family: var(--serif); font-size: 1.35rem; }
.era-link small { color: inherit; opacity: .72; }

.story-preview { padding: 74px 0 80px; background: #d8d2c2; border-block: 1px solid var(--line); }
.story-preview-list { border-top: 1px solid #a79e8b; }
.story-preview-item {
  width: 100%;
  min-height: 102px;
  padding: 18px 0;
  display: grid;
  grid-template-columns: 130px minmax(240px, .85fr) 1fr 42px;
  align-items: center;
  gap: 24px;
  border: 0;
  border-bottom: 1px solid #a79e8b;
  color: var(--ink);
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.story-preview-item:hover, .story-preview-item:focus-visible { color: var(--rust-dark); background: rgba(255,255,255,.2); }
.story-preview-item img { width: 130px; height: 72px; object-fit: cover; filter: grayscale(.45); }
.story-preview-item b { font-family: var(--serif); font-size: 1.2rem; line-height: 1.45; }
.story-preview-item p { margin: 0; color: var(--muted); font-size: .88rem; }
.story-preview-item span:last-child { font-size: 1.25rem; }
.source-note { padding: 70px 0 90px; display: grid; grid-template-columns: 170px minmax(0, 760px); gap: 35px; }
.source-note > p:last-child { margin: 0; font-family: var(--serif); font-size: 1.13rem; line-height: 2; }

.page-intro { padding: 72px 0 48px; border-bottom: 1px solid var(--line); }
.page-intro h1 { font-size: 5.3rem; line-height: 1.08; }
.page-intro > p:last-child { max-width: 620px; margin: 18px 0 0; color: var(--muted); font-family: var(--serif); font-size: 1.04rem; }
.archive-page { padding-bottom: 90px; }
.archive-intro {
  min-height: 280px;
  padding: 58px 0 42px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 500px);
  gap: 72px;
  align-items: end;
  border-bottom: 1px solid var(--line);
}
.archive-intro h1 { margin: 8px 0 0; font-family: var(--serif); font-size: 4.3rem; line-height: 1.12; }
.archive-intro > p { max-width: 480px; margin: 0 0 8px; color: var(--ink-soft); font-family: var(--serif); font-size: 1.02rem; line-height: 2; }
.archive-filter-panel { border-bottom: 1px solid var(--line); }
.archive-filter-panel > summary { display: none; }
.archive-filter-content { padding: 27px 0 30px; }
.archive-filter-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 13px; }
.archive-filter-heading h2 { margin: 0; font-family: var(--serif); font-size: 1rem; }
.clear-filter { padding: 4px 0; border: 0; border-bottom: 1px solid currentColor; color: var(--rust-dark); background: transparent; cursor: pointer; font-size: .78rem; }
.clear-filter:disabled { color: var(--muted); cursor: default; opacity: .45; }
.archive-filter-fields { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, .9fr); gap: 14px; }
.archive-field { min-width: 0; }
.archive-field > span { display: block; margin-bottom: 6px; color: var(--muted); font-size: .74rem; }
.archive-field select {
  width: 100%;
  min-height: 50px;
  padding: 9px 42px 9px 13px;
  border: 1px solid #9f947d;
  border-radius: 2px;
  color: var(--ink);
  background-color: rgba(255,255,255,.42);
  font: inherit;
  font-size: .9rem;
  cursor: pointer;
}
.archive-field select:hover { border-color: var(--moss); }
.archive-field select:focus-visible { outline: 3px solid rgba(73,103,114,.28); outline-offset: 2px; }
.archive-summary { padding: 31px 0 18px; display: flex; align-items: end; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); }
.archive-summary h2 { margin: 0; font-family: var(--serif); font-size: 2rem; line-height: 1.25; }
.archive-summary p { margin: 3px 0 0; color: var(--muted); font-size: .78rem; }
.archive-summary > p { flex: none; margin-bottom: 4px; }
.photo-grid { padding: 30px 0 18px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 46px 28px; }
.photo-card { appearance: none; min-width: 0; padding: 0; border: 0; color: var(--ink); background: transparent; text-align: left; cursor: zoom-in; }
.photo-card-image { aspect-ratio: 4 / 3; overflow: hidden; display: grid; place-items: center; background: #292c26; }
.photo-card-image img { width: 100%; height: 100%; display: block; object-fit: contain; filter: saturate(.82); transition: filter .22s ease; }
.photo-card-copy { padding-top: 13px; display: block; }
.photo-card-context { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 11px; color: var(--muted); font-size: .72rem; }
.photo-card-context b { color: var(--rust-dark); font-weight: 800; }
.photo-card-title { margin-top: 4px; display: block; font-family: var(--serif); font-size: 1.12rem; font-weight: 700; line-height: 1.55; }
.photo-card-meta, .photo-card-source { margin-top: 4px; display: block; color: var(--ink-soft); font-size: .77rem; line-height: 1.55; }
.photo-card-source { margin-top: 1px; color: var(--muted); }
.photo-card:hover .photo-card-image img, .photo-card:focus-visible .photo-card-image img { filter: saturate(1) contrast(1.02); }
.photo-card:hover .photo-card-title, .photo-card:focus-visible .photo-card-title { color: var(--rust-dark); }
.photo-card:focus-visible { outline: 3px solid var(--blue); outline-offset: 5px; }
.load-more-wrap { width: min(100%, 380px); margin-inline: auto; padding: 38px 0 6px; text-align: center; }
.load-more-wrap p { margin: 0 0 8px; color: var(--muted); font-size: .76rem; }
.load-progress-track { height: 3px; margin-bottom: 20px; overflow: hidden; background: var(--paper-deep); }
.load-progress-track span { width: 0; height: 100%; display: block; background: var(--rust); transition: width .28s ease-out; }
.load-more { min-width: 190px; min-height: 48px; padding: 9px 18px; border: 1px solid var(--ink); color: var(--paper-light); background: var(--ink); cursor: pointer; }
.load-more:hover, .load-more:focus-visible { color: white; background: var(--rust-dark); border-color: var(--rust-dark); }
.empty-state { padding: 75px 0; color: var(--muted); text-align: center; }
.empty-state p { margin: 0 0 15px; }
.empty-state button { min-height: 44px; padding: 8px 16px; border: 1px solid var(--ink); color: var(--ink); background: transparent; cursor: pointer; }

.stories-page { padding-bottom: 100px; }
.stories-intro { display: grid; grid-template-columns: 1fr 460px; gap: 70px; align-items: end; }
.stories-intro > p { margin: 0 0 8px; }
.story-index { counter-reset: story; border-top: 1px solid var(--line); }
.story-index-item {
  counter-increment: story;
  width: 100%;
  padding: 27px 0;
  display: grid;
  grid-template-columns: 72px 140px minmax(250px, .8fr) minmax(280px, 1fr) 50px;
  align-items: center;
  gap: 22px;
  border: 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.story-index-item::before { content: counter(story, decimal-leading-zero); color: var(--rust); font: 800 .78rem/1 var(--sans); }
.story-index-item img { width: 140px; height: 86px; object-fit: cover; filter: saturate(.7); }
.story-index-item .story-year { margin: 0; color: var(--blue); font-size: .78rem; font-weight: 800; }
.story-index-item h2 { margin: 3px 0 0; font-family: var(--serif); font-size: 1.28rem; line-height: 1.45; }
.story-index-item > p { margin: 0; color: var(--muted); font-size: .86rem; }
.story-index-item > span:last-child { font-size: 1.3rem; }
.story-index-item:hover, .story-index-item:focus-visible { color: var(--rust-dark); background: rgba(216, 204, 180, .25); }

.feb28-page { padding-bottom: 110px; }
.feb28-intro {
  min-height: 590px;
  padding-block: 86px 72px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(310px, 470px);
  grid-template-areas: "kicker date" "title lede";
  column-gap: 86px;
  align-items: end;
}
.feb28-intro .kicker { grid-area: kicker; align-self: start; }
.feb28-date { grid-area: date; align-self: start; margin: 0; color: var(--rust-dark); font-family: var(--serif); font-size: 1.15rem; }
.feb28-intro h1 { grid-area: title; margin: 0; max-width: 850px; font-family: var(--serif); font-size: 4.9rem; line-height: 1.18; letter-spacing: 0; }
.feb28-lede { grid-area: lede; margin: 0; padding-left: 25px; border-left: 2px solid var(--rust); color: var(--ink-soft); font-family: var(--serif); font-size: 1.08rem; line-height: 2.05; }
.feb28-method { padding-block: 34px; color: #ece4d3; background: var(--ink); }
.feb28-method-inner { display: grid; grid-template-columns: 150px minmax(0, 840px); gap: 35px; }
.feb28-method-inner p { margin: 0; }
.feb28-method-inner p:last-child { font-family: var(--serif); font-size: 1rem; line-height: 2; }
.feb28-section { padding-block: 82px; }
.feb28-section-heading { max-width: 890px; margin-bottom: 42px; }
.feb28-section-heading h2, .feb28-limits h2 { margin: 10px 0 14px; font-family: var(--serif); font-size: 2.55rem; line-height: 1.35; letter-spacing: 0; }
.feb28-section-heading > p:last-of-type { max-width: 700px; margin: 0; color: var(--muted); font-family: var(--serif); line-height: 1.9; }
.feb28-timeline { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.feb28-timeline li { padding: 28px 0; display: grid; grid-template-columns: 190px minmax(0, 760px); gap: 42px; border-bottom: 1px solid var(--line); }
.feb28-timeline time { color: var(--rust-dark); font-size: .82rem; font-weight: 800; }
.feb28-timeline h3 { margin: -5px 0 8px; font-family: var(--serif); font-size: 1.3rem; line-height: 1.5; }
.feb28-timeline p { margin: 0; color: var(--ink-soft); font-family: var(--serif); line-height: 2; }
.feb28-timeline .is-pivotal { position: relative; }
.feb28-timeline .is-pivotal::before { content: ""; position: absolute; inset: 0 auto 0 -18px; width: 4px; background: var(--rust); }
.source-line { max-width: 920px; margin: 30px 0 0; color: var(--muted); font-size: .78rem; }
.source-line a, .feb28-scene a, .feb28-people a, .feb28-documents a { color: var(--rust-dark); text-underline-offset: 3px; }
.feb28-scenes { padding-block: 84px; background: #d8d2c2; border-block: 1px solid var(--line); }
.feb28-scene-list { border-top: 1px solid #a69e8c; }
.feb28-scene { padding-block: 44px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); gap: 52px; align-items: center; border-bottom: 1px solid #a69e8c; }
.feb28-scene:nth-child(even) .feb28-scene-images { order: 2; }
.feb28-scene-images { min-width: 0; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(190px, .6fr); gap: 3px; background: #9b9484; }
.feb28-scene figure, .feb28-document-images figure { margin: 0; min-width: 0; background: #22261f; }
.feb28-scene img { width: 100%; height: 350px; display: block; object-fit: contain; }
.feb28-scene figcaption, .feb28-document-images figcaption { min-height: 46px; padding: 9px 11px; color: #d8d0c0; background: #2d312a; font-size: .69rem; }
.feb28-scene .story-year, .feb28-people .story-year { margin: 0; color: var(--rust-dark); font-size: .74rem; font-weight: 800; }
.feb28-scene h3, .feb28-people h3 { margin: 8px 0 13px; font-family: var(--serif); font-size: 1.65rem; line-height: 1.45; }
.feb28-scene > div:last-child > p:last-child, .feb28-people article p { color: var(--ink-soft); font-family: var(--serif); line-height: 2; }
.feb28-people { display: grid; grid-template-columns: 1fr 1fr; column-gap: 50px; border-top: 1px solid var(--line); }
.feb28-people article { padding-block: 32px; display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 25px; border-bottom: 1px solid var(--line); }
.feb28-people img { width: 170px; height: 210px; display: block; object-fit: contain; object-position: center; background: #242820; filter: saturate(.75); }
.feb28-people article p { margin: 0 0 13px; }
.feb28-people article a { font-size: .8rem; }
.feb28-documents { padding-block: 86px; color: #eee7d7; background: #242820; }
.feb28-documents-grid { display: grid; grid-template-columns: minmax(300px, .62fr) minmax(0, 1.38fr); gap: 70px; align-items: start; }
.feb28-documents .feb28-section-heading { position: sticky; top: 110px; margin: 0; }
.feb28-documents .section-number { color: #d88163; }
.feb28-documents .feb28-section-heading > p:last-of-type { color: #c5c0b2; }
.feb28-documents a { display: inline-block; margin-top: 22px; color: #f1b59e; }
.feb28-document-images { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.feb28-document-images img { width: 100%; height: 680px; display: block; object-fit: contain; background: #151812; }
.feb28-limits { padding-top: 86px; max-width: 1000px; }
.feb28-limits > p:not(.section-number) { max-width: 820px; margin: 0; color: var(--ink-soft); font-family: var(--serif); font-size: 1.04rem; line-height: 2.05; }
.feb28-source-grid { margin-top: 38px; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.feb28-source-grid a { min-height: 116px; padding: 19px; display: flex; flex-direction: column; justify-content: space-between; text-decoration: none; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.feb28-source-grid a:hover, .feb28-source-grid a:focus-visible { color: var(--paper-light); background: var(--moss); }
.feb28-source-grid b { font-family: var(--serif); }
.feb28-source-grid span { color: inherit; opacity: .72; font-size: .76rem; }

.feb28-toc {
  position: sticky;
  z-index: 14;
  top: 76px;
  overflow-x: auto;
  color: var(--ink-soft);
  background: rgba(247, 242, 232, .97);
  border-bottom: 1px solid var(--line);
  scrollbar-width: thin;
}
.feb28-toc .page-width { display: flex; width: max-content; min-width: min(var(--page), calc(100% - 64px)); }
.feb28-toc a { min-height: 48px; padding: 0 13px; display: grid; place-items: center; white-space: nowrap; text-decoration: none; border-right: 1px solid rgba(185, 173, 149, .6); font-size: .76rem; }
.feb28-toc a:first-child { border-left: 1px solid rgba(185, 173, 149, .6); }
.feb28-toc a:hover, .feb28-toc a:focus-visible { color: var(--paper-light); background: var(--moss); }
#feb28-prologue, #feb28-context, #feb28-timeline, #feb28-negotiation, #feb28-sites, #feb28-people, #feb28-aftermath, #feb28-documents, #feb28-responsibility, #feb28-memory, #feb28-sources { scroll-margin-top: 140px; }
.feb28-essay { padding-block: 94px; }
.feb28-essay.page-width { max-width: 1120px; }
.feb28-essay-shaded { background: #e1dacb; border-block: 1px solid var(--line); }
.feb28-essay-deep { color: #ede6d7; background: #2b3028; }
.feb28-memory { color: #eee7d7; background: #343a31; }
.feb28-chapter-heading { width: min(100%, 760px); margin: 0 auto 42px; }
.feb28-chapter-heading h2 { margin: 11px 0 18px; font-family: var(--serif); font-size: 2.75rem; line-height: 1.38; letter-spacing: 0; }
.feb28-chapter-heading > p:last-child { width: min(100%, 42em); margin: 0; color: var(--muted); font-family: var(--serif); font-size: 1.03rem; line-height: 2; }
.feb28-essay-deep .feb28-chapter-heading > p:last-child, .feb28-memory .feb28-chapter-heading > p:last-child { color: #c9c3b6; }
.feb28-essay-deep .section-number, .feb28-memory .section-number { color: #e08a6a; }
.feb28-prose { width: min(100%, 39em); margin-inline: auto; font-family: var(--serif); font-size: 1.08rem; line-height: 2.1; }
.feb28-prose p { margin: 0 0 1.1em; text-indent: 2em; }
.feb28-prose a { color: var(--rust-dark); text-underline-offset: 3px; }
.feb28-essay-deep .feb28-prose a, .feb28-memory .feb28-prose a { color: #f1b59e; }
.note-ref { margin-left: .12em; white-space: nowrap; font-family: var(--sans); font-size: .68em; font-weight: 800; text-decoration: none; vertical-align: super; }
.feb28-reading-note { width: min(100%, 39em); margin: 34px auto 0; padding: 22px 24px; border-left: 4px solid var(--moss); color: var(--ink-soft); background: rgba(255, 255, 255, .35); }
.feb28-reading-note b { font-family: var(--serif); }
.feb28-reading-note p { margin: 7px 0 0; font-size: .88rem; line-height: 1.9; }
.feb28-pullquote { width: min(100%, 39em); margin: 42px auto 0; padding: 26px 0 6px; border-top: 1px solid #646b60; color: #f0c1ae; font-family: var(--serif); font-size: 1.45rem; line-height: 1.8; }
.feb28-pullquote-light { color: #f4d3b9; }
.feb28-evidence-table { width: min(100%, 900px); margin: 54px auto 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.feb28-evidence-table [role="row"] { display: grid; grid-template-columns: 150px 1fr 1fr; }
.feb28-evidence-table [role="cell"], .feb28-evidence-table [role="columnheader"] { min-width: 0; padding: 13px 16px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.feb28-evidence-table [role="columnheader"] { font-family: var(--serif); background: var(--paper-deep); }
.feb28-evidence-table [role="cell"] { color: var(--ink-soft); font-size: .82rem; }
.feb28-bibliography { margin-top: 74px; padding-top: 34px; border-top: 2px solid var(--ink); }
.feb28-bibliography h3 { margin: 0 0 8px; font-family: var(--serif); font-size: 1.55rem; }
.feb28-bibliography > p { max-width: 760px; margin: 0; color: var(--muted); font-size: .83rem; }
.feb28-notes { margin: 28px 0 0; padding: 0; list-style: none; counter-reset: feb28-note; border-top: 1px solid var(--line); }
.feb28-notes li { counter-increment: feb28-note; padding: 16px 0 16px 48px; position: relative; border-bottom: 1px solid var(--line); color: var(--ink-soft); font-size: .86rem; line-height: 1.85; }
.feb28-notes li::before { content: counter(feb28-note, decimal-leading-zero); position: absolute; left: 0; top: 17px; color: var(--rust); font-weight: 800; }
.feb28-notes a { color: var(--rust-dark); text-underline-offset: 3px; }
.feb28-bibliography .feb28-revised { margin-top: 25px; padding-left: 14px; border-left: 2px solid var(--rust); }

.site-footer { padding: 30px 0 45px; display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid var(--line); color: var(--muted); font-size: .78rem; }
.site-footer p { margin: 0; }

dialog { margin: 0; max-width: none; max-height: none; border: 0; padding: 0; }
dialog::backdrop { background: rgba(12, 14, 12, .92); }
.photo-reader { width: 100vw; height: 100dvh; color: var(--paper); background: var(--ink); }
.reader-layout { height: 100%; display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(360px, .72fr); }
.reader-viewer { position: relative; min-width: 0; padding: 74px 34px 28px; display: grid; place-items: center; overflow: hidden; background: #141712; }
.reader-viewer > img { width: 100%; height: 100%; max-height: calc(100dvh - 104px); display: block; object-fit: contain; }
.reader-toolbar { position: absolute; z-index: 2; inset: 0 0 auto; height: 58px; padding: 8px 12px; display: flex; align-items: center; justify-content: space-between; color: var(--ink); background: var(--paper); border-bottom: 1px solid var(--line); }
.icon-button { width: 42px; height: 42px; padding: 0; border: 1px solid #9f947d; color: inherit; background: transparent; cursor: pointer; font-size: 1.25rem; line-height: 1; }
.icon-button:hover, .icon-button:focus-visible { color: white; border-color: var(--rust); background: var(--rust); }
.reader-count { color: var(--rust-dark); font-size: .76rem; font-weight: 800; letter-spacing: 0; }
.reader-arrows { display: flex; gap: 6px; }
.reader-copy { padding: 78px clamp(28px, 4vw, 66px) 50px; overflow: auto; color: #332c22; background: var(--paper); }
.reader-series { margin: 0; color: var(--rust); font-size: .75rem; font-weight: 800; }
.reader-copy h2 { margin: 14px 0 12px; font-family: var(--serif); font-size: 3.2rem; line-height: 1.25; }
.reader-meta { margin: 0 0 28px; color: var(--muted); font-size: .86rem; }
.reader-story { font-family: var(--serif); font-size: 1.06rem; line-height: 2; white-space: pre-line; }
.reader-facts { margin-top: 34px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: .82rem; }
.reader-facts p { margin: 7px 0; }
.reader-facts a { color: var(--rust-dark); text-underline-offset: 3px; }

.story-reader { width: min(1040px, calc(100vw - 48px)); height: min(900px, calc(100dvh - 48px)); margin: auto; overflow: auto; color: var(--ink); background: var(--paper-light); border: 1px solid var(--line); }
.story-reader-inner { position: relative; width: min(100% - 64px, 920px); min-height: 100%; margin-inline: auto; padding: 24px 0 80px; }
.story-close { position: sticky; z-index: 3; top: 14px; margin-left: auto; display: block; background: var(--paper-light); }
.story-reader-header { width: min(100%, 760px); margin-inline: auto; padding-top: 22px; }
.story-reader-header .story-year { color: var(--rust); font-size: .78rem; font-weight: 800; }
.story-reader-header h2 { margin: 12px 0 18px; font-family: var(--serif); font-size: 3.6rem; line-height: 1.2; letter-spacing: 0; }
.story-reader-header > p:last-child { color: var(--muted); font-family: var(--serif); font-size: 1.12rem; line-height: 1.9; }
.story-images { width: 100%; margin: 42px auto; display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 3px; background: var(--line); }
.story-image { min-width: 0; background: var(--paper-deep); }
.story-image img { width: 100%; height: 320px; display: block; object-fit: contain; background: #272922; }
.story-image p { min-height: 64px; margin: 0; padding: 10px 12px; color: var(--muted); background: var(--paper-light); font-size: .72rem; }
.story-body { width: min(100%, 760px); margin-inline: auto; font-family: var(--serif); font-size: 1.1rem; line-height: 2.1; }
.story-body p { margin: 0 0 1.4em; }
.story-sources { width: min(100%, 760px); margin: 45px auto 0; padding-top: 24px; border-top: 1px solid var(--line); }
.story-sources h3 { margin: 0 0 12px; font-size: .82rem; letter-spacing: 0; }
.story-sources a { display: block; width: max-content; max-width: 100%; margin: 7px 0; color: var(--rust-dark); font-size: .82rem; text-underline-offset: 3px; }

@media (max-width: 1120px) {
  .archive-total { display: none; }
  .site-header { grid-template-columns: 1fr auto; }
  .contact-grid { grid-template-columns: 1.3fr 1fr 1fr; }
  .contact-item:nth-child(4), .contact-item:nth-child(5) { min-height: 230px; }
  .photo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .era-rail { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .story-index-item { grid-template-columns: 58px 110px minmax(230px, 1fr) 1fr 30px; }
  .story-index-item img { width: 110px; }
  .feb28-intro { grid-template-columns: minmax(0, 1fr) minmax(290px, 390px); gap: 55px; }
  .feb28-intro h1 { font-size: 4.2rem; }
  .feb28-scene { grid-template-columns: 1fr; gap: 30px; }
  .feb28-scene:nth-child(even) .feb28-scene-images { order: initial; }
  .feb28-people { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {
  .page-width { width: min(100% - 36px, var(--page)); }
  .site-header { min-height: 68px; padding: 0 18px; }
  .brand-mark { display: none; }
  .brand small { display: none; }
  .site-nav a { min-width: 76px; padding: 0 9px; font-size: .82rem; }
  .home-intro { min-height: auto; padding: 58px 0 48px; grid-template-columns: 1fr; gap: 36px; }
  .home-title h1 { font-size: 4.5rem; }
  .page-intro h1 { font-size: 4rem; }
  .archive-intro { min-height: auto; padding: 48px 0 34px; grid-template-columns: 1fr; gap: 20px; }
  .archive-intro h1 { font-size: 3.6rem; }
  .archive-intro > p { max-width: 620px; }
  .archive-filter-panel > summary {
    min-height: 68px;
    padding: 12px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    cursor: pointer;
    list-style: none;
    font-family: var(--serif);
    font-weight: 700;
  }
  .archive-filter-panel > summary::-webkit-details-marker { display: none; }
  .archive-filter-panel > summary::after { content: "+"; flex: none; color: var(--rust-dark); font-family: var(--sans); font-size: 1.25rem; font-weight: 400; }
  .archive-filter-panel[open] > summary::after { content: "−"; }
  .archive-filter-panel > summary small { margin-inline-start: auto; color: var(--muted); font-family: var(--sans); font-size: .72rem; font-weight: 400; }
  .archive-filter-panel[open] > summary { border-bottom: 1px solid var(--line); }
  .archive-filter-content { padding: 22px 0 28px; }
  .archive-filter-fields { grid-template-columns: 1fr 1fr; }
  .archive-field:last-child { grid-column: 1 / -1; }
  .section-heading h2 { font-size: 2.2rem; }
  .home-lede { max-width: 620px; }
  .contact-grid { grid-template-columns: 1fr 1fr; }
  .contact-item { min-height: 240px; }
  .contact-item:first-child { grid-column: 1 / -1; min-height: 360px; }
  .section-heading { align-items: start; flex-direction: column; gap: 12px; }
  .section-heading > div { display: block; }
  .section-number { margin-bottom: 8px; }
  .era-rail { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .story-preview-item { grid-template-columns: 105px 1fr 32px; }
  .story-preview-item img { width: 105px; height: 68px; }
  .story-preview-item > p { display: none; }
  .photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 12px; }
  .stories-intro { grid-template-columns: 1fr; gap: 28px; }
  .story-index-item { grid-template-columns: 36px 92px minmax(0, 1fr) 28px; gap: 13px; }
  .story-index-item img { width: 92px; height: 72px; }
  .story-index-item > p { display: none; }
  .feb28-intro { min-height: auto; padding-block: 62px 54px; display: block; }
  .feb28-intro .kicker { margin-bottom: 26px; }
  .feb28-date { margin-bottom: 10px; }
  .feb28-intro h1 { max-width: 680px; font-size: 3.65rem; }
  .feb28-lede { max-width: 650px; margin-top: 34px; }
  .feb28-toc { top: 68px; }
  .feb28-toc .page-width { min-width: calc(100% - 36px); }
  .feb28-method-inner { grid-template-columns: 1fr; gap: 15px; }
  .feb28-section, .feb28-scenes, .feb28-documents { padding-block: 64px; }
  .feb28-essay { padding-block: 70px; }
  .feb28-chapter-heading h2 { font-size: 2.35rem; }
  .feb28-timeline li { grid-template-columns: 140px minmax(0, 1fr); gap: 28px; }
  .feb28-scene-images { grid-template-columns: 1.2fr .8fr; }
  .feb28-scene img { height: 310px; }
  .feb28-documents-grid { grid-template-columns: 1fr; gap: 38px; }
  .feb28-documents .feb28-section-heading { position: static; }
  .feb28-document-images img { height: 560px; }
  .feb28-source-grid { grid-template-columns: 1fr; }
  .reader-layout { height: auto; min-height: 100%; grid-template-columns: 1fr; }
  .photo-reader { overflow-y: auto; }
  .reader-viewer { min-height: 72dvh; padding: 68px 12px 16px; }
  .reader-viewer > img { max-height: calc(72dvh - 84px); }
  .reader-copy { overflow: visible; padding: 34px 24px 58px; }
  .reader-copy h2 { font-size: 2.8rem; }
  .story-images { grid-template-columns: 1fr; }
  .story-image img { height: min(62vw, 410px); }
  .story-reader-header h2 { font-size: 2.8rem; }
}

@media (max-width: 560px) {
  .site-header { min-height: 62px; padding: 0 8px; grid-template-columns: 1fr; }
  .brand { display: none; }
  .site-nav { width: 100%; justify-content: stretch; }
  .site-nav a { min-width: 0; padding: 0 5px; flex: 1; font-size: .8rem; border: 0; }
  .site-nav a:last-child { border: 0; }
  .home-title h1 { font-size: 3rem; }
  .page-intro h1 { font-size: 3.1rem; }
  .archive-intro { padding: 40px 0 27px; gap: 13px; }
  .archive-intro h1 { font-size: 2.9rem; }
  .archive-intro > p { margin-bottom: 0; font-size: .94rem; line-height: 1.9; }
  .archive-filter-panel > summary { min-height: 62px; }
  .archive-filter-panel > summary small { max-width: 165px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .archive-filter-fields { grid-template-columns: 1fr; }
  .archive-field:last-child { grid-column: auto; }
  .archive-summary { padding-top: 24px; }
  .archive-summary h2 { font-size: 1.65rem; }
  .section-heading h2 { font-size: 1.9rem; }
  .home-lede { padding-left: 16px; }
  .contact-strip { padding-top: 44px; }
  .contact-grid { grid-template-columns: 1fr 1fr; }
  .contact-item, .contact-item:nth-child(4), .contact-item:nth-child(5) { min-height: 180px; }
  .contact-item:first-child { min-height: 280px; }
  .era-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .era-link { min-height: 94px; padding: 13px; }
  .source-note { grid-template-columns: 1fr; gap: 14px; }
  .archive-summary { align-items: start; flex-direction: column; gap: 3px; }
  .photo-grid { grid-template-columns: 1fr; gap: 42px; }
  .photo-card-title { font-size: 1.12rem; }
  .story-preview-item { grid-template-columns: 82px 1fr 24px; gap: 12px; }
  .story-preview-item img { width: 82px; height: 62px; }
  .story-preview-item b { font-size: 1rem; }
  .story-index-item { grid-template-columns: 28px 74px minmax(0, 1fr); padding: 18px 0; }
  .story-index-item img { width: 74px; height: 62px; }
  .story-index-item > span:last-child { display: none; }
  .story-index-item h2 { font-size: 1rem; }
  .feb28-page { padding-bottom: 76px; }
  .feb28-intro { padding-block: 48px 44px; }
  .feb28-intro h1 { font-size: 2.7rem; }
  .feb28-lede { padding-left: 16px; font-size: 1rem; }
  .feb28-toc { top: 62px; }
  .feb28-toc .page-width { min-width: calc(100% - 16px); }
  .feb28-toc a { min-height: 44px; padding-inline: 11px; font-size: .74rem; }
  .feb28-section-heading h2, .feb28-limits h2 { font-size: 2rem; }
  .feb28-chapter-heading { margin-bottom: 30px; }
  .feb28-chapter-heading h2 { font-size: 2rem; }
  .feb28-chapter-heading > p:last-child { font-size: 1rem; }
  .feb28-prose { font-size: 1rem; line-height: 2; }
  .feb28-prose p { margin-bottom: 1.15em; text-indent: 2em; }
  .feb28-pullquote { font-size: 1.2rem; }
  .feb28-timeline li { padding-block: 24px; grid-template-columns: 1fr; gap: 6px; }
  .feb28-timeline .is-pivotal::before { inset-inline-start: -10px; }
  .feb28-scene { padding-block: 34px; }
  .feb28-scene-images { grid-template-columns: 1fr; }
  .feb28-scene img { height: 260px; }
  .feb28-scene h3, .feb28-people h3 { font-size: 1.35rem; }
  .feb28-people article { grid-template-columns: 104px minmax(0, 1fr); gap: 16px; }
  .feb28-people img { width: 104px; height: 148px; }
  .feb28-document-images { grid-template-columns: 1fr; }
  .feb28-document-images img { height: 530px; }
  .reader-copy h2 { font-size: 2.2rem; }
  .feb28-evidence-table [role="row"] { grid-template-columns: 1fr; }
  .feb28-evidence-table [role="cell"], .feb28-evidence-table [role="columnheader"] { padding: 10px 12px; }
  .feb28-evidence-table [role="row"]:not(:first-child) [role="cell"]:first-child { color: var(--rust-dark); font-weight: 800; background: rgba(216, 204, 180, .3); }
  .feb28-notes li { padding-left: 38px; font-size: .82rem; }
  .story-reader { width: 100vw; height: 100dvh; border: 0; }
  .story-reader-inner { width: calc(100% - 36px); padding: 14px 0 58px; }
  .story-reader-header { padding-top: 16px; }
  .story-reader-header h2 { font-size: 2.25rem; }
  .story-reader-header > p:last-child { font-size: 1rem; }
  .site-footer { flex-direction: column; }
}

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