@layer tokens {
/* =============================================================================
   @elements/style — scale (non-color primitives)

   Type, weight, leading, tracking, spacing, radius (with semantic slots),
   shadow, motion, layering, breakpoints, container widths.
============================================================================= */

:root {

  /* Type scale ---------------------------------------------------------- */

  --text-2xs:       0.6875rem;   /* 11 */
  --text-xs:        0.75rem;     /* 12 */
  --text-sm:        0.875rem;    /* 14 */
  --text-base:      1rem;        /* 16 */
  --text-md:        1.125rem;    /* 18 */
  --text-lg:        1.25rem;     /* 20 */
  --text-xl:        1.5rem;      /* 24 */
  --text-2xl:       1.875rem;    /* 30 */
  --text-3xl:       2.25rem;     /* 36 */
  --text-4xl:       3rem;        /* 48 */
  --text-5xl:       3.75rem;     /* 60 */
  --text-6xl:       4.5rem;      /* 72 */
  --text-7xl:       6rem;        /* 96 */
  --text-8xl:       8rem;        /* 128 */

  /* Weights ------------------------------------------------------------- */

  --weight-thin:        100;
  --weight-light:       300;
  --weight-regular:     400;
  --weight-medium:      500;
  --weight-semibold:    600;
  --weight-bold:        700;
  --weight-black:       900;

  /* Leading / tracking ------------------------------------------------- */

  --leading-none:     1;
  --leading-tight:    1.15;
  --leading-snug:     1.3;
  --leading-body:     1.5;
  --leading-relaxed:  1.65;
  --leading-loose:    1.85;

  --tracking-tighter:   -0.04em;
  --tracking-tight:     -0.02em;
  --tracking-snug:      -0.01em;
  --tracking-normal:    0;
  --tracking-wide:       0.02em;
  --tracking-wider:      0.06em;
  --tracking-widest:     0.14em;

  /* Font families ------------------------------------------------------- */

  --font-sans:  ui-sans-serif, system-ui, -apple-system, "Segoe UI",
                Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji",
                "Segoe UI Emoji";
  --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono:  ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
                "Liberation Mono", monospace;

  /* Spacing — 4-based scale -------------------------------------------- */

  --space-0:        0;
  --space-px:       1px;
  --space-0-5:      0.125rem;   /*  2 */
  --space-1:        0.25rem;    /*  4 */
  --space-1-5:      0.375rem;   /*  6 */
  --space-2:        0.5rem;     /*  8 */
  --space-2-5:      0.625rem;   /* 10 */
  --space-3:        0.75rem;    /* 12 */
  --space-3-5:      0.875rem;   /* 14 */
  --space-4:        1rem;       /* 16 */
  --space-5:        1.25rem;    /* 20 */
  --space-6:        1.5rem;     /* 24 */
  --space-7:        1.75rem;    /* 28 */
  --space-8:        2rem;       /* 32 */
  --space-9:        2.25rem;    /* 36 */
  --space-10:       2.5rem;     /* 40 */
  --space-11:       2.75rem;    /* 44 */
  --space-12:       3rem;       /* 48 */
  --space-14:       3.5rem;     /* 56 */
  --space-16:       4rem;       /* 64 */
  --space-20:       5rem;       /* 80 */
  --space-24:       6rem;       /* 96 */
  --space-28:       7rem;       /* 112 */
  --space-32:       8rem;       /* 128 */
  --space-40:       10rem;      /* 160 */
  --space-48:       12rem;      /* 192 */
  --space-56:       14rem;      /* 224 */
  --space-64:       16rem;      /* 256 */

  /* Radius scale -------------------------------------------------------- */

  --radius-none:    0;
  --radius-xs:      2px;
  --radius-sm:      4px;
  --radius-md:      6px;
  --radius-lg:      8px;
  --radius-xl:      12px;
  --radius-2xl:     16px;
  --radius-3xl:     24px;
  --radius-4xl:     32px;
  --radius-full:    9999px;

  /* Shadow scale -------------------------------------------------------- */

  --shadow-xs:      0 1px 2px 0 rgb(15 23 42 / 0.04);
  --shadow-sm:      0 1px 3px 0 rgb(15 23 42 / 0.06), 0 1px 2px -1px rgb(15 23 42 / 0.04);
  --shadow-md:      0 4px 6px -1px rgb(15 23 42 / 0.07), 0 2px 4px -2px rgb(15 23 42 / 0.05);
  --shadow-lg:      0 10px 15px -3px rgb(15 23 42 / 0.08), 0 4px 6px -4px rgb(15 23 42 / 0.04);
  --shadow-xl:      0 20px 25px -5px rgb(15 23 42 / 0.09), 0 8px 10px -6px rgb(15 23 42 / 0.04);
  --shadow-2xl:     0 25px 50px -12px rgb(15 23 42 / 0.18);
  --shadow-inner:   inset 0 2px 4px 0 rgb(15 23 42 / 0.04);

  /* Motion -------------------------------------------------------------- */

  --duration-instant:  80ms;
  --duration-fast:     120ms;
  --duration-normal:   180ms;
  --duration-slow:     280ms;
  --duration-slower:   500ms;

  --ease-linear:       linear;
  --ease-out:          cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in:           cubic-bezier(0.55, 0, 1, 0.45);
  --ease-in-out:       cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring:       cubic-bezier(0.16, 1, 0.3, 1);

  /* Layering ------------------------------------------------------------ */

  --z-base:        0;
  --z-raised:      10;
  --z-sticky:      100;
  --z-fixed:       200;
  --z-overlay:     1000;
  --z-modal:       1010;
  --z-popover:     1020;
  --z-dropdown:    1030;
  --z-tooltip:     1040;
  --z-toast:       1050;
  --z-top:         2147483647;

  /* Breakpoints (reference values; @media queries hardcode the same rem
     values because var() is not valid inside a media query) ------------- */

  --bp-sm:         40rem;       /* 640 */
  --bp-md:         48rem;       /* 768 */
  --bp-lg:         64rem;       /* 1024 */
  --bp-xl:         80rem;       /* 1280 */
  --bp-2xl:        96rem;       /* 1536 */

  /* Container widths --------------------------------------------------- */

  --container-xs:        20rem;     /* 320 */
  --container-sm:        24rem;     /* 384 */
  --container-md:        28rem;     /* 448 */
  --container-lg:        32rem;     /* 512 */
  --container-xl:        36rem;     /* 576 */
  --container-2xl:       42rem;     /* 672 */
  --container-3xl:       48rem;     /* 768 */
  --container-4xl:       56rem;     /* 896 */
  --container-5xl:       64rem;     /* 1024 */
  --container-6xl:       72rem;     /* 1152 */
  --container-7xl:       80rem;     /* 1280 */
  --container-prose:     65ch;
  --container-shell:     72rem;
  --container-wide:      80rem;
  --container-padding:   var(--space-8);
}
}