@import url("fonts.css?v=2");
:root {
  --paper:#e7e7e7;
  --ink:#331F2A;
  --muted:#6e5e67;
  --line:rgba(51,31,42,0.16);
  --accent:#6d3148;
  --lime:#E0ED5A;
  --lilac:#e4b6f4;
  --plum:#331F2A;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:Manrope,"Segoe UI",sans-serif;
  --pad:clamp(1.25rem,3.2vw,2.75rem);
  --s1:0.5rem;
  --s2:1rem;
  --s3:1.5rem;
  --s4:2rem;
  --s5:3rem;
  --s6:4rem
}

*,*::before,*::after {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale
}

body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:1.0625rem;
  line-height:1.6;
  font-weight:400
}

body.site {
  position:relative;
  overflow-x:clip;
  padding-left:env(safe-area-inset-left);
  padding-right:env(safe-area-inset-right)
}

img {
  max-width:100%
}

button,[role="button"],.tab,.menu-btn,.film-item,.admin button {
  cursor:pointer
}

:focus-visible {
  outline:2px solid var(--ink);
  outline-offset:3px
}

h1,h2,h3 {
  text-wrap:balance
}

p {
  text-wrap:pretty
}

.skip {
  position:absolute;
  left:1rem;
  top:-4rem;
  background:var(--ink);
  color:var(--paper);
  padding:0.65rem 0.9rem;
  z-index:80
}

.skip:focus {
  top:0.8rem
}

.star {
  display:inline-block;
  width:0.72em;
  height:0.72em;
  flex:none;
  background:var(--lime);
  clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
  vertical-align:-0.05em
}

.top {
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(231,231,231,0.9);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line)
}

.top-bar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  padding:0.75rem var(--pad)
}

.brand {
  display:flex;
  align-items:center;
  text-decoration:none;
  color:inherit
}

.logo {
  height:16px;
  width:auto;
  display:block
}

.wordmark {
  display:none;
  font-family:var(--serif);
  font-weight:500;
  font-size:1.45rem;
  letter-spacing:-0.03em;
  line-height:1
}

.desk-nav {
  display:none
}

.pill {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0.45rem;
  min-height:44px;
  padding:0.75rem 1.2rem;
  border-radius:999px;
  background:var(--ink);
  color:var(--paper);
  text-decoration:none;
  font:600 0.74rem/1 var(--sans);
  letter-spacing:0.14em;
  text-transform:uppercase;
  transition:background 180ms ease,color 180ms ease
}

.pill:hover {
  background:var(--lime);
  color:var(--ink)
}

.pill-head {
  display:none
}

.pill-lime {
  background:var(--lime);
  color:var(--ink)
}

.pill-lime:hover {
  background:var(--paper)
}

.menu-btn {
  appearance:none;
  background:transparent;
  border:0;
  color:var(--ink);
  width:44px;
  height:44px;
  min-width:44px;
  min-height:44px;
  padding:0;
  display:grid;
  place-items:center
}

.burger {
  position:relative;
  display:block;
  width:22px;
  height:2px;
  background:currentColor;
  border-radius:2px;
  transition:background 180ms ease
}

.burger:before,.burger:after {
  content:"";
  position:absolute;
  left:0;
  width:22px;
  height:2px;
  background:currentColor;
  border-radius:2px;
  transition:transform 220ms ease
}

.burger:before {
  top:-7px
}

.burger:after {
  top:7px
}

.menu-btn[aria-expanded="true"] .burger {
  background:transparent
}

.menu-btn[aria-expanded="true"] .burger:before {
  transform:translateY(7px) rotate(45deg)
}

.menu-btn[aria-expanded="true"] .burger:after {
  transform:translateY(-7px) rotate(-45deg)
}

.fold {
  display:flex;
  flex-direction:column;
  min-height:calc(100svh - 4.5rem)
}

.hero {
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(140px,0.55fr) minmax(180px,0.72fr);
  gap:clamp(1.25rem,3vw,2.5rem);
  align-items:center;
  flex:1 1 auto;
  min-height:0;
  padding:clamp(1.5rem,4vh,3rem) var(--pad)
}

