:root {
  --forest: #1d1d1f;
  --forest-deep: #111113;
  --jade: #7d2c27;
  --cinnabar: #af0900;
  --button-red: #af0900;
  --button-red-hover: #8b0902;
  --button-red-soft: #fff1ef;
  --button-red-line: #dea7a2;
  --gold: #d8b36a;
  --gold-soft: #f0d6a5;
  --dark-surface: #111113;
  --dark-link: #ff9a91;
  --paper: #f5f5f7;
  --cream: #ffffff;
  --ink: #1d1d1f;
  --muted: #6e6e73;
  --line: rgba(0, 0, 0, .09);
  --shadow: 0 18px 55px rgba(0, 0, 0, .09);
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif;
  --serif: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.portal-page { margin: 0; min-width: 320px; color: var(--ink); background: var(--paper); font-family: var(--sans); line-height: 1.5; letter-spacing: -.012em; -webkit-font-smoothing: antialiased; }
body.portal-page a { color: inherit; }
img { max-width: 100%; }
.skip-link { position: fixed; z-index: 9999; top: 8px; left: 8px; transform: translateY(-150%); padding: 10px 16px; background: white; color: var(--ink); border-radius: 6px; }
.skip-link:focus { transform: none; }

.portal-header {
  position: fixed;
  z-index: 2000;
  inset: 0 0 auto;
  color: white;
  background: linear-gradient(180deg, rgba(0, 0, 0, .5), rgba(0,0,0,.08));
  border-bottom: 1px solid transparent;
  transition: background .35s ease, border-color .35s ease, box-shadow .35s ease;
}
.portal-header.is-scrolled {
  background: rgba(22, 22, 23, .78);
  border-bottom-color: rgba(255,255,255,.15);
  box-shadow: 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter: blur(24px) saturate(160%);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
}
.portal-nav { width: min(1480px, 100%); min-height: 82px; margin: auto; padding: 15px clamp(18px, 4vw, 58px) 10px; display: flex; align-items: center; gap: 28px; }
.portal-brand { margin-right: auto; display: flex; align-items: center; gap: 13px; color: white !important; text-decoration: none; }
.portal-brand img { width: 124px; height: 50px; object-fit: contain; filter: brightness(0) invert(1); }
body.home-page .portal-brand img { filter: none; }
.portal-brand span { display: grid; font: 650 1.05rem/1.05 var(--sans); letter-spacing: -.02em; }
.portal-brand small { margin-top: 4px; color: rgba(255,255,255,.6); font: 700 .65rem/1 var(--sans); letter-spacing: .13em; text-transform: uppercase; }
.portal-menu { display: flex; align-items: center; gap: 3px; }
.portal-menu a, .language-button { position: relative; min-height: 38px; padding: 0 14px; display: inline-flex; align-items: center; border: 0; border-radius: 999px; background: transparent; color: rgba(255,255,255,.8); font: 650 .86rem var(--sans); text-decoration: none; cursor: pointer; transition: color .2s ease, background .2s ease, transform .2s ease, border-color .2s ease; }
.portal-menu a:hover, .portal-menu a[aria-current="page"], .language-button:hover { color: white; background: rgba(255,255,255,.11); transform: translateY(-1px); }
.language-wrap { position: relative; }
.language-button { border: 1px solid var(--button-red-line); }
.language-popover { position: absolute; right: 0; top: calc(100% + 10px); width: 185px; padding: 8px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.94); color: var(--ink); box-shadow: var(--shadow); backdrop-filter: blur(20px); }
.language-popover[hidden] { display: none; }
.language-popover a { display: block; padding: 9px 11px; border-radius: 9px; color: var(--ink); text-decoration: none; font-size: .8rem; }
.language-popover a:hover { background: var(--paper); }
.language-popover button { display: block; width: 100%; padding: 9px 11px; border: 0; border-radius: 9px; background: transparent; color: var(--ink); text-align: left; font-size: .8rem; cursor: pointer; }
.language-popover button:hover { background: var(--paper); }
.language-popover button[aria-pressed="true"] { background: var(--paper); font-weight: 700; }
.menu-toggle { display: none; border: 1px solid var(--button-red-line); background: rgba(175,9,0,.18); color: white; border-radius: 999px; padding: 9px 13px; }
.menu-toggle:hover, .menu-toggle[aria-expanded="true"] { background: var(--button-red); border-color: var(--button-red); }

