/* ============================================================
   MobiStore — charte graphique (tokens partagés boutique + admin)
   Marque : orange / noir / blanc. Style : "Vibrant & Block-based"
   (boutique) et "Minimalism & Swiss" (admin). Voir design-system/.
   ============================================================ */
@font-face{font-family:"Rubik";src:url(/fonts/rubik.woff2) format("woff2");font-weight:300 900;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito Sans";src:url(/fonts/nunito-sans.woff2) format("woff2");font-weight:200 1000;font-style:normal;font-display:swap}
@font-face{font-family:"Fira Sans";src:url(/fonts/fira-sans-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Fira Sans";src:url(/fonts/fira-sans-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Fira Sans";src:url(/fonts/fira-sans-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Fira Sans";src:url(/fonts/fira-sans-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Fira Code";src:url(/fonts/fira-code.woff2) format("woff2");font-weight:300 700;font-display:swap}

:root{
  color-scheme:light;
  /* --- marque --- */
  --o:#ff7900;          /* aplats, boutons (texte noir dessus : 8,0:1) */
  --o2:#e56a00;         /* survol, graphiques (3,3:1 sur blanc) */
  --od:#e56a00;
  --ot:#b34f00;         /* orange en TEXTE sur clair (5,2:1) */
  --on-o:#000;
  /* --- encre & surfaces --- */
  --k:#0b0b0c;          /* noir de marque, en-têtes, boutons principaux */
  --ink:#15171a;
  --w:#fff;
  --card:#fff;
  --bg:#f4f5f7;         /* fond des pages applicatives */
  --g1:#f4f5f7;         /* surface secondaire */
  --g2:#e1e4e8;         /* séparateurs (décoratifs) */
  --g3:#595959;         /* texte secondaire (6,4:1) */
  --muted:#667085;
  --line:#e1e4e8;
  --line-strong:#8a919e;/* bordures de champs (3,2:1) */
  --ring:#000;          /* anneau de focus */
  /* --- statuts (texte / fond) --- */
  --ok:#0e7a45;--okb:#dcfce7;
  --warn:#a15c07;--warnb:#fef3c7;
  --bad:#b42318;--badb:#fee4e2;
  --info:#175cd3;--infob:#dbeafe;
  /* --- typographie --- */
  --font-head:"Rubik",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-body:"Nunito Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-admin:"Fira Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-mono:"Fira Code",ui-monospace,SFMono-Regular,Menlo,monospace;
  --fs-xs:.75rem;--fs-sm:.875rem;--fs-md:1rem;--fs-lg:1.125rem;--fs-xl:1.5rem;--fs-2xl:2rem;--fs-3xl:clamp(2.1rem,5.2vw,3.5rem);
  /* --- espacement (rythme 4/8) --- */
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;
  /* --- forme & relief : angles droits (charte) --- */
  --r:0;
  --sh:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.08);
  --sh-2:0 16px 36px rgba(0,0,0,.12);
  /* --- mouvement --- */
  --dur-1:150ms;--dur-2:250ms;--dur-3:400ms;
  --ease-out:cubic-bezier(.2,.7,.2,1);--ease-in:cubic-bezier(.4,0,1,1);
}
@media(prefers-reduced-motion:reduce){:root{--dur-1:.01ms;--dur-2:.01ms;--dur-3:.01ms}}