/* Kindling shared display skin — v0.9.1 "the face got stranger".
   Fonts, icons, atmosphere. Content and copy untouched. */

/* ---- self-hosted antique type: IM Fell English + SC ---- */
@font-face {
  font-family: 'IM Fell English';
  src: url('/fonts/imfellenglish-regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'IM Fell English';
  src: url('/fonts/imfellenglish-italic.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'IM Fell English SC';
  src: url('/fonts/imfellenglishsc-regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}

:root {
  --display: 'IM Fell English', 'Iowan Old Style', Georgia, serif;
  --display-sc: 'IM Fell English SC', 'IM Fell English', 'Iowan Old Style', Georgia, serif;
}

/* ---- woodcut icon set ---- */
.ic {
  display: inline-block;
  width: 1.05em; height: 1.05em;
  vertical-align: -0.16em;
  fill: none; stroke: currentColor;
  stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
}
.ic-hero { width: 3.4rem; height: 3.4rem; }

/* ---- antique display type: headings only, body prose untouched ---- */
h1 { font-family: var(--display); }
h2, .k, .navlink, .alpha, .tb-kicker, .change-head, .card h2,
h2.sect, h3.sub, summary.sub { font-family: var(--display-sc); }
.arc-name, .tbanner h3, .moment-card .comm, blockquote { font-family: var(--display); }

/* ---- candle-flicker glow for the hero title ---- */
@keyframes kindle-glow {
  0%, 100% { text-shadow: 0 0 14px rgba(240,199,94,.16), 0 0 60px rgba(232,163,61,.07); }
  35%      { text-shadow: 0 0 26px rgba(240,199,94,.30), 0 0 90px rgba(232,163,61,.15); }
  62%      { text-shadow: 0 0 10px rgba(240,199,94,.12), 0 0 50px rgba(232,163,61,.05); }
}
.title-glow { animation: kindle-glow 6s ease-in-out infinite; }

/* ---- paper grain + vignette: the page as a printed broadside ---- */
body::before {
  content: ""; position: fixed; inset: 0; z-index: 1999; pointer-events: none;
  background: radial-gradient(120% 95% at 50% 38%, transparent 52%, rgba(0,0,0,.40) 100%);
}
body::after {
  content: ""; position: fixed; inset: 0; z-index: 2000; pointer-events: none; opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.65'/%3E%3C/svg%3E");
}

@media (prefers-reduced-motion: reduce) {
  .title-glow, .lantern { animation: none !important; }
  body::after { display: none; }
}