/* Site-level additions on top of the design-system CSS (futhark.css stays verbatim from Claude Design). */
[hidden] { display: none !important; }
.notice--draft { border-style: dashed; }
.interp__advice { font-style: italic; color: var(--parchment); white-space: pre-line; }
.bag.ph { border: 0; background-color: transparent; box-shadow: none; }
.bag__svg { display: block; width: 100%; height: 100%; filter: drop-shadow(0 10px 14px oklch(0 0 0 / 0.5)); }
.bag__body { fill: oklch(0.36 0.05 52); stroke: oklch(0.22 0.03 50); stroke-width: 3; }
.bag__neck { fill: none; stroke: oklch(0.22 0.03 50); stroke-width: 4; }
.bag__top { fill: oklch(0.4 0.05 52); stroke: oklch(0.22 0.03 50); stroke-width: 3; }
.bag__cord { fill: none; stroke: var(--ochre-hi); stroke-width: 2.5; stroke-linecap: round; }
.bag:hover .bag__body { stroke: var(--ochre-hi); }
/* futhark.css sets 280px bag column at 1440+ after the --nobag rule, so the board was squeezed when the bag is hidden. */
@media (min-width: 1440px) { .table--nobag { grid-template-columns: minmax(0, 1fr); } }
/* Reading body wraps notice, list, summary and actions: same rhythm as .interp (the mockup had them as direct children). */
.interp__body { display: grid; gap: var(--sp-5); }
.stanza-row__note { margin-top: var(--sp-2); max-width: 46em; }
/* futhark.css does not reset the browser's 40px dd indent: on 320px the fact values were squeezed and broke mid-word. */
.facts__v { margin: 0; }
/* Atmosphere photos (tools/gen_images.py → build_images.py). Always under a dark veil so text keeps contrast. */
.hero__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 60%; z-index: -1; }
.hero__bg::after { content: ""; position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(90deg, oklch(0.13 0.01 250 / 0.88) 0%, oklch(0.13 0.01 250 / 0.55) 55%, oklch(0.13 0.01 250 / 0.35) 100%),
              linear-gradient(180deg, oklch(0.13 0.01 250 / 0.1) 55%, oklch(0.15 0.008 250 / 0.95) 100%); }
.hero__bg { isolation: isolate; }
.rune-top { position: relative; isolation: isolate; overflow: hidden; border-bottom: 1px solid oklch(0.3 0.014 242 / 0.6); }
.rune-top__bg { position: absolute; inset: 0; z-index: -1; }
.rune-top__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }
.rune-top__bg::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, oklch(0.15 0.008 250 / 0.3) 0%, oklch(0.15 0.008 250 / 0.55) 45%, oklch(0.15 0.008 250 / 0.72) 100%),
              linear-gradient(180deg, oklch(0.15 0.008 250 / 0.2) 60%, oklch(0.16 0.008 250) 100%); }
@media (max-width: 767px) { .rune-top__bg::after { background: linear-gradient(180deg, oklch(0.15 0.008 250 / 0.45) 0%, oklch(0.15 0.008 250 / 0.9) 45%, oklch(0.16 0.008 250) 100%); } }
.daily__photo { display: block; border-radius: var(--r-2); overflow: hidden; border: 1px solid oklch(0.36 0.016 240 / 0.6); box-shadow: var(--sh-2); aspect-ratio: 16 / 10; }
.daily__photo { grid-column: 1 / -1; }
.daily__photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s ease; }
.daily__photo:hover img { transform: scale(1.03); }
@media (min-width: 1024px) { .daily { grid-template-columns: auto minmax(0, 1fr) minmax(0, 0.9fr); } .daily__photo { grid-column: auto; aspect-ratio: 4 / 5; } }
@media (prefers-reduced-motion: reduce) { .daily__photo img { transition: none; } }
.section--photo { position: relative; isolation: isolate; overflow: hidden; }
.section__photo { position: absolute; inset: 0; z-index: -1; }
.section__photo img { width: 100%; height: 100%; object-fit: cover; }
.section__photo::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, oklch(0.16 0.008 250 / 0.92) 0%, oklch(0.16 0.008 250 / 0.5) 30%, oklch(0.16 0.008 250 / 0.6) 70%, oklch(0.16 0.008 250 / 0.95) 100%); }
.runy-head { display: grid; gap: var(--sp-4); padding-block: var(--sp-6) var(--sp-8); max-width: 40em; }
/* Top-of-page photo that fades into the background (reading screen). */
.page { position: relative; isolation: isolate; }
.page-photo { position: absolute; top: 0; left: 0; right: 0; height: 520px; z-index: -1; overflow: hidden; }
.page-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.page-photo::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, oklch(0.16 0.008 250 / 0.55) 0%, oklch(0.16 0.008 250 / 0.85) 60%, oklch(0.16 0.008 250) 100%); }

