:root {
  color-scheme: dark;
  --void: #020101;
  --void-soft: #070203;
  --iron: #100306;
  --panel: #170308;
  --bone: #f7ebe5;
  --paper: #e6d2ca;
  --ash: #b19b97;
  --smoke: #715c5c;
  --red: #f20d2d;
  --red-hot: #ff2949;
  --red-dark: #68000f;
  --line: rgba(255, 27, 59, .42);
  --hairline: rgba(241, 231, 220, .12);
  --emoji: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Twemoji Mozilla";
  --display: "Arial Black", "Franklin Gothic Heavy", Impact, var(--emoji), sans-serif;
  --condensed: "Bahnschrift Condensed", "Arial Narrow", var(--emoji), sans-serif;
  --sans: "Segoe UI", Helvetica, Arial, var(--emoji), sans-serif;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, var(--emoji), serif;
  --wide: 1480px;
  --reading: 760px;
}

* { box-sizing: border-box; }

html {
  background: var(--void);
  scroll-behavior: smooth;
  scrollbar-color: var(--red-dark) var(--void);
}

body {
  min-width: 320px;
  margin: 0;
  overflow-x: hidden;
  color: var(--bone);
  background:
    radial-gradient(circle at 82% 7%, rgba(205, 0, 31, .18), transparent 34rem),
    radial-gradient(circle at 7% 78%, rgba(121, 0, 18, .16), transparent 30rem),
    linear-gradient(118deg, rgba(72, 0, 11, .08), transparent 30%, transparent 68%, rgba(112, 0, 17, .07)),
    var(--void);
  font-family: var(--sans);
  line-height: 1.55;
}

body::before {
  position: fixed;
  z-index: -2;
  inset: 0;
  content: "";
  background:
    linear-gradient(90deg, transparent calc(50% - .5px), rgba(255,30,58,.035) 50%, transparent calc(50% + .5px)),
    linear-gradient(transparent calc(50% - .5px), rgba(255,255,255,.015) 50%, transparent calc(50% + .5px));
  background-size: 68px 68px;
  mask-image: radial-gradient(circle at 50% 30%, black, transparent 82%);
  pointer-events: none;
}

body::after {
  position: fixed;
  z-index: -1;
  inset: 0;
  content: "";
  background: radial-gradient(circle at 50% 45%, transparent 30%, rgba(0, 0, 0, .72) 100%);
  pointer-events: none;
}

::selection { color: white; background: var(--red-dark); }
a { color: inherit; }
button, input { font: inherit; }
button { color: inherit; }
img, video { max-width: 100%; }
img { display: block; height: auto; }
picture { display: block; }

.noise {
  position: fixed;
  z-index: 200;
  inset: 0;
  opacity: .052;
  pointer-events: none;
  background-image:
    radial-gradient(circle at 20% 30%, white 0 .4px, transparent .5px),
    radial-gradient(circle at 70% 60%, white 0 .35px, transparent .45px);
  background-size: 5px 5px, 7px 7px;
  mix-blend-mode: screen;
}

.skip-link {
  position: fixed;
  z-index: 500;
  top: -5rem;
  left: 1rem;
  padding: .75rem 1rem;
  color: var(--void);
  background: var(--bone);
}

.skip-link:focus { top: 1rem; }

.site-header {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  width: 100%;
  min-height: 78px;
  padding: 0 clamp(1rem, 3vw, 3.5rem);
  border-bottom: 1px solid var(--hairline);
  background: rgba(2, 1, 1, .91);
  box-shadow: 0 12px 48px rgba(0, 0, 0, .52), inset 0 -1px 0 rgba(242, 13, 45, .2);
  backdrop-filter: blur(20px) saturate(120%);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  width: max-content;
  text-decoration: none;
}

.brand-logo {
  display: block;
  filter:
    drop-shadow(0 0 1px rgba(255, 255, 255, .98))
    drop-shadow(0 0 7px rgba(255, 255, 255, .76))
    drop-shadow(0 0 20px rgba(255, 255, 255, .32));
}

.brand-mark {
  width: 54px;
  height: 48px;
  object-fit: contain;
}

.brand-name {
  font-family: var(--condensed);
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .24em;
  text-transform: uppercase;
}

.header-state {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  color: var(--smoke);
  font-family: var(--condensed);
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.pulse {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--red-hot);
  box-shadow: 0 0 0 5px rgba(239, 23, 47, .1), 0 0 14px var(--red);
  animation: pulse 2.4s ease-in-out infinite;
}

.site-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(.8rem, 2.2vw, 2.4rem);
}

.site-nav a,
.site-nav button {
  padding: .5rem 0;
  border: 0;
  color: var(--ash);
  background: none;
  font-family: var(--condensed);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
}

.site-nav a:hover,
.site-nav a[aria-current="page"],
.site-nav button:hover { color: var(--red-hot); }
.site-nav kbd {
  margin-left: .35rem;
  padding: .08rem .32rem;
  border: 1px solid var(--hairline);
  color: var(--smoke);
  background: var(--void);
  font: inherit;
}

main { min-height: 80vh; }

.kicker {
  margin: 0 0 1.2rem;
  color: var(--red-hot);
  font-family: var(--condensed);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .28em;
  text-transform: uppercase;
}

[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1);
}

[data-reveal].revealed { opacity: 1; transform: none; }

/* Landing */

.landing {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(330px, .55fr);
  gap: clamp(3rem, 8vw, 9rem);
  align-items: center;
  width: min(var(--wide), calc(100% - 2rem));
  min-height: 100svh;
  margin: auto;
  padding: 130px clamp(0rem, 2vw, 2rem) 70px;
  isolation: isolate;
}

.landing::before {
  position: absolute;
  z-index: 0;
  top: 12%;
  right: -7%;
  width: 55%;
  height: 74%;
  content: "";
  background: linear-gradient(145deg, rgba(242, 13, 45, .22), rgba(91, 0, 13, .04) 56%, transparent 57%);
  clip-path: polygon(21% 0, 100% 0, 100% 100%, 2% 100%, 27% 70%, 10% 46%, 35% 25%);
  filter: drop-shadow(-22px 0 55px rgba(242, 13, 45, .18));
  pointer-events: none;
}

.landing-copy { position: relative; z-index: 3; }

.landing-brand {
  position: relative;
  width: min(920px, 100%);
  margin: 0;
  line-height: 0;
}

.landing-wordmark {
  width: 108%;
  height: auto;
  margin: -12% 0 -10% -4%;
  filter:
    drop-shadow(0 0 1px rgba(255, 255, 255, 1))
    drop-shadow(0 0 10px rgba(255, 255, 255, .82))
    drop-shadow(0 0 32px rgba(255, 255, 255, .4));
}

.landing-line {
  margin: clamp(2.5rem, 5vw, 5rem) 0 .45rem;
  font-family: var(--serif);
  font-size: clamp(1.6rem, 3vw, 3rem);
  font-style: italic;
  letter-spacing: -.03em;
  color: #fff6f1;
  text-shadow: 0 2px 0 #350008, 0 0 24px rgba(242, 13, 45, .22);
}

.landing-dek {
  max-width: 620px;
  margin: 0;
  color: var(--ash);
  font-size: clamp(.98rem, 1.4vw, 1.15rem);
}

.landing-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1.3rem;
  align-items: center;
  margin-top: 2.4rem;
}

.primary-action {
  position: relative;
  padding: 1rem 1.4rem;
  overflow: hidden;
  border: 1px solid var(--red);
  color: white;
  background: linear-gradient(120deg, #7b0013, #b4001d);
  font-family: var(--condensed);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .16em;
  text-decoration: none;
  text-transform: uppercase;
  clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 15px, 100% 100%, 0 100%);
  box-shadow: inset 0 -12px 30px rgba(0, 0, 0, .35), 0 0 24px rgba(242, 13, 45, .14);
}

.primary-action::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,.24), transparent 60%);
  transform: translateX(-120%);
  transition: transform .45s ease;
}

.primary-action:hover::after { transform: translateX(120%); }

.text-action {
  padding: .7rem 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: none;
  font-family: var(--condensed);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  cursor: pointer;
}

.text-action:hover { color: var(--red-hot); }

.landing-rupture {
  position: absolute;
  z-index: 1;
  top: 8%;
  right: 18%;
  width: min(540px, 44vw);
  height: 82%;
  overflow: hidden;
  transform: skewX(-7deg) rotate(-2deg);
  pointer-events: none;
}

.landing-rupture::before,
.landing-rupture::after {
  position: absolute;
  inset: 0;
  content: "";
}

