/* fyrax design tokens 1.0.0 for the Fyrax theme.
   Copied from fyrax-design-template/tokens/dist/fyrax.css (generated there; refresh by copying the
   custom property declarations). Custom properties only: no imports, no URLs.
   :root is the dark theme (the site is always dark). [data-theme="light"] switches a subtree to light.
   Left out on purpose: color-scheme, background-color and color rules (fyrax.css owns them), the .fx-dark and
   .fx-light class selectors (the theme already uses .fx-dark for dark bands) and --fx-gutter (fyrax.css sets its own).
   Loaded before fyrax.css; the ad-hoc --fx-bg-2, --fx-card and --fx-muted there alias these. */

:root {
  /* color: Primitive colours. They never switch with the theme; semantic tokens alias them. */
  --fx-color-ink: #0B0E14; /* Ink */
  --fx-color-carbon: #11151C; /* Carbon */
  --fx-color-card: #151A23; /* Card */
  --fx-color-raised: #1C222C; /* Raised */
  --fx-color-hover: #242B36; /* Hover */
  --fx-color-graphite: #3A4150; /* Graphite */
  --fx-color-steel: #9AA3B2; /* Steel */
  --fx-color-paper: #E9EDF2; /* Paper */
  --fx-color-white: #FFFFFF; /* White */
  --fx-color-hairline-dark: #232A36; /* Hairline (dark) */
  --fx-color-hairline-light: #E2E6EB; /* Hairline (light) */
  --fx-color-signal: #00C2D1; /* Signal Cyan */
  --fx-color-signal-press: #00A0AD; /* Signal Cyan pressed */
  --fx-color-signal-deep: #00828D; /* Signal Cyan deep */
  --fx-color-signal-text-light: #00737D; /* Signal text (light) */
  --fx-color-success-dark: #18A957; /* Success (dark UI) */
  --fx-color-success-light: #147A3A; /* Success (light UI) */
  --fx-color-success-text-dark: #2FBF6E; /* Success text (dark UI) */
  --fx-color-warning-dark: #E8A317; /* Warning (dark UI) */
  --fx-color-warning-light: #AB4F09; /* Warning (light UI) */
  --fx-color-danger-dark: #E5484D; /* Danger (dark UI) */
  --fx-color-danger-light: #C4292E; /* Danger (light UI) */
  --fx-color-danger-text-dark: #F07275; /* Danger text (dark UI) */
  --fx-color-info-dark: #5AA9E6; /* Info (dark UI) */
  --fx-color-info-light: #1C6DB4; /* Info (light UI) */

  /* data: Data colours for charts, deviation maps and categorical series. Never the accent hue. */
  --fx-data-dev-1: #3346FF;
  --fx-data-dev-2: #7E92FF;
  --fx-data-dev-3: #18A957;
  --fx-data-dev-4: #E8A317;
  --fx-data-dev-5: #E5484D;
  --fx-data-dev-out: #5A6270;
  --fx-data-cat-1: #7E92FF;
  --fx-data-cat-2: #E39A5B;
  --fx-data-cat-3: #B285FF;
  --fx-data-cat-4: #5BC98A;
  --fx-data-cat-5: #E06C9F;
  --fx-data-cat-6: #C9B458;
  --fx-data-cat-7: #5AA9E6;
  --fx-data-cat-8: #9AA4B2;

  /* material: Material swatches for icons and the shop. */
  --fx-material-pla: #5BC98A;
  --fx-material-petg: #5AA9E6;
  --fx-material-abs: #E39A5B;
  --fx-material-pa: #C9B458;
  --fx-material-tpu: #E06C9F;
  --fx-material-resin-standard: #B285FF;
  --fx-material-resin-tough: #7E92FF;
  --fx-material-carbon: #3A4150;

  /* font: Font stacks. Faces are self-hosted, never loaded from a CDN. */
  --fx-font-display: "Space Grotesk", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
  --fx-font-text: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --fx-font-mono: "JetBrains Mono", "Cascadia Mono", Consolas, ui-monospace, monospace;

  /* weight: Font weights used by the three faces. */
  --fx-weight-regular: 400;
  --fx-weight-medium: 500;
  --fx-weight-semibold: 600;
  --fx-weight-bold: 700;

  /* text: Web type scale. Larger steps are fluid via clamp(). */
  --fx-text-xs: .8125rem;
  --fx-text-sm: .9375rem;
  --fx-text-md: clamp(1rem, .95rem + .2vw, 1.0625rem);
  --fx-text-lg: clamp(1.125rem, 1rem + .6vw, 1.3125rem);
  --fx-text-xl: clamp(1.375rem, 1.2rem + .8vw, 1.625rem);
  --fx-text-2xl: clamp(1.75rem, 1.4rem + 1.6vw, 2.5rem);
  --fx-text-3xl: clamp(2.25rem, 1.7rem + 2.4vw, 3.25rem);
  --fx-text-display: clamp(2.75rem, 2rem + 3.6vw, 4.5rem);

  /* leading: Unitless line heights. */
  --fx-leading-tight: 1.1;
  --fx-leading-snug: 1.3;
  --fx-leading-body: 1.6;

  /* tracking: Letter spacing. */
  --fx-tracking-tight: -0.02em;
  --fx-tracking-label: .06em;
  --fx-tracking-eyebrow: .12em;

  /* space: Spacing scale. Base 4 px, rhythm 8 px. */
  --fx-space-0: 0;
  --fx-space-2: .125rem;
  --fx-space-4: .25rem;
  --fx-space-8: .5rem;
  --fx-space-12: .75rem;
  --fx-space-16: 1rem;
  --fx-space-24: 1.5rem;
  --fx-space-32: 2rem;
  --fx-space-40: 2.5rem;
  --fx-space-48: 3rem;
  --fx-space-64: 4rem;
  --fx-space-96: clamp(4rem, 8vw, 6rem);
  --fx-space-128: clamp(5rem, 10vw, 8rem);

  /* radius: Corner radii. No large rounded corners. */
  --fx-radius-0: 0;
  --fx-radius-2: 2px;
  --fx-radius-4: 4px;
  --fx-radius-6: 6px;
  --fx-radius-8: 8px;
  --fx-radius-pill: 999px;

  /* chamfer: Size of the 45 degree corner cut for feature cards and the hero field. */
  --fx-chamfer: 12px;

  /* shadow: Elevation. Flat by default; shadows only for floating things. */
  --fx-shadow-panel: 0 1px 2px rgb(11 14 20/.04), 0 8px 24px -12px rgb(11 14 20/.12);
  --fx-shadow-lift: 0 2px 4px rgb(11 14 20/.06), 0 24px 48px -20px rgb(11 14 20/.22);
  --fx-shadow-signal: 0 0 0 1px rgb(0 194 209/.4), 0 12px 32px -12px rgb(0 194 209/.35);

  /* motion: Durations and easing. Nothing loops. Durations are zeroed under prefers-reduced-motion. */
  --fx-motion-fast: 90ms;
  --fx-motion-base: 160ms;
  --fx-motion-slow: 220ms;
  --fx-motion-camera: 350ms;
  --fx-motion-hero: 2400ms;
  --fx-ease: cubic-bezier(.2,0,0,1);
  --fx-ease-camera: ease-in-out;

  /* layout: Page layout sizes. */
  --fx-content: 1180px;
  --fx-wide: 1440px;
  --fx-panel: 320px;
  --fx-dialog-max: 640px;
  --fx-grid-size: 44px;
  --fx-icon-16: 16px;
  --fx-icon-20: 20px;
  --fx-icon-24: 24px;
  --fx-icon-48: 48px;
  --fx-border-1: 1px;
  --fx-border-2: 2px;

  /* zIndex: Stacking order. Unitless, spaced so layers can be inserted between them. */
  --fx-z-content: 100;
  --fx-z-header: 300;
  --fx-z-fab: 350;
  --fx-z-popover: 400;
  --fx-z-tooltip: 500;
  --fx-z-toast: 600;
  --fx-z-backdrop: 700;
  --fx-z-dialog: 800;
  --fx-z-progress: 900;

  /* control: Control sizes. */
  --fx-control-h: 44px;
  --fx-control-h-app: 28px;

  /* hairline: Hairline width. */
  --fx-hairline: 1px;

  /* semantic colours, dark theme (default) */
  --fx-bg: #11151C; /* carbon */
  --fx-bg-page: #0B0E14; /* ink */
  --fx-bg-elevated: #151A23; /* card */
  --fx-bg-raised: #1C222C; /* raised */
  --fx-bg-hover: #242B36; /* hover */
  --fx-bg-inverse: #FFFFFF; /* white */
  --fx-fg: #E9EDF2; /* paper */
  --fx-fg-secondary: #A6AEBB;
  --fx-fg-muted: #9AA3B2; /* steel */
  --fx-fg-inverse: #0B0E14; /* ink */
  --fx-line: #232A36; /* hairline-dark */
  --fx-line-strong: #646C7B;
  --fx-accent: #00C2D1; /* signal */
  --fx-accent-press: #00A0AD; /* signal-press */
  --fx-accent-soft: rgb(0 194 209 / .14);
  --fx-on-accent: #0B0E14; /* ink */
  --fx-link: #00C2D1; /* signal */
  --fx-focus: #00C2D1; /* signal */
  --fx-success: #18A957; /* success-dark */
  --fx-success-text: #2FBF6E; /* success-text-dark */
  --fx-warning: #E8A317; /* warning-dark */
  --fx-warning-text: #E8A317; /* warning-dark */
  --fx-danger: #E5484D; /* danger-dark */
  --fx-danger-text: #F07275; /* danger-text-dark */
  --fx-info: #5AA9E6; /* info-dark */
  --fx-info-text: #5AA9E6; /* info-dark */
  --fx-grid-line: rgb(233 237 242 / .06);
}

