
:root {
  --paper: #EFE4CB;
  --paper-2: #E7D8B6;
  --paper-3: #D9C59A;
  --ink: #2A2118;
  --ink-2: #5F4E3A;
  --ink-3: #8A7656;
  --rubric: #A0301F;
  --wax: #8B1E1E;
  --wax-d: #5E0D12;
  --wax-l: #C2413A;
  --lapis: #2F4863;
  --verdigris: #3F6B4A;
  --velvet: #17181B;
  --gold-1: #F6E7AE;
  --gold-2: #D9B866;
  --gold-3: #A8812F;
  --gold-4: #E3C77A;
  --gilt: linear-gradient(135deg, #F6E7AE 0%, #D9B866 28%, #A8812F 52%, #E3C77A 76%, #F6E7AE 100%);
  --rod-h: 54px;
  --measure: 36rem;
  --pad-x: clamp(18px, 6vw, 90px);
  --frame: 14px;
  --display: "ANH Display", "Cormorant Garamond", Georgia, serif;
  --text: "ANH Text", "EB Garamond", Georgia, serif;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --c: var(--rubric);
}
.letter--conquerors, .dispatch--conquerors, .folio--conquerors, .legend--conquerors, .life--conquerors { --c: #A0301F; }
.letter--rulers, .dispatch--rulers, .folio--rulers, .legend--rulers, .life--rulers { --c: #2F4863; }
.letter--scientists, .dispatch--scientists, .folio--scientists, .legend--scientists, .life--scientists { --c: #3F6B4A; }
.letter--thinkers, .dispatch--thinkers, .folio--thinkers, .legend--thinkers, .life--thinkers { --c: #7A5A2E; }
.letter--explorers, .dispatch--explorers, .folio--explorers, .legend--explorers, .life--explorers { --c: #2C5F6E; }
@font-face {
  font-family: "ANH Text";
  src: url("anh-text.445634f99d.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "ANH Text";
  src: url("anh-text-italic.06ffa8cfde.woff2") format("woff2");
  font-weight: 400 800;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "ANH Display";
  src: url("anh-display.59bce807b8.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html {
  font-size: clamp(17px, 15.4px + .25vw, 19px);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--rod-h) + 24px);
  background: var(--velvet) url("damask.ea2bc69d28.svg") 0 0 / 96px 128px;
}
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  font: 400 1rem/1.62 var(--text);
  font-variant-numeric: oldstyle-nums proportional-nums;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-tap-highlight-color: rgba(160, 48, 31, .15);
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(ellipse 70% 55% at 50% 22%, rgba(140, 78, 38, .24), transparent 70%),
    radial-gradient(ellipse at 50% 50%, transparent 42%, rgba(0, 0, 0, .55) 100%);
}
html.with-intro body { overflow: hidden; }
h1, h2, h3, h4 { margin: 0; font-family: var(--display); font-weight: 500; line-height: 1.12; text-wrap: balance; }
p { margin: 0 0 1em; }
img { max-width: 100%; height: auto; }
button { font: inherit; color: inherit; }
::selection { background: rgba(160, 48, 31, .2); }
a {
  color: var(--rubric);
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(160, 48, 31, .4);
  text-underline-offset: .2em;
  transition: color .2s, text-decoration-color .2s;
}
a:hover { text-decoration-color: currentColor; }
:focus-visible { outline: 2px solid var(--lapis); outline-offset: 3px; border-radius: 2px; }
main:focus, [tabindex="-1"]:focus { outline: none; }
.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.skip-link {
  position: fixed;
  left: 12px; top: -90px;
  z-index: 200;
  padding: .6em 1.1em;
  background: var(--paper);
  color: var(--ink);
  border: 2px solid var(--rubric);
  font-weight: 600;
  text-decoration: none;
  transition: top .2s;
}
.skip-link:focus { top: 12px; }
.draft-strip {
  position: fixed;
  left: 10px; bottom: 10px;
  z-index: 90;
  max-width: calc(100vw - 20px);
  margin: 0;
  padding: 5px 10px 6px;
  background: rgba(94, 13, 18, .92);
  color: var(--gold-1);
  font: 600 .6rem/1.3 var(--text);
  letter-spacing: .08em;
  text-transform: uppercase;
  border-radius: 3px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .4);
  pointer-events: none;
}
.desk {
  max-width: 1240px;
  margin: 0 auto;
  padding: 18px 14px 70px;
  overflow-x: clip;
}
.roller { position: relative; z-index: 3; }
.roller--top { position: sticky; top: 0; z-index: 50; }
.rod {
  position: relative;
  display: flex;
  align-items: center;
  gap: 18px;
  height: var(--rod-h);
  margin: 0 8px;
  padding: 0 40px;
  border-radius: 14px / 50%;
  background-image:
    linear-gradient(180deg, rgba(255, 228, 186, .34) 0%, rgba(255, 228, 186, .1) 16%, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, .16) 66%, rgba(0, 0, 0, .58) 100%),
    linear-gradient(90deg, transparent 21px, #7a5a1e 21px, #F6E7AE 24px, #A8812F 27px, #5c4316 29px, transparent 29px,
      transparent calc(100% - 29px), #5c4316 calc(100% - 29px), #A8812F calc(100% - 27px), #F6E7AE calc(100% - 24px), #7a5a1e calc(100% - 21px), transparent calc(100% - 21px)),
    repeating-linear-gradient(180deg, rgba(0, 0, 0, .13) 0 1px, transparent 1px 5px, rgba(255, 205, 150, .06) 5px 6px, transparent 6px 13px),
    repeating-linear-gradient(180deg, transparent 0 9px, rgba(30, 12, 4, .16) 9px 11px, transparent 11px 31px),
    linear-gradient(180deg, #74472b 0%, #5a3520 45%, #2c170d 100%);
  background-position: 0 0, 0 0, 0 calc(var(--scroll, 0) * -.4px), 0 calc(var(--scroll, 0) * -.27px), 0 0;
  box-shadow: 0 6px 12px -2px rgba(0, 0, 0, .5), inset 0 0 0 1px rgba(20, 8, 2, .35);
  transition: box-shadow .3s;
}
.rod::before, .rod::after {
  content: "";
  position: absolute;
  top: -5px; bottom: -5px;
  width: 30px;
  border-radius: 46% / 50%;
  background:
    radial-gradient(ellipse 34% 26% at 36% 28%, rgba(255, 252, 230, .95), rgba(255, 252, 230, 0) 100%),
    radial-gradient(ellipse 50% 50% at 50% 50%, #F6E7AE 0%, #D9B866 34%, #A8812F 66%, #5c4316 100%);
  box-shadow: 0 3px 6px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(92, 67, 22, .7), inset 0 -4px 6px rgba(70, 45, 10, .5);
}
.rod::before { left: -20px; }
.rod::after { right: -20px; }
.roller--top.is-stuck .rod { box-shadow: 0 12px 24px -4px rgba(0, 0, 0, .65), inset 0 0 0 1px rgba(20, 8, 2, .35); }
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  margin-left: -8px;
  text-decoration: none;
}
.brand__seal {
  width: 46px; height: 46px;
  flex-shrink: 0;
  filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .55));
  transition: transform .5s var(--ease);
}
.brand:hover .brand__seal { transform: rotate(-14deg) scale(1.06); }
.brand__name {
  font: 600 1.02rem/1 var(--display);
  letter-spacing: .14em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--gold-2);
  background: var(--gilt);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .7));
}
.nav { display: flex; align-items: center; min-width: 0; margin-left: auto; }
.nav__toggle { display: none; }
.nav__list {
  display: flex;
  gap: clamp(14px, 2.2vw, 30px);
  margin: 0;
  padding: 0;
  list-style: none;
}
.nav__list a {
  position: relative;
  display: block;
  padding: 6px 0;
  color: var(--gold-4);
  font: 600 .72rem/1 var(--text);
  letter-spacing: .16em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .7);
}
.nav__list a::after {
  content: "";
  position: absolute;
  left: 50%; right: 50%; bottom: 0;
  height: 1px;
  background: currentColor;
  transition: left .3s var(--ease), right .3s var(--ease);
}
.nav__list a:hover { color: var(--gold-1); }
.nav__list a:hover::after, .nav__list a[aria-current="page"]::after { left: 0; right: 0; }
.sound {
  display: none;
  place-items: center;
  flex-shrink: 0;
  width: 34px; height: 34px;
  margin-right: -6px;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 50%;
  color: var(--gold-4);
  cursor: pointer;
  transition: color .2s, background-color .2s;
}
html.js.has-sound .sound { display: inline-grid; }
.sound:hover { color: var(--gold-1); background-color: rgba(0, 0, 0, .18); }
.sound:focus-visible { outline-color: var(--gold-1); outline-offset: 1px; border-radius: 50%; }
.sound__icon {
  width: 20px; height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .7));
}
.sound__horn { fill: currentColor; }
.sound[aria-pressed="true"] .sound__off, .sound[aria-pressed="false"] .sound__on { display: none; }
.sound[aria-pressed="false"] { color: rgba(227, 199, 122, .6); }
.progress {
  position: absolute;
  left: 32px; right: 32px; bottom: -3px;
  height: 2px;
  background: linear-gradient(90deg, var(--wax-d), var(--wax-l) 50%, var(--wax-d));
  transform-origin: 0 50%;
  transform: scaleX(var(--progress, 0));
  pointer-events: none;
}
.roller--bottom { margin-top: -14px; }
.roller--bottom .rod { box-shadow: 0 10px 20px rgba(0, 0, 0, .6), inset 0 0 0 1px rgba(20, 8, 2, .35); }
.tassel {
  position: absolute;
  top: calc(var(--rod-h) - 8px);
  width: 14px; height: 74px;
  transform-origin: 50% 0;
  animation: sway 6s ease-in-out infinite;
  pointer-events: none;
}
.tassel--l { left: 46px; }
.tassel--r { right: 46px; animation-delay: -2.4s; }
.tassel::before {
  content: "";
  position: absolute;
  left: 5px; top: 0;
  width: 4px; height: 32px;
  border-radius: 2px;
  background: repeating-linear-gradient(-50deg, #8B1E1E 0 3px, #D9B866 3px 5px);
}
.tassel::after {
  content: "";
  position: absolute;
  left: 0; top: 28px;
  width: 14px; height: 44px;
  background:
    linear-gradient(180deg, #F6E7AE, #A8812F) 0 0 / 100% 6px no-repeat,
    linear-gradient(90deg, rgba(0, 0, 0, .3), transparent 35%, transparent 65%, rgba(0, 0, 0, .35)),
    repeating-linear-gradient(90deg, #7d1719 0 1.5px, #a52a24 1.5px 3px);
  clip-path: polygon(28% 0, 72% 0, 100% 100%, 0 100%);
}
.sheet-wrap {
  position: relative;
  z-index: 1;
  margin: -14px 34px 0;
}
.sheet-wrap::before {
  content: "";
  position: absolute;
  inset: 0 -6px;
  z-index: -1;
  box-shadow: 0 0 34px 4px rgba(0, 0, 0, .5), 0 40px 70px rgba(0, 0, 0, .35);
}
.sheet-wrap::after {
  content: "";
  position: absolute;
  inset: 32px var(--frame) 30px;
  z-index: 2;
  pointer-events: none;
  border: 1.5px solid rgba(160, 48, 31, .62);
  outline: 1px solid rgba(168, 129, 47, .6);
  outline-offset: 4px;
  box-shadow: inset 0 0 0 3px rgba(239, 228, 203, 0), inset 0 0 0 4px rgba(160, 48, 31, .2);
}
.sheet {
  position: relative;
  padding: 80px var(--pad-x) 0;
  background-color: var(--paper);
  background-image:
    linear-gradient(180deg, rgba(70, 40, 15, .3), rgba(70, 40, 15, 0) 80px, rgba(70, 40, 15, 0) calc(100% - 80px), rgba(70, 40, 15, .3)),
    linear-gradient(90deg, rgba(122, 82, 38, .24), rgba(122, 82, 38, 0) 70px, rgba(122, 82, 38, 0) calc(100% - 70px), rgba(122, 82, 38, .24)),
    radial-gradient(circle 160px at 11% 9%, rgba(150, 100, 45, .09), transparent),
    radial-gradient(ellipse 280px 190px at 91% 31%, rgba(150, 100, 45, .07), transparent),
    radial-gradient(circle 120px at 7% 57%, rgba(150, 100, 45, .08), transparent),
    radial-gradient(ellipse 240px 160px at 86% 83%, rgba(150, 100, 45, .07), transparent),
    url("paper.0da3c54bf1.webp");
  background-size: auto, auto, auto, auto, auto, auto, 448px 448px;
  background-blend-mode: normal, normal, normal, normal, normal, normal, multiply;
}
.sheet::before, .sheet::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  width: 16px;
  background-color: var(--paper);
  background-size: auto, 448px 448px;
  background-blend-mode: normal, multiply;
  -webkit-mask: url("deckle-l.0fd2119b87.svg") 0 0 / 16px 720px repeat-y;
  mask: url("deckle-l.0fd2119b87.svg") 0 0 / 16px 720px repeat-y;
}
.sheet::before {
  left: -15px;
  background-image: linear-gradient(90deg, rgba(110, 70, 30, .5), rgba(122, 82, 38, .25)), url("paper.0da3c54bf1.webp");
}
.sheet::after {
  right: -15px;
  background-image: linear-gradient(270deg, rgba(110, 70, 30, .5), rgba(122, 82, 38, .25)), url("paper.0da3c54bf1.webp");
  -webkit-mask-image: url("deckle-r.1a9c594625.svg");
  mask-image: url("deckle-r.1a9c594625.svg");
}
@media (max-width: 860px) {
  .nav__toggle {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 36px;
    padding: 0 12px;
    background: rgba(0, 0, 0, .14);
    border: 1px solid rgba(227, 199, 122, .5);
    border-radius: 2px;
    color: var(--gold-4);
    font: 600 .7rem/1 var(--text);
    letter-spacing: .16em;
    text-transform: uppercase;
    cursor: pointer;
  }
  .nav__toggle::before {
    content: "";
    width: 14px; height: 10px;
    border-block: 1.5px solid currentColor;
    background: linear-gradient(currentColor, currentColor) center / 100% 1.5px no-repeat;
  }
  html.js .nav__list {
    position: absolute;
    top: calc(100% + 8px); right: 30px;
    flex-direction: column;
    gap: 0;
    min-width: 230px;
    padding: 12px 0;
    background: var(--paper) url("paper.0da3c54bf1.webp") 0 0 / 448px 448px;
    background-blend-mode: multiply;
    border: 1px solid var(--paper-3);
    box-shadow: inset 0 0 0 5px var(--paper), inset 0 0 0 6px rgba(160, 48, 31, .45), 0 16px 34px rgba(0, 0, 0, .5);
    visibility: hidden;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity .2s, transform .25s var(--ease), visibility 0s .25s;
  }
  html.nav-open .nav__list { visibility: visible; opacity: 1; transform: none; transition: opacity .2s, transform .25s var(--ease); }
  html.js .nav__list a { padding: 13px 24px; color: var(--ink); font-size: .76rem; text-shadow: none; }
  html.js .nav__list a::after { display: none; }
  html.js .nav__list a:hover, html.js .nav__list a[aria-current="page"] { color: var(--rubric); }
  html.no-js .nav__toggle { display: none; }
  html.no-js .nav { overflow-x: auto; scrollbar-width: none; }
  html.no-js .nav::-webkit-scrollbar { display: none; }
  html.no-js .brand__name { display: none; }
}
@media (max-width: 640px) {
  :root { --rod-h: 48px; --frame: 10px; --pad-x: 24px; }
  .desk { padding: 14px 8px 70px; }
  .rod { margin: 0 6px; padding: 0 30px; gap: 10px; border-radius: 12px / 50%; }
  .rod::before, .rod::after { width: 24px; }
  .rod::before { left: -14px; }
  .rod::after { right: -14px; }
  .rod { background-image:
    linear-gradient(180deg, rgba(255, 228, 186, .34) 0%, rgba(255, 228, 186, .1) 16%, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, .16) 66%, rgba(0, 0, 0, .58) 100%),
    linear-gradient(90deg, transparent 14px, #7a5a1e 14px, #F6E7AE 16px, #A8812F 18px, #5c4316 20px, transparent 20px,
      transparent calc(100% - 20px), #5c4316 calc(100% - 20px), #A8812F calc(100% - 18px), #F6E7AE calc(100% - 16px), #7a5a1e calc(100% - 14px), transparent calc(100% - 14px)),
    repeating-linear-gradient(180deg, rgba(0, 0, 0, .13) 0 1px, transparent 1px 5px, rgba(255, 205, 150, .06) 5px 6px, transparent 6px 13px),
    repeating-linear-gradient(180deg, transparent 0 9px, rgba(30, 12, 4, .16) 9px 11px, transparent 11px 31px),
    linear-gradient(180deg, #74472b 0%, #5a3520 45%, #2c170d 100%); }
  .brand { margin-left: -6px; gap: 8px; }
  .brand__seal { width: 38px; height: 38px; }
  .brand__name { font-size: .8rem; letter-spacing: .1em; }
  html.js .nav__list { right: 6px; }
  .sheet-wrap { margin: -14px 18px 0; }
  .sheet-wrap::after { inset: 28px var(--frame) 26px; outline-offset: 3px; }
  .sheet { padding-top: 64px; }
  .tassel--l { left: 34px; }
  .tassel--r { right: 34px; }
}
@media (max-width: 370px) {
  html.js .brand__name { display: none; }
}
@media (min-width: 371px) and (max-width: 440px) {
  html.has-sound .nav__toggle { gap: 0; }
  html.has-sound .nav__label {
    position: absolute;
    width: 1px; height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }
}
.section { padding-top: clamp(64px, 9vw, 120px); }
.section-head { max-width: 40rem; margin: 0 auto clamp(30px, 4vw, 50px); text-align: center; }
.section-head h2 { font: 500 clamp(2rem, 1.25rem + 2.8vw, 3.1rem)/1.06 var(--display); letter-spacing: .005em; }
.section-head__dek { max-width: 34rem; margin: .9em auto 0; color: var(--ink-2); font-size: 1.04rem; font-style: italic; line-height: 1.5; }
.orn { display: block; margin: 0 auto; }
.orn--leaf { width: 30px; height: 30px; margin-bottom: 10px; color: var(--rubric); }
.orn--rule { width: min(240px, 70%); height: auto; aspect-ratio: 10 / 1; margin: 20px auto; color: var(--gold-3); }
.kicker {
  margin: 0 0 .7em;
  color: var(--rubric);
  font: 600 .72rem/1.35 var(--text);
  letter-spacing: .2em;
  text-transform: uppercase;
  font-variant-numeric: lining-nums;
}
.rubric { color: var(--rubric); }
.btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5em;
  min-height: 46px;
  padding: .5em 1.5em;
  background-color: var(--paper-2);
  color: var(--ink);
  border: 1px solid var(--ink-3);
  border-radius: 1px;
  box-shadow: inset 0 0 0 3px var(--paper-2), inset 0 0 0 4px rgba(138, 118, 86, .55), 0 2px 6px rgba(60, 35, 15, .14);
  font: 600 .78rem/1.2 var(--text);
  letter-spacing: .16em;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  font-variant-numeric: lining-nums;
  cursor: pointer;
  transition: transform .2s var(--ease), background-color .2s, box-shadow .2s;
}
.btn:hover { background-color: #F1E6CE; box-shadow: inset 0 0 0 3px #F1E6CE, inset 0 0 0 4px rgba(160, 48, 31, .5), 0 4px 10px rgba(60, 35, 15, .18); transform: translateY(-1px); }
.btn:active { transform: translateY(1px); }
.btn--wax {
  color: var(--gold-1);
  border-color: var(--wax-d);
  border-radius: 999px;
  background: radial-gradient(ellipse 80% 120% at 35% 25%, #c94a40 0%, var(--wax) 55%, var(--wax-d) 100%);
  box-shadow: inset 0 0 0 3px rgba(139, 30, 30, 0), inset 0 0 0 4px rgba(227, 199, 122, .45), inset 0 -3px 6px rgba(0, 0, 0, .3), 0 3px 9px rgba(94, 13, 18, .35);
  text-shadow: 0 1px 0 rgba(0, 0, 0, .45);
}
.btn--wax:hover {
  background: radial-gradient(ellipse 80% 120% at 35% 25%, #d65a4e 0%, #9a2424 55%, var(--wax-d) 100%);
  box-shadow: inset 0 0 0 3px rgba(139, 30, 30, 0), inset 0 0 0 4px rgba(246, 231, 174, .65), inset 0 -3px 6px rgba(0, 0, 0, .3), 0 5px 14px rgba(94, 13, 18, .4);
}
.btn--small { min-height: 38px; padding: .4em 1.15em; font-size: .68rem; }
.stamp {
  display: inline-block;
  padding: .2em .55em .15em;
  border: 1.5px solid currentColor;
  border-radius: 2px;
  color: var(--rubric);
  font: normal 700 .6rem/1.2 var(--text);
  letter-spacing: .16em;
  text-transform: uppercase;
  vertical-align: .18em;
  transform: rotate(-3deg);
  mix-blend-mode: multiply;
}
.stamp--draft, .stamp--update { color: var(--lapis); }
.crumbs { margin: 0 0 30px; text-align: center; }
.crumbs ol {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--ink-3);
  font: 600 .68rem/1.7 var(--text);
  letter-spacing: .16em;
  text-transform: uppercase;
}
.crumbs li + li::before { content: "›"; margin: 0 .75em; color: var(--rubric); }
.crumbs a { color: var(--ink-2); text-decoration: none; }
.crumbs a:hover { color: var(--rubric); }
.proclamation { max-width: 52rem; margin: 0 auto; text-align: center; }
.shamsa {
  display: block;
  width: clamp(150px, 22vw, 230px);
  height: auto;
  aspect-ratio: 1;
  margin: 0 auto 26px;
  overflow: visible;
  filter: drop-shadow(0 2px 3px rgba(60, 35, 15, .22));
}
.invocation { margin: 0 0 .45em; color: var(--ink-2); font-size: 1.08rem; font-style: italic; }
.proclamation__title { font: 600 clamp(3rem, 1.4rem + 6.4vw, 6.2rem)/.95 var(--display); letter-spacing: .005em; }
.proclamation__tagline {
  margin: 1em 0 0;
  padding-left: .32em;
  color: var(--ink-2);
  font: 500 .8rem/1.5 var(--text);
  letter-spacing: .32em;
  text-transform: uppercase;
}
.decree {
  max-width: 37rem;
  margin: 0 auto;
  font-size: 1.08rem;
  line-height: 1.68;
  text-align: justify;
  -webkit-hyphens: auto;
  hyphens: auto;
  hyphenate-limit-chars: 7 3 3;
}
.decree::after { content: ""; display: block; clear: both; }
.decree p { margin: 0; }
.initial { display: block; }
.decree .initial { float: left; width: 5.3rem; height: 5.3rem; margin: .35rem .85rem .1rem 0; filter: drop-shadow(0 2px 2px rgba(60, 35, 15, .25)); }
.initial__letter { font: 600 74px var(--display); fill: #F6E7AE; }
.proclamation__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 18px; margin: 36px 0 0; }
.herald {
  position: relative;
  max-width: 31rem;
  margin: 58px auto 0;
  padding: 34px clamp(20px, 5vw, 40px) 28px;
  background: rgba(255, 250, 235, .36);
  border: 1px solid rgba(138, 118, 86, .45);
  box-shadow: inset 0 0 0 5px rgba(239, 228, 203, .55), inset 0 0 0 6px rgba(160, 48, 31, .22), 0 14px 30px -16px rgba(60, 35, 15, .45);
}
.herald::before {
  content: "";
  position: absolute;
  top: -9px; right: 28px;
  width: 22px; height: 60px;
  background: linear-gradient(90deg, var(--wax-d), var(--wax) 35%, #a92b26 60%, var(--wax-d));
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 80%, 0 100%);
}
.herald .kicker { margin-bottom: .45em; }
.herald__when { margin: 0; font: 500 1.6rem/1.2 var(--display); }
.herald__count { color: var(--rubric); font: italic 400 1.08rem var(--text); }
.herald__from { margin: .5em 0 0; color: var(--ink-2); font-size: 1.04rem; font-variant: all-small-caps; letter-spacing: .07em; }
.herald__riddle { max-width: 26rem; margin: .8em auto 0; font-size: 1.06rem; font-style: italic; line-height: 1.5; }
.herald__ask {
  display: inline-block;
  margin-top: 1.1em;
  font: 600 .74rem/1.3 var(--text);
  letter-spacing: .18em;
  text-transform: uppercase;
  text-decoration: none;
}
.herald__ask::after { content: " →"; }
.herald__ask:hover { text-decoration: underline; }
.roll__tools { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: -8px 0 34px; }
.letters {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(268px, 1fr));
  gap: 46px 30px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.letter {
  --tilt: -.8deg;
  position: relative;
  transform: rotate(var(--tilt));
  transition: transform .5s var(--ease);
}
.letter:nth-child(4n+2) { --tilt: .5deg; }
.letter:nth-child(4n+3) { --tilt: -.3deg; }
.letter:nth-child(4n) { --tilt: .9deg; }
.letter:hover, .letter:focus-within { transform: rotate(0deg) translateY(-3px); }
.letter__body { --seam: 38%; position: relative; height: 380px; perspective: 1200px; }
.letter__inside {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px 26px 26px;
  text-align: center;
  background: #F5ECD8 url("paper.0da3c54bf1.webp") 0 0 / 448px 448px;
  background-blend-mode: multiply;
  border-radius: 2px;
  box-shadow: 0 1px 2px rgba(60, 35, 15, .25), 0 12px 26px -10px rgba(60, 35, 15, .5);
  transition: box-shadow .4s;
}
.letter__inside::before {
  content: "";
  position: absolute;
  inset: 9px;
  border: 1px solid var(--c);
  opacity: .5;
  pointer-events: none;
}
.letter__no {
  margin: 0 0 1em;
  color: var(--c);
  font: 600 .64rem/1.3 var(--text);
  letter-spacing: .2em;
  text-transform: uppercase;
  font-variant-numeric: lining-nums;
}
.letter__name { margin: 0 0 .35em; font: 600 1.9rem/1.04 var(--display); }
.letter__name a { color: inherit; text-decoration: none; }
.letter__name a:hover { color: var(--c); }
.letter__hook { margin: 0 0 1em; color: var(--ink-2); font-size: 1.02rem; font-style: italic; line-height: 1.4; }
.letter__meta { margin: 0 0 1.5em; color: var(--ink-3); font-size: .92rem; font-variant: all-small-caps; letter-spacing: .06em; line-height: 1.35; }
.letter__cta {
  margin: 0;
  color: var(--c);
  font: 600 .68rem/1.3 var(--text);
  letter-spacing: .16em;
  text-transform: uppercase;
}
a.letter__cta { padding-bottom: 3px; border-bottom: 1px solid currentColor; text-decoration: none; }
a.letter__cta:hover { color: var(--ink); }
.letter__cta--date { color: var(--ink-3); }
.letter__flap {
  position: absolute;
  left: 0; right: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 24px;
  text-align: center;
  background: #EBDDBF url("paper.0da3c54bf1.webp") 0 0 / 448px 448px;
  background-blend-mode: multiply;
  transition: transform .7s var(--ease), opacity .2s;
}
.letter__flap::before {
  content: "";
  position: absolute;
  left: 9px; right: 9px;
  border: 1px solid var(--c);
  opacity: .45;
  pointer-events: none;
}
.letter__flap > * { position: relative; transition: opacity .3s .45s; }
.letter__flap--top {
  top: 0;
  z-index: 3;
  height: var(--seam);
  justify-content: flex-end;
  padding-bottom: 52px;
  border-radius: 2px 2px 0 0;
  transform-origin: 50% 0;
  box-shadow: 0 3px 4px -2px rgba(60, 35, 15, .35);
}
.letter__flap--top::before { top: 9px; bottom: 0; border-bottom: 0; }
.letter__flap--bottom {
  bottom: 0;
  height: calc(100% - var(--seam));
  padding-top: 52px;
  padding-bottom: 22px;
  border-radius: 0 0 2px 2px;
  transform-origin: 50% 100%;
}
.letter__flap--bottom::before { top: 0; bottom: 9px; border-top: 0; }
.letter:not(.is-open):hover .letter__flap--top { transform: rotateX(7deg); }
.flap__no { margin: 0 0 .22em; color: var(--c); font: 600 1.75rem/1 var(--display); letter-spacing: .04em; }
.flap__from { max-width: 15rem; margin: 0; color: var(--ink-2); font-size: .96rem; font-variant: all-small-caps; letter-spacing: .07em; line-height: 1.25; }
.flap__riddle { margin: 0; font-size: .96rem; font-style: italic; line-height: 1.42; }
.flap__foot {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  width: 100%;
  margin: auto 0 0;
  padding: 10px 4px 0;
  border-top: 1px solid rgba(138, 118, 86, .4);
}
.flap__ask { color: var(--rubric); font: 600 .64rem/1.3 var(--text); letter-spacing: .14em; text-align: left; text-transform: uppercase; }
.flap__opens { color: var(--ink-3); font-size: .84rem; font-style: italic; white-space: nowrap; }
.letter__body::before {
  content: "";
  position: absolute;
  z-index: 4;
  left: -7px; right: -7px;
  top: calc(var(--seam) - 7px);
  height: 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .24), rgba(255, 255, 255, 0) 45%, rgba(0, 0, 0, .24)), var(--c);
  clip-path: polygon(0 0, 100% 0, calc(100% - 6px) 50%, 100% 100%, 0 100%, 6px 50%);
  transition: transform .5s var(--ease), opacity .4s;
}
.letter.is-released .letter__body::before { display: none; }
.seal {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: var(--seam);
  width: 82px; height: 82px;
  margin: -41px 0 0 -41px;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  filter: drop-shadow(0 3px 3px rgba(60, 20, 10, .45));
  transition: transform .35s var(--ease);
}
.seal svg { display: block; width: 100%; height: 100%; overflow: visible; }
.seal:hover { transform: scale(1.07) rotate(-8deg); }
.seal:active { transform: scale(.96); }
.seal:focus-visible { outline-offset: 5px; border-radius: 50%; }
.seal__l, .seal__r { transform-box: fill-box; transform-origin: 50% 50%; transition: transform .3s ease-out, opacity .3s; }
.letter.is-breaking .seal__l { transform: translate(-3px, 1px) rotate(-6deg); }
.letter.is-breaking .seal__r { transform: translate(3px, 1px) rotate(6deg); }
.letter.is-open .seal { pointer-events: none; }
.letter.is-open .seal__l { transform: translate(-24px, 170px) rotate(-44deg); opacity: 0; transition: transform .8s cubic-bezier(.5, 0, .9, .6), opacity .35s .45s; }
.letter.is-open .seal__r { transform: translate(26px, 160px) rotate(38deg); opacity: 0; transition: transform .8s cubic-bezier(.5, 0, .9, .6), opacity .35s .45s; }
.letter.is-open .letter__flap { opacity: 0; pointer-events: none; transition: transform .8s var(--ease), opacity .3s .5s; }
.letter.is-open .letter__flap > * { opacity: 0; transition: opacity .2s; }
.letter.is-open .letter__flap--top { transform: rotateX(118deg); }
.letter.is-open .letter__flap--bottom { transform: rotateX(-118deg); }
.letter.is-open .letter__body::before { opacity: 0; transform: translateY(16px); }
.letter.is-next::after {
  content: "Next to open";
  position: absolute;
  z-index: 6;
  top: -11px; right: -10px;
  padding: 6px 11px 5px;
  border-radius: 999px;
  background: radial-gradient(ellipse at 35% 30%, #c94a40, var(--wax) 60%, var(--wax-d));
  color: var(--gold-1);
  font: 600 .56rem/1 var(--text);
  letter-spacing: .16em;
  text-transform: uppercase;
  box-shadow: inset 0 0 0 2px var(--wax), inset 0 0 0 3px rgba(227, 199, 122, .5), 0 2px 5px rgba(60, 20, 10, .35);
  transform: rotate(5deg);
  pointer-events: none;
}
.letter.is-called .letter__body { animation: called 1s var(--ease); }
.letter.is-called .letter__inside { box-shadow: 0 0 0 3px rgba(217, 184, 102, .95), 0 0 0 9px rgba(217, 184, 102, .25), 0 12px 26px -10px rgba(60, 35, 15, .5); }
@keyframes called {
  0%, 100% { transform: none; }
  18% { transform: rotate(-2.4deg); }
  36% { transform: rotate(2deg); }
  54% { transform: rotate(-1.2deg); }
  72% { transform: rotate(.6deg); }
}
html.is-instant *, html.is-instant *::before, html.is-instant *::after { transition: none !important; animation: none !important; }
html.no-js .letter__flap, html.no-js .seal, html.no-js .letter__body::before { display: none; }
.dispatch-list { display: grid; gap: clamp(44px, 6vw, 72px); }
.dcard {
  display: grid;
  grid-template-columns: minmax(0, 420px) minmax(0, 1fr);
  align-items: center;
  gap: clamp(24px, 4vw, 50px);
}
.dcard:nth-child(even) .dcard__plate { order: 2; }
.dcard__plate {
  display: block;
  padding: 7px;
  background: var(--gilt);
  box-shadow: inset 0 0 0 1px rgba(92, 67, 22, .5), 0 14px 30px -12px rgba(40, 25, 10, .6);
  transition: transform .4s var(--ease);
}
.dcard__plate:hover { transform: rotate(-.6deg) scale(1.01); }
.dcard__plate img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  outline: 1px solid rgba(92, 67, 22, .6);
  filter: sepia(.16) contrast(1.02);
}
.dcard__text .kicker .stamp { margin-left: .7em; }
.dcard__name { margin: .1em 0 .3em; font: 600 2.2rem/1.04 var(--display); }
.dcard__name a { color: inherit; text-decoration: none; }
.dcard__name a:hover { color: var(--rubric); }
.dcard__hook { margin: 0 0 .7em; color: var(--rubric); font-size: 1.1rem; font-style: italic; line-height: 1.4; }
.dcard__dek { margin: 0 0 .9em; color: var(--ink-2); }
.dcard__meta { margin: 0; color: var(--ink-3); font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; font-variant-numeric: lining-nums; }
.empty-note { color: var(--ink-2); font-style: italic; text-align: center; }
@media (max-width: 980px) {
  .dcard { grid-template-columns: minmax(0, 1fr); gap: 22px; width: 100%; max-width: 620px; margin-inline: auto; }
  .dcard:nth-child(even) .dcard__plate { order: 0; }
}
@media (max-width: 640px) {
  .decree { text-align: left; }
  .decree .initial { width: 4.6rem; height: 4.6rem; }
  .letters {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: 86%;
    gap: 16px;
    margin: 0 calc(var(--frame) + 2px - var(--pad-x));
    padding: 22px 6% 30px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 6%;
    scrollbar-width: none;
  }
  .letters::-webkit-scrollbar { display: none; }
  .letter { scroll-snap-align: center; }
  .letter__body { height: 410px; }
  .letter__flap { padding-inline: 18px; }
  .flap__riddle { font-size: .93rem; }
  .letter.is-next::after { right: 2px; }
  .seal { width: 76px; height: 76px; margin: -38px 0 0 -38px; }
}
.atlas__scroll {
  position: relative;
  margin: 0 calc(-.6 * var(--pad-x));
  padding: 6px;
  overflow-x: auto;
  background: rgba(255, 250, 235, .18);
  border: 4px double rgba(122, 90, 50, .5);
  scrollbar-width: thin;
  scrollbar-color: var(--paper-3) transparent;
}
.atlas__map { position: relative; min-width: 860px; aspect-ratio: 1000 / 411; }
.atlas__base, .atlas__overlay { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; }
.atlas__overlay text { font-family: var(--text); }
.sea {
  fill: var(--lapis);
  opacity: .55;
  font-size: 11px;
  font-style: italic;
  letter-spacing: .3em;
  text-anchor: middle;
  text-transform: uppercase;
}
.sea--s { font-size: 7.5px; letter-spacing: .2em; }
.cartouche text { text-anchor: middle; }
.cartouche__k { fill: var(--ink-2); font-size: 10px; font-style: italic; }
.cartouche__t { fill: var(--rubric); font: 600 13px var(--display); letter-spacing: .12em; text-transform: uppercase; }
.cartouche__s { fill: var(--ink-2); font-size: 8.5px; font-style: italic; }
.cartouche__y { fill: var(--ink-3); font-size: 8px; font-weight: 600; letter-spacing: .3em; }
.pin { cursor: pointer; }
.pin:focus { outline: none; }
.pin__halo {
  fill: rgba(160, 48, 31, .12);
  stroke: rgba(160, 48, 31, .55);
  stroke-width: .8;
  transform-box: fill-box;
  transform-origin: center;
  transition: transform .3s var(--ease), fill .3s;
}
.pin__dot { fill: var(--rubric); stroke: #F4EBD6; stroke-width: 1.2; }
.pin__no, .pin__name { paint-order: stroke; stroke: rgba(239, 228, 203, .92); stroke-width: 3px; stroke-linejoin: round; }
.pin__no { fill: var(--rubric); font: 700 11.5px var(--display); letter-spacing: .03em; }
.pin__name { fill: var(--ink); font-size: 9.5px; font-style: italic; opacity: 0; transition: opacity .8s; }
.pin__name.is-known { opacity: 1; }
.pin:hover .pin__halo, .pin:focus-visible .pin__halo { fill: rgba(160, 48, 31, .24); transform: scale(1.7); }
.pin:hover .pin__no, .pin:focus-visible .pin__no { fill: var(--wax-d); }
.pin:focus-visible .pin__dot { stroke: var(--lapis); stroke-width: 2; }
.atlas__key {
  columns: 3 220px;
  column-gap: 34px;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
  font-size: .9rem;
  line-height: 1.4;
}
.atlas__key li { padding: 3px 0; break-inside: avoid; }
.atlas__key a { display: flex; align-items: baseline; gap: .7em; color: var(--ink-2); text-decoration: none; }
.atlas__key a:hover { color: var(--rubric); }
.atlas__no { flex: 0 0 2.4em; color: var(--rubric); font: 600 .98rem/1 var(--display); text-align: right; }
.chronicle__scroll {
  margin: 0 calc(-.6 * var(--pad-x));
  padding: 6px 0 4px;
  overflow-x: auto;
  border-block: 1px solid rgba(138, 118, 86, .4);
  cursor: grab;
  scrollbar-width: thin;
  scrollbar-color: var(--paper-3) transparent;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 28px, #000 calc(100% - 28px), transparent);
  mask-image: linear-gradient(90deg, transparent, #000 28px, #000 calc(100% - 28px), transparent);
}
.chronicle__scroll.is-dragging { cursor: grabbing; -webkit-user-select: none; user-select: none; }
.chronicle__svg { display: block; max-width: none; height: auto; }
.chronicle__svg text { font-family: var(--text); }
.band { fill: rgba(122, 90, 50, .06); }
.axis { stroke: var(--ink-2); stroke-width: 1.2; }
.tick { stroke: var(--ink-3); stroke-width: 1; }
.year { fill: var(--ink-3); font-size: 12px; text-anchor: middle; }
.break { fill: none; stroke: var(--ink-3); stroke-width: 1.2; }
.gap { fill: var(--ink-3); font-size: 11px; font-style: italic; text-anchor: middle; }
.event__lead { stroke: rgba(138, 118, 86, .6); stroke-width: 1; stroke-dasharray: 2 2; }
.event__mark { fill: var(--gold-3); }
.event { fill: var(--ink-2); font-size: 11.5px; font-style: italic; text-anchor: middle; }
.life { cursor: pointer; text-decoration: none; }
.life:focus { outline: none; }
.life__name { fill: var(--ink); font-size: 14px; font-weight: 600; transition: fill .2s; }
.life__dates { fill: var(--ink-3); font-size: 12px; font-style: italic; font-weight: 400; }
.life__bar { fill: var(--c); }
.life__circa { fill: var(--c); opacity: .35; }
.life:hover .life__name, .life:focus-visible .life__name { fill: var(--c); }
.life:focus-visible .life__bar { stroke: var(--lapis); stroke-width: 2; }
.legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 26px; margin: 22px 0 0; padding: 0; list-style: none; }
.legend__item a {
  display: inline-flex;
  align-items: center;
  gap: .6em;
  color: var(--ink-2);
  font: 600 .7rem/2 var(--text);
  letter-spacing: .15em;
  text-transform: uppercase;
  text-decoration: none;
}
.legend__item a::before { content: ""; width: 22px; height: 7px; border-radius: 4px; background: var(--c); }
.legend__item a:hover { color: var(--c); }
.charter-wrap { padding-bottom: 214px; }
.charter {
  position: relative;
  max-width: 54rem;
  margin: 0 auto;
  padding: clamp(34px, 5vw, 60px) clamp(22px, 5vw, 64px) clamp(30px, 4vw, 46px);
  background: rgba(255, 252, 240, .3);
  border: 3px double var(--rubric);
  outline: 1px solid rgba(168, 129, 47, .6);
  outline-offset: 6px;
}
.charter__head { margin-bottom: 32px; text-align: center; }
.charter__head h2 { font: 500 clamp(2rem, 1.25rem + 2.6vw, 3rem)/1.06 var(--display); }
.charter__articles {
  columns: 2 22rem;
  column-gap: 48px;
  column-rule: 1px solid rgba(160, 48, 31, .22);
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: art;
}
.charter__articles li { margin: 0 0 1.35em; break-inside: avoid; counter-increment: art; }
.charter__articles h3 { margin: 0 0 .3em; font: 600 1.28rem/1.15 var(--display); }
.charter__articles h3::before { content: counter(art, upper-roman) ". "; color: var(--rubric); }
.charter__articles p { margin: 0; font-size: .98rem; line-height: 1.56; }
.charter__close {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 4px 24px;
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid rgba(160, 48, 31, .28);
}
.charter__given { grid-column: 1; margin: 0; color: var(--ink-2); font-style: italic; }
.charter__sign { grid-column: 1; margin: 0; font: italic 500 1.7rem/1.2 var(--text); }
.chop { grid-column: 2; grid-row: 1 / span 2; width: 74px; height: 74px; transform: rotate(-4deg); mix-blend-mode: multiply; }
.pendant {
  position: absolute;
  top: calc(100% - 4px); left: 50%;
  width: 124px;
  height: auto;
  aspect-ratio: 160 / 250;
  margin-left: -62px;
  transform-origin: 50% 0;
  animation: sway 7s ease-in-out infinite;
  filter: drop-shadow(0 6px 6px rgba(60, 25, 10, .35));
}
@keyframes sway {
  0%, 100% { transform: rotate(1.4deg); }
  50% { transform: rotate(-1.4deg); }
}
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  min-height: 94px;
  padding: 14px 14px 12px;
  text-align: center;
  background: #F6EEDC;
  border: 1px solid rgba(138, 118, 86, .5);
  box-shadow: 0 1px 2px rgba(60, 35, 15, .14), 0 7px 14px -9px rgba(60, 35, 15, .45);
  transition: transform .3s var(--ease);
}
.card:nth-child(3n+1) { transform: rotate(-.6deg); }
.card:nth-child(3n+2) { transform: rotate(.4deg); }
.card:hover { transform: translateY(-2px); }
.card::after {
  content: "";
  position: absolute;
  top: -1px; right: -1px;
  width: 18px; height: 18px;
  background: linear-gradient(225deg, var(--paper) 50%, #DDCBA4 50%);
  box-shadow: -1px 1px 2px rgba(60, 35, 15, .2);
}
.card__name { font: 600 1.18rem/1.15 var(--display); }
.card__where { color: var(--ink-3); font: 600 .62rem/1.35 var(--text); letter-spacing: .14em; text-transform: uppercase; }
.antechamber__ask { margin: 28px 0 0; text-align: center; }
.post { padding-bottom: clamp(56px, 8vw, 100px); }
.envelope {
  position: relative;
  max-width: 40rem;
  margin: 0 auto;
  padding: 196px clamp(22px, 5vw, 56px) 42px;
  text-align: center;
  background: #F3E9D3 url("paper.0da3c54bf1.webp") 0 0 / 448px 448px;
  background-blend-mode: multiply;
  border: 1px solid rgba(138, 118, 86, .45);
  box-shadow: 0 2px 3px rgba(60, 35, 15, .14), 0 20px 40px -20px rgba(60, 35, 15, .6);
}
.envelope::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 132px;
  background:
    linear-gradient(to bottom left, #E6D6B2 calc(50% - 1px), rgba(110, 80, 40, .55) calc(50% - 1px), rgba(110, 80, 40, .55) 50%, rgba(60, 35, 15, .12) 50%, transparent calc(50% + 7px)) 0 0 / 50% 100% no-repeat,
    linear-gradient(to bottom right, #E6D6B2 calc(50% - 1px), rgba(110, 80, 40, .55) calc(50% - 1px), rgba(110, 80, 40, .55) 50%, rgba(60, 35, 15, .12) 50%, transparent calc(50% + 7px)) 100% 0 / 50% 100% no-repeat;
}
.envelope__seal {
  position: absolute;
  top: 132px; left: 50%;
  width: 86px; height: 86px;
  margin: -50px 0 0 -43px;
  filter: drop-shadow(0 3px 3px rgba(60, 20, 10, .45));
}
.envelope h2 { font: 500 clamp(2rem, 1.3rem + 2.4vw, 2.8rem)/1.08 var(--display); }
.envelope__text { max-width: 30rem; margin: .9em auto 0; color: var(--ink-2); }
.post-form { max-width: 30rem; margin: 28px auto 0; text-align: left; }
.post-form__label { display: block; margin-bottom: 8px; color: var(--ink-2); font: 600 .68rem/1.3 var(--text); letter-spacing: .16em; text-transform: uppercase; }
.post-form__row { display: flex; gap: 10px; }
.post-form__input {
  flex: 1;
  min-width: 0;
  min-height: 48px;
  padding: 0 14px;
  color: var(--ink);
  background: rgba(255, 252, 242, .8);
  border: 1px solid var(--ink-3);
  border-radius: 1px;
  box-shadow: inset 0 1px 3px rgba(60, 35, 15, .15);
  font: 400 1rem var(--text);
}
.post-form__input:focus { outline: 2px solid var(--lapis); outline-offset: 1px; }
.post-form .btn { flex-shrink: 0; min-height: 48px; }
.post-form__small { margin: 10px 0 0; color: var(--ink-3); font-size: .8rem; font-style: italic; }
.post-closed { margin: 24px 0 0; color: var(--ink-2); font-style: italic; }
.corr-log { margin: 0; padding: 0; list-style: none; }
.corr { padding: 16px 0; border-bottom: 1px dotted rgba(138, 118, 86, .6); }
.corr__meta { display: flex; align-items: baseline; gap: 12px; margin: 0 0 .3em; color: var(--ink-3); font-size: .8rem; }
.corr__text { margin: 0; }
.corr-empty { color: var(--ink-2); font-style: italic; }
.colophon { position: relative; padding: clamp(56px, 8vw, 96px) 0 78px; text-align: center; }
.colophon .orn--rule { margin: 0 auto 26px; }
.colophon__name { margin: 0; font: 600 1.7rem/1.1 var(--display); letter-spacing: .02em; }
.colophon__tag { margin: .3em 0 1.5em; color: var(--ink-2); font-style: italic; }
.colophon__nav ul, .colophon__shelves ul { display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style: none; }
.colophon__nav li + li::before, .colophon__shelves li + li::before { content: "·"; margin: 0 .75em; color: var(--rubric); }
.colophon__nav a { color: var(--ink-2); font: 600 .68rem/2.1 var(--text); letter-spacing: .15em; text-transform: uppercase; text-decoration: none; }
.colophon__shelves { margin-top: 6px; }
.colophon__shelves a { color: var(--ink-2); font-size: .96rem; font-style: italic; text-decoration: none; }
.colophon__nav a:hover, .colophon__shelves a:hover { color: var(--rubric); }
.colophon__set { max-width: 34rem; margin: 1.6em auto 0; color: var(--ink-3); font-size: .8rem; line-height: 1.5; }
.colophon__copy { margin: .4em 0 0; color: var(--ink-3); font-size: .8rem; }
.colophon .btn--small { margin-top: 22px; }
@media (max-width: 640px) {
  .charter-wrap { padding-bottom: 196px; }
  .charter { outline-offset: 4px; }
  .charter__close { grid-template-columns: minmax(0, 1fr) auto; }
  .chop { width: 60px; height: 60px; }
  .pendant { width: 108px; margin-left: -54px; }
  .envelope { padding-top: 160px; }
  .envelope::before { height: 104px; }
  .envelope__seal { top: 104px; width: 72px; height: 72px; margin: -42px 0 0 -36px; }
  .post-form__row { flex-direction: column; }
  .atlas__key { font-size: .86rem; }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .card { min-height: 84px; padding: 12px 8px 10px; }
  .card__name { font-size: 1.06rem; }
  .colophon__nav ul, .colophon__shelves ul { gap: 0 1.1em; }
  .colophon__nav li + li::before, .colophon__shelves li + li::before { content: none; }
}
.draft-banner {
  max-width: 40rem;
  margin: 0 auto 34px;
  padding: 12px 18px;
  color: var(--ink-2);
  font-size: .9rem;
  font-style: italic;
  line-height: 1.5;
  text-align: center;
  background: rgba(47, 72, 99, .05);
  border: 1px dashed rgba(47, 72, 99, .55);
}
.draft-banner .stamp { margin-right: .7em; }
.dispatch__head { max-width: 46rem; margin: 0 auto clamp(34px, 5vw, 58px); text-align: center; }
.dispatch__title { font-weight: 500; }
.dispatch__name { display: block; font: 500 clamp(3rem, 1.5rem + 5.6vw, 5.2rem)/.98 var(--display); letter-spacing: -.005em; }
.dispatch__hook { display: block; max-width: 36rem; margin: .45em auto 0; color: var(--rubric); font: italic 400 clamp(1.2rem, 1rem + .9vw, 1.6rem)/1.3 var(--text); }
.dispatch__head .orn--rule { margin: 24px auto 16px; }
.byline { margin: 0; color: var(--ink-3); font: 600 .66rem/1.7 var(--text); letter-spacing: .16em; text-transform: uppercase; font-variant-numeric: lining-nums; }
.dispatch__grid { max-width: var(--measure); margin: 0 auto; }
.toc {
  margin: 0 0 38px;
  background: rgba(255, 250, 235, .3);
  border: 1px solid rgba(138, 118, 86, .5);
}
.toc summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  color: var(--rubric);
  font: 600 .68rem/1.4 var(--text);
  letter-spacing: .18em;
  text-transform: uppercase;
  list-style: none;
  cursor: pointer;
}
.toc summary::-webkit-details-marker { display: none; }
.toc summary::after { content: "+"; color: var(--ink-3); font: 400 1.3rem/1 var(--text); }
.toc[open] summary::after { content: "−"; }
.toc ol { margin: 0; padding: 0 16px 14px; list-style: none; counter-reset: toc; }
.toc li { display: flex; gap: .7em; padding: 4px 0; font-size: .9rem; line-height: 1.35; counter-increment: toc; }
.toc li::before { content: counter(toc, upper-roman) "."; flex: 0 0 2.3em; color: var(--rubric); font: 600 .8rem/1.7 var(--display); text-align: right; }
.toc a { color: var(--ink-2); text-decoration: none; }
.toc a:hover, .toc a.is-active { color: var(--rubric); }
.toc a.is-active { font-style: italic; }
@media (min-width: 1180px) {
  .dispatch__grid {
    display: grid;
    grid-template-columns: 200px minmax(0, var(--measure));
    justify-content: center;
    gap: 48px;
    max-width: none;
  }
  .toc {
    position: sticky;
    top: calc(var(--rod-h) + 28px);
    align-self: start;
    max-height: calc(100vh - var(--rod-h) - 56px);
    margin: 4px 0 0;
    overflow: auto;
    background: none;
    border: 0;
    border-right: 1px solid rgba(160, 48, 31, .22);
    scrollbar-width: none;
  }
  .toc summary { padding: 0 16px 12px 0; }
  html.js .toc summary { pointer-events: none; }
  html.js .toc summary::after { content: none; }
  .toc ol { padding: 0 14px 0 0; }
  .toc li::before { flex-basis: 1.9em; }
}
.prose {
  max-width: var(--measure);
  margin: 0 auto;
  font-size: 1.06rem;
  line-height: 1.7;
  overflow-wrap: break-word;
}
@media (max-width: 600px) {
  .prose { -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 8 4 3; }
}
.prose h2 {
  margin: 2.3em 0 .8em;
  font: 500 clamp(1.75rem, 1.3rem + 1.5vw, 2.3rem)/1.12 var(--display);
  text-align: center;
  -webkit-hyphens: manual;
  hyphens: manual;
}
.prose h2::before { content: "❧"; display: block; margin-bottom: .3em; color: var(--rubric); font: 400 1.25rem/1 var(--text); }
.prose h3 { margin: 1.8em 0 .5em; font: 600 1.35rem/1.2 var(--display); -webkit-hyphens: manual; hyphens: manual; }
.prose ul, .prose ol { margin: 0 0 1.1em; padding-left: 1.3em; }
.prose li { margin: .35em 0; }
.prose li::marker { color: var(--rubric); }
.prose strong { font-weight: 600; }
.prose .lede { font-size: 1.16em; line-height: 1.6; }
.prose .lede::first-letter {
  float: left;
  margin: .1em .16em 0 0;
  padding: .1em .14em .02em;
  color: var(--gold-1);
  background: radial-gradient(ellipse 80% 90% at 35% 28%, #c94a40, var(--wax) 55%, var(--wax-d));
  border: 3px double var(--gold-2);
  font: 500 4.1em/.82 var(--display);
  text-shadow: 0 1px 0 rgba(0, 0, 0, .45);
}
.prose .lede::first-line { font-variant: small-caps; letter-spacing: .03em; }
.prose .prefer {
  max-width: 30rem;
  margin: 1.8em auto 0;
  padding: .9em 0;
  color: var(--ink-2);
  font-style: italic;
  text-align: center;
  border-block: 1px solid rgba(160, 48, 31, .3);
}
.ledger {
  margin: 1.4em 0 2em;
  padding: 6px 20px 8px;
  background: rgba(255, 250, 235, .32);
  border: 1px solid rgba(138, 118, 86, .55);
  outline: 1px solid rgba(138, 118, 86, .3);
  outline-offset: 3px;
}
.glance, .table-wrap table { width: 100%; border-collapse: collapse; font-size: .93rem; line-height: 1.45; -webkit-hyphens: manual; hyphens: manual; }
.glance th, .glance td, .table-wrap th, .table-wrap td { padding: 9px 12px 9px 0; text-align: left; vertical-align: baseline; border-bottom: 1px dotted rgba(138, 118, 86, .65); }
.glance thead th, .table-wrap th { padding: 8px 12px 8px 0; color: var(--ink-3); font: 600 .6rem/1.3 var(--text); letter-spacing: .18em; text-transform: uppercase; border-bottom: 3px double rgba(160, 48, 31, .45); }
.glance tbody td:first-child { width: 34%; padding-right: 16px; color: var(--rubric); font: 600 .68rem/1.55 var(--text); letter-spacing: .13em; text-transform: uppercase; }
.glance tbody tr:last-child td { border-bottom: 0; }
.table-wrap { margin: 1.4em 0 2em; overflow-x: auto; }
.myths { display: grid; gap: 16px; margin: 1.4em 0 2em; }
.myth {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: rgba(255, 250, 235, .32);
  border: 1px solid rgba(138, 118, 86, .5);
  box-shadow: 0 1px 2px rgba(60, 35, 15, .1);
}
.myth p { margin: 0; padding: 16px 18px; font-size: .94rem; line-height: 1.5; }
.myth .stamp { display: table; margin: 0 0 9px -2px; }
.myth__claim { color: var(--ink-2); font-style: italic; border-right: 1px dashed rgba(160, 48, 31, .4); }
.myth__fact .stamp { color: var(--verdigris); transform: rotate(2deg); }
.faq { border-bottom: 1px dotted rgba(138, 118, 86, .65); }
.prose h2 + .faq { border-top: 1px dotted rgba(138, 118, 86, .65); }
.faq summary { position: relative; display: block; padding: 14px 46px 14px 0; list-style: none; cursor: pointer; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+";
  position: absolute;
  top: 50%; right: 2px;
  width: 28px; height: 28px;
  margin-top: -14px;
  border-radius: 50%;
  color: var(--gold-1);
  background: radial-gradient(circle at 35% 30%, #c94a40, var(--wax) 55%, var(--wax-d));
  box-shadow: inset 0 0 0 2px rgba(227, 199, 122, .4), 0 2px 4px rgba(94, 13, 18, .35);
  font: 600 1.05rem/28px var(--text);
  text-align: center;
  transition: transform .3s var(--ease);
}
.faq[open] summary::after { content: "−"; transform: rotate(180deg); }
.faq summary h3 { margin: 0; font: 600 1.18rem/1.3 var(--display); }
.faq summary:hover h3 { color: var(--rubric); }
.faq__a { padding: 0 0 6px; }
.prose .sources { padding-left: 2.6em; font-size: .9rem; line-height: 1.5; list-style: upper-roman; }
.prose .sources li { margin: .55em 0; padding-left: .35em; }
.prose .sources li::marker { color: var(--rubric); font-family: var(--display); font-weight: 600; }
.prose .note { color: var(--ink-2); font-size: .86rem; font-style: italic; }
.prose .credits { padding-left: 1.2em; color: var(--ink-2); font-size: .8rem; line-height: 1.45; }
.prose .credits li { margin: .4em 0; }
.watch {
  margin: 2.6em 0 0;
  padding: 2px 24px 8px;
  background: rgba(255, 250, 235, .32);
  border: 1px solid rgba(138, 118, 86, .5);
  outline: 1px solid rgba(160, 48, 31, .25);
  outline-offset: 4px;
}
.watch h2 { margin-top: 1.1em; }
.plate { margin: 2.1em 0 2.3em; }
.plate__frame { padding: 7px; background: var(--gilt); box-shadow: 0 0 0 1px rgba(92, 67, 22, .6), 0 12px 24px -12px rgba(40, 20, 5, .65); }
.plate__frame img { display: block; width: 100%; outline: 1px solid rgba(60, 35, 15, .45); }
.plate figcaption { margin-top: 12px; color: var(--ink-2); font-size: .85rem; line-height: 1.45; text-align: center; -webkit-hyphens: manual; hyphens: manual; }
.plate__text { font-style: italic; }
.plate__credit { display: block; margin-top: 3px; color: var(--ink-3); font-size: .74rem; }
.plate--tall, .plate--small { max-width: 26rem; margin-left: auto; margin-right: auto; }
.film { margin: 2em 0 0; }
.film__frame {
  position: relative;
  display: grid;
  padding: 7px;
  background: var(--gilt);
  box-shadow: 0 0 0 1px rgba(92, 67, 22, .6), 0 16px 30px -14px rgba(40, 20, 5, .7);
}
.film__frame > * { grid-area: 1 / 1; min-width: 0; }
.film__poster, .film__frame iframe { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 30%; background: #1d140c; border: 0; }
.film__poster { filter: sepia(.4) brightness(.78) contrast(1.05); }
.film__play, .film__sealed {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 18px;
  color: #F6EBD2;
  text-align: center;
  background: radial-gradient(ellipse at center, rgba(20, 10, 4, .15), rgba(20, 10, 4, .62));
}
.film__play { margin: 0; border: 0; cursor: pointer; }
.film__play svg { width: 96px; height: 96px; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .55)); transition: transform .35s var(--ease); }
.film__play:hover svg { transform: scale(1.07) rotate(-4deg); }
.film__play:focus-visible { outline: 3px solid var(--gold-1); outline-offset: -12px; }
.film__label { font: 600 .72rem/1.3 var(--text); letter-spacing: .2em; text-transform: uppercase; text-shadow: 0 1px 3px rgba(0, 0, 0, .8); }
.film__sealed svg { width: 70px; height: 70px; filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .55)); }
.film__sealed p { max-width: 24rem; margin: 0; font-size: 1.02rem; font-style: italic; line-height: 1.45; text-shadow: 0 1px 3px rgba(0, 0, 0, .85); }
.film__cap { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 2px 16px; margin-top: 12px; font-size: .88rem; line-height: 1.45; text-align: center; -webkit-hyphens: manual; hyphens: manual; }
.film__title { color: var(--ink-2); }
.film__title cite { color: var(--ink); }
.film__out { font-weight: 600; }
.film__note { flex-basis: 100%; color: var(--ink-3); font-size: .76rem; font-style: italic; }
.film__pictured { flex-basis: 100%; max-width: 40rem; margin: 6px auto 0; color: var(--ink-2); font-size: .82rem; }
@media (min-width: 1100px) {
  .prose > .plate:not(.plate--tall):not(.plate--small), .prose > .film { margin-left: -40px; margin-right: -40px; }
}
.dispatch__foot { max-width: 46rem; margin: clamp(52px, 7vw, 84px) auto 0; }
.dispatch__foot .orn--rule { margin: 0 auto 30px; }
.sequel { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 0 0 30px; }
.sequel__item {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 18px 20px 16px;
  color: var(--ink);
  text-decoration: none;
  background: rgba(255, 250, 235, .32);
  border: 1px solid rgba(138, 118, 86, .5);
  box-shadow: 0 1px 2px rgba(60, 35, 15, .12);
  transition: transform .3s var(--ease), box-shadow .3s, border-color .3s;
}
a.sequel__item:hover { border-color: rgba(160, 48, 31, .6); box-shadow: 0 10px 20px -12px rgba(60, 35, 15, .55); transform: translateY(-2px); }
.sequel__item--next { align-items: flex-end; text-align: right; }
.sequel__item--none { visibility: hidden; }
.sequel__dir { color: var(--ink-3); font: 600 .62rem/1.4 var(--text); letter-spacing: .18em; text-transform: uppercase; }
.sequel__item--prev .sequel__dir::before { content: "← "; }
.sequel__item--next .sequel__dir::after { content: " →"; }
.sequel__no { margin-top: 6px; color: var(--rubric); font: 600 .95rem/1.2 var(--display); }
.sequel__name { font: 600 1.45rem/1.15 var(--display); }
.sequel__hook { color: var(--ink-2); font-size: .9rem; font-style: italic; line-height: 1.4; }
.dispatch__shelf, .dispatch__fix { margin: 0 0 .5em; color: var(--ink-2); font-size: .92rem; font-style: italic; text-align: center; }
@media (max-width: 600px) {
  .ledger { padding: 4px 14px 6px; }
  .glance tbody tr { display: block; padding: 9px 0; border-bottom: 1px dotted rgba(138, 118, 86, .65); }
  .glance tbody tr:last-child { border-bottom: 0; }
  .glance tbody td { display: block; width: auto !important; padding: 0; border: 0; }
  .glance thead { display: none; }
  .myth { grid-template-columns: 1fr; }
  .myth__claim { border-right: 0; border-bottom: 1px dashed rgba(160, 48, 31, .4); }
  .watch { padding: 2px 16px 6px; }
  .sequel { grid-template-columns: 1fr; }
  .sequel__item--none { display: none; }
  .sequel__item--next { align-items: flex-start; text-align: left; }
  .film__play svg { width: 72px; height: 72px; }
  .film__sealed svg { width: 52px; height: 52px; }
  .film__sealed p { font-size: .92rem; }
}
.page-head { max-width: 44rem; margin: 0 auto clamp(30px, 5vw, 50px); text-align: center; }
.page-head h1 { font: 500 clamp(2.6rem, 1.6rem + 4vw, 4.4rem)/1.02 var(--display); }
.page-head__dek { max-width: 34rem; margin: .9em auto 0; color: var(--ink-2); font-size: 1.06rem; font-style: italic; line-height: 1.5; }
.page-head .orn--rule { margin-bottom: 0; }
.shelf, .shelves { max-width: 54rem; margin: clamp(52px, 7vw, 84px) auto 0; }
.shelf > h2, .shelves > h2 { margin-bottom: 24px; font: 500 clamp(1.7rem, 1.3rem + 1.4vw, 2.2rem)/1.1 var(--display); text-align: center; }
.folios { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.folio {
  display: flex;
  flex-direction: column;
  padding: 18px 20px 16px;
  background: rgba(255, 250, 235, .35);
  border: 1px solid rgba(138, 118, 86, .5);
  border-top: 4px solid var(--c);
  box-shadow: 0 1px 2px rgba(60, 35, 15, .12), 0 8px 16px -12px rgba(60, 35, 15, .5);
}
.folio p { margin: 0; }
.folio .folio__no { color: var(--c); font: 600 .64rem/1.4 var(--text); letter-spacing: .18em; text-transform: uppercase; }
.folio__name { margin: 6px 0 4px; font: 600 1.5rem/1.1 var(--display); }
.folio__name a { color: var(--ink); text-decoration: none; }
.folio__name a:hover { color: var(--c); }
.folio .folio__hook { color: var(--ink-2); font-size: .94rem; font-style: italic; line-height: 1.4; }
.folio .folio__meta { margin-top: 10px; color: var(--ink-3); font-size: .8rem; }
.folio .folio__status { margin-top: auto; padding-top: 12px; color: var(--ink-2); font-size: .82rem; font-weight: 600; }
.shelves { text-align: center; }
.shelves ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0; padding: 0; list-style: none; }
.shelves a {
  display: inline-block;
  padding: 6px 18px;
  color: var(--ink-2);
  font-style: italic;
  text-decoration: none;
  background: rgba(255, 250, 235, .32);
  border: 1px solid rgba(138, 118, 86, .6);
  border-radius: 999px;
  transition: color .2s, border-color .2s;
}
.shelves a:hover { color: var(--rubric); border-color: var(--rubric); }
.alpha { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; max-width: 40rem; margin: 0 auto 38px; }
.alpha a {
  display: grid;
  place-items: center;
  width: 40px; height: 40px;
  color: var(--rubric);
  font: 600 1.1rem/1 var(--display);
  text-decoration: none;
  background: rgba(255, 250, 235, .32);
  border: 1px solid rgba(138, 118, 86, .6);
  border-radius: 50%;
  transition: color .2s, background .2s, border-color .2s;
}
.alpha a:hover { color: var(--gold-1); background: var(--wax); border-color: var(--wax-d); }
.index { max-width: 48rem; margin: 0 auto; }
.idx { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 0 20px; padding: 18px 0 14px; border-top: 1px solid rgba(160, 48, 31, .25); }
.idx__letter { color: var(--rubric); font: 500 2.6rem/1 var(--display); text-align: center; }
.idx__list { margin: 0; padding: 0; list-style: none; }
.idx__item { display: flex; align-items: baseline; gap: 0 10px; padding: 5px 0; }
.idx__name { font-size: 1.06rem; font-weight: 600; }
.idx__name a { color: var(--ink); text-decoration: none; }
.idx__name a:hover { color: var(--rubric); }
.idx__life { color: var(--ink-3); font-size: .84rem; font-style: italic; white-space: nowrap; }
.idx__lead { flex: 1; min-width: 18px; border-bottom: 1px dotted var(--ink-3); transform: translateY(-.3em); }
.idx__status { color: var(--ink-2); font-size: .82rem; text-align: right; }
.prose--page > :first-child { margin-top: 0; }
.corr-log, .corr-empty { max-width: var(--measure); margin: 2em auto 0; }
.astray { max-width: 36rem; margin: 0 auto; padding: 10px 0 40px; text-align: center; }
.astray__seal { display: block; width: 120px; height: 120px; margin: 0 auto 30px; overflow: visible; }
.astray__seal .seal__l { transform: translate(-10px, 8px) rotate(-12deg); transform-origin: 60px 60px; }
.astray__seal .seal__r { transform: translate(10px, 14px) rotate(14deg); transform-origin: 60px 60px; }
.astray h1 { font: 500 clamp(2.4rem, 1.6rem + 3vw, 3.6rem)/1.05 var(--display); }
.astray__text { max-width: 28rem; margin: .9em auto 1.7em; color: var(--ink-2); font-size: 1.06rem; font-style: italic; }
.astray__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
@media (max-width: 600px) {
  .idx { grid-template-columns: 40px minmax(0, 1fr); gap: 0 12px; }
  .idx__letter { font-size: 2rem; }
  .idx__item { flex-wrap: wrap; }
  .idx__lead { display: none; }
  .idx__status { flex-basis: 100%; text-align: left; }
}
.intro { display: none; }
html.with-intro .intro { position: fixed; inset: 0; z-index: 100; display: block; transition: opacity .45s ease; }
.intro__stage { position: absolute; inset: 0; overflow: hidden; }
.intro__half {
  position: absolute;
  left: 0; right: 0;
  height: 50%;
  background: var(--velvet) url("damask.ea2bc69d28.svg") 0 0 / 96px 128px;
  will-change: transform;
  transition: transform 1.05s cubic-bezier(.65, 0, .3, 1);
}
.intro__half::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 90% at 50% 100%, rgba(140, 78, 38, .22), transparent 70%);
}
.intro__half--top { top: 0; }
.intro__half--bottom { bottom: 0; }
.intro__half--bottom::before { background: radial-gradient(ellipse 70% 90% at 50% 0%, rgba(140, 78, 38, .22), transparent 70%); }
.intro__half .rod {
  position: absolute;
  left: calc(max(0px, (100% - 1240px) / 2) + 22px);
  right: calc(max(0px, (100% - 1240px) / 2) + 22px);
  margin: 0;
}
.intro__half--top .rod { bottom: 28px; }
.intro__half--bottom .rod { top: 28px; }
.intro__sliver {
  position: absolute;
  top: calc(50% - 30px);
  left: calc(max(0px, (100% - 1240px) / 2) + 48px);
  right: calc(max(0px, (100% - 1240px) / 2) + 48px);
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(20px, 5vw, 70px);
  background: var(--paper) url("paper.0da3c54bf1.webp") 0 0 / 448px 448px;
  background-blend-mode: multiply;
  box-shadow: inset 0 10px 10px -6px rgba(60, 30, 10, .45), inset 0 -10px 10px -6px rgba(60, 30, 10, .45);
  transition: opacity .35s ease;
}
.intro__address { color: var(--ink-2); font: italic 400 1rem/1 var(--text); letter-spacing: .04em; transition: opacity .35s ease; }
.intro__address--l { font: 600 .74rem/1 var(--text); letter-spacing: .24em; text-transform: uppercase; color: var(--rubric); }
.intro__cord {
  position: absolute;
  top: calc(50% - 96px); left: 50%;
  width: 8px; height: 192px;
  margin-left: -4px;
  border-radius: 3px;
  background: repeating-linear-gradient(-50deg, #8B1E1E 0 4px, #6a1316 4px 6px, #b23a2c 6px 8px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, .5);
  transition: transform .8s cubic-bezier(.5, 0, .75, 0), opacity .6s ease .2s;
}
.intro__seal {
  position: absolute;
  top: 50%; left: 50%;
  width: 120px; height: 120px;
  margin: -60px 0 0 -60px;
  overflow: visible;
  filter: drop-shadow(0 6px 8px rgba(0, 0, 0, .55));
}
.intro__seal use { transform-origin: 60px 60px; transition: transform .95s cubic-bezier(.5, 0, .75, 0), opacity .5s ease .45s; }
.intro.is-cracked .seal__l { transform: translate(-34px, 340px) rotate(-38deg); opacity: 0; }
.intro.is-cracked .seal__r { transform: translate(30px, 360px) rotate(32deg); opacity: 0; }
.intro.is-cracked .intro__cord { transform: translateY(70vh); opacity: 0; }
.intro.is-opening .intro__half--top { transform: translateY(var(--lift, -40vh)); }
.intro.is-opening .intro__half--bottom { transform: translateY(100%); }
.intro.is-cracked .intro__address { opacity: 0; }
.intro.is-opening .intro__sliver { opacity: 0; }
.intro.is-done { opacity: 0; pointer-events: none; }
.intro__skip {
  position: fixed;
  right: 18px; bottom: 18px;
  z-index: 101;
  min-height: 40px;
  padding: 6px 14px;
  color: rgba(246, 235, 210, .85);
  background: rgba(23, 24, 27, .6);
  border: 1px solid rgba(217, 184, 102, .5);
  border-radius: 999px;
  font: 600 .64rem/1.2 var(--text);
  letter-spacing: .18em;
  text-transform: uppercase;
  cursor: pointer;
}
.intro__skip:hover { color: var(--gold-1); border-color: var(--gold-2); }
@media (max-width: 640px) {
  .intro__half .rod { left: 14px; right: 14px; }
  .intro__sliver { left: 26px; right: 26px; }
  .intro__address { display: none; }
  .intro__seal { width: 100px; height: 100px; margin: -50px 0 0 -50px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    transition-delay: 0s !important;
  }
}
@media print {
  html, body { background: #fff !important; }
  body::before, .intro, .skip-link, .roller, .draft-strip, .toc, .film__play, .post, .roll__tools,
  .pendant, .seal, .letter__flap, .colophon .btn, .sheet::before, .sheet::after, .sheet-wrap::before, .sheet-wrap::after { display: none !important; }
  .desk { max-width: none; padding: 0; }
  .sheet-wrap { margin: 0; }
  .sheet { padding: 0; background: none; }
  .prose, .dispatch__grid { max-width: none; }
  .prose { font-size: 11pt; }
  .plate, .film, .myth, .ledger { break-inside: avoid; }
  a { color: inherit; text-decoration: none; }
  .prose a.ext::after { content: " (" attr(href) ")"; color: #555; font-size: .85em; }
}
