/* MyGoal Signal — tokens.css: every color, volume and the hero photo, one set per theme (only the
   active theme's photo is downloaded). */
:root {
  --paper: #f6f5f0;
  --ink: #111f38;
  --slate: #53627b;
  --border: #d9dde6;
  --cobalt: #3155d9;
  --coral: #b9404d;
  --pale: #e9eef6;
  --live: #1f9d55;
  /* Results: win, draw, loss — always with their letter, never color alone. */
  --win: #1f9d55;
  --draw: #c98a12;
  --loss: #c23a48;
  /* Volume: a tile is lit from above (light top edge, gradient down) and sits in a soft shadow. */
  --tile: linear-gradient(180deg, #ffffff 0%, #fbfbfd 45%, #f1f3f8 100%);
  --tile-edge: rgba(17, 31, 56, 0.09);
  --tile-depth: inset 0 1px 0 #ffffff, inset 0 -2px 4px rgba(17, 31, 56, 0.06),
    0 1px 1px rgba(17, 31, 56, 0.06), 0 6px 14px rgba(17, 31, 56, 0.07), 0 18px 32px -12px rgba(17, 31, 56, 0.12);
  --tile-hover: 0 1px 1px rgba(17, 31, 56, 0.06), 0 10px 22px rgba(17, 31, 56, 0.10), 0 24px 40px -14px rgba(17, 31, 56, 0.16);
  --plate: radial-gradient(circle at 50% 30%, #ffffff 0%, #eef1f6 70%, #dfe4ec 100%);
  --plate-depth: inset 0 1px 0 #ffffff, inset 0 -2px 3px rgba(17, 31, 56, 0.10), 0 1px 2px rgba(17, 31, 56, 0.14);
  --emboss: 0 1px 0 rgba(255, 255, 255, 0.9);
  --hero: url("/img/hero-day.webp");
  --logo: url("/img/logo.webp");
  color-scheme: light;
}
:root[data-theme="dark"] {
  --paper: #0d1526;
  --ink: #eef1f7;
  --slate: #9aa7bd;
  --border: #26324b;
  --cobalt: #5b7bf0;
  --coral: #e0707c;
  --pale: #1c2944;
  --live: #3ccf7f;
  --win: #34c477;
  --draw: #e2b33c;
  --loss: #e0707c;
  --tile: linear-gradient(180deg, #1f2c4a 0%, #18233d 40%, #121b30 100%);
  --tile-edge: rgba(255, 255, 255, 0.06);
  --tile-depth: inset 0 1px 0 rgba(255, 255, 255, 0.12), inset 0 -3px 6px rgba(0, 0, 0, 0.45),
    0 1px 1px rgba(0, 0, 0, 0.7), 0 6px 14px rgba(0, 0, 0, 0.40), 0 18px 32px -12px rgba(0, 0, 0, 0.6);
  --tile-hover: 0 1px 1px rgba(0, 0, 0, 0.7), 0 10px 22px rgba(0, 0, 0, 0.5), 0 26px 44px -14px rgba(0, 0, 0, 0.7);
  /* Plates stay light at night: club and tournament logos are drawn for light ground. */
  --plate: radial-gradient(circle at 50% 30%, #f4f6fa 0%, #dde3ec 70%, #c4ccd9 100%);
  --plate-depth: inset 0 1px 0 rgba(255, 255, 255, 0.7), inset 0 -2px 3px rgba(0, 0, 0, 0.25), 0 2px 4px rgba(0, 0, 0, 0.6);
  --emboss: 0 1px 2px rgba(0, 0, 0, 0.6);
  --hero: url("/img/hero-night.webp");
  --logo: url("/img/logo-dark.webp");
  color-scheme: dark;
}