/* semantic colours, light theme */
[data-theme="light"] {
  --fx-bg: #FFFFFF; /* white */
  --fx-bg-page: #E9EDF2; /* paper */
  --fx-bg-elevated: #FFFFFF; /* white */
  --fx-bg-raised: #F4F6F8;
  --fx-bg-hover: #E9EDF2; /* paper */
  --fx-bg-inverse: #0B0E14; /* ink */
  --fx-fg: #0B0E14; /* ink */
  --fx-fg-secondary: #3A4150; /* graphite */
  --fx-fg-muted: #5F6672;
  --fx-fg-inverse: #FFFFFF; /* white */
  --fx-line: #E2E6EB; /* hairline-light */
  --fx-line-strong: #878F9C;
  --fx-accent: #00828D; /* signal-deep */
  --fx-accent-press: #00737D; /* signal-text-light */
  --fx-accent-soft: rgb(0 130 141 / .12);
  --fx-on-accent: #FFFFFF; /* white */
  --fx-link: #00737D; /* signal-text-light */
  --fx-focus: #00828D; /* signal-deep */
  --fx-success: #147A3A; /* success-light */
  --fx-success-text: #147A3A; /* success-light */
  --fx-warning: #AB4F09; /* warning-light */
  --fx-warning-text: #AB4F09; /* warning-light */
  --fx-danger: #C4292E; /* danger-light */
  --fx-danger-text: #C4292E; /* danger-light */
  --fx-info: #1C6DB4; /* info-light */
  --fx-info-text: #1C6DB4; /* info-light */
  --fx-grid-line: rgb(11 14 20 / .07);
}

