/* Lychee Games pages: the work-page theme plus a play button, rules lists and a game screenshot.
   Every colour comes from the reading tokens (--ink, --paper, --muted, --accent, --rule), so night mode works. */
.game-kicker { display: flex; align-items: center; gap: 10px; margin: 8px 0 0; color: var(--muted); font: 400 9px/2 'Press Start 2P', monospace; letter-spacing: 0; text-transform: uppercase; }
.game-kicker img { width: 18px; height: 18px; image-rendering: pixelated; }
.game-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 28px 56px; align-items: center; }
.game-hero .page-hero__lead { font-size: 1rem; }
.game-hero__shot { margin: 0; border: 1px solid var(--rule); background: var(--paper); }
.game-hero__shot img { display: block; width: 100%; height: auto; aspect-ratio: 1280 / 760; }
.game-facts { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 24px 0 0; padding: 0; }
.game-facts li { border: 1px solid var(--rule); padding: 4px 11px; font-size: .72rem; line-height: 1.6; }
.game-facts b { font-weight: 600; }
.game-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin: 28px 0 0; }
.game-play { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 56px; padding: 12px 28px; border-radius: 4px; background: var(--accent); color: var(--paper); font-size: 1.05rem; font-weight: 600; text-decoration: none; box-shadow: 0 4px 0 color-mix(in srgb, var(--accent) 70%, #000); }
.prose a.game-play, .game-play:hover, .game-play:focus-visible { color: var(--paper); text-decoration: none; }
.game-play:hover { background: color-mix(in srgb, var(--accent) 88%, #000); }
.game-play:active { transform: translateY(2px); box-shadow: 0 2px 0 color-mix(in srgb, var(--accent) 70%, #000); }
.page-cta__actions a.game-play { display: inline-flex; padding: 12px 28px; border: 0; font-size: 1.05rem; }
.page-cta__actions a.game-play:hover { background: color-mix(in srgb, var(--accent) 88%, #000); color: var(--paper); }
.game-play img { width: 20px; height: 20px; image-rendering: pixelated; }
.game-cta__note { color: var(--muted); font-size: .72rem; }
.game-goal { padding: 14px 18px; border-left: 3px solid var(--accent); background: color-mix(in srgb, var(--paper) 70%, #fff); }
:root[data-theme="night"] .game-goal { background: color-mix(in srgb, var(--paper) 88%, #fff); }
.game-page .prose h3 { font-size: 1.12rem; margin: 36px 0 12px; }
.game-page .prose ol li, .game-page .prose ul li { margin-bottom: 10px; }
.game-modes { margin: 20px 0 0; display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: 0; border-top: 1px solid var(--rule); max-width: 110ch; }
.game-modes dt, .game-modes dd { margin: 0; padding: 14px 0; border-bottom: 1px solid var(--rule); }
.game-modes dt { font-weight: 600; padding-right: 20px; }
.game-controls { margin: 0; }
.game-controls dt { font-weight: 600; margin-top: 14px; }
.game-controls dd { margin: 0; }
.game-controls ul { margin-block: 6px 0; }
kbd { display: inline-block; min-width: 1.6em; padding: 0 .4em; border: 1px solid var(--rule); border-bottom-width: 2px; border-radius: 4px; background: color-mix(in srgb, var(--paper) 70%, #fff); color: var(--ink); font: 600 .78em/1.55 ui-monospace, Consolas, Menlo, monospace; text-align: center; white-space: nowrap; }
:root[data-theme="night"] kbd { background: color-mix(in srgb, var(--paper) 85%, #fff); }
.game-faq h3 { margin-bottom: 8px; }
.game-again { margin: 56px 0 0; padding: 28px 0 0; border-top: 1px solid var(--rule); }
.game-again h2 { margin-top: 0; }
.game-related .wi__meta { justify-content: flex-start; }
.game-all { margin-top: -32px; }
.wi__meta .game-new { color: var(--accent); }
@media (max-width: 900px) {
  .game-hero { grid-template-columns: 1fr; }
  .game-hero__shot { order: 2; }
}
@media (max-width: 600px) {
  .game-kicker { font-size: 8px; }
  .game-play { width: 100%; }
  .game-modes { grid-template-columns: 1fr; }
  .game-modes dt { border-bottom: 0; padding-bottom: 2px; }
  .game-modes dd { padding-top: 0; }
  .game-all { margin-top: -40px; }
}
@media print { .game-cta, .game-again { display: none; } }