/* ============================================================
   MIDGARD 5 — REGIONEN-THEMES
   ------------------------------------------------------------
   Die Herkunftswahl färbt die Akzentfarben der Oberfläche um
   (html[data-region="…"], gesetzt von js/theme.js). Designregel:
   NUR die heraldischen Akzente (--h-gules = Primärakzent,
   --h-or = Sekundär-/Goldakzent) wechseln — Pergament- und
   Tintenfarben bleiben konstant, damit die Lesbarkeit nie leidet.

   Paletten (heraldisch begründet, gern justieren):
     frei        Rot & Gold            (Midgard-Standard)
     alba        Königsrot & Altgold   (Clan und Krone, Kirgh)
     waeland     Eisblau & Silber      (Nordmeer, Runen)
     moravod     Waldgrün & Bernstein  (Anderswelt, Wälder)
     eschar      Feuerocker & Sandgold (Ormuts Flamme, Wüste)
     kanthaipan  Jade & Lackrot        (Jadekaiser)
     cuanscadan  Smaragd & Kupfer      (Erainn, Nathir)
     nihavand    Lapisblau & Messing   (Perle Arans)
     zwerge      Glut & Bronze         (Esse und Stein)
   ============================================================ */

/* Sanfter Übergang beim Themenwechsel */
html { transition: none; }
body, .page, .topnav, .panel, .setup-card, .steps-bar {
  transition: border-color .6s ease, background-color .6s ease;
}

html[data-region="alba"] {
  --h-gules: #8e1c14; --h-gules-deep: #6b120c; --h-gules-bright: #b32e22;
  --h-or: #c39732;    --h-or-deep: #97701a;    --h-or-bright: #e2bb55;
}
html[data-region="waeland"] {
  --h-gules: #2b5d7d; --h-gules-deep: #1d4259; --h-gules-bright: #3f7fa6;
  --h-or: #8fa9b8;    --h-or-deep: #66808f;    --h-or-bright: #b8cdd9;
}
html[data-region="moravod"] {
  --h-gules: #3d6427; --h-gules-deep: #2a4719; --h-gules-bright: #558a38;
  --h-or: #c19a3f;    --h-or-deep: #927222;    --h-or-bright: #ddb95e;
}
html[data-region="eschar"] {
  --h-gules: #b4541b; --h-gules-deep: #8c3d10; --h-gules-bright: #d76f2e;
  --h-or: #d2a14a;    --h-or-deep: #a87a29;    --h-or-bright: #ecc06a;
}
html[data-region="kanthaipan"] {
  --h-gules: #27716b; --h-gules-deep: #1a524d; --h-gules-bright: #379a92;
  --h-or: #b03a2e;    --h-or-deep: #87271d;    --h-or-bright: #d05a4d;
}
html[data-region="cuanscadan"] {
  --h-gules: #1e7a46; --h-gules-deep: #145932; --h-gules-bright: #2da05e;
  --h-or: #b87333;    --h-or-deep: #8d551f;    --h-or-bright: #d6924e;
}
html[data-region="nihavand"] {
  --h-gules: #1f4e79; --h-gules-deep: #14355a; --h-gules-bright: #2f6ba3;
  --h-or: #c8962a;    --h-or-deep: #9a6f17;    --h-or-bright: #e6b94e;
}
html[data-region="zwerge"] {
  --h-gules: #9c3b10; --h-gules-deep: #75290a; --h-gules-bright: #c25420;
  --h-or: #b08036;    --h-or-deep: #855d1e;    --h-or-bright: #d0a054;
}
html[data-region="rawindra"] {
  --h-gules: #a8331f; --h-gules-deep: #7f2615; --h-gules-bright: #c8472a;
  --h-or: #d99a2b;    --h-or-deep: #a8741b;    --h-or-bright: #ecb850;
}
html[data-region="elfen"] {
  --h-gules: #2f6f63; --h-gules-deep: #1f5049; --h-gules-bright: #429485;
  --h-or: #aebfc2;    --h-or-deep: #84979b;    --h-or-bright: #cdd9db;
}

/* ============================================================
   SZENE (Vollbild-Hintergrund) — zwei Ebenen für Crossfade
   js/theme.js blendet bei Regionswechsel die zweite Ebene mit
   dem neuen Motiv ein (assets/images/bg/<region>.webp).
   ============================================================ */
.scene__layer {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1.2s ease;
}
.scene__layer.is-visible { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .scene__layer { transition: none; }
  body, .page, .topnav, .panel, .setup-card, .steps-bar { transition: none; }
}