/* CCSA Natal Midlands App games presentation — Campy Crush hub-only leaderboard and transparent icon. */
/* ---------- Sudoku screen ---------- */
.sudoku-screen { padding-bottom: 40px; }

.sudoku-top-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 4px 0 16px;
  flex-wrap: wrap;
}

.sudoku-stat {
  background: var(--surface, var(--card));
  border: 1px solid var(--border, transparent);
  border-radius: var(--radius-md, 12px);
  padding: 8px 14px;
  text-align: center;
  min-width: 78px;
}
.sudoku-stat .value {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--cream);
  display: block;
}
.sudoku-stat .label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted, rgba(246,236,217,0.6));
}

.sudoku-difficulty-row {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}
.sudoku-difficulty-row button {
  flex: 1;
  padding: 10px 8px;
  border-radius: var(--radius-md, 12px);
  border: 1px solid var(--border, transparent);
  background: var(--surface, var(--card));
  color: var(--cream);
  font-weight: 700;
  font-size: 13px;
}
.sudoku-difficulty-row button.active {
  border-color: var(--gold);
  background: var(--surface-raised, var(--card-hover));
  color: var(--gold);
}

.sudoku-board {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  gap: 0;
  width: 100%;
  max-width: 420px;
  aspect-ratio: 1 / 1;
  margin: 0 auto 18px;
  border: 2px solid var(--gold);
  border-radius: var(--radius-md, 10px);
  overflow: hidden;
  background: var(--surface, var(--card));
}

.sudoku-cell {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--border, rgba(214,170,75,0.14));
  color: var(--cream);
  font-family: var(--font-display);
  font-size: clamp(14px, 4vw, 19px);
  font-weight: 600;
  padding: 0;
  aspect-ratio: 1 / 1;
}
.sudoku-cell.border-top { border-top: 2px solid var(--gold); }
.sudoku-cell.border-left { border-left: 2px solid var(--gold); }
.sudoku-cell.border-right { border-right: 2px solid var(--gold); }
.sudoku-cell.border-bottom { border-bottom: 2px solid var(--gold); }

.sudoku-cell.given { color: var(--gold-light, var(--gold)); font-weight: 700; }
.sudoku-cell.user-value { color: var(--cream); }
.sudoku-cell.wrong-value { color: var(--rust-light); }

.sudoku-cell.peer { background: color-mix(in srgb, var(--gold) 8%, transparent); }
.sudoku-cell.selected { background: color-mix(in srgb, var(--gold) 28%, transparent); }
.sudoku-cell.match:not(.selected) { background: color-mix(in srgb, var(--gold) 16%, transparent); }

.sudoku-notes {
  position: absolute;
  inset: 2px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
}
.sudoku-notes span {
  font-family: var(--font-body);
  font-size: clamp(7px, 1.6vw, 9px);
  color: var(--muted, rgba(246,236,217,0.55));
  display: flex;
  align-items: center;
  justify-content: center;
}

.sudoku-controls {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 14px;
}
.sudoku-controls button {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  background: var(--surface, var(--card));
  border: 1px solid var(--border, transparent);
  border-radius: var(--radius-md, 12px);
  padding: 8px 16px;
  color: var(--cream);
  font-size: 11px;
  font-weight: 600;
  min-width: var(--tap-min, 64px);
}
.sudoku-controls button svg { width: 20px; height: 20px; }
.sudoku-controls button.active {
  border-color: var(--gold);
  color: var(--gold);
  background: var(--surface-raised, var(--card-hover));
}

.sudoku-number-pad {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  gap: 6px;
  max-width: 420px;
  margin: 0 auto;
}
.sudoku-number-pad button {
  aspect-ratio: 1 / 1;
  border-radius: var(--radius-md, 10px);
  border: 1px solid var(--border, transparent);
  background: var(--surface, var(--card));
  color: var(--cream);
  font-family: var(--font-display);
  font-size: clamp(15px, 4vw, 20px);
  font-weight: 700;
}
.sudoku-number-pad button.used-up {
  opacity: 0.3;
  pointer-events: none;
}
.sudoku-number-pad button:active { background: var(--surface-raised, var(--card-hover)); }

/* ---------- Win banner ---------- */
.sudoku-win-banner {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.6);
  padding: 20px;
}
.sudoku-win-card {
  background: var(--surface-raised, var(--bg-soft));
  border: 1px solid var(--gold);
  border-radius: var(--radius-lg, 18px);
  padding: 28px 24px;
  text-align: center;
  max-width: 340px;
  width: 100%;
}
.sudoku-win-card .big-icon { font-size: 40px; margin-bottom: 8px; }
.sudoku-win-card h3 {
  font-family: var(--font-display);
  color: var(--cream);
  margin: 0 0 6px;
  font-size: 22px;
}
.sudoku-win-card .win-time {
  font-family: var(--font-display);
  font-size: 30px;
  color: var(--gold);
  font-weight: 700;
  margin: 6px 0;
}
.sudoku-win-card p { color: var(--muted, rgba(246,236,217,0.7)); font-size: 14px; margin: 0 0 18px; }
.sudoku-win-card .win-actions { display: flex; gap: 10px; }
.sudoku-win-card .win-actions button {
  flex: 1;
  padding: 12px;
  border-radius: var(--radius-md, 12px);
  font-weight: 700;
  font-size: 14px;
  border: none;
}
.sudoku-win-card .primary { background: var(--gold); color: var(--ink); }
.sudoku-win-card .secondary { background: var(--surface, var(--card)); color: var(--cream); border: 1px solid var(--border, transparent); }

