/* Generated by scripts/build-tokens.mjs from design/tokens.json — do not edit by hand. */
@layer tokens, base, motion, layout, components, pages, utilities;
@layer tokens {
  :root {
    --ttm-white: #FFFFFF;
    --ttm-black: #080909;
    --ttm-grey-600: #5A5D73;
    --ttm-grey-200: #E7E7EE;
    --ttm-sunshine: #FFD24A;
    --ttm-butter: #FAED8F;
    --ttm-yellow: #FFF302;
    --ttm-orange: #F9A220;
    --ttm-magenta: #FD48F2;
    --ttm-blush: #FFDBFD;
    --ttm-hotpink: #FF008C;
    --ttm-hotpink-700: #D1006F;
    --ttm-aqua: #A4F6F8;
    --ttm-cyan: #1CE8ED;
    --ttm-ice: #DDFCFC;
    --ttm-lavender: #9982DE;
    --ttm-lavender-300: #C9BCF2;
    --ttm-indigo: #3B308F;
    --ttm-navy: #0B2044;
    --ttm-navy-surface: #142B57;
    --ttm-navy-deep: #050E22;
    --ttm-lime: #E6FF2B;
    --ttm-forest: #284334;
    --ttm-green-700: #137E1C;
    --ttm-amber-800: #8A5300;
    --ttm-red-700: #C4004E;
    --ttm-violet-700: #6B2FA3;
    --color-bg: var(--ttm-white);
    --color-surface: var(--ttm-white);
    --color-surface-alt: var(--ttm-butter);
    --color-text: var(--ttm-black);
    --color-text-muted: var(--ttm-grey-600);
    --color-border: var(--ttm-grey-200);
    --color-control-border: var(--ttm-grey-600);
    --color-primary: var(--ttm-hotpink);
    --color-on-primary: var(--ttm-black);
    --color-primary-hover: var(--ttm-indigo);
    --color-on-primary-hover: var(--ttm-white);
    --color-primary-strong: var(--ttm-indigo);
    --color-accent: var(--ttm-indigo);
    --color-highlight: var(--ttm-magenta);
    --color-on-highlight: var(--ttm-black);
    --color-highlight-alt: var(--ttm-yellow);
    --color-hero: var(--ttm-sunshine);
    --color-on-hero: var(--ttm-black);
    --field-sunshine: var(--ttm-sunshine);
    --field-butter: var(--ttm-butter);
    --field-magenta: var(--ttm-magenta);
    --field-aqua: var(--ttm-aqua);
    --field-cyan: var(--ttm-cyan);
    --field-lavender: var(--ttm-lavender);
    --field-blush: var(--ttm-blush);
    --field-orange: var(--ttm-orange);
    --field-lime: var(--ttm-lime);
    --color-success: var(--ttm-green-700);
    --color-warning: var(--ttm-amber-800);
    --color-error: var(--ttm-red-700);
    --color-trap: var(--ttm-red-700);
    --color-link: var(--ttm-indigo);
    --color-link-visited: var(--ttm-violet-700);
    --color-focus: var(--ttm-indigo);
    --color-band: var(--ttm-indigo);
    --color-on-band: var(--ttm-white);
    --color-footer: var(--ttm-navy);
    --color-on-footer: var(--ttm-white);
    --color-footer-muted: #B8B6D6;
    --color-rule-line: rgb(59 48 143 / 0.12);
    --color-scrim: rgb(11 32 68 / 0.55);
    --font-display: "Dela Gothic One", "Manrope", system-ui, sans-serif;
    --font-text: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --font-hand: "Caveat", "Manrope", cursive;
    --fs-mega: clamp(2.375rem, 0.9rem + 6.6vw, 7.375rem);
    --fs-display: clamp(2.5rem, 1.5rem + 4.4vw, 5.5rem);
    --fs-h1: clamp(2rem, 1.45rem + 2.4vw, 3.5rem);
    --fs-h2: clamp(1.625rem, 1.3rem + 1.4vw, 2.5rem);
    --fs-h3: clamp(1.1875rem, 1.12rem + 0.3vw, 1.375rem);
    --fs-lead: clamp(1.125rem, 1.03rem + 0.45vw, 1.375rem);
    --fs-body: clamp(1.0625rem, 1.04rem + 0.11vw, 1.125rem);
    --fs-small: 0.875rem;
    --fs-label: 1rem;
    --fs-eyebrow: 0.8125rem;
    --fs-table: 0.9375rem;
    --fs-hand: clamp(1.375rem, 1.2rem + 0.8vw, 1.875rem);
    --lh-mega: 0.92;
    --lh-display: 1.05;
    --lh-heading: 1.15;
    --lh-body: 1.7;
    --lh-small: 1.5;
    --fw-light: 300;
    --fw-regular: 400;
    --fw-semibold: 600;
    --fw-bold: 700;
    --fw-heavy: 800;
    --tracking-display: -0.01em;
    --tracking-eyebrow: 0.12em;
    --measure: 70ch;
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;
    --space-9: 6rem;
    --space-10: 8rem;
    --section-y: clamp(3.5rem, 2rem + 6vw, 6rem);
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-xl: 24px;
    --radius-pill: 999px;
    --shadow-1: 0 1px 2px rgb(22 33 58 / 0.06);
    --shadow-2: 0 8px 24px rgb(22 33 58 / 0.08);
    --shadow-3: 0 20px 40px -20px rgb(11 32 68 / 0.5);
    --container-max: 75rem;
    --gutter: 1rem;
    --target-min: 44px;
    --focus-width: 3px;
    --focus-offset: 2px;
    --icon-sm: 18px;
    --icon-md: 24px;
    --dur-fast: 150ms;
    --dur-base: 250ms;
    --dur-slow: 400ms;
    --dur-reveal: 600ms;
    --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
    --ease-out: cubic-bezier(0.2, 0, 0, 1);
    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --reveal-distance: 14px;
    --stagger: 60ms;
    --z-float: 1;
    --z-content: 2;
    --z-header: 100;
    --z-overlay: 200;
    --z-modal: 300;
    --z-toast: 400;
    --focus-ring: var(--focus-width) solid var(--color-focus);
    color-scheme: light;
  }
  @media (min-width: 600px) { :root { --gutter: 1.5rem; } }
  @media (min-width: 900px) { :root { --gutter: 2rem; } }

  /* Dark — explicit choice, or the system preference unless light was chosen ("Aardvark night") */
  :root[data-theme="dark"] {
    --color-bg: var(--ttm-navy);
    --color-surface: var(--ttm-navy-surface);
    --color-surface-alt: #1B3466;
    --color-text: #EDEBFF;
    --color-text-muted: #B8B6D6;
    --color-border: #2B3F70;
    --color-control-border: #8A93C0;
    --color-primary: var(--ttm-hotpink);
    --color-on-primary: var(--ttm-black);
    --color-primary-hover: var(--ttm-sunshine);
    --color-on-primary-hover: var(--ttm-black);
    --color-primary-strong: #B8A9F0;
    --color-accent: #B8A9F0;
    --color-highlight: var(--ttm-yellow);
    --color-on-highlight: var(--ttm-black);
    --color-highlight-alt: var(--ttm-yellow);
    --color-hero: var(--ttm-indigo);
    --color-on-hero: var(--ttm-white);
    --field-lavender: var(--ttm-lavender-300);
    --color-link: #B8A9F0;
    --color-link-visited: #E3B8F5;
    --color-focus: var(--ttm-sunshine);
    --color-band: var(--ttm-navy-surface);
    --color-on-band: var(--ttm-white);
    --color-footer: var(--ttm-navy-deep);
    --color-on-footer: var(--ttm-white);
    --color-success: #6FD08A;
    --color-warning: var(--ttm-sunshine);
    --color-error: #FF7AA8;
    --color-trap: #FF7AA8;
    --color-rule-line: rgb(184 169 240 / 0.12);
    --color-scrim: rgb(5 14 34 / 0.7);
    color-scheme: dark;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      --color-bg: var(--ttm-navy);
      --color-surface: var(--ttm-navy-surface);
      --color-surface-alt: #1B3466;
      --color-text: #EDEBFF;
      --color-text-muted: #B8B6D6;
      --color-border: #2B3F70;
      --color-control-border: #8A93C0;
      --color-primary: var(--ttm-hotpink);
      --color-on-primary: var(--ttm-black);
      --color-primary-hover: var(--ttm-sunshine);
      --color-on-primary-hover: var(--ttm-black);
      --color-primary-strong: #B8A9F0;
      --color-accent: #B8A9F0;
      --color-highlight: var(--ttm-yellow);
      --color-on-highlight: var(--ttm-black);
      --color-highlight-alt: var(--ttm-yellow);
      --color-hero: var(--ttm-indigo);
      --color-on-hero: var(--ttm-white);
      --field-lavender: var(--ttm-lavender-300);
      --color-link: #B8A9F0;
      --color-link-visited: #E3B8F5;
      --color-focus: var(--ttm-sunshine);
      --color-band: var(--ttm-navy-surface);
      --color-on-band: var(--ttm-white);
      --color-footer: var(--ttm-navy-deep);
      --color-on-footer: var(--ttm-white);
      --color-success: #6FD08A;
      --color-warning: var(--ttm-sunshine);
      --color-error: #FF7AA8;
      --color-trap: #FF7AA8;
      --color-rule-line: rgb(184 169 240 / 0.12);
      --color-scrim: rgb(5 14 34 / 0.7);
      color-scheme: dark;
    }
  }

  /* High contrast */
  :root[data-contrast="high"] {
    --color-bg: #FFFFFF;
    --color-surface: #FFFFFF;
    --color-surface-alt: #FFFFFF;
    --color-hero: #FFFFFF;
    --color-on-hero: #000000;
    --color-text: #000000;
    --color-text-muted: #1F1F1F;
    --color-border: #000000;
    --color-control-border: #000000;
    --color-primary: #000000;
    --color-on-primary: #FFFFFF;
    --color-primary-hover: #2A1F7A;
    --color-on-primary-hover: #FFFFFF;
    --color-link: #2A1F7A;
    --color-accent: #2A1F7A;
    --color-primary-strong: #2A1F7A;
    --color-focus: #000000;
    --color-band: #000000;
    --color-on-band: #FFFFFF;
    --color-footer: #000000;
    --field-sunshine: #FFFFFF;
    --field-butter: #FFFFFF;
    --field-magenta: #FFFFFF;
    --field-aqua: #FFFFFF;
    --field-cyan: #FFFFFF;
    --field-lavender: #FFFFFF;
    --field-blush: #FFFFFF;
    --field-orange: #FFFFFF;
    --field-lime: #FFFFFF;
    --color-rule-line: transparent;
    --focus-width: 4px;
  }
  :root[data-contrast="high"][data-theme="dark"] {
    --color-bg: #000000;
    --color-surface: #000000;
    --color-surface-alt: #000000;
    --color-hero: #000000;
    --color-on-hero: #FFFFFF;
    --color-text: #FFFFFF;
    --color-text-muted: #E6E6E6;
    --color-border: #FFFFFF;
    --color-control-border: #FFFFFF;
    --color-primary: #FFFFFF;
    --color-on-primary: #000000;
    --color-primary-hover: #FFF302;
    --color-on-primary-hover: #000000;
    --color-link: #FFF302;
    --color-accent: #FFF302;
    --color-primary-strong: #FFF302;
    --color-focus: #FFF302;
    --color-band: #000000;
    --color-footer: #000000;
  }
  @media (prefers-color-scheme: dark) {
    :root[data-contrast="high"]:not([data-theme="light"]) {
      --color-bg: #000000;
      --color-surface: #000000;
      --color-surface-alt: #000000;
      --color-hero: #000000;
      --color-on-hero: #FFFFFF;
      --color-text: #FFFFFF;
      --color-text-muted: #E6E6E6;
      --color-border: #FFFFFF;
      --color-control-border: #FFFFFF;
      --color-primary: #FFFFFF;
      --color-on-primary: #000000;
      --color-primary-hover: #FFF302;
      --color-on-primary-hover: #000000;
      --color-link: #FFF302;
      --color-accent: #FFF302;
      --color-primary-strong: #FFF302;
      --color-focus: #FFF302;
      --color-band: #000000;
      --color-footer: #000000;
    }
  }
  :root[data-text="large"] { font-size: 112.5%; }
}
