/* Open Premier design tokens. Generated by tools/make_tokens_css.py from
   tokens/colors.json and tokens/typography.json: edit those, then run scripts/build-all.sh.
   Font URLs are relative to this file (tokens/ -> ../fonts/); copy the fonts next to it
   or rewrite the url() paths when you vendor this file. */

@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/SourceSerif4-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/SourceSerif4-Semibold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fira Sans";
  src: url("../fonts/FiraSans-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fira Sans";
  src: url("../fonts/FiraSans-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fira Mono";
  src: url("../fonts/FiraMono-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* brand */
  --op-green-950: #0b2014; /* Night outfield. Page background, deepest shade, scrims. */
  --op-green-900: #0f2a1a; /* Stage behind the game canvas; PWA background_color. */
  --op-green-800: #173d26; /* Signature green. theme-color, the app-icon ground on every platform, the mark on light grounds. */
  --op-green-700: #1f4e31; /* Mown stripe (light). */
  --op-green-600: #2a643f; /* Mown stripe highlight, hover states on dark. */
  --op-cream: #f4ecd8; /* Cricket whites. Primary text and stumps on dark; page colour on light. */
  --op-cream-dim: #d8cfb7; /* Secondary text on dark. */
  --op-pitch: #c9ae76; /* Pitch tan. Bails, the OPEN PREMIER line and accents on dark. */
  --op-pitch-dark: #a88d57; /* Pitch shadow, gradients. Not for text. */
  --op-pitch-ink: #6e5526; /* Pitch tan dark enough for text on cream (6.0:1). The OPEN PREMIER line and bails on light. */
  --op-leather: #a8242c; /* Leather ball red. The ball in the mark; one accent per layout. */
  --op-leather-dark: #7d1a20; /* Ball shadow. */
  --op-leather-light: #d0444b; /* Ball highlight. */

  /* game-ui */
  --op-game-ui-panel: #090f17; /* HUD panels at 90% opacity. */
  --op-game-ui-panel-light: #141f2b; /* Raised panels at 92% opacity. */
  --op-game-ui-button: #212e40; /* Buttons at 95% opacity. */
  --op-game-ui-button-hover: #304259;
  --op-game-ui-button-primary: #80610f;
  --op-game-ui-button-primary-hover: #9e7a1a;
  --op-game-ui-accent: #fac733; /* Gold: focus, selection, the active choice. */
  --op-game-ui-accent-dim: #9e8029;
  --op-game-ui-text: #f2f5f7;
  --op-game-ui-text-dim: #9eabba;
  --op-game-ui-text-faint: #667385;
  --op-game-ui-good: #4cd173;
  --op-game-ui-warn: #fa9e33;
  --op-game-ui-bad: #eb423d;
  --op-game-ui-info: #59a6fa;

  /* sport */
  --op-sport-cricket-ground: #173d26; /* = brand.green-800 */
  --op-sport-cricket-ground-deep: #0f2a1a; /* = brand.green-900 */
  --op-sport-cricket-accent: #a8242c; /* = brand.leather */
  --op-sport-cricket-detail: #c9ae76; /* = brand.pitch */

  /* type */
  --op-font-serif: "Source Serif 4", "Iowan Old Style", "Palatino Linotype", "Palatino", "Georgia", serif;
  --op-font-sans: "Fira Sans", system-ui, -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", "Arial", sans-serif;
  --op-font-mono: "Fira Mono", ui-monospace, "SFMono-Regular", "Menlo", "Consolas", monospace;
  --op-product-weight: 600;
  --op-product-tracking: 0.01em;
  --op-umbrella-weight: 700;
  --op-umbrella-tracking: 0.30em;
  --op-headline-weight: 600;
  --op-headline-tracking: 0;
  --op-body-weight: 400;
  --op-body-tracking: 0;
  --op-label-weight: 700;
  --op-label-tracking: 0.18em;
  --op-hud-weight: 500;
  --op-hud-tracking: 0;
}