/* ---------- Confirm new game dialog ---------- */
.sudoku-confirm {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.55);
  padding: 20px;
}
.sudoku-confirm .confirm-card {
  background: var(--surface-raised, var(--bg-soft));
  border: 1px solid var(--border-strong, var(--gold));
  border-radius: var(--radius-lg, 18px);
  padding: 22px;
  max-width: 320px;
  width: 100%;
  text-align: center;
}
.sudoku-confirm p { color: var(--cream); margin: 0 0 16px; font-size: 14px; }
.sudoku-confirm .confirm-actions { display: flex; gap: 10px; }
.sudoku-confirm .confirm-actions button {
  flex: 1;
  padding: 10px;
  border-radius: var(--radius-md, 12px);
  font-weight: 700;
  border: none;
}
.sudoku-confirm .yes { background: var(--rust-light); color: #fff; }
.sudoku-confirm .no { background: var(--surface, var(--card)); color: var(--cream); border: 1px solid var(--border, transparent); }

@media (max-width: 340px) {
  .sudoku-controls { gap: 6px; }
  .sudoku-controls button { padding: 8px 10px; }
}

/* ---------- Word Jumble screen ---------- */
.wordjumble-screen { padding-bottom: 40px; }

.wj-top-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
  gap: 10px;
}
.wj-progress {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  color: var(--gold);
}
.wj-new-btn, .wj-shuffle-btn {
  background: var(--surface, var(--card));
  border: 1px solid var(--border, transparent);
  border-radius: var(--radius-md, 12px);
  padding: 8px 14px;
  color: var(--cream);
  font-size: 13px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.wj-new-btn svg, .wj-shuffle-btn svg { width: 16px; height: 16px; }

.wj-letter-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  max-width: 300px;
  margin: 0 auto 18px;
}
.wj-tile {
  aspect-ratio: 1 / 1;
  border-radius: var(--radius-md, 12px);
  border: 1px solid var(--border-strong, var(--gold));
  background: var(--surface, var(--card));
  color: var(--cream);
  font-family: var(--font-display);
  font-size: clamp(20px, 6vw, 28px);
  font-weight: 700;
}
.wj-tile.center {
  background: var(--gold);
  color: var(--ink);
  border-color: var(--gold);
}
.wj-tile:active { transform: scale(0.95); }

.wj-guess-row {
  display: flex;
  gap: 8px;
  max-width: 340px;
  margin: 0 auto 10px;
}
.wj-guess-row input {
  flex: 1;
  min-width: 0;
  background: var(--surface, var(--card));
  border: 1px solid var(--border, transparent);
  border-radius: var(--radius-md, 12px);
  padding: 12px 14px;
  color: var(--cream);
  font-family: var(--font-display);
  font-size: 18px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
}
.wj-guess-row button {
  border-radius: var(--radius-md, 12px);
  border: none;
  padding: 0 14px;
  font-weight: 700;
  font-size: 13px;
}
.wj-guess-row .wj-backspace {
  background: var(--surface, var(--card));
  color: var(--cream);
  border: 1px solid var(--border, transparent);
}

.wj-action-row {
  display: flex;
  gap: 8px;
  max-width: 340px;
  margin: 0 auto 14px;
}
.wj-action-row button {
  flex: 1;
  border-radius: var(--radius-md, 12px);
  border: none;
  padding: 12px;
  font-weight: 700;
  font-size: 14px;
}
.wj-action-row .wj-guess-btn { background: var(--gold); color: var(--ink); }
.wj-action-row .wj-clear-btn { background: var(--surface, var(--card)); color: var(--cream); border: 1px solid var(--border, transparent); }

.wj-message {
  text-align: center;
  min-height: 20px;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 14px;
  color: var(--muted, rgba(246,236,217,0.7));
}
.wj-message.success { color: var(--green); }
.wj-message.warn { color: var(--gold); }
.wj-message.error { color: var(--rust-light); }

.wj-reveal-row { text-align: center; margin-bottom: 18px; }
.wj-reveal-row button {
  background: none;
  border: none;
  color: var(--muted, rgba(246,236,217,0.55));
  text-decoration: underline;
  font-size: 13px;
}
.wj-reveal-row button:disabled { opacity: 0.4; text-decoration: none; }

.wj-found-list {
  max-width: 400px;
  margin: 0 auto;
}
.wj-empty {
  text-align: center;
  color: var(--muted, rgba(246,236,217,0.55));
  font-size: 14px;
}
.wj-found-group { margin-bottom: 12px; }
.wj-found-heading {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted, rgba(246,236,217,0.55));
  margin-bottom: 6px;
}
.wj-found-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.wj-chip {
  background: var(--surface, var(--card));
  border: 1px solid var(--border, transparent);
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--cream);
  letter-spacing: 0.03em;
}
.wj-chip.solution {
  background: var(--gold);
  color: var(--ink);
  border-color: var(--gold);
}

.wj-win-banner {
  position: fixed;
  inset: 0;
  z-index: 60;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.6);
  padding: 20px;
}
.wj-win-banner[hidden] { display: none; }
.wj-win-banner:not([hidden]) { display: flex; }
.wj-win-card {
  background: var(--surface-raised, var(--bg-soft));
  border: 1px solid var(--gold);
  border-radius: var(--radius-lg, 18px);
  padding: 28px 24px;
  text-align: center;
  max-width: 340px;
  width: 100%;
}
.wj-win-card .big-icon { font-size: 40px; margin-bottom: 8px; }
.wj-win-card h3 { font-family: var(--font-display); color: var(--cream); margin: 0 0 8px; font-size: 22px; }
.wj-win-card p { color: var(--muted, rgba(246,236,217,0.7)); font-size: 14px; margin: 0 0 18px; }
.wj-win-card .win-actions { display: flex; gap: 10px; }
.wj-win-card .win-actions button {
  flex: 1;
  padding: 12px;
  border-radius: var(--radius-md, 12px);
  font-weight: 700;
  font-size: 14px;
  border: none;
}
.wj-win-card .primary { background: var(--gold); color: var(--ink); }
.wj-win-card .secondary { background: var(--surface, var(--card)); color: var(--cream); border: 1px solid var(--border, transparent); }