.landing-rupture::before {
  background:
    linear-gradient(138deg, rgba(255, 38, 69, .76), rgba(129, 0, 20, .42) 38%, rgba(28, 0, 5, .1) 72%),
    repeating-linear-gradient(105deg, rgba(255,255,255,.1) 0 1px, transparent 1px 26px);
  clip-path: polygon(32% 0, 100% 0, 78% 21%, 100% 39%, 67% 58%, 91% 72%, 54% 100%, 0 100%, 24% 74%, 3% 51%, 37% 31%, 18% 16%);
  opacity: .52;
  filter: drop-shadow(0 0 40px rgba(242, 13, 45, .42));
}

.landing-rupture::after {
  background:
    linear-gradient(67deg, transparent 42%, rgba(255, 53, 81, .25) 42% 43%, transparent 43%),
    linear-gradient(118deg, transparent 59%, rgba(255,255,255,.1) 59% 59.4%, transparent 59.4%);
  clip-path: polygon(9% 0, 100% 0, 100% 100%, 0 100%);
}

.landing-rupture i {
  position: absolute;
  display: block;
  background: linear-gradient(135deg, rgba(255, 32, 62, .88), rgba(88, 0, 13, .08));
  box-shadow: 0 0 46px rgba(242, 13, 45, .2);
}

.landing-rupture i:nth-child(1) { top: 8%; right: 4%; width: 64%; height: 16%; clip-path: polygon(13% 0, 100% 0, 83% 100%, 0 69%); opacity: .26; }
.landing-rupture i:nth-child(2) { top: 40%; left: 1%; width: 78%; height: 13%; clip-path: polygon(21% 0, 100% 35%, 83% 100%, 0 61%); opacity: .34; }
.landing-rupture i:nth-child(3) { right: 10%; bottom: 7%; width: 72%; height: 18%; clip-path: polygon(0 30%, 78% 0, 100% 71%, 17% 100%); opacity: .22; }
}

.latest-signal {
  position: relative;
  z-index: 2;
  align-self: end;
  display: grid;
  grid-template-rows: minmax(270px, 45vh) auto auto auto;
  min-height: 560px;
  padding: .8rem;
  border: 1px solid var(--line);
  background: rgba(7, 2, 3, .88);
  box-shadow: 0 34px 90px rgba(0, 0, 0, .52), inset 0 0 60px rgba(104, 0, 15, .12);
  text-decoration: none;
  clip-path: polygon(0 0, calc(100% - 36px) 0, 100% 36px, 100% 100%, 0 100%);
}

.latest-signal::before {
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  width: 36px;
  height: 36px;
  content: "";
  border-left: 1px solid var(--line);
  background: rgba(239,23,47,.12);
}

.latest-image { position: relative; min-height: 0; overflow: hidden; background: var(--iron); }
.latest-image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; filter: grayscale(1) contrast(1.18) brightness(.72); transition: filter .45s ease, transform .6s cubic-bezier(.2,.7,.2,1); }
.latest-image::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, rgba(5,3,4,.05), rgba(5,3,4,.76)), linear-gradient(120deg, rgba(239,23,47,.25), transparent 55%);
  mix-blend-mode: screen;
}
.latest-image i { position: absolute; z-index: 2; inset: 10%; border: 1px solid rgba(255,255,255,.16); clip-path: polygon(0 0, 25% 0, 25% 1px, 1px 1px, 1px 25%, 0 25%, 0 0, 100% 0, 100% 25%, calc(100% - 1px) 25%, calc(100% - 1px) 1px, 75% 1px, 75% 0, 100% 0, 100% 100%, 75% 100%, 75% calc(100% - 1px), calc(100% - 1px) calc(100% - 1px), calc(100% - 1px) 75%, 100% 75%, 100% 100%, 0 100%, 0 75%, 1px 75%, 1px calc(100% - 1px), 25% calc(100% - 1px), 25% 100%, 0 100%); }
.latest-label { margin: 1.1rem .5rem .75rem; color: var(--red-hot); font-family: var(--condensed); font-size: .64rem; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.latest-signal strong { display: -webkit-box; margin: 0 .5rem; overflow: hidden; font-family: var(--serif); font-size: clamp(1.7rem, 2.6vw, 2.8rem); line-height: 1; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.latest-signal em { margin: .8rem .5rem .6rem; color: var(--ash); font-family: var(--serif); font-size: .92rem; font-style: normal; }
.latest-signal:hover { color: inherit; border-color: var(--red); }
.latest-signal:hover img { filter: grayscale(.35) contrast(1.05) brightness(.85); transform: scale(1.03); }

.landing-coordinates {
  position: absolute;
  right: 0;
  bottom: 1rem;
  left: 0;
  display: flex;
  justify-content: space-between;
  color: #403637;
  font-family: var(--condensed);
  font-size: .56rem;
  letter-spacing: .2em;
}

.signal-strip {
  overflow: hidden;
  border-block: 1px solid var(--line);
  color: var(--red-hot);
  background: linear-gradient(90deg, #030101, #170207 48%, #030101);
  font-family: var(--display);
  font-size: clamp(1rem, 2.2vw, 2rem);
  letter-spacing: .095em;
  text-shadow: 0 0 18px rgba(242, 13, 45, .34);
  text-transform: uppercase;
  white-space: nowrap;
}

.signal-strip div { display: flex; gap: 2rem; align-items: center; width: max-content; padding: 1rem 0; animation: signal 24s linear infinite; }
.signal-strip i { width: 42px; height: 5px; background: var(--red-dark); transform: skewX(-28deg); }

.feature-section,
.transmission-section,
.year-ledger {
  width: min(var(--wide), calc(100% - 2rem));
  margin: auto;
  padding: clamp(6rem, 11vw, 11rem) 0;
}

.section-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .45fr);
  column-gap: clamp(2rem, 8vw, 8rem);
  align-items: end;
  margin-bottom: clamp(3rem, 7vw, 6rem);
}

.section-intro .kicker { grid-column: 1 / -1; }
.section-intro h2,
.series-heading h2,
.year-ledger h2 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(4rem, 10vw, 9.5rem);
  letter-spacing: -.06em;
  line-height: .77;
  text-transform: uppercase;
}

.section-intro > p:last-child,
.series-heading > p:last-child { max-width: 500px; margin: 0; color: var(--ash); }

.feature-wall {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: minmax(240px, 34vw) minmax(220px, 27vw);
  gap: 1rem;
}

.story-visual {
  position: relative;
  display: block;
  min-height: 300px;
  overflow: hidden;
  border: 1px solid var(--hairline);
  background: var(--iron);
  text-decoration: none;
}

.story-visual > img,
.story-visual > .visual-fallback { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; filter: grayscale(1) contrast(1.2) brightness(.64); transition: transform .7s cubic-bezier(.2,.7,.2,1), filter .5s ease; }
.story-visual .visual-shade { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 25%, rgba(5,3,4,.95)), linear-gradient(115deg, rgba(239,23,47,.28), transparent 55%); }
.story-visual .visual-index { position: absolute; top: 1.2rem; left: 1.2rem; color: white; font-family: var(--condensed); font-size: .6rem; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.story-visual .visual-copy { position: absolute; right: 1.5rem; bottom: 1.5rem; left: 1.5rem; display: grid; gap: .7rem; }
.story-visual .visual-copy b { max-width: 760px; font-family: var(--serif); font-size: clamp(1.6rem, 3.1vw, 3.8rem); line-height: .96; }
.story-visual .visual-copy em { max-width: 580px; color: var(--ash); font-size: .86rem; font-style: normal; }
.story-visual .visual-arrow { position: absolute; top: 1rem; right: 1rem; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--line); color: var(--red-hot); }
.story-visual:hover { color: inherit; border-color: var(--red); }
.story-visual:hover > img { transform: scale(1.035); filter: grayscale(.25) contrast(1.05) brightness(.78); }
.feature-1 { grid-column: 1 / span 8; grid-row: 1; }
.feature-2 { grid-column: 9 / -1; grid-row: 1 / -1; }
.feature-3 { grid-column: 1 / span 5; grid-row: 2; }
.feature-4 { grid-column: 6 / span 3; grid-row: 2; }
.feature-4 .visual-copy em { display: none; }

/* Homepage editorial divisions */

.editorial-division {
  width: min(var(--wide), calc(100% - 2rem));
  margin: auto;
  padding: clamp(6rem, 11vw, 11rem) 0;
}

.editorial-division + .editorial-division { border-top: 1px solid var(--line); }

.division-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  min-height: 720px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(44, 4, 11, .54), rgba(5, 3, 4, .98) 62%);
  clip-path: polygon(0 0, calc(100% - 48px) 0, 100% 48px, 100% 100%, 0 100%);
}

.division-hero::after {
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  width: 48px;
  height: 48px;
  border-left: 1px solid var(--line);
  content: "";
  background: rgba(239, 23, 47, .14);
}

.division-hero-media {
  position: relative;
  z-index: 1;
  min-height: 720px;
  overflow: hidden;
  border-right: 1px solid var(--line);
  background: var(--iron);
}