.hello {
  display:flex;
  align-items:center;
  gap:0.5rem;
  margin:0 0 0.7rem;
  font:600 0.72rem/1 var(--sans);
  letter-spacing:0.16em;
  text-transform:uppercase
}

.hero h1,.sheet h1 {
  font-family:var(--serif);
  font-weight:500;
  letter-spacing:-0.03em;
  margin:0
}

.hero h1 {
  font-size:clamp(4.2rem,8.2vw,7.6rem);
  line-height:0.84
}

.roles {
  margin:var(--s3) 0 0;
  padding:0;
  max-width:none;
  font-family:var(--serif);
  font-style:italic;
  font-weight:500;
  font-size:clamp(1.05rem,1.25vw,1.35rem);
  line-height:1.3;
  white-space:nowrap;
  color:var(--muted)
}

.hero-stage {
  display:flex;
  align-items:center;
  justify-content:center
}

.hero-stage .flower {
  width:min(100%,280px);
  height:auto
}

.hero-aside {
  margin:0;
  font-family:var(--serif);
  font-style:italic;
  font-weight:500;
  font-size:clamp(1.28rem,1.8vw,1.62rem);
  line-height:1.35;
  max-width:22rem
}

.halo {
  position:relative
}

.halo picture,.halo>img {
  position:relative;
  z-index:1;
  display:block
}

.halo img {
  width:100%;
  height:auto;
  display:block;
  border-radius:46% 54% 42% 58% / 40% 48% 52% 60%
}

.halo::before {
  content:"";
  position:absolute;
  inset:-7% -5% -9%;
  z-index:0;
  border-radius:50%;
  background:radial-gradient(closest-side,var(--halo,var(--lilac)),transparent 72%);
  filter:blur(8px)
}

.halo-lilac {
  --halo:#e4b6f4
}

.halo-lime {
  --halo:#E0ED5A
}

.hero-stage .halo img {
  aspect-ratio:4 / 5;
  object-fit:cover
}

.flower {
  width:100%;
  height:auto;
  display:block
}

.ribbon {
  overflow:hidden;
  background:var(--lime);
  color:var(--ink);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}

.ribbon-track {
  display:flex;
  width:max-content;
  padding:0.65rem 0;
  animation:drift 50s linear infinite;
  will-change:transform
}

.ribbon-seq {
  display:flex;
  align-items:center;
  gap:1.35rem;
  padding-right:1.35rem;
  flex:none
}

.ribbon-track>span:not(.bloom) {
  font-family:var(--serif);
  font-style:italic;
  font-weight:500;
  font-size:1.4rem;
  white-space:nowrap
}

.bloom {
  font-size:1.05rem;
  line-height:1
}

.chapters {
  display:grid;
  grid-template-columns:1fr 1fr
}

.chapter {
  border-bottom:1px solid var(--line)
}

.chapter:nth-child(odd) {
  border-right:1px solid var(--line)
}

.chapter-link {
  display:grid;
  grid-template-columns:minmax(108px,168px) minmax(0,1fr);
  align-items:center;
  gap:0.85rem 1.35rem;
  height:100%;
  padding:clamp(1.15rem,2.4vw,1.8rem);
  color:inherit;
  text-decoration:none;
  transition:background 200ms ease
}

.chapter-link:hover {
  background:rgba(224,237,90,0.28)
}

.chapter-link:hover h2 {
  font-style:italic
}

.chapter-media img {
  aspect-ratio:1;
  width:100%;
  object-fit:cover;
  transition:transform 420ms ease
}

.chapter:nth-child(2) .halo img {
  border-radius:58% 42% 50% 50% / 46% 60% 40% 54%
}

.chapter:nth-child(3) .halo img {
  border-radius:40% 60% 62% 38% / 52% 38% 62% 48%
}

.chapter:nth-child(4) .halo img {
  border-radius:62% 38% 44% 56% / 40% 52% 48% 60%
}

.chapter-link:hover .chapter-media img {
  transform:scale(1.03)
}

.idx {
  font-family:var(--serif);
  font-style:italic;
  color:var(--accent);
  font-size:1.25rem
}

