/* TeraSoft — generated from design-system/tokens.json by tools/build.py. Do not edit by hand. */

:root {
  --color\.yellow\.100: #FFF8D6;
  --color\.yellow\.200: #FFEEA3;
  --color\.yellow\.300: #FFE266;
  --color\.yellow\.400: #FFD633;
  --color\.yellow\.500: #FFCC00;
  --color\.yellow\.600: #EBBB00;
  --color\.yellow\.700: #B88F00;
  --color\.yellow\.800: #7A5E00;
  --color\.yellow\.900: #4A3900;
  --color\.graphite\.100: #E9ECF2;
  --color\.graphite\.200: #CDD3DE;
  --color\.graphite\.300: #A3ACBD;
  --color\.graphite\.400: #75809A;
  --color\.graphite\.500: #525D78;
  --color\.graphite\.600: #3B4459;
  --color\.graphite\.700: #2A3142;
  --color\.graphite\.800: #1C212D;
  --color\.graphite\.900: #12151C;
  --color\.gray\.0: #FFFFFF;
  --color\.gray\.50: #FAFAFB;
  --color\.gray\.100: #F4F5F6;
  --color\.gray\.200: #E6E7EA;
  --color\.gray\.300: #D2D4D9;
  --color\.gray\.400: #A6A9B0;
  --color\.gray\.500: #71757E;
  --color\.gray\.600: #585C64;
  --color\.gray\.700: #43464D;
  --color\.gray\.800: #2B2D32;
  --color\.gray\.900: #1A1B1F;
  --color\.green\.100: #E3F5EA;
  --color\.green\.200: #B9E6C9;
  --color\.green\.300: #7FD39F;
  --color\.green\.400: #45B874;
  --color\.green\.500: #1F9D55;
  --color\.green\.600: #17844A;
  --color\.green\.700: #116A3B;
  --color\.green\.800: #0C512D;
  --color\.green\.900: #07361E;
  --color\.orange\.100: #FFF0E0;
  --color\.orange\.200: #FFD9B0;
  --color\.orange\.300: #FFBD78;
  --color\.orange\.400: #FF9B3D;
  --color\.orange\.500: #F07B0F;
  --color\.orange\.600: #C8630A;
  --color\.orange\.700: #9E4D08;
  --color\.orange\.800: #773A06;
  --color\.orange\.900: #4E2604;
  --color\.red\.100: #FDE8E8;
  --color\.red\.200: #F9C5C5;
  --color\.red\.300: #F49A9A;
  --color\.red\.400: #EA6363;
  --color\.red\.500: #D92D2D;
  --color\.red\.600: #BA1F1F;
  --color\.red\.700: #971818;
  --color\.red\.800: #731313;
  --color\.red\.900: #4A0C0C;
  --color\.blue\.100: #E6F0FF;
  --color\.blue\.200: #C2D9FF;
  --color\.blue\.300: #90B9FF;
  --color\.blue\.400: #5A92F5;
  --color\.blue\.500: #2F6FE0;
  --color\.blue\.600: #2258C2;
  --color\.blue\.700: #1B4699;
  --color\.blue\.800: #143472;
  --color\.blue\.900: #0C224B;
  --space\.0: 0;
  --space\.1: 4px;
  --space\.2: 8px;
  --space\.3: 12px;
  --space\.4: 16px;
  --space\.5: 20px;
  --space\.6: 24px;
  --space\.8: 32px;
  --space\.10: 40px;
  --space\.12: 48px;
  --space\.16: 64px;
  --space\.20: 80px;
  --space\.24: 96px;
  --space\.xs: 4px;
  --space\.sm: 8px;
  --space\.md: 16px;
  --space\.lg: 24px;
  --space\.xl: 32px;
  --space\.2xl: 48px;
  --space\.3xl: 64px;
  --space\.4xl: 96px;
  --radius\.none: 0;
  --radius\.xs: 4px;
  --radius\.sm: 6px;
  --radius\.md: 8px;
  --radius\.lg: 12px;
  --radius\.xl: 18px;
  --radius\.2xl: 24px;
  --radius\.full: 9999px;
  --size\.control\.sm: 32px;
  --size\.control\.md: 40px;
  --size\.control\.lg: 48px;
  --size\.icon\.sm: 16px;
  --size\.icon\.md: 20px;
  --size\.icon\.lg: 24px;
  --size\.container: 1240px;
  --border\.width\.hairline: 1px;
  --border\.width\.control: 1.5px;
  --border\.width\.focus: 2px;
  --z\.dropdown: 1000;
  --z\.sticky: 1100;
  --z\.overlay: 1300;
  --z\.modal: 1400;
  --z\.toast: 1500;
  --z\.tooltip: 1600;
  --breakpoint\.sm: 560px;
  --breakpoint\.md: 720px;
  --breakpoint\.lg: 1000px;
  --breakpoint\.xl: 1240px;
  --font-sans: "Manrope", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Consolas, monospace;
}

