:root {
  --edition-paper: #f3f0e8;
  --edition-ink: #161718;
  --edition-blue: #233dff;
  --edition-blue-deep: #172bd2;
  --edition-lime: #e4ff65;
  --edition-red: #d52431;
  --edition-rule: #c9c6bd;
  --edition-gutter: clamp(1rem, 4vw, 4.5rem);
  --edition-display: 'Archivo Black', 'Arial Black', 'Microsoft YaHei', Arial, sans-serif;
  --edition-mono: 'IBM Plex Mono', 'Courier New', 'Microsoft YaHei', monospace;
}

body, body[data-route] {
  --paper: var(--edition-paper);
  --ink: var(--edition-ink);
  --line: var(--edition-rule);
  --red: var(--edition-red);
  color: var(--edition-ink);
  background: var(--edition-paper);
  max-width: none;
}

.edition-header {
  min-height: 70px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 18px;
  padding: 8px var(--edition-gutter);
  border-bottom: 1px solid var(--edition-ink);
  background: var(--edition-paper);
  color: var(--edition-ink);
}

.edition-brand {
  display: inline-flex;
  width: fit-content;
  align-items: baseline;
  gap: 10px;
  font: 900 clamp(1.15rem, 2.1vw, 1.7rem)/1 var(--edition-display);
  letter-spacing: -.065em;
}
.edition-brand span { font: 700 10px/1.2 var(--edition-mono); letter-spacing: .04em; white-space: nowrap; }
.edition-nav, .edition-actions { display: flex; align-items: center; flex-wrap: wrap; gap: clamp(12px, 2.6vw, 32px); font-size: 13px; font-weight: 700; }
.edition-nav a, .edition-book { padding-block: 9px; white-space: nowrap; }
.edition-nav a[aria-current], .edition-nav a:hover, .edition-book:hover { color: var(--edition-blue-deep); }
.edition-nav a[aria-current] { box-shadow: inset 0 -2px var(--edition-blue); }
.edition-nav a.active:not(.nav-apply)::after { content: none; }
.edition-actions { justify-self: end; gap: clamp(10px, 1.4vw, 22px); }
.edition-book { display: inline-flex; align-items: center; gap: 7px; }
.edition-book span { color: var(--edition-blue-deep); font: 700 10px/1 var(--edition-mono); }
.edition-cap { align-items: center; gap: 5px; color: inherit; font-size: 12px; white-space: nowrap; }
.edition-cap img { display: block; width: 37px; height: 35px; object-fit: contain; }
.edition-cap:hover { color: var(--edition-red); }
.edition-header :focus-visible, .edition-index :focus-visible, .edition-footer :focus-visible { outline: 2px solid var(--edition-blue); outline-offset: 4px; }

