/* Wildlands: one look for every Hexacter Heroes kids page, matching the cel-shaded 3D heroes (ready-world.js).
   A golden-hour valley behind everything, carved-stone panels with gold edges, teal rune accents, Marcellus headings.
   Loaded after each page's own stylesheet. The tokens sit on body so they win over the pages' light/dark :root blocks
   (the same look in both settings), and cover the token names each family of pages uses:
   kids-apps.css (--card, --mute…), the Heroes quiz (--hex-…) and Hero Spell (--surface, --jade…). */
@font-face{font-family:"Marcellus";src:url(/assets/fonts/Marcellus-Regular.woff2) format("woff2"),url(/assets/fonts/Marcellus-Regular.ttf) format("truetype");font-weight:400;font-display:swap}
body{
  --bg:#1b1814;--card:#2a251e;--paper:#312b23;--soft:#3a3228;--ink:#f6eedb;--mute:#cfc1a2;--line:#5a4b31;
  --acc:#ecc874;--acc-ink:#22180a;--acc2:#62f0dc;--good:#8fe0b3;--goodbg:#1d3a2b;--rune:#62f0dc;
  --red:#ff9e7a;--blue:#9cc8ff;--gold:#f4c95d;--green:#8fe0b3;
  --hex-grid:#5a4b31;--hex-ink:#f6eedb;--hexc:#ecc874;
  --surface:#2a251e;--surface-2:#312b23;--muted:#cfc1a2;--jade:#ecc874;--jade-soft:#3a3228;--amber:#f4c95d;--amber-soft:#3a3020;
  --ok:#8fe0b3;--ok-soft:#1d3a2b;--no:#ffb3c6;--no-soft:#3d2230;
  --shadow:0 12px 34px rgba(0,0,0,.42);
  --display:"Marcellus","Palatino Linotype",Georgia,serif;
  color-scheme:dark;
  background:linear-gradient(180deg,rgba(22,18,13,.3) 0,rgba(22,18,13,.74) 240px,rgba(22,18,13,.9) 560px),url(/assets/ready3d/valley.webp) center top/cover no-repeat fixed,#1b1814;
  text-shadow:0 1px 2px rgba(0,0,0,.45);   /* keeps text that sits on the scenery readable */
  font-weight:500;
  color:var(--ink);
}
h1,h2,h3,.display{font-family:var(--display);font-weight:400;letter-spacing:.03em}
h1,h2{text-shadow:0 2px 14px rgba(0,0,0,.45)}
a{color:var(--acc2)}
header.top{background:rgba(22,18,13,.62);border:1px solid var(--line);border-radius:14px;padding:8px 14px;margin-top:8px;backdrop-filter:blur(6px)}
header.top a{color:var(--ink)}
header.top nav a{color:var(--mute)}
header.top nav a[aria-current]{color:var(--acc)}
/* carved stone: the pages' own cards and panels pick up --card/--surface; give them gold-edged depth */
.card,.panel,.level,.skill,.pack,.opt,.app,.lcard,.wk,.quest,.qcard{border-color:var(--line);box-shadow:0 3px 0 var(--line),var(--shadow)}
.card,.panel{background-color:rgba(37,32,26,.93)}
.big,.btn.primary{box-shadow:0 4px 0 #9b7a35,0 0 18px rgba(236,200,116,.22)}
.kbd .kok{color:var(--bg)}
.progress i.done,.bar i{background:var(--acc)}
.progress i.now{background:var(--rune);box-shadow:0 0 10px rgba(98,240,220,.6)}
:focus-visible{outline-color:var(--rune)}
/* one look in every setting, so the light/dark switch has nothing to do */
#themeBtn,#theme,.theme-toggle{display:none!important}
/* hero art: the 3D portraits stand on the stone, lit from above */
img[src*="/assets/heroes/"],img[src*="/assets/ready3d/"]{filter:drop-shadow(0 10px 12px rgba(0,0,0,.45))}
.note,.suite,footer{color:var(--mute)}
.big,.btn.primary,.cast,[aria-pressed=true],.kbd button,input,textarea,select{text-shadow:none}
.lvpick button[aria-pressed=true],.seg button[aria-pressed=true]{color:var(--acc-ink)}

/* Chinese hero name (华文 on): sits under the English name */
.zhname{display:block;font-size:.62em;font-weight:700;letter-spacing:.04em;opacity:.92;margin-top:.15em}
#heroGrid .zhname{font-size:.85em}