:root, [data-theme="light"] {
  color-scheme: light;
  --color\.bg\.page: var(--color\.gray\.0);
  --color\.bg\.surface: var(--color\.gray\.0);
  --color\.bg\.subtle: var(--color\.gray\.100);
  --color\.bg\.muted: var(--color\.gray\.200);
  --color\.bg\.pressed: var(--color\.gray\.300);
  --color\.bg\.disabled: var(--color\.gray\.100);
  --color\.bg\.inverse: var(--color\.graphite\.900);
  --color\.text\.primary: var(--color\.graphite\.900);
  --color\.text\.secondary: var(--color\.gray\.600);
  --color\.text\.placeholder: var(--color\.gray\.500);
  --color\.text\.disabled: var(--color\.gray\.400);
  --color\.text\.inverse: var(--color\.gray\.0);
  --color\.text\.link: var(--color\.blue\.600);
  --color\.text\.link-hover: var(--color\.blue\.700);
  --color\.brand\.primary: var(--color\.yellow\.500);
  --color\.brand\.primary-hover: var(--color\.yellow\.600);
  --color\.brand\.primary-active: var(--color\.yellow\.700);
  --color\.brand\.on-primary: var(--color\.graphite\.900);
  --color\.brand\.subtle: var(--color\.yellow\.100);
  --color\.brand\.text: var(--color\.yellow\.800);
  --color\.secondary\.default: var(--color\.graphite\.900);
  --color\.secondary\.hover: var(--color\.graphite\.700);
  --color\.secondary\.active: var(--color\.graphite\.600);
  --color\.secondary\.on: var(--color\.gray\.0);
  --color\.border\.subtle: var(--color\.gray\.200);
  --color\.border\.default: var(--color\.gray\.300);
  --color\.border\.control: var(--color\.gray\.500);
  --color\.border\.control-hover: var(--color\.graphite\.900);
  --color\.border\.strong: var(--color\.graphite\.900);
  --color\.focus\.ring: var(--color\.graphite\.900);
  --color\.focus\.halo: var(--color\.yellow\.300);
  --color\.control\.checked: var(--color\.yellow\.500);
  --color\.control\.checked-border: var(--color\.graphite\.900);
  --color\.control\.on-checked: var(--color\.graphite\.900);
  --color\.success\.text: var(--color\.green\.700);
  --color\.success\.bg: var(--color\.green\.100);
  --color\.success\.border: var(--color\.green\.300);
  --color\.success\.solid: var(--color\.green\.600);
  --color\.success\.on-solid: var(--color\.gray\.0);
  --color\.warning\.text: var(--color\.orange\.800);
  --color\.warning\.bg: var(--color\.orange\.100);
  --color\.warning\.border: var(--color\.orange\.300);
  --color\.warning\.solid: var(--color\.orange\.500);
  --color\.warning\.on-solid: var(--color\.graphite\.900);
  --color\.error\.text: var(--color\.red\.700);
  --color\.error\.bg: var(--color\.red\.100);
  --color\.error\.border: var(--color\.red\.600);
  --color\.error\.solid: var(--color\.red\.600);
  --color\.error\.solid-hover: var(--color\.red\.700);
  --color\.error\.on-solid: var(--color\.gray\.0);
  --color\.info\.text: var(--color\.blue\.700);
  --color\.info\.bg: var(--color\.blue\.100);
  --color\.info\.border: var(--color\.blue\.300);
  --color\.info\.solid: var(--color\.blue\.600);
  --color\.info\.on-solid: var(--color\.gray\.0);
  --shadow\.xs: 0 1px 2px #12151C0F;
  --shadow\.sm: 0 1px 2px #12151C0A, 0 4px 12px -4px #12151C1F;
  --shadow\.md: 0 2px 4px #12151C0A, 0 12px 24px -8px #12151C29;
  --shadow\.lg: 0 2px 4px #12151C0A, 0 24px 60px -16px #12151C38;
  --shadow\.focus: 0 0 0 2px #FFFFFF, 0 0 0 4px #12151C;
}