/* Adaptive light navigation for editorial and map pages. */
body:is(.portal-page, .place-page) .portal-header {
  color: var(--ink);
  background: rgba(250,250,252,.4);
  border-bottom-color: rgba(255,255,255,.56);
  box-shadow: 0 1px 0 rgba(0,0,0,.05), 0 8px 30px rgba(0,0,0,.035);
  backdrop-filter: blur(28px) saturate(190%);
  -webkit-backdrop-filter: blur(28px) saturate(190%);
}
body.home-page .portal-header:not(.is-scrolled) {
  background: transparent;
  border-bottom-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.home-page .portal-header:not(.is-scrolled) .portal-brand { color: white !important; }
body.home-page .portal-header:not(.is-scrolled) .portal-brand small { color: rgba(255,255,255,.68); }
body.home-page .portal-header:not(.is-scrolled) .portal-menu > a,
body.home-page .portal-header:not(.is-scrolled) .language-button { color: rgba(255,255,255,.9); }
body.home-page .portal-header:not(.is-scrolled) .portal-menu > a:hover,
body.home-page .portal-header:not(.is-scrolled) .portal-menu > a[aria-current="page"],
body.home-page .portal-header:not(.is-scrolled) .language-button:hover {
  color: white;
  background: rgba(255,255,255,.14);
}
body.home-page .portal-header:not(.is-scrolled) .language-button {
  border-color: rgba(255,255,255,.48);
}
body.home-page .portal-header:not(.is-scrolled) .menu-toggle {
  color: white;
  border-color: rgba(255,255,255,.48);
  background: rgba(255,255,255,.12);
}
body.home-page .portal-header.is-scrolled {
  border-bottom-color: rgba(255,255,255,.2);
  box-shadow: 0 10px 30px rgba(0,0,0,.045);
}
body.home-page .portal-header.is-scrolled::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  right: 0;
  top: 100%;
  height: 22px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(250,250,252,.16), rgba(250,250,252,0));
}
body.home-page .portal-nav { position: relative; z-index: 1; }
body:is(.portal-page, .place-page) .portal-brand { color: var(--ink) !important; }
body:is(.portal-page, .place-page) .portal-brand img { filter: none; }
body:is(.portal-page, .place-page) .portal-brand small { color: #6e6e73; }
body:is(.portal-page, .place-page) .portal-menu > a,
body:is(.portal-page, .place-page) .language-button { color: #424245; }
body:is(.portal-page, .place-page) .portal-menu > a:hover,
body:is(.portal-page, .place-page) .portal-menu > a[aria-current="page"] {
  color: var(--button-red-hover);
  background: var(--button-red-soft);
}
body:is(.portal-page, .place-page) .language-button { border-color: var(--button-red-line); }
body:is(.portal-page, .place-page) .language-button:hover {
  color: var(--button-red-hover);
  background: var(--button-red-soft);
  border-color: var(--button-red);
}
body:is(.portal-page, .place-page) .menu-toggle {
  color: var(--button-red-hover);
  border-color: var(--button-red-line);
  background: var(--button-red-soft);
}
body:is(.portal-page, .place-page) .menu-toggle:hover,
body:is(.portal-page, .place-page) .menu-toggle[aria-expanded="true"] {
  color: white;
  background: var(--button-red);
  border-color: var(--button-red);
}

.portal-main { overflow: hidden; }
.portal-hero { position: relative; min-height: min(860px, 92vh); display: grid; place-items: center; color: white; background: var(--forest-deep); isolation: isolate; }
.portal-hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(0,0,0,.32), rgba(0,0,0,.7)), url("../images/heritage/era-arrival.jpg") center 42%/cover; transform: scale(1.015); animation: hero-breathe 18s ease-in-out infinite alternate; }
.portal-hero::after { content: "維"; position: absolute; z-index: -1; top: 5%; right: 3%; color: rgba(255,255,255,.065); font: 700 min(38vw, 34rem)/1 var(--serif); }
@keyframes hero-breathe { to { transform: scale(1.065); } }
.hero-copy { width: min(1120px, 100%); margin: auto; padding: clamp(110px, 16vh, 170px) clamp(22px, 6vw, 88px) clamp(80px, 11vh, 120px); text-align: center; }
.eyebrow { display: flex; align-items: center; justify-content: center; gap: 12px; color: var(--gold-soft); font-size: .68rem; font-weight: 750; letter-spacing: .16em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 36px; height: 1px; background: currentColor; }
.portal-hero h1 { max-width: 1050px; margin: 22px auto; font: 700 clamp(3.6rem, 8.4vw, 8rem)/.9 var(--sans); letter-spacing: -.065em; }
.portal-hero h1 span { display: block; color: var(--gold-soft); font-style: normal; }
.hero-copy > p { max-width: 730px; margin: 25px auto 34px; color: rgba(255,255,255,.78); font-size: clamp(1.02rem, 1.5vw, 1.3rem); }
.button-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.button { min-height: 48px; padding: 0 22px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--button-red); border-radius: 999px; color: white; background: var(--button-red); box-shadow: 0 8px 22px rgba(139,9,2,.22); text-decoration: none; font-size: .8rem; font-weight: 800; transition: background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.button--light { color: white; background: var(--button-red); border-color: var(--button-red); }
.button:hover { color: white; background: var(--button-red-hover); border-color: var(--button-red-hover); box-shadow: 0 11px 27px rgba(139,9,2,.3); transform: translateY(-2px); }

