/* Systrix Meridian tokens for STAX. Generated from the design system's tokens.json; do not edit.
   Day is the default (:root). Night is available on [data-theme="night"].
   Type styles are variables: font: var(--t-body); letter-spacing: var(--t-body-tracking); */
:root, [data-theme="day"] {
  --bg: var(--dune-50);
  --surface: var(--dune-0);
  --surface-raised: var(--dune-0);
  --surface-sunken: var(--dune-100);
  --surface-inverse: var(--dune-1000);
  --line: var(--dune-200);
  --line-strong: var(--dune-500);
  --ink: var(--dune-1000);
  --ink-muted: var(--dune-600);
  --ink-disabled: var(--dune-300);
  --ink-inverse: var(--dune-50);
  --brand: var(--magenta-600);
  --brand-hover: var(--magenta-700);
  --brand-pressed: var(--magenta-800);
  --on-brand: var(--dune-0);
  --brand-text: var(--magenta-700);
  --brand-soft: var(--magenta-50);
  --focus-ring: var(--aero-700);
  --success: var(--oasis-700);
  --success-soft: var(--oasis-50);
  --warning: var(--saffron-800);
  --warning-soft: var(--saffron-50);
  --danger: var(--signal-700);
  --danger-soft: var(--signal-50);
  --danger-fill: var(--signal-700);
  --on-danger: var(--dune-0);
  --info: var(--aero-700);
  --info-soft: var(--aero-50);
  --scrim: rgba(5, 8, 19, 0.48);
  --magenta-50: #fff1f6;
  --magenta-100: #ffe0ec;
  --magenta-200: #ffbfdb;
  --magenta-300: #ff92c8;
  --magenta-400: #f661b1;
  --magenta-500: #e7289c;
  --magenta-600: #c90b88;
  --magenta-700: #a1056e;
  --magenta-800: #780953;
  --magenta-900: #52093a;
  --magenta-950: #320924;
  --dune-0: #ffffff;
  --dune-25: #fcfaf6;
  --dune-50: #f8f5ee;
  --dune-100: #f0eae2;
  --dune-200: #e0d9cf;
  --dune-300: #c9c2ba;
  --dune-400: #a49f99;
  --dune-500: #7a7e82;
  --dune-600: #595e66;
  --dune-700: #3e444f;
  --dune-800: #262d39;
  --dune-850: #1b212f;
  --dune-900: #121825;
  --dune-950: #0a0f1c;
  --dune-1000: #050813;
  --aero-50: #e9f6ff;
  --aero-100: #cfebff;
  --aero-300: #76c7ff;
  --aero-500: #009ce4;
  --aero-700: #006a9d;
  --aero-800: #004d74;
  --aero-900: #002f49;
  --saffron-50: #fdf2e4;
  --saffron-100: #fbe2c3;
  --saffron-300: #f2af54;
  --saffron-500: #c68100;
  --saffron-700: #885700;
  --saffron-800: #643f00;
  --saffron-900: #3e2500;
  --oasis-50: #e9f7f1;
  --oasis-100: #cdefe1;
  --oasis-300: #71d4b0;
  --oasis-500: #00ac82;
  --oasis-700: #007558;
  --oasis-800: #00553f;
  --oasis-900: #003426;
  --signal-50: #ffefed;
  --signal-100: #ffddd7;
  --signal-300: #ffa191;
  --signal-500: #f45340;
  --signal-700: #af2c1f;
  --signal-800: #831b11;
  --signal-900: #520f08;
  --oasis-600: #009470;
  --violet-500: #8169dd;
  --viz-1: var(--magenta-600);
  --viz-2: var(--aero-500);
  --viz-3: var(--saffron-500);
  --viz-4: var(--oasis-600);
  --viz-5: var(--violet-500);
  --viz-other: var(--dune-400);
  --shadow-sm: 0 1px 2px rgba(5, 8, 19, 0.06), 0 1px 1px rgba(5, 8, 19, 0.04);
  --shadow-md: 0 12px 32px -10px rgba(5, 8, 19, 0.18), 0 2px 6px rgba(5, 8, 19, 0.06);
  --shadow-lg: 0 32px 64px -20px rgba(5, 8, 19, 0.28), 0 4px 12px rgba(5, 8, 19, 0.08);
}
[data-theme="night"] {
  --bg: var(--dune-1000);
  --surface: var(--dune-950);
  --surface-raised: var(--dune-900);
  --surface-sunken: var(--dune-1000);
  --surface-inverse: var(--dune-50);
  --line: var(--dune-850);
  --line-strong: var(--dune-500);
  --ink: var(--dune-50);
  --ink-muted: var(--dune-400);
  --ink-disabled: var(--dune-700);
  --ink-inverse: var(--dune-1000);
  --brand: var(--magenta-600);
  --brand-hover: var(--magenta-700);
  --brand-pressed: var(--magenta-800);
  --on-brand: var(--dune-0);
  --brand-text: var(--magenta-300);
  --brand-soft: var(--magenta-950);
  --focus-ring: var(--aero-300);
  --success: var(--oasis-300);
  --success-soft: var(--oasis-900);
  --warning: var(--saffron-300);
  --warning-soft: var(--saffron-900);
  --danger: var(--signal-300);
  --danger-soft: var(--signal-900);
  --danger-fill: var(--signal-500);
  --on-danger: var(--dune-1000);
  --info: var(--aero-300);
  --info-soft: var(--aero-900);
  --scrim: rgba(0, 0, 0, 0.64);
  --viz-1: var(--magenta-500);
  --viz-2: var(--aero-500);
  --viz-3: var(--saffron-500);
  --viz-4: var(--oasis-500);
  --viz-5: var(--violet-500);
  --viz-other: var(--dune-600);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 12px 32px -8px rgba(0, 0, 0, 0.72), 0 0 0 1px rgba(255, 255, 255, 0.06);
  --shadow-lg: 0 32px 64px -16px rgba(0, 0, 0, 0.8), 0 0 0 1px rgba(255, 255, 255, 0.08);
}
:root {
  --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-32: 128px;
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-2xl: 40px;
  --radius-full: 9999px;
  --control-sm: 32px;
  --control-md: 40px;
  --control-lg: 48px;
  --control-xl: 56px;
  --touch-min: 44px;
  --icon-sm: 16px;
  --icon-md: 20px;
  --icon-lg: 24px;
  --measure: 68ch;
  --container: 1240px;
  --bp-md: 600px;
  --bp-lg: 1024px;
  --bp-xl: 1440px;
  --duration-instant: 90ms;
  --duration-quick: 160ms;
  --duration-base: 240ms;
  --duration-gentle: 360ms;
  --duration-slow: 560ms;
  --duration-journey: 1200ms;
  --ease-cruise: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-landing: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-takeoff: cubic-bezier(0.7, 0, 0.84, 0);
  --ease-glide: linear(0, 0.058 4%, 0.190 8%, 0.389 13%, 0.579 18%, 0.761 24%, 0.886 30%, 0.970 37%, 1.011 45%, 1.020 55%, 1.012 66%, 1.004 80%, 1);
  --ease-taxi: linear;
  --layer-raised: 10;
  --layer-sticky: 100;
  --layer-dropdown: 300;
  --layer-overlay: 400;
  --layer-modal: 500;
  --layer-toast: 600;
  --layer-tooltip: 700;
  --font-display: Archivo, "Noto Sans Arabic", system-ui, sans-serif;
  --font-sans: Archivo, "Noto Sans Arabic", system-ui, sans-serif;
  --font-arabic: "Noto Sans Arabic", Archivo, system-ui, sans-serif;
  --font-mono: "Martian Mono", "Noto Sans Arabic", ui-monospace, Menlo, monospace;
}
:root {
  --t-display-2xl: 760 96px/88px var(--font-display);
  --t-display-2xl-tracking: -0.035em;
  --t-display-xl: 740 72px/68px var(--font-display);
  --t-display-xl-tracking: -0.03em;
  --t-display-lg: 720 56px/56px var(--font-display);
  --t-display-lg-tracking: -0.025em;
  --t-display-md: 700 40px/42px var(--font-display);
  --t-display-md-tracking: -0.02em;
  --t-heading-xl: 650 32px/38px var(--font-sans);
  --t-heading-xl-tracking: -0.015em;
  --t-heading-lg: 650 24px/30px var(--font-sans);
  --t-heading-lg-tracking: -0.01em;
  --t-heading-md: 600 20px/26px var(--font-sans);
  --t-heading-md-tracking: -0.005em;
  --t-heading-sm: 600 16px/22px var(--font-sans);
  --t-heading-sm-tracking: 0;
  --t-body-lg: 400 18px/28px var(--font-sans);
  --t-body-lg-tracking: 0;
  --t-body: 400 16px/24px var(--font-sans);
  --t-body-tracking: 0;
  --t-body-sm: 400 14px/20px var(--font-sans);
  --t-body-sm-tracking: 0;
  --t-label: 550 14px/20px var(--font-sans);
  --t-label-tracking: 0.005em;
  --t-caption: 500 12px/16px var(--font-sans);
  --t-caption-tracking: 0.01em;
  --t-eyebrow: 600 12px/16px var(--font-sans);
  --t-eyebrow-tracking: 0.08em;
  --t-data-xl: 500 32px/36px var(--font-mono);
  --t-data-xl-tracking: -0.02em;
  --t-data: 450 14px/20px var(--font-mono);
  --t-data-tracking: 0;
  --t-data-sm: 450 12px/16px var(--font-mono);
  --t-data-sm-tracking: 0.01em;
  --t-ar-display: 700 60px/80px var(--font-arabic);
  --t-ar-display-tracking: 0;
  --t-ar-heading: 700 26px/40px var(--font-arabic);
  --t-ar-heading-tracking: 0;
  --t-ar-body-lg: 400 20px/34px var(--font-arabic);
  --t-ar-body-lg-tracking: 0;
  --t-ar-body: 400 17px/28px var(--font-arabic);
  --t-ar-body-tracking: 0;
  --t-ar-label: 600 15px/24px var(--font-arabic);
  --t-ar-label-tracking: 0;
  --t-ar-caption: 500 13px/20px var(--font-arabic);
  --t-ar-caption-tracking: 0;
}
:root, [data-theme="day"] { color-scheme: light; }
[data-theme="night"] { color-scheme: dark; }