/* ===== CCSA v43 Campground Games Hub ===== */
.games-screen,.sudoku-screen,.wordjumble-screen{padding-bottom:124px;}
.games-hero{display:grid;grid-template-columns:104px 1fr;gap:16px;align-items:center;margin:0 0 18px;padding:18px;border:1px solid var(--border-strong);border-radius:var(--radius-xl);background:linear-gradient(145deg,color-mix(in srgb,var(--surface-raised) 96%,white 4%),var(--surface));box-shadow:var(--card-shadow);}
.games-hero img{width:104px;height:104px;object-fit:contain;filter:drop-shadow(0 10px 16px rgba(0,0,0,.28));}
.games-hero span,.game-camp-banner span{display:block;color:var(--gold);font-size:.68rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;}
.games-hero h3{margin:4px 0 6px;color:var(--cream);font-family:var(--font-display);font-size:1.55rem;line-height:1.1;}
.games-hero p,.game-camp-banner p{margin:0;color:var(--muted);line-height:1.48;font-size:.9rem;}
.games-grid{display:grid;gap:14px;}
.game-card{position:relative;display:grid;grid-template-columns:72px 1fr 34px;gap:14px;align-items:center;min-height:112px;padding:16px;border:1px solid var(--border-strong);border-radius:22px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface-raised) 95%,white 5%),var(--surface));box-shadow:var(--card-shadow);overflow:hidden;}
.game-card::after{content:"";position:absolute;inset:auto -36px -46px auto;width:118px;height:118px;border-radius:50%;border:22px solid color-mix(in srgb,var(--gold) 7%,transparent);pointer-events:none;}
.game-card:active{transform:scale(.98);}
.game-card-icon{width:72px;height:72px;display:grid;place-items:center;border-radius:20px;border:1px solid color-mix(in srgb,var(--gold) 38%,transparent);background:linear-gradient(145deg,color-mix(in srgb,var(--surface-soft) 92%,white 8%),var(--surface));color:var(--gold-light);}
.game-card-icon svg{width:42px;height:42px;}
.game-card-copy{min-width:0;}
.game-card-copy small{display:block;color:var(--gold);font-size:.65rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;margin-bottom:4px;}
.game-card-copy strong{display:block;color:var(--cream);font-family:var(--font-display);font-size:1.22rem;line-height:1.15;}
.game-card-copy span{display:block;color:var(--muted);font-size:.78rem;line-height:1.35;margin-top:5px;}
.game-card-arrow{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--border-strong);border-radius:50%;color:var(--gold);font-size:1.25rem;z-index:1;}
.game-camp-banner{display:grid;grid-template-columns:46px 1fr;gap:12px;align-items:center;margin:-8px 0 16px;padding:13px 15px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface-raised) 96%,white 4%),var(--surface));}
.game-camp-banner .camp-symbol{width:46px;height:46px;display:grid;place-items:center;border-radius:15px;background:color-mix(in srgb,var(--gold) 12%,var(--surface));font-size:1.55rem;}
.game-camp-banner strong{display:block;color:var(--cream);font-family:var(--font-display);font-size:1rem;margin:2px 0 3px;}
/* Keep all game controls readable in every theme. */
.sudoku-screen button,.wordjumble-screen button{touch-action:manipulation;}
.sudoku-stat,.sudoku-difficulty-row button,.sudoku-controls button,.sudoku-number-pad button,.wj-new-btn,.wj-shuffle-btn,.wj-tile,.wj-guess-row input,.wj-guess-row .wj-backspace,.wj-action-row .wj-clear-btn,.wj-found-list{background:linear-gradient(145deg,color-mix(in srgb,var(--surface-raised) 96%,white 4%),var(--surface));color:var(--cream);}
.sudoku-difficulty-row button.active,.sudoku-controls button.active{background:color-mix(in srgb,var(--gold) 16%,var(--surface-raised));color:var(--gold-light);border-color:var(--gold);}
.sudoku-board{box-shadow:0 14px 30px rgba(0,0,0,.2);}
.sudoku-cell{color:var(--cream);}
.sudoku-cell.given{color:var(--gold-light);}
.wj-letter-grid{max-width:330px;}
.wj-tile{box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 7px 14px rgba(0,0,0,.16);}
.wj-tile.center{background:linear-gradient(145deg,var(--gold-light),var(--gold));color:var(--ink);}
.wj-guess-row input::placeholder{color:color-mix(in srgb,var(--muted) 82%,transparent);}
.wj-found-list{border:1px solid var(--border);border-radius:18px;padding:14px;min-height:84px;}
.wj-empty{color:var(--muted)!important;}
@media(max-width:420px){.games-hero{grid-template-columns:82px 1fr;padding:15px;}.games-hero img{width:82px;height:82px}.game-card{grid-template-columns:62px 1fr 30px;padding:14px;}.game-card-icon{width:62px;height:62px}.game-card-icon svg{width:36px;height:36px}.game-card-copy strong{font-size:1.08rem}.game-camp-banner{grid-template-columns:42px 1fr}.game-camp-banner .camp-symbol{width:42px;height:42px}.sudoku-number-pad{gap:4px}.sudoku-number-pad button{border-radius:8px}.wj-top-row{align-items:flex-start;flex-direction:column}.wj-top-row>div{width:100%;justify-content:flex-end}}

/* ---------- v44 game profiles, leaderboards and additional camping games ---------- */
.game-emoji-icon{font-size:2.1rem;line-height:1;}

