/* Atom Training — generated from tokens.json */
:root, [data-theme="dark"] {
  --black: #000000;
  --mint: #53E3A8;
  --mint-100: #D3F8E8;
  --mint-300: #7EEABD;
  --mint-500: #2FCB8D;
  --mint-700: #0B6E47;
  --mint-900: #0C2B20;
  --teal: #26C8AD;
  --white: #FFFFFF;
  --graphite-950: #0B100E;
  --graphite-900: #131A17;
  --graphite-850: #1A2320;
  --graphite-800: #26312C;
  --graphite-600: #5E6C66;
  --graphite-550: #66746E;
  --graphite-500: #7D8B85;
  --graphite-400: #8A9892;
  --graphite-200: #D5DDD9;
  --graphite-100: #EBF0ED;
  --graphite-50: #F5F8F6;
  --flare: #F0404F;
  --coral: #FF5A5F;
  --coral-100: #FFE3E4;
  --coral-700: #B32834;
  --coral-900: #331516;
  --amber: #FFC24B;
  --amber-100: #FFF1D6;
  --amber-700: #7A4F00;
  --amber-900: #2E2410;
  --bg: var(--black);
  --surface: var(--graphite-950);
  --surface-raised: var(--graphite-900);
  --well: var(--graphite-850);
  --line: var(--graphite-800);
  --line-strong: var(--graphite-550);
  --ink: var(--white);
  --ink-2: var(--graphite-200);
  --ink-muted: var(--graphite-400);
  --accent: var(--mint);
  --accent-hover: var(--mint-300);
  --accent-pressed: var(--mint-500);
  --on-accent: var(--black);
  --accent-ink: var(--mint);
  --accent-soft: var(--mint-900);
  --focus: var(--mint);
  --orbit: #53e3a84d;
  --scrim: #00000099;
  --success: var(--mint);
  --warning: var(--amber);
  --warning-soft: var(--amber-900);
  --danger: var(--coral);
  --danger-soft: var(--coral-900);
  --work: var(--mint);
  --on-work: var(--black);
  --rest: var(--graphite-950);
  --on-rest: var(--mint);
  --hot: var(--flare);
  --on-hot: var(--black);
  --shadow-pop: 0 12px 32px -4px #000000cc;
  --focus-ring: 0 0 0 2px #000000, 0 0 0 4px #53e3a8;
}
[data-theme="light"] {
  --bg: var(--graphite-50);
  --surface: var(--white);
  --surface-raised: var(--white);
  --well: var(--graphite-100);
  --line: var(--graphite-200);
  --line-strong: var(--graphite-500);
  --ink: var(--black);
  --ink-2: var(--graphite-800);
  --ink-muted: var(--graphite-600);
  --accent: var(--mint);
  --accent-hover: var(--mint-300);
  --accent-pressed: var(--mint-500);
  --on-accent: var(--black);
  --accent-ink: var(--mint-700);
  --accent-soft: var(--mint-100);
  --focus: var(--mint-700);
  --orbit: #0b6e4740;
  --scrim: #00000099;
  --success: var(--mint-700);
  --warning: var(--amber-700);
  --warning-soft: var(--amber-100);
  --danger: var(--coral-700);
  --danger-soft: var(--coral-100);
  --work: var(--mint);
  --on-work: var(--black);
  --rest: var(--graphite-950);
  --on-rest: var(--mint);
  --hot: var(--flare);
  --on-hot: var(--black);
  --shadow-pop: 0 8px 24px -6px #0b100e33, 0 2px 6px #0b100e14;
  --focus-ring: 0 0 0 2px #f5f8f6, 0 0 0 4px #0b6e47;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-full: 9999px;
  --size-tap: 48px;
  --size-control: 48px;
  --size-control-lg: 56px;
  --size-cta: 64px;
  --size-tabbar: 64px;
  --size-icon: 24px;
  --size-content: 640px;
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-step: 320ms;
  --dur-leap: 640ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-leap: cubic-bezier(0.34, 1.56, 0.64, 1);
  --font-display: Unbounded, "Arial Black", system-ui, sans-serif;
  --font-text: Geologica, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.display-xl { font-family: var(--font-display); font-size: 56px; line-height: 56px; font-weight: 800; letter-spacing: -0.02em; }
.display-l { font-family: var(--font-display); font-size: 40px; line-height: 44px; font-weight: 800; letter-spacing: -0.015em; }
.display-m { font-family: var(--font-display); font-size: 28px; line-height: 32px; font-weight: 700; letter-spacing: -0.01em; }
.display-s { font-family: var(--font-display); font-size: 20px; line-height: 24px; font-weight: 700; }
.label { font-family: var(--font-display); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: 0.08em; }
.num-hero { font-family: var(--font-display); font-size: 160px; line-height: 1; font-weight: 800; letter-spacing: -0.03em; }
.num-l { font-family: var(--font-display); font-size: 40px; line-height: 44px; font-weight: 700; letter-spacing: -0.01em; }
.num-m { font-family: var(--font-display); font-size: 24px; line-height: 28px; font-weight: 700; }
.title { font-family: var(--font-text); font-size: 20px; line-height: 26px; font-weight: 700; }
.body-l { font-family: var(--font-text); font-size: 18px; line-height: 27px; font-weight: 400; }
.body { font-family: var(--font-text); font-size: 16px; line-height: 24px; font-weight: 400; }
.button { font-family: var(--font-text); font-size: 16px; line-height: 20px; font-weight: 600; }
.small { font-family: var(--font-text); font-size: 14px; line-height: 20px; font-weight: 400; }
.caption { font-family: var(--font-text); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.01em; }
.slant { font-family: var(--font-text); font-size: 18px; line-height: 24px; font-weight: 700; }
@font-face { font-family: "Unbounded"; src: url("fonts/Unbounded-Variable.woff2") format("woff2"); font-weight: 200 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Geologica"; src: url("fonts/Geologica-Variable.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }