/* AI Expedition — shared game-world UI for every curriculum surface. */

.game-shell {
  --world-bg: #f7f8ff;
  --world-surface: #ffffff;
  --world-surface-soft: #eef1ff;
  --world-ink: #161a32;
  --world-muted: #626985;
  --world-blue: #3553ff;
  --world-blue-dark: #263dd1;
  --world-blue-soft: #e6eaff;
  --world-coral: #f35d50;
  --world-coral-soft: #fff0ee;
  --world-yellow: #ffd45a;
  --world-yellow-soft: #fff8da;
  --world-mint: #2caa8b;
  --world-mint-soft: #e7f8f3;
  --world-violet: #7657d8;
  --world-violet-soft: #f0ecff;
  --world-line: #cfd5f3;
  --world-border: #dfe3f5;
  --world-shadow: 0 18px 45px rgba(47, 57, 110, 0.12);
  --world-font: 'Manrope', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--world-bg);
  background-image: none;
  color: var(--world-ink);
  font-family: var(--world-font);
  font-size: 16px;
  line-height: 1.6;
  overflow-x: clip;
}

[data-theme="dark"] .game-shell,
.game-shell[data-theme="dark"] {
  --world-bg: #0f1328;
  --world-surface: #191f3c;
  --world-surface-soft: #22294c;
  --world-ink: #f5f6ff;
  --world-muted: #b7bdd8;
  --world-blue: #8298ff;
  --world-blue-dark: #a8b7ff;
  --world-blue-soft: #293460;
  --world-coral: #ff8176;
  --world-coral-soft: #40252d;
  --world-yellow: #ffdc76;
  --world-yellow-soft: #3b3525;
  --world-mint: #5cd8b8;
  --world-mint-soft: #183e3a;
  --world-violet: #a98df7;
  --world-violet-soft: #302b54;
  --world-line: #3c466f;
  --world-border: #30395e;
  --world-shadow: 0 22px 50px rgba(0, 0, 0, 0.26);
}

.game-shell :where(h1, h2, h3, h4, p, a, button, input, select, textarea) {
  font-family: var(--world-font);
}

.game-shell :where(h1, h2, h3, h4) {
  color: var(--world-ink);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.08;
  text-transform: none;
  text-wrap: balance;
}

.game-shell p {
  color: var(--world-muted);
  font-family: var(--world-font);
  text-wrap: pretty;
}

.game-shell :where(a, button, input, select):focus-visible {
  outline: 3px solid var(--world-yellow);
  outline-offset: 3px;
}

