/* one above games — generated from tokens.json by scripts/build-tokens.mjs. Do not edit. */

/* Fonts: self-hosted, never loaded from Google (no consent banner needed). */
@font-face {
  font-family: "Rajdhani";
  src: url("./fonts/Rajdhani-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Rajdhani";
  src: url("./fonts/Rajdhani-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Rajdhani";
  src: url("./fonts/Rajdhani-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Rajdhani";
  src: url("./fonts/Rajdhani-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Figtree";
  src: url("./fonts/Figtree-Variable.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Martian Mono";
  src: url("./fonts/MartianMono-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Theme "dark" is the default. Set data-theme="<id>" on <html> to switch. */
:root,
[data-theme="dark"] {
  --ground: #1f3136;
  --surface-sunken: #18262a;
  --surface: #324348;
  --surface-hover: #46555a;
  --line: #46555a;
  --line-strong: #5b696d;
  --line-hover: #717d80;
  --ink: #ffffff;
  --ink-muted: #a9b6b9;
  --accent: #aceb45;
  --accent-hover: #b4ee60;
  --accent-ink: #aceb45;
  --accent-soft: #aceb4524;
  --on-accent: #14210a;
  --alert: #ff8080;
  --alert-ink: #ffabab;
  --on-alert: #2a0f14;
  --warning: #ffbc5e;
  --warning-ink: #ffd395;
  --success: #5ee08a;
  --premium: #ffd76a;
  --shadow-rest: 0 1px 2px #00000047, 0 8px 24px -14px #000000b3;
  --shadow-lift: 0 2px 4px #0000004d, 0 26px 54px -26px #000000d9;
  --shadow-overlay: 0 2px 4px #0000004d, 0 36px 72px -30px #000000e6;
}
[data-theme="light"] {
  --ground: #f4f7f2;
  --surface-sunken: #e9eee6;
  --surface: #ffffff;
  --surface-hover: #eef2ea;
  --line: #d5ddd2;
  --line-strong: #84937f;
  --line-hover: #6b7a68;
  --ink: #18262a;
  --ink-muted: #56666a;
  --accent-hover: #9bd93a;
  --accent-ink: #3a7310;
  --accent-soft: #aceb4540;
  --alert: #c42e5f;
  --alert-ink: #a3234d;
  --on-alert: #ffffff;
  --warning: #f59e0b;
  --warning-ink: #8a4b00;
  --success: #1d7a43;
  --premium: #c99a1e;
  --shadow-rest: 0 1px 2px #18262a14, 0 8px 24px -14px #18262a33;
  --shadow-lift: 0 2px 4px #18262a14, 0 26px 54px -26px #18262a59;
  --shadow-overlay: 0 2px 4px #18262a1a, 0 36px 72px -30px #18262a66;
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-7: 28px;
  --space-10: 40px;
  --space-16: 64px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-xl: 16px;
  --radius-pill: 999px;
  --font-display: "Rajdhani", system-ui, sans-serif;
  --font-body: "Figtree", system-ui, sans-serif;
  --font-mono: "Martian Mono", ui-monospace, monospace;
}

/* Type styles: class="text-<name>" */
.text-display-xl { font-family: var(--font-display); font-size: 56px; line-height: 1; font-weight: 700; letter-spacing: -0.56px; }
.text-heading-lg { font-family: var(--font-display); font-size: 32px; line-height: 1.1; font-weight: 700; letter-spacing: -0.32px; }
.text-heading-md { font-family: var(--font-display); font-size: 24px; line-height: 1.15; font-weight: 600; letter-spacing: -0.24px; }
.text-heading-sm { font-family: var(--font-display); font-size: 18px; line-height: 1.2; font-weight: 600; }
.text-eyebrow { font-family: var(--font-display); font-size: 11px; line-height: 1.4; font-weight: 600; letter-spacing: 0.66px; text-transform: uppercase; }
.text-button { font-family: var(--font-display); font-size: 16px; line-height: 1.25; font-weight: 600; }
.text-wordmark { font-family: var(--font-display); font-size: 22px; line-height: 1; font-weight: 400; letter-spacing: -0.22px; }
.text-body-lg { font-family: var(--font-body); font-size: 17px; line-height: 1.55; font-weight: 400; }
.text-body { font-family: var(--font-body); font-size: 15px; line-height: 1.55; font-weight: 400; }
.text-label { font-family: var(--font-body); font-size: 13px; line-height: 1.4; font-weight: 500; }
.text-small { font-family: var(--font-body); font-size: 13px; line-height: 1.4; font-weight: 400; }
.text-mono { font-family: var(--font-mono); font-size: 12px; line-height: 1.5; font-weight: 400; }