/* Print = a one-page cheat sheet. Everything that exists to help you navigate
   the page on screen is chrome, and chrome does not belong on paper. */

@page {
  margin: 12mm;
}

/* Force the light palette for paper.
 *
 * The selector list matters: a plain `:root` here is specificity (0,1,0) and
 * LOSES to theme.css's `:root[data-theme="dark"]` (0,2,0), so printing from
 * dark mode used to render cheat-sheet cells as near-black blocks with black
 * text. These selectors match that specificity, and print.css loads last.
 */
:root,
:root[data-theme],
:root:not([data-theme="light"]) {
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-2: #f4f4f4;
  --border: #c8c8c8;
  --border-strong: #000000;
  --input-border: #666666;
  --text: #000000;
  --text-muted: #333333;

  --accent: #000000;
  --accent-hover: #000000;
  --accent-soft: #f0f0f0;
  --accent-on-soft: #000000;
  --accent-solid: #000000;
  --accent-solid-hover: #000000;
  --accent-on-solid: #ffffff;

  /* Kept red rather than black: "Red King = -1" is a rule, not decoration.
     Reads as dark grey on a mono printer. */
  --suit-red: #8a1a12;
  --warning-bg: #f5f5f5;
  --warning-border: #999999;

  --card-face: #ffffff;
  --card-border: #999999;
  --card-ink: #000000;
  --card-ink-red: #8a1a12;
  --card-back: #333333;
  --card-back-line: rgb(255 255 255 / 30%);

  --diagram-ink: #000000;
  --diagram-muted: #333333;
  --diagram-arrow: #666666;
  --diagram-good: #000000;
  --diagram-warn: #000000;
  --diagram-good-bg: #f0f0f0;
  --diagram-warn-bg: #f0f0f0;

  /* The cheat sheet is a dark slate panel on screen; on paper it must be
     white, or it prints as a solid block of toner. */
  --panel: #ffffff;
  --panel-text: #000000;
  --panel-muted: #333333;
  --panel-border: #999999;
  --panel-accent: #333333;

  --danger-bg: #f5f5f5;
  --danger-border: #999999;

  --shadow-sm: none;
  --shadow-md: none;
  --shadow-lg: none;
}

body {
  background: #fff !important;
  color: #000 !important;
  font-size: 10.5pt;
  line-height: 1.4;
}

/* --- Hide the chrome --- */
.site-header,
.site-footer,
.anchor-nav,
.crumb,
.pager,
.skip-link,
.theme-toggle,
.finder,
.coming-soon,
.tracker,
.cheatsheet__head button,
.section__lede {
  display: none !important;
}

/* --- Game page: cheat sheet only --- */

/* Everything before the cheat sheet is reference material you already read. */
.page-game .section:not(.cheatsheet) {
  display: none !important;
}

.page-game .game__header {
  padding: 0 0 4mm;
  max-width: none;
  border-bottom: 1.5pt solid #000;
  margin-bottom: 5mm;
}
.page-game .game__header h1 { font-size: 22pt; margin-bottom: 1mm; }
.page-game .game__tagline { font-size: 10pt; margin-bottom: 3mm; font-style: italic; }
.page-game .aliases { font-size: 9pt; margin-bottom: 2mm; }

.page-game .stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0 6mm;
  background: none;
  border: 0;
  border-radius: 0;
}
.page-game .stats__item { padding: 0; background: none; }
.page-game .stats dt { display: inline; font-size: 8pt; }
.page-game .stats dt::after { content: ": "; }
.page-game .stats dd { display: inline; font-size: 9pt; }

.page-game .cheatsheet { margin: 0; }
.page-game .cheatsheet__card {
  border: 1pt solid #000;
  border-radius: 0;
  break-inside: avoid;
}
/* The page h1 and stats row above already give the name, players, time and
   deck — the card's own header would just repeat them and eat a third of the
   page. */
.page-game .cheatsheet__title { display: none !important; }

.page-game .cheatsheet__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  background: none;
}
.page-game .cheatsheet__cell {
  padding: 3mm 4mm;
  font-size: 9.5pt;
  border-right: 0.5pt solid #999;
  border-bottom: 0.5pt solid #999;
  break-inside: avoid;
}
.page-game .cheatsheet__cell:nth-child(2n) { border-right: 0; }
.page-game .cheatsheet__cell:nth-last-child(-n + 2) { border-bottom: 0; }
.page-game .cheatsheet__cell h4 { font-size: 8.5pt; margin-bottom: 1.5mm; color: #000; }
.page-game .cheatsheet__cell ul,
.page-game .cheatsheet__cell ol { padding-left: 4.5mm; }
.page-game .cheatsheet__cell li { margin-bottom: 1mm; }

/* --- Homepage: a plain index of games --- */

.page-home .hero { padding: 0 0 4mm; max-width: none; }
.page-home .hero h1 { font-size: 20pt; }
.page-home .hero__sub { font-size: 10pt; }
.page-home .game-grid { display: block; }
.page-home .card-item { break-inside: avoid; }
.page-home .game-card {
  display: block;
  padding: 2mm 0;
  border: 0;
  border-bottom: 0.5pt solid #ccc;
  border-radius: 0;
  box-shadow: none;
}
.page-home .game-card__suit,
.page-home .empty { display: none !important; }
.page-home .game-card__name { font-size: 12pt; display: inline; }
.page-home .game-card__aka { display: inline; font-size: 9pt; }
.page-home .game-card__aka::before { content: " — "; }
.page-home .game-card__tagline { font-size: 9.5pt; margin: 1mm 0; }
.page-home .pill { border: 0; padding: 0; font-size: 8.5pt; }
.page-home .pill + .pill::before { content: " · "; }

/* Print the URL after a link so a printed page is still useful. */
.page-home .game-card::after {
  content: " " attr(href);
  font-size: 8pt;
  color: #555;
}

table, tr, .callout, .example { break-inside: avoid; }
h1, h2, h3, h4 { break-after: avoid; }

/* On screen these headings are solid inverted blocks. On paper that is a bar
   of toner per section, so they print as plain bold text over a rule. */
.cheatsheet__head h2,
.coming-soon h2,
.section > h2 {
  background: none !important;
  color: #000 !important;
  padding: 0 0 1mm !important;
  border-bottom: 0.75pt solid #000;
}