/* Numeric and structural foundations. Appearance bindings are generated
   from design-system/skins/<id>/skin.json into active-skin.css. */

:root {
  color-scheme: light;

  --space-hair: 1px;
  --space-half: 2px;
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-7:  32px;
  --space-8:  40px;
  --space-9:  48px;
  --space-10: 64px;
  --space-11: 80px;
  --space-12: 96px;

  --radius-2xs: 2px;
  --radius-xs:  4px;
  --radius-sm:  8px;
  --radius-md:  12px;
  --radius-lg:  16px;
  --radius-xl:  24px;
  --radius-2xl: 32px;
  --radius-pill: 9999px;

  --radius-circle: 50%;


  --target-min: 44px;

  --halo-hair: 0 0 0 1px;
  --halo-xs:   0 0 0 2px;
  --halo-sm:   0 0 0 3px;
  --halo-md:   0 0 0 4px;
  --halo-lg:   0 0 0 6px;

  --focus-ring-width:        3px;
  --focus-ring-width-thin:   2px;
  --focus-ring-offset:       2px;
  --focus-ring-offset-wide:  3px;
  --focus-ring-offset-wider: 4px;

  --border-width:        1px;
  --border-width-strong: 2px;
  --border-width-accent: 3px;

  --z-sticky:    20;
  --z-overlay:   60;
  --z-fab:       90;
  --z-search:    100;
  --z-header:    110;
  --z-dropdown:  200;
  --z-toast:     9999;
  --z-skip-link: 9999;

  --ease-out:    cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  --ease-emphasised: cubic-bezier(0.22, 1, 0.36, 1);

  --ease-exit:   cubic-bezier(0.4, 0, 1, 1);
  --dur-fast:    120ms;
  --dur-quick:   150ms;
  --dur-base:    200ms;
  --dur-slow:    320ms;

  --dur-spin-fast: 0.7s;
  --dur-spin:      1s;
  --dur-pulse:     2.4s;

  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-md:   18px;
  --text-lg:   20px;
  --text-xl:   24px;
  --text-2xl:  30px;
  --text-3xl:  38px;
  --text-4xl:  48px;
  --text-5xl:  64px;
  --text-6xl:  80px;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semi:    600;
  --fw-bold:    700;
  --fw-black:   800;

  --leading-none:          1;
  --leading-display-tight: 1.04;
  --leading-display:       1.08;
  --leading-tight:         1.1;
  --leading-heading:       1.2;
  --leading-snug:          1.25;
  --leading-compact:       1.3;
  --leading-ui:            1.4;
  --leading-normal:        1.5;
  --leading-body:          1.55;
  --leading-relaxed:       1.6;
  --leading-loose:         1.7;

  --tracking-tight:     -0.02em;
  --tracking-snug:      -0.01em;
  --tracking-subtle:    -0.005em;
  --tracking-normal:    0;
  --tracking-open:      0.02em;
  --tracking-label:     0.04em;
  --tracking-wide:      0.06em;
  --tracking-caps:      0.08em;
  --tracking-caps-md:   0.12em;
  --tracking-caps-lg:   0.14em;
  --tracking-caps-xl:   0.18em;
  --tracking-caps-mono: 0.22em;

  --layout-content:  1120px;
  --layout-sidebar:  1280px;
  --layout-dense:    1440px;
  --layout-reading:  720px;
  --layout-results:  920px;

  --measure:        64ch;
  --measure-narrow: 56ch;
  --measure-wide:   70ch;

  --header-consumer-h: 64px;
  --header-portal-h:   56px;
}

[data-theme="dark"] {
  color-scheme: dark;

}

:root { --edge-highlight: inset 0 1px 0; }