/* GENERATED from design-system/dist/nostelema-ds.css (tokens) — do not edit */
:root {
  /* --- Brand: orange (primary) --- */
  --nl-color-orange-50: #fef6ef;
  --nl-color-orange-100: #fde8d5;
  --nl-color-orange-200: #f9caa0;
  --nl-color-orange-300: #f5af70;
  --nl-color-orange-400: #f29440;
  --nl-color-orange-500: #ef7910; /* primary */
  --nl-color-orange-600: #d76d0f;
  --nl-color-orange-700: #b45a0c;

  /* --- Brand: red (accent / energy) --- */
  --nl-color-red-400: #e64a50;
  --nl-color-red-500: #dd1f26; /* accent */
  --nl-color-red-600: #b81820;

  /* --- Brand: navy (secondary) --- */
  --nl-color-navy-300: #6b829e;
  --nl-color-navy-400: #4b6688;
  --nl-color-navy-500: #334d6e;
  --nl-color-navy-600: #1b3453; /* secondary */
  --nl-color-navy-700: #12233a;

  /* --- Neutrals --- */
  --nl-color-white: #ffffff;
  --nl-color-gray-50: #f7f7f7;
  --nl-color-gray-100: #eeeeee;
  --nl-color-gray-200: #e5e7e7;
  --nl-color-gray-300: #d8dbdb;
  --nl-color-gray-400: #b8bcbc;
  --nl-color-gray-500: #999999;
  --nl-color-gray-600: #666666;
  --nl-color-gray-700: #4d4d4d;
  --nl-color-gray-800: #333333;
  --nl-color-ink: #1a1a1a;
  --nl-color-black: #000000;

  /* --- Night surfaces: navy + black blends, darkest -> lightest (stage, bands, raised cards) --- */
  --nl-color-bg-night-0: color-mix(in oklab, var(--nl-color-navy-700) 52%, var(--nl-color-black));
  --nl-color-bg-night-1: color-mix(in oklab, var(--nl-color-navy-700) 82%, var(--nl-color-black));
  --nl-color-bg-night-2: color-mix(in oklab, var(--nl-color-navy-600) 52%, var(--nl-color-bg-night-1));

  /* --- Semantic --- */
  --nl-color-primary: var(--nl-color-orange-500);
  --nl-color-primary-hover: var(--nl-color-orange-600);
  --nl-color-accent: var(--nl-color-red-500);
  --nl-color-accent-hover: var(--nl-color-red-600);
  --nl-color-secondary: var(--nl-color-navy-600);
  --nl-color-success: #2e7d32;
  --nl-color-warning: var(--nl-color-orange-400);
  --nl-color-danger: var(--nl-color-red-500);
  --nl-color-info: var(--nl-color-navy-500);

  --nl-color-text: var(--nl-color-ink);
  --nl-color-text-muted: var(--nl-color-gray-600);
  --nl-color-text-inverse: var(--nl-color-white);
  /* body copy on navy/night: >= 9.2:1 */
  --nl-color-text-inverse-muted: color-mix(in srgb, var(--nl-color-white) 84%, var(--nl-color-navy-700));
  /* orange text/fills on dark: 5.5-8.7:1 / 6.8-10.7:1; labels, links, numerals — not body copy */
  --nl-color-primary-inverse: var(--nl-color-orange-400);
  --nl-color-primary-inverse-soft: var(--nl-color-orange-300);
  --nl-color-bg: var(--nl-color-white);
  --nl-color-bg-muted: var(--nl-color-gray-50);
  --nl-color-bg-inverse: var(--nl-color-ink);
  --nl-color-border: var(--nl-color-gray-200);

  /* --- Typography --- */
  --nl-font-heading: "Poppins", "Segoe UI", system-ui, sans-serif;
  --nl-font-body: "Roboto", "Segoe UI", system-ui, sans-serif;
  /* Anton: headlines and big numerals ONLY, weight 400, never body/labels; the one display face */
  --nl-font-display: "Anton", Impact, "Haettenschweiler", "Arial Narrow Bold", sans-serif;

  --nl-text-xs: 0.75rem;   /* 12 */
  --nl-text-sm: 0.875rem;  /* 14 */
  --nl-text-base: 1rem;    /* 16 */
  --nl-text-lg: 1.125rem;  /* 18 */
  --nl-text-xl: 1.25rem;   /* 20 */
  --nl-text-2xl: 1.5rem;   /* 24 */
  --nl-text-3xl: 1.875rem; /* 30 */
  --nl-text-4xl: 2.375rem; /* 38 */
  --nl-text-5xl: 3rem;     /* 48 */
  --nl-text-6xl: 3.75rem;  /* 60 */

  --nl-font-light: 300;
  --nl-font-regular: 400;
  --nl-font-medium: 500;
  --nl-font-semibold: 600;
  --nl-font-bold: 700;

  --nl-leading-tight: 1.15;
  --nl-leading-snug: 1.3;
  --nl-leading-normal: 1.6;

  /* --- Spacing (4px base) --- */
  --nl-space-1: 0.25rem;  /* 4 */
  --nl-space-2: 0.5rem;   /* 8 */
  --nl-space-3: 0.75rem;  /* 12 */
  --nl-space-4: 1rem;     /* 16 */
  --nl-space-5: 1.5rem;   /* 24 */
  --nl-space-6: 2rem;     /* 32 */
  --nl-space-7: 3rem;     /* 48 */
  --nl-space-8: 4rem;     /* 64 */
  --nl-space-9: 6rem;     /* 96 */

  /* --- Radius --- */
  --nl-radius-sm: 4px;
  --nl-radius-md: 8px;
  --nl-radius-lg: 16px;
  --nl-radius-xl: 24px;
  --nl-radius-pill: 999px;

  /* --- Shadows --- */
  --nl-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.08);
  --nl-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
  --nl-shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.14);

  /* --- Layout --- */
  --nl-container-max: 1200px;
  --nl-transition: 160ms ease; /* @kind other */
}
