/* ════════════════════════════════════════════════════════
   TIITII NBA — Design Tokens
   ════════════════════════════════════════════════════════ */
:root {
  /* Couleurs */
  --c-bg:          #101010;
  --c-surface:     #191919;
  --c-surface-2:   #222222;
  --c-surface-3:   #2c2c2c;
  --c-accent:      #0887F8;
  --c-accent-2:    #0070d8;
  --c-accent-dim:  rgba(8,135,248,.12);
  --c-accent-glow: rgba(8,135,248,.35);
  --c-text:        #F2F2F2;
  --c-muted:       rgba(242,242,242,.60);
  --c-dim:         rgba(242,242,242,.30);
  --c-border:      rgba(242,242,242,.07);
  --c-border-h:    rgba(242,242,242,.16);
  --c-error:       #ff4d4d;
  --c-success:     #22c55e;
  --c-warn:        #f59e0b;

  /* Typographie */
  --f-title: 'Bebas Neue', sans-serif;
  --f-sub:   'Barlow Condensed', sans-serif;
  --f-body:  'DM Sans', sans-serif;

  /* Échelle */
  --t-2xs: .625rem;
  --t-xs:  .75rem;
  --t-sm:  .875rem;
  --t-md:  1rem;
  --t-lg:  1.125rem;
  --t-xl:  1.25rem;
  --t-2xl: 1.5rem;
  --t-3xl: 1.875rem;
  --t-4xl: 2.25rem;
  --t-5xl: 3rem;
  --t-6xl: 3.75rem;
  --t-7xl: 4.5rem;
  --t-8xl: 6rem;
  --t-9xl: 8rem;

  /* Letterspacing */
  --ls-n:  -0.025em;
  --ls-0:   0;
  --ls-1:   0.05em;
  --ls-2:   0.10em;
  --ls-3:   0.20em;

  /* Interligne */
  --lh-tight:   1.15;
  --lh-normal:  1.5;
  --lh-relaxed: 1.75;

  /* Espacement (base 4px) */
  --s-1:  .25rem;
  --s-2:  .5rem;
  --s-3:  .75rem;
  --s-4:  1rem;
  --s-5:  1.25rem;
  --s-6:  1.5rem;
  --s-8:  2rem;
  --s-10: 2.5rem;
  --s-12: 3rem;
  --s-16: 4rem;
  --s-20: 5rem;
  --s-24: 6rem;
  --s-32: 8rem;

  /* Layout */
  --w-max:  1240px;
  --w-wide: 1440px;
  --w-md:   820px;
  --w-sm:   600px;
  --header-h: 68px;

  /* Transitions */
  --ease:        cubic-bezier(.4,0,.2,1);
  --ease-out:    cubic-bezier(0,0,.2,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
  --dur-fast:  140ms;
  --dur-base:  280ms;
  --dur-slow:  560ms;

  /* Rayons */
  --r-sm:   3px;
  --r-md:   8px;
  --r-lg:   16px;
  --r-xl:   24px;
  --r-full: 9999px;

  /* Ombres */
  --sh-sm:   0 1px 4px rgba(0,0,0,.4);
  --sh-md:   0 4px 20px rgba(0,0,0,.5);
  --sh-lg:   0 16px 56px rgba(0,0,0,.65);
  --sh-glow: 0 0 40px rgba(8,135,248,.28);

  /* Z-index */
  --z-1:      1;
  --z-10:    10;
  --z-header:100;
  --z-over:  200;
  --z-modal: 300;
  --z-toast: 400;
  --z-cursor:500;
}
