/* Gabster design tokens v1, generated by build-tokens.mjs from tokens.json (9658144e0846). Do not edit by hand.
   Use:  <link rel="stylesheet" href="tokens.css">  then var(--gb-…) and the .gb-… type classes.
   Themes: light (Sand) is the default. data-theme="dark" sets Night on any element; data-theme="auto" follows the OS.
   Roles (--gb-ground, --gb-text, --gb-action…) switch with the theme; palette values (--gb-color-…) never do.
   Every colour also has an -rgb twin (e.g. --gb-text-rgb: 20 20 22) for rgb(var(--gb-text-rgb) / 0.6).
   Reduced motion: every duration becomes 1ms and every delay 0ms, so animations land on their final state. */

@font-face{font-family:"GB Alexandria";src:url("../fonts/Alexandria-wght.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"GB Text";src:url("../fonts/GBArabicText-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"GB Text";src:url("../fonts/GBArabicText-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

:root {
  color-scheme: light;

  /* palette: fixed values */
  --gb-color-indigo: #5869FD;
  --gb-color-indigo-rgb: 88 105 253;
  --gb-color-green: #ADED6B;
  --gb-color-green-rgb: 173 237 107;
  --gb-color-ink: #141416;
  --gb-color-ink-rgb: 20 20 22;
  --gb-color-sand: #F8F7F4;
  --gb-color-sand-rgb: 248 247 244;
  --gb-color-white: #FFFFFF;
  --gb-color-white-rgb: 255 255 255;
  --gb-color-night: #12143A;
  --gb-color-night-rgb: 18 20 58;
  --gb-color-indigo-deep: #2E36A8;
  --gb-color-indigo-deep-rgb: 46 54 168;
  --gb-color-indigo-mist: #ECEEFF;
  --gb-color-indigo-mist-rgb: 236 238 255;
  --gb-color-green-deep: #4E7F1F;
  --gb-color-green-deep-rgb: 78 127 31;
  --gb-color-green-mist: #F1FBE6;
  --gb-color-green-mist-rgb: 241 251 230;
  --gb-color-graphite: #5E5E63;
  --gb-color-graphite-rgb: 94 94 99;
  --gb-color-stone: #D9D7D1;
  --gb-color-stone-rgb: 217 215 209;
  --gb-color-ink-hover: #2B2B30;
  --gb-color-ink-hover-rgb: 43 43 48;
  --gb-color-green-hover: #BDF189;
  --gb-color-green-hover-rgb: 189 241 137;
  --gb-color-night-raised: #232448;
  --gb-color-night-raised-rgb: 35 36 72;
  --gb-color-night-line: #3A3F86;
  --gb-color-night-line-rgb: 58 63 134;
  --gb-color-night-muted: #A9ABCF;
  --gb-color-night-muted-rgb: 169 171 207;

  /* roles: light theme (default) */
  --gb-ground: var(--gb-color-sand);
  --gb-ground-rgb: var(--gb-color-sand-rgb);
  --gb-surface: var(--gb-color-white);
  --gb-surface-rgb: var(--gb-color-white-rgb);
  --gb-surface-inverse: var(--gb-color-ink);
  --gb-surface-inverse-rgb: var(--gb-color-ink-rgb);
  --gb-surface-brand: var(--gb-color-indigo);
  --gb-surface-brand-rgb: var(--gb-color-indigo-rgb);
  --gb-surface-brand-strong: var(--gb-color-indigo-deep);
  --gb-surface-brand-strong-rgb: var(--gb-color-indigo-deep-rgb);
  --gb-surface-ai: var(--gb-color-indigo-mist);
  --gb-surface-ai-rgb: var(--gb-color-indigo-mist-rgb);
  --gb-surface-success: var(--gb-color-green-mist);
  --gb-surface-success-rgb: var(--gb-color-green-mist-rgb);
  --gb-text: var(--gb-color-ink);
  --gb-text-rgb: var(--gb-color-ink-rgb);
  --gb-text-muted: var(--gb-color-graphite);
  --gb-text-muted-rgb: var(--gb-color-graphite-rgb);
  --gb-text-inverse: var(--gb-color-white);
  --gb-text-inverse-rgb: var(--gb-color-white-rgb);
  --gb-text-brand: var(--gb-color-indigo-deep);
  --gb-text-brand-rgb: var(--gb-color-indigo-deep-rgb);
  --gb-text-success: var(--gb-color-green-deep);
  --gb-text-success-rgb: var(--gb-color-green-deep-rgb);
  --gb-text-on-brand: var(--gb-color-white);
  --gb-text-on-brand-rgb: var(--gb-color-white-rgb);
  --gb-brand: var(--gb-color-indigo);
  --gb-brand-rgb: var(--gb-color-indigo-rgb);
  --gb-ai: var(--gb-color-indigo);
  --gb-ai-rgb: var(--gb-color-indigo-rgb);
  --gb-accent: var(--gb-color-green);
  --gb-accent-rgb: var(--gb-color-green-rgb);
  --gb-success: var(--gb-color-green-deep);
  --gb-success-rgb: var(--gb-color-green-deep-rgb);
  --gb-action: var(--gb-color-ink);
  --gb-action-rgb: var(--gb-color-ink-rgb);
  --gb-action-fg: var(--gb-color-white);
  --gb-action-fg-rgb: var(--gb-color-white-rgb);
  --gb-action-hover: var(--gb-color-ink-hover);
  --gb-action-hover-rgb: var(--gb-color-ink-hover-rgb);
  --gb-action-on-light: var(--gb-color-ink);
  --gb-action-on-light-rgb: var(--gb-color-ink-rgb);
  --gb-action-on-light-fg: var(--gb-color-white);
  --gb-action-on-light-fg-rgb: var(--gb-color-white-rgb);
  --gb-action-on-light-hover: var(--gb-color-ink-hover);
  --gb-action-on-light-hover-rgb: var(--gb-color-ink-hover-rgb);
  --gb-action-on-dark: var(--gb-color-green);
  --gb-action-on-dark-rgb: var(--gb-color-green-rgb);
  --gb-action-on-dark-fg: var(--gb-color-ink);
  --gb-action-on-dark-fg-rgb: var(--gb-color-ink-rgb);
  --gb-action-on-dark-hover: var(--gb-color-green-hover);
  --gb-action-on-dark-hover-rgb: var(--gb-color-green-hover-rgb);
  --gb-focus: var(--gb-color-indigo);
  --gb-focus-rgb: var(--gb-color-indigo-rgb);
  --gb-border: var(--gb-color-stone);
  --gb-border-rgb: var(--gb-color-stone-rgb);
  --gb-border-control: var(--gb-color-graphite);
  --gb-border-control-rgb: var(--gb-color-graphite-rgb);
  --gb-border-strong: var(--gb-color-ink);
  --gb-border-strong-rgb: var(--gb-color-ink-rgb);

  /* font families */
  --gb-font-display: "GB Alexandria", "Alexandria", system-ui, sans-serif;
  --gb-font-text: "GB Text", "GB Arabic Text", "IBM Plex Sans Arabic", system-ui, sans-serif;
  --gb-font-mono: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;

  /* font weights */
  --gb-weight-light: 280;
  --gb-weight-regular: 400;
  --gb-weight-medium: 500;
  --gb-weight-semibold: 600;

  /* letter-spacing (Arabic is never tracked) */
  --gb-tracking-none: 0em;
  --gb-tracking-wordmark-en: -0.01em;
  --gb-tracking-caps-wide: 0.24em;

  /* type scale: size is fluid from 390px to 1440px; line-height switches below 768px */
  --gb-type-display-1-size-desktop: 6rem;
  --gb-type-display-1-size-phone: 3rem;
  --gb-type-display-1-size: clamp(3rem, 1.8857rem + 4.5714vw, 6rem);
  --gb-type-display-1-lh-desktop: 1.12;
  --gb-type-display-1-lh-phone: 1.22;
  --gb-type-display-1-lh: var(--gb-type-display-1-lh-desktop);
  --gb-type-display-2-size-desktop: 5rem;
  --gb-type-display-2-size-phone: 2.625rem;
  --gb-type-display-2-size: clamp(2.625rem, 1.7429rem + 3.619vw, 5rem);
  --gb-type-display-2-lh-desktop: 1.3;
  --gb-type-display-2-lh-phone: 1.3;
  --gb-type-display-2-lh: var(--gb-type-display-2-lh-desktop);
  --gb-type-display-3-size-desktop: 4rem;
  --gb-type-display-3-size-phone: 2.125rem;
  --gb-type-display-3-size: clamp(2.125rem, 1.4286rem + 2.8571vw, 4rem);
  --gb-type-display-3-lh-desktop: 1.3;
  --gb-type-display-3-lh-phone: 1.3;
  --gb-type-display-3-lh: var(--gb-type-display-3-lh-desktop);
  --gb-type-display-4-size-desktop: 2.5rem;
  --gb-type-display-4-size-phone: 1.75rem;
  --gb-type-display-4-size: clamp(1.75rem, 1.4714rem + 1.1429vw, 2.5rem);
  --gb-type-display-4-lh-desktop: 1.3;
  --gb-type-display-4-lh-phone: 1.4;
  --gb-type-display-4-lh: var(--gb-type-display-4-lh-desktop);
  --gb-type-heading-1-size-desktop: 2.5rem;
  --gb-type-heading-1-size-phone: 2rem;
  --gb-type-heading-1-size: clamp(2rem, 1.8143rem + 0.7619vw, 2.5rem);
  --gb-type-heading-1-lh-desktop: 1.3;
  --gb-type-heading-1-lh-phone: 1.3;
  --gb-type-heading-1-lh: var(--gb-type-heading-1-lh-desktop);
  --gb-type-heading-2-size-desktop: 1.75rem;
  --gb-type-heading-2-size-phone: 1.5rem;
  --gb-type-heading-2-size: clamp(1.5rem, 1.4071rem + 0.381vw, 1.75rem);
  --gb-type-heading-2-lh-desktop: 1.35;
  --gb-type-heading-2-lh-phone: 1.4;
  --gb-type-heading-2-lh: var(--gb-type-heading-2-lh-desktop);
  --gb-type-heading-3-size-desktop: 1.375rem;
  --gb-type-heading-3-size-phone: 1.25rem;
  --gb-type-heading-3-size: clamp(1.25rem, 1.2036rem + 0.1905vw, 1.375rem);
  --gb-type-heading-3-lh-desktop: 1.4;
  --gb-type-heading-3-lh-phone: 1.45;
  --gb-type-heading-3-lh: var(--gb-type-heading-3-lh-desktop);
  --gb-type-lead-size-desktop: 1.25rem;
  --gb-type-lead-size-phone: 1.125rem;
  --gb-type-lead-size: clamp(1.125rem, 1.0786rem + 0.1905vw, 1.25rem);
  --gb-type-lead-lh-desktop: 1.8;
  --gb-type-lead-lh-phone: 1.75;
  --gb-type-lead-lh: var(--gb-type-lead-lh-desktop);
  --gb-type-body-size-desktop: 1.1875rem;
  --gb-type-body-size-phone: 1.0625rem;
  --gb-type-body-size: clamp(1.0625rem, 1.0161rem + 0.1905vw, 1.1875rem);
  --gb-type-body-lh-desktop: 1.75;
  --gb-type-body-lh-phone: 1.75;
  --gb-type-body-lh: var(--gb-type-body-lh-desktop);
  --gb-type-body-sm-size-desktop: 0.9375rem;
  --gb-type-body-sm-size-phone: 0.9375rem;
  --gb-type-body-sm-size: 0.9375rem;
  --gb-type-body-sm-lh-desktop: 1.7;
  --gb-type-body-sm-lh-phone: 1.7;
  --gb-type-body-sm-lh: var(--gb-type-body-sm-lh-desktop);
  --gb-type-ui-size-desktop: 1rem;
  --gb-type-ui-size-phone: 0.9375rem;
  --gb-type-ui-size: clamp(0.9375rem, 0.9143rem + 0.0952vw, 1rem);
  --gb-type-ui-lh-desktop: 1.5;
  --gb-type-ui-lh-phone: 1.5;
  --gb-type-ui-lh: var(--gb-type-ui-lh-desktop);
  --gb-type-caption-size-desktop: 0.875rem;
  --gb-type-caption-size-phone: 0.8125rem;
  --gb-type-caption-size: clamp(0.8125rem, 0.7893rem + 0.0952vw, 0.875rem);
  --gb-type-caption-lh-desktop: 1.6;
  --gb-type-caption-lh-phone: 1.6;
  --gb-type-caption-lh: var(--gb-type-caption-lh-desktop);
  --gb-type-micro-size-desktop: 0.75rem;
  --gb-type-micro-size-phone: 0.75rem;
  --gb-type-micro-size: 0.75rem;
  --gb-type-micro-lh-desktop: 1.5;
  --gb-type-micro-lh-phone: 1.5;
  --gb-type-micro-lh: var(--gb-type-micro-lh-desktop);
  --gb-type-figure-1-size-desktop: 5.25rem;
  --gb-type-figure-1-size-phone: 3.5rem;
  --gb-type-figure-1-size: clamp(3.5rem, 2.85rem + 2.6667vw, 5.25rem);
  --gb-type-figure-1-lh-desktop: 1;
  --gb-type-figure-1-lh-phone: 1;
  --gb-type-figure-1-lh: var(--gb-type-figure-1-lh-desktop);
  --gb-type-figure-2-size-desktop: 2.75rem;
  --gb-type-figure-2-size-phone: 2rem;
  --gb-type-figure-2-size: clamp(2rem, 1.7214rem + 1.1429vw, 2.75rem);
  --gb-type-figure-2-lh-desktop: 1.1;
  --gb-type-figure-2-lh-phone: 1.1;
  --gb-type-figure-2-lh: var(--gb-type-figure-2-lh-desktop);

  /* spacing, 4px base */
  --gb-space-0: 0px;
  --gb-space-1: 4px;
  --gb-space-2: 8px;
  --gb-space-3: 12px;
  --gb-space-4: 16px;
  --gb-space-5: 20px;
  --gb-space-6: 24px;
  --gb-space-7: 28px;
  --gb-space-8: 32px;
  --gb-space-10: 40px;
  --gb-space-12: 48px;
  --gb-space-14: 56px;
  --gb-space-16: 64px;
  --gb-space-18: 72px;
  --gb-space-20: 80px;
  --gb-space-24: 96px;
  --gb-space-28: 112px;
  --gb-space-32: 128px;
  --gb-space-40: 160px;
  --gb-space-0_5: 2px;

  /* layout */
  --gb-layout-gutter-phone: 20px;
  --gb-layout-gutter-tablet: 40px;
  --gb-layout-gutter-laptop: 64px;
  --gb-layout-gutter-desktop: 132px;
  --gb-layout-section-y-phone: 56px;
  --gb-layout-section-y-laptop: 80px;
  --gb-layout-content-max: 1176px;
  --gb-layout-gutter: var(--gb-layout-gutter-phone);
  --gb-layout-section-y: var(--gb-layout-section-y-phone);

  /* control and icon sizes */
  --gb-size-control-sm: 36px;
  --gb-size-control-md: 40px;
  --gb-size-control-lg: 44px;
  --gb-size-icon-sm: 16px;
  --gb-size-icon-md: 20px;
  --gb-size-icon-lg: 24px;

  /* radius (arch-window values are ratios of the window width) */
  --gb-radius-none: 0px;
  --gb-radius-xs: 4px;
  --gb-radius-sm: 6px;
  --gb-radius-md: 10px;
  --gb-radius-lg: 14px;
  --gb-radius-xl: 18px;
  --gb-radius-2xl: 24px;
  --gb-radius-pill: 9999px;
  --gb-radius-app-icon: 22.6%;
  --gb-radius-arch-window-crown: 0.23;
  --gb-radius-arch-window-shoulder-angle: 38deg;
  --gb-radius-arch-window-fillet-shoulder: 0.1;
  --gb-radius-arch-window-fillet-crown: 0.11;
  --gb-radius-arch-window-fillet-base: 0.04;
  --gb-radius-arch-window-aspect-default: 1.35;
  --gb-radius-arch-window-aspect-max: 4;
  --gb-radius-arch-window-inner: var(--gb-radius-lg);

  /* strokes (u = mark units, viewBox 474 x 459) */
  --gb-stroke-mark-arch: 35;
  --gb-stroke-mark-bracket: 30;
  --gb-stroke-mark-bracket-ratio: 0.857;
  --gb-stroke-favicon-arch: 44;
  --gb-stroke-favicon-bracket: 40;
  --gb-stroke-hairline: 1px;
  --gb-stroke-icon: 1.6px;
  --gb-stroke-thread: 3px;
  --gb-stroke-thread-display: 4px;
  --gb-stroke-bracket-device: 0.1em;
  --gb-stroke-focus-ring: 2px;
  --gb-stroke-focus-offset: 3px;

  /* durations */
  --gb-duration-instant: 120ms;
  --gb-duration-quick: 240ms;
  --gb-duration-base: 480ms;
  --gb-duration-slow: 900ms;

  /* easing */
  --gb-ease-brand: cubic-bezier(0.16, 1, 0.3, 1);
  --gb-ease-brand-in: cubic-bezier(0.7, 0, 0.84, 0);
  --gb-ease-linear: cubic-bezier(0, 0, 1, 1);

  /* motion: shorthand = duration ease delay */
  --gb-motion-hover-duration: var(--gb-duration-instant);
  --gb-motion-hover-delay: 0ms;
  --gb-motion-hover-ease: var(--gb-ease-brand);
  --gb-motion-hover: var(--gb-motion-hover-duration) var(--gb-motion-hover-ease) var(--gb-motion-hover-delay);
  --gb-motion-enter-duration: var(--gb-duration-base);
  --gb-motion-enter-delay: 0ms;
  --gb-motion-enter-ease: var(--gb-ease-brand);
  --gb-motion-enter: var(--gb-motion-enter-duration) var(--gb-motion-enter-ease) var(--gb-motion-enter-delay);
  --gb-motion-thread-draw-duration: var(--gb-duration-slow);
  --gb-motion-thread-draw-delay: 0ms;
  --gb-motion-thread-draw-ease: var(--gb-ease-brand);
  --gb-motion-thread-draw: var(--gb-motion-thread-draw-duration) var(--gb-motion-thread-draw-ease) var(--gb-motion-thread-draw-delay);
  --gb-motion-logo-arch-draw-duration: var(--gb-duration-slow);
  --gb-motion-logo-arch-draw-delay: 0ms;
  --gb-motion-logo-arch-draw-ease: var(--gb-ease-brand);
  --gb-motion-logo-arch-draw: var(--gb-motion-logo-arch-draw-duration) var(--gb-motion-logo-arch-draw-ease) var(--gb-motion-logo-arch-draw-delay);
  --gb-motion-logo-brackets-close-duration: 300ms;
  --gb-motion-logo-brackets-close-delay: var(--gb-duration-slow);
  --gb-motion-logo-brackets-close-ease: var(--gb-ease-brand);
  --gb-motion-logo-brackets-close: var(--gb-motion-logo-brackets-close-duration) var(--gb-motion-logo-brackets-close-ease) var(--gb-motion-logo-brackets-close-delay);
  --gb-motion-logo-pulse-duration: var(--gb-duration-quick);
  --gb-motion-logo-pulse-delay: 1200ms;
  --gb-motion-logo-pulse-ease: var(--gb-ease-brand);
  --gb-motion-logo-pulse: var(--gb-motion-logo-pulse-duration) var(--gb-motion-logo-pulse-ease) var(--gb-motion-logo-pulse-delay);
  --gb-motion-logo-bracket-travel: 60;
  --gb-motion-logo-pulse-scale: 1.04;

  /* shadows */
  --gb-shadow-velvet-sm: 0px 1px 2px 0px rgb(18 20 58 / 0.06), 0px 8px 20px -12px rgb(18 20 58 / 0.16);
  --gb-shadow-velvet: 0px 24px 60px -24px rgb(18 20 58 / 0.3);
  --gb-shadow-velvet-lift: 0px 20px 40px -20px rgb(18 20 58 / 0.6);
  --gb-shadow-float: 0px 18px 40px -18px rgb(20 20 22 / 0.5);

  /* z-index */
  --gb-z-base: 0;
  --gb-z-raised: 10;
  --gb-z-header: 20;
  --gb-z-widget: 30;
  --gb-z-overlay: 40;
  --gb-z-modal: 50;
  --gb-z-toast: 60;
  --gb-z-tooltip: 70;

  /* breakpoints (media queries cannot read variables: use the px values) */
  --gb-breakpoint-phone: 390px;
  --gb-breakpoint-tablet: 768px;
  --gb-breakpoint-laptop: 1024px;
  --gb-breakpoint-desktop: 1440px;

  /* logo geometry and lockup ratios (x mark height) */
  --gb-logo-clear-space: 2;
  --gb-logo-min-size: 24px;
  --gb-logo-min-size-favicon: 16px;
  --gb-logo-lockup-ar-wordmark: 0.9;
  --gb-logo-lockup-ar-gap: 0.28;
  --gb-logo-lockup-en-wordmark: 0.84;
  --gb-logo-lockup-stack-ar: 0.5;
  --gb-logo-lockup-stack-en: 0.22;
  --gb-logo-lockup-stack-gap: 0.15;
}

@media (min-width: 768px) {
  :root {
    --gb-layout-gutter: var(--gb-layout-gutter-tablet);
  }
}
@media (min-width: 1024px) {
  :root {
    --gb-layout-gutter: var(--gb-layout-gutter-laptop);
    --gb-layout-section-y: var(--gb-layout-section-y-laptop);
  }
}
@media (min-width: 1440px) {
  :root {
    --gb-layout-gutter: var(--gb-layout-gutter-desktop);
  }
}
@media (max-width: 767.98px) {
  :root {
    --gb-type-display-1-lh: var(--gb-type-display-1-lh-phone);
    --gb-type-display-2-lh: var(--gb-type-display-2-lh-phone);
    --gb-type-display-3-lh: var(--gb-type-display-3-lh-phone);
    --gb-type-display-4-lh: var(--gb-type-display-4-lh-phone);
    --gb-type-heading-1-lh: var(--gb-type-heading-1-lh-phone);
    --gb-type-heading-2-lh: var(--gb-type-heading-2-lh-phone);
    --gb-type-heading-3-lh: var(--gb-type-heading-3-lh-phone);
    --gb-type-lead-lh: var(--gb-type-lead-lh-phone);
    --gb-type-body-lh: var(--gb-type-body-lh-phone);
    --gb-type-body-sm-lh: var(--gb-type-body-sm-lh-phone);
    --gb-type-ui-lh: var(--gb-type-ui-lh-phone);
    --gb-type-caption-lh: var(--gb-type-caption-lh-phone);
    --gb-type-micro-lh: var(--gb-type-micro-lh-phone);
    --gb-type-figure-1-lh: var(--gb-type-figure-1-lh-phone);
    --gb-type-figure-2-lh: var(--gb-type-figure-2-lh-phone);
  }
}

[data-theme="light"], [data-theme="auto"] {
  color-scheme: light;
  --gb-ground: var(--gb-color-sand);
  --gb-ground-rgb: var(--gb-color-sand-rgb);
  --gb-surface: var(--gb-color-white);
  --gb-surface-rgb: var(--gb-color-white-rgb);
  --gb-surface-inverse: var(--gb-color-ink);
  --gb-surface-inverse-rgb: var(--gb-color-ink-rgb);
  --gb-surface-brand: var(--gb-color-indigo);
  --gb-surface-brand-rgb: var(--gb-color-indigo-rgb);
  --gb-surface-brand-strong: var(--gb-color-indigo-deep);
  --gb-surface-brand-strong-rgb: var(--gb-color-indigo-deep-rgb);
  --gb-surface-ai: var(--gb-color-indigo-mist);
  --gb-surface-ai-rgb: var(--gb-color-indigo-mist-rgb);
  --gb-surface-success: var(--gb-color-green-mist);
  --gb-surface-success-rgb: var(--gb-color-green-mist-rgb);
  --gb-text: var(--gb-color-ink);
  --gb-text-rgb: var(--gb-color-ink-rgb);
  --gb-text-muted: var(--gb-color-graphite);
  --gb-text-muted-rgb: var(--gb-color-graphite-rgb);
  --gb-text-inverse: var(--gb-color-white);
  --gb-text-inverse-rgb: var(--gb-color-white-rgb);
  --gb-text-brand: var(--gb-color-indigo-deep);
  --gb-text-brand-rgb: var(--gb-color-indigo-deep-rgb);
  --gb-text-success: var(--gb-color-green-deep);
  --gb-text-success-rgb: var(--gb-color-green-deep-rgb);
  --gb-text-on-brand: var(--gb-color-white);
  --gb-text-on-brand-rgb: var(--gb-color-white-rgb);
  --gb-brand: var(--gb-color-indigo);
  --gb-brand-rgb: var(--gb-color-indigo-rgb);
  --gb-ai: var(--gb-color-indigo);
  --gb-ai-rgb: var(--gb-color-indigo-rgb);
  --gb-accent: var(--gb-color-green);
  --gb-accent-rgb: var(--gb-color-green-rgb);
  --gb-success: var(--gb-color-green-deep);
  --gb-success-rgb: var(--gb-color-green-deep-rgb);
  --gb-action: var(--gb-color-ink);
  --gb-action-rgb: var(--gb-color-ink-rgb);
  --gb-action-fg: var(--gb-color-white);
  --gb-action-fg-rgb: var(--gb-color-white-rgb);
  --gb-action-hover: var(--gb-color-ink-hover);
  --gb-action-hover-rgb: var(--gb-color-ink-hover-rgb);
  --gb-action-on-light: var(--gb-color-ink);
  --gb-action-on-light-rgb: var(--gb-color-ink-rgb);
  --gb-action-on-light-fg: var(--gb-color-white);
  --gb-action-on-light-fg-rgb: var(--gb-color-white-rgb);
  --gb-action-on-light-hover: var(--gb-color-ink-hover);
  --gb-action-on-light-hover-rgb: var(--gb-color-ink-hover-rgb);
  --gb-action-on-dark: var(--gb-color-green);
  --gb-action-on-dark-rgb: var(--gb-color-green-rgb);
  --gb-action-on-dark-fg: var(--gb-color-ink);
  --gb-action-on-dark-fg-rgb: var(--gb-color-ink-rgb);
  --gb-action-on-dark-hover: var(--gb-color-green-hover);
  --gb-action-on-dark-hover-rgb: var(--gb-color-green-hover-rgb);
  --gb-focus: var(--gb-color-indigo);
  --gb-focus-rgb: var(--gb-color-indigo-rgb);
  --gb-border: var(--gb-color-stone);
  --gb-border-rgb: var(--gb-color-stone-rgb);
  --gb-border-control: var(--gb-color-graphite);
  --gb-border-control-rgb: var(--gb-color-graphite-rgb);
  --gb-border-strong: var(--gb-color-ink);
  --gb-border-strong-rgb: var(--gb-color-ink-rgb);
}
[data-theme="dark"] {
  color-scheme: dark;
  --gb-ground: var(--gb-color-night);
  --gb-ground-rgb: var(--gb-color-night-rgb);
  --gb-surface: var(--gb-color-night-raised);
  --gb-surface-rgb: var(--gb-color-night-raised-rgb);
  --gb-surface-inverse: var(--gb-color-sand);
  --gb-surface-inverse-rgb: var(--gb-color-sand-rgb);
  --gb-surface-brand: var(--gb-color-indigo);
  --gb-surface-brand-rgb: var(--gb-color-indigo-rgb);
  --gb-surface-brand-strong: var(--gb-color-indigo-deep);
  --gb-surface-brand-strong-rgb: var(--gb-color-indigo-deep-rgb);
  --gb-surface-ai: var(--gb-color-indigo-deep);
  --gb-surface-ai-rgb: var(--gb-color-indigo-deep-rgb);
  --gb-surface-success: var(--gb-color-night-raised);
  --gb-surface-success-rgb: var(--gb-color-night-raised-rgb);
  --gb-text: var(--gb-color-white);
  --gb-text-rgb: var(--gb-color-white-rgb);
  --gb-text-muted: var(--gb-color-night-muted);
  --gb-text-muted-rgb: var(--gb-color-night-muted-rgb);
  --gb-text-inverse: var(--gb-color-ink);
  --gb-text-inverse-rgb: var(--gb-color-ink-rgb);
  --gb-text-brand: var(--gb-color-indigo-mist);
  --gb-text-brand-rgb: var(--gb-color-indigo-mist-rgb);
  --gb-text-success: var(--gb-color-green);
  --gb-text-success-rgb: var(--gb-color-green-rgb);
  --gb-text-on-brand: var(--gb-color-white);
  --gb-text-on-brand-rgb: var(--gb-color-white-rgb);
  --gb-brand: var(--gb-color-indigo);
  --gb-brand-rgb: var(--gb-color-indigo-rgb);
  --gb-ai: var(--gb-color-indigo);
  --gb-ai-rgb: var(--gb-color-indigo-rgb);
  --gb-accent: var(--gb-color-green);
  --gb-accent-rgb: var(--gb-color-green-rgb);
  --gb-success: var(--gb-color-green);
  --gb-success-rgb: var(--gb-color-green-rgb);
  --gb-action: var(--gb-color-green);
  --gb-action-rgb: var(--gb-color-green-rgb);
  --gb-action-fg: var(--gb-color-ink);
  --gb-action-fg-rgb: var(--gb-color-ink-rgb);
  --gb-action-hover: var(--gb-color-green-hover);
  --gb-action-hover-rgb: var(--gb-color-green-hover-rgb);
  --gb-action-on-light: var(--gb-color-ink);
  --gb-action-on-light-rgb: var(--gb-color-ink-rgb);
  --gb-action-on-light-fg: var(--gb-color-white);
  --gb-action-on-light-fg-rgb: var(--gb-color-white-rgb);
  --gb-action-on-light-hover: var(--gb-color-ink-hover);
  --gb-action-on-light-hover-rgb: var(--gb-color-ink-hover-rgb);
  --gb-action-on-dark: var(--gb-color-green);
  --gb-action-on-dark-rgb: var(--gb-color-green-rgb);
  --gb-action-on-dark-fg: var(--gb-color-ink);
  --gb-action-on-dark-fg-rgb: var(--gb-color-ink-rgb);
  --gb-action-on-dark-hover: var(--gb-color-green-hover);
  --gb-action-on-dark-hover-rgb: var(--gb-color-green-hover-rgb);
  --gb-focus: var(--gb-color-green);
  --gb-focus-rgb: var(--gb-color-green-rgb);
  --gb-border: var(--gb-color-night-line);
  --gb-border-rgb: var(--gb-color-night-line-rgb);
  --gb-border-control: var(--gb-color-night-muted);
  --gb-border-control-rgb: var(--gb-color-night-muted-rgb);
  --gb-border-strong: var(--gb-color-white);
  --gb-border-strong-rgb: var(--gb-color-white-rgb);
}
@media (prefers-color-scheme: dark) {
  [data-theme="auto"] {
    color-scheme: dark;
    --gb-ground: var(--gb-color-night);
    --gb-ground-rgb: var(--gb-color-night-rgb);
    --gb-surface: var(--gb-color-night-raised);
    --gb-surface-rgb: var(--gb-color-night-raised-rgb);
    --gb-surface-inverse: var(--gb-color-sand);
    --gb-surface-inverse-rgb: var(--gb-color-sand-rgb);
    --gb-surface-brand: var(--gb-color-indigo);
    --gb-surface-brand-rgb: var(--gb-color-indigo-rgb);
    --gb-surface-brand-strong: var(--gb-color-indigo-deep);
    --gb-surface-brand-strong-rgb: var(--gb-color-indigo-deep-rgb);
    --gb-surface-ai: var(--gb-color-indigo-deep);
    --gb-surface-ai-rgb: var(--gb-color-indigo-deep-rgb);
    --gb-surface-success: var(--gb-color-night-raised);
    --gb-surface-success-rgb: var(--gb-color-night-raised-rgb);
    --gb-text: var(--gb-color-white);
    --gb-text-rgb: var(--gb-color-white-rgb);
    --gb-text-muted: var(--gb-color-night-muted);
    --gb-text-muted-rgb: var(--gb-color-night-muted-rgb);
    --gb-text-inverse: var(--gb-color-ink);
    --gb-text-inverse-rgb: var(--gb-color-ink-rgb);
    --gb-text-brand: var(--gb-color-indigo-mist);
    --gb-text-brand-rgb: var(--gb-color-indigo-mist-rgb);
    --gb-text-success: var(--gb-color-green);
    --gb-text-success-rgb: var(--gb-color-green-rgb);
    --gb-text-on-brand: var(--gb-color-white);
    --gb-text-on-brand-rgb: var(--gb-color-white-rgb);
    --gb-brand: var(--gb-color-indigo);
    --gb-brand-rgb: var(--gb-color-indigo-rgb);
    --gb-ai: var(--gb-color-indigo);
    --gb-ai-rgb: var(--gb-color-indigo-rgb);
    --gb-accent: var(--gb-color-green);
    --gb-accent-rgb: var(--gb-color-green-rgb);
    --gb-success: var(--gb-color-green);
    --gb-success-rgb: var(--gb-color-green-rgb);
    --gb-action: var(--gb-color-green);
    --gb-action-rgb: var(--gb-color-green-rgb);
    --gb-action-fg: var(--gb-color-ink);
    --gb-action-fg-rgb: var(--gb-color-ink-rgb);
    --gb-action-hover: var(--gb-color-green-hover);
    --gb-action-hover-rgb: var(--gb-color-green-hover-rgb);
    --gb-action-on-light: var(--gb-color-ink);
    --gb-action-on-light-rgb: var(--gb-color-ink-rgb);
    --gb-action-on-light-fg: var(--gb-color-white);
    --gb-action-on-light-fg-rgb: var(--gb-color-white-rgb);
    --gb-action-on-light-hover: var(--gb-color-ink-hover);
    --gb-action-on-light-hover-rgb: var(--gb-color-ink-hover-rgb);
    --gb-action-on-dark: var(--gb-color-green);
    --gb-action-on-dark-rgb: var(--gb-color-green-rgb);
    --gb-action-on-dark-fg: var(--gb-color-ink);
    --gb-action-on-dark-fg-rgb: var(--gb-color-ink-rgb);
    --gb-action-on-dark-hover: var(--gb-color-green-hover);
    --gb-action-on-dark-hover-rgb: var(--gb-color-green-hover-rgb);
    --gb-focus: var(--gb-color-green);
    --gb-focus-rgb: var(--gb-color-green-rgb);
    --gb-border: var(--gb-color-night-line);
    --gb-border-rgb: var(--gb-color-night-line-rgb);
    --gb-border-control: var(--gb-color-night-muted);
    --gb-border-control-rgb: var(--gb-color-night-muted-rgb);
    --gb-border-strong: var(--gb-color-white);
    --gb-border-strong-rgb: var(--gb-color-white-rgb);
  }
}
[data-theme] { background-color: var(--gb-ground); color: var(--gb-text); }

@media (prefers-reduced-motion: reduce) {
  :root {
    --gb-duration-instant: 1ms;
    --gb-duration-quick: 1ms;
    --gb-duration-base: 1ms;
    --gb-duration-slow: 1ms;
    --gb-motion-hover-duration: 1ms;
    --gb-motion-hover-delay: 0ms;
    --gb-motion-enter-duration: 1ms;
    --gb-motion-enter-delay: 0ms;
    --gb-motion-thread-draw-duration: 1ms;
    --gb-motion-thread-draw-delay: 0ms;
    --gb-motion-logo-arch-draw-duration: 1ms;
    --gb-motion-logo-arch-draw-delay: 0ms;
    --gb-motion-logo-brackets-close-duration: 1ms;
    --gb-motion-logo-brackets-close-delay: 0ms;
    --gb-motion-logo-pulse-duration: 1ms;
    --gb-motion-logo-pulse-delay: 0ms;
  }
}

/* type classes: family, weight, fluid size, line-height; no tracking */
.gb-display-1{font-family:var(--gb-font-display);font-weight:var(--gb-weight-light);font-size:var(--gb-type-display-1-size);line-height:var(--gb-type-display-1-lh);letter-spacing:0}
.gb-display-2{font-family:var(--gb-font-display);font-weight:var(--gb-weight-light);font-size:var(--gb-type-display-2-size);line-height:var(--gb-type-display-2-lh);letter-spacing:0}
.gb-display-3{font-family:var(--gb-font-display);font-weight:var(--gb-weight-light);font-size:var(--gb-type-display-3-size);line-height:var(--gb-type-display-3-lh);letter-spacing:0}
.gb-display-4{font-family:var(--gb-font-display);font-weight:var(--gb-weight-light);font-size:var(--gb-type-display-4-size);line-height:var(--gb-type-display-4-lh);letter-spacing:0}
.gb-heading-1{font-family:var(--gb-font-display);font-weight:var(--gb-weight-semibold);font-size:var(--gb-type-heading-1-size);line-height:var(--gb-type-heading-1-lh);letter-spacing:0}
.gb-heading-2{font-family:var(--gb-font-display);font-weight:var(--gb-weight-semibold);font-size:var(--gb-type-heading-2-size);line-height:var(--gb-type-heading-2-lh);letter-spacing:0}
.gb-heading-3{font-family:var(--gb-font-display);font-weight:var(--gb-weight-semibold);font-size:var(--gb-type-heading-3-size);line-height:var(--gb-type-heading-3-lh);letter-spacing:0}
.gb-lead{font-family:var(--gb-font-text);font-weight:var(--gb-weight-regular);font-size:var(--gb-type-lead-size);line-height:var(--gb-type-lead-lh);letter-spacing:0}
.gb-body{font-family:var(--gb-font-text);font-weight:var(--gb-weight-regular);font-size:var(--gb-type-body-size);line-height:var(--gb-type-body-lh);letter-spacing:0}
.gb-body-sm{font-family:var(--gb-font-text);font-weight:var(--gb-weight-regular);font-size:var(--gb-type-body-sm-size);line-height:var(--gb-type-body-sm-lh);letter-spacing:0}
.gb-ui{font-family:var(--gb-font-text);font-weight:var(--gb-weight-regular);font-size:var(--gb-type-ui-size);line-height:var(--gb-type-ui-lh);letter-spacing:0}
.gb-caption{font-family:var(--gb-font-text);font-weight:var(--gb-weight-regular);font-size:var(--gb-type-caption-size);line-height:var(--gb-type-caption-lh);letter-spacing:0}
.gb-micro{font-family:var(--gb-font-text);font-weight:var(--gb-weight-semibold);font-size:var(--gb-type-micro-size);line-height:var(--gb-type-micro-lh);letter-spacing:0}
.gb-figure-1{font-family:var(--gb-font-display);font-weight:var(--gb-weight-light);font-size:var(--gb-type-figure-1-size);line-height:var(--gb-type-figure-1-lh);letter-spacing:0;font-variant-numeric:tabular-nums lining-nums;direction:ltr;unicode-bidi:isolate}
.gb-figure-2{font-family:var(--gb-font-display);font-weight:var(--gb-weight-light);font-size:var(--gb-type-figure-2-size);line-height:var(--gb-type-figure-2-lh);letter-spacing:0;font-variant-numeric:tabular-nums lining-nums;direction:ltr;unicode-bidi:isolate}

/* arch window: the mark's outer contour as a container (rule in --gb-radius-arch-window-*). Works for height / width from 1 to the aspect-max. */
.gb-arch-window{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221000%22%20height%3D%224000%22%20viewBox%3D%220%200%201000%204000%22%3E%3Cpath%20d%3D%22M0.0%204000.0%20L0.0%20349.6%20A100.0%20100.0%200%200%201%2038.4%20270.8%20L355.2%2023.3%20A110.0%20110.0%200%200%201%20422.9%200.0%20L577.1%200.0%20A110.0%20110.0%200%200%201%20644.8%2023.3%20L961.6%20270.8%20A100.0%20100.0%200%200%201%201000.0%20349.6%20L1000.0%204000.0%20Z%22%2F%3E%3C%2Fsvg%3E") top/100% auto no-repeat,url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221000%22%20height%3D%224000%22%20viewBox%3D%220%200%201000%204000%22%3E%3Cpath%20d%3D%22M0%200H1000V3960A40%2040%200%200%201%20960%204000H40A40%2040%200%200%201%200%203960Z%22%2F%3E%3C%2Fsvg%3E") bottom/100% auto no-repeat;-webkit-mask-composite:source-in;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221000%22%20height%3D%224000%22%20viewBox%3D%220%200%201000%204000%22%3E%3Cpath%20d%3D%22M0.0%204000.0%20L0.0%20349.6%20A100.0%20100.0%200%200%201%2038.4%20270.8%20L355.2%2023.3%20A110.0%20110.0%200%200%201%20422.9%200.0%20L577.1%200.0%20A110.0%20110.0%200%200%201%20644.8%2023.3%20L961.6%20270.8%20A100.0%20100.0%200%200%201%201000.0%20349.6%20L1000.0%204000.0%20Z%22%2F%3E%3C%2Fsvg%3E") top/100% auto no-repeat,url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221000%22%20height%3D%224000%22%20viewBox%3D%220%200%201000%204000%22%3E%3Cpath%20d%3D%22M0%200H1000V3960A40%2040%200%200%201%20960%204000H40A40%2040%200%200%201%200%203960Z%22%2F%3E%3C%2Fsvg%3E") bottom/100% auto no-repeat;mask-composite:intersect}
.gb-arch-window-default{aspect-ratio:1/1.35}