/* Shared HUD */
.game-shell .site-header {
  background: color-mix(in srgb, var(--world-bg) 88%, transparent);
  border-color: color-mix(in srgb, var(--world-border) 82%, transparent);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.game-shell .header-inner {
  max-width: 1180px;
  height: 72px;
}

.game-shell .logo {
  align-items: center;
  color: var(--world-ink);
  font-family: var(--world-font);
  font-size: 0.88rem;
  font-weight: 800;
  letter-spacing: 0.035em;
  text-transform: none;
}

.game-shell .logo-mark {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: var(--world-blue);
  box-shadow: 0 5px 0 var(--world-blue-dark);
  color: #fff;
  font-size: 0.9rem;
  transform: translateY(-2px);
}

.game-shell .logo-copy { white-space: nowrap; }
.game-shell .header-nav { gap: 24px; }

.game-shell .header-nav > a:not(.header-github) {
  color: var(--world-muted);
  font-family: var(--world-font);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

.game-shell .header-nav > a:not(.header-github):hover,
.game-shell .header-nav > a[aria-current="page"] {
  color: var(--world-blue);
  border-bottom-color: transparent;
}

.game-shell .header-nav > a[aria-current="page"]::after {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  margin: 4px auto -10px;
  border-radius: 50%;
  background: var(--world-coral);
}

.game-shell .header-github,
.game-shell .search-toggle,
.game-shell .theme-toggle,
.game-shell #langToggle {
  min-height: 38px;
  border: 1px solid var(--world-border);
  border-radius: 12px;
  background: var(--world-surface);
  color: var(--world-ink);
  box-shadow: 0 3px 0 var(--world-border);
}

.game-shell .header-github {
  padding: 7px 12px;
  font-family: var(--world-font);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.game-shell .search-toggle,
.game-shell .theme-toggle,
.game-shell #langToggle { width: 38px; height: 38px; }

.game-shell :where(.header-github, .search-toggle, .theme-toggle, #langToggle):hover {
  border-color: var(--world-blue);
  color: var(--world-blue);
  transform: translateY(-1px);
  box-shadow: 0 4px 0 var(--world-line);
}

/* Zone introductions */
.world-kicker {
  width: max-content;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 18px;
  padding: 7px 11px;
  border: 1px solid var(--world-border);
  border-radius: 999px;
  background: var(--world-surface);
  color: var(--world-muted);
  font-size: 0.72rem;
  font-weight: 800;
  box-shadow: 0 3px 0 var(--world-border);
}

.world-kicker::before {
  content: "";
  width: 9px;
  height: 9px;
  border: 3px solid color-mix(in srgb, var(--zone-color, var(--world-blue)) 24%, transparent);
  border-radius: 50%;
  background: var(--zone-color, var(--world-blue));
}

.game-shell :where(.catalog-page, .glossary-page, .prereqs-page) {
  position: relative;
  min-height: 100vh;
  padding: 132px 0 96px;
  background:
    radial-gradient(circle at 91% 9%, color-mix(in srgb, var(--zone-color, var(--world-blue)) 13%, transparent) 0 110px, transparent 111px),
    radial-gradient(circle at 6% 31%, color-mix(in srgb, var(--world-yellow) 13%, transparent) 0 72px, transparent 73px),
    var(--world-bg);
}

.game-catalog { --zone-color: var(--world-blue); }
.game-glossary { --zone-color: var(--world-violet); }
.game-prereqs { --zone-color: var(--world-mint); }
.game-about { --zone-color: var(--world-coral); }
.game-lesson {
  --zone-color: var(--world-blue);
  --font-body: var(--world-font);
  --font-heading: var(--world-font);
  --font-display: var(--world-font);
}

.game-shell :where(.catalog-header, .glossary-header, .prereqs-header) {
  max-width: 720px;
  margin: 0 auto 38px;
  text-align: center;
}

.game-shell :where(.catalog-header, .glossary-header, .prereqs-header) h1 {
  margin: 0 0 12px;
  color: var(--world-ink);
  font-size: 3rem;
}

.game-shell :where(.catalog-header, .glossary-header, .prereqs-header) p {
  max-width: 620px;
  margin-inline: auto;
  color: var(--world-muted);
  font-size: 1rem;
}

/* Catalog — an expedition log, not a spreadsheet. */
.game-catalog .catalog-controls {
  position: sticky;
  z-index: 4;
  top: 88px;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(190px, 0.34fr) minmax(170px, 0.28fr);
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--world-border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--world-surface) 93%, transparent);
  box-shadow: var(--world-shadow);
  backdrop-filter: blur(16px);
}

.game-shell :where(.catalog-search, .catalog-filter, .glossary-search) {
  min-height: 48px;
  padding: 11px 15px;
  border: 1px solid var(--world-border);
  border-radius: 12px;
  background: var(--world-surface-soft);
  color: var(--world-ink);
  font-size: 0.88rem;
}

.game-shell :where(.catalog-search, .glossary-search)::placeholder { color: var(--world-muted); opacity: 1; }
.game-shell :where(.catalog-search, .catalog-filter, .glossary-search):focus { border-color: var(--zone-color); }

.game-catalog .catalog-count,
.game-glossary .glossary-count {
  width: max-content;
  margin: 22px 0 12px;
  padding: 6px 10px;
  border-radius: 8px;
  background: var(--world-blue-soft);
  color: var(--world-blue);
  font-size: 0.72rem;
  font-weight: 800;
}