.division-hero-media > img,
.division-hero-media > .visual-fallback {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: grayscale(1) contrast(1.2) brightness(.58);
  transition: filter .5s ease, transform .8s cubic-bezier(.2, .7, .2, 1);
}

.division-hero-media > span {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent 42%, rgba(5, 3, 4, .9)),
    linear-gradient(0deg, rgba(5, 3, 4, .84), transparent 52%),
    linear-gradient(135deg, rgba(239, 23, 47, .4), transparent 58%);
  mix-blend-mode: screen;
}

.division-hero-media > small {
  position: absolute;
  z-index: 3;
  bottom: 1.5rem;
  left: 1.5rem;
  color: var(--paper);
  font-family: var(--condensed);
  font-size: .6rem;
  font-weight: 900;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.division-hero-media:hover > img { filter: grayscale(.28) contrast(1.08) brightness(.74); transform: scale(1.025); }

.division-hero-copy {
  position: relative;
  z-index: 3;
  align-self: center;
  padding: clamp(3rem, 6vw, 7rem);
  margin-left: clamp(-7rem, -5vw, -3rem);
}

.division-hero-copy h2 {
  max-width: 780px;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(4rem, 8.4vw, 8.5rem);
  letter-spacing: -.07em;
  line-height: .76;
  text-transform: uppercase;
  text-wrap: balance;
}

.division-hero-copy h2 > span {
  display: block;
  margin-top: 1.2rem;
  color: transparent;
  font-size: .36em;
  letter-spacing: -.025em;
  line-height: .92;
  -webkit-text-stroke: 1px var(--red-hot);
}

.division-synopsis {
  max-width: 690px;
  margin: 2.2rem 0 0;
  padding-left: 1.2rem;
  border-left: 2px solid var(--red);
  color: var(--paper);
  font-family: var(--serif);
  font-size: clamp(1.05rem, 1.65vw, 1.35rem);
  line-height: 1.55;
}

.division-stats { display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; margin: 2rem 0; }
.division-stats span { color: var(--smoke); font-family: var(--condensed); font-size: .62rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.division-number { position: absolute; z-index: 2; right: 2rem; bottom: -3.5rem; color: rgba(239, 23, 47, .08); font-family: var(--display); font-size: 15rem; line-height: 1; pointer-events: none; }

.division-konnech .division-hero { grid-template-columns: minmax(360px, .92fr) minmax(0, 1.08fr); }
.division-konnech .division-hero-media { grid-column: 2; grid-row: 1; border-right: 0; border-left: 1px solid var(--line); }
.division-konnech .division-hero-media > span { background: linear-gradient(270deg, transparent 42%, rgba(5, 3, 4, .9)), linear-gradient(0deg, rgba(5, 3, 4, .84), transparent 52%), linear-gradient(225deg, rgba(239, 23, 47, .38), transparent 58%); }
.division-konnech .division-hero-copy { grid-column: 1; grid-row: 1; margin-right: clamp(-7rem, -5vw, -3rem); margin-left: 0; }
.division-konnech .division-number { right: auto; left: 2rem; }

.division-index { padding-top: clamp(3.5rem, 7vw, 7rem); }
.division-index > header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .52fr); gap: clamp(2rem, 8vw, 8rem); align-items: end; margin-bottom: 2.5rem; }
.division-index h3 { max-width: 980px; margin: 0; font-family: var(--display); font-size: clamp(3rem, 6vw, 6rem); letter-spacing: -.055em; line-height: .82; text-transform: uppercase; }
.division-index > header > div:last-child > p { margin: 0; color: var(--ash); }
.division-index nav { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.4rem; }
.division-index nav a { padding: .55rem .75rem; border: 1px solid var(--line); color: var(--red-hot); font-family: var(--condensed); font-size: .58rem; font-weight: 900; letter-spacing: .11em; text-decoration: none; text-transform: uppercase; }
.division-index nav a:hover { color: white; background: rgba(239, 23, 47, .1); }