.game-card-leaderboard{display:block;margin-top:10px;padding-top:9px;border-top:1px solid color-mix(in srgb,var(--border) 72%,transparent);}
.game-card-leaderboard em{display:block;color:var(--gold);font-size:.62rem;font-style:normal;font-weight:900;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px;}
.game-card-leaders{display:grid;gap:3px;}
.game-leader-row{display:grid!important;grid-template-columns:23px minmax(0,1fr) auto;gap:6px;align-items:center;margin:0!important;color:var(--muted)!important;font-size:.72rem!important;line-height:1.25!important;}
.game-leader-row .leader-medal{font-size:.88rem;}
.game-leader-row strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--cream);font-size:.72rem;}
.game-leader-row b{color:var(--gold-light);font-size:.72rem;font-variant-numeric:tabular-nums;}
.game-leader-row.empty{opacity:.52;}

.game-score-status{min-height:1.1em;margin:8px 0 14px!important;font-size:.76rem!important;line-height:1.35;color:var(--muted)!important;}
.game-score-status.success{color:#9ee6b2!important;}
.game-score-status.error{color:#ffb2a6!important;}
.game-score-status.info{color:var(--gold-light)!important;}
.game-win-score{display:grid;gap:2px;justify-items:center;margin:8px 0 10px;}
.game-win-score span{color:var(--muted);font-size:.68rem;font-weight:900;text-transform:uppercase;letter-spacing:.12em;}
.game-win-score strong{color:var(--gold);font-family:var(--font-display);font-size:1.8rem;}
.wj-timer{display:block;color:var(--muted);font-size:.76rem;margin-top:2px;}

.game-stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:4px 0 16px;}
.game-stat-row>div{padding:9px 6px;text-align:center;border:1px solid var(--border);border-radius:14px;background:var(--surface);}
.game-stat-row span{display:block;color:var(--cream);font-family:var(--font-display);font-size:1rem;font-weight:800;}
.game-stat-row small{color:var(--muted);font-size:.62rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800;}
.game-new-button{display:block;width:100%;max-width:420px;margin:16px auto 0;padding:12px;border:1px solid var(--border-strong);border-radius:14px;background:var(--surface-raised);color:var(--cream);font-weight:900;}

.memory-board{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:420px;margin:0 auto;}
.memory-card{aspect-ratio:1/1;border:1px solid var(--border-strong);border-radius:16px;background:linear-gradient(145deg,var(--surface-raised),var(--surface));color:var(--gold);display:grid;place-items:center;padding:5px;box-shadow:var(--card-shadow);}
.memory-card .card-back{font-size:1.8rem;opacity:.78;}
.memory-card.revealed{background:linear-gradient(145deg,color-mix(in srgb,var(--gold) 13%,var(--surface-raised)),var(--surface));}
.memory-card.revealed span{font-size:2rem;}
.memory-card.revealed small{display:block;color:var(--cream);font-size:.66rem;font-weight:800;margin-top:4px;}
.memory-card.matched{border-color:var(--gold);box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 16%,transparent);}

.mines-controls{display:flex;gap:10px;max-width:420px;margin:0 auto 12px;}
.mines-controls button{flex:1;padding:10px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface);color:var(--cream);font-weight:800;}
.mines-controls button.active{border-color:var(--gold);color:var(--gold);background:var(--surface-raised);}
.mines-board{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;max-width:420px;aspect-ratio:1/1;margin:0 auto;padding:5px;border:2px solid var(--gold);border-radius:14px;background:var(--surface);}
.mine-cell{aspect-ratio:1/1;border:1px solid color-mix(in srgb,var(--border-strong) 80%,transparent);border-radius:7px;background:linear-gradient(145deg,var(--surface-raised),var(--surface-soft));color:var(--cream);font-family:var(--font-display);font-weight:900;font-size:clamp(.72rem,3.6vw,1rem);padding:0;}
.mine-cell.open{background:color-mix(in srgb,var(--surface) 91%,white 9%);border-color:var(--border);}
.mine-cell.flagged{color:var(--gold);}
.mine-cell.mine{background:color-mix(in srgb,var(--rust) 35%,var(--surface));}
.mine-cell[data-count="1"]{color:#8cc7ff}.mine-cell[data-count="2"]{color:#8ee0a0}.mine-cell[data-count="3"]{color:#ff9e91}.mine-cell[data-count="4"]{color:#c4a7ff}.mine-cell[data-count="5"]{color:#ffcc87}.mine-cell[data-count="6"]{color:#8fe4df}.mine-cell[data-count="7"],.mine-cell[data-count="8"]{color:var(--cream)}

.hangman-weather{text-align:center;font-size:4rem;margin:8px 0 2px;filter:drop-shadow(0 8px 16px rgba(0,0,0,.28));}
.hangman-lives{text-align:center;color:var(--gold);font-weight:900;margin-bottom:12px;}
.hangman-hint{max-width:420px;margin:0 auto 14px;padding:12px 14px;border:1px solid var(--border);border-radius:14px;background:var(--surface);}
.hangman-hint span{display:block;color:var(--gold);font-size:.64rem;text-transform:uppercase;letter-spacing:.12em;font-weight:900;}
.hangman-hint strong{display:block;color:var(--cream);margin-top:3px;}
.hangman-word{max-width:420px;margin:0 auto 16px;padding:14px 8px;text-align:center;color:var(--cream);font-family:var(--font-display);font-size:clamp(1.2rem,5vw,1.8rem);font-weight:900;letter-spacing:.15em;overflow-wrap:anywhere;}
.hangman-keyboard{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;max-width:420px;margin:0 auto;}
.hangman-keyboard button{aspect-ratio:1/1;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface);color:var(--cream);font-weight:900;padding:0;}
.hangman-keyboard button:disabled{opacity:.28;}

