/* Source · design system partagé · TOKENS
   Extrait du comparateur (src/source_core/web/app.css) : mêmes couleurs, mode sombre identique. Aucune dépendance de build.
   Un service = une page statique qui charge /ui/tokens.css puis /ui/components.css (puis son propre app.css). Le thème se pose sur <html data-theme="light|dark">
   (voir base.js : SU.initTheme) ; sans attribut, le thème suit le système. */
:root,[data-theme=light]{
  --bg:#f3f4f6;--surface:#fff;--raised:#f7f8fa;--hover:#f1f3f5;--line:#e8eaee;--line2:#d9dce2;
  --tx:#14171c;--mut:#6b7280;--faint:#9ca3af;
  --acc:#1f9d6b;--accsoft:rgba(31,157,107,.12);--accfg:#fff;
  --best:#14171c;--bestbg:#eceef2;--warn:#9a6700;--warnsoft:rgba(154,103,0,.12);--bad:#d33;--badsoft:rgba(221,51,51,.1);
  --shadow:0 12px 34px rgba(20,30,50,.14);--scrim:rgba(0,0,0,.5);
  --up:rgba(34,170,90,.38);--down:rgba(226,69,69,.36);
}
[data-theme=dark]{
  --bg:#0c0f14;--surface:#12161d;--raised:#171c25;--hover:#1b212b;--line:#222a35;--line2:#2f3947;
  --tx:#e8edf3;--mut:#8b97a8;--faint:#5d6a7c;
  --acc:#3ecf8e;--accsoft:rgba(62,207,142,.14);--accfg:#04210f;
  --best:#e8edf3;--bestbg:#222b38;--warn:#e0a52b;--warnsoft:rgba(224,165,43,.15);--bad:#ff6b6b;--badsoft:rgba(255,107,107,.12);
  --shadow:0 12px 40px rgba(0,0,0,.5);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme]){
    --bg:#0c0f14;--surface:#12161d;--raised:#171c25;--hover:#1b212b;--line:#222a35;--line2:#2f3947;
    --tx:#e8edf3;--mut:#8b97a8;--faint:#5d6a7c;
    --acc:#3ecf8e;--accsoft:rgba(62,207,142,.14);--accfg:#04210f;
    --best:#e8edf3;--bestbg:#222b38;--warn:#e0a52b;--warnsoft:rgba(224,165,43,.15);--bad:#ff6b6b;--badsoft:rgba(255,107,107,.12);
    --shadow:0 12px 40px rgba(0,0,0,.5);
  }
}
:root{
  /* rayons */ --r-xs:6px;--r-sm:8px;--r-md:10px;--r-lg:14px;--r-xl:18px;--r-pill:99px;
  /* espacements */ --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;
  /* typo */ --font:"Figtree",system-ui,"Segoe UI",Roboto,sans-serif;--fs-xs:11px;--fs-sm:12.5px;--fs-md:14px;--fs-lg:16px;--fs-xl:19px;--fs-2xl:23px;
  /* gabarits */ --h-top:56px;--h-nav:58px;--safe-b:env(safe-area-inset-bottom,0px);--safe-t:env(safe-area-inset-top,0px);
  --z-top:30;--z-sheet:70;--z-modal:90;
}
*{box-sizing:border-box}
[x-cloak]{display:none!important}
html{color-scheme:light dark;-webkit-text-size-adjust:100%}
html[data-theme=light]{color-scheme:light}html[data-theme=dark]{color-scheme:dark}
body{margin:0;background:var(--bg);color:var(--tx);font:var(--fs-md)/1.4 var(--font);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0;-webkit-tap-highlight-color:transparent}
input,select{font:inherit;color:inherit}
a{color:inherit}
em{font-style:normal}img{display:block}
.muted{color:var(--mut)}.faint{color:var(--faint)}.grow{flex:1}.pos{color:var(--acc)}.neg{color:var(--bad)}.num{font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