.chapter h2 {
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(2.2rem,4vw,3.7rem);
  line-height:0.92;
  letter-spacing:-0.03em;
  margin:0.15rem 0 0.55rem
}

.chapter p {
  max-width:36rem;
  margin:0;
  color:var(--muted)
}

.more {
  display:inline-block;
  margin-top:0.85rem;
  font:600 0.72rem/1 var(--sans);
  letter-spacing:0.14em;
  text-transform:uppercase
}

.sheet {
  padding:var(--s4) var(--pad) var(--s6)
}

.sheet-hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:clamp(1rem,3vw,2.5rem);
  align-items:end;
  margin-bottom:var(--s5)
}

.sheet-photo {
  width:200px
}

.sheet .halo img {
  width:100%;
  aspect-ratio:1;
  object-fit:cover
}

.sheet h1 {
  font-size:clamp(3.2rem,7vw,6.2rem);
  line-height:0.88
}

.lead {
  max-width:36rem;
  margin:var(--s3) 0 0;
  font-family:var(--serif);
  font-style:italic;
  font-weight:500;
  font-size:1.35rem;
  line-height:1.35
}

.prose {
  max-width:44rem
}

.prose>:first-child {
  margin-top:0
}

.prose>:last-child {
  margin-bottom:0
}

.prose h2,.prose h3,.prose h4,.exhibit h2,.kicker {
  font-family:var(--serif);
  font-weight:500;
  letter-spacing:-0.03em
}

.prose h2 {
  font-size:clamp(2rem,4vw,3rem);
  line-height:1.02;
  margin:var(--s5) 0 var(--s2)
}

.prose h3 {
  font-size:clamp(1.5rem,2.4vw,2rem);
  line-height:1.1;
  margin:var(--s4) 0 var(--s2)
}

.prose h4 {
  font-size:1.25rem;
  margin:var(--s4) 0 var(--s2)
}

.prose>:first-child {
  margin-top:0
}

.prose>:last-child {
  margin-bottom:0
}

.prose>.em:last-child {
  margin-bottom:var(--s3)
}

.prose p {
  margin:0 0 var(--s2)
}

.prose .em {
  font-family:var(--serif);
  font-style:italic;
  font-weight:500;
  font-size:1.35rem;
  line-height:1.4;
  border-left:3px solid var(--accent);
  padding-left:var(--s2);
  margin:var(--s3) 0
}

.prose .strong {
  font-weight:600
}

.prose a,a.inline {
  color:var(--accent);
  text-underline-offset:0.18em
}

.facts {
  margin:var(--s3) 0 0
}

.facts div {
  display:grid;
  grid-template-columns:minmax(9rem,16rem) 1fr;
  gap:var(--s2) var(--s3);
  padding:var(--s2) 0;
  border-top:1px solid var(--line)
}

.facts div:last-child {
  padding-bottom:0
}

.facts dt {
  font-weight:600
}

.facts dd {
  margin:0
}

.facts .solo {
  grid-template-columns:1fr
}

.steps {
  list-style:none;
  margin:0 0 1rem;
  padding:0
}

.steps li {
  position:relative;
  padding:var(--s2) 0 var(--s2) 1.15rem;
  border-top:1px solid var(--line)
}

.steps li::before {
  content:"";
  width:0.45rem;
  height:0.45rem;
  background:var(--accent);
  clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
  position:absolute;
  left:0;
  top:1.05rem
}

.tabs {
  margin:0
}

.tablist {
  display:grid;
  grid-template-columns:1fr 1fr;
  margin:0;
  padding:0;
  border:0;
  border-top:1px solid var(--line);
  counter-reset:none
}

.tab {
  appearance:none;
  background:transparent;
  border:0;
  border-radius:0;
  border-bottom:1px solid var(--line);
  color:var(--ink);
  font-family:var(--serif);
  font-style:normal;
  font-weight:500;
  font-size:clamp(1.2rem,1.65vw,1.72rem);
  line-height:1.15;
  letter-spacing:-0.03em;
  text-transform:none;
  text-align:left;
  padding:var(--s2) 1.25rem var(--s2) 0;
  min-height:44px;
  white-space:normal
}

.tab::before {
  content:none
}

.tab:nth-child(odd) {
  padding-right:1.2rem;
  border-right:1px solid var(--line)
}

.tab:nth-child(even) {
  padding-left:1.2rem
}

.tab[aria-selected="true"] {
  color:var(--ink);
  background:transparent;
  font-style:italic;
  box-shadow:none
}

.tab:hover {
  font-style:italic
}

.panel {
  margin-top:var(--s4);
  animation:fade-in 360ms ease
}

.panel[hidden] {
  display:none
}

.tablist + .prose,.tablist + .panel {
  margin-top:var(--s5)
}

.panel-grid {
  display:block
}

.film {
  display:flex;
  gap:var(--s2);
  overflow-x:auto;
  margin:var(--s4) 0;
  padding:0;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain
}

.film.has-more {
  -webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 4.25rem),transparent 100%);
  mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 4.25rem),transparent 100%)
}

.film-item {
  border:0;
  padding:0;
  background:transparent;
  scroll-snap-align:start;
  flex:0 0 auto;
  cursor:zoom-in
}

.film-item img {
  height:min(62vh,520px);
  width:auto;
  max-width:none;
  display:block;
  border-radius:1.4rem
}

.ex-index {
  display:grid;
  grid-template-columns:1fr 1fr;
  margin:0;
  border-top:1px solid var(--line)
}

.ex-index a {
  color:inherit;
  text-decoration:none;
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(1.2rem,1.65vw,1.72rem);
  line-height:1.15;
  letter-spacing:-0.03em;
  padding:var(--s2) 1.25rem var(--s2) 0;
  border-bottom:1px solid var(--line)
}

.ex-index a:nth-child(odd) {
  padding-right:1.2rem;
  border-right:1px solid var(--line)
}

.ex-index a:nth-child(even) {
  padding-left:1.2rem
}

.ex-index a:hover {
  font-style:italic
}

.exhibit {
  margin-top:var(--s5);
  padding-top:var(--s5);
  border-top:1px solid var(--line);
  content-visibility:auto;
  contain-intrinsic-size:auto 520px
}

.ex-index + .exhibit {
  border-top:0;
  padding-top:0;
  margin-top:var(--s5)
}

.kicker {
  font-size:clamp(1.75rem,3vw,2.5rem);
  line-height:1.05;
  margin:0 0 var(--s2)
}

.ex-lines p {
  margin:0 0 var(--s1);
  max-width:46rem
}

.exhibit h2 {
  font-size:clamp(2.75rem,6vw,5rem);
  line-height:0.9;
  margin:var(--s2) 0 var(--s3);
  max-width:16ch
}

.foot {
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(220px,0.7fr);
  gap:clamp(1.5rem,4vw,4rem);
  padding:var(--s5) var(--pad);
  background:var(--ink);
  color:var(--paper)
}

.foot .logo {
  filter:invert(1);
  height:18px
}

.foot-name {
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(3.25rem,7vw,5.5rem);
  line-height:0.86;
  letter-spacing:-0.03em;
  margin:0 0 var(--s3)
}

.tagline {
  max-width:none;
  margin:0;
  font-size:clamp(0.72rem,2.5vw,0.875rem);
  line-height:1.45;
  white-space:nowrap;
  color:rgba(231,231,231,0.72)
}

.tagline a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid rgba(231,231,231,0.35);
}
.tagline a:hover {
  color: var(--lime);
  border-bottom-color: var(--lime);
}

.foot-label {
  margin:0 0 0.7rem;
  font:600 0.72rem/1 var(--sans);
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--lime)
}

.foot-links {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0.45rem;
  margin-bottom:1.3rem
}

.foot-links a,.menu-meta a {
  color:inherit;
  text-decoration:none;
  border-bottom:1px solid rgba(231,231,231,0.35);
  padding-bottom:0.05rem;
  transition:color 180ms ease,border-color 180ms ease
}

.foot-links a:hover {
  color:var(--lime);
  border-bottom-color:var(--lime)
}