.game-catalog .catalog-table-wrap {
  border: 1px solid var(--world-border);
  border-radius: 22px;
  background: var(--world-surface);
  box-shadow: var(--world-shadow);
}

.game-catalog .catalog-table { font-family: var(--world-font); font-size: 0.84rem; }
.game-catalog .catalog-table th {
  padding: 16px;
  border-bottom: 1px solid var(--world-border);
  background: var(--world-surface-soft);
  color: var(--world-muted);
  font-family: var(--world-font);
  font-size: 0.7rem;
  font-weight: 800;
}

.game-catalog .catalog-table td { padding: 13px 16px; border-bottom-color: var(--world-border); }
.game-catalog .catalog-table tr:hover td { background: color-mix(in srgb, var(--world-blue-soft) 55%, transparent); }
.game-catalog .catalog-table a { color: var(--world-ink); font-weight: 750; }
.game-catalog .catalog-table a:hover { color: var(--world-blue); border-bottom-color: transparent; }
.game-catalog .catalog-phase-label {
  display: inline-grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 10px;
  background: var(--world-blue-soft);
  color: var(--world-blue);
  font-weight: 800;
}
.game-catalog .catalog-status-dot.complete { background: var(--world-mint); }
.game-catalog .catalog-status-dot.planned { background: var(--world-line); }

/* Glossary — collectible knowledge fragments. */
.game-glossary .glossary-search-wrap { max-width: 660px; margin: 0 auto; }
.game-glossary .glossary-search { width: 100%; min-height: 54px; box-shadow: 0 5px 0 var(--world-border); }
.game-glossary .glossary-count { margin-inline: auto; background: var(--world-violet-soft); color: var(--world-violet); }
.game-glossary .glossary-list { max-width: 900px; gap: 14px; }
.game-glossary .glossary-card {
  position: relative;
  padding: 24px;
  border: 1px solid var(--world-border);
  border-radius: 18px;
  background: var(--world-surface);
  box-shadow: 0 5px 0 var(--world-border);
  overflow: hidden;
}
.game-glossary .glossary-card::before {
  content: "✦";
  position: absolute;
  top: 17px;
  right: 20px;
  color: var(--world-yellow);
  font-size: 1.15rem;
}
.game-glossary .glossary-card:hover {
  border-color: var(--world-violet);
  transform: translateY(-2px);
  box-shadow: 0 7px 0 var(--world-violet-soft);
}
.game-glossary .glossary-term { color: var(--world-violet); font-family: var(--world-font); font-size: 1.12rem; font-weight: 850; }
.game-glossary .glossary-row { gap: 32px; }
.game-glossary .glossary-col-label { color: var(--world-muted); font-family: var(--world-font); font-size: 0.65rem; font-weight: 800; }
.game-glossary .glossary-col-says { color: var(--world-muted); font-family: var(--world-font); }
.game-glossary .glossary-col-means { color: var(--world-ink); font-family: var(--world-font); }