/* Rune nav: the middle "all runes" cell as a full card with the 24-rune strip (current rune lit) */
.runenav__all { flex-direction: column; gap: var(--sp-2); padding: var(--sp-4); border-style: solid; background-color: var(--graphite); background-image: var(--tx-grain); color: var(--bone); text-decoration: none; text-align: center; min-width: 0; }
.runenav__all:hover { color: var(--bone); border-color: var(--ochre); }
.runenav__all:hover .runenav__name { color: var(--ember); }
.runenav__all .runenav__name { transition: color .2s; }
.runenav__strip { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 12px; margin-top: 2px; }
.runenav__att { display: inline-flex; gap: 4px; }
.runenav__g { width: 9px; height: 15px; overflow: visible; }
.runenav__g path { fill: none; stroke: var(--frost); stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; opacity: .45; }
.runenav__g.is-current path { stroke: var(--ember); opacity: 1; }
/* Phones: two cards side by side squeeze the stone over the name — stack prev / next / all */
@media (max-width: 599px) {
  .runenav { grid-template-columns: minmax(0, 1fr); }
  .runenav > :last-child:nth-child(2n + 1) { grid-column: auto; }
  .runenav__strip { gap: 6px 10px; }
  .runenav__att { gap: 4px; }
  .runenav__g { width: 8px; height: 14px; }
}
/* Tablets: three cards are too narrow for "← Предыдущая · 3" — prev / next in a row, the strip card below */
@media (min-width: 600px) and (max-width: 1199px) {
  .runenav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .runenav__link, .runenav__link--next { grid-row: 1; }
  .runenav__link { grid-column: 1; }
  .runenav__link--next { grid-column: 2; }
  .runenav > .runenav__all:last-child:nth-child(2n + 1) { grid-column: 1 / -1; grid-row: 2; }
}

/* Contacts: room between the closing notice and the footer */
.kontakty { padding-bottom: var(--sp-7); }

