/* Castle theme — the dark medieval retune of tokens.css's roles. Values copied verbatim
   from design_handoff/prototype's <style> block (the authoritative production values).
   Fonts are self-hosted (see fonts.css) instead of the prototype's Google Fonts <link>,
   for offline-first correctness — same families, same weights, same visual result. */

:root {
  --font-reading: 'Lexend', sans-serif;
  --q-size: 25px;

  --color-bg: #211a13;
  --color-surface: #2a221a;
  --color-text: #efe5d2;
  --color-divider: rgba(239, 229, 210, 0.22);

  --color-accent: #d08a3e;
  --color-accent-2: #d08a3e;
  --color-accent-100: #362a1b;
  --color-accent-200: #46351f;
  --color-accent-300: #5f4626;
  --color-accent-400: #8c6230;
  --color-accent-500: #b97f3d;
  --color-accent-600: #dc9f58;
  --color-accent-700: #e7b87e;
  --color-accent-800: #f0d2a4;
  --color-accent-900: #f9e9cd;
  --color-accent-2-100: #362a1b;
  --color-accent-2-800: #f0d2a4;

  --color-neutral-100: #1b1610;
  --color-neutral-200: #362f26;
  --color-neutral-300: #443b2f;
  --color-neutral-400: #5b5142;
  --color-neutral-500: #746856;
  --color-neutral-600: #9d9077;
  --color-neutral-700: #bfb298;
  --color-neutral-800: #dcd1b8;
  --color-neutral-900: #f0e8d6;

  --color-hot: #b3524a; /* functional red — "hot" semantics only (thermometer-style diagrams) */

  --font-heading: 'MedievalSharp', 'Barlow Condensed', sans-serif;
  --font-heading-weight: 400;
}

body { margin: 0; background: var(--color-bg); }
a { color: var(--color-accent-600); }
a:hover { color: var(--color-accent-700); }

@keyframes wiggle {
  0%, 100% { transform: rotate(0deg) scale(1); }
  25% { transform: rotate(-7deg) scale(1.06); }
  50% { transform: rotate(6deg) scale(1.06); }
  75% { transform: rotate(-4deg) scale(1.03); }
}
@keyframes fire-small {
  0% { transform: translate(0, 110%); }
  35% { transform: translate(-1%, 42%); }
  55% { transform: translate(1%, 48%); }
  75% { transform: translate(-0.5%, 44%); }
  100% { transform: translate(0, 115%); }
}
@keyframes fire-big {
  0% { transform: translate(0, 110%); }
  30% { transform: translate(-2%, -4%); }
  50% { transform: translate(2%, -1%); }
  70% { transform: translate(-1%, -3%); }
  100% { transform: translate(0, 115%); }
}
@keyframes fadeq-a { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeq-b { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fireball-zoom   { 0% { transform: scale(0.05) rotate(0deg);   opacity: 0; } 12% { opacity: 1;   } 100% { transform: scale(9) rotate(500deg);  opacity: 1; } }
@keyframes fireball-zoom-b { 0% { transform: scale(0.05) rotate(0deg);   opacity: 0; } 12% { opacity: 0.9; } 100% { transform: scale(8) rotate(-460deg); opacity: 1; } }
@keyframes stage-in { from { opacity: 0; transform: translateY(10px) scale(0.85); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes bonus-rain-fall {
  0% { transform: translateY(0) rotate(0deg); opacity: 0; }
  8% { opacity: 1; }
  92% { opacity: 1; }
  100% { transform: translateY(125vh) rotate(360deg); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}