.scc-root { font-family:'IBM Plex Sans',-apple-system,system-ui,sans-serif; font-size:var(--scc-fs-base); line-height:var(--scc-lh); -webkit-font-smoothing:antialiased; background:var(--scc-bg); color:var(--scc-text); }
.scc-root *{box-sizing:border-box}
/* L'attribut HTML `hidden` masque, quelle que soit la règle `display` du composant : sans
   `!important`, `.scc-site-grid{display:grid}` ou `.scc-card-link{display:block}` battaient la
   feuille du navigateur, et les filtres du tableau de bord ne masquaient rien. */
[hidden]{display:none!important}
.scc-root button{cursor:pointer;font-family:inherit}
/* Focus clavier (WCAG 2.4.7) : anneau accent sur tout élément atteint au clavier, jamais au
   clic (:focus-visible). L'accent fait au moins 4,5:1 sur les quatre fonds ; sur les boutons
   pleins, la variante foncée se détache du fond du bouton. */
.scc-root :focus-visible{outline:2px solid var(--scc-accent);outline-offset:2px}
.scc-root .scc-btn-primary:focus-visible,.scc-root .scc-btn-accent:focus-visible{outline-color:var(--scc-accent-dark)}
/* Lien d'évitement (N25) : hors écran, il descend au focus clavier. Fixe et au-dessus du shell
   (.scc-app est en position fixe sur toute la fenêtre), sous les fenêtres modales (90, 95). */
.scc-skip{position:fixed;top:8px;left:8px;z-index:100;padding:8px 14px;border-radius:var(--scc-r-input);background:var(--scc-accent);color:#fff;font-size:13px;font-weight:600;transform:translateY(-200%)}
.scc-skip:focus{transform:none}
/* <main> reçoit le focus du lien d'évitement : anneau tracé à l'intérieur, le conteneur qui
   défile (.scc-app-main) couperait un anneau extérieur. */
.scc-root .scc-main:focus-visible{outline-offset:-2px}
.scc-root a{text-decoration:none}
/* Liens (C-08) : un lien sans classe prend l'accent (jamais le bleu du navigateur, #0000ee), souligné
   au survol et au focus. :where = spécificité d'une classe : tout lien à classe, et les liens de
   tableau (.scc-table a, au style du texte), gardent leur couleur. .scc-link : lien d'action
   explicite, y compris dans un tableau. La barre latérale (liens sans classe autour de
   .scc-nav-item) ne se souligne pas. */
.scc-root :where(a:not([class])){color:var(--scc-accent)}
.scc-root :where(a:not([class])):hover,.scc-root :where(a:not([class])):focus-visible{text-decoration:underline}
.scc-root .scc-link{color:var(--scc-accent);font-weight:600}
.scc-root .scc-link:hover,.scc-root .scc-link:focus-visible{color:var(--scc-accent-dark);text-decoration:underline}
.scc-root .scc-nav-group a:hover,.scc-root .scc-nav-group a:focus-visible{text-decoration:none}
/* Fieldset et légende du navigateur (bordure en relief, marges) neutralisés sous la racine (C-02) ;
   :where garde une spécificité nulle : .scc-fieldset et .scc-legend l'emportent. */
:where(.scc-root) fieldset{border:0;padding:0;margin:0;min-width:0}
:where(.scc-root) legend{padding:0}
.scc-mono{font-family:'IBM Plex Mono',ui-monospace,monospace}
.scc-muted{color:var(--scc-muted)}
.scc-card{background:var(--scc-surface);border:1px solid var(--scc-border);border-radius:var(--scc-r-card);box-shadow:var(--scc-sh-card)}
/* Marge intérieure des cartes de texte simple (N32 f). Pas sur .scc-card : les cartes à en-tête
   ou à liste pleine largeur gèrent la leur. */
.scc-card-pad{padding:16px 18px}
/* Boutons (C-10) : une hauteur (--scc-btn-h, 38 px), une définition par variante. Chaque variante
   fonctionne seule ou avec .scc-btn : la base est partagée. L'ancien .scc-btn-ghost (alias de
   .scc-btn-secondary) est retiré par la reprise R : plus aucun gabarit ne le porte. */
.scc-btn,.scc-btn-primary,.scc-btn-secondary,.scc-btn-danger{height:var(--scc-btn-h);display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:0 14px;border:1px solid var(--scc-border);border-radius:var(--scc-r-input);background:var(--scc-surface);color:var(--scc-text2);font-family:inherit;font-size:13px;font-weight:600;text-decoration:none;cursor:pointer}
.scc-btn-primary{background:var(--scc-accent);border-color:var(--scc-accent);color:#fff}
.scc-btn-primary:hover{background:var(--scc-accent-dark);border-color:var(--scc-accent-dark)}
.scc-btn-secondary:hover{background:var(--scc-surf2)}
.scc-btn-danger{color:#b91c1c}
.scc-btn-danger:hover{background:#fef2f2}
/* Bouton pleine largeur (action unique d'une carte : « Ouvrir un ticket »). */
.scc-btn--block{display:flex;width:100%}
/* Animation d'entrée (C-13, DS §5) : la classe existait sans règle ; coupée si l'utilisateur réduit
   les animations. */
.scc-in{animation:scc-in .25s ease}
@media (prefers-reduced-motion: reduce){.scc-in{animation:none}}
/* Titre de section : une seule définition (C-06, DS §3 : 16 px / 600) ; marge haute nulle en tête de
   carte (components.css). */
.scc-section-title{font-size:16px;font-weight:600;color:var(--scc-text);margin:28px 0 12px}
@keyframes scc-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes scc-pulse{0%,100%{opacity:1}50%{opacity:.4}}
.scc-root ::-webkit-scrollbar{width:11px;height:11px}
.scc-root ::-webkit-scrollbar-thumb{background:#d3d9e3;border-radius:7px;border:3px solid transparent;background-clip:content-box}