/* Prerequisite map — a world atlas. */
.game-prereqs .prereqs-controls {
  padding: 11px 14px;
  border: 1px solid var(--world-border);
  border-radius: 16px;
  background: var(--world-surface);
  box-shadow: 0 4px 0 var(--world-border);
}
.game-prereqs .prereqs-legend { gap: 16px; }
.game-prereqs .legend-item { color: var(--world-muted); font-family: var(--world-font); font-size: 0.7rem; font-weight: 750; }
.game-prereqs .legend-dot { border: 0; }
.game-prereqs .legend-dot.complete { background: var(--world-mint); }
.game-prereqs .legend-dot.in-progress { background: var(--world-coral); }
.game-prereqs .legend-dot.planned { background: var(--world-line); }
.game-prereqs .reset-btn {
  padding: 8px 11px;
  border: 1px solid var(--world-border);
  border-radius: 10px;
  background: var(--world-surface-soft);
  color: var(--world-muted);
  font-family: var(--world-font);
  font-weight: 750;
}
.game-prereqs .graph-wrap {
  min-height: 620px;
  border: 1px solid var(--world-border);
  border-radius: 30px;
  background:
    radial-gradient(circle at 18% 18%, color-mix(in srgb, var(--world-yellow) 18%, transparent) 0 90px, transparent 91px),
    radial-gradient(circle at 82% 70%, color-mix(in srgb, var(--world-violet) 10%, transparent) 0 150px, transparent 151px),
    var(--world-surface);
  box-shadow: var(--world-shadow);
}
.game-prereqs .detail-panel {
  border: 1px solid var(--world-border);
  border-radius: 22px;
  background: var(--world-surface);
  box-shadow: var(--world-shadow);
}
.game-prereqs .detail-title { color: var(--world-ink); font-family: var(--world-font); font-weight: 850; }
.game-prereqs .detail-link { border: 1px solid var(--world-border); border-radius: 11px; font-family: var(--world-font); font-weight: 800; }
.game-prereqs .detail-link-read { background: var(--world-blue); border-color: var(--world-blue); color: #fff; }

/* About — the expedition manifesto. */
.game-about { background: var(--world-bg); }
.game-about main.container { max-width: 1180px; }
.game-about .about {
  position: relative;
  max-width: 860px;
  padding: 132px 0 96px;
}
.game-about .about::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 98px;
  right: -170px;
  width: 310px;
  height: 310px;
  border: 1px solid color-mix(in srgb, var(--world-coral) 20%, transparent);
  border-radius: 50%;
}
.game-about .about-eyebrow { display: none; }
.game-about .about h1 { margin-bottom: 24px; color: var(--world-ink); font-family: var(--world-font); font-size: 3.6rem; }
.game-about .about .lede { max-width: 70ch; color: var(--world-muted); font-family: var(--world-font); font-size: 1.05rem; }
.game-about .about h2 {
  margin: 48px 0 14px;
  color: var(--world-ink);
  font-family: var(--world-font);
  font-size: 1.45rem;
  letter-spacing: -0.025em;
  text-transform: none;
}
.game-about .about h2::before { content: "✦"; margin-right: 10px; color: var(--world-coral); font-size: 0.9rem; }
.game-about .about p,
.game-about .about ul { color: var(--world-muted); font-family: var(--world-font); font-size: 0.97rem; line-height: 1.75; }
.game-about .about a { color: var(--world-blue); font-weight: 750; }
.game-about .about code { border: 0; border-radius: 7px; background: var(--world-blue-soft); color: var(--world-blue); }
.about-quest-board {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 28px 0 8px;
}
.about-quest-board span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border: 1px solid var(--world-border);
  border-radius: 12px;
  background: var(--world-surface);
  color: var(--world-ink);
  font-size: 0.75rem;
  font-weight: 800;
  box-shadow: 0 3px 0 var(--world-border);
}
.about-quest-board span::before { content: "✓"; color: var(--world-mint); }

