/* Generated from tokens/tokens.json by scripts/sync_tokens.py.
   Do not edit by hand. Regenerate with: python3 scripts/sync_tokens.py
   Light scheme by default; dark follows prefers-color-scheme unless the
   page toggle sets data-theme on <html>. */

:root {
  --gt-brand: #009999;
  --gt-interactive: #007A7A;
  --gt-on-interactive: #FFFFFF;
  --gt-font-text: "Inter Variable", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --gt-font-code: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --gt-navbar-height: 81px;
  --gt-logo-height: 72px;
  --gt-button-height: 2.5rem;
  --gt-button-px: 1rem;
  --gt-button-font-size: 0.875rem;
  --gt-button-line-height: 1.25rem;
  --gt-radius-none: 0;
  --gt-radius-2xs: 0.0625rem;
  --gt-radius-xs: 0.125rem;
  --gt-radius-sm: 0.25rem;
  --gt-radius-md: 0.375rem;
  --gt-radius-lg: 0.5rem;
  --gt-radius-xl: 0.75rem;
  --gt-radius-2xl: 1rem;
  --gt-radius-3xl: 1.5rem;
  --gt-radius-4xl: 2rem;
  --gt-radius-full: 9999px;
  --gt-radius-l1: 0.125rem;
  --gt-radius-l2: 0.25rem;
  --gt-radius-l3: 0.375rem;
  --gt-space-0-5: 0.125rem;
  --gt-space-1: 0.25rem;
  --gt-space-1-5: 0.375rem;
  --gt-space-2: 0.5rem;
  --gt-space-2-5: 0.625rem;
  --gt-space-3: 0.75rem;
  --gt-space-3-5: 0.875rem;
  --gt-space-4: 1rem;
  --gt-space-4-5: 1.125rem;
  --gt-space-5: 1.25rem;
  --gt-space-6: 1.5rem;
  --gt-space-7: 1.75rem;
  --gt-space-8: 2rem;
  --gt-space-9: 2.25rem;
  --gt-space-10: 2.5rem;
  --gt-space-11: 2.75rem;
  --gt-space-12: 3rem;
  --gt-space-14: 3.5rem;
  --gt-space-16: 4rem;
  --gt-space-20: 5rem;
  --gt-space-24: 6rem;
  --gt-space-28: 7rem;
  --gt-space-32: 8rem;
  --gt-space-36: 9rem;
  --gt-space-40: 10rem;
  --gt-space-44: 11rem;
  --gt-space-48: 12rem;
  --gt-space-52: 13rem;
  --gt-space-56: 14rem;
  --gt-space-60: 15rem;
  --gt-space-64: 16rem;
  --gt-space-72: 18rem;
  --gt-space-80: 20rem;
  --gt-space-96: 24rem;
}

