:root {
  color-scheme: dark;
  --bg: #0b0908;
  --bg2: #191512;
  --card: #231b15;
  --card2: #302218;
  --text: #f8f1e6;
  --muted: #d1c3b0;
  --edge: #67482b;
  --gold: #f5ae20;
  --gold2: #ffcf69;
  --good: #91ddaa;
  --bad: #ffad9d;
  --flame: #f05b16;
}

body {
  background: radial-gradient(ellipse 900px 450px at 85% -150px, #6e2b0c55, transparent 75%), var(--bg);
  color: var(--text);
}

.top {
  background: #0b0908f2;
  border-bottom-color: #714121;
  box-shadow: 0 8px 28px #0008;
}
.brand b, .hero h1, .sectionhead h2, .hits-discovery h2, .hits-result h3 {
  font-family: Impact, 'Arial Black', 'Arial Narrow', 'Franklin Gothic Medium', system-ui, sans-serif;
  letter-spacing: .025em;
}
.brand b { font-size: 23px; line-height: 1; }
.brand small { color: var(--gold2); letter-spacing: .2em; }
.chip { color: var(--gold2); border-color: #99612d; background: #2b1d12; }
.dot { background: var(--flame); box-shadow: 0 0 12px #f05b16aa; }
.navbtn { color: #d5c7b5; }
.navbtn.active { background: #3a2112; border-color: #c66b2a; color: #fff0d0; }
.navbtn:hover { color: #fff7ea; background: #332013; }

.hero {
  border-color: #99551c;
  background: radial-gradient(circle at 85% 0%, #a6411b44, transparent 40%), linear-gradient(130deg, #25170e, #0f0c0a 68%);
  box-shadow: 0 18px 46px #0008, inset 0 1px #ffc15c30;
}
.hero::after { display: none; }
.hero h1 { font-weight: 900; text-transform: uppercase; letter-spacing: .01em; }
.hero h1 em { font-style: normal; color: var(--gold2); }
.hero p { color: #e5d7c5; }
.eyebrow { color: #ffb064; }
#home .hero { padding: 0; }
#home .hero-art { display: block; width: 100%; height: auto; }
#home .hero-copy { padding: clamp(24px, 4vw, 42px); border-top: 1px solid #a9591f; }
#home .hero h1 { max-width: none; font-size: clamp(37px, 5.5vw, 66px); margin: 9px 0 12px; }
#home .hero p { max-width: 800px; }

.btn {
  background: linear-gradient(180deg, #ffd05c, #e99b17);
  color: #160e08;
  border-color: #ffcf69;
  box-shadow: inset 0 1px #fff3be80, 0 4px 14px #0005;
}
.btn:hover { background: #ffd373; box-shadow: 0 7px 20px #f05b1638; }
.btn.ghost { background: #211711; border-color: #ba7236; color: #fff1dc; box-shadow: none; }
.btn.ghost:hover { background: #442713; }
.btn.soft { background: #362511; border-color: #9d6d35; color: #ffdf9e; box-shadow: none; }
.btn.danger { background: #381d1a; border-color: #a45148; color: #ffd1c4; box-shadow: none; }

.stat, .panel, .results {
  background: #191512;
  border-color: #5a4129;
  box-shadow: inset 0 1px #ffd08a0b;
}
.stat strong { color: #ffe1a2; }
.sectionhead h2 { text-transform: uppercase; letter-spacing: .02em; }
.control { background: #241a14; border-color: #7b5b3b; }
.control:focus { border-color: var(--gold); box-shadow: 0 0 0 3px #f5ae2033; }
.notice { background: #302015; border-left-color: var(--flame); }
.how b { background: #4b2613; color: #ffcd74; }

.qa {
  background: linear-gradient(150deg, #211915, #151210);
  border-color: #765537;
  box-shadow: 0 16px 36px #0007;
}
.qa h2 {
  font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: clamp(24px, 3.2vw, 36px);
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: -.015em;
}
.tag { background: #3c2717; border-color: #8d5b2e; color: #ffd788; }
.choice {
  min-height: 70px;
  background: #2b2019;
  border-color: #8c6949;
  color: #fff8ec;
  font-weight: 600;
}
.choice:hover:not(:disabled) { background: #422717; border-color: #f5ae20; }
.choice .letter { background: #4a2e19; border-color: #b47b39; color: #ffe0a1; }
.choice.selected { background: #492713; border-color: #ffac45; }
.choice.selected .letter { background: #9b4a13; border-color: #ffb759; }
.choice.correct { background: #1b3a29; border-color: #6ec28b; }
.choice.incorrect { background: #512825; border-color: #ec8474; }
.progress { height: 10px; background: #392b20; }
.progress > div { background: linear-gradient(90deg, #f05b16, #ffb42e, #ffe07a); }
.playhead .btn { flex: none; white-space: nowrap; }
.feedback { background: #1d3325; border-color: #65a77a; }
.feedback.bad { background: #3f2520; border-color: #c57468; }
.score { color: #ffca5a; text-shadow: 0 0 25px #f05b163b; }
.reviewitem, .mockanswer { background: #281d17; border-color: #684b32; }
.mockcell { background: #2e2118; border-color: #806044; }
.mockcell.is-answered { background: #5b3315; border-color: #f5ae20; color: #fff3da; }
.mockcell.is-active { outline-color: #ffcf69; }
.mockclock { border-color: #f5ae20; color: #ffdb82; background: #2c1b0f; }

.flashcard {
  background: radial-gradient(ellipse at 75% -25%, #b94b1940, transparent 55%), #211812;
  border-color: #a5682c;
}
.flashcard.revealed { background: radial-gradient(ellipse at 75% -25%, #ad802d33, transparent 55%), #241e14; border-color: #c99a4a; }
.flashanswer { background: #302219; border-left-color: #f5ae20; }
.item { background: #211913; border-color: #60452d; }
.item:hover { border-color: #f5ae20; background: #2f2116; }
.hits-discovery { background: linear-gradient(115deg, #2b170e, #15110f); border-color: #ba5a20; box-shadow: 0 10px 35px #0005; }
.hits-discovery .hits-logo { border: 2px solid #ffae30; box-shadow: 0 0 18px #f05b1633; }
.hits-result { background: #2b1b12; border-color: #a6652a; }
.foot { border-top-color: #5c3921; color: #c6b7a3; }
.foot a { color: #ffd27e; }

button:focus-visible, a:focus-visible, .flashcard:focus-visible, .mockcell:focus-visible {
  outline: 3px solid #ffd469;
  outline-offset: 3px;
}
@media (max-width: 760px) {
  .brand b { font-size: 19px; }
  #home .hero h1 { font-size: clamp(34px, 10vw, 48px); }
  #home .hero-copy { padding: 22px; }
  .choice { min-height: 72px; }
  .qa h2 { font-size: 26px; }
  .score { font-size: clamp(68px, 22vw, 95px); }
}
@media (max-width: 380px) {
  .brand b { font-size: 17px; }
  #home .hero h1 { font-size: 33px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