/* Lesson workspace — focused mission mode. */
.game-lesson { background: var(--world-bg); }
.game-lesson .scroll-progress { background: var(--world-coral); }
.lesson-questbar {
  position: fixed;
  z-index: 90;
  top: 72px;
  left: 0;
  right: 0;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 8px 24px;
  border-bottom: 1px solid var(--world-border);
  background: color-mix(in srgb, var(--world-surface-soft) 93%, transparent);
  color: var(--world-muted);
  backdrop-filter: blur(14px);
}
.lesson-questbar__back,
.lesson-questbar__state {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border: 1px solid var(--world-border);
  border-radius: 9px;
  background: var(--world-surface);
  color: var(--world-muted);
  font-size: 0.69rem;
  font-weight: 800;
}
.lesson-questbar__back:hover { color: var(--world-blue); border-color: var(--world-blue); }
.lesson-questbar__state::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--world-coral); box-shadow: 0 0 0 4px var(--world-coral-soft); }
.lesson-questbar__title { min-width: 0; max-width: 540px; overflow: hidden; color: var(--world-ink); font-size: 0.78rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.game-lesson .lesson-layout { padding-top: 48px; }
.game-lesson .lesson-sidebar,
.game-lesson .toc-sidebar {
  top: 120px;
  height: calc(100vh - 120px);
  border-color: var(--world-border);
  background: var(--world-surface);
}
.game-lesson .lesson-sidebar { box-shadow: 10px 0 30px rgba(47, 57, 110, 0.05); }
.game-lesson .toc-sidebar { box-shadow: -10px 0 30px rgba(47, 57, 110, 0.05); }
.game-lesson .lesson-main { background: var(--world-bg); }
.game-lesson .lesson-content { max-width: 900px; }
.game-lesson .lesson-article {
  max-width: 800px;
  padding: 50px 54px;
  border: 1px solid var(--world-border);
  border-radius: 26px;
  background: var(--world-surface);
  box-shadow: var(--world-shadow);
}
.game-lesson .lesson-article h1 {
  color: var(--world-ink);
  font-family: var(--world-font);
  font-size: 2.55rem;
  font-weight: 850;
  letter-spacing: -0.04em;
  text-transform: none;
}
.game-lesson .lesson-article h2 {
  margin-top: 2.4em;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--world-border);
  color: var(--world-ink);
  font-family: var(--world-font);
  font-size: 1.7rem;
  font-weight: 820;
  text-transform: none;
}
.game-lesson .lesson-article h2::before { content: "◆"; margin-right: 10px; color: var(--world-blue); font-size: 0.68em; }
.game-lesson .lesson-article h3 { color: var(--world-ink); font-family: var(--world-font); font-size: 1.2rem; }
.game-lesson .lesson-article p,
.game-lesson .lesson-article li { max-width: 72ch; color: var(--world-ink); font-family: var(--world-font); font-size: 1rem; line-height: 1.78; }
.game-lesson .lesson-article :where(table, thead, tbody, tr, th, td, caption) {
  font-family: var(--world-font);
}
.game-lesson .lesson-article :where(blockquote, blockquote p, .motto, strong, em) {
  font-family: var(--world-font);
}
.game-lesson .lesson-article :where(blockquote, .motto) {
  font-style: normal;
  font-weight: 650;
}
.game-lesson .lesson-article em {
  font-style: italic;
}
.game-lesson .lesson-article .lesson-md > p:first-of-type::first-letter {
  float: none;
  padding: 0;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}