.menu-meta a {
  color:var(--ink);
  border-bottom-color:var(--line)
}

.foot .pill {
  margin-bottom:0
}

.legal {
  color:rgba(231,231,231,0.62);
  font-size:0.85rem;
  margin:0.15rem 0
}

.menu {
  position:fixed;
  inset:0;
  z-index:30;
  background:var(--paper);
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:1.6rem;
  padding:5.5rem var(--pad) 2rem;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity 420ms ease,visibility 420ms ease
}

.menu.is-open {
  opacity:1;
  visibility:visible;
  pointer-events:auto
}

.menu[hidden] {
  display:none
}

.menu-nav {
  display:flex;
  flex-direction:column
}

.menu-nav a {
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(2.2rem,7vw,4.4rem);
  line-height:0.98;
  letter-spacing:-0.03em;
  color:var(--ink);
  text-decoration:none;
  opacity:0;
  transform:translateY(14px);
  transition:color 180ms ease,opacity 460ms ease,transform 460ms ease
}

.menu.is-open .menu-nav a {
  opacity:1;
  transform:none
}

.menu.is-open .menu-nav a:nth-child(1) { transition-delay:50ms }
.menu.is-open .menu-nav a:nth-child(2) { transition-delay:90ms }
.menu.is-open .menu-nav a:nth-child(3) { transition-delay:130ms }
.menu.is-open .menu-nav a:nth-child(4) { transition-delay:170ms }
.menu.is-open .menu-nav a:nth-child(5) { transition-delay:210ms }

.menu-nav a:hover {
  color:var(--accent)
}

.menu-nav a[aria-current="page"] {
  font-style:italic;
  background:linear-gradient(transparent 62%,var(--lime) 62% 92%,transparent 92%)
}

.menu-meta {
  display:flex;
  flex-wrap:wrap;
  gap:0.6rem 1.2rem;
  opacity:0;
  transform:translateY(8px);
  transition:opacity 420ms ease,transform 420ms ease
}

.menu.is-open .menu-meta {
  opacity:1;
  transform:none;
  transition-delay:120ms
}

body.menu-open {
  overflow:hidden
}

body.menu-open .top {
  z-index:40;
  background:transparent;
  border-color:transparent;
  backdrop-filter:none
}

.lightbox {
  position:fixed;
  inset:0;
  z-index:70;
  background:rgba(18,10,14,0.94);
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center
}

.lightbox[hidden] {
  display:none
}

.lightbox img {
  max-height:88vh;
  max-width:min(92vw,1400px);
  width:auto;
  height:auto;
  justify-self:center;
  border-radius:0.6rem
}

.lightbox button {
  background:transparent;
  color:var(--paper);
  border:0;
  font-size:2.5rem;
  line-height:1;
  min-width:48px;
  min-height:48px
}

.lb-close {
  position:absolute;
  top:0.6rem;
  right:0.6rem
}

body.lb-open {
  overflow:hidden
}

main {
  animation:fade-in 480ms ease
}

body.is-leaving main {
  animation:none;
  opacity:0;
  transition:opacity 260ms ease
}

@media (min-width:860px) {
.fold {
  min-height:calc(100svh - 7.125rem)
}

.logo {
  height:20px
}

.pill-head {
  display:inline-flex
}

.menu-btn {
  display:none
}

.desk-nav {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(0,1fr));
  border-top:1px solid var(--line)
}

.desk-nav a {
  text-align:center;
  text-decoration:none;
  color:var(--ink);
  font:600 0.7rem/1.2 var(--sans);
  letter-spacing:0.12em;
  padding:0.9rem 0.4rem;
  border-right:1px solid var(--line);
  min-height:44px;
  transition:background 180ms ease,color 180ms ease
}

.desk-nav a:hover,.desk-nav a[aria-current="page"] {
  background:var(--lime)
}

.desk-nav a:last-child {
  border-right:0
}

}

@media (max-width:1100px) {
.hero {
  grid-template-columns:1fr;
  padding-top:1.5rem
}

.roles {
  white-space:normal
}

.hero-stage {
  justify-content:flex-start
}

.hero-stage .flower {
  width:min(42vw,180px)
}

.hero-aside {
  max-width:38rem
}

.desk-nav a {
  letter-spacing:0.04em;
  padding:0.75rem 0.35rem
}

}