.residents-hero {
  --resident-ink: var(--edition-ink);
  --resident-card-width: clamp(11.5rem, min(23vw, 43dvh), 21rem);
  display: grid;
  grid-template-columns: minmax(15rem, 30%) minmax(0, 1fr);
  grid-template-areas: "intro stage" "credit controls";
  grid-template-rows: minmax(27rem, auto) auto;
  padding: 0;
  color: var(--edition-ink);
  background: var(--edition-paper);
  border-bottom: 1px solid var(--edition-ink);
}
.residents-intro {
  display: grid;
  align-content: center;
  justify-content: start;
  gap: 0;
  width: auto;
  margin: 0;
  padding: clamp(1.5rem, 4.8vw, 4.6rem) 1rem clamp(1.5rem, 3vw, 3rem) var(--edition-gutter);
  border-right: 1px solid var(--edition-ink);
}
.residents-intro .residents-series {
  color: var(--edition-ink);
  font: 700 11px/1.3 var(--edition-mono);
  letter-spacing: .09em;
  margin: 0 0 clamp(1rem, 2vw, 2rem);
}
.residents-intro .residents-series span { color: var(--edition-blue-deep); }
.residents-intro h1 {
  font-family: var(--edition-display);
  font-size: clamp(3.35rem, 1.35rem + 5.2vw, 8.15rem);
  font-weight: 900;
  letter-spacing: -.105em;
  line-height: .95;
  white-space: nowrap;
}
.residents-intro h1 span { color: var(--edition-blue-deep); }
.residents-intro p.residents-description { margin: 20px 0 22px; color: #3f413d; font-size: clamp(.875rem, .68rem + .45vw, 1.1rem); line-height: 1.65; }
.residents-inspect, .resident-collect {
  width: fit-content;
  min-height: 46px;
  padding: 11px 15px;
  border: 1px solid var(--edition-ink);
  border-radius: 0;
  color: var(--edition-paper);
  background: var(--edition-ink);
}
.residents-inspect:hover, .resident-collect:hover { background: var(--edition-blue-deep); }
.residents-inspect span { margin-inline-start: 18px; }

.residents-stage {
  position: relative;
  min-width: 0;
  display: grid;
  align-items: center;
  background:
    repeating-radial-gradient(ellipse at 50% 75%, #fff0 0 32px, #d6d6ff3f 33px 34px, #fff0 35px 62px),
    radial-gradient(ellipse at 52% 57%, #515dff, #233dff 53%, #1425ba);
}
.residents-track {
  width: 100%;
  min-width: 0;
  gap: clamp(1rem, 3.4vw, 3.7rem);
  padding-block: clamp(2.4rem, 6vw, 6.2rem);
}
.residents-controls {
  display: flex;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 6px clamp(12px, 3.2vw, 44px);
  border-top: 1px solid #adb4ff8c;
  color: white;
  background: #192dbd;
}
.residents-transport button { border: 1px solid #a0aaff; border-radius: 0; background: transparent; }
.residents-transport button:hover:not(:disabled) { background: #fff; color: var(--edition-blue-deep); }
.residents-pager button::before { background: #919efd; border-radius: 0; }
.residents-pager button[aria-current='true']::before { background: var(--edition-lime); }
.residents-credit { display: flex; align-items: center; width: auto; margin: 0; padding: 12px 12px 12px var(--edition-gutter); border-right: 1px solid var(--edition-ink); color: #4f504b; font-size: 11px; }
.residents-stage :focus-visible, .residents-controls :focus-visible { outline-color: var(--edition-lime); }

.resident-card,
.resident-slide[data-resident-id='nr-002'] .resident-card {
  --card-trim: #e2ff65;
  padding: 8px;
  border: 1px solid #f4ffd2;
  border-radius: 9px;
  background: linear-gradient(145deg, #e8ff9d 0%, #8b9da0 36%, #2e3549 63%, #bbbaff 86%, #e4ff65);
  box-shadow: 0 15px 24px #090c4270, inset 0 0 0 2px #1e2241;
}
.resident-slide[data-resident-id='nr-001'] .resident-card { background: linear-gradient(150deg,#fff4d8,#b8ada4,#3d3a4c,#e1d7d0); }
.resident-slide[data-resident-id='nr-003'] .resident-card { background: linear-gradient(150deg,#fff4ec,#cc8c91,#502b54,#e6c1bd); }
.resident-image { aspect-ratio: 5 / 6; border-radius: 4px; }
.resident-card .resident-image::after { opacity: .12; }
.resident-card.is-lit .resident-image::after { opacity: .53; }
.resident-card figcaption {
  inset: auto 8px 8px;
  min-height: 44px;
  padding: 9px 10px;
  border: 1px solid #20272c;
  border-radius: 0 0 3px 3px;
  color: var(--edition-ink);
  background: var(--edition-lime);
}
.resident-slide[data-resident-id='nr-001'] figcaption { background: #f4e4ca; }
.resident-slide[data-resident-id='nr-003'] figcaption { background: #f2c3bc; }
.resident-card figcaption strong { font-size: clamp(.8rem, 1.5vw, 1.2rem); }

.edition-index { padding: clamp(32px, 5vw, 76px) var(--edition-gutter); }
.edition-index-heading { display: flex; align-items: end; justify-content: space-between; gap: 15px; margin-bottom: 24px; }
.edition-index-heading h2 { font: 900 clamp(2rem, 1.2rem + 3.6vw, 4.5rem)/1.05 var(--edition-display); letter-spacing: -.075em; }
.edition-index-heading h2 span { color: var(--edition-blue-deep); }
.edition-index-heading a { padding-bottom: 4px; border-bottom: 1px solid; font-size: 13px; white-space: nowrap; }
.edition-index-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 2.4vw, 36px); }
.edition-feature { display: block; min-width: 0; border: 1px solid var(--edition-ink); }
.edition-feature-art { display: grid; position: relative; isolation: isolate; align-items: center; aspect-ratio: 16 / 10; overflow: clip; padding: 0 9%; border-bottom: 1px solid var(--edition-ink); }
.edition-feature-village .edition-feature-art { background: var(--edition-lime); }
.edition-feature-village .edition-feature-art img { position: absolute; right: -12%; width: 78%; height: 110%; object-fit: contain; mix-blend-mode: multiply; z-index: -1; }
.edition-feature-village .edition-feature-art span { font: 900 clamp(2.2rem, 5.5vw, 5.7rem)/.9 var(--edition-display); letter-spacing: -.09em; }
.edition-feature-time .edition-feature-art { color: white; background: var(--edition-blue-deep); }
.edition-feature-time .edition-feature-art span { font: 700 clamp(2rem, 5vw, 5.4rem)/1 var(--edition-mono); letter-spacing: -.09em; }
.edition-feature-time .edition-feature-art i { position: absolute; inset: auto 0 12% 0; height: 14%; background: repeating-linear-gradient(90deg, #bac7ff 0 1px, transparent 1px 3.75%); }
.edition-feature-cap .edition-feature-art { background: #f6c3ba; place-items: center; }
.edition-feature-cap .edition-feature-art img { position: absolute; inset: 0 7%; display: block; width: 86%; height: 100%; object-fit: contain; filter: drop-shadow(0 9px 9px #66231f60); }
.edition-feature-caption { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 15px; }
.edition-feature-caption h3 { font-size: clamp(1.05rem, 1.8vw, 1.6rem); margin: 0 0 4px; font-weight: 800; }
.edition-feature-caption p { margin: 0; color: #50534e; font-size: 12px; }
.edition-feature-caption > span { font-size: 22px; }
.edition-feature:hover .edition-feature-caption { color: var(--edition-blue-deep); background: #e7e9ff; }

.edition-footer { display: flex; justify-content: space-between; align-items: end; gap: 20px; padding: 36px var(--edition-gutter); background: var(--edition-ink); color: var(--edition-paper); }
.edition-footer-wordmark { display: inline-block; font: 900 clamp(1.8rem, 5.3vw, 5rem)/1 var(--edition-display); letter-spacing: -.075em; }
.edition-footer p { margin: 9px 0 0; font-size: 12px; }
.edition-footer nav { display: flex; flex-wrap: wrap; gap: 10px 18px; font-size: 12px; }
.edition-footer button { padding: 0; background: none; color: inherit; font: inherit; }
.edition-footer nav > a { padding: 0; border: 0; }

@media (max-width: 840px) {
  .edition-header { grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; }
  .edition-nav { grid-area: 2 / 1 / 3 / -1; flex-direction: row; align-items: center; padding: 0; }
  .edition-nav > a { border: 0; }
  .edition-actions { grid-area: 1 / 2; }
  .edition-brand span { display: none; }
}
@media (prefers-reduced-motion: no-preference) {
  .edition-cap img { animation: cap-turn 7s linear infinite; }
  .edition-cap:hover img, .edition-cap:focus-visible img { animation-play-state: paused; }
}
@media (max-width: 650px) {
  .residents-hero {
    --resident-card-width: clamp(10.4rem, 55vw, 14rem);
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    grid-template-areas: "intro" "stage" "controls" "credit";
  }
  .residents-intro { grid-template-columns: minmax(0, 1fr) auto; padding: 22px var(--edition-gutter) 20px; border-right: 0; align-items: end; column-gap: 10px; }
  .residents-intro .residents-series { grid-column: 1 / -1; margin-bottom: 12px; }
  .residents-intro h1 { grid-column: 1 / -1; font-size: clamp(2.55rem, 1.4rem + 6.2vw, 4.25rem); }
  .residents-intro h1 br { display: none; }
  .residents-intro p.residents-description { margin: 12px 0 0; }
  .residents-intro p br { display: none; }
  .residents-inspect { padding-inline: 8px; align-self: end; }
  .residents-inspect span { margin-inline-start: 2px; }
  .residents-track { padding-block: 26px; }
  .residents-credit { padding: 9px var(--edition-gutter); border-right: 0; }
  .residents-transport button { min-width: 40px; min-height: 40px; }
  .edition-index-grid { grid-template-columns: minmax(0, 1fr); }
  .edition-feature-art { aspect-ratio: 2.2; }
  .edition-footer { align-items: start; flex-direction: column; }
}

/* The same edition grid and typography carry through to the inner pages. */
.edition-section-head {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  align-items: end;
  gap: 1.5rem;
  padding: clamp(2.25rem, 6vw, 6.25rem) var(--edition-gutter);
  border-bottom: 1px solid var(--edition-ink);
}
.edition-kicker { margin: 0 0 18px; font: 700 .7rem/1.4 var(--edition-mono); letter-spacing: .14em; }
.edition-section-head h1, .collection-heading h1 {
  font: 900 clamp(3rem, 1.8rem + 6vw, 7.5rem)/.97 var(--edition-display);
  letter-spacing: -.095em;
}
.edition-section-head h1 span { color: var(--edition-blue-deep); }
.edition-section-head > div + div p, .edition-section-head .intro-note { font-size: clamp(.9rem, .75rem + .35vw, 1.1rem); line-height: 1.7; max-width: 25rem; }
.edition-text-link { display: inline-block; margin-top: 18px; padding-bottom: 5px; border-bottom: 1px solid; font-size: 14px; font-weight: 700; }
.edition-archive-head { color: #fff; background: var(--edition-blue-deep); }
.edition-archive-head h1 span { color: var(--edition-lime); }
.edition-notes-head { background: var(--edition-lime); }
.edition-expert-head { background: #f5c3bb; }
.edition-expert-head h1 span { color: var(--edition-red); }

.collection-view { min-height: 60vh; color: var(--edition-ink); background: var(--edition-paper); }
.collection-page { width: auto; padding: 30px var(--edition-gutter) 60px; }
.collection-home, .collection-progress, .collection-foot { color: #494b47; }
.collection-heading { padding-bottom: 22px; border-bottom: 1px solid var(--edition-ink); }
.collection-heading .residents-series, .collection-progress strong { color: var(--edition-ink); }
.collection-heading h1 span { color: var(--edition-blue-deep); }
.collection-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 970px; }
.collection-placeholder {
  aspect-ratio: 5 / 6;
  border: 1px dashed #6570c0;
  border-radius: 8px;
  background: repeating-linear-gradient(135deg,#e6e8fd 0 8px,#eeeefa 8px 16px);
  color: #25379e;
}
.collection-placeholder b { color: var(--edition-blue); }
.collection-slot:hover .collection-placeholder { border-color: var(--edition-blue-deep); background: #e1e4ff; }
.collection-slot-caption { border-bottom: 1px solid var(--edition-rule); padding-bottom: 8px; }
.collection-slot-caption span { color: #51544e; }
#resident-card-dialog { border-radius: 0; border-color: var(--edition-ink); color: var(--edition-ink); background: var(--edition-paper); }
.resident-detail-close button { border-radius: 0; border: 1px solid var(--edition-ink); background: transparent; }
.resident-detail-info .residents-series { color: var(--edition-blue-deep); }
.resident-detail-edition, .resident-detail-cardbook { color: #454645; }
.resident-collect-status { color: var(--edition-blue-deep); }
.resident-flip-button, .resident-collect.is-collected { border-radius: 0; border-color: var(--edition-ink); background: transparent; color: var(--edition-ink); }
.resident-flip-button:hover, .resident-collect.is-collected:hover { background: #e4e8ff; }
.resident-detail-back { color: #fff; border-color: #cad1ff; background: radial-gradient(ellipse at 20% 0%, #5364ff, #233dff 55%, #17279e); }
.resident-detail-back .residents-series, .resident-back-number, .resident-detail-back small { color: var(--edition-lime); }

.archive-collection { padding-inline: var(--edition-gutter); }
.archive-toolbar > span:last-child, .archive-toolbar { color: #50534c; }
.archive-photo-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 2vw, 24px); }
.archive-photo-grid .portrait-crop, .cap-detail-tile { aspect-ratio: 4 / 5; border: 1px solid var(--edition-ink); }
.archive-photo-grid .portrait-crop img { object-fit: cover; }
.archive-photo-grid .cap-detail-tile { background: #f3c3bb; }
.archive-photo-grid .wearer-card > span { border-bottom: 1px solid var(--edition-rule); }

.product { border-bottom: 1px solid var(--edition-ink); }
.product .product-photo {
  display: grid;
  place-items: center;
  min-height: 280px;
  height: auto;
  aspect-ratio: 1 / 1;
  padding: 10%;
  background: #f3c3bb;
  border: 1px solid var(--edition-ink);
}
.product .product-photo img { width: 100%; height: 100%; }
.product-info .cap-slogan { font-family: var(--edition-display); font-weight: 900; }
.product-info .cap-brand-line { color: var(--edition-blue-deep); }
.cap-promise, .agreements { color: white; background: var(--edition-blue-deep); }
.cap-promise p, .agreements article p, .agreements .eyebrow { color: #e3e7ff; }
.cap-promise h2, .agreements h2 { font-family: var(--edition-display); font-weight: 900; }
.expert-question-grid { gap: 1px; border: 1px solid var(--edition-rule); background: var(--edition-rule); }
.expert-question-grid .expert-question { border: 0; background: var(--edition-paper); }
.expert-question-grid .expert-question:hover { background: var(--edition-lime); }
.expert-question-grid h3 { font-weight: 800; }
.first-people { background: #dfe5ff; border-block: 1px solid var(--edition-rule); }
.first-people .profile-preview, .apply-layout .form-panel { background: #fffdf6; border: 1px solid var(--edition-ink); }
.apply-intro h1 { font-family: var(--edition-display); font-weight: 900; }
.apply-intro h1 span { color: var(--edition-blue-deep); font-family: inherit; }
.living-content .filters button.active { background: var(--edition-blue-deep); border-color: var(--edition-blue-deep); color: white; }
.living-content .journal-art { color: var(--edition-ink); background: #dfe5ff; }
.living-content .journal-card:nth-child(even) .journal-art { background: var(--edition-lime); }

#redcap-menu.edition-cap-menu {
  width: min(92%, 750px);
  max-height: calc(100dvh - 24px);
  color: var(--edition-ink);
  background: var(--edition-paper);
  border: 1px solid var(--edition-ink);
  border-radius: 0;
}
#redcap-menu.edition-cap-menu[open] { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); }
#redcap-menu .redcap-close { background: var(--edition-paper); color: var(--edition-ink); border: 1px solid; }
#redcap-menu .redcap-visual { min-height: 290px; display: grid; place-items: center; background: #f4c5bc; padding: 10%; }
#redcap-menu .redcap-visual img { width: 100%; height: auto; object-fit: contain; }
#redcap-menu .redcap-visual small { position: static; color: #493831; }
#redcap-menu .redcap-links { padding: clamp(24px, 5vw, 52px); color: var(--edition-ink); }
#redcap-menu .redcap-links h2 { margin: 15px 0 20px; font-family: var(--edition-display); font-weight: 900; }
#redcap-menu .redcap-links nav a { display: flex; justify-content: space-between; grid-template-columns: none; color: inherit; border-color: var(--edition-rule); }
#redcap-menu .redcap-links nav a:hover { color: var(--edition-blue-deep); }

.edition-village .cl-masthead { align-items: end; padding: clamp(26px, 5.5vw, 78px) var(--edition-gutter); background: var(--edition-lime); }
.edition-village .cl-masthead h1, .edition-village .village-heading h1, .edition-village .place-heading h1, .edition-village .mine-heading h1 {
  font: 900 clamp(3rem, 1.8rem + 6vw, 7.5rem)/.97 var(--edition-display);
  letter-spacing: -.085em;
}
.edition-village .cl-masthead h1 span, .edition-village .village-heading h1 span, .edition-village .place-heading h1 span { color: var(--edition-blue-deep); }
.edition-village .cl-masthead .eyebrow, .edition-village .poster-top, .edition-village .poster-bottom { font-family: var(--edition-mono); }
.edition-village .village-feature { padding-inline: var(--edition-gutter); gap: clamp(22px, 5vw, 65px); }
.edition-village .village-poster {
  min-height: clamp(300px, 38vw, 490px);
  color: #fff;
  background: radial-gradient(ellipse at 80% 90%, #5365ff, #263dff 60%, #1428c5);
}
.edition-village .village-word { font-family: var(--edition-display); font-weight: 900; }
.edition-village .village-word span { color: var(--edition-lime); }
.edition-village .feature-copy h2, .edition-village .section-head h2, .edition-village .place-card h3 { font-weight: 800; }
.edition-village .collection-tools { gap: 15px; }
.edition-village .place-card { border-bottom: 1px solid var(--edition-rule); padding-bottom: 10px; }
.edition-village .place-art { background: #e2e6ff; color: #1c29ad; }
.edition-village .art-experience { background: var(--edition-lime); color: var(--edition-ink); }
.edition-village .art-service { background: #f7c6bd; color: #521c23; }
.edition-village .cl-connections { background: #e5e9ff; }

.edition-day .day-intro { color: white; background: var(--edition-blue-deep); }
.edition-day .day-intro h1 { margin: 0; font: 900 clamp(2.7rem, 1.5rem + 5vw, 6.7rem)/.99 var(--edition-display); letter-spacing: -.08em; }
.edition-day .day-intro h1 span { color: var(--edition-lime); }
.edition-day .day-intro .intro-note { color: #ebedff; }
.edition-day .edition-action { border: 1px solid var(--edition-ink); color: var(--edition-ink); font-size: 12px; }
.edition-day .edition-action:hover { background: var(--edition-lime); }
.edition-day .day-channel-bar { background: var(--edition-paper); border-color: var(--edition-ink); }
.edition-day .channels button { color: var(--edition-ink); }
.edition-day .channels button[aria-pressed='true'] { background: var(--edition-lime); color: var(--edition-ink); }
.edition-day .channels button[aria-pressed='true'] span, .edition-day .channels button[aria-pressed='true'] small { color: inherit; }
.edition-day .local-badge { color: #444642; }
.edition-day .film { color: #fff; background-color: #19274d; }
.edition-day .timeline-panel, .edition-day .local-clips { color: var(--edition-ink); border-color: var(--edition-rule); }
.edition-day .transport-actions button { border-color: #65675f; color: var(--edition-ink); }
.edition-day .transport-actions button:hover { background: var(--edition-lime); color: var(--edition-ink); }
.edition-day #minute-input { color: var(--edition-ink); }
.edition-day .time-readout > input { color-scheme: light; }
.edition-day .time-readout > span, .edition-day .time-readout > b,
.edition-day .hour-labels, .edition-day .timeline-footer,
.edition-day .day-message, .edition-day .local-clips .text-button,
.edition-day #no-clips, .edition-day #collection-count { color: #555952; }
.edition-day .day-footer { color: #fff; background: var(--edition-ink); }

@media (max-width: 720px) {
  .edition-section-head { grid-template-columns: minmax(0, 1fr); }
  .edition-section-head h1 br { display: none; }
  .archive-photo-grid, .collection-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 500px) {
  #redcap-menu.edition-cap-menu[open] { grid-template-columns: minmax(0, 1fr); }
  #redcap-menu .redcap-visual { min-height: 0; padding: 15px; }
  #redcap-menu .redcap-visual img { max-height: 145px; }
  .edition-nav { gap: 15px; font-size: 12px; }
  .edition-actions .edition-book { font-size: 11px; }
}
