:root {
  --box-shadow-up: 0 -1px 2px rgba(0, 0, 0, 0.3);
  --box-shadow-down: 0 1px 2px rgba(0,0,0,0.3);

  --online-green: #16a34a;
  --online-blue: #2563eb;
  --turn-amber: #f59e0b;
  --finished-purple: #9333ea;

  --player-1: #38b7e5;
  --player-2: #e66f61;
  --tile-selectable: #82cde7;
  --tile-highlight: #f2ca3e;

  --border: #888;

  --surface-grid:
    repeating-linear-gradient(0deg, rgba(38, 63, 80, 0.035) 0 1px, transparent 1px 32px),
    repeating-linear-gradient(90deg, rgba(38, 63, 80, 0.035) 0 1px, transparent 1px 32px);
  --surface-background: var(--surface-grid), linear-gradient(135deg, #f8fafc, #edf3f6);
  --tile-sheen: linear-gradient(145deg, rgba(255, 255, 255, 0.22), rgba(25, 48, 68, 0.08));

  --game-background: var(--surface-background);
  --rack-and-buttons: var(--surface-background);

  --game-nav: var(--surface-background);
  --game-nav-buttons-selected: #fff;

  --empty-slot: #52636e;
  --normal-cell: #52636e;
  --block-cell: #14232d;
  --gamble-cell: #425865;

  --l2: #b8e3d1;
  --l3: #58c69a;
  --l4: #12936a;

  --w2: #f5dc78;
  --w3: #f0a052;
  --w4: #d96b32;

  --tp: #d9e3e9;
  --bp: #956bc0;
  --dp: #dc5964;
  --ndp: #263746;

  --token-text: forestgreen;

  --btn-border: #555;
  --btn-danger: #e84e40;
  --btn-success: #cddc39;
  --btn-primary: #29b6f6;
  --btn-yellow: #ffea00;

  --title-bar: #666;

  --tile-indicator: #eee;

  --not-connected: #d84315;
  --connected: #14e715;

  --move-errors: dodgerblue;

  --pgr-count: #f57c00;
}