/* semantic colours, dark theme (inside a light subtree) */
[data-theme="dark"] {
  --fx-bg: #11151C; /* carbon */
  --fx-bg-page: #0B0E14; /* ink */
  --fx-bg-elevated: #151A23; /* card */
  --fx-bg-raised: #1C222C; /* raised */
  --fx-bg-hover: #242B36; /* hover */
  --fx-bg-inverse: #FFFFFF; /* white */
  --fx-fg: #E9EDF2; /* paper */
  --fx-fg-secondary: #A6AEBB;
  --fx-fg-muted: #9AA3B2; /* steel */
  --fx-fg-inverse: #0B0E14; /* ink */
  --fx-line: #232A36; /* hairline-dark */
  --fx-line-strong: #646C7B;
  --fx-accent: #00C2D1; /* signal */
  --fx-accent-press: #00A0AD; /* signal-press */
  --fx-accent-soft: rgb(0 194 209 / .14);
  --fx-on-accent: #0B0E14; /* ink */
  --fx-link: #00C2D1; /* signal */
  --fx-focus: #00C2D1; /* signal */
  --fx-success: #18A957; /* success-dark */
  --fx-success-text: #2FBF6E; /* success-text-dark */
  --fx-warning: #E8A317; /* warning-dark */
  --fx-warning-text: #E8A317; /* warning-dark */
  --fx-danger: #E5484D; /* danger-dark */
  --fx-danger-text: #F07275; /* danger-text-dark */
  --fx-info: #5AA9E6; /* info-dark */
  --fx-info-text: #5AA9E6; /* info-dark */
  --fx-grid-line: rgb(233 237 242 / .06);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --fx-motion-fast: 0ms;
    --fx-motion-base: 0ms;
    --fx-motion-slow: 0ms;
    --fx-motion-camera: 0ms;
    --fx-motion-hero: 0ms;
  }
}