/* The game's fixed values: colors, fonts, and the sizes the layout is built from. Everything else refers to these by name. */

@font-face {
  font-family: "Musgo Caps";
  /* The first file is the same font with its X and O drawings given the characters ❌ and ⭕ (the check is its ✔). If it can't
     load, the original loads instead and only those logos suffer. */
  src: url("../fonts/Musgo-Caps-ExtraBold-mapped.woff2") format("woff2"), url("../fonts/Musgo-Caps-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: dark;

  /* the page is always dark */
  --page-background: #161618;
  --panel-background: #202024;
  --text-color: #eeeeee;
  --muted-text-color: #9a9aa2;
  --line-color: #37373d;
  --button-background: #eeeeee;
  --button-text-color: #161618;

  /* the one set of player colors, used on the board, chips, walls, score cards and modals */
  --player-1-color: #d4394d;   /* X */
  --player-2-color: #2680cc;   /* O */
  --player-3-color: #00a94f;   /* ✓ */
  /* brighter versions for text on the black page (the status line and the last-move texts) */
  --player-1-bright-color: #e8314a;
  --player-2-bright-color: #2e9efa;
  --player-3-bright-color: #01ca58;

  --absurd-color: #6a35b0;
  --wall-color: #8a8a92;
  --bonus-square-background: #3d3420;
  --bonus-color: #e8b93c;
  --ok-background: #27402f;

  --display-font: "Musgo Caps", sans-serif;
  --body-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* the board */
  --board-width: 470px;
  --board-gap: 10px;
  --square-radius: 10px;
  --wall-thickness: 8px;
  --link-thickness: 10px;
}

/* the board's colors for the player who is you, set by the board when a game starts */
.board { --my-color: var(--player-1-color); }