[data-theme="dark"] {
  color-scheme: dark;
  --color\.bg\.page: var(--color\.graphite\.900);
  --color\.bg\.surface: var(--color\.graphite\.800);
  --color\.bg\.subtle: var(--color\.graphite\.800);
  --color\.bg\.muted: var(--color\.graphite\.700);
  --color\.bg\.pressed: var(--color\.graphite\.600);
  --color\.bg\.disabled: var(--color\.graphite\.800);
  --color\.bg\.inverse: var(--color\.gray\.100);
  --color\.text\.primary: var(--color\.gray\.100);
  --color\.text\.secondary: var(--color\.gray\.400);
  --color\.text\.placeholder: var(--color\.gray\.400);
  --color\.text\.disabled: var(--color\.gray\.600);
  --color\.text\.inverse: var(--color\.graphite\.900);
  --color\.text\.link: var(--color\.blue\.300);
  --color\.text\.link-hover: var(--color\.blue\.200);
  --color\.brand\.primary: var(--color\.yellow\.500);
  --color\.brand\.primary-hover: var(--color\.yellow\.400);
  --color\.brand\.primary-active: var(--color\.yellow\.600);
  --color\.brand\.on-primary: var(--color\.graphite\.900);
  --color\.brand\.subtle: var(--color\.yellow\.900);
  --color\.brand\.text: var(--color\.yellow\.400);
  --color\.secondary\.default: var(--color\.gray\.100);
  --color\.secondary\.hover: var(--color\.gray\.300);
  --color\.secondary\.active: var(--color\.gray\.400);
  --color\.secondary\.on: var(--color\.graphite\.900);
  --color\.border\.subtle: var(--color\.graphite\.700);
  --color\.border\.default: var(--color\.graphite\.600);
  --color\.border\.control: var(--color\.gray\.500);
  --color\.border\.control-hover: var(--color\.gray\.300);
  --color\.border\.strong: var(--color\.gray\.100);
  --color\.focus\.ring: var(--color\.yellow\.400);
  --color\.focus\.halo: var(--color\.yellow\.700);
  --color\.control\.checked: var(--color\.yellow\.500);
  --color\.control\.checked-border: var(--color\.yellow\.500);
  --color\.control\.on-checked: var(--color\.graphite\.900);
  --color\.success\.text: var(--color\.green\.300);
  --color\.success\.bg: var(--color\.green\.900);
  --color\.success\.border: var(--color\.green\.700);
  --color\.success\.solid: var(--color\.green\.400);
  --color\.success\.on-solid: var(--color\.graphite\.900);
  --color\.warning\.text: var(--color\.orange\.300);
  --color\.warning\.bg: var(--color\.orange\.900);
  --color\.warning\.border: var(--color\.orange\.700);
  --color\.warning\.solid: var(--color\.orange\.400);
  --color\.warning\.on-solid: var(--color\.graphite\.900);
  --color\.error\.text: var(--color\.red\.300);
  --color\.error\.bg: var(--color\.red\.900);
  --color\.error\.border: var(--color\.red\.400);
  --color\.error\.solid: var(--color\.red\.400);
  --color\.error\.solid-hover: var(--color\.red\.300);
  --color\.error\.on-solid: var(--color\.graphite\.900);
  --color\.info\.text: var(--color\.blue\.300);
  --color\.info\.bg: var(--color\.blue\.900);
  --color\.info\.border: var(--color\.blue\.700);
  --color\.info\.solid: var(--color\.blue\.400);
  --color\.info\.on-solid: var(--color\.graphite\.900);
  --shadow\.xs: 0 1px 2px #00000066;
  --shadow\.sm: 0 1px 3px #00000099;
  --shadow\.md: 0 8px 24px -6px #000000B3;
  --shadow\.lg: 0 24px 60px -16px #000000CC;
  --shadow\.focus: 0 0 0 2px #12151C, 0 0 0 4px #FFD633;
}

.display\.xl { font-family: var(--font-sans); font-size: 56px; line-height: 64px; font-weight: 800; letter-spacing: -0.03em; }
.display\.lg { font-family: var(--font-sans); font-size: 44px; line-height: 52px; font-weight: 800; letter-spacing: -0.025em; }
.heading\.h1 { font-family: var(--font-sans); font-size: 36px; line-height: 44px; font-weight: 800; letter-spacing: -0.02em; }
.heading\.h2 { font-family: var(--font-sans); font-size: 28px; line-height: 36px; font-weight: 800; letter-spacing: -0.02em; }
.heading\.h3 { font-family: var(--font-sans); font-size: 22px; line-height: 30px; font-weight: 700; letter-spacing: -0.01em; }
.heading\.h4 { font-family: var(--font-sans); font-size: 18px; line-height: 26px; font-weight: 700; letter-spacing: -0.005em; }
.body\.lg { font-family: var(--font-sans); font-size: 18px; line-height: 28px; font-weight: 400; }
.body\.md { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; }
.body\.sm { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }
.label\.lg { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 700; }
.label\.md { font-family: var(--font-sans); font-size: 15px; line-height: 20px; font-weight: 700; }
.label\.sm { font-family: var(--font-sans); font-size: 13px; line-height: 16px; font-weight: 700; letter-spacing: 0.01em; }
.overline { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 800; letter-spacing: 0.1em; }
.caption { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.01em; }
.code\.md { font-family: var(--font-mono); font-size: 14px; line-height: 20px; font-weight: 400; }