/* Design tokens. A client restyle usually starts (and often ends) here.
   Every component in site.css and the admin reads these variables. */
:root {
  color-scheme: light dark;

  /* Colour */
  --rw-bg: #f6f7f9;
  --rw-surface: #ffffff;
  --rw-surface-2: #f0f2f5;
  --rw-text: #14171c;
  --rw-muted: #5d6573;
  --rw-border: #e2e5ea;
  --rw-accent: #3b5bdb;
  --rw-accent-hover: #2f4bc0;
  --rw-accent-contrast: #ffffff;
  --rw-accent-soft: #e8edff;
  --rw-success: #1f8a4c;
  --rw-warn: #b26a00;
  --rw-warn-soft: #fff4e0;
  --rw-danger: #c92a2a;
  --rw-danger-soft: #ffe9e9;
  --rw-gold: #d4a017;
  --rw-silver: #9aa3ad;
  --rw-bronze: #b8743d;

  /* Avatar palette, picked by data-hue (0-7) from the player name */
  --rw-hue-0: #4c6ef5; --rw-hue-1: #12b886; --rw-hue-2: #f76707;
  --rw-hue-3: #ae3ec9; --rw-hue-4: #1c7ed6; --rw-hue-5: #e64980;
  --rw-hue-6: #2b8a3e; --rw-hue-7: #5f3dc4;

  /* Type */
  --rw-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, sans-serif;
  --rw-font-display: var(--rw-font);
  --rw-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --rw-text-sm: 0.875rem;
  --rw-text-base: 1rem;
  --rw-text-lg: 1.25rem;
  --rw-text-xl: clamp(1.6rem, 4vw, 2.25rem);
  --rw-text-hero: clamp(2.2rem, 7vw, 4rem);
  --rw-weight-bold: 700;

  /* Shape and space */
  --rw-radius-sm: 6px;
  --rw-radius: 12px;
  --rw-radius-lg: 20px;
  --rw-space-1: 4px;
  --rw-space-2: 8px;
  --rw-space-3: 12px;
  --rw-space-4: 16px;
  --rw-space-5: 24px;
  --rw-space-6: 40px;
  --rw-space-7: 64px;
  --rw-maxw: 1080px;
  --rw-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 4px 16px rgba(16, 24, 40, .06);
}

@media (prefers-color-scheme: dark) {
  :root {
    --rw-bg: #0f1115;
    --rw-surface: #171a21;
    --rw-surface-2: #1f232c;
    --rw-text: #eef0f4;
    --rw-muted: #9aa3b2;
    --rw-border: #2a2f3a;
    --rw-accent: #748ffc;
    --rw-accent-hover: #91a7ff;
    --rw-accent-contrast: #0f1115;
    --rw-accent-soft: #1e2540;
    --rw-warn-soft: #2e2410;
    --rw-danger-soft: #3a1717;
    --rw-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 4px 16px rgba(0, 0, 0, .3);
  }
}