:root {
  color-scheme: light;
  --gt-bg: #ffffff;
  --gt-fg: #09090B;
  --gt-muted: #52525b;
  --gt-border: #e4e4e7;
  --gt-card: #ffffff;
  --gt-code-bg: #f4f4f5;
  --gt-header-bg: #f4f4f5;
  --gt-header-fg: #09090B;
  --gt-header-border: #e4e4e7;
  --gt-link: #007A7A;
  --gt-accent: #007A7A;
  --gt-focus: #007A7A;
  --gt-button-bg: #007A7A;
  --gt-button-fg: #FFFFFF;
  --gt-shadow-xs: 0px 1px 2px color-mix(in srgb, #18181b 10%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 20%, transparent);
  --gt-shadow-sm: 0px 2px 4px color-mix(in srgb, #18181b 10%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 30%, transparent);
  --gt-shadow-md: 0px 4px 8px color-mix(in srgb, #18181b 10%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 30%, transparent);
  --gt-shadow-lg: 0px 8px 16px color-mix(in srgb, #18181b 10%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 30%, transparent);
  --gt-shadow-xl: 0px 16px 24px color-mix(in srgb, #18181b 10%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 30%, transparent);
  --gt-shadow-2xl: 0px 24px 40px color-mix(in srgb, #18181b 16%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 30%, transparent);
  --gt-shadow-inner: inset 0 2px 4px 0 color-mix(in srgb, black 5%, transparent);
  --gt-shadow-inset: inset 0 0 0 1px color-mix(in srgb, black 5%, transparent);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --gt-bg: #09090b;
    --gt-fg: #fafafa;
    --gt-muted: #a1a1aa;
    --gt-border: #27272a;
    --gt-card: #18181b;
    --gt-code-bg: #09090b;
    --gt-header-bg: #18181b;
    --gt-header-fg: #fafafa;
    --gt-header-border: #27272a;
    --gt-link: #009999;
    --gt-accent: #009999;
    --gt-focus: #009999;
    --gt-button-bg: #007A7A;
    --gt-button-fg: #FFFFFF;
    --gt-shadow-xs: 0px 1px 1px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 20%, transparent);
    --gt-shadow-sm: 0px 2px 4px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 30%, transparent);
    --gt-shadow-md: 0px 4px 8px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 30%, transparent);
    --gt-shadow-lg: 0px 8px 16px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 30%, transparent);
    --gt-shadow-xl: 0px 16px 24px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 30%, transparent);
    --gt-shadow-2xl: 0px 24px 40px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 30%, transparent);
    --gt-shadow-inner: inset 0 2px 4px 0 black;
    --gt-shadow-inset: inset 0 0 0 1px color-mix(in srgb, #d4d4d8 5%, transparent);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --gt-bg: #09090b;
  --gt-fg: #fafafa;
  --gt-muted: #a1a1aa;
  --gt-border: #27272a;
  --gt-card: #18181b;
  --gt-code-bg: #09090b;
  --gt-header-bg: #18181b;
  --gt-header-fg: #fafafa;
  --gt-header-border: #27272a;
  --gt-link: #009999;
  --gt-accent: #009999;
  --gt-focus: #009999;
  --gt-button-bg: #007A7A;
  --gt-button-fg: #FFFFFF;
  --gt-shadow-xs: 0px 1px 1px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 20%, transparent);
  --gt-shadow-sm: 0px 2px 4px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 30%, transparent);
  --gt-shadow-md: 0px 4px 8px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 30%, transparent);
  --gt-shadow-lg: 0px 8px 16px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 30%, transparent);
  --gt-shadow-xl: 0px 16px 24px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 30%, transparent);
  --gt-shadow-2xl: 0px 24px 40px color-mix(in srgb, black 64%, transparent), 0px 0px 1px inset color-mix(in srgb, #d4d4d8 30%, transparent);
  --gt-shadow-inner: inset 0 2px 4px 0 black;
  --gt-shadow-inset: inset 0 0 0 1px color-mix(in srgb, #d4d4d8 5%, transparent);
}

:root[data-theme="light"] {
  color-scheme: light;
  --gt-bg: #ffffff;
  --gt-fg: #09090B;
  --gt-muted: #52525b;
  --gt-border: #e4e4e7;
  --gt-card: #ffffff;
  --gt-code-bg: #f4f4f5;
  --gt-header-bg: #f4f4f5;
  --gt-header-fg: #09090B;
  --gt-header-border: #e4e4e7;
  --gt-link: #007A7A;
  --gt-accent: #007A7A;
  --gt-focus: #007A7A;
  --gt-button-bg: #007A7A;
  --gt-button-fg: #FFFFFF;
  --gt-shadow-xs: 0px 1px 2px color-mix(in srgb, #18181b 10%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 20%, transparent);
  --gt-shadow-sm: 0px 2px 4px color-mix(in srgb, #18181b 10%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 30%, transparent);
  --gt-shadow-md: 0px 4px 8px color-mix(in srgb, #18181b 10%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 30%, transparent);
  --gt-shadow-lg: 0px 8px 16px color-mix(in srgb, #18181b 10%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 30%, transparent);
  --gt-shadow-xl: 0px 16px 24px color-mix(in srgb, #18181b 10%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 30%, transparent);
  --gt-shadow-2xl: 0px 24px 40px color-mix(in srgb, #18181b 16%, transparent), 0px 0px 1px color-mix(in srgb, #18181b 30%, transparent);
  --gt-shadow-inner: inset 0 2px 4px 0 color-mix(in srgb, black 5%, transparent);
  --gt-shadow-inset: inset 0 0 0 1px color-mix(in srgb, black 5%, transparent);
}