@font-face {
  font-family: "Antiaveraging Serif";
  src: url("/assets/fonts/source-han-serif-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --landing-void: oklch(13% 0.008 260);
  --landing-ink: oklch(90% 0.012 85);
  --landing-dim: oklch(64% 0.010 85);
  --landing-rule: oklch(30% 0.008 260);
  --landing-ember: oklch(80% 0.11 65);
  --landing-display: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
}

html, body { margin: 0; min-height: 100%; overflow-x: clip; background: var(--landing-void); color: var(--landing-ink); }
body { font-family: var(--landing-display); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
#ambient-field { position: fixed; inset: 0; z-index: 0; display: block; width: 100%; height: 100%; }
.landing-page { position: relative; z-index: 1; }
.landing-marquee { box-sizing: border-box; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; padding: 32px 56px 64px; }
.landing-wordmark { margin: 0; font-size: 148px; font-weight: 400; line-height: .94; letter-spacing: 0; white-space: nowrap; }
.landing-publisher { margin: 18px 0 0; font-family: ui-sans-serif, system-ui, sans-serif; font-size: 18px; letter-spacing: 0; color: var(--landing-dim); }
.landing-rule { height: 2px; margin: 0; border: 0; background: var(--landing-rule); }
.landing-contents { max-width: 1088px; padding: 96px 56px 144px; }
.landing-toc { display: flex; flex-direction: column; gap: 64px; margin: 0; padding: 0; list-style: none; }
.landing-chapter { display: block; color: inherit; text-decoration: none; outline: none; }
.landing-chapter__number { display: block; margin-bottom: 8px; font-family: ui-sans-serif, system-ui, sans-serif; font-size: 15px; letter-spacing: 0; color: var(--landing-dim); }
.landing-chapter__title { display: inline; border-bottom: 1px solid transparent; font-family: "Antiaveraging Serif", "Source Han Serif K", serif; font-size: 42px; line-height: 1.18; letter-spacing: 0; word-break: keep-all; }
.landing-chapter:hover .landing-chapter__title, .landing-chapter:focus-visible .landing-chapter__title { color: var(--landing-ember); border-bottom-color: var(--landing-ember); }
.landing-chapter:focus-visible { outline: 2px solid var(--landing-ember); outline-offset: 7px; }
.landing-footer { display: flex; padding: 64px 56px 96px; border-top: 1px solid var(--landing-rule); color: var(--landing-dim); }
.landing-footer p { margin: 0; font-size: 16px; }
.landing-skip { position: fixed; inset: 12px auto auto 12px; z-index: 3; padding: 10px 14px; transform: translateY(-72px); background: var(--landing-ink); color: var(--landing-void); }
.landing-skip:focus { transform: translateY(0); }

@media (max-width: 1199px) { .landing-wordmark { font-size: 72px; } }

@media (max-width: 767px) {
  .landing-marquee { padding: 24px 20px 48px; }
  .landing-wordmark { font-size: 38px; }
  .landing-publisher { font-size: 16px; }
  .landing-contents { padding: 64px 20px 96px; }
  .landing-toc { gap: 48px; }
  .landing-chapter__number { font-size: 14px; }
  .landing-chapter__title { font-size: 30px; }
  .landing-footer { padding: 48px 20px 72px; }
}

@media (max-width: 359px) { .landing-wordmark { font-size: 30px; } .landing-chapter__title { font-size: 27px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; } }