.game-modal{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.66);}
.game-modal-card{width:min(360px,100%);padding:24px;border:1px solid var(--gold);border-radius:22px;background:var(--surface-raised);text-align:center;box-shadow:0 20px 70px rgba(0,0,0,.45);}
.game-modal-card .big-icon{font-size:2.8rem;}
.game-modal-card h3{margin:8px 0;color:var(--cream);font-family:var(--font-display);font-size:1.5rem;}
.game-modal-card p{color:var(--muted);}
.game-modal-card .win-actions{display:flex;gap:10px;}
.game-modal-card .win-actions button{flex:1;padding:11px;border-radius:12px;font-weight:900;border:1px solid var(--border-strong);}
.game-modal-card .primary{background:var(--gold);color:var(--ink);}
.game-modal-card .secondary{background:var(--surface);color:var(--cream);}

.settings-form-grid label span small{color:var(--gold);font-size:.6rem;text-transform:uppercase;letter-spacing:.07em;margin-left:4px;}

@media(min-width:700px){.memory-board{grid-template-columns:repeat(4,1fr)}}
@media(max-width:420px){.memory-board{gap:7px}.hangman-keyboard{gap:4px}.mine-cell{border-radius:5px}.game-leader-row strong{font-size:.68rem}.game-leader-row b{font-size:.68rem}}

/* ---------- v44.6 gameplay refinements ---------- */
.wj-tile,
.wj-tile.center {
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 96%, white 4%), var(--surface));
  color: var(--cream) !important;
  -webkit-text-fill-color: var(--cream);
  border-color: var(--border-strong, var(--gold));
  text-shadow: 0 1px 2px rgba(0,0,0,.32);
}
.wj-letter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wj-message { min-height: 2.4em; }
.memory-difficulty-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  max-width: 420px;
  margin: 0 auto 14px;
}
.memory-difficulty-row button {
  min-height: 42px;
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 96%, white 4%), var(--surface));
  color: var(--cream);
  font-weight: 900;
}
.memory-difficulty-row button.active {
  border-color: var(--gold);
  background: color-mix(in srgb, var(--gold) 16%, var(--surface-raised));
  color: var(--gold-light);
}
.memory-board[data-difficulty="easy"] { grid-template-columns: repeat(4, 1fr); }
.memory-board[data-difficulty="medium"] { grid-template-columns: repeat(3, 1fr); }
.memory-board[data-difficulty="hard"] { grid-template-columns: repeat(4, 1fr); }
.memory-board[data-difficulty="hard"] .memory-card.revealed span { font-size: 1.55rem; }
.memory-board[data-difficulty="hard"] .memory-card.revealed small { font-size: .56rem; }
@media (max-width: 360px) {
  .memory-board[data-difficulty="easy"],
  .memory-board[data-difficulty="hard"] { gap: 6px; }
  .memory-board[data-difficulty="hard"] .memory-card { border-radius: 11px; }
}


/* ---------- v44.7 Campfire Word Jumble used-letter feedback ---------- */
.wj-tile.used,
.wj-tile:disabled.used {
  opacity: .42;
  filter: grayscale(.72) saturate(.45);
  color: var(--muted) !important;
  -webkit-text-fill-color: var(--muted);
  border-color: color-mix(in srgb, var(--border) 70%, transparent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
  transform: scale(.97);
  cursor: default;
}


/* ---------- v45.0 in-game instructions ---------- */
.game-instructions {
  max-width: 560px;
  margin: -6px auto 16px;
  border: 1px solid var(--border-strong);
  border-radius: 16px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 96%, white 4%), var(--surface));
  overflow: hidden;
}
.game-instructions summary {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 14px;
  color: var(--cream);
  cursor: pointer;
  list-style: none;
  font-weight: 900;
  font-size: .82rem;
  touch-action: manipulation;
}
.game-instructions summary::-webkit-details-marker { display: none; }
.game-instructions summary span:last-child {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  color: var(--gold-light);
  font-size: 1rem;
  transition: transform .18s ease;
}
.game-instructions[open] summary span:last-child { transform: rotate(45deg); }
.game-instructions-body {
  padding: 0 14px 14px;
  border-top: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.5;
}
.game-instructions-body p { margin: 11px 0 0; }
.game-instructions-body ul { margin: 9px 0 0; padding-left: 19px; }
.game-instructions-body li + li { margin-top: 4px; }
.game-instructions-body strong { color: var(--cream); }
.game-instructions-body .game-scoring {
  padding: 10px 11px;
  border: 1px solid color-mix(in srgb, var(--gold) 28%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--gold) 7%, var(--surface));
  color: var(--gold-light);
}
.game-score-table { display: grid; gap: 6px; margin-top: 10px; }
.game-score-table > div {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
}
.game-score-table span { color: var(--muted); }
@media (max-width: 420px) {
  .game-instructions { margin-top: -7px; }
  .game-instructions-body { font-size: .74rem; }
  .game-score-table > div { grid-template-columns: 58px minmax(0, 1fr); }
}


/* v45.0 supplied camping game artwork */
.game-card-icon.game-image-icon {
  overflow: visible;
  background: color-mix(in srgb, var(--surface-soft) 88%, transparent);
}
.game-card-icon.game-image-icon img {
  width: 66px;
  height: 66px;
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 8px 12px rgba(0,0,0,.2));
}
@media (max-width: 420px) {
  .game-card-icon.game-image-icon img { width: 56px; height: 56px; }
}

/* =====================================================================
   v55.0.1 — Low-poly games refresh, optional sound and Campy Crush
   ===================================================================== */