/* Spread pages (/rasklad/<id>/) */
.spread-head .tercet { margin-top: var(--sp-3); }
.spread-head__go { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-4); margin-top: var(--sp-5); }
.steps { margin: 0; padding-left: 1.4em; display: grid; gap: var(--sp-2); color: var(--parchment); }
.steps li::marker { color: var(--ember); font-family: var(--f-display); }
.positions { display: grid; gap: var(--sp-4); }
.position { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: var(--sp-4); padding: var(--sp-4); border: 1px solid var(--line); border-radius: var(--r-3); background-color: var(--graphite); background-image: var(--tx-grain); }
.position__n { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--ochre); color: var(--ember); font-family: var(--f-display); font-size: 20px; }
.position__n--rune svg { width: 16px; height: 26px; overflow: visible; }
.position__n--rune path { fill: none; stroke: var(--ember); stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; }
.position__title { margin: 0; font-size: 22px; }
.position__q { margin: 2px 0 var(--sp-2); color: var(--frost); font-size: 14px; letter-spacing: .06em; text-transform: uppercase; }
.position__body p { margin: 0; color: var(--parchment); }
.position__body p + p { margin-top: var(--sp-2); }
.example { display: grid; gap: var(--sp-5); }
.example__q { margin: 0; font-family: var(--f-display); font-size: 22px; color: var(--bone); }
.example__runes { display: flex; flex-wrap: wrap; gap: var(--sp-4); }
.example__rune { display: grid; justify-items: center; gap: 4px; width: 96px; text-align: center; color: var(--bone); text-decoration: none; }
.example__rune:hover .example__name { color: var(--ember); }
.example__pos { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--frost); }
.example__name { font-size: 15px; line-height: 1.25; }
.stone--rev .stone__rune, .rune--rev { transform: rotate(180deg); }
.example__sum { padding: var(--sp-5); border: 1px solid var(--ochre); border-radius: var(--r-3); background-color: oklch(0.2 0.02 40 / 0.35); }
.example__sum p { margin: var(--sp-2) 0 0; color: var(--bone); font-size: var(--fs-lead); line-height: 1.55; }
@media (min-width: 768px) { .positions:not(.positions--example) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pick__about { margin: var(--sp-4) 0 0; color: var(--frost); font-size: 15px; line-height: 1.7; }

/* Poems (/poemy/) */
.poem-cards { display: grid; gap: var(--sp-4); }
@media (min-width: 900px) { .poem-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } .poem-cards--two { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.poem-card { display: grid; grid-template-rows: auto 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-3); background-color: var(--graphite); background-image: var(--tx-grain); color: var(--bone); text-decoration: none; }
.poem-card:hover { border-color: var(--ochre); color: var(--bone); }
.poem-card__photo { display: block; aspect-ratio: 16 / 9; background: oklch(0.16 0.01 250); }
.poem-card__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.poem-card__body { display: grid; align-content: start; gap: var(--sp-2); padding: var(--sp-4); }
.poem-card__title { font-family: var(--f-display); font-size: 24px; line-height: 1.2; }
.poem-card__first { font-style: italic; color: var(--parchment); }
.poem-card__count { color: var(--ember); font-size: 15px; }
.poem-rune { display: flex; align-items: center; gap: var(--sp-3); }
.poem-rune__n { color: var(--frost); font-size: 15px; margin-right: 4px; }
.page-end { margin-bottom: var(--sp-7); }

/* Articles (/stati/) */
.rev-lists { display: grid; gap: var(--sp-5); }
.next-links { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-2); }
.next-links li { min-width: 0; }
.next-links .more { white-space: normal; display: inline; overflow-wrap: anywhere; }

/* Library /biblioteka/ */
.lib-lead { margin: 0 0 var(--sp-4); max-width: 68ch; color: var(--muted); }
.lib-list { display: grid; gap: var(--sp-5); }
.lib-book { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: var(--sp-4); align-items: start; }
.lib-book__cover { width: 96px; }
.lib-book__title { font-family: var(--f-display); font-size: var(--fs-h3); line-height: 1.2; margin: 0 0 var(--sp-2); }
.lib-book__people, .lib-book__imprint { margin: 0 0 var(--sp-1); font-size: var(--fs-small); color: var(--muted); }
.lib-book__what { margin: var(--sp-2) 0 0; max-width: 68ch; }
@media (min-width: 1024px) { .lib-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6) var(--sp-5); } .lib-book { grid-template-columns: 140px minmax(0, 1fr); } .lib-book__cover { width: 140px; } }
/* Designed book covers (BookCover.astro): tinted board, grain, spine shading, gilt frame and emblem. Sizes in cqw so the
   same cover reads at 96px in the library list and at full card width on the home page. */
.cover { --cv: var(--fjord-deep); position: relative; display: block; aspect-ratio: 2 / 3; container-type: inline-size; overflow: hidden;
  border-radius: 2px 5px 5px 2px; color: var(--gold); box-shadow: var(--sh-2);
  background-color: var(--cv);
  background-image: linear-gradient(90deg, oklch(0 0 0 / 0.45) 0, oklch(1 0 0 / 0.08) 3.5%, oklch(0 0 0 / 0.25) 5%, transparent 9%),
    radial-gradient(120% 80% at 50% 40%, oklch(1 0 0 / 0.06), oklch(0 0 0 / 0.35)), var(--tx-mottle), var(--tx-grain); }
