:root {
  --games-navy: #15345d;
  --games-blue: #1f4e8c;
  --games-red: #d62839;
  --games-gold: #f4c95d;
  --games-green: #147d64;
  --games-ink: #172033;
  --games-muted: #5f6c80;
  --games-soft: #f2f6fb;
  --games-paper: #fffdf8;
  --games-line: rgba(21, 52, 93, .14);
  --games-shadow: 0 18px 48px rgba(15, 31, 56, .14);
}

* { box-sizing: border-box; }

body.games-page {
  margin: 0;
  background: var(--games-soft);
  color: var(--games-ink);
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
}

body.games-page button,
body.games-page input,
body.games-page select,
body.games-page textarea { font: inherit; }

.games-page .navbar {
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 10px 30px rgba(15, 23, 42, .08);
}

.games-page .navbar-brand {
  display: flex;
  align-items: center;
  gap: .7rem;
  color: var(--games-navy) !important;
  font-weight: 900;
}

.games-page .brand-logo { height: 42px; }
.games-page .nav-link { color: var(--games-navy) !important; font-weight: 800; }

.games-page .global-course-switcher {
  position: fixed;
  right: 1rem;
  top: 5.25rem;
  z-index: 1200;
}

.games-page .global-course-switcher summary {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: 0 1rem;
  list-style: none;
  border-radius: 999px;
  background: var(--games-navy);
  color: #fff;
  cursor: pointer;
  font-weight: 900;
  box-shadow: 0 14px 32px rgba(15, 23, 42, .18);
}

.games-page .global-course-switcher summary::-webkit-details-marker { display: none; }
.games-page .global-course-switcher nav {
  position: absolute;
  right: 0;
  top: calc(100% + .5rem);
  width: min(250px, calc(100vw - 2rem));
  display: grid;
  gap: .35rem;
  padding: .65rem;
  border: 1px solid var(--games-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--games-shadow);
}

.games-page .global-course-switcher a {
  min-height: 40px;
  display: flex;
  align-items: center;
  padding: 0 .85rem;
  border-radius: 6px;
  color: var(--games-navy);
  text-decoration: none;
  font-weight: 900;
}

.games-page .global-course-switcher a:hover { background: #eef5ff; color: var(--games-red); }

.games-hero {
  min-height: 620px;
  display: flex;
  align-items: end;
  padding: 8rem 0 4.5rem;
  position: relative;
  isolation: isolate;
  background: var(--hero-image) center / cover no-repeat;
  overflow: hidden;
}

.games-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(7, 20, 39, .94) 0%, rgba(13, 36, 67, .82) 40%, rgba(13, 36, 67, .24) 78%, rgba(13, 36, 67, .1) 100%);
}

.games-hero-content { max-width: 760px; }
.games-badge {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .65rem .9rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  color: var(--games-navy);
  font-weight: 900;
}

.games-hero h1 {
  margin: 1.2rem 0 .9rem;
  color: #fff;
  font-size: 4.4rem;
  line-height: 1;
  font-weight: 950;
  text-shadow: 0 12px 34px rgba(0, 0, 0, .28);
}

.games-hero .lead {
  max-width: 720px;
  margin: 0;
  color: rgba(255, 255, 255, .94);
  font-size: 1.25rem;
  line-height: 1.7;
  font-weight: 700;
}