.game-experience {
  --game-glow: color-mix(in srgb, var(--gold) 28%, transparent);
  --game-deep: color-mix(in srgb, var(--green) 24%, var(--surface));
  background:
    radial-gradient(circle at 12% 18%, color-mix(in srgb, var(--gold) 11%, transparent), transparent 22rem),
    radial-gradient(circle at 92% 42%, color-mix(in srgb, var(--green) 15%, transparent), transparent 25rem),
    linear-gradient(180deg, var(--premium-screen-top) 0 148px, color-mix(in srgb, var(--premium-screen-main) 90%, #020806) 148px, var(--bg) 100%) !important;
}
.game-experience::before,
.game-experience::after {
  content: "";
  position: fixed;
  z-index: 0;
  pointer-events: none;
  opacity: .18;
  filter: blur(.1px);
}
.game-experience::before {
  width: 210px;
  height: 180px;
  left: -70px;
  top: 31%;
  background: color-mix(in srgb, var(--green) 70%, transparent);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.game-experience::after {
  width: 190px;
  height: 150px;
  right: -70px;
  bottom: 15%;
  background: color-mix(in srgb, var(--gold) 58%, transparent);
  clip-path: polygon(50% 0, 100% 100%, 70% 78%, 52% 100%, 32% 75%, 0 100%);
}
.game-experience > * { position: relative; z-index: 1; }

.game-experience .screen-header {
  padding-right: 118px;
  background:
    linear-gradient(125deg, color-mix(in srgb, var(--green) 31%, transparent), transparent 42%),
    linear-gradient(180deg, color-mix(in srgb, var(--premium-header-overlay) 30%, transparent), var(--premium-header-overlay)),
    var(--premium-header-base) !important;
}
.game-experience .screen-header::after {
  width: 54px;
  height: 54px;
  top: 15px;
  right: 19px;
  border-width: 2px;
}
.game-sound-toggle {
  position: absolute;
  right: 16px;
  bottom: 15px;
  min-width: 98px;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 7px 10px;
  border: 1px solid color-mix(in srgb, var(--gold) 42%, var(--border));
  border-radius: 12px;
  color: var(--cream);
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 90%, white 4%), color-mix(in srgb, var(--surface) 90%, black 6%));
  box-shadow: 0 8px 17px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08), inset 0 -3px 0 rgba(0,0,0,.19);
  font-size: .71rem;
  font-weight: 900;
  touch-action: manipulation;
}
.game-sound-toggle span:first-child { font-size: 1rem; }
.game-sound-toggle.active {
  border-color: var(--gold);
  color: var(--gold-light);
  background: linear-gradient(145deg, color-mix(in srgb, var(--gold) 19%, var(--surface-raised)), color-mix(in srgb, var(--green) 30%, var(--surface)));
}
.game-sound-toggle:active { transform: translateY(2px); box-shadow: inset 0 2px 5px rgba(0,0,0,.23); }

.games-hero,
.game-camp-banner,
.game-instructions,
.game-stat-row > div,
.sudoku-stat,
.game-modal-card {
  box-shadow: 0 16px 34px rgba(0,0,0,.27), inset 0 1px 0 rgba(255,255,255,.07), inset 0 -4px 0 rgba(0,0,0,.14);
}
.games-hero,
.game-camp-banner {
  position: relative;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--gold) 35%, var(--border));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--green) 18%, transparent), transparent 56%),
    linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 97%, white 3%), color-mix(in srgb, var(--surface) 96%, black 4%));
}
.games-hero::after,
.game-camp-banner::after {
  content: "";
  position: absolute;
  width: 120px;
  height: 90px;
  right: -28px;
  bottom: -26px;
  background: color-mix(in srgb, var(--gold) 10%, transparent);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.game-camp-banner .camp-symbol {
  width: 74px;
  height: 74px;
  display: grid;
  place-items: center;
  border-radius: 22px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--gold) 16%, var(--surface-raised)), var(--surface));
  box-shadow: 0 12px 22px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08), inset 0 -5px 0 rgba(0,0,0,.2);
  transform: perspective(180px) rotateX(5deg) rotateY(-7deg);
}
.game-camp-banner .camp-symbol img { width: 66px; height: 66px; object-fit: contain; }

.games-grid { perspective: 1100px; }
.game-card {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-color: color-mix(in srgb, var(--gold) 29%, var(--border));
  background:
    linear-gradient(145deg, rgba(255,255,255,.035), transparent 36%),
    linear-gradient(155deg, color-mix(in srgb, var(--surface-raised) 96%, white 4%), color-mix(in srgb, var(--surface) 97%, black 3%));
  box-shadow: 0 14px 28px rgba(0,0,0,.27), inset 0 1px 0 rgba(255,255,255,.07), inset 0 -5px 0 rgba(0,0,0,.18);
  transform-style: preserve-3d;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.game-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 125px;
  height: 125px;
  left: -52px;
  top: -48px;
  background: color-mix(in srgb, var(--green) 16%, transparent);
  clip-path: polygon(50% 0, 100% 100%, 0 72%);
}
.game-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -31px;
  bottom: -36px;
  width: 100px;
  height: 92px;
  background: color-mix(in srgb, var(--gold) 9%, transparent);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.game-card-featured {
  border-color: color-mix(in srgb, var(--gold) 62%, var(--border));
  background:
    linear-gradient(130deg, color-mix(in srgb, var(--gold) 10%, transparent), transparent 48%),
    linear-gradient(155deg, color-mix(in srgb, var(--green) 25%, var(--surface-raised)), color-mix(in srgb, var(--surface) 95%, black 5%));
}
.game-card-featured small::after {
  content: "NEW";
  margin-left: 8px;
  padding: 3px 6px;
  border-radius: 999px;
  color: var(--ink);
  background: var(--gold);
  font-size: .55rem;
  letter-spacing: .08em;
}
.game-card-icon.game-image-icon {
  width: 86px;
  height: 86px;
  border: 1px solid color-mix(in srgb, var(--gold) 34%, var(--border));
  border-radius: 24px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--green) 18%, var(--surface-raised)), color-mix(in srgb, var(--surface) 95%, black 5%));
  box-shadow: 0 13px 22px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.09), inset 0 -6px 0 rgba(0,0,0,.18);
  transform: perspective(220px) rotateX(4deg) rotateY(-5deg);
}
.game-card-icon.game-image-icon img { width: 74px; height: 74px; }
.game-card-arrow {
  width: 34px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: color-mix(in srgb, var(--gold) 10%, var(--surface));
  box-shadow: inset 0 -3px 0 rgba(0,0,0,.18);
}
@media (hover:hover) {
  .game-card:hover {
    transform: translateY(-4px) rotateX(1deg);
    border-color: color-mix(in srgb, var(--gold) 66%, var(--border));
    box-shadow: 0 23px 40px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.09), inset 0 -5px 0 rgba(0,0,0,.17);
  }
}
.game-card:active { transform: translateY(2px); }