.section { width: min(1320px, calc(100% - 40px)); margin: auto; padding: clamp(88px, 10vw, 150px) 0; }
.section-kicker { color: var(--cinnabar); font-size: .68rem; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.section-title { max-width: 940px; margin: 12px 0 24px; font: 700 clamp(2.35rem, 5vw, 5rem)/.98 var(--sans); letter-spacing: -.055em; }
.section-intro { max-width: 730px; color: var(--muted); font-size: 1.04rem; }
.history-grid { margin-top: 54px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; border: 0; }
.history-card { position: relative; min-height: 280px; padding: 26px; border: 0; border-radius: 24px; background: white; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.history-card + .history-card { padding-left: 26px; }
.history-card time { color: var(--cinnabar); font-size: .72rem; font-weight: 850; }
.history-card h3 { margin: 16px 0 10px; font: 650 1.3rem/1.15 var(--sans); letter-spacing: -.025em; }
.history-card p { color: var(--muted); font-size: .84rem; line-height: 1.65; }

.map-feature { width: min(1380px, calc(100% - 32px)); margin: 0 auto; padding: clamp(28px, 4vw, 58px); display: grid; grid-template-columns: minmax(260px, .72fr) minmax(480px, 1.28fr); gap: clamp(36px, 6vw, 90px); align-items: center; color: white; border-radius: 30px; background: var(--dark-surface); box-shadow: var(--shadow); }
.map-feature .section-kicker { color: var(--gold-soft); }
.map-feature h2 { margin: 12px 0 20px; font: 700 clamp(2.4rem, 4.5vw, 4.6rem)/.98 var(--sans); letter-spacing: -.055em; }
.map-feature p { color: rgba(255,255,255,.7); }
.map-frame { padding: 7px; border-radius: 24px; background: rgba(255,255,255,.1); transform: none; }
.map-frame img { display: block; width: 100%; border-radius: 18px; }
.tiny-note { margin-top: 14px; color: rgba(255,255,255,.55); font-size: .7rem; }

.stories-preview { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(44px, 8vw, 120px); align-items: start; }
.stat-stack { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.stat { min-height: 160px; padding: 28px; border: 0; border-radius: 24px; background: white; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.stat strong { display: block; color: var(--button-red-hover); font: 650 clamp(2rem, 4vw, 3.4rem)/1 var(--sans); letter-spacing: -.045em; }
.stat span { display: block; margin-top: 9px; color: var(--muted); font-size: .78rem; }

.page-hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  color: var(--ink);
  border: 0;
  background:
    radial-gradient(circle at 50% 50%, rgba(175, 9, 0, 0.065), transparent 30rem),
    #f7f5f5;
}
.page-hero__inner { position: relative; z-index: 1; width: min(1180px, calc(100% - 40px)); min-height: 520px; margin: auto; padding: 118px 0 80px; display: grid; align-content: center; justify-items: center; text-align: center; background: none; }
.page-hero h1 { max-width: 1050px; margin: 16px 0; font: 700 clamp(3.2rem, 8vw, 7.4rem)/.92 var(--sans); letter-spacing: -.065em; }
.page-hero p { max-width: 720px; color: var(--muted); font-size: 1.1rem; }
.page-hero .eyebrow { color: var(--button-red); }
body.people-page main {
  background-color: #f7f5f5;
  background-image: radial-gradient(circle at 50% 50%, rgba(175, 9, 0, 0.065), transparent 30rem);
  background-size: 100% 700px;
  background-repeat: repeat-y;
}
body.people-page .page-hero,
body.people-page .record-cloud { background: transparent; }
.content-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 20px; }
.person-card, .story-card { overflow: hidden; border: 0; border-radius: 28px; background: white; box-shadow: 0 8px 30px rgba(0,0,0,.07); }
.person-card { grid-column: span 4; }
.person-card--wide { grid-column: span 6; }
.person-card img { width: 100%; aspect-ratio: 1.45; display: block; object-fit: cover; filter: saturate(.9) contrast(1.02); }
.person-card__body { padding: 25px; }
.person-card h2, .story-card h2 { margin: 4px 0 10px; font: 650 1.65rem/1.08 var(--sans); letter-spacing: -.035em; }
.meta { color: var(--cinnabar); font-size: .67rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.person-card p, .story-card p { color: var(--muted); font-size: .88rem; }
.person-card, .story-card, .history-card, .stat { transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease; }
.person-card:hover, .story-card:hover, .history-card:hover, .stat:hover { transform: translateY(-4px); box-shadow: 0 16px 42px rgba(0,0,0,.1); }
.text-link { color: var(--cinnabar) !important; font-size: .76rem; font-weight: 800; text-decoration: none; }
.record-cloud {
  position: relative;
  overflow: hidden;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  padding: clamp(36px, 5vw, 72px) clamp(16px, 3vw, 52px);
  color: var(--ink);
  border: 0;
  border-radius: 0;
  background:
    radial-gradient(circle at 50% 8%, rgba(175,9,0,.09), transparent 38rem),
    radial-gradient(circle, rgba(175,9,0,.075) 1px, transparent 1.5px),
    #f7f5f5;
  background-size: auto, 18px 18px, auto;
  box-shadow: none;
}
.record-cloud h2 { margin: 8px 0 12px; font: 700 clamp(2rem, 4vw, 4rem)/1 var(--sans); letter-spacing: -.05em; }
.record-summary { margin: 18px 0 0; color: var(--muted); font: 700 .76rem var(--sans); letter-spacing: .04em; text-transform: uppercase; }
.record-error { color: var(--button-red-hover); }
.record-error a { color: inherit; }
.name-list { margin: 32px 0 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; list-style: none; background: transparent; }
.name-list li { min-width: 0; padding: 15px 16px; border: 1px solid rgba(175,9,0,.1); border-radius: 14px; background: rgba(255,255,255,.76); box-shadow: 0 2px 10px rgba(34,25,23,.035); transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease; }
.name-list li:hover { border-color: rgba(175,9,0,.3); background: white; box-shadow: 0 8px 22px rgba(34,25,23,.08); transform: translateY(-2px); }
.name-list a { display: block; color: inherit; text-decoration: none; }
.name-list a:hover strong { color: var(--button-red-hover); }
.name-list strong { display: block; color: var(--ink); font: 650 .94rem var(--sans); overflow-wrap: anywhere; }
.name-list span { display: block; margin-top: 4px; color: var(--muted); font-size: .82rem; overflow-wrap: anywhere; }
.name-list .death-year { color: var(--red); font: 700 .72rem var(--sans); letter-spacing: .045em; text-transform: uppercase; }
.record-details-link { color: var(--button-red-hover); font-weight: 800; }
.evidence-note { margin-top: 26px; padding-top: 20px; color: var(--muted); border-top: 1px solid rgba(175,9,0,.13); font-size: .78rem; }

.cemetery-records { display: grid; gap: 18px; margin-top: 36px; }
.cemetery-record { padding: clamp(22px, 4vw, 38px); border: 1px solid var(--line); border-radius: 20px; background: white; scroll-margin-top: 110px; }
.cemetery-record h2 { margin: 0 0 24px; font: 700 clamp(1.35rem, 2vw, 2rem)/1.1 var(--sans); letter-spacing: -.03em; }
.cemetery-record dl { display: grid; grid-template-columns: minmax(150px, 220px) 1fr; margin: 0; }
.cemetery-record dt, .cemetery-record dd { margin: 0; padding: 10px 0; border-top: 1px solid var(--line); }
.cemetery-record dt { padding-right: 20px; color: var(--muted); font: 750 .72rem var(--sans); letter-spacing: .04em; text-transform: uppercase; }
.cemetery-record dd { overflow-wrap: anywhere; }
.cemetery-record:target { border-color: var(--cinnabar); box-shadow: 0 0 0 3px var(--button-red-soft); }

.methodology-list { margin-top: 36px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.methodology-list > div { padding: 24px 26px; border: 1px solid rgba(175,9,0,.1); border-radius: 20px; background: rgba(255,255,255,.78); }
.methodology-list code, .methodology-code { font: 500 .82rem/1.5 ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace; }
.methodology-list p { margin: 8px 0 0; color: var(--muted); font-size: .84rem; line-height: 1.6; }
.methodology-notes { margin: 26px 0 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.methodology-notes li { position: relative; padding: 16px 20px 16px 46px; border: 1px solid var(--line); border-radius: 16px; color: var(--muted); font-size: .86rem; line-height: 1.65; }
.methodology-notes li::before { content: '→'; position: absolute; left: 18px; color: var(--button-red); font-weight: 800; }
.methodology-code { margin: 24px 0 0; padding: 20px 24px; border-radius: 16px; color: #e8e8ed; background: #1d1d1f; overflow-x: auto; }
.section .methodology-code + .section-intro { margin-top: 22px; }

.story-list { display: grid; gap: 18px; }
.story-card { display: grid; grid-template-columns: 210px 1fr; }
.story-date { padding: 28px; color: var(--button-red-hover); background: var(--button-red-soft); font: 650 2.2rem/1 var(--sans); letter-spacing: -.04em; }
.story-date small { display: block; margin-top: 10px; font: 800 .62rem var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.story-card__body { padding: 28px; }

.portal-form { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.field { display: grid; gap: 7px; }
.field--full { grid-column: 1 / -1; }
.field label, .field legend { font-size: .76rem; font-weight: 800; }
.field input, .field select, .field textarea { width: 100%; padding: 15px 16px; color: var(--ink); border: 1px solid rgba(0,0,0,.14); border-radius: 13px; background: white; font: inherit; transition: border-color .2s ease, box-shadow .2s ease; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--button-red); box-shadow: 0 0 0 4px rgba(175,9,0,.1); }
.field textarea { min-height: 150px; resize: vertical; }
.form-actions { grid-column: 1 / -1; display: flex; align-items: center; gap: 16px; }
.submit-button { padding: 14px 22px; border: 1px solid var(--button-red); border-radius: 999px; color: white; background: var(--button-red); box-shadow: 0 8px 22px rgba(139,9,2,.2); font-weight: 800; cursor: pointer; transition: background .2s ease, border-color .2s ease, transform .2s ease; }
.submit-button:hover { background: var(--button-red-hover); border-color: var(--button-red-hover); transform: translateY(-1px); }
.form-status { color: var(--muted); font-size: .8rem; }
.portal-side { padding: 32px; border: 1px solid var(--line); border-radius: 24px; background: white; box-shadow: 0 8px 30px rgba(0,0,0,.05); }
.research-method { border-top: 1px solid rgba(175,9,0,.1); scroll-margin-top: 90px; }
.research-principles { margin-top: 42px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.research-principles article { padding: clamp(24px, 3vw, 34px); border: 1px solid rgba(175,9,0,.1); border-radius: 22px; background: rgba(255,255,255,.78); }
.research-principles h3 { margin: 0 0 10px; font-size: 1.15rem; letter-spacing: -.025em; }
.research-principles p { margin: 0; color: var(--muted); font-size: .86rem; line-height: 1.65; }
.research-source-groups { margin-top: clamp(50px, 7vw, 82px); }
.research-source-groups > h3 { margin: 0 0 24px; font-size: clamp(1.7rem, 3vw, 2.7rem); letter-spacing: -.045em; }
.research-source-groups > section { padding: 22px 0; display: grid; grid-template-columns: minmax(190px, .28fr) 1fr; gap: 30px; border-top: 1px solid var(--line); }
.research-source-groups h4 { margin: 3px 0 0; color: var(--button-red-hover); font-size: .72rem; letter-spacing: .1em; line-height: 1.4; text-transform: uppercase; }
.research-source-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 20px; }
.research-source-list a { padding: 4px 0 8px; border-bottom: 1px solid rgba(0,0,0,.08); color: var(--ink); font-size: .8rem; font-weight: 650; line-height: 1.35; text-decoration: none; }
.research-source-list a:hover { color: var(--button-red-hover); border-bottom-color: var(--button-red-line); }

.donation-layout { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr); gap: clamp(42px, 7vw, 100px); align-items: start; }
.support-grid { margin-top: 48px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.support-grid article { min-height: 210px; padding: 28px; border-radius: 24px; background: white; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.support-grid article > span { color: var(--button-red); font-size: .68rem; font-weight: 800; letter-spacing: .12em; }
.support-grid h3 { margin: 36px 0 10px; font-size: 1.25rem; line-height: 1.12; letter-spacing: -.035em; }
.support-grid p { margin: 0; color: var(--muted); font-size: .84rem; }
.donation-card { position: sticky; top: 88px; padding: clamp(28px, 4vw, 44px); border-radius: 28px; background: white; box-shadow: 0 14px 45px rgba(0,0,0,.09); }
.donation-card h2 { margin: 12px 0; font-size: clamp(2rem, 3.4vw, 3.4rem); line-height: .98; letter-spacing: -.055em; }
.donation-card > p { color: var(--muted); }
.bank-details { margin: 30px 0; border-top: 1px solid var(--line); }
.bank-details div { padding: 16px 0; display: grid; grid-template-columns: minmax(110px, .42fr) 1fr; gap: 18px; border-bottom: 1px solid var(--line); }
.bank-details dt { color: var(--muted); font-size: .72rem; font-weight: 700; }
.bank-details dd { margin: 0; font-size: .86rem; font-weight: 700; overflow-wrap: anywhere; }
.official-note { padding: 16px 18px; border-radius: 16px; color: #5f1410; background: var(--button-red-soft); font-size: .78rem; line-height: 1.5; }
.official-note strong { display: block; margin-bottom: 3px; }
.donation-actions { margin-top: 22px; justify-content: flex-start; align-items: center; }
.donation-followup { margin: 20px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font-size: .72rem; line-height: 1.55; }

.portal-footer { width: 100%; max-width: none; margin: 0; padding: 0; border: 0; color: rgba(255,255,255,.66); background: #1d1d1f; }
.portal-footer__inner { width: min(1380px, calc(100% - 40px)); margin: auto; padding: 58px 0; display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; }
.portal-footer img { width: 140px; filter: brightness(0) invert(1); }
.portal-footer h2 { margin: 10px 0 6px; color: var(--dark-link); font: 500 1.45rem var(--serif); }
.footer-disclaimer { display: grid; gap: 13px; font-size: .75rem; }
.footer-links { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 15px; }
.footer-links a { color: white; font-size: .72rem; font-weight: 800; text-decoration: none; }
.portal-footer--research { background: var(--dark-surface); }
.portal-footer--research .footer-brand img { width: 170px; padding: 0; border-radius: 0; background: transparent; filter: brightness(0) invert(1); }
.portal-footer--research .portal-footer__inner { padding: clamp(34px, 4vw, 52px) 0 22px; grid-template-columns: minmax(250px, 1.15fr) minmax(150px, .55fr) minmax(180px, .65fr); column-gap: clamp(30px, 5vw, 76px); row-gap: 12px; align-items: start; }
.footer-brand p { max-width: 32ch; margin: 0; line-height: 1.3; }
.footer-organisation { display: inline-block; margin-top: 8px; color: white; font-size: .74rem; font-weight: 800; text-decoration: none; }
.footer-section { display: grid; align-content: start; gap: 8px; }
.portal-footer .footer-section h3 { margin: 3px 0 6px; color: white; font: 800 .68rem var(--sans); letter-spacing: .13em; text-transform: uppercase; }
.footer-section > a { color: rgba(255,255,255,.72); font-size: .78rem; line-height: 1.4; text-decoration: none; transition: color .2s ease; }
.footer-section > a:hover, .footer-organisation:hover, .footer-links a:hover { color: var(--dark-link); }
.footer-bottom { grid-column: 1 / -1; padding-top: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 36px; border-top: 1px solid rgba(255,255,255,.12); font-size: .7rem; line-height: 1.5; }
.footer-bottom p { margin: 0; }
.footer-bottom .footer-links { grid-column: 1 / -1; margin-top: 2px; }

body.research-app > .portal-header + .page-shell { padding-top: 0; }
body.research-app .language-switch { display: none; }
body.research-app .learning-hero { padding-top: 48px; }
body.place-page .history-overview,
body.place-page .section-divider,
body.place-page .era-path,
body.place-page .contemporary-section { display: none; }
body.research-app.place-page > .page-shell { padding-top: 82px; }
body.place-page .map-intro { padding-top: clamp(28px, 4vw, 48px); }
body.place-page .map-intro {
  grid-template-columns: minmax(0, 1fr) minmax(340px, .52fr);
  gap: clamp(34px, 6vw, 88px);
  align-items: end;
}
body.place-page .map-intro__label {
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.places-intro__aside { display: grid; gap: 22px; }
.places-summary {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid rgba(0,0,0,.12);
}
.places-summary div { min-width: 0; padding: 14px 10px 0 0; }
.places-summary dt {
  color: var(--button-red-hover);
  font: 650 clamp(1.25rem, 2vw, 1.75rem)/1 var(--sans);
  letter-spacing: -.035em;
}
.places-summary dd {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: .66rem;
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: .06em;
}
body.place-page .explorer,
body.place-page .explorer.has-detail {
  border-radius: 24px;
  box-shadow: 0 20px 55px rgba(34,25,23,.12), 0 2px 8px rgba(34,25,23,.06);
}
body.place-page .explorer-toolbar {
  background: rgba(255,255,255,.985);
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
}
body.place-page :where(button, input, select, a):focus-visible {
  outline: 3px solid rgba(175,9,0,.3);
  outline-offset: 2px;
}
body.place-page .results-list { scrollbar-color: rgba(139,9,2,.28) transparent; }
body.place-page .map-actions { box-shadow: 0 12px 28px rgba(30,24,22,.13); }
body.place-page .route-map-key {
  border-color: rgba(175,9,0,.14);
  box-shadow: 0 12px 30px rgba(30,24,22,.12);
}
body.place-page :where(.tool-button, .map-action, .detail-close, #retry-map) {
  border-color: var(--button-red-line);
  background: var(--button-red-soft);
  color: var(--button-red-hover);
}
body.place-page :where(.tool-button, .map-action, .detail-close, #retry-map):hover,
body.place-page :where(.tool-button, .map-action)[aria-pressed="true"],
body.place-page .tool-button[aria-expanded="true"] {
  border-color: var(--button-red);
  background: var(--button-red);
  color: white;
}
body.place-page .timeline-arrow {
  border-color: var(--button-red-line);
  background: var(--button-red-soft);
  color: var(--button-red-hover);
}
body.place-page .timeline-arrow:hover,
body.place-page .timeline-arrow:focus-visible {
  border-color: var(--button-red);
  background: var(--button-red);
  color: white;
}
body.place-page .mobile-modes { background: var(--button-red-soft); }
body.place-page .mode-button { color: var(--button-red-hover); }
body.place-page .mode-button[aria-pressed="true"] {
  background: var(--button-red);
  color: white;
  box-shadow: 0 4px 12px rgba(139,9,2,.2);
}
body.place-page .filter-chip {
  border-color: var(--button-red-line);
  background: var(--button-red-soft);
  color: var(--button-red-hover);
}
body.place-page .filter-chip[aria-pressed="true"] {
  border-color: var(--button-red);
  background: var(--button-red);
  color: white;
}
body.place-page .leaflet-bar a {
  background: var(--button-red-soft) !important;
  color: var(--button-red-hover) !important;
}
body.place-page .leaflet-bar a:hover {
  background: var(--button-red) !important;
  color: white !important;
}

@media (max-width: 980px) {
  .menu-toggle { display: block; }
  .portal-menu { position: absolute; left: 14px; right: 14px; top: calc(100% + 8px); padding: 12px; display: none; flex-wrap: wrap; border-radius: 16px; background: var(--forest-deep); box-shadow: var(--shadow); }
  body:is(.portal-page, .place-page) .portal-menu {
    background: rgba(255,255,255,.4);
    border: 1px solid rgba(255,255,255,.62);
    box-shadow: 0 18px 55px rgba(0,0,0,.14);
    backdrop-filter: blur(28px) saturate(180%);
    -webkit-backdrop-filter: blur(28px) saturate(180%);
  }
  .portal-menu.is-open { display: flex; }
  .portal-menu a { flex: 1 0 28%; }
  .history-grid { grid-template-columns: 1fr 1fr; }
  .history-card { border-bottom: 0; }
  .history-card + .history-card { padding-left: 0; }
  .map-feature, .stories-preview { grid-template-columns: 1fr; }
  .person-card, .person-card--wide { grid-column: span 6; }
  .name-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body.place-page .map-intro { grid-template-columns: 1fr; gap: 24px; }
  .contribution-page .content-grid { grid-template-columns: 1fr; }
  .contribution-page .content-grid > * { grid-column: 1 !important; }
  .contribution-page .portal-side { margin-top: 16px; }
  .research-source-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .donation-layout { grid-template-columns: 1fr; }
  .donation-card { position: static; order: -1; }
  .portal-footer--research .portal-footer__inner { grid-template-columns: 1fr 1fr; }
  .portal-footer--research .footer-bottom { grid-column: 1 / -1; }
}

@media (max-width: 650px) {
  .portal-brand span { display: none; }
  .portal-brand img { width: 108px; height: 44px; }
  .portal-nav { gap: 8px; }
  .portal-menu a { flex-basis: 44%; }
  .portal-hero { min-height: 720px; }
  .portal-hero h1 { font-size: clamp(3.2rem, 17vw, 5rem); }
  .history-grid, .stat-stack, .portal-form, .portal-footer__inner { grid-template-columns: 1fr; }
  .history-card, .history-card + .history-card { padding: 22px; border-right: 0; }
  .map-feature { width: calc(100% - 20px); padding: 24px 18px; }
  .person-card, .person-card--wide { grid-column: 1 / -1; }
  .name-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .cemetery-record dl { grid-template-columns: 1fr; }
  .cemetery-record dt { padding-bottom: 3px; }
  .cemetery-record dd { padding-top: 3px; border-top: 0; }
  .story-card { grid-template-columns: 1fr; }
  .story-date { font-size: 1.6rem; }
  .field--full, .form-actions { grid-column: 1; }
  .research-principles, .research-source-groups > section, .research-source-list { grid-template-columns: 1fr; }
  .methodology-list { grid-template-columns: 1fr; }
  .research-source-groups > section { gap: 12px; }
  .portal-footer__inner { gap: 28px; }
  .portal-footer--research .portal-footer__inner, .footer-bottom { grid-template-columns: 1fr; }
  .portal-footer--research .footer-bottom { grid-column: 1; }
  .footer-bottom .footer-links { grid-column: 1; }
  .places-summary { grid-template-columns: repeat(2, 1fr); row-gap: 12px; }
  .support-grid { grid-template-columns: 1fr; }
  .support-grid article { min-height: 0; }
  .page-hero__inner { min-height: 460px; padding: 100px 0 64px; }
  body.research-app.place-page > .page-shell { padding-top: 82px; }
}

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

/* Homepage review notice. Native dialog provides modal focus and background isolation. */
html:has(#review-notice[open]) { overflow: hidden; }
.review-notice { padding: 0; width: min(520px, calc(100% - 32px)); max-height: calc(100dvh - 32px); border: 1px solid var(--line); border-radius: 20px; color: var(--ink); background: var(--cream); box-shadow: 0 24px 90px rgba(0, 0, 0, .3); font-family: var(--sans); }
.review-notice::backdrop { background: rgba(17, 17, 19, .84); }
.review-notice__accent { height: 6px; background: var(--cinnabar); }
.review-notice__content { padding: clamp(24px, 6vw, 40px); }
.review-notice__eyebrow { margin: 0 0 14px; color: var(--jade); text-transform: uppercase; letter-spacing: .12em; font-size: .75rem; font-weight: 700; }
.review-notice h2 { margin: 0 0 16px; font-size: clamp(1.8rem, 6vw, 2.3rem); line-height: 1.15; letter-spacing: -.035em; }
.review-notice #review-notice-description { margin: 0 0 26px; line-height: 1.65; }
.review-notice label { display: block; margin-bottom: 8px; font-weight: 600; }
.review-notice input { width: 100%; padding: 12px 14px; border: 1px solid #929298; border-radius: 8px; background: white; color: var(--ink); font: inherit; }
.review-notice input:focus-visible { outline: 3px solid var(--jade); outline-offset: 3px; }
.review-notice input[aria-invalid="true"] { border-color: var(--cinnabar); }
.review-notice__help { margin: 10px 0 0; color: var(--muted); font-size: .875rem; }
.review-notice__error { min-height: 1.5em; margin: 12px 0; color: var(--cinnabar); font-size: .9rem; }
.review-notice button { width: 100%; cursor: pointer; }
.review-noscript { padding: 20px; background: var(--button-red-soft); color: var(--ink); }