/* Quiz Night — design tokens
   Drop into the build as-is. Fonts: Google Fonts, both free —
   https://fonts.googleapis.com/css2?family=Alfa+Slab+One&family=Figtree:wght@400;500;600;700;800;900&display=swap
*/
:root {
  /* colour */
  --qn-burgundy: #7D2233;      /* primary — headers, reveal bg, primary phone actions */
  --qn-burgundy-deep: #5C1624; /* pressed states / hard shadows */
  --qn-brass: #F0B03C;         /* accent — highlights, badges, "just joined" */
  --qn-paper: #F6EDDA;         /* light background */
  --qn-panel: #EFE2C6;         /* raised panels on paper */
  --qn-ink: #2A1A10;           /* text on light; host dark background */
  --qn-cream: #FBF3E0;         /* text on dark, cards */
  --qn-correct: #1E6E44;       /* semantic: correct — always paired with tick icon */
  --qn-wrong: #CE4A32;         /* semantic: incorrect — always paired with cross icon */
  --qn-locked: #E2971F;        /* semantic: locked / timer urgency */
  --qn-team: #23648F;          /* semantic: "your team" highlight */

  /* host controller dark surfaces */
  --qn-host-bg: #2A1A10;
  --qn-host-card: #3B2B1D;
  --qn-host-raised: #4A3B2E;
  --qn-host-muted: #A08A6E;
  --qn-host-text: #C9B896;

  /* type */
  --qn-font-display: 'Alfa Slab One', serif;
  --qn-font-ui: 'Figtree', system-ui, sans-serif;

  /* big screen scale (designed at 1920x1080) */
  --qn-screen-timer: 260px;
  --qn-screen-reveal: 180px;
  --qn-screen-question: 108px;
  --qn-screen-list: 56px;
  --qn-screen-meta: 44px;      /* absolute minimum size on the big screen */

  /* phone scale */
  --qn-phone-action: 24px;     /* primary buttons — 72px tall */
  --qn-phone-input: 26px;
  --qn-phone-body: 18px;       /* minimum body size */
  --qn-tap-min: 56px;          /* minimum touch target */

  /* shape */
  --qn-radius: 16px;
  --qn-radius-lg: 24px;
  --qn-border: 3px solid var(--qn-ink);
  --qn-press-shadow: 0 5px 0 var(--qn-burgundy-deep);
}