.sudoku-board,
.memory-board,
.mines-board,
.wj-letter-grid,
.hangman-keyboard {
  filter: drop-shadow(0 16px 22px rgba(0,0,0,.28));
}
.sudoku-board,
.mines-board {
  border-width: 3px;
  box-shadow: 0 19px 33px rgba(0,0,0,.29), inset 0 1px 0 rgba(255,255,255,.06), inset 0 -6px 0 rgba(0,0,0,.22);
}
.sudoku-cell,
.sudoku-number-pad button,
.wj-tile,
.memory-card,
.mine-cell,
.hangman-keyboard button,
.sudoku-controls button,
.memory-difficulty-row button,
.mines-controls button,
.game-new-button {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 0 -3px 0 rgba(0,0,0,.18), 0 5px 10px rgba(0,0,0,.12);
  transition: transform .13s ease, filter .13s ease, border-color .13s ease;
  touch-action: manipulation;
}
.sudoku-number-pad button:active,
.wj-tile:active,
.memory-card:active,
.mine-cell:active,
.hangman-keyboard button:active,
.game-new-button:active { transform: translateY(2px) scale(.98); }
.memory-card .card-back { text-shadow: 0 5px 10px rgba(0,0,0,.25); }
.memory-card.matched { animation: lowpoly-pop .35s ease; }
.mine-cell.open { box-shadow: inset 0 2px 7px rgba(0,0,0,.2); transform: translateY(2px); }
.hangman-weather { transform: perspective(240px) rotateX(4deg); }
.game-modal-card { border-width: 2px; }

