/* ═══════════════════════════════════════════════════════════════════════════
   Anvilborn theme layer — loaded after app.css.
   Palette, blackletter brand titles, and the iron / parchment / soot finish.
   Source of truth for colours and fonts: docs/ANVILBORN_LORE.md §9.
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  /* palette */
  --soot: #0d0b0a;
  --oak: #1b1714;
  --iron: #3c3b39;
  --iron-hi: #6d6a64;
  --parchment: #d8c9a3;
  --ink: #241c14;
  --brass: #b08d4a;
  --brass-hi: #d9b872;
  --blood: #8b1a1a;
  --blood-hi: #b3261e;
  --verdigris: #4f7a6a;
  --sorcery: #6b3fa0;
  --frost: #7fa7c9;

  /* legacy token names used across app.css / index.html, re-pointed */
  --gold: var(--brass-hi);
  --gold-bright: #e9d9a6;
  --gold-dark: #7a5f2a;
  --ember: var(--blood-hi);
  --deep: var(--soot);
  --panel: var(--oak);
  --text: #e3d6b5;
  --text-dim: #a8977a;

  /* type */
  --font-display: 'Pirata One', 'IM Fell English SC', serif;
  --font-heading: 'IM Fell English SC', Georgia, serif;
  --font-body: 'Alegreya', Georgia, serif;
  --font-ui: 'Alegreya Sans SC', Arial, sans-serif;
}

body { background-color: var(--soot); }

/* ── Blackletter brand titles (mixed case only — never uppercase blackletter) ─ */
.hero-title,
.footer-logo,
.screen-title,
#auth-modal-title,
.lu-title {
  font-family: var(--font-display) !important;
  text-transform: none !important;
  letter-spacing: 0.02em !important;
  font-weight: 400 !important;
}
.hero-title { font-size: clamp(3.4rem, 9vw, 7.6rem); }
.screen-title { font-size: 2.1rem; }

/* ── Film grain + vignette over every screen (pointer-transparent) ─────────── */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  pointer-events: none;
  background:
    radial-gradient(ellipse 120% 90% at 50% 45%, transparent 60%, rgba(0, 0, 0, 0.4) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.45 0 0 0 0 0.4 0 0 0 0.09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: overlay;
}

/* ── Card rules text: parchment readability ───────────────────────────────── */
.cc-desc, .minion-tooltip, .hc-tooltip {
  font-family: var(--font-body);
}

/* ── Embers become drifting ash ───────────────────────────────────────────── */
.spark {
  background: #c9b9a0 !important;
  box-shadow: 0 0 4px rgba(217, 184, 114, 0.35);
}

/* ── Scrollbars in iron ───────────────────────────────────────────────────── */
* { scrollbar-color: var(--iron-hi) var(--soot); }
::-webkit-scrollbar-thumb { background: var(--iron); border: 1px solid var(--iron-hi); }
::-webkit-scrollbar-track { background: var(--soot); }

/* ── Selection ────────────────────────────────────────────────────────────── */
::selection { background: rgba(139, 26, 26, 0.6); color: #f1e6c9; }

/* ── Painted icons: show in full colour (the old line-art icons were tinted to silhouettes) ── */
.sign-icon-img,
.feature-icon-img {
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.7)) !important;
}

/* ── Nav wordmark a touch larger: the Anvilborn logo carries an anvil above the word ── */
.nav-logo-img { height: 60px; mix-blend-mode: normal; filter: drop-shadow(0 0 6px rgba(179, 38, 30, 0.35)); }

/* ── Mobile: disable GPU-heavy effects ─────────────────────────────────────── */
@media (pointer: coarse) {
  body::after { display: none !important; }
  .ab-hero-panel, .ab-panel { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
}