:root {
  --parch: #f1e6c8;
  --parch-2: #e8d9b0;
  --parch-dark: #d9c48f;
  --ink: #2a1c10;
  --ink-soft: #5a4630;
  --red: #a1161c;
  --red-deep: #6e0d12;
  --blue: #1b2a5c;
  --blue-deep: #111b3d;
  --gold: #b88a2c;
  --gold-light: #e2c26a;
  --smoke: rgba(235, 230, 220, .9);
  --serif: "IM Fell English", "Iowan Old Style", Georgia, serif;
  --sc: "IM Fell English SC", "IM Fell English", Georgia, serif;
  --pica: "IM Fell DW Pica", "IM Fell English", Georgia, serif;
  --black: "IM Fell French Canon", "IM Fell English", serif;
  --script: "Pinyon Script", cursive;
  --radius: 4px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  color: var(--ink);
  font-family: var(--serif);
  font-size: 1.15rem;
  line-height: 1.6;
  background-color: var(--parch);
  /* paper grain */
  background-image:
    radial-gradient(ellipse at 20% 10%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(ellipse at 80% 90%, rgba(120,80,20,.12), transparent 55%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .25 0 0 0 0 .1 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-attachment: fixed;
}
img { max-width: 100%; display: block; }
a { color: var(--red); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--red-deep); }
button { font: inherit; cursor: pointer; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Generic ---------- */
.section { padding: 5rem 0; position: relative; }
.wrap { width: min(1120px, 100% - 32px); margin: 0 auto; }
.wrap.narrow { width: min(820px, 100% - 32px); }
.two-col { display: grid; grid-template-columns: 1.3fr 1fr; gap: 3.5rem; align-items: center; }
@media (max-width: 820px) { .two-col { grid-template-columns: 1fr; gap: 2rem; } }

h2 {
  font-family: var(--sc); font-weight: 400; font-size: clamp(2rem, 4.5vw, 3rem);
  line-height: 1.1; margin: .2rem 0 1.2rem; text-align: center; color: var(--red-deep);
}
.two-col h2 { text-align: left; }
h3 { font-family: var(--sc); font-weight: 400; font-size: 1.7rem; margin: 0 0 .3rem; color: var(--red-deep); }
.kicker {
  font-family: var(--pica); font-style: italic; text-align: center; margin: 0; color: var(--ink-soft);
  display: flex; align-items: center; gap: .8rem; justify-content: center;
}
.kicker::before, .kicker::after { content: ""; height: 1px; width: 3rem; background: currentColor; opacity: .5; }
.two-col .kicker { justify-content: flex-start; }
.two-col .kicker::before { display: none; }
.center { text-align: center; }
.muted { color: var(--ink-soft); }
.light { color: #f5ead0 !important; }
.light-muted { color: #d9cba8; }
.kicker.light { color: var(--gold-light) !important; }

.dropcap::first-letter {
  font-family: var(--black); float: left; font-size: 4.4rem; line-height: .85;
  padding: .3rem .5rem 0 0; color: var(--red);
}

.btn {
  display: inline-block; border: 0; padding: .8rem 1.6rem; font-family: var(--sc); font-size: 1.25rem;
  letter-spacing: .04em; border-radius: var(--radius); transition: transform .1s, box-shadow .15s, background .2s;
}
.btn-red { background: var(--red); color: #fbefd2; box-shadow: 0 4px 0 var(--red-deep), 0 6px 14px rgba(0,0,0,.35); }
.btn-red:hover { background: #b51c22; }
.btn-red:active { transform: translateY(3px); box-shadow: 0 1px 0 var(--red-deep), 0 2px 6px rgba(0,0,0,.3); }
.btn-ghost { background: transparent; border: 1px solid var(--ink-soft); color: var(--ink-soft); font-size: 1rem; padding: .45rem 1rem; }
.btn-ghost:hover { background: rgba(0,0,0,.05); }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }

/* framed photographs */
.framed {
  margin: 0; padding: 12px 12px 0; background: #fbf5e4;
  border: 1px solid #c8b17a;
  box-shadow: 0 0 0 6px #8a6a2a, 0 0 0 8px var(--gold-light), 0 14px 30px rgba(40,20,0,.35);
  transition: transform .4s;
}
.framed img { width: 100%; height: auto; }
.framed figcaption { font-family: var(--pica); font-style: italic; text-align: center; padding: .55rem 0 .7rem; color: var(--ink-soft); }
.tilt-r { transform: rotate(2deg); }
.tilt-l { transform: rotate(-2deg); }
.framed.small { max-width: 300px; margin: 2.5rem auto 1rem; }

/* ---------- Proclamation hero ---------- */
.proclamation { padding: 4rem 16px 5rem; position: relative; overflow: hidden; isolation: isolate; border-bottom: 4px solid var(--gold); }
/* Union Flag backdrop (1707 pattern) */
.hero-flag { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; }
.uf-blue { fill: #1b2a5c; }
.uf-saltire { stroke: #efe4c8; stroke-width: clamp(70px, 11vw, 170px); fill: none; }
.uf-white { stroke: #efe4c8; stroke-width: clamp(110px, 17vw, 260px); fill: none; }
.uf-red { stroke: #a1161c; stroke-width: clamp(66px, 10vw, 156px); fill: none; }
/* aged, faded finish so the proclamation stays the focus */
.proclamation::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(ellipse at center, rgba(241,230,200,.18) 0%, rgba(241,230,200,.05) 55%, rgba(30,15,5,.45) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .3 0 0 0 0 .2 0 0 0 0 .08 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.sheet {
  max-width: 980px; margin: 0 auto; text-align: center;
  padding: 2.5rem clamp(1rem, 4vw, 3.5rem) 2.5rem;
  background: linear-gradient(180deg, #f8efd6, #efe0b8);
  border: 2px solid var(--ink);
  outline: 1px solid var(--ink); outline-offset: -10px;
  box-shadow: 0 1px 0 #fff inset, 0 25px 50px rgba(60,35,5,.35), 0 0 80px rgba(120,80,20,.25) inset;
  position: relative;
}
.gr-cipher { display: flex; justify-content: center; align-items: center; gap: 1rem; margin: 0; font-family: var(--black); font-style: italic; font-size: 2.4rem; color: var(--red); }
.crown-big { font-family: serif; font-size: 3rem; color: var(--gold); text-shadow: 0 1px 0 var(--red-deep); }
.by-command { font-family: var(--sc); letter-spacing: .3em; font-size: .95rem; margin: .2rem 0 .5rem; }
h1 { margin: 0; line-height: 1; font-weight: 400; }
.h1-small { display: block; font-family: var(--sc); font-size: clamp(1.4rem, 3vw, 2rem); letter-spacing: .2em; }
.h1-fraktur { display: block; font-family: var(--black); font-weight: 400; letter-spacing: .01em; font-size: clamp(2.7rem, 9vw, 6.2rem); color: var(--red); line-height: 1.05; margin: .3rem 0; text-shadow: 1px 1px 0 rgba(0,0,0,.15); }
.rule { display: flex; align-items: center; gap: 1rem; margin: 1.2rem auto; max-width: 520px; color: var(--red); font-size: 1.5rem; }
.rule::before, .rule::after { content: ""; flex: 1; height: 3px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.wanted {
  font-family: var(--sc); font-size: clamp(1.3rem, 4.2vw, 2.4rem); letter-spacing: .08em; margin: 0;
  color: var(--blue);
}
.lede { max-width: 640px; margin: .8rem auto 1.8rem; font-size: 1.25rem; }
.hero-frame { margin: 0 auto; border: 6px double var(--ink); padding: 6px; background: #fff8e6; box-shadow: 0 10px 25px rgba(0,0,0,.25); }
.hero-frame img { width: 100%; height: auto; filter: sepia(.18) contrast(1.05); }
.terms { font-family: var(--sc); font-size: 1.15rem; margin: 1.4rem 0 .5rem; display: flex; flex-wrap: wrap; justify-content: center; gap: .3rem .8rem; }
.terms .dot { color: var(--red); }
.gsk { font-family: var(--black); font-style: italic; font-size: 2rem; color: var(--red); margin: 1rem 0 0; }

blockquote.motto { margin: 1.8rem 0 0; padding: .9rem 1.2rem; border-left: 4px solid var(--blue); background: rgba(27,42,92,.06); }
.motto span { display: block; font-family: var(--black); font-size: 1.7rem; color: var(--blue); line-height: 1.2; }
.motto small { display: block; font-style: italic; color: var(--ink-soft); font-size: 1rem; margin-top: .2rem; }

/* ---------- Gallery ---------- */
.gallery {
  display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 210px; grid-auto-flow: dense;
  gap: 18px; margin-top: 2.2rem;
}
.g-item {
  position: relative; padding: 8px; border: 1px solid #b89c5c; background: #fbf4e0; overflow: hidden;
  box-shadow: 0 0 0 4px #7d5f24, 0 8px 18px rgba(40,20,0,.3); transition: transform .3s, box-shadow .3s;
}
.g-item:nth-child(odd) { transform: rotate(-.8deg); }
.g-item:nth-child(even) { transform: rotate(.9deg); }
.g-item:hover { box-shadow: 0 0 0 4px var(--gold), 0 16px 30px rgba(40,20,0,.4); }
.g-item img { width: 100%; height: 100%; object-fit: cover; filter: sepia(.35) saturate(.85); transition: filter .4s; }
.g-item:hover img { filter: none; }
.g-item span {
  position: absolute; left: 8px; right: 8px; bottom: 8px; padding: .9rem .5rem .4rem;
  font-family: var(--pica); font-style: italic; color: #fff4d8; font-size: 1.05rem;
  background: linear-gradient(transparent, rgba(30,15,5,.8)); text-align: center;
}
.g-tall { grid-row: span 2; }
.g-wide { grid-column: span 2; }
.g-big { grid-column: span 2; grid-row: span 2; }
@media (max-width: 860px) { .gallery { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 170px; gap: 14px; } }
@media (max-width: 460px) { .gallery { grid-template-columns: 1fr 1fr; grid-auto-rows: 130px; } .g-item span { font-size: .9rem; } }

/* Lightbox */
.lightbox { position: fixed; inset: 0; z-index: 100; background: rgba(20,12,5,.92); display: flex; align-items: center; justify-content: center; padding: 16px; }
.lightbox[hidden] { display: none; }
.lightbox figure { margin: 0; max-width: min(1100px, 100%); max-height: 100%; display: flex; flex-direction: column; align-items: center; }
.lightbox img { max-height: 80vh; width: auto; border: 8px solid #fbf4e0; box-shadow: 0 0 0 4px var(--gold); }
.lightbox figcaption { font-family: var(--black); color: var(--gold-light); font-size: 1.8rem; margin-top: .8rem; text-align: center; }
.lightbox button { position: absolute; background: rgba(0,0,0,.4); border: 1px solid var(--gold); color: var(--gold-light); width: 48px; height: 48px; border-radius: 50%; font-size: 1.6rem; line-height: 1; }
.lb-close { top: 16px; right: 16px; }
.lb-prev { left: 16px; top: 50%; }
.lb-next { right: 16px; top: 50%; }

/* ---------- Schedule ---------- */
.section-blue {
  background:
    repeating-linear-gradient(45deg, rgba(255,255,255,.025) 0 2px, transparent 2px 10px),
    linear-gradient(var(--blue), var(--blue-deep));
  color: #efe3c4; border-top: 4px solid var(--gold); border-bottom: 4px solid var(--gold);
}
.countdown-card {
  max-width: 640px; margin: 1.5rem auto 3rem; text-align: center; padding: 1.8rem 1.2rem;
  background: var(--parch); color: var(--ink); border: 2px solid var(--gold);
  outline: 1px solid var(--ink); outline-offset: -8px;
  box-shadow: 0 18px 40px rgba(0,0,0,.4);
}
.cd-label { font-style: italic; margin: 0; color: var(--ink-soft); }
.cd-event { font-family: var(--black); font-size: clamp(2rem, 6vw, 3rem); color: var(--red); margin: .2rem 0 0; line-height: 1.1; }
.cd-date { font-family: var(--sc); margin: .3rem 0 1rem; }
.cd-units { display: flex; justify-content: center; gap: clamp(.4rem, 2vw, 1.2rem); }
.cd-units div { min-width: 64px; padding: .4rem .3rem; border: 1px solid var(--ink-soft); background: #fbf3dc; }
.cd-units b { display: block; font-family: var(--pica); font-size: clamp(1.6rem, 5vw, 2.3rem); line-height: 1.1; color: var(--blue); }
.cd-units span { font-family: var(--sc); font-size: .8rem; }

.events { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1.6rem; }
.event {
  background: var(--parch); color: var(--ink); padding: 1.5rem 1.6rem 1.3rem; position: relative;
  border-left: 8px solid var(--red); box-shadow: 0 10px 24px rgba(0,0,0,.35);
  transition: transform .2s;
}
.event .ev-when { font-family: var(--sc); color: var(--red); margin: 0; font-size: 1.05rem; }
.event h3 { font-family: var(--black); font-size: 2rem; margin: .1rem 0; color: var(--ink); }
.event .ev-where { font-style: italic; margin: 0 0 .6rem; color: var(--ink-soft); }
.event .ev-date { font-family: var(--pica); font-size: 1.15rem; margin: 0 0 .6rem; }
.event .badge { position: absolute; top: -12px; right: 14px; background: var(--gold); color: var(--ink); font-family: var(--sc); font-size: .85rem; padding: .1rem .6rem; box-shadow: 0 2px 5px rgba(0,0,0,.3); }
.event p:last-child { margin-bottom: 0; }
.sched-note { text-align: center; max-width: 680px; margin: 2.5rem auto 0; font-size: 1.15rem; }
.sched-note a { color: var(--gold-light); }

/* ---------- Kit ---------- */
.notice {
  max-width: 820px; margin: 1rem auto 2.8rem; text-align: center; padding: 1.4rem 1.8rem;
  border: 1px dashed var(--ink-soft); background: rgba(255,250,235,.55);
}
.notice p { margin: .3rem 0; }
.ladder-wrap { display: grid; grid-template-columns: 300px 1fr; gap: 2rem; align-items: start; }
@media (max-width: 820px) { .ladder-wrap { grid-template-columns: 1fr; } }
.ladder { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column-reverse; gap: 6px; counter-reset: rank; }
.ladder button {
  width: 100%; text-align: left; display: flex; align-items: center; gap: .8rem;
  padding: .55rem .9rem; background: var(--parch-2); border: 1px solid #b59d68; color: var(--ink);
  font-family: var(--sc); font-size: 1.15rem; transition: all .15s;
}
.ladder .chev { color: var(--red); font-family: var(--serif); font-size: .95rem; min-width: 2.2rem; }
.ladder button:hover { background: var(--parch-dark); padding-left: 1.2rem; }
.ladder button[aria-selected="true"] { background: var(--red); color: #fdf1d4; border-color: var(--red-deep); box-shadow: 4px 4px 0 var(--gold); }
.ladder button[aria-selected="true"] .chev { color: var(--gold-light); }
@media (max-width: 820px) {
  .ladder { flex-direction: row; flex-wrap: wrap; }
  .ladder li { flex: 1 1 45%; }
  .ladder button { font-size: 1rem; padding: .45rem .6rem; }
  .ladder .chev { display: none; }
}

.rank-card {
  background: #fbf3dd; padding: 1.8rem 2rem; border: 2px solid var(--ink); outline: 1px solid var(--ink); outline-offset: -7px;
  box-shadow: 0 14px 30px rgba(60,35,5,.25); min-height: 100%;
}
.rank-card .rc-num { font-family: var(--sc); color: var(--ink-soft); margin: 0; letter-spacing: .1em; }
.rank-card h3 { font-family: var(--black); font-size: clamp(2.2rem, 5vw, 3rem); margin: 0 0 .4rem; color: var(--red); }
.rank-card .rc-flavour { font-style: italic; color: var(--ink-soft); margin: 0 0 1.1rem; }
.rank-card ul { columns: 2 220px; gap: 2rem; padding: 0; margin: 0; list-style: none; }
.rank-card li { break-inside: avoid; padding: .3rem 0 .3rem 1.6rem; position: relative; border-bottom: 1px dotted #c7b58b; }
.rank-card li::before { content: "✠"; position: absolute; left: 0; color: var(--red); }
.rank-card.anim { animation: unroll .35s ease-out; }
@keyframes unroll { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ---------- FAQ ---------- */
.section-parch2 { background: linear-gradient(rgba(150,110,40,.08), rgba(150,110,40,.14)); border-top: 1px solid #c8b17a; border-bottom: 1px solid #c8b17a; }
.faq { margin-top: 2rem; display: flex; flex-direction: column; gap: .9rem; }
.faq details { background: #fbf4e0; border: 1px solid #b59d68; box-shadow: 0 4px 10px rgba(60,35,5,.12); }
.faq summary {
  list-style: none; cursor: pointer; padding: 1rem 3.2rem 1rem 1.3rem; position: relative;
  font-family: var(--sc); font-size: 1.3rem; color: var(--ink);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::before { content: "Q."; font-family: var(--black); color: var(--red); margin-right: .6rem; }
.faq summary::after {
  content: "❧"; position: absolute; right: 1.2rem; top: 50%; transform: translateY(-50%); color: var(--red); transition: transform .3s; font-size: 1.4rem;
}
.faq details[open] summary::after { transform: translateY(-50%) rotate(90deg); }
.faq details[open] summary { border-bottom: 1px dotted #b59d68; }
.faq details p { margin: 0; padding: 1rem 1.3rem 1.2rem 3.1rem; position: relative; animation: unroll .3s ease-out; }
.faq details p::before { content: "A."; font-family: var(--black); color: var(--blue); position: absolute; left: 1.3rem; font-size: 1.2rem; }

/* ---------- Enlist ---------- */
.enlist-grid { align-items: start; }
.contact-list { margin: 1.5rem 0 0; }
.contact-list dt { font-family: var(--sc); color: var(--ink-soft); font-size: .95rem; letter-spacing: .05em; margin-top: 1rem; }
.contact-list dd { margin: .1rem 0 0; font-size: 1.35rem; word-break: break-word; }
.contact-list .email { font-size: 1.15rem; }
.copy-btn { margin-left: .4rem; font-family: var(--sc); font-size: .85rem; background: transparent; border: 1px solid var(--ink-soft); color: var(--ink-soft); padding: .05rem .5rem; vertical-align: 2px; }
.copy-btn:hover { background: var(--ink); color: var(--parch); }

.papers {
  background: linear-gradient(175deg, #fbf5e2, #efe1ba); padding: 2.2rem clamp(1.1rem, 3vw, 2.4rem) 2rem;
  border: 1px solid #a8905a; box-shadow: 0 25px 45px rgba(60,35,5,.35), 0 0 60px rgba(140,100,30,.2) inset;
  transform: rotate(.6deg); position: relative;
}
.papers::before { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(90,70,48,.35); pointer-events: none; }
.papers-head { font-family: var(--black); font-size: clamp(1.8rem, 4.5vw, 2.5rem); text-align: center; color: var(--red); margin: 0; line-height: 1.1; }
.papers-sub { text-align: center; font-style: italic; color: var(--ink-soft); margin: .2rem 0 1.4rem; }
.papers-body { line-height: 2.3; margin: 0 0 1rem; }
.papers input[type="text"], .papers select, .papers textarea {
  font: inherit; color: var(--blue); background: transparent; border: 0; border-bottom: 1px solid var(--ink); padding: 0 .2rem;
  font-family: var(--pica); font-style: italic; font-size: 1.15rem;
}
.papers input[type="text"] { width: 12rem; max-width: 100%; }
.papers select { max-width: 100%; cursor: pointer; }
.papers textarea { width: 100%; border: 1px solid rgba(42,28,16,.4); background: rgba(255,255,255,.3); padding: .5rem; resize: vertical;
  background-image: repeating-linear-gradient(transparent 0 1.75rem, rgba(42,28,16,.15) 1.75rem calc(1.75rem + 1px)); line-height: 1.75rem; }
.papers ::placeholder { color: #a08e6c; }
.papers-label { display: block; font-family: var(--sc); margin: .8rem 0 .2rem; color: var(--ink-soft); }
.papers input.sig { font-family: var(--script); font-style: normal; font-size: 2rem; width: 100%; color: var(--ink); }
.papers-foot { display: flex; align-items: center; gap: 1.2rem; margin-top: 1.6rem; flex-wrap: wrap; }
.seal-btn { background: none; border: 0; display: flex; align-items: center; gap: .8rem; font-family: var(--sc); font-size: 1.3rem; color: var(--red-deep); padding: 0; }
.seal {
  width: 74px; height: 74px; border-radius: 50%; display: grid; place-items: center; text-align: center;
  font-family: var(--black); color: #f7c6b0; font-size: 1.7rem; line-height: 1; text-shadow: 0 -1px 0 rgba(0,0,0,.4);
  background: radial-gradient(circle at 35% 30%, #d1373c, #8e1015 60%, #5c070b);
  box-shadow: 0 0 0 4px #8e1015, 0 0 0 6px rgba(142,16,21,.4), 0 6px 12px rgba(0,0,0,.4), inset 0 -4px 8px rgba(0,0,0,.35);
  transition: transform .2s;
  clip-path: polygon(50% 0, 61% 4%, 72% 2%, 80% 10%, 92% 14%, 95% 26%, 100% 38%, 96% 50%, 100% 62%, 94% 73%, 90% 86%, 78% 91%, 68% 99%, 56% 96%, 45% 100%, 34% 95%, 22% 97%, 13% 88%, 5% 78%, 3% 66%, 0 54%, 4% 42%, 2% 30%, 10% 20%, 16% 8%, 28% 5%, 39% 1%);
}
.seal sup { font-size: .6rem; }
.seal-btn:hover .seal { transform: rotate(-12deg) scale(1.06); }
.seal-btn.pressed .seal { animation: press .5s; }
@keyframes press { 40% { transform: scale(.82); } 100% { transform: scale(1); } }
.papers-hint { margin: 0; font-size: .9rem; color: var(--ink-soft); font-style: italic; flex: 1; min-width: 180px; }
.form-err { color: var(--red); margin: .6rem 0 0; min-height: 1.2em; font-style: italic; }

/* ---------- Footer ---------- */
.footer { text-align: center; padding: 3rem 16px; background: var(--ink); color: #d8c9a6; border-top: 4px solid var(--gold); }
.footer p { margin: .3rem 0; }
.footer .gsk { color: var(--gold-light); font-size: 2.4rem; }
.footer .small { font-size: .9rem; opacity: .7; }

/* toast */
.toast {
  position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, calc(100% + 40px)); visibility: hidden; z-index: 120;
  background: var(--ink); color: var(--parch); padding: .8rem 1.4rem; border: 2px solid var(--gold);
  font-family: var(--pica); font-size: 1.1rem; box-shadow: 0 10px 30px rgba(0,0,0,.4); transition: transform .35s cubic-bezier(.3,1.5,.5,1), visibility .35s;
  max-width: calc(100% - 32px); text-align: center;
}
.toast.show { transform: translate(-50%, 0); visibility: visible; }

/* scroll reveal */
.reveal { opacity: 0; translate: 0 24px; transition: opacity .8s, translate .8s, transform .4s; }
.reveal.in { opacity: 1; translate: 0 0; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; translate: 0 0; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* content loads from the admin-managed file; fade in once it arrives */
html.loading .sheet, html.loading main, html.loading .footer { opacity: 0; }
.sheet, main, .footer { transition: opacity .35s ease; }