.game-lesson .lesson-meta { gap: 8px; }
.game-lesson .lesson-meta-tag {
  width: auto;
  display: inline-flex;
  margin: 0 4px 6px 0;
  border: 1px solid var(--world-border);
  border-radius: 9px;
  background: var(--world-surface-soft);
  color: var(--world-muted);
  font-family: var(--world-font);
  font-size: 0.7rem;
  font-weight: 750;
}
.game-lesson .lesson-article blockquote,
.game-lesson .lesson-article .motto {
  border: 1px solid var(--world-border);
  border-radius: 16px;
  background: var(--world-yellow-soft);
  color: var(--world-ink);
}
.game-lesson .lesson-article pre {
  border: 1px solid #364064;
  border-radius: 16px;
  background: #11162a;
  box-shadow: 0 5px 0 #090d1b;
}
.game-lesson .lesson-article pre code {
  background: #11162a;
  color: #f2f4ff;
  font-family: 'JetBrains Mono', 'Cascadia Code', Consolas, monospace;
  font-weight: 500;
  text-shadow: none;
}
.game-lesson .lesson-article pre .syn-keyword { color: #9eafff; font-weight: 700; }
.game-lesson .lesson-article pre .syn-string { color: #8fe0c7; }
.game-lesson .lesson-article pre .syn-number { color: #ffdc76; }
.game-lesson .lesson-article pre .syn-comment { color: #aab3d5; font-style: italic; }
.game-lesson .lesson-article pre .syn-function { color: #ff9e96; font-weight: 650; }
.game-lesson .lesson-article pre .syn-operator { color: #d7dcf4; }
.game-lesson .lesson-article pre .code-copy {
  border-color: #465174;
  border-radius: 8px;
  background: #1b2342;
  color: #dfe4ff;
}
.game-lesson .lesson-article pre .code-copy:hover {
  border-color: #ffdc76;
  color: #ffdc76;
}
.game-lesson :where(.ai-panel, .quiz-container, .quiz-section) { border: 1px solid var(--world-border); border-radius: 20px; background: var(--world-surface-soft); }
.game-lesson .ai-panel-icon { border-radius: 11px; background: var(--world-blue); color: #fff; box-shadow: 0 4px 0 var(--world-blue-dark); }
.game-lesson .quiz-option { border: 1px solid var(--world-border); border-radius: 12px; background: var(--world-surface); }
.game-lesson .quiz-option:hover:not(.selected):not(.disabled) { border-color: var(--world-blue); background: var(--world-blue-soft); transform: translateY(-1px); }
.game-lesson .lesson-nav-btn { border: 1px solid var(--world-border); border-radius: 14px; background: var(--world-surface); box-shadow: 0 4px 0 var(--world-border); }
.game-lesson .lesson-nav-btn.next { background: var(--world-blue); color: #fff; box-shadow: 0 4px 0 var(--world-blue-dark); }
.game-lesson .lesson-sidebar-toggle { top: 132px; border: 1px solid var(--world-border); border-radius: 11px; background: var(--world-surface); color: var(--world-blue); }

.game-shell .site-footer { border-color: var(--world-border); background: var(--world-surface); }
.game-shell .site-footer p,
.game-shell .site-footer a { color: var(--world-muted); font-family: var(--world-font); font-size: 0.72rem; letter-spacing: 0; text-transform: none; }

@media (max-width: 980px) {
  .game-shell .header-nav { gap: 16px; }
  .game-shell .header-nav > a:not(.header-github) { font-size: 0.72rem; }
  .game-lesson .lesson-article { padding: 42px 38px; }
}

@media (max-width: 768px) {
  .game-shell .header-inner { padding-inline: 18px; }
  .game-shell .header-inner { justify-content: flex-start; gap: 8px; }
  .game-shell .logo { margin-right: auto; }
  .game-shell .logo-copy { display: none; }
  .game-shell .header-nav { margin-left: 0; }
  .game-shell .header-nav > a:not(.header-github) { display: none; }
  .game-shell .header-github span:not(.star-count) { display: none; }
  .game-shell .header-github { width: 38px; justify-content: center; padding: 0; }
  .game-shell .header-github .star-count { display: none; }
  .game-shell :where(.catalog-page, .glossary-page, .prereqs-page) { padding: 110px 0 64px; }
  .game-shell :where(.catalog-header, .glossary-header, .prereqs-header) h1 { font-size: 2.3rem; }
  .game-catalog .catalog-controls { position: static; grid-template-columns: 1fr; }
  .game-glossary .glossary-row { gap: 14px; }
  .game-prereqs .prereqs-controls { align-items: flex-start; flex-direction: column; }
  .game-about .about { padding: 110px 0 64px; }
  .game-about .about h1 { font-size: 2.6rem; }
  .lesson-questbar { justify-content: flex-start; padding-inline: 14px; }
  .lesson-questbar__title { flex: 1; }
  .lesson-questbar__state { display: none; }
  .game-lesson .lesson-main { padding-top: 80px; }
  .game-lesson .lesson-article { padding: 32px 22px; border-radius: 20px; }
  .game-lesson .lesson-article h1 { font-size: 2rem; }
}

@media (max-width: 480px) {
  .game-shell .container { padding-inline: 18px; }
  .game-shell :where(.catalog-header, .glossary-header, .prereqs-header) h1 { font-size: 2rem; }
  .game-catalog .catalog-table-wrap { border-radius: 16px; }
  .game-glossary .glossary-card { padding: 20px 17px; }
  .game-prereqs .graph-wrap { border-radius: 22px; }
  .about-quest-board { display: grid; grid-template-columns: 1fr; }
  .game-lesson .lesson-article { padding: 26px 17px; }
}

@media (prefers-reduced-motion: reduce) {
  .game-shell *,
  .game-shell *::before,
  .game-shell *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}