/* Campy Crush */
.crush-banner .camp-symbol { overflow: hidden; padding: 3px; }
.crush-score-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  max-width: 480px;
  margin: 0 auto 10px;
}
.crush-score-row > div {
  padding: 10px 6px;
  text-align: center;
  border: 1px solid color-mix(in srgb, var(--gold) 28%, var(--border));
  border-radius: 15px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface-raised) 96%, white 4%), var(--surface));
  box-shadow: 0 9px 17px rgba(0,0,0,.21), inset 0 1px 0 rgba(255,255,255,.07), inset 0 -4px 0 rgba(0,0,0,.16);
}
.crush-score-row span { display: block; color: var(--cream); font-family: var(--font-display); font-size: 1.12rem; font-weight: 900; }
.crush-score-row small { display: block; margin-top: 2px; color: var(--muted); font-size: .6rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.crush-progress {
  height: 11px;
  max-width: 480px;
  margin: 0 auto 9px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--gold) 30%, var(--border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 89%, black 11%);
  box-shadow: inset 0 2px 5px rgba(0,0,0,.28);
}
.crush-progress span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, color-mix(in srgb, var(--green) 82%, var(--gold)), var(--gold));
  box-shadow: 0 0 15px var(--game-glow);
  transition: width .28s ease;
}
.crush-message {
  min-height: 2.4em;
  max-width: 480px;
  margin: 0 auto 9px;
  color: var(--muted);
  text-align: center;
  font-size: .78rem;
  font-weight: 800;
}
.crush-message.success { color: var(--gold-light); }
.crush-message.combo { color: var(--gold-light); font-size: .88rem; animation: lowpoly-pop .32s ease; }
.crush-message.error { color: var(--rust-light); }
.crush-message.shuffle { color: var(--cream); }
.campy-crush-board {
  --crush-gap: 5px;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: var(--crush-gap);
  width: min(480px, 100%);
  aspect-ratio: 1 / 1;
  margin: 0 auto;
  padding: 9px;
  border: 2px solid color-mix(in srgb, var(--gold) 70%, var(--border));
  border-radius: 23px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--green) 18%, transparent), transparent 42%),
    color-mix(in srgb, var(--surface) 92%, #020907 8%);
  box-shadow: 0 23px 40px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.08), inset 0 -8px 0 rgba(0,0,0,.24);
  perspective: 700px;
  touch-action: manipulation;
}
.campy-crush-board.busy { pointer-events: none; }
.crush-tile {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 1 / 1;
  min-width: 0;
  padding: 3px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--gold) 20%, var(--border));
  border-radius: 13px;
  color: var(--cream);
  background: linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.01) 37%, rgba(0,0,0,.18));
  box-shadow: 0 7px 11px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.13), inset 0 -4px 0 rgba(0,0,0,.2);
  transform-style: preserve-3d;
  transition: transform .15s ease, filter .15s ease, opacity .15s ease, border-color .15s ease;
  touch-action: manipulation;
}
.crush-tile::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .17;
  background: linear-gradient(135deg, white 0 34%, transparent 35% 65%, black 66% 100%);
  clip-path: polygon(0 0, 100% 0, 100% 62%, 64% 100%, 0 78%);
}
.crush-tile.selected {
  z-index: 2;
  border-color: var(--gold-light);
  filter: brightness(1.16) saturate(1.08);
  transform: translateY(-4px) scale(1.06) rotateX(4deg);
  box-shadow: 0 13px 18px rgba(0,0,0,.32), 0 0 0 3px color-mix(in srgb, var(--gold) 28%, transparent), inset 0 1px 0 rgba(255,255,255,.18), inset 0 -4px 0 rgba(0,0,0,.19);
}
.crush-tile.clearing { animation: crush-clear .26s ease both; }
.crush-gem { width: 88%; height: 88%; display: grid; place-items: center; filter: drop-shadow(0 7px 5px rgba(0,0,0,.28)); }
.crush-gem svg { width: 100%; height: 100%; overflow: visible; }
.crush-gem .stroke { fill: none; stroke: currentColor; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.crush-gem .steam { stroke-width: 3; opacity: .72; }
.crush-gem .wheel { fill: #17211f; }
.crush-tent { background-color: #c67b32; color: #f7dd91; }
.crush-tent .facet-a { fill: #f0bd57; } .crush-tent .facet-b { fill: #b95b2c; } .crush-tent .facet-c { fill: #164133; }
.crush-fire { background-color: #a63e2e; color: #ffe1a0; }
.crush-fire .facet-a { fill: #ef5d42; } .crush-fire .facet-b { fill: #ff9a3d; } .crush-fire .facet-c { fill: #ffe19a; }
.crush-caravan { background-color: #48758a; color: #f4ecd8; }
.crush-caravan .facet-a { fill: #f2ead7; } .crush-caravan .facet-b { fill: #cfb779; } .crush-caravan .facet-c { fill: #7db7ca; } .crush-caravan .facet-d { fill: #86543b; }
.crush-pine { background-color: #2f744b; color: #d1e3b9; }
.crush-pine .facet-a { fill: #53a366; } .crush-pine .facet-b { fill: #247047; } .crush-pine .facet-c { fill: #81512f; }
.crush-mug { background-color: #735d9b; color: #f5e9cf; }
.crush-mug .facet-a { fill: #f2e7cf; } .crush-mug .facet-b { fill: #b59ac9; } .crush-mug .facet-c { fill: none; stroke: #f2e7cf; }
.crush-lantern { background-color: #9a7626; color: #f8e6a4; }
.crush-lantern .facet-a { fill: #f6cf65; } .crush-lantern .facet-b { fill: #b67a28; } .crush-lantern .facet-c { fill: #fff1a8; }
.crush-finish-card { background: linear-gradient(145deg, color-mix(in srgb, var(--green) 25%, var(--surface-raised)), var(--surface-raised)); }

@keyframes crush-clear {
  0% { opacity: 1; transform: scale(1) rotate(0deg); filter: brightness(1); }
  55% { opacity: 1; transform: scale(1.17) rotate(5deg); filter: brightness(1.55); }
  100% { opacity: 0; transform: scale(.35) rotate(-12deg); filter: brightness(1.8); }
}
@keyframes lowpoly-pop {
  0% { transform: scale(.9); }
  60% { transform: scale(1.08); }
  100% { transform: scale(1); }
}

@media (max-width: 430px) {
  .game-experience .screen-header { padding-right: 108px; }
  .game-experience .screen-header::after { width: 44px; height: 44px; top: 13px; right: 16px; }
  .game-sound-toggle { right: 12px; bottom: 12px; min-width: 91px; min-height: 35px; font-size: .66rem; }
  .game-card-icon.game-image-icon { width: 72px; height: 72px; border-radius: 20px; }
  .game-card-icon.game-image-icon img { width: 63px; height: 63px; }
  .campy-crush-board { --crush-gap: 3px; padding: 6px; border-radius: 18px; }
  .crush-tile { padding: 1px; border-radius: 9px; box-shadow: 0 4px 7px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.12), inset 0 -3px 0 rgba(0,0,0,.19); }
}
@media (max-width: 360px) {
  .game-experience .screen-header { padding-right: 105px; }
  .game-experience .screen-header::after { display: none; }
  .game-sound-toggle { top: 15px; bottom: auto; }
  .campy-crush-board { --crush-gap: 2px; padding: 5px; }
  .crush-score-row span { font-size: .95rem; }
}
@media (prefers-reduced-motion: reduce) {
  .game-card,
  .crush-tile,
  .crush-progress span,
  .memory-card { transition: none !important; animation: none !important; }
}
/* v55 low-poly banners use a larger icon track. */
.game-experience .game-camp-banner { grid-template-columns: 74px minmax(0, 1fr); gap: 14px; }
@media (max-width: 430px) {
  .game-experience .game-camp-banner { grid-template-columns: 64px minmax(0, 1fr); gap: 11px; }
  .game-experience .game-camp-banner .camp-symbol { width: 64px; height: 64px; }
  .game-experience .game-camp-banner .camp-symbol img { width: 58px; height: 58px; }
}

/* v55.0.3 — Campy Crush score submission controls */
.campy-crush-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  max-width: 620px;
  margin: 16px auto 0;
}
.campy-crush-actions .game-new-button {
  max-width: none;
  margin: 0;
}
.campy-submit-button {
  border-color: color-mix(in srgb, var(--gold) 58%, var(--border-strong));
  background: linear-gradient(145deg, color-mix(in srgb, var(--gold) 22%, var(--surface-raised)), var(--surface-raised));
}
.campy-submit-button:disabled {
  opacity: .5;
  cursor: not-allowed;
  transform: none;
}
.leaderboard-retry-button {
  border: 1px solid var(--border-strong);
  border-radius: 11px;
  background: var(--surface-raised);
  color: var(--cream);
  padding: 9px 12px;
  font-weight: 900;
  display: block;
  width: 100%;
  margin: 10px 0;
}
.leaderboard-retry-button[hidden] { display: none; }
@media (max-width: 520px) {
  .campy-crush-actions { grid-template-columns: 1fr; }
}