@media (max-width:859px) {
.logo {
  height:14px
}

.chapters,.ex-index,.tablist,.foot {
  grid-template-columns:1fr
}

.sheet-hero {
  grid-template-columns:1fr;
  align-items:start
}

.sheet-photo {
  width:140px
}

.chapter-link {
  grid-template-columns:104px minmax(0,1fr)
}

.chapter:nth-child(odd) {
  border-right:0
}

.ex-index a:nth-child(odd),.tab:nth-child(odd) {
  border-right:0;
  padding-right:0
}

.ex-index a:nth-child(even),.tab:nth-child(even) {
  padding-left:0
}

.facts div {
  grid-template-columns:1fr;
  gap:0.2rem
}

.film-item img {
  height:42vh
}

.foot-side {
  padding-top:0
}

.foot-name {
  font-size:clamp(2.5rem,16vw,4.25rem)
}

.exhibit h2 {
  font-size:clamp(2.1rem,11vw,3.4rem)
}

.prose .em {
  font-size:1.15rem
}

.lightbox {
  grid-template-columns:44px minmax(0,1fr) 44px
}

.lightbox button {
  font-size:1.75rem;
  min-width:44px;
  padding:0
}

.sheet-photo {
  width:min(140px,38vw)
}

.ribbon-track {
  animation-duration: 100s;
}

}

@media (prefers-reduced-motion:reduce) {
html {
  scroll-behavior:auto
}

.ribbon-track {
  animation:none;
  flex-wrap:wrap;
  width:auto;
  padding-inline:var(--pad)
}

.chapter-media img,.pill,main,body.is-leaving main,.burger,.burger:before,.burger:after,.menu,.menu-nav a,.menu-meta {
  transition:none;
  animation:none
}

.menu-nav a,.menu-meta {
  opacity:1;
  transform:none
}

}

@keyframes fade-in {
from {
  opacity:0
}

to {
  opacity:1
}

}

@keyframes drift {
from {
  transform:translateX(0)
}

to {
  transform:translateX(-50%)
}

}

.missing {
  min-height:calc(100svh - 4.5rem);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  gap:1rem;
  padding:var(--s4) var(--pad) var(--s5)
}

.miss-no {
  margin:0;
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(4.75rem,22vw,11rem);
  line-height:.78;
  letter-spacing:-.045em
}

.missing h1 {
  margin:0;
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(1.85rem,4.6vw,3.35rem);
  line-height:.95;
  letter-spacing:-.03em;
  max-width:14ch
}

.miss-note {
  margin:0;
  max-width:26rem;
  color:var(--muted)
}

.missing .pill {
  margin-top:.35rem
}

.miss-nav {
  display:flex;
  flex-wrap:wrap;
  gap:.75rem 1.35rem;
  margin-top:.65rem;
  max-width:40rem
}

.miss-nav a {
  color:var(--ink);
  text-decoration:none;
  font:600 .72rem/1.2 var(--sans);
  letter-spacing:.12em;
  text-transform:uppercase;
  border-bottom:1px solid var(--line);
  padding-bottom:.15rem
}

.miss-nav a:hover {
  color:var(--accent);
  border-bottom-color:var(--accent)
}

@media (min-width:860px) {
.missing {
  min-height:calc(100svh - 7.125rem);
  padding-top:var(--s5);
  padding-bottom:var(--s5)
}

}

@media (max-width:859px) {
.missing {
  min-height:calc(100dvh - 4.25rem);
  padding:1.75rem var(--pad) 2rem;
  gap:.85rem
}

.miss-no {
  font-size:clamp(4.25rem,28vw,6.5rem)
}

.missing h1 {
  font-size:clamp(1.7rem,7.2vw,2.45rem)
}

.miss-nav {
  gap:.7rem 1rem
}

.miss-nav a {
  letter-spacing:.08em
}

}

@media (max-width:380px) {
.miss-nav a {
  letter-spacing:.04em
}

}