.games-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.4rem; }
.games-btn,
.games-btn-soft,
.games-icon-btn,
.games-danger-btn {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .48rem;
  padding: .72rem 1rem;
  border-radius: 7px;
  border: 0;
  text-decoration: none;
  font-weight: 900;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.games-btn { background: var(--games-red); color: #fff; box-shadow: 0 12px 28px rgba(214, 40, 57, .25); }
.games-btn:hover { color: #fff; transform: translateY(-1px); }
.games-btn-soft { border: 1px solid var(--games-line); background: #fff; color: var(--games-navy); }
.games-hero .games-btn-soft { border-color: rgba(255, 255, 255, .56); background: rgba(255, 255, 255, .13); color: #fff; }
.games-icon-btn { background: var(--games-navy); color: #fff; }
.games-danger-btn { border: 1px solid rgba(214, 40, 57, .28); background: #fff1f2; color: #a61f2c; }
.games-btn:disabled,
.games-btn-soft:disabled,
.games-icon-btn:disabled,
.games-danger-btn:disabled { cursor: not-allowed; opacity: .48; transform: none; box-shadow: none; }

.games-section { padding: 4.5rem 0; }
.games-section.white { background: #fff; }
.games-kicker {
  margin: 0 0 .55rem;
  color: var(--games-red);
  font-size: .8rem;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.games-title { margin: 0; color: var(--games-navy); font-size: 2.6rem; line-height: 1.15; font-weight: 950; }
.games-copy { color: var(--games-muted); font-size: 1.05rem; line-height: 1.75; }

.game-library {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
  margin-top: 2rem;
}

.game-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--games-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--games-shadow);
}

.game-card-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #dce6f2; }
.game-card-media img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .4s ease; }
.game-card:hover img { transform: scale(1.04); }
.game-card-icon {
  position: absolute;
  left: 1rem;
  bottom: 1rem;
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #fff;
  color: var(--games-red);
  font-size: 1.35rem;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .2);
}

.game-card-body { flex: 1; display: flex; flex-direction: column; align-items: flex-start; padding: 1.25rem; }
.game-card-body h2 { margin: .75rem 0 .5rem; color: var(--games-navy); font-size: 1.35rem; font-weight: 950; }
.game-card-body p { flex: 1; color: var(--games-muted); line-height: 1.65; }
.game-status {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .36rem .65rem;
  border-radius: 999px;
  background: #eaf8f3;
  color: #0d6c55;
  font-size: .78rem;
  font-weight: 900;
}
.game-status.shared { background: #fff5d8; color: #765000; }

.pendu-intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(290px, .75fr);
  gap: 1.5rem;
  align-items: start;
}

.history-copy {
  padding: 1.5rem;
  border-left: 7px solid var(--games-gold);
  border-radius: 8px;
  background: var(--games-paper);
  box-shadow: var(--games-shadow);
}

.history-copy p { margin: .8rem 0 0; color: #374257; line-height: 1.78; }
.history-note { padding: 1.25rem; border-radius: 8px; background: var(--games-navy); color: #fff; }
.history-note h3 { margin: 0 0 .8rem; font-size: 1.15rem; font-weight: 950; }
.history-note dl { margin: 0; display: grid; gap: .9rem; }
.history-note dt { color: var(--games-gold); font-weight: 950; }
.history-note dd { margin: .15rem 0 0; color: rgba(255, 255, 255, .86); line-height: 1.5; }
.history-note a { color: #fff; }

.rules-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 1.5rem;
  overflow: hidden;
  border: 1px solid var(--games-line);
  border-radius: 8px;
  background: var(--games-line);
}
.rule-step { min-width: 0; padding: 1.2rem; background: #fff; }
.rule-step span { color: var(--games-red); font-size: 1.5rem; font-weight: 950; }
.rule-step h3 { margin: .5rem 0 .35rem; color: var(--games-navy); font-size: 1rem; font-weight: 950; }
.rule-step p { margin: 0; color: var(--games-muted); line-height: 1.55; }

.teacher-gate,
.teacher-setup,
.game-console,
.spectator-note {
  border: 1px solid var(--games-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--games-shadow);
}

.teacher-gate,
.spectator-note { padding: 1.35rem; }
.teacher-gate { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.teacher-gate h3,
.spectator-note h3 { margin: 0 0 .35rem; color: var(--games-navy); font-weight: 950; }
.teacher-gate p,
.spectator-note p { margin: 0; color: var(--games-muted); }

.teacher-setup { margin-top: 1.25rem; overflow: hidden; }
.setup-head,
.console-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.25rem;
  background: var(--games-navy);
  color: #fff;
}
.setup-head h2,
.console-head h2 { margin: 0; font-size: 1.2rem; font-weight: 950; }
.setup-head span,
.console-head span { color: rgba(255, 255, 255, .78); font-size: .9rem; }
.setup-body { padding: 1.25rem; }
.setup-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); gap: 1.25rem; }
.form-stack { display: grid; gap: .9rem; }
.form-field { display: grid; gap: .38rem; }
.form-field label,
.form-field legend { color: var(--games-navy); font-size: .88rem; font-weight: 900; }
.form-field input,
.form-field select,
.form-field textarea {
  width: 100%;
  min-height: 46px;
  padding: .72rem .8rem;
  border: 1px solid rgba(21, 52, 93, .24);
  border-radius: 6px;
  background: #fff;
  color: var(--games-ink);
}
.form-field textarea { min-height: 178px; resize: vertical; }
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus { outline: 3px solid rgba(31, 78, 140, .18); border-color: var(--games-blue); }
.setup-options { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.switch-row {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .65rem .75rem;
  border: 1px solid var(--games-line);
  border-radius: 6px;
  background: #f8fbff;
  color: var(--games-navy);
  font-weight: 850;
}
.switch-row input { width: 20px; height: 20px; accent-color: var(--games-red); }
.setup-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1rem; }
.roster-import-status { min-height: 1.3rem; margin: 0; color: var(--games-green); font-size: .88rem; font-weight: 800; }

.status-message {
  margin: 1rem 0;
  padding: .85rem 1rem;
  border: 1px solid rgba(31, 78, 140, .22);
  border-radius: 7px;
  background: #eef5ff;
  color: var(--games-navy);
  line-height: 1.5;
  font-weight: 800;
}
.status-message.success { border-color: rgba(20, 125, 100, .25); background: #eaf8f3; color: #0d6c55; }
.status-message.error { border-color: rgba(214, 40, 57, .25); background: #fff0f2; color: #a61f2c; }
.status-message.warning { border-color: rgba(166, 112, 0, .28); background: #fff7df; color: #765000; }

.game-console { margin-top: 1.25rem; overflow: hidden; }
.console-head-actions { display: flex; align-items: center; gap: .65rem; }
.reset-controls { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }
.console-head .games-btn-soft { min-height: 42px; padding: .62rem .8rem; }
.console-head .games-danger-btn { min-height: 42px; padding: .62rem .8rem; }
.sound-control { display: flex; align-items: center; gap: .5rem; }
.sound-control input[type="range"] { width: 90px; accent-color: var(--games-gold); }
.sound-button { width: 42px; min-height: 42px; padding: 0; border-radius: 6px; }

.game-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  min-height: 640px;
}
.game-stage { min-width: 0; padding: 1.25rem; background: #f7f2e8; }
.scoreboard { padding: 1.15rem; border-left: 1px solid var(--games-line); background: #fff; }
.turn-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 1rem;
  border-radius: 7px;
  background: var(--games-navy);
  color: #fff;
}
.turn-banner small { display: block; color: rgba(255, 255, 255, .7); font-weight: 800; }
.turn-banner strong { display: block; margin-top: .12rem; font-size: 1.3rem; overflow-wrap: anywhere; }
.round-counter { flex: 0 0 auto; padding: .4rem .65rem; border-radius: 999px; background: var(--games-gold); color: #523900; font-weight: 950; }

.puzzle-grid {
  display: grid;
  grid-template-columns: 245px minmax(0, 1fr);
  gap: 1.25rem;
  align-items: center;
  margin-top: 1.15rem;
}
.gallows-wrap {
  min-height: 300px;
  display: grid;
  place-items: center;
  padding: 1rem;
  border-radius: 8px;
  background: #142238;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08);
}
.gallows {
  width: 210px;
  height: 260px;
  position: relative;
}
.gallows .base,
.gallows .post,
.gallows .beam,
.gallows .brace,
.gallows .rope { position: absolute; display: block; background: #c58b52; box-shadow: inset 0 0 0 1px rgba(74, 42, 20, .35); }
.gallows .base { left: 12px; bottom: 10px; width: 150px; height: 13px; transform: skewX(-18deg); }
.gallows .post { left: 48px; top: 18px; width: 13px; height: 235px; }
.gallows .beam { left: 48px; top: 18px; width: 132px; height: 13px; }
.gallows .brace { left: 57px; top: 31px; width: 56px; height: 9px; transform: rotate(-42deg); transform-origin: left center; }
.gallows .rope { left: 163px; top: 30px; width: 4px; height: 42px; background: #e7d5b2; }
.chalk-person span { position: absolute; display: block; opacity: 0; background: #fff9e8; box-shadow: 0 0 7px rgba(255, 249, 232, .3); transition: opacity .25s ease; }
.chalk-person .head { left: 143px; top: 70px; width: 44px; height: 44px; border: 4px solid #fff9e8; border-radius: 50%; background: transparent; }
.chalk-person .body { left: 163px; top: 113px; width: 4px; height: 67px; }
.chalk-person .arm-left { left: 137px; top: 128px; width: 32px; height: 4px; transform: rotate(-35deg); transform-origin: right center; }
.chalk-person .arm-right { left: 164px; top: 128px; width: 32px; height: 4px; transform: rotate(35deg); transform-origin: left center; }
.chalk-person .leg-left { left: 139px; top: 178px; width: 31px; height: 4px; transform: rotate(-52deg); transform-origin: right center; }
.chalk-person .leg-right { left: 164px; top: 178px; width: 31px; height: 4px; transform: rotate(52deg); transform-origin: left center; }
.gallows[data-errors="1"] .head,
.gallows[data-errors="2"] .head,
.gallows[data-errors="3"] .head,
.gallows[data-errors="4"] .head,
.gallows[data-errors="5"] .head,
.gallows[data-errors="6"] .head { opacity: 1; }
.gallows[data-errors="2"] .body,
.gallows[data-errors="3"] .body,
.gallows[data-errors="4"] .body,
.gallows[data-errors="5"] .body,
.gallows[data-errors="6"] .body { opacity: 1; }
.gallows[data-errors="3"] .arm-left,
.gallows[data-errors="4"] .arm-left,
.gallows[data-errors="5"] .arm-left,
.gallows[data-errors="6"] .arm-left { opacity: 1; }
.gallows[data-errors="4"] .arm-right,
.gallows[data-errors="5"] .arm-right,
.gallows[data-errors="6"] .arm-right { opacity: 1; }
.gallows[data-errors="5"] .leg-left,
.gallows[data-errors="6"] .leg-left { opacity: 1; }
.gallows[data-errors="6"] .leg-right { opacity: 1; }
.mistake-meter { margin-top: .7rem; color: rgba(255, 255, 255, .82); text-align: center; font-weight: 850; }

.puzzle-panel { min-width: 0; }
.category-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .42rem .7rem;
  border-radius: 999px;
  background: #fff;
  color: var(--games-navy);
  font-size: .82rem;
  font-weight: 950;
  box-shadow: 0 8px 22px rgba(15, 31, 56, .08);
}
.word-board {
  min-height: 154px;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  gap: .55rem .85rem;
  margin-top: .8rem;
  padding: 1.1rem;
  border: 1px solid rgba(82, 57, 0, .16);
  border-radius: 8px;
  background: #fffdf8;
}
.word-token { display: inline-flex; align-items: end; gap: .22rem; white-space: nowrap; }
.letter-slot {
  width: 34px;
  height: 45px;
  display: grid;
  place-items: center;
  border-bottom: 4px solid var(--games-navy);
  color: var(--games-navy);
  font-size: 1.45rem;
  font-weight: 950;
  text-transform: uppercase;
}
.letter-slot.revealed { animation: tileReveal .32s ease both; }
.letter-slot.punctuation { width: auto; min-width: 10px; border: 0; }
@keyframes tileReveal { from { transform: translateY(-7px); opacity: .2; } to { transform: translateY(0); opacity: 1; } }
.clue-panel {
  min-height: 60px;
  margin-top: .75rem;
  padding: .75rem .85rem;
  border-left: 5px solid var(--games-gold);
  border-radius: 6px;
  background: #fff;
  color: var(--games-muted);
  line-height: 1.55;
}
.clue-panel strong { color: var(--games-navy); }
.clue-heading { display: block; margin-bottom: .55rem; }
.progressive-clues {
  display: grid;
  gap: .55rem;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: none;
}
.progressive-clues li {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: .65rem;
  align-items: start;
  padding: .62rem .7rem;
  border: 1px solid rgba(21, 52, 93, .12);
  border-radius: 6px;
  background: #f7fafc;
}
.progressive-clues span {
  color: var(--games-red);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
}
.progressive-clues p { margin: 0; color: var(--games-navy); }
.clue-note { margin: .6rem 0 0; font-size: .86rem; }

@media (max-width: 575.98px) {
  .progressive-clues li { grid-template-columns: 1fr; gap: .2rem; }
}

.keyboard { display: grid; gap: .45rem; margin-top: 1rem; }
.keyboard-row { display: flex; flex-wrap: wrap; justify-content: center; gap: .38rem; }
.letter-key {
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(21, 52, 93, .22);
  border-radius: 6px;
  background: #fff;
  color: var(--games-navy);
  font-weight: 950;
  cursor: pointer;
  box-shadow: 0 4px 0 rgba(21, 52, 93, .1);
}
.letter-key:hover:not(:disabled) { border-color: var(--games-red); color: var(--games-red); transform: translateY(-1px); }
.letter-key:disabled { cursor: not-allowed; opacity: .35; box-shadow: none; }
.letter-key.correct { border-color: rgba(20, 125, 100, .35); background: #eaf8f3; color: #0d6c55; opacity: .82; }
.letter-key.wrong { border-color: rgba(214, 40, 57, .3); background: #fff0f2; color: #a61f2c; opacity: .72; }
.keyboard-row.accents[hidden] { display: none; }
.round-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: .9rem; }

.scoreboard h3 { margin: 0; color: var(--games-navy); font-size: 1.08rem; font-weight: 950; }
.scoreboard-meta { margin: .25rem 0 1rem; color: var(--games-muted); font-size: .88rem; }
.score-list { display: grid; gap: .55rem; }
.score-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .6rem;
  align-items: center;
  padding: .72rem;
  border: 1px solid var(--games-line);
  border-radius: 7px;
  background: #f8fbff;
}
.score-row.current { border-color: var(--games-gold); background: #fff9e8; box-shadow: inset 5px 0 0 var(--games-gold); }
.score-name { min-width: 0; overflow-wrap: anywhere; color: var(--games-navy); font-weight: 900; }
.score-value { color: var(--games-red); font-size: 1.35rem; font-weight: 950; }
.score-adjust { grid-column: 1 / -1; display: flex; gap: .35rem; }
.score-adjust button { width: 36px; min-height: 34px; padding: 0; border: 1px solid var(--games-line); border-radius: 5px; background: #fff; color: var(--games-navy); font-weight: 950; }
.score-adjust button:hover { border-color: var(--games-red); color: var(--games-red); }
.history-block { margin-top: 1.3rem; padding-top: 1rem; border-top: 1px solid var(--games-line); }
.round-history { max-height: 210px; overflow: auto; margin: .7rem 0 0; padding-left: 1.15rem; color: var(--games-muted); font-size: .88rem; line-height: 1.5; }

.round-result {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid rgba(20, 125, 100, .25);
  border-radius: 8px;
  background: #eaf8f3;
  color: #0d5e4b;
}
.round-result h3 { margin: 0 0 .4rem; color: #0d5e4b; font-weight: 950; }
.round-result p { margin: .3rem 0; line-height: 1.55; }
.round-result .solution { font-size: 1.35rem; color: var(--games-navy); font-weight: 950; }

.winner-panel {
  position: relative;
  margin-top: 1rem;
  padding: 1.4rem;
  overflow: hidden;
  border: 1px solid rgba(244, 201, 93, .5);
  border-radius: 8px;
  background: var(--games-navy);
  color: #fff;
  text-align: center;
}
.winner-panel h3 { margin: .25rem 0; color: var(--games-gold); font-size: 1.65rem; font-weight: 950; }
.winner-panel p { margin: .35rem 0 0; color: rgba(255, 255, 255, .82); }
.confetti-piece { position: absolute; top: -12px; width: 9px; height: 17px; animation: confettiFall 2.8s linear forwards; }
@keyframes confettiFall { to { transform: translate3d(var(--drift), 260px, 0) rotate(520deg); opacity: 0; } }

.games-dialog {
  width: min(520px, calc(100% - 2rem));
  padding: 0;
  border: 0;
  border-radius: 8px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .32);
}
.games-dialog::backdrop { background: rgba(8, 18, 34, .72); }
.dialog-head { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.15rem; background: var(--games-navy); color: #fff; }
.dialog-head h2 { margin: 0; font-size: 1.15rem; font-weight: 950; }
.dialog-close { width: 40px; height: 40px; border: 0; border-radius: 6px; background: rgba(255, 255, 255, .12); color: #fff; }
.dialog-body { padding: 1.15rem; }
.dialog-actions { display: flex; justify-content: flex-end; gap: .6rem; margin-top: 1rem; }

.games-footer { padding: 2.5rem 0; background: var(--games-navy); color: #fff; }
.games-footer a { color: #fff; text-decoration: none; font-weight: 900; }

[hidden] { display: none !important; }

@media (max-width: 1050px) {
  .game-library { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .game-layout { grid-template-columns: 1fr; }
  .scoreboard { border-top: 1px solid var(--games-line); border-left: 0; }
  .score-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .history-block { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .games-hero { min-height: 560px; background-position: 62% center; }
  .games-hero h1 { font-size: 3.25rem; }
  .console-head { align-items: flex-start; flex-direction: column; }
  .console-head-actions { width: 100%; flex-wrap: wrap; justify-content: space-between; }
  .reset-controls { flex: 1 1 420px; }
  .pendu-intro-grid,
  .setup-grid { grid-template-columns: 1fr; }
  .rules-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .puzzle-grid { grid-template-columns: 1fr; }
  .gallows-wrap { min-height: 280px; }
}

@media (max-width: 575px) {
  .games-page .global-course-switcher { top: auto; right: .75rem; bottom: .75rem; }
  .games-hero { min-height: 520px; padding: 7rem 0 3rem; background-position: 66% center; }
  .games-hero::before { background: rgba(8, 23, 44, .82); }
  .games-hero h1 { font-size: 2.45rem; }
  .games-hero .lead { font-size: 1rem; }
  .games-actions > *,
  .setup-actions > *,
  .round-actions > * { width: 100%; }
  .games-section { padding: 3.3rem 0; }
  .games-title { font-size: 2rem; }
  .game-library,
  .score-list { grid-template-columns: 1fr; }
  .rules-strip { grid-template-columns: 1fr; }
  .teacher-gate,
  .setup-head,
  .console-head { align-items: flex-start; flex-direction: column; }
  .setup-options { grid-template-columns: 1fr; }
  .game-stage,
  .scoreboard { padding: .85rem; }
  .turn-banner { align-items: flex-start; flex-direction: column; }
  .puzzle-grid { gap: .8rem; }
  .gallows-wrap { min-height: 240px; }
  .gallows { transform: scale(.86); }
  .word-board { min-height: 130px; padding: .75rem; gap: .45rem .65rem; }
  .letter-slot { width: 27px; height: 39px; font-size: 1.18rem; }
  .letter-key { width: 37px; height: 40px; }
  .console-head-actions { width: 100%; flex-direction: column; align-items: stretch; }
  .sound-control { width: 100%; justify-content: flex-start; }
  .reset-controls { width: 100%; flex: 1; }
  .reset-controls > * { flex: 1 1 180px; }
  .sound-control input[type="range"] { width: 72px; }
  .dialog-actions { flex-direction: column; }
  .dialog-actions > * { width: 100%; }
}

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