/* Iron Temple design tokens. The only place raw colours, fonts and scales live. */

@font-face {
  font-family: "Big Shoulders Display";
  src: url("fonts/big-shoulders-display.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Zilla Slab";
  src: url("fonts/zilla-slab.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("fonts/inter.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  color-scheme: dark;

  /* Colour: iron, ivory, oxblood for choice, brass for wins */
  --color-bg: #0b0a09;
  --color-glow: #1d1814;
  --color-surface: #12100e;
  --color-surface-2: #1a1613;
  --color-ink: #ece6da;
  --color-ink-muted: #8c8172;
  --color-line: #2a241f;
  --color-line-strong: #3a322a;
  --color-select: #7a1f1c;
  --color-select-ink: #ece6da;
  --color-win: #b08d4c;
  --color-win-strong: #c9a35a;
  --color-win-bright: #d9b46a;
  --color-win-ink: #0b0a09;
  --color-win-fade: #6b5530;
  --color-scrim: #000000b3;
  --color-shadow: #00000080;

  /* Type */
  --font-display: "Big Shoulders Display", "Arial Narrow", sans-serif;
  --font-number: "Zilla Slab", Georgia, serif;
  --font-text: "Inter", system-ui, sans-serif;
  --size-xs: 0.68rem;
  --size-sm: 0.8rem;
  --size-md: 0.95rem;
  --size-lg: 1.15rem;
  --size-xl: 1.5rem;
  --size-2xl: 1.85rem;
  --size-display: 3rem;
  --tracking-label: 0.18em;
  --tracking-display: 0.02em;

  /* Space, shape, touch */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --radius-0: 0;
  --radius-1: 2px;
  --border: 1px solid var(--color-line-strong);
  --border-soft: 1px solid var(--color-line);
  --tap-min: 44px;
  --shadow-sheet: 0 -12px 40px var(--color-shadow);

  /* Texture and brand: subtle iron grain, engraved rules, the plate seal */
  --texture-grain: url("brand/grain.png");
  --texture-grain-size: 128px 128px;
  --color-engrave-light: #ffffff0d;
  --seal-size: 36px;
}