.editorial-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1rem; }
.editorial-card { grid-column: span 4; display: grid; grid-template-rows: auto auto auto 1fr; gap: .8rem; min-width: 0; padding: .75rem .75rem 1.25rem; border: 1px solid var(--hairline); background: rgba(18, 9, 11, .52); text-decoration: none; transition: border-color .25s ease, transform .25s ease, background .25s ease; }
.editorial-card-1,
.editorial-card-2 { grid-column: span 6; }
.editorial-card-1 .editorial-card-visual,
.editorial-card-2 .editorial-card-visual { aspect-ratio: 16 / 8; }
.editorial-card-visual { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--iron); }
.editorial-card-visual > img,
.editorial-card-visual > .visual-fallback { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; filter: grayscale(1) contrast(1.15) brightness(.6); transition: filter .35s ease, transform .5s ease; }
.editorial-card-visual > .visual-fallback { font-size: clamp(3rem, 7vw, 7rem); }
.editorial-card-visual-empty { opacity: .5; background: linear-gradient(135deg, rgba(239, 23, 47, .07), transparent 60%), var(--iron); }
.editorial-card-visual > i { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(5, 3, 4, .82)), linear-gradient(125deg, rgba(239, 23, 47, .24), transparent 58%); }
.editorial-card-meta { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; }
.editorial-card-meta b,
.editorial-card-meta em { font-family: var(--condensed); font-size: .57rem; font-style: normal; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.editorial-card-meta b { color: var(--red-hot); }
.editorial-card-meta em { overflow: hidden; color: var(--smoke); text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.editorial-card > strong { display: -webkit-box; overflow: hidden; font-family: var(--serif); font-size: clamp(1.15rem, 1.9vw, 1.65rem); line-height: 1.05; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.editorial-card > small { color: var(--ash); font-size: .76rem; line-height: 1.5; }
.editorial-card:hover { color: inherit; border-color: var(--red); background: rgba(35, 8, 13, .7); transform: translateY(-3px); }
.editorial-card:hover .editorial-card-visual > img { filter: grayscale(.2) brightness(.78); transform: scale(1.035); }

.visual-fallback {
  display: grid;
  place-items: center;
  color: rgba(239,23,47,.26);
  background: repeating-linear-gradient(135deg, transparent 0 18px, rgba(239,23,47,.025) 18px 19px), var(--iron);
  font-family: var(--display);
  font-size: clamp(3rem, 10vw, 10rem);
  letter-spacing: -.1em;
}

.series-section {
  display: grid;
  grid-template-columns: minmax(300px, .7fr) minmax(0, 1.3fr);
  gap: clamp(3rem, 9vw, 10rem);
  width: min(var(--wide), calc(100% - 2rem));
  margin: auto;
  padding: clamp(6rem, 11vw, 11rem) 0;
  border-block: 1px solid var(--line);
}

.series-heading { position: sticky; top: 130px; align-self: start; }
.series-heading h2 { margin-bottom: 2rem; }
.series-rail { display: grid; }
.series-rail a {
  display: grid;
  grid-template-columns: 62px 1fr auto;
  gap: 1rem;
  align-items: center;
  min-height: 104px;
  border-bottom: 1px solid var(--hairline);
  text-decoration: none;
  transition: padding .25s ease, background .25s ease;
}
.series-rail a:first-child { border-top: 1px solid var(--hairline); }
.series-rail span { color: var(--red-hot); font-family: var(--display); font-size: 1.5rem; }
.series-rail b { font-family: var(--serif); font-size: clamp(1.05rem, 2vw, 1.55rem); line-height: 1.1; }
.series-rail em { color: var(--smoke); font-family: var(--condensed); font-size: .65rem; font-style: normal; letter-spacing: .12em; }
.series-rail a:hover { padding-inline: 1rem; color: white; background: rgba(239,23,47,.06); }

.transmission-section { display: grid; grid-template-columns: minmax(280px, .55fr) minmax(0, 1fr); gap: clamp(3rem, 9vw, 10rem); }
.section-intro.compact { display: block; align-self: start; margin: 0; }
.section-intro.compact h2 { margin-bottom: 2rem; font-size: clamp(3.8rem, 8vw, 8rem); }
.section-intro.compact > p { color: var(--ash); }
.section-intro.compact > a { display: inline-block; margin-top: 2rem; color: var(--red-hot); font-family: var(--condensed); font-size: .68rem; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.transmission-stack { display: grid; align-content: start; }
.transmission-stack > a { display: grid; grid-template-columns: 56px 1fr auto; gap: 1.2rem; align-items: center; min-height: 120px; padding: 1rem 0; border-bottom: 1px solid var(--hairline); text-decoration: none; }
.transmission-stack > a:first-child { border-top: 1px solid var(--hairline); }
.transmission-stack > a > span { color: var(--red-hot); font-family: var(--display); font-size: 1.5rem; }
.transmission-stack div { display: grid; gap: .4rem; }
.transmission-stack small { color: var(--smoke); font-family: var(--condensed); font-size: .62rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.transmission-stack b { display: -webkit-box; overflow: hidden; font-family: var(--serif); font-size: clamp(1.05rem, 1.7vw, 1.4rem); line-height: 1.12; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.transmission-stack em { color: var(--smoke); font-family: var(--condensed); font-size: .65rem; font-style: normal; letter-spacing: .1em; text-transform: uppercase; }
.transmission-stack a:hover { color: var(--red-hot); }

.year-ledger { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(3rem, 9vw, 10rem); border-top: 1px solid var(--line); }
.year-ledger > div { display: grid; }
.year-ledger > div > div { display: grid; grid-template-columns: 1fr auto auto; gap: 2rem; align-items: baseline; padding: 1.3rem 0; border-bottom: 1px solid var(--hairline); }
.year-ledger b { color: var(--red-hot); font-family: var(--display); font-size: clamp(2rem, 4vw, 4rem); }
.year-ledger span { color: var(--smoke); font-family: var(--condensed); font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }

/* Archive indexes */

.archive-mast {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .45fr);
  column-gap: clamp(3rem, 9vw, 10rem);
  align-items: end;
  width: min(var(--wide), calc(100% - 2rem));
  min-height: 72vh;
  margin: auto;
  padding: 150px 0 70px;
  border-bottom: 1px solid var(--line);
}

.archive-mast::after { position: absolute; right: 26%; bottom: 0; width: 1px; height: 62%; content: ""; background: linear-gradient(transparent, var(--red)); box-shadow: 0 0 20px rgba(239,23,47,.4); transform: rotate(11deg); transform-origin: bottom; }
.archive-mast .kicker { grid-column: 1 / -1; }
.archive-mast h1 { position: relative; z-index: 1; margin: 0; font-family: var(--display); font-size: clamp(6rem, 15vw, 14rem); letter-spacing: -.075em; line-height: .65; text-transform: uppercase; }
.archive-mast h1 span { color: transparent; -webkit-text-stroke: 1px var(--red-hot); }
.archive-mast > p:last-child { position: relative; z-index: 2; margin: 0; color: var(--ash); font-family: var(--serif); font-size: clamp(1.05rem, 1.7vw, 1.35rem); }

.archive-filter {
  position: sticky;
  z-index: 70;
  top: 77px;
  display: grid;
  grid-template-columns: minmax(250px, 1fr) auto auto;
  gap: 1.5rem;
  align-items: end;
  width: min(var(--wide), calc(100% - 2rem));
  margin: auto;
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--hairline);
  background: rgba(5,3,4,.94);
  backdrop-filter: blur(18px);
}

.archive-filter label { display: grid; gap: .35rem; color: var(--red-hot); font-family: var(--condensed); font-size: .58rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.archive-filter input { width: 100%; padding: .7rem 0; border: 0; border-bottom: 1px solid var(--line); outline: 0; color: var(--bone); background: transparent; font-family: var(--serif); font-size: 1.15rem; }
.archive-filter input:focus { border-color: var(--red-hot); }
.archive-filter output { padding-bottom: .75rem; color: var(--smoke); font-family: var(--condensed); font-size: .64rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.year-switch { display: flex; gap: .25rem; padding-bottom: .55rem; }
.year-switch button { padding: .35rem .55rem; border: 1px solid transparent; color: var(--smoke); background: transparent; font-family: var(--condensed); font-size: .6rem; font-weight: 900; letter-spacing: .08em; cursor: pointer; }
.year-switch button:hover,
.year-switch button[aria-pressed="true"] { border-color: var(--line); color: var(--red-hot); background: rgba(239,23,47,.06); }

.archive-filter.has-subjects { padding-bottom: 0; }
.subject-switch { grid-column: 1 / -1; min-width: 0; margin: 0; padding: .9rem 0 1rem; border: 0; border-top: 1px solid var(--hairline); }
.subject-switch legend { float: left; margin: .45rem 1.1rem 0 0; padding: 0; color: var(--red-hot); font-family: var(--condensed); font-size: .58rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.subject-switch > div { display: flex; gap: .4rem; min-width: 0; overflow-x: auto; scrollbar-width: thin; }
.subject-switch button { flex: 0 0 auto; padding: .48rem .7rem; border: 1px solid var(--hairline); color: var(--ash); background: rgba(18, 9, 11, .45); font-family: var(--condensed); font-size: .59rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.subject-switch button span { margin-left: .35rem; color: var(--smoke); }
.subject-switch button:hover,
.subject-switch button[aria-pressed="true"] { border-color: var(--red); color: white; background: rgba(239, 23, 47, .12); }
.subject-switch button[aria-pressed="true"] span { color: var(--red-hot); }

.archive-ledger { width: min(var(--wide), calc(100% - 2rem)); margin: auto; padding: 2rem 0 9rem; }
.ledger-row { display: grid; grid-template-columns: 62px 150px minmax(0, 1fr) auto; gap: clamp(1rem, 3vw, 3rem); align-items: center; min-height: 180px; padding: 1.2rem 0; border-bottom: 1px solid var(--hairline); text-decoration: none; }
.ledger-row[hidden] { display: none; }
.ledger-number { color: var(--red-hot); font-family: var(--display); font-size: 1.4rem; }
.ledger-thumb { display: block; height: 130px; overflow: hidden; border: 1px solid var(--hairline); background: var(--iron); clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%); }
.ledger-thumb img,
.ledger-thumb .visual-fallback { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; filter: grayscale(1) contrast(1.15) brightness(.65); transition: filter .35s ease, transform .45s ease; }
.ledger-thumb .visual-fallback { font-size: 2.3rem; }
.ledger-thumb-empty { opacity: .42; background: linear-gradient(135deg, rgba(239, 23, 47, .07), transparent 60%), var(--iron); }
.ledger-copy { display: grid; gap: .5rem; }
.ledger-copy small { color: var(--smoke); font-family: var(--condensed); font-size: .62rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.ledger-copy .subject-label { color: var(--red-hot); }
.ledger-copy b { display: -webkit-box; max-width: 900px; overflow: hidden; font-family: var(--serif); font-size: clamp(1.35rem, 2.5vw, 2.45rem); line-height: 1; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.ledger-copy em { max-width: 800px; color: var(--ash); font-size: .86rem; font-style: normal; }
.ledger-mark { padding: .55rem .8rem; border: 1px solid var(--line); color: var(--red-hot); font-family: var(--condensed); font-size: .58rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; opacity: 0; transform: translateX(-10px); transition: opacity .25s ease, transform .25s ease; }
.ledger-row:hover { color: inherit; }
.ledger-row:hover .ledger-thumb img { filter: grayscale(.2) brightness(.82); transform: scale(1.04); }
.ledger-row:hover .ledger-copy b { color: var(--red-hot); }
.ledger-row:hover .ledger-mark { opacity: 1; transform: none; }
.thread-row { grid-template-columns: 70px 110px minmax(0, 1fr) auto; min-height: 150px; }
.thread-row .ledger-thumb { height: 100px; }
.thread-row .ledger-copy b { font-size: clamp(1.2rem, 2vw, 1.9rem); }
.no-results { padding: 5rem 0; color: var(--smoke); font-family: var(--serif); font-size: 1.4rem; font-style: italic; text-align: center; }

/* Reading editions */

.reading-progress { position: fixed; z-index: 150; top: 0; left: 0; width: 0; height: 2px; background: white; box-shadow: 0 0 4px white, 0 0 12px var(--red), 0 0 30px var(--red); }
.edition-cover { position: relative; display: grid; grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); min-height: 88svh; padding-top: 78px; border-bottom: 1px solid var(--line); background: var(--void); }
.edition-cover.no-cover-art { grid-template-columns: minmax(0, 1fr); min-height: 62svh; }
.edition-cover.no-cover-art .edition-heading { width: min(1180px, calc(100% - 3rem)); margin: 0 auto; padding-inline: clamp(1.5rem, 7vw, 8rem); }
.edition-visual { position: relative; min-height: 520px; overflow: hidden; border-right: 1px solid var(--line); background: var(--iron); }
.edition-visual > img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; background: #080506; filter: grayscale(1) contrast(1.15) brightness(.66); }
.edition-visual > span { position: absolute; inset: 0; background: linear-gradient(90deg, transparent 55%, var(--void)), linear-gradient(0deg, var(--void), transparent 50%), linear-gradient(135deg, rgba(239,23,47,.3), transparent 60%); mix-blend-mode: screen; }
.edition-visual.visual-fallback { border-right: 1px solid var(--line); font-size: clamp(5rem, 14vw, 13rem); }
.edition-heading { position: relative; z-index: 2; align-self: center; padding: clamp(3rem, 8vw, 8rem) clamp(1.5rem, 7vw, 8rem) clamp(5rem, 8vw, 8rem) clamp(2rem, 6vw, 7rem); margin-left: clamp(-8rem, -7vw, -3rem); }
.edition-heading h1 { max-width: 1050px; margin: 0; font-family: var(--display); font-size: clamp(3.8rem, 8.5vw, 9rem); letter-spacing: -.065em; line-height: .78; text-transform: uppercase; text-wrap: balance; }
.edition-heading.title-long h1 { font-size: clamp(3.1rem, 6.7vw, 7rem); line-height: .82; }
.edition-heading.title-very-long h1 { font-size: clamp(2.7rem, 5.5vw, 5.8rem); line-height: .86; }
.edition-heading.title-extreme h1 { font-size: clamp(2.35rem, 4.6vw, 4.8rem); line-height: .9; }
.edition-heading > p:not(.kicker) { max-width: 760px; margin: 2rem 0 0; padding-left: 1.4rem; border-left: 2px solid var(--red); color: var(--paper); font-family: var(--serif); font-size: clamp(1.12rem, 2vw, 1.55rem); font-style: italic; }
.edition-stats { display: flex; flex-wrap: wrap; gap: .7rem 1.4rem; margin-top: 2.5rem; color: var(--smoke); font-family: var(--condensed); font-size: .62rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.cover-return { position: absolute; z-index: 3; right: 2rem; bottom: 1.6rem; color: var(--red-hot); font-family: var(--condensed); font-size: .62rem; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }

.reading-grid { display: grid; grid-template-columns: minmax(180px, 270px) minmax(0, var(--reading)); gap: clamp(3rem, 9vw, 10rem); width: min(1180px, calc(100% - 2rem)); margin: auto; padding: clamp(5rem, 10vw, 10rem) 0; }
.reading-rail { position: sticky; top: 130px; align-self: start; display: grid; gap: 1.2rem; max-height: calc(100vh - 160px); overflow: auto; padding-right: 1rem; }
.reading-rail > p,
.reading-rail > div span { margin: 0; color: var(--red-hot); font-family: var(--condensed); font-size: .58rem; font-weight: 900; letter-spacing: .17em; text-transform: uppercase; }
.reading-rail nav { display: grid; gap: .7rem; padding-bottom: 1.4rem; border-bottom: 1px solid var(--hairline); }
.reading-rail nav a { color: var(--smoke); font-family: var(--serif); font-size: .78rem; line-height: 1.2; text-decoration: none; }
.reading-rail nav a:hover { color: var(--red-hot); }
.reading-rail .toc-h2 { padding-left: .8rem; }
.reading-rail .toc-h3 { padding-left: 1.5rem; }
.reading-rail > div { display: grid; gap: .4rem; }
.reading-rail > div b { color: var(--smoke); font-family: var(--condensed); font-size: .62rem; font-weight: 500; overflow-wrap: anywhere; }

.edition-body { min-width: 0; }
.article-content { color: #e8ddd3; font-family: var(--serif); font-size: clamp(1.07rem, 1.55vw, 1.22rem); line-height: 1.82; }
.article-content > *:first-child { margin-top: 0; }
.article-content p { margin: 0 0 1.5em; }
.article-content > p:first-child { color: var(--paper); font-size: 1.15em; }
.article-content h1,
.article-content h2,
.article-content h3,
.article-content h4 { scroll-margin-top: 110px; color: var(--bone); }
.article-content h1 { margin: 2.8em 0 .75em; padding-top: .5em; border-top: 1px solid var(--line); font-family: var(--display); font-size: clamp(2.8rem, 6vw, 5.8rem); letter-spacing: -.045em; line-height: .84; text-transform: uppercase; }
.article-content h2 { margin: 2.5em 0 .7em; font-family: var(--serif); font-size: clamp(1.9rem, 4vw, 3.4rem); letter-spacing: -.035em; line-height: 1; }
.article-content h3 { margin: 2.4em 0 .7em; color: var(--red-hot); font-family: var(--condensed); font-size: clamp(1.3rem, 2.8vw, 2.1rem); letter-spacing: -.01em; text-transform: uppercase; }
.article-content h4 { margin: 2em 0 .6em; font-family: var(--sans); font-size: 1.05rem; letter-spacing: .08em; text-transform: uppercase; }
.article-content a { color: #ff7481; text-decoration-color: rgba(255,116,129,.35); text-underline-offset: .18em; overflow-wrap: anywhere; }
.article-content a:hover { color: white; text-decoration-color: var(--red); }
.article-content strong { color: #fff7f0; }
.article-content hr { width: 70px; height: 1px; margin: 3.5rem auto; border: 0; background: var(--red); box-shadow: 0 0 10px rgba(239,23,47,.5); }
.article-content blockquote,
.article-content .pull-quote { width: min(980px, calc(100vw - 2rem)); margin: clamp(3rem, 7vw, 6rem) 50%; padding: clamp(1.5rem, 4vw, 3rem); border-block: 1px solid var(--red); color: var(--bone); background: linear-gradient(90deg, transparent, rgba(239,23,47,.08), transparent); font-size: clamp(1.35rem, 3vw, 2.3rem); font-style: italic; line-height: 1.35; text-align: center; transform: translateX(-50%); }
.article-content ul,
.article-content ol { margin: 0 0 1.6em; padding-left: 1.35em; }
.article-content li { margin-bottom: .65em; padding-left: .35em; }
.article-content li::marker { color: var(--red-hot); }
.article-content pre { max-width: 100%; padding: 1.2rem; overflow-x: auto; border: 1px solid var(--hairline); color: var(--paper); background: var(--iron); white-space: pre-wrap; }
.article-content figure { width: min(1080px, calc(100vw - 2rem)); margin: clamp(3rem, 7vw, 6rem) 50%; transform: translateX(-50%); }
.article-content figure a { display: block; }
.article-content img { display: block; width: auto !important; max-width: 100%; height: auto !important; max-height: 88vh; margin: auto; object-fit: contain; object-position: center; border: 1px solid var(--hairline); background: var(--iron); box-shadow: 0 28px 80px rgba(0,0,0,.48); }
.article-content video { display: block; width: 100%; max-width: 100%; height: auto; max-height: 88vh; margin: auto; object-fit: contain; object-position: center; border: 1px solid var(--hairline); background: #000; box-shadow: 0 28px 80px rgba(0,0,0,.48); }
.article-content audio { width: 100%; }
.article-content figcaption,
.article-content .media-caption { color: var(--smoke); font-family: var(--sans); font-size: .72rem; line-height: 1.45; }
.article-content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-family: var(--sans); font-size: .8rem; }
.article-content td,
.article-content th { padding: .7rem; border: 1px solid var(--hairline); }
.external-media { margin: 2.5rem 0; padding: 1.2rem; border: 1px solid var(--line); background: var(--iron); font-family: var(--sans); font-size: .78rem; }
.media-reserved { display: none; }

.collection-path {
  display: grid;
  grid-template-columns: minmax(210px, .34fr) minmax(0, 1fr);
  width: min(var(--wide), calc(100% - 2rem));
  margin: auto;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(239,23,47,.055), transparent 38%);
}
.collection-summary { display: grid; align-content: center; gap: .38rem; min-width: 0; padding: 1.25rem clamp(1rem, 2vw, 2rem) 1.25rem 0; border-right: 1px solid var(--line); }
.collection-summary small,
.collection-step small,
.collection-all small,
.collection-continue small { color: var(--red-hot); font-family: var(--condensed); font-size: .58rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.collection-summary strong { overflow: hidden; font-family: var(--serif); font-size: 1.1rem; line-height: 1.05; overflow-wrap: anywhere; text-overflow: ellipsis; white-space: nowrap; }
.collection-summary > span { color: var(--smoke); font-family: var(--condensed); font-size: .62rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.collection-summary > i { display: block; width: 100%; height: 2px; margin-top: .25rem; overflow: hidden; background: var(--line); }
.collection-summary > i > b { display: block; height: 100%; background: var(--red-hot); box-shadow: 0 0 10px var(--red); }
.collection-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); min-width: 0; }
.collection-step,
.collection-all { display: grid; align-content: center; gap: .4rem; min-width: 0; min-height: 104px; padding: 1rem clamp(.8rem, 2vw, 1.6rem); text-decoration: none; }
.collection-step b { display: -webkit-box; overflow: hidden; font-family: var(--serif); font-size: .92rem; line-height: 1.13; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.collection-all { justify-items: center; min-width: 116px; border-inline: 1px solid var(--line); text-align: center; }
.collection-all b { color: var(--bone); font-family: var(--display); font-size: 1.35rem; letter-spacing: -.02em; }
.collection-next { color: white; background: rgba(239,23,47,.1); text-align: right; }
.collection-step.is-disabled { color: var(--smoke); opacity: .38; }
.collection-step:not(.is-disabled):hover,
.collection-all:hover { color: var(--red-hot); background: rgba(239,23,47,.08); }
.collection-step:focus-visible,
.collection-all:focus-visible,
.collection-continue a:focus-visible { outline: 2px solid var(--red-hot); outline-offset: -2px; }

.collection-continue { width: min(var(--reading), calc(100% - 2rem)); margin: 0 auto clamp(5rem, 10vw, 9rem); border: 1px solid var(--red); background: linear-gradient(115deg, rgba(239,23,47,.14), rgba(18,9,11,.65) 52%, rgba(239,23,47,.04)); box-shadow: 0 22px 70px rgba(0,0,0,.35); }
.collection-continue a { display: grid; gap: .8rem; padding: clamp(1.4rem, 4vw, 2.5rem); text-decoration: none; }
.collection-continue span { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.5rem; align-items: end; }
.collection-continue b { display: -webkit-box; overflow: hidden; font-family: var(--serif); font-size: clamp(1.25rem, 2.6vw, 2rem); line-height: 1.08; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.collection-continue em { color: var(--red-hot); font-family: var(--condensed); font-size: .62rem; font-style: normal; font-weight: 900; letter-spacing: .13em; text-align: right; text-transform: uppercase; white-space: nowrap; }
.collection-continue a:hover b { color: var(--red-hot); }
.collection-continue.is-complete { border-color: var(--line); background: rgba(18,9,11,.5); }

/* Thread editions */

.thread-cover .edition-heading h1 { font-size: clamp(3.3rem, 7.4vw, 7.4rem); }
.thread-cover .edition-heading.title-long h1 { font-size: clamp(2.9rem, 6vw, 6rem); }
.thread-cover .edition-heading.title-very-long h1 { font-size: clamp(2.55rem, 5vw, 5rem); }
.thread-cover .edition-heading.title-extreme h1 { font-size: clamp(2.25rem, 4.2vw, 4.2rem); }
.thread-reading-grid { display: grid; grid-template-columns: minmax(110px, 180px) minmax(0, 900px); gap: clamp(2rem, 7vw, 7rem); width: min(1240px, calc(100% - 2rem)); margin: auto; padding: clamp(5rem, 10vw, 10rem) 0; }
.thread-rail { position: sticky; top: 130px; align-self: start; display: grid; gap: .6rem; color: var(--smoke); font-family: var(--condensed); font-size: .58rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.thread-rail b { color: var(--bone); font-size: .74rem; }
.thread-rail i { width: 1px; height: 220px; margin: 1rem 0 1rem .35rem; background: linear-gradient(var(--red), var(--red-dark), transparent); box-shadow: 0 0 10px var(--red); }
.thread-stream { counter-reset: transmission; }
.transmission { position: relative; padding: 0 0 clamp(5rem, 9vw, 8rem); }
.transmission::before { position: absolute; top: .4rem; left: -2.5rem; width: 9px; height: 9px; content: ""; border: 1px solid var(--red); background: var(--void); box-shadow: 0 0 10px var(--red); transform: rotate(45deg); }
.transmission > header { display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; padding-bottom: 1rem; border-bottom: 1px solid var(--hairline); color: var(--smoke); font-family: var(--condensed); font-size: .6rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.transmission > header span:first-child { color: var(--red-hot); font-family: var(--display); font-size: 1rem; }
.transmission-text { margin-top: 1.5rem; color: var(--bone); font-family: var(--serif); font-size: clamp(1.14rem, 2vw, 1.45rem); line-height: 1.72; }
.transmission-text a { color: #ff7481; overflow-wrap: anywhere; }
.transmission-media { display: grid; grid-template-columns: repeat(2, 1fr); gap: .65rem; margin-top: 2rem; }
.transmission-media.media-count-1 { grid-template-columns: 1fr; }
.transmission-media figure { min-width: 0; margin: 0; overflow: hidden; border: 1px solid var(--hairline); background: var(--iron); }
.transmission-media img,
.transmission-media video { display: block; width: 100%; height: 100%; max-height: 80vh; object-fit: contain; object-position: center; background: #000; }
.transmission-media audio { width: calc(100% - 2rem); margin: 1rem; }
.image-button { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.source-docket { margin-top: 1.2rem; border: 1px solid var(--hairline); background: rgba(18,9,11,.5); }
.source-docket summary { padding: .75rem 1rem; color: var(--red-hot); font-family: var(--condensed); font-size: .6rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; cursor: pointer; }
.source-docket ul { display: grid; gap: .45rem; margin: 0; padding: 0 1rem 1rem 2rem; }
.source-docket a { color: var(--smoke); font-size: .72rem; overflow-wrap: anywhere; }

/* Search and image viewing */

.search-dialog {
  width: min(940px, calc(100% - 2rem));
  max-height: min(820px, calc(100vh - 2rem));
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--red);
  color: var(--bone);
  background: rgba(7,4,5,.98);
  box-shadow: 0 0 0 1px rgba(255,255,255,.03), 0 40px 140px #000, 0 0 60px rgba(239,23,47,.12);
}
.search-dialog::backdrop { background: rgba(0,0,0,.86); backdrop-filter: blur(12px); }
.search-topline { display: flex; justify-content: space-between; padding: 1rem 1.2rem; border-bottom: 1px solid var(--line); color: var(--red-hot); font-family: var(--condensed); font-size: .62rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.search-topline button { border: 0; color: var(--ash); background: none; cursor: pointer; }
.search-field { display: grid; gap: .8rem; padding: clamp(1.5rem, 4vw, 3rem); }
.search-field span { color: var(--smoke); font-family: var(--condensed); font-size: .62rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.search-field input { width: 100%; padding: .5rem 0 1rem; border: 0; border-bottom: 1px solid var(--red); outline: 0; color: white; background: transparent; font-family: var(--serif); font-size: clamp(1.5rem, 4vw, 3rem); }
.search-results { max-height: 470px; overflow: auto; padding: 0 clamp(1.5rem, 4vw, 3rem) 3rem; }
.search-results a { display: grid; grid-template-columns: 80px 1fr auto; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--hairline); text-decoration: none; }
.search-results a span,
.search-results a em { color: var(--smoke); font-family: var(--condensed); font-size: .6rem; font-style: normal; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.search-results a b { font-family: var(--serif); font-size: 1.05rem; line-height: 1.15; }
.search-results a:hover b { color: var(--red-hot); }
.search-empty { padding: 2rem 0; color: var(--smoke); font-family: var(--serif); font-style: italic; }

.form-badge,
.search-result-type {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  padding: .26rem .42rem;
  border: 1px solid var(--red);
  color: #fff;
  background: rgba(239,23,47,.14);
  font-family: var(--condensed);
  font-size: .55rem;
  font-style: normal;
  font-weight: 900;
  letter-spacing: .12em;
  line-height: 1;
  text-transform: uppercase;
}

.search-result-type.is-thread { border-color: #8f6970; background: rgba(143,105,112,.12); }
.search-result-copy { display: grid; gap: .35rem; min-width: 0; }
.search-results .search-result-copy small {
  display: -webkit-box;
  overflow: hidden;
  color: var(--smoke);
  font-family: var(--sans);
  font-size: .68rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.25;
  text-transform: none;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.filter-controls { display: flex; gap: .7rem; align-items: end; padding-bottom: .45rem; }
.archive-filter .filter-select { min-width: 150px; }
.archive-filter select {
  min-width: 0;
  padding: .55rem 2rem .55rem .7rem;
  border: 1px solid var(--line);
  border-radius: 0;
  outline: 0;
  color: var(--bone);
  background: #0c0708;
  font-family: var(--condensed);
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .06em;
}
.archive-filter select:focus { border-color: var(--red-hot); }
.type-switch {
  grid-column: 1 / -1;
  min-width: 0;
  margin: 0;
  padding: .8rem 0 1rem;
  border: 0;
  border-top: 1px solid var(--hairline);
}
.type-switch legend { float: left; margin: .45rem 1.1rem 0 0; padding: 0; color: var(--red-hot); font-family: var(--condensed); font-size: .58rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.type-switch > div { display: flex; gap: .4rem; }
.type-switch button { padding: .48rem .7rem; border: 1px solid var(--hairline); color: var(--ash); background: rgba(18,9,11,.45); font-family: var(--condensed); font-size: .59rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.type-switch button span { margin-left: .35rem; color: var(--smoke); }
.type-switch button:hover,
.type-switch button[aria-pressed="true"] { border-color: var(--red); color: white; background: rgba(239,23,47,.12); }

.collection-directory {
  display: grid;
  width: min(var(--wide), calc(100% - 2rem));
  margin: auto;
  padding: 3rem 0 10rem;
}
.collection-directory-card {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: clamp(1.2rem, 4vw, 4rem);
  align-items: center;
  min-height: 210px;
  padding: 2rem 0;
  border-bottom: 1px solid var(--hairline);
  text-decoration: none;
}
.collection-directory-card > span { color: var(--red-hot); font-family: var(--display); font-size: 1.8rem; }
.collection-directory-card > div { display: grid; gap: .65rem; }
.collection-directory-card small,
.collection-directory-card em,
.collection-directory-card > b,
.collection-form-counts span { color: var(--smoke); font-family: var(--condensed); font-size: .62rem; font-style: normal; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.collection-directory-card h2 { margin: 0; font-family: var(--serif); font-size: clamp(1.8rem, 4vw, 3.5rem); line-height: .95; }
.collection-directory-card p { max-width: 880px; margin: 0; color: var(--ash); line-height: 1.55; }
.collection-directory-card > b { padding: .55rem .8rem; border: 1px solid var(--line); color: var(--red-hot); }
.collection-directory-card:hover h2 { color: var(--red-hot); }
.collection-form-counts { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.5rem; }
.collection-form-counts span { padding: .45rem .65rem; border: 1px solid var(--line); color: var(--bone); background: rgba(239,23,47,.06); }
.collection-detail-page .archive-mast h1 { font-size: clamp(4rem, 11vw, 10rem); line-height: .72; }

.edition-heading > .edition-authors {
  margin-top: 1rem;
  padding-left: 0;
  border: 0;
  color: var(--smoke);
  font-family: var(--condensed);
  font-size: .72rem;
  font-style: normal;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.archive-provenance-note {
  margin: 0 0 3rem;
  padding: 1.2rem 1.4rem;
  border: 1px solid var(--red);
  background: linear-gradient(110deg, rgba(239,23,47,.12), rgba(18,9,11,.35));
}
.archive-provenance-note strong { color: var(--red-hot); font-family: var(--condensed); font-size: .65rem; letter-spacing: .15em; text-transform: uppercase; }
.archive-provenance-note p { margin: .7rem 0 0; color: var(--ash); font-family: var(--sans); font-size: .82rem; line-height: 1.5; }
.x-article-media-reference { padding: 1rem 1.2rem; border: 1px solid var(--hairline); background: rgba(18,9,11,.5); }
.x-article-media-reference figcaption { margin-bottom: .6rem; color: var(--red-hot); font-family: var(--condensed); font-size: .62rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.x-article-media-reference ul { margin: 0; }
.x-article-media { display: grid; gap: 1rem; margin: 2.5rem 0; }
.x-article-media .image-button { display: block; width: 100%; padding: 0; overflow: hidden; border: 1px solid var(--hairline); background: var(--iron); }
.x-article-media img { display: block; width: 100%; max-height: 78svh; object-fit: contain; background: #080506; }
.x-article-sources { margin-top: 5rem; padding-top: 2rem; border-top: 1px solid var(--red); }
.x-article-sources ol { padding-left: 2rem; }
.x-article-sources li { margin-bottom: .8rem; }

.article-thread-companions {
  width: min(1000px, calc(100% - 2rem));
  margin: 0 auto clamp(5rem, 10vw, 9rem);
  padding-top: clamp(3rem, 7vw, 6rem);
  border-top: 1px solid var(--red);
}
.article-thread-companions > header { display: grid; gap: .7rem; margin-bottom: 2.5rem; }
.article-thread-companions > header h2 { margin: 0; font-family: var(--serif); font-size: clamp(2rem, 5vw, 4rem); line-height: .95; }
.article-thread-companions > header > p:last-child { max-width: 760px; margin: 0; color: var(--ash); line-height: 1.6; }
.article-thread-companion { margin-top: 2rem; padding: clamp(1rem, 4vw, 2.5rem); border: 1px solid var(--line); background: rgba(18,9,11,.42); }
.companion-heading { display: flex; gap: 1rem; align-items: start; margin-bottom: 3rem; }
.companion-heading > div { display: grid; gap: .35rem; }
.companion-heading h3 { margin: 0; font-family: var(--serif); font-size: clamp(1.3rem, 3vw, 2rem); }
.companion-heading p { margin: 0; color: var(--smoke); font-family: var(--condensed); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }

.thread-stack-divider {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  gap: 1.5rem;
  margin: 0 0 4rem;
  padding: 1.4rem 0;
  scroll-margin-top: 110px;
  border-block: 1px solid var(--red);
  background: linear-gradient(90deg, rgba(239,23,47,.11), transparent);
}
.thread-stack-divider > span { padding-left: .8rem; color: var(--red-hot); font-family: var(--condensed); font-size: .62rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.thread-stack-divider h2 { margin: 0; font-family: var(--serif); font-size: clamp(1.5rem, 3.5vw, 2.8rem); line-height: 1; }
.thread-stack-divider p { margin: .45rem 0 0; color: var(--smoke); font-family: var(--condensed); font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; }
.thread-rail a { color: var(--smoke); line-height: 1.35; text-decoration: none; }
.thread-rail a:hover { color: var(--red-hot); }

.archived-status-link { color: #ff7481; }
.archived-short-link,
.archived-status-missing {
  display: inline-block;
  padding: .12rem .35rem;
  border: 1px solid var(--line);
  color: var(--smoke);
  background: rgba(255,255,255,.025);
  font-family: var(--condensed);
  font-size: .65em;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.archived-quote-references { display: grid; gap: .7rem; margin-top: 1.2rem; }
.archived-quote-references > a,
.archived-quote-references > span { display: grid; gap: .25rem; padding: .9rem 1rem; border-left: 2px solid var(--red); color: inherit; background: rgba(239,23,47,.06); text-decoration: none; }
.archived-quote-references small { color: var(--red-hot); font-family: var(--condensed); font-size: .58rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.archived-quote-references b { font-family: var(--serif); font-size: .95rem; }
.archived-quote-references span span { color: var(--smoke); font-family: var(--condensed); font-size: .62rem; letter-spacing: .08em; }

.lightbox {
  position: fixed;
  z-index: 300;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 2rem;
  border: 0;
  background: rgba(0,0,0,.94);
  cursor: zoom-out;
}
.lightbox img { width: auto; max-width: 96vw; height: auto; max-height: 92vh; object-fit: contain; object-position: center; box-shadow: 0 0 0 1px var(--hairline), 0 40px 120px black; }

.site-footer {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  width: min(var(--wide), calc(100% - 2rem));
  margin: 8rem auto 0;
  padding: 2.5rem 0 4rem;
  border-top: 1px solid var(--line);
  color: var(--smoke);
}
.site-footer > div { display: grid; gap: .35rem; }
.site-footer > div:last-child { text-align: right; }
.site-footer strong { color: var(--bone); font-family: var(--condensed); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; }
.site-footer span { font-family: var(--condensed); font-size: .58rem; letter-spacing: .13em; text-transform: uppercase; }
.footer-wordmark { width: 190px; height: auto; margin: -2.2rem 0 -1.6rem; }

@keyframes pulse { 50% { opacity: .45; box-shadow: 0 0 0 9px rgba(239,23,47,0), 0 0 14px var(--red); } }
@keyframes signal { to { transform: translateX(-50%); } }

@media (max-width: 1050px) {
  .landing { grid-template-columns: 1fr minmax(290px, .5fr); gap: 3rem; }
  .landing-rupture { right: 15%; width: 48vw; }
  .latest-signal { min-height: 500px; }
  .feature-wall { grid-template-rows: minmax(300px, 48vw) repeat(2, minmax(240px, 34vw)); }
  .feature-1 { grid-column: 1 / span 8; grid-row: 1; }
  .feature-2 { grid-column: 9 / -1; grid-row: 1 / span 2; }
  .feature-3 { grid-column: 1 / span 8; grid-row: 2; }
  .feature-4 { grid-column: 1 / -1; grid-row: 3; }
  .division-hero { grid-template-columns: minmax(0, 1fr) minmax(330px, .8fr); }
  .division-konnech .division-hero { grid-template-columns: minmax(330px, .8fr) minmax(0, 1fr); }
  .division-hero-copy { padding: 3rem; }
  .editorial-card { grid-column: span 6; }
  .series-section,
  .transmission-section { gap: 4rem; }
  .ledger-row { grid-template-columns: 52px 120px minmax(0, 1fr); }
  .ledger-mark { display: none; }
  .edition-cover { grid-template-columns: minmax(0, .6fr) minmax(0, 1.4fr); }
  .edition-heading { margin-left: -4rem; }
}

@media (max-width: 780px) {
  .site-header { grid-template-columns: 1fr auto; min-height: 68px; }
  .header-state { display: none; }
  .brand-name { display: none; }
  .brand-mark { width: 42px; height: 38px; }
  .site-nav { gap: 1rem; }
  .site-nav a,
  .site-nav button { font-size: .62rem; letter-spacing: .1em; }
  .site-nav kbd { display: none; }
  .landing { grid-template-columns: 1fr; min-height: auto; padding-top: 120px; }
  .landing-brand { width: min(680px, 100%); }
  .landing-rupture { top: 3%; right: -7%; width: 72vw; height: 54%; opacity: .66; }
  .latest-signal { width: min(520px, 92%); min-height: 540px; margin-left: auto; }
  .landing-coordinates { display: none; }
  .section-intro,
  .series-section,
  .transmission-section,
  .year-ledger { grid-template-columns: 1fr; }
  .section-intro > p:last-child { margin-top: 1.5rem; }
  .series-heading { position: static; }
  .feature-wall { display: grid; grid-template-columns: 1fr; grid-template-rows: none; }
  .story-visual { grid-column: auto; grid-row: auto; min-height: 420px; }
  .editorial-division { padding-block: 5rem; }
  .division-hero,
  .division-konnech .division-hero { display: block; min-height: 0; clip-path: polygon(0 0, calc(100% - 34px) 0, 100% 34px, 100% 100%, 0 100%); }
  .division-hero-media,
  .division-konnech .division-hero-media { display: block; min-height: 500px; border-right: 0; border-bottom: 1px solid var(--line); border-left: 0; }
  .division-hero-media > span,
  .division-konnech .division-hero-media > span { background: linear-gradient(0deg, var(--void), transparent 70%), linear-gradient(135deg, rgba(239, 23, 47, .3), transparent 58%); }
  .division-hero-copy,
  .division-konnech .division-hero-copy { margin: -6rem 0 0; padding: 3rem 1.2rem 4rem; }
  .division-hero-copy h2 { font-size: clamp(3.7rem, 14vw, 7rem); }
  .division-number,
  .division-konnech .division-number { right: 1rem; bottom: -1rem; left: auto; font-size: 9rem; }
  .division-index > header { grid-template-columns: 1fr; }
  .editorial-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .editorial-card,
  .editorial-card-1,
  .editorial-card-2 { grid-column: span 1; }
  .editorial-card-1 .editorial-card-visual,
  .editorial-card-2 .editorial-card-visual { aspect-ratio: 16 / 9; }
  .year-ledger > div > div { gap: 1rem; }
  .archive-mast { grid-template-columns: 1fr; min-height: 65vh; }
  .archive-mast h1 { margin-bottom: 3rem; }
  .archive-mast::after { right: 14%; }
  .archive-filter { top: 67px; grid-template-columns: 1fr auto; }
  .year-switch { grid-column: 1 / -1; grid-row: 2; overflow-x: auto; }
  .filter-controls { grid-column: 1 / -1; flex-wrap: wrap; }
  .type-switch { grid-column: 1 / -1; }
  .ledger-row,
  .thread-row { grid-template-columns: 44px 92px minmax(0, 1fr); min-height: 140px; }
  .ledger-thumb,
  .thread-row .ledger-thumb { height: 95px; }
  .ledger-copy em { display: none; }
  .edition-cover { display: block; min-height: auto; padding-top: 68px; }
  .edition-cover.no-cover-art .edition-heading { width: auto; margin: 0; padding: 4rem 1rem 6rem; }
  .edition-visual { height: 54vh; min-height: 360px; border-right: 0; border-bottom: 1px solid var(--line); }
  .edition-visual > span { background: linear-gradient(0deg, var(--void), transparent 62%), linear-gradient(135deg, rgba(239,23,47,.24), transparent 60%); }
  .edition-heading { margin: -8rem 0 0; padding: 3rem 1rem 6rem; }
  .edition-heading h1 { font-size: clamp(3.5rem, 14vw, 7rem); }
  .cover-return { bottom: 1rem; left: 1rem; right: auto; }
  .collection-path { grid-template-columns: 1fr; }
  .collection-summary { padding-inline: 1rem; border-right: 0; border-bottom: 1px solid var(--line); }
  .collection-summary strong { white-space: normal; }
  .reading-grid { grid-template-columns: 1fr; }
  .reading-rail { position: static; max-height: none; }
  .reading-rail nav { display: none; }
  .thread-reading-grid { grid-template-columns: 1fr; }
  .thread-rail { position: static; grid-template-columns: auto minmax(0, 1fr); align-items: center; }
  .thread-rail i { width: 100%; height: 1px; margin: 0; }
  .transmission::before { display: none; }
}

@media (max-width: 520px) {
  .site-header { padding-inline: .6rem; }
  .site-nav { gap: .55rem; }
  .site-nav a,
  .site-nav button { font-size: .55rem; letter-spacing: .055em; }
  .landing { width: min(100% - 1.2rem, var(--wide)); padding-inline: .3rem; }
  .landing-wordmark { width: 112%; margin-left: -6%; }
  .landing-line { font-size: 1.5rem; }
  .latest-signal { width: 100%; }
  .feature-section,
  .editorial-division,
  .transmission-section,
  .year-ledger,
  .series-section { width: calc(100% - 1.2rem); }
  .story-visual { min-height: 360px; }
  .story-visual .visual-copy b { font-size: 1.8rem; }
  .division-hero-media,
  .division-konnech .division-hero-media { min-height: 390px; }
  .division-hero-copy h2 { font-size: clamp(3.1rem, 15vw, 5rem); }
  .division-hero-copy h2 > span { font-size: .42em; }
  .division-synopsis { padding-left: .85rem; font-size: 1rem; }
  .editorial-grid { grid-template-columns: 1fr; }
  .editorial-card,
  .editorial-card-1,
  .editorial-card-2 { grid-column: 1; }
  .editorial-card-meta { display: grid; gap: .25rem; }
  .editorial-card-meta em { text-align: left; }
  .series-rail a { grid-template-columns: 42px 1fr; }
  .series-rail em { display: none; }
  .transmission-stack > a { grid-template-columns: 42px 1fr; }
  .transmission-stack > a > em { display: none; }
  .year-ledger > div > div { grid-template-columns: 1fr auto; }
  .year-ledger span:last-child { display: none; }
  .archive-mast,
  .archive-filter,
  .archive-ledger,
  .collection-directory { width: calc(100% - 1.2rem); }
  .archive-mast h1 { font-size: 23vw; }
  .archive-filter { grid-template-columns: 1fr; }
  .filter-controls { display: grid; grid-template-columns: 1fr; }
  .archive-filter .filter-select { min-width: 0; }
  .archive-filter select { width: 100%; }
  .archive-filter output { display: none; }
  .collection-directory-card { grid-template-columns: 44px minmax(0, 1fr); }
  .collection-directory-card > b { display: none; }
  .collection-detail-page .archive-mast h1 { font-size: 18vw; }
  .ledger-row,
  .thread-row { grid-template-columns: 44px minmax(0, 1fr); }
  .ledger-thumb { display: none; }
  .ledger-copy b { font-size: 1.3rem; }
  .edition-heading h1,
  .thread-cover .edition-heading h1 { font-size: clamp(3rem, 15vw, 5.5rem); }
  .edition-stats span:nth-child(4) { display: none; }
  .reading-grid,
  .thread-reading-grid { width: calc(100% - 1.2rem); }
  .article-content { font-size: 1.05rem; }
  .article-content blockquote,
  .article-content .pull-quote,
  .article-content figure { width: calc(100vw - 1.2rem); }
  .transmission-media { grid-template-columns: 1fr; }
  .thread-stack-divider { grid-template-columns: 1fr; }
  .article-thread-companion { padding-inline: .8rem; }
  .companion-heading { display: grid; }
  .collection-path { width: calc(100% - 1.2rem); }
  .collection-actions { grid-template-columns: 1fr 1fr; grid-template-areas: "all all" "previous next"; }
  .collection-previous { grid-area: previous; }
  .collection-all { grid-area: all; border-inline: 0; border-bottom: 1px solid var(--line); }
  .collection-next { grid-area: next; }
  .collection-step { min-height: 92px; }
  .collection-next { border-left: 1px solid var(--line); }
  .collection-continue { width: calc(100% - 1.2rem); }
  .collection-continue span { grid-template-columns: 1fr; gap: .8rem; }
  .collection-continue em { text-align: left; }
  .search-results a { grid-template-columns: 58px 1fr; }
  .search-results a em { display: none; }
  .site-footer { flex-direction: column; }
  .site-footer > div:last-child { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-reveal] { opacity: 1; transform: none; }
}

img.emoji {
  display: inline-block !important;
  width: 1em !important;
  min-width: 1em !important;
  max-width: 1em !important;
  height: 1em !important;
  margin: 0 .06em !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  object-fit: contain !important;
  filter: none !important;
  vertical-align: -.14em;
}