.cover--fjord { --cv: oklch(0.3 0.045 238); }
.cover--oxblood { --cv: oklch(0.3 0.08 25); }
.cover--moss { --cv: oklch(0.3 0.045 145); }
.cover--umber { --cv: oklch(0.31 0.045 60); }
.cover--slate { --cv: oklch(0.28 0.012 250); }
.cover--indigo { --cv: oklch(0.27 0.05 275); }
.cover__art { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: currentColor; }
.cover__frame { stroke-width: 1.2; opacity: 0.85; }
.cover__frame--thin { stroke-width: 0.6; opacity: 0.6; }
.cover__rule { stroke-width: 1; opacity: 0.8; }
.cover__fill { fill: currentColor; stroke: none; opacity: 0.9; }
.cover__emblem { stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 1px 0 oklch(0 0 0 / 0.5)); }
.cover__thin { stroke-width: 1.2; opacity: 0.85; }
.cover__solid { fill: currentColor; fill-opacity: 0.18; }
.cover__dots { stroke-width: 2; stroke-dasharray: 0 5.5; }
.cover__by, .cover__title, .cover__year { position: absolute; left: 12%; right: 12%; text-align: center; font-family: var(--f-display); }
.cover__by { top: 11%; font-size: 5.2cqw; letter-spacing: 0.08em; text-transform: uppercase; opacity: 0.8; }
.cover__title { top: 17%; height: 22%; display: flex; align-items: center; justify-content: center; font-size: 11cqw; line-height: 1.05;
  color: var(--parchment); text-shadow: 0 1px 0 oklch(0 0 0 / 0.6); overflow-wrap: anywhere; }
.cover__title--long { font-size: 8cqw; }
.cover__year { bottom: 7.5%; font-size: 5.5cqw; letter-spacing: 0.2em; opacity: 0.85; }
.book:hover .cover { color: var(--ochre-hi); }
/* A notice closing the page sat flush on the footer (library page). */
main.wrap > .notice:last-child { margin-bottom: var(--section); }
/* Spread cards carry their spread's photo under a dark wash; the stone schema and text stay readable on the left. */
.spread { position: relative; overflow: hidden; isolation: isolate; }
.spread__photo { position: absolute; inset: 0; z-index: -1; }
.spread__photo img { width: 100%; height: 100%; object-fit: cover; opacity: 0.72; transition: opacity .2s ease, transform .4s ease; }
.spread__photo::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, oklch(0.19 0.012 246 / 0.94) 0%, oklch(0.19 0.012 246 / 0.7) 50%, oklch(0.19 0.012 246 / 0.25) 100%); }
.spread:hover .spread__photo img { opacity: 0.75; transform: scale(1.03); }
.spread .layout { background-color: oklch(0.13 0.01 250 / 0.55); backdrop-filter: blur(2px); }
/* In-article picture between sections (stati/[slug]). */
.art-fig { margin: var(--sp-6) 0; }
.art-fig__img { display: block; width: 100%; height: auto; aspect-ratio: 1536 / 832; object-fit: cover; border-radius: var(--r-3); box-shadow: var(--sh-2); }
/* One aett's tiles inside an article section (stati/atty-run). */
.atts--one { margin-top: var(--sp-5); }
/* Logo: ᚠᚢᚦᚨᚱᚲ ("futhark" in its own runes, Codex stone runes, public/logo-runes.webp) alone; the word is kept for screen readers. */
.logo__mark { display: block; width: auto; height: 30px; flex: none; filter: drop-shadow(0 2px 4px oklch(0 0 0 / 0.6)); transition: filter .15s ease; }
.logo:hover .logo__mark { filter: drop-shadow(0 2px 4px oklch(0 0 0 / 0.6)) brightness(1.15); }
.logo .logo__word { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (min-width: 768px) { .logo__mark { height: 36px; } }
@media (min-width: 1024px) { .logo__mark { height: 44px; } }
/* Mobile menu: anchor to the padded header row (the sticky header was the containing block, so the panel's text sat on
   the screen edge) and paint it solid — over the hero the 0.98 wash still let the headline ghost through. */
.header__inner { position: relative; }
@media (max-width: 1023px) { .nav.is-open { left: 0; right: 0; background-color: oklch(0.15 0.008 250); box-shadow: 0 16px 32px oklch(0 0 0 / 0.55); } }
/* Header dropdown under «Руны» (desktop only): 3 aetts × 8 runes; on phones the menu link just opens /runy/. */
.nav__drop { position: relative; display: flex; }
.runes-menu { display: none; }
@media (min-width: 1024px) {
  .runes-menu { position: absolute; top: 100%; left: -24px; z-index: 30; display: grid; grid-template-columns: repeat(3, 150px); gap: var(--sp-2) var(--sp-5);
    padding: var(--sp-5); margin-top: 8px; border: 1px solid var(--line); border-radius: var(--r-3);
    background-color: oklch(0.15 0.008 250); box-shadow: 0 18px 40px oklch(0 0 0 / 0.6);
    opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .15s ease, transform .15s ease, visibility 0s .15s; }
  .runes-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; }
  .nav__drop:hover .runes-menu, .nav__drop:focus-within .runes-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
  .runes-menu__att { display: grid; gap: 2px; align-content: start; }
  .runes-menu__h { font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ochre-hi); margin-bottom: var(--sp-1); }
  .nav .runes-menu__r { display: flex; align-items: center; gap: 10px; min-height: 30px; font-size: 15px; color: var(--parchment); }
  .runes-menu__r .rune { width: 12px; height: 20px; flex: none; }
  .runes-menu__r .rune path { stroke-width: 6; }
  .nav .runes-menu__r:hover { color: var(--ochre-hi); }
  .runes-menu__r:hover .rune .paint { stroke: var(--ochre-hi); }
  .nav .runes-menu__more { grid-column: 1 / -1; min-height: 36px; margin-top: var(--sp-2); padding-top: var(--sp-3); border-top: 1px solid var(--line); color: var(--ochre-hi); font-size: 15px; }
}

/* Name in runes page */
.nr-form { max-width: 34em; margin-bottom: var(--sp-5); }
.nr-stage { min-height: 150px; padding: var(--sp-5) var(--sp-4); border: 1px solid var(--line); border-radius: var(--r-2); background-color: oklch(0.13 0.008 250 / 0.7); box-shadow: var(--sh-cut); }
.nr-out { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: center; gap: var(--sp-5) var(--sp-3); }
.nr-word { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sp-4) 6px; max-width: 100%; }
.nr-rune { display: grid; justify-items: center; gap: 6px; width: 64px; color: var(--muted); text-decoration: none; }
.nr-rune:hover { color: var(--bone); }
.nr-rune:hover .rune .paint { stroke: var(--ochre-hi); }
.nr-rune__glyph { width: 40px; height: 66px; }
.nr-rune__name { font-size: 12px; line-height: 1.2; text-align: center; overflow-wrap: anywhere; }
.nr-dot { align-self: flex-start; width: 8px; height: 8px; margin: 29px 6px 0; background-color: var(--ochre); transform: rotate(45deg); flex: none; }
.nr-empty { margin: 0; text-align: center; color: var(--muted); }
.nr-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3) var(--sp-4); margin-top: var(--sp-5); }
.nr-hint { font-size: var(--fs-small); color: var(--muted); }
.nr-sub { margin: var(--sp-6) 0 var(--sp-3); }
.nr-lines { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-2); }
.nr-lines b { color: var(--bone); }
.nr-note { max-width: 40em; margin-top: var(--sp-4); font-size: var(--fs-small); color: var(--muted); }
.nr-map { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1px; border: 1px solid var(--line); background-color: var(--line); }
.nr-map li { display: grid; grid-template-columns: 3.2em minmax(0, 1fr); gap: var(--sp-3); padding: var(--sp-2) var(--sp-3); background-color: oklch(0.15 0.008 250); }
.nr-map b { color: var(--ochre-hi); }
@media (min-width: 720px) { .nr-map { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nr-rune { width: 76px; } .nr-rune__glyph { width: 48px; height: 80px; } .nr-rune__name { font-size: 13px; } .nr-dot { margin-top: 36px; } }
@media (min-width: 1024px) { .nr-map { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* Pantheon (/bogi/): god cards with photo under a wash, rune stones, the naming stanza; later-links block; god page runes + nav. */
.gods { display: grid; gap: var(--sp-4); }
@media (min-width: 768px) { .gods { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-5); } }
@media (min-width: 1200px) { .gods { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.god-card { position: relative; isolation: isolate; overflow: hidden; display: grid; gap: var(--sp-4); align-content: start; min-height: 300px;
  padding: var(--sp-5); border: 1px solid var(--line); border-radius: var(--r-3); background-color: var(--graphite);
  color: var(--bone); text-decoration: none; box-shadow: var(--sh-1); transition: border-color .15s ease; }
.god-card:hover { color: var(--bone); border-color: var(--ochre); }
.god-card__photo { position: absolute; inset: 0; z-index: -1; }
.god-card__photo img { width: 100%; height: 100%; object-fit: cover; opacity: 0.55; transition: opacity .2s ease, transform .4s ease; }
.god-card__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, oklch(0.17 0.012 246 / 0.55) 0%, oklch(0.17 0.012 246 / 0.92) 55%); }
.god-card:hover .god-card__photo img { opacity: 0.7; transform: scale(1.03); }
.god-card__runes { display: flex; gap: var(--sp-2); }
.god-card__runes .stone { width: 44px; }
.god-card__body { display: grid; gap: var(--sp-2); }
.god-card__name { font-family: var(--f-display); font-size: 28px; line-height: 1.1; }
.god-card__epithet { color: var(--ochre-hi); font-size: var(--fs-small); }
.god-card__line { font-style: italic; color: var(--parchment); line-height: 1.5; }
.god-card__src { font-size: 13px; letter-spacing: 0.06em; color: var(--muted); }
.later { display: grid; gap: var(--sp-5); }
@media (min-width: 768px) { .later { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.later__item { padding: var(--sp-5); border: 1px dashed var(--line); border-radius: var(--r-3); }
.later__item p { margin: var(--sp-2) 0 var(--sp-3); color: var(--muted); }
.later__name { font-family: var(--f-display); font-size: var(--fs-h3); margin: 0; }
.god-runes { display: grid; gap: var(--sp-3); margin-top: var(--sp-6); }
.god-runes__list { display: flex; flex-wrap: wrap; gap: var(--sp-4); }
.god-nav { display: grid; gap: var(--sp-3); margin: var(--sp-6) 0; }
@media (min-width: 768px) { .god-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.god-nav__link { display: grid; gap: var(--sp-1); padding: var(--sp-4) var(--sp-5); border: 1px solid var(--line); border-radius: var(--r-3);
  color: var(--bone); text-decoration: none; font-family: var(--f-display); font-size: 20px; }
.god-nav__link:hover { color: var(--bone); border-color: var(--ochre); }
.god-nav__link--all { text-align: center; }
.god-nav__link--next { text-align: right; }
/* Yggdrasil scheme (/iggdrasil/). */
.ygg { margin: var(--sp-6) 0; padding: var(--sp-5); border: 1px solid var(--line); border-radius: var(--r-3); background-color: var(--basalt-2); }
.ygg__svg { display: block; width: 100%; max-width: 760px; height: auto; margin: 0 auto; overflow: visible; }
.ygg__crown, .ygg__trunk, .ygg__root, .ygg__well { fill: none; stroke: var(--gold); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.ygg__crown { fill: oklch(0.3 0.045 145 / 0.25); }
.ygg__well { fill: oklch(0.42 0.035 238 / 0.35); stroke: var(--frost); }
.ygg__t { fill: var(--parchment); font-family: var(--f-text); font-size: 19px; }
.ygg__t--h { font-family: var(--f-display); font-size: 24px; fill: var(--bone); }
.ygg__t--sm { font-size: 15px; fill: var(--muted); font-style: italic; }
.ygg figcaption { margin-top: var(--sp-3); text-align: center; }
.rune-gods { margin-top: var(--sp-5); color: var(--muted); }