/* assets/ps-ui.css — Boucle UI (03/11/2026) : socle « Paisible UI » du CONTENU des pages, sur le modèle de la page de l'assistant
   (icônes fines au trait, boutons discrets, typographie sobre, un seul bouton principal par zone).
   - Composants nouveaux, préfixe psu- : boutons, icônes, en-tête de page, cartes, pastilles.
   - Alignement des anciens boutons (.btn de style.css et voisins) : seulement sous html.psu (classe posée par header.php
     pour les pages adoptées, voir scripts/ps_ui_lib.php). Géométrie (hauteur, marges, texte, coins) en (0,2,1) ; couleurs en
     :where (0,1,0) : elles remplacent celles de style.css et des .btn génériques de la page (feuille chargée après, dans
     <body>), mais un sélecteur plus précis de la page (.zone .btn, .btn.x, #id .btn) garde ses couleurs.
   - Mode sombre : html[data-dk] (couche du site, scripts/ps_dark_lib.php). */

:root {
  --psu-brand: #185FA5; --psu-brand-hover: #134C85; --psu-brand-soft: #EAF2FA; --psu-brand-text: #185FA5;
  --psu-ink: #13314A; --psu-muted: #5A6B80; --psu-line: #D6E0EB; --psu-line-soft: #E6ECF3;
  --psu-surface: #FFFFFF; --psu-soft: #F6F8FB; --psu-hover: #F2F6FB;
  --psu-danger: #B42318; --psu-danger-soft: #FDECEA; --psu-ok: #1F7A45; --psu-ok-soft: #E6F5EC; --psu-warn: #A15C07; --psu-warn-soft: #FDF3E3;
  --psu-r: 10px; --psu-r-lg: 14px; --psu-h: 36px; --psu-h-sm: 30px; --psu-h-lg: 40px; --psu-fs: 13.5px; --psu-fs-sm: 12.5px;
  --psu-shadow: 0 1px 2px rgba(16, 40, 70, .06); --psu-focus: 0 0 0 3px rgba(24, 95, 165, .22);
  --psu-font: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
html[data-dk] {
  --psu-brand: #2B78C2; --psu-brand-hover: #3A88D2; --psu-brand-soft: #16304A; --psu-brand-text: #7DBBEA;
  --psu-ink: #E6EEF7; --psu-muted: #A9B8CC; --psu-line: #2C3E55; --psu-line-soft: #24354A;
  --psu-surface: #16202D; --psu-soft: #111A26; --psu-hover: #1C2939;
  --psu-danger: #F08A80; --psu-danger-soft: #3D1D1A; --psu-ok: #5CC48A; --psu-ok-soft: #163626; --psu-warn: #E6A84B; --psu-warn-soft: #3A2A12;
  --psu-shadow: 0 1px 2px rgba(0, 0, 0, .35); --psu-focus: 0 0 0 3px rgba(125, 187, 234, .35);
}
@media (max-width: 768px) { :root { --psu-h: 40px; --psu-h-sm: 34px; --psu-h-lg: 44px; } }

/* ---------- Icônes au trait (scripts/ps_ui_lib.php : ps_icon()) ---------- */
.psu-ico { width: 16px; height: 16px; flex: none; display: inline-block; vertical-align: -3px; fill: none; stroke: currentColor;
  stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.psu-ico--sm { width: 14px; height: 14px; } .psu-ico--lg { width: 20px; height: 20px; stroke-width: 1.6; }

/* ---------- Boutons ---------- */
.psu-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: var(--psu-h); padding: 0 14px;
  box-sizing: border-box; border: 1px solid var(--psu-line); border-radius: var(--psu-r); background: var(--psu-surface); color: var(--psu-ink);
  font: 600 var(--psu-fs)/1.2 var(--psu-font); text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: background-color .15s, border-color .15s, color .15s; -webkit-tap-highlight-color: transparent; }
.psu-btn:hover { background: var(--psu-hover); border-color: #C3D1E0; color: var(--psu-ink); text-decoration: none; }
.psu-btn:focus-visible { outline: none; box-shadow: var(--psu-focus); }
.psu-btn--primary { background: var(--psu-brand); border-color: var(--psu-brand); color: #fff; }
.psu-btn--primary:hover { background: var(--psu-brand-hover); border-color: var(--psu-brand-hover); color: #fff; }
.psu-btn--ghost { background: transparent; border-color: transparent; color: var(--psu-brand-text); }
.psu-btn--ghost:hover { background: var(--psu-brand-soft); border-color: transparent; color: var(--psu-brand-text); }
.psu-btn--danger { color: var(--psu-danger); }
.psu-btn--danger:hover { background: var(--psu-danger-soft); border-color: transparent; color: var(--psu-danger); }
.psu-btn--sm { min-height: var(--psu-h-sm); padding: 0 11px; font-size: var(--psu-fs-sm); border-radius: 9px; }
.psu-btn--lg { min-height: var(--psu-h-lg); padding: 0 18px; font-size: 14px; }
.psu-btn--icon { width: var(--psu-h); padding: 0; }
.psu-btn[disabled], .psu-btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.psu-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* ---------- En-tête de page (remplace les grands bandeaux dégradés) ---------- */
.psu-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 20px; margin: 0 0 18px; }
.psu-head__eyebrow { display: inline-block; font: 600 11.5px/1.4 var(--psu-font); letter-spacing: .06em; text-transform: uppercase; color: var(--psu-brand-text); margin: 0 0 4px; }
.psu-head__title { margin: 0; font: 700 26px/1.25 var(--psu-font); color: var(--psu-ink); text-wrap: balance; }
.psu-head__sub { margin: 6px 0 0; max-width: 68ch; font: 400 14.5px/1.55 var(--psu-font); color: var(--psu-muted); }
@media (max-width: 768px) { .psu-head__title { font-size: 22px; } }

/* ---------- Cartes, pastilles ---------- */
.psu-card { background: var(--psu-surface); border: 1px solid var(--psu-line-soft); border-radius: var(--psu-r-lg); box-shadow: var(--psu-shadow); padding: 18px 20px; }
.psu-badge { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 999px; font: 600 12px/1.5 var(--psu-font); background: var(--psu-soft); color: var(--psu-muted); }
.psu-badge--brand { background: var(--psu-brand-soft); color: var(--psu-brand-text); }
.psu-badge--ok { background: var(--psu-ok-soft); color: var(--psu-ok); }
.psu-badge--warn { background: var(--psu-warn-soft); color: var(--psu-warn); }
.psu-badge--danger { background: var(--psu-danger-soft); color: var(--psu-danger); }

/* ---------- Alignement des anciens boutons (pages adoptées : html.psu) ---------- */
/* Géométrie imposée : hauteur, marges intérieures, texte, coins (les anciens boutons faisaient 44-50 px, texte 15-16 px, coins 5 px) */
html.psu .btn, html.psu .btn-primary, html.psu .btn-secondary, html.psu .btn-danger, html.psu .btn-update, html.psu .btn-delete,
html.psu .btn-paisible, html.psu .btn-confirm, html.psu .btn-cancel {
  min-height: var(--psu-h); padding: 7px 16px; box-sizing: border-box; border-radius: var(--psu-r);
  font-family: var(--psu-font); font-size: var(--psu-fs); font-weight: 600; line-height: 1.35; letter-spacing: 0;
  background-image: none; box-shadow: none; text-shadow: none; transform: none; justify-content: center; text-align: center; }
@media (max-width: 768px) {
  html.psu .btn, html.psu .btn-primary, html.psu .btn-secondary, html.psu .btn-danger, html.psu .btn-update, html.psu .btn-delete,
  html.psu .btn-paisible, html.psu .btn-confirm, html.psu .btn-cancel { padding-top: 9px; padding-bottom: 9px; }
}
html.psu .btn:focus-visible, html.psu .btn-primary:focus-visible, html.psu .btn-secondary:focus-visible { outline: none; box-shadow: var(--psu-focus); }
/* Couleurs à spécificité basse : bleu Paisible au lieu de #007BFF / gris #CCC. Chaque sélecteur existe en .x et button.x
   pour égaler style.css (button.btn) et, en sombre, la couche générée ([data-dk] .x, [data-dk] button.x) ; la feuille étant
   chargée après, elle l'emporte à égalité. Un sélecteur plus précis de la page (.zone .btn, body.page .btn-primary) garde ses couleurs.
   Ordre voulu : principal, puis secondaire, puis danger (un <button class="btn btn-secondary"> prend la couleur secondaire). */
:where(html.psu) .btn,
:where(html.psu) button.btn,
:where(html.psu) .btn-primary,
:where(html.psu) button.btn-primary,
:where(html.psu) .btn-paisible,
:where(html.psu) button.btn-paisible,
:where(html.psu) .btn-confirm,
:where(html.psu) button.btn-confirm,
:where(html.psu)[data-dk] .btn,
:where(html.psu)[data-dk] button.btn,
:where(html.psu)[data-dk] .btn-primary,
:where(html.psu)[data-dk] button.btn-primary,
:where(html.psu)[data-dk] .btn-paisible,
:where(html.psu)[data-dk] button.btn-paisible,
:where(html.psu)[data-dk] .btn-confirm,
:where(html.psu)[data-dk] button.btn-confirm {
  background-color: var(--psu-brand); color: #fff; border: 1px solid var(--psu-brand); }
:where(html.psu) .btn:hover,
:where(html.psu) button.btn:hover,
:where(html.psu) .btn-primary:hover,
:where(html.psu) button.btn-primary:hover,
:where(html.psu) .btn-paisible:hover,
:where(html.psu) button.btn-paisible:hover,
:where(html.psu) .btn-confirm:hover,
:where(html.psu) button.btn-confirm:hover,
:where(html.psu)[data-dk] .btn:hover,
:where(html.psu)[data-dk] button.btn:hover,
:where(html.psu)[data-dk] .btn-primary:hover,
:where(html.psu)[data-dk] button.btn-primary:hover,
:where(html.psu)[data-dk] .btn-paisible:hover,
:where(html.psu)[data-dk] button.btn-paisible:hover,
:where(html.psu)[data-dk] .btn-confirm:hover,
:where(html.psu)[data-dk] button.btn-confirm:hover {
  background-color: var(--psu-brand-hover); border-color: var(--psu-brand-hover); color: #fff; opacity: 1; }
:where(html.psu) .btn-secondary,
:where(html.psu) button.btn-secondary,
:where(html.psu) .btn-update,
:where(html.psu) button.btn-update,
:where(html.psu) .btn-cancel,
:where(html.psu) button.btn-cancel,
:where(html.psu)[data-dk] .btn-secondary,
:where(html.psu)[data-dk] button.btn-secondary,
:where(html.psu)[data-dk] .btn-update,
:where(html.psu)[data-dk] button.btn-update,
:where(html.psu)[data-dk] .btn-cancel,
:where(html.psu)[data-dk] button.btn-cancel {
  background-color: var(--psu-surface); color: var(--psu-ink); border: 1px solid var(--psu-line); }
:where(html.psu) .btn-secondary:hover,
:where(html.psu) button.btn-secondary:hover,
:where(html.psu) .btn-update:hover,
:where(html.psu) button.btn-update:hover,
:where(html.psu) .btn-cancel:hover,
:where(html.psu) button.btn-cancel:hover,
:where(html.psu)[data-dk] .btn-secondary:hover,
:where(html.psu)[data-dk] button.btn-secondary:hover,
:where(html.psu)[data-dk] .btn-update:hover,
:where(html.psu)[data-dk] button.btn-update:hover,
:where(html.psu)[data-dk] .btn-cancel:hover,
:where(html.psu)[data-dk] button.btn-cancel:hover {
  background-color: var(--psu-hover); color: var(--psu-ink); border-color: #C3D1E0; }
:where(html.psu) .btn-danger,
:where(html.psu) button.btn-danger,
:where(html.psu) .btn-delete,
:where(html.psu) button.btn-delete,
:where(html.psu)[data-dk] .btn-danger,
:where(html.psu)[data-dk] button.btn-danger,
:where(html.psu)[data-dk] .btn-delete,
:where(html.psu)[data-dk] button.btn-delete {
  background-color: var(--psu-surface); color: var(--psu-danger); border: 1px solid var(--psu-line); }
:where(html.psu) .btn-danger:hover,
:where(html.psu) button.btn-danger:hover,
:where(html.psu) .btn-delete:hover,
:where(html.psu) button.btn-delete:hover,
:where(html.psu)[data-dk] .btn-danger:hover,
:where(html.psu)[data-dk] button.btn-danger:hover,
:where(html.psu)[data-dk] .btn-delete:hover,
:where(html.psu)[data-dk] button.btn-delete:hover {
  background-color: var(--psu-danger-soft); color: var(--psu-danger); border-color: transparent; }

/* Variantes propres aux pages (.btn.sec / .ghost / .secondary / .outline / .light ; .btn.warn / .danger) : en sombre, la couche
   générée ([data-dk] button.btn) les peignait en bleu plein ; elles retrouvent un aspect secondaire. En clair, les règles de la page
   s'appliquent ; une règle sombre propre à la page ([data-dk][data-dkp=…] .btn.ghost) reste prioritaire. */
:where(html.psu)[data-dk] .btn:is(.sec, .ghost, .secondary, .outline, .light) {
  background-color: var(--psu-surface); background-image: none; color: var(--psu-brand-text); border: 1px solid var(--psu-line); }
:where(html.psu)[data-dk] .btn:is(.sec, .ghost, .secondary, .outline, .light):hover { background-color: var(--psu-hover); color: var(--psu-brand-text); }
:where(html.psu)[data-dk] .btn:is(.warn, .danger) {
  background-color: var(--psu-surface); background-image: none; color: var(--psu-danger); border: 1px solid var(--psu-line); }
:where(html.psu)[data-dk] .btn:is(.warn, .danger):hover { background-color: var(--psu-danger-soft); color: var(--psu-danger); }

/* Icône au trait dans un ancien bouton (ps_icon() placé avant le texte) */
html.psu :is(.btn, .btn-primary, .btn-secondary, .btn-update, .btn-delete, .btn-danger, .my-assistants-card-btn) > .psu-ico:first-child { margin-right: 7px; }

/* ---------- U2 · Mon compte (body.account-page) ----------
   style.css (body.account-page .btn…, 0,2,1) : 48 px, dégradé, ombre, soulèvement au survol ; la page impose ensuite, en !important,
   body.account-page .btn{min-height:38px;font-size:12.5px;padding:8px 15px;border-radius:11px} (bloc de compactage, my-account.php) et
   padding 10px 14px dans .subscription-buttons : d'où les !important ci-dessous, plus précis (0,3,2).
   Un seul bouton plein par zone : validations de formulaire et abonnement ; les liens de navigation des cartes
   (.account-button-stack a.btn-primary : Mettre à jour mon compte, Mes magasins, Mon historique, Se déconnecter…) deviennent secondaires. */
html.psu body.account-page :is(.btn, .btn-primary, .btn-update, .btn-delete, .btn-danger) {
  min-height: var(--psu-h) !important; padding: 7px 14px !important; border-radius: var(--psu-r) !important;
  font: 600 var(--psu-fs)/1.35 var(--psu-font); font-size: var(--psu-fs) !important; letter-spacing: 0;
  box-shadow: none; transform: none; background-image: none; }
@media (max-width: 768px) { html.psu body.account-page :is(.btn, .btn-primary, .btn-update, .btn-delete, .btn-danger) { padding: 9px 14px !important; } }
html.psu body.account-page :is(.btn, .btn-primary, .btn-update, .btn-delete, .btn-danger):hover { transform: none; box-shadow: none; }
html.psu body.account-page .btn-primary, html.psu[data-dk] body.account-page .btn-primary {
  background-color: var(--psu-brand); background-image: none; border: 1px solid var(--psu-brand); color: #fff; box-shadow: none; }
html.psu body.account-page .btn-primary:hover, html.psu[data-dk] body.account-page .btn-primary:hover { background-color: var(--psu-brand-hover); background-image: none; border-color: var(--psu-brand-hover); color: #fff; }
html.psu body.account-page .account-button-stack a.btn-primary, html.psu[data-dk] body.account-page .account-button-stack a.btn-primary, html.psu body.account-page .btn-update, html.psu[data-dk] body.account-page .btn-update {
  background-color: var(--psu-surface); background-image: none; border: 1px solid var(--psu-line); color: var(--psu-ink); box-shadow: none; }
html.psu body.account-page .account-button-stack a.btn-primary:hover, html.psu[data-dk] body.account-page .account-button-stack a.btn-primary:hover, html.psu body.account-page .btn-update:hover, html.psu[data-dk] body.account-page .btn-update:hover {
  background-color: var(--psu-hover); border-color: #C3D1E0; color: var(--psu-ink); }
html.psu body.account-page .btn-delete, html.psu[data-dk] body.account-page .btn-delete, html.psu body.account-page .btn-danger, html.psu[data-dk] body.account-page .btn-danger {
  background-color: var(--psu-surface); background-image: none; border: 1px solid var(--psu-line); color: var(--psu-danger); box-shadow: none; }
html.psu body.account-page .btn-delete:hover, html.psu[data-dk] body.account-page .btn-delete:hover, html.psu body.account-page .btn-danger:hover, html.psu[data-dk] body.account-page .btn-danger:hover {
  background-color: var(--psu-danger-soft); border-color: transparent; color: var(--psu-danger); }

/* ---------- U2 · Mes assistants (cartes : displayAssistant.php ; partagés : .my-assistants-shared-btn) ----------
   Avant : 4 boutons de 48 px par carte, 15,2 px graisse 700, coins 14 px, dégradé et ombres. */
html.psu .my-assistants-card-actions .my-assistants-card-btn, html.psu .my-assistants-shared-btn {
  min-height: var(--psu-h); height: auto; padding: 0 14px; border-radius: var(--psu-r); font: 600 var(--psu-fs)/1.3 var(--psu-font);
  letter-spacing: 0; box-shadow: none; transform: none; background-image: none; }
html.psu .my-assistants-card-actions .my-assistants-card-btn:hover, html.psu .my-assistants-shared-btn:hover { transform: none; box-shadow: none; }
html.psu .my-assistants-card-actions .my-assistants-card-btn-primary, html.psu[data-dk] .my-assistants-card-actions .my-assistants-card-btn-primary, html.psu .my-assistants-shared-btn.my-assistants-shared-btn-primary, html.psu[data-dk] .my-assistants-shared-btn.my-assistants-shared-btn-primary {
  background-color: var(--psu-brand); background-image: none; border: 1px solid var(--psu-brand); color: #fff; box-shadow: none; }
html.psu .my-assistants-card-actions .my-assistants-card-btn-primary:hover, html.psu[data-dk] .my-assistants-card-actions .my-assistants-card-btn-primary:hover, html.psu .my-assistants-shared-btn.my-assistants-shared-btn-primary:hover, html.psu[data-dk] .my-assistants-shared-btn.my-assistants-shared-btn-primary:hover {
  background-color: var(--psu-brand-hover); border-color: var(--psu-brand-hover); color: #fff; }
html.psu .my-assistants-card-actions .my-assistants-card-btn-secondary, html.psu[data-dk] .my-assistants-card-actions .my-assistants-card-btn-secondary, html.psu .my-assistants-shared-btn.my-assistants-shared-btn-secondary, html.psu[data-dk] .my-assistants-shared-btn.my-assistants-shared-btn-secondary {
  background-color: var(--psu-surface); background-image: none; border: 1px solid var(--psu-line); color: var(--psu-ink); box-shadow: none; }
html.psu .my-assistants-card-actions .my-assistants-card-btn-secondary:hover, html.psu[data-dk] .my-assistants-card-actions .my-assistants-card-btn-secondary:hover, html.psu .my-assistants-shared-btn.my-assistants-shared-btn-secondary:hover, html.psu[data-dk] .my-assistants-shared-btn.my-assistants-shared-btn-secondary:hover {
  background-color: var(--psu-hover); border-color: #C3D1E0; color: var(--psu-ink); }
html.psu .my-assistants-card-actions .my-assistants-card-btn-danger, html.psu[data-dk] .my-assistants-card-actions .my-assistants-card-btn-danger, html.psu .my-assistants-shared-btn.my-assistants-shared-btn-danger, html.psu[data-dk] .my-assistants-shared-btn.my-assistants-shared-btn-danger {
  background-color: var(--psu-surface); background-image: none; border: 1px solid var(--psu-line); color: var(--psu-danger); box-shadow: none; }
html.psu .my-assistants-card-actions .my-assistants-card-btn-danger:hover, html.psu[data-dk] .my-assistants-card-actions .my-assistants-card-btn-danger:hover, html.psu .my-assistants-shared-btn.my-assistants-shared-btn-danger:hover, html.psu[data-dk] .my-assistants-shared-btn.my-assistants-shared-btn-danger:hover {
  background-color: var(--psu-danger-soft); border-color: transparent; color: var(--psu-danger); }

/* ---------- U2 · Mes publications (.mp-btn, règles en ligne de my-posts.php) ----------
   Avant : 38-48 px, graisse 850, coins 12-14 px, dégradé, bleu #2563EB hors charte, soulèvement au survol. */
html.psu .mp-btn { min-height: var(--psu-h); padding: 0 14px; border-radius: var(--psu-r); font: 600 var(--psu-fs)/1.3 var(--psu-font);
  letter-spacing: 0; gap: 7px; box-shadow: none; transform: none; background-image: none; }
html.psu .mp-btn:hover { transform: none; box-shadow: none; }
html.psu .mp-btn, html.psu[data-dk] .mp-btn { background-color: var(--psu-surface); background-image: none; border: 1px solid var(--psu-line); color: var(--psu-ink); }
html.psu .mp-btn:hover, html.psu[data-dk] .mp-btn:hover { background-color: var(--psu-hover); border-color: #C3D1E0; color: var(--psu-ink); }
html.psu .mp-btn.primary, html.psu[data-dk] .mp-btn.primary { background-color: var(--psu-brand); border-color: var(--psu-brand); color: #fff; box-shadow: none; }
html.psu .mp-btn.primary:hover, html.psu[data-dk] .mp-btn.primary:hover { background-color: var(--psu-brand-hover); border-color: var(--psu-brand-hover); color: #fff; }
html.psu .mp-btn.ghost, html.psu[data-dk] .mp-btn.ghost { background-color: var(--psu-surface); border-color: var(--psu-line); color: var(--psu-brand-text); }
html.psu .mp-btn.ghost:hover, html.psu[data-dk] .mp-btn.ghost:hover { background-color: var(--psu-brand-soft); border-color: transparent; color: var(--psu-brand-text); }
html.psu .mp-btn.danger, html.psu[data-dk] .mp-btn.danger { background-color: var(--psu-surface); border-color: var(--psu-line); color: var(--psu-danger); }
html.psu .mp-btn.danger:hover, html.psu[data-dk] .mp-btn.danger:hover { background-color: var(--psu-danger-soft); border-color: transparent; color: var(--psu-danger); }
html.psu .mp-btn[disabled] { opacity: .5; cursor: not-allowed; }

/* ---------- U3 · Créer mon site, Mon site ----------
   Créer mon site : boutons .btn-primary en #007BFF graisse 900 coins 999 (body.create-website-page …, .creation-section .btn-primary) ;
   boutons du bandeau (.creation-hero-btn, aussi dans la barre d'administration de Mon site) 48-50 px, coins 16 px, ombre. */
html.psu body.create-website-page :is(.btn-primary, .create-generate-site-btn) {
  min-height: var(--psu-h-lg); padding: 9px 20px; border-radius: var(--psu-r); font: 600 var(--psu-fs)/1.35 var(--psu-font); letter-spacing: 0;
  background-color: var(--psu-brand); background-image: none; border: 1px solid var(--psu-brand); color: #fff; box-shadow: none; }
html.psu body.create-website-page :is(.btn-primary, .create-generate-site-btn):hover { background-color: var(--psu-brand-hover); border-color: var(--psu-brand-hover); color: #fff; }
html.psu body.create-website-page :is(.btn-primary, .create-generate-site-btn):disabled { opacity: .55; }
html.psu :is(body.create-website-page, body.my-website-page .website-admin-toolbar) .creation-hero-btn {
  min-height: var(--psu-h-lg); padding: 0 18px; border-radius: var(--psu-r); font: 600 var(--psu-fs)/1.3 var(--psu-font); letter-spacing: 0;
  box-shadow: none; transform: none; gap: 7px; }
html.psu :is(body.create-website-page, body.my-website-page .website-admin-toolbar) .creation-hero-btn:hover { transform: none; box-shadow: none; }

/* ---------- D1 (accordée le 03/11/2026) : grands bandeaux dégradés → en-tête sobre, comme la page de l'assistant ----------
   Surtitre en pastille, titre 26 px graisse 700 (22 px mobile), une phrase grise, actions au gabarit du socle ;
   les chiffres clés deviennent de petites cartes claires. Couleurs par jetons : le mode sombre suit. */
/* Créer mon site, Mon site (.creation-hero-shell ; Mon site porte aussi body.create-website-page et pose le dégradé du site
   en style en ligne sur le bandeau, d'où le !important du fond) */
html.psu body.create-website-page .creation-hero-shell {
  background: none !important; color: var(--psu-ink); border: 0; border-radius: 0; box-shadow: none; padding: 4px 0 8px; }
html.psu body.create-website-page .creation-hero-shell::before, html.psu body.create-website-page .creation-hero-shell::after,
html.psu :is(.creation-hero-shell, .my-assistants-hero, .mp-hero) .pricing-square-signature { display: none; }
html.psu body.create-website-page .creation-hero-shell .creation-eyebrow {
  background: var(--psu-brand-soft); color: var(--psu-brand-text); border: 0; box-shadow: none;
  font: 600 11.5px/1.4 var(--psu-font); letter-spacing: .06em; text-transform: uppercase; padding: 3px 10px; border-radius: 999px; }
html.psu body.create-website-page .creation-hero-shell .creation-hero-title {
  color: var(--psu-ink); font: 700 26px/1.25 var(--psu-font); letter-spacing: 0; text-shadow: none; margin: 8px 0 0; }
html.psu body.create-website-page .creation-hero-shell .creation-hero-lead {
  color: var(--psu-muted); font: 400 14.5px/1.55 var(--psu-font); max-width: 68ch; margin: 6px 0 0; }
html.psu body.create-website-page .creation-hero-shell .creation-hero-btn--primary {
  background: var(--psu-brand); color: #fff; border: 1px solid var(--psu-brand); box-shadow: none; }
html.psu body.create-website-page .creation-hero-shell .creation-hero-btn--primary:hover { background: var(--psu-brand-hover); border-color: var(--psu-brand-hover); color: #fff; }
html.psu body.create-website-page .creation-hero-shell .creation-hero-btn--secondary {
  background: var(--psu-surface); color: var(--psu-ink); border: 1px solid var(--psu-line); box-shadow: none; }
html.psu body.create-website-page .creation-hero-shell .creation-hero-btn--secondary:hover { background: var(--psu-hover); color: var(--psu-ink); }
html.psu body.create-website-page .creation-hero-shell .creation-hero-stat {
  background: var(--psu-surface); border: 1px solid var(--psu-line-soft); border-radius: 12px; box-shadow: var(--psu-shadow); color: var(--psu-ink); }
html.psu body.create-website-page .creation-hero-shell .creation-hero-stat span { color: var(--psu-muted); font: 600 12px/1.4 var(--psu-font); }
html.psu body.create-website-page .creation-hero-shell .creation-hero-stat strong { color: var(--psu-ink); font: 700 17px/1.3 var(--psu-font); }

/* Mes assistants (.my-assistants-hero : fond dégradé, titre 55 px, boutons 52 px en dégradé, panneau sombre de chiffres) */
html.psu .my-assistants-hero { background: none; border: 0; border-radius: 0; box-shadow: none; padding: 4px 0 8px; gap: 16px 24px; align-items: end; }
html.psu .my-assistants-hero::before, html.psu .my-assistants-hero::after { display: none; }
html.psu .my-assistants-hero .my-assistants-hero-copy { gap: 8px; }
html.psu .my-assistants-hero .my-assistants-eyebrow {
  min-height: 0; padding: 3px 10px; background: var(--psu-brand-soft); border: 0; color: var(--psu-brand-text);
  font: 600 11.5px/1.4 var(--psu-font); letter-spacing: .06em; }
html.psu .my-assistants-hero h1 { color: var(--psu-ink); font: 700 26px/1.25 var(--psu-font); letter-spacing: 0; margin: 0; }
html.psu .my-assistants-hero .assistant-description { color: var(--psu-muted); font: 400 14.5px/1.55 var(--psu-font); max-width: 68ch; }
html.psu .my-assistants-hero .assistant-description strong { font-weight: 600; color: var(--psu-ink); }
html.psu .my-assistants-hero .my-assistants-cta {
  min-height: var(--psu-h); padding: 0 16px; border-radius: var(--psu-r); font: 600 var(--psu-fs)/1.3 var(--psu-font); box-shadow: none; transform: none; }
html.psu .my-assistants-hero .my-assistants-cta.primary { background: var(--psu-brand); border: 1px solid var(--psu-brand); color: #fff; }
html.psu .my-assistants-hero .my-assistants-cta.primary:hover { background: var(--psu-brand-hover); border-color: var(--psu-brand-hover); }
html.psu .my-assistants-hero .my-assistants-cta.secondary { background: var(--psu-surface); border: 1px solid var(--psu-line); color: var(--psu-ink); }
html.psu .my-assistants-hero .my-assistants-cta.secondary:hover { background: var(--psu-hover); }
html.psu .my-assistants-hero .my-assistants-hero-panel {
  background: none; box-shadow: none; padding: 0; border-radius: 0; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); align-content: end; }
html.psu .my-assistants-hero .my-assistants-stat {
  background: var(--psu-surface); border: 1px solid var(--psu-line-soft); border-radius: 12px; box-shadow: var(--psu-shadow); padding: 12px 14px; }
html.psu .my-assistants-hero .my-assistants-stat span { color: var(--psu-muted); font: 600 11.5px/1.4 var(--psu-font); letter-spacing: .03em; margin-bottom: 4px; }
html.psu .my-assistants-hero .my-assistants-stat strong { color: var(--psu-ink); font: 700 20px/1.2 var(--psu-font); }

/* Mes publications (.mp-hero : fond dégradé clair, titre 41 px graisse 900) */
html.psu .mp-hero { background: none; border: 0; border-radius: 0; box-shadow: none; padding: 4px 0 8px; }
html.psu .mp-hero .mp-kicker { background: var(--psu-brand-soft); color: var(--psu-brand-text); border: 0; font: 600 11.5px/1.4 var(--psu-font); letter-spacing: .06em; padding: 3px 10px; border-radius: 999px; }
html.psu .mp-hero .mp-title { color: var(--psu-ink); font: 700 26px/1.25 var(--psu-font); letter-spacing: 0; text-align: left; }
html.psu .mp-hero .mp-subtitle { color: var(--psu-muted); font: 400 14.5px/1.55 var(--psu-font); }
html.psu[data-dk] .mp-hero { background: none; box-shadow: none; }
html.psu[data-dk] .mp-hero .mp-kicker { background: var(--psu-brand-soft); color: var(--psu-brand-text); }
html.psu[data-dk] .mp-hero .mp-subtitle { color: var(--psu-muted); }

@media (max-width: 768px) {
  html.psu body.create-website-page .creation-hero-shell .creation-hero-title,
  html.psu .my-assistants-hero h1, html.psu .mp-hero .mp-title { font-size: 22px; }
  html.psu .my-assistants-hero .my-assistants-hero-panel { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html.psu .my-assistants-hero .my-assistants-stat { padding: 10px; }
}

/* ---------- U4 · Médiathèque (my-library.php) ----------
   Avant : bandeau dégradé bleu (titre blanc 36 px), filtres 40 px graisse 800 (actif en dégradé), boutons de fichier en émojis
   (✏️ 🔒 🔗 📩 🎬 → icônes .psi), « ✨ Créer un post » en dégradé 12 px graisse 800, « Supprimer » en #007BFF.
   Les règles existent aussi en [data-dk] pour passer devant la couche sombre propre à la page (dk/p/my-library.css). */
html.psu .lib-hero, html.psu[data-dk] .lib-hero { background: none; color: var(--psu-ink); border: 0; border-radius: 0; box-shadow: none; padding: 4px 0 8px; align-items: center; overflow: visible; }
html.psu .lib-hero::before, html.psu .lib-hero::after { display: none; }
html.psu .lib-badge, html.psu[data-dk] .lib-badge { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 12px; background: var(--psu-brand-soft); color: var(--psu-brand-text); box-shadow: none; backdrop-filter: none; font-size: 0; }
html.psu .lib-hero h1, html.psu[data-dk] .lib-hero h1 { color: var(--psu-ink); font: 700 26px/1.25 var(--psu-font); letter-spacing: 0; text-align: left; }
html.psu .lib-hero p, html.psu[data-dk] .lib-hero p { color: var(--psu-muted); font: 400 14.5px/1.55 var(--psu-font); margin-top: 4px; }
html.psu .lib-filter, html.psu[data-dk] .lib-filter { min-height: 32px; padding: 0 12px; font: 600 12.5px/1 var(--psu-font); background: var(--psu-surface); border-color: var(--psu-line); color: var(--psu-muted); box-shadow: none; transform: none; }
html.psu .lib-filter:hover, html.psu[data-dk] .lib-filter:hover { background: var(--psu-hover); border-color: #C3D1E0; color: var(--psu-ink); transform: none; }
html.psu .lib-filter.is-active, html.psu[data-dk] .lib-filter.is-active { background: var(--psu-brand); background-image: none; border-color: var(--psu-brand); color: #fff; box-shadow: none; }
html.psu .lib-search-icon { opacity: 1; color: var(--psu-muted); display: inline-flex; }
html.psu .dropzone, html.psu[data-dk] .dropzone { background: var(--psu-soft); border-color: var(--psu-line); box-shadow: none; }
html.psu .dropzone:hover, html.psu[data-dk] .dropzone:hover { background: var(--psu-brand-soft); border-color: var(--psu-brand); box-shadow: none; transform: none; }
html.psu .dropzone-icon, html.psu[data-dk] .dropzone-icon { width: 44px; height: 44px; border-radius: 12px; color: var(--psu-brand-text); background: var(--psu-surface); border-color: var(--psu-line); }
html.psu .lib-mini-btn, html.psu[data-dk] .lib-mini-btn { width: 30px; height: 30px; border-radius: 8px; border-color: var(--psu-line); background: var(--psu-surface); color: var(--psu-muted); box-shadow: none; }
html.psu .lib-mini-btn:hover, html.psu[data-dk] .lib-mini-btn:hover { background: var(--psu-hover); color: var(--psu-brand-text); transform: none; }
html.psu .btn-vis, html.psu[data-dk] .btn-vis { background: var(--psu-brand); background-image: none; border: 1px solid var(--psu-brand); color: #fff;
  min-height: var(--psu-h-sm); padding: 0 12px; font: 600 12.5px/1.3 var(--psu-font); border-radius: var(--psu-r); box-shadow: none; gap: 6px; }
html.psu .btn-vis:hover, html.psu[data-dk] .btn-vis:hover { background: var(--psu-brand-hover); background-image: none; border-color: var(--psu-brand-hover); color: #fff; }
html.psu .lib-sub-pill .psi { width: 12px; height: 12px; vertical-align: -1px; }

/* ---------- U4 · Calendrier (content-calendar.php) : en-tête sobre (D1) ; icônes Font Awesome d'interface → au trait (bloc PSI) ---------- */
html.psu .ccal-hero, html.psu[data-dk] .ccal-hero { padding: 80px 0 12px; border-bottom: 0; overflow: visible; }
html.psu .ccal-hero::before, html.psu .ccal-hero::after { display: none; }
html.psu .ccal-badge, html.psu[data-dk] .ccal-badge { padding: 3px 10px; gap: 6px; background: var(--psu-brand-soft); border: 0; box-shadow: none; color: var(--psu-brand-text);
  font: 600 11.5px/1.4 var(--psu-font); letter-spacing: .06em; text-transform: uppercase; }
html.psu .ccal-h1, html.psu[data-dk] .ccal-h1 { margin: 8px 0 6px; color: var(--psu-ink); font: 700 26px/1.25 var(--psu-font); letter-spacing: 0; text-align: left; }
html.psu .ccal-lead, html.psu[data-dk] .ccal-lead { color: var(--psu-muted); font: 400 14.5px/1.55 var(--psu-font); max-width: 68ch; }
html.psu .ccal-legend-title, html.psu[data-dk] .ccal-legend-title { font: 600 11.5px/1.4 var(--psu-font); letter-spacing: .06em; color: var(--psu-muted); }
html.psu .ccal-legend-item, html.psu[data-dk] .ccal-legend-item { padding: 4px 10px; box-shadow: none; background: var(--psu-surface); border-color: var(--psu-line-soft); font: 600 12.5px/1.3 var(--psu-font); color: var(--psu-ink); }
@media (max-width: 768px) { html.psu .lib-hero h1, html.psu[data-dk] .lib-hero h1, html.psu .ccal-h1, html.psu[data-dk] .ccal-h1 { font-size: 22px; } html.psu .ccal-hero, html.psu[data-dk] .ccal-hero { padding-top: 72px; } }

/* ---------- U4 · Programmation (schedule-content.php) ----------
   Avant : titre 40 px centré, boutons en dégradé 46-50 px graisse 800 coins 14-16 px. « Générer une image » et « Télécharger un
   visuel » deviennent secondaires ; « Programmer » reste le seul bouton plein. */
html.psu .schedule-section-title, html.psu[data-dk] .schedule-section-title { color: var(--psu-ink); font: 700 26px/1.25 var(--psu-font); letter-spacing: 0; }
html.psu .schedule-main-container .image-button, html.psu[data-dk] .schedule-main-container .image-button { min-height: var(--psu-h); padding: 0 14px; border-radius: var(--psu-r);
  background: var(--psu-surface); background-image: none; color: var(--psu-brand-text); border: 1px solid var(--psu-line); font: 600 var(--psu-fs)/1.3 var(--psu-font); }
html.psu .schedule-main-container .image-button:hover, html.psu[data-dk] .schedule-main-container .image-button:hover { background: var(--psu-hover); filter: none; }
html.psu .schedule-main-container .schedule-btn-submit, html.psu[data-dk] .schedule-main-container .schedule-btn-submit { min-height: var(--psu-h-lg); border-radius: var(--psu-r);
  background: var(--psu-brand); background-image: none; color: #fff; font: 600 14px/1.3 var(--psu-font); }
html.psu .schedule-main-container .schedule-btn-submit:hover, html.psu[data-dk] .schedule-main-container .schedule-btn-submit:hover { background: var(--psu-brand-hover); filter: none; }
html.psu .schedule-main-container .schedule-btn-generate, html.psu[data-dk] .schedule-main-container .schedule-btn-generate { background: var(--psu-brand); background-image: none; }
@media (max-width: 768px) { html.psu .schedule-section-title, html.psu[data-dk] .schedule-section-title { font-size: 22px; } }

/* ---------- U5 · Icône de titre (émoji remplacé par ps_icon(…, ['class' => 'psu-h1-ico'])) ---------- */
html.psu .psu-h1-ico { width: 22px; height: 22px; color: var(--psu-brand-text); vertical-align: -3px; margin-right: 4px; stroke-width: 1.6; }

/* ---------- U5 · Connecteurs : dans « Ajouter une appli », « Connecter » est une action par carte → secondaire
   (avant : 19 boutons pleins en dégradé ; le seul bouton plein reste celui du connecteur personnalisé) ---------- */
html.psu .cn-card[aria-labelledby="cnAddH"] .btn:not(.sec), html.psu[data-dk] .cn-card[aria-labelledby="cnAddH"] .btn:not(.sec) {
  background: var(--psu-surface); background-image: none; color: var(--psu-brand-text); border: 1px solid var(--psu-line); }
html.psu .cn-card[aria-labelledby="cnAddH"] .btn:not(.sec):hover, html.psu[data-dk] .cn-card[aria-labelledby="cnAddH"] .btn:not(.sec):hover {
  background: var(--psu-brand-soft); border-color: transparent; color: var(--psu-brand-text); }

/* ---------- U5 · Boutons propres aux pages connectées (prospection, stratégie, Copilot Business, livres blancs, clés d'accès,
   parrainage, analyses, gestion de réseau, établissements) : gabarit du socle (36 px, 13,5 px graisse 600, coins 10 px, sans ombre).
   Couleurs gardées, sauf les dégradés (retirés) : leur fond devient le bleu Paisible, sinon le bouton deviendrait transparent. ---------- */
html.psu :is(.pro-btn, .ds-btn, .vg-btn, .rf-btn, .nlai-analysis__btn, .nm-btn, .wpx-b:not(.mini), .wiz-b-next, .my-stores-cta),
html.psu body.add-store-page .assistant-autofill-button {
  min-height: var(--psu-h); padding: 0 16px; border-radius: var(--psu-r); font: 600 var(--psu-fs)/1.3 var(--psu-font); letter-spacing: 0;
  box-shadow: none; transform: none; }
html.psu :is(.pro-btn, .ds-btn, .vg-btn, .rf-btn, .nm-btn, .my-stores-cta):hover { transform: none; box-shadow: none; }
html.psu .pk-add { height: var(--psu-h-lg); border-radius: var(--psu-r); font: 600 14px/1.3 var(--psu-font); }
html.psu .wpx-b.mini { border-radius: 8px; font-weight: 600; }
html.psu .pro-btn:not(.ghost), html.psu[data-dk] .pro-btn:not(.ghost), html.psu .nm-btn--primary, html.psu[data-dk] .nm-btn--primary, html.psu .my-stores-cta, html.psu[data-dk] .my-stores-cta, html.psu body.add-store-page .assistant-autofill-button, html.psu[data-dk] body.add-store-page .assistant-autofill-button {
  background-color: var(--psu-brand); background-image: none; color: #fff; border-color: var(--psu-brand); box-shadow: none; }
html.psu .pro-btn:not(.ghost):hover, html.psu[data-dk] .pro-btn:not(.ghost):hover, html.psu .nm-btn--primary:hover, html.psu[data-dk] .nm-btn--primary:hover, html.psu .my-stores-cta:hover, html.psu[data-dk] .my-stores-cta:hover, html.psu body.add-store-page .assistant-autofill-button:hover, html.psu[data-dk] body.add-store-page .assistant-autofill-button:hover {
  background-color: var(--psu-brand-hover); background-image: none; color: #fff; }
/* Historique : la croix de suppression de chaque conversation (rouge vif, 1,5 rem) devient un petit bouton discret */
html.psu .my-delete-history-btn { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; min-height: 30px; min-width: 30px; padding: 0;
  border-radius: 8px; font-size: 18px; line-height: 1; color: var(--psu-muted); background: transparent; }
html.psu .my-delete-history-btn:hover { color: var(--psu-danger); background: var(--psu-danger-soft); }

/* Petits boutons « .btn.mini » des pages (avis clients…) : taille réduite du socle, pas 36 px */
html.psu .btn.mini { min-height: var(--psu-h-sm); padding: 0 11px; font-size: var(--psu-fs-sm); }
/* Abonnement stratégie : modificateurs .ghost / .muted / .danger seuls (0,1,0), sinon repeints en bleu plein par le socle */
html.psu body.subscribe-strategy-page .btn:is(.ghost, .muted), html.psu[data-dk] body.subscribe-strategy-page .btn:is(.ghost, .muted) {
  background-color: var(--psu-surface); color: var(--psu-ink); border: 1px solid var(--psu-line); }
html.psu body.subscribe-strategy-page .btn.danger, html.psu[data-dk] body.subscribe-strategy-page .btn.danger {
  background-color: var(--psu-surface); color: var(--psu-danger); border: 1px solid var(--psu-line); }

/* ---------- U5 · D1 : en-têtes sobres de Copilot Business (.vg-hero, dégradé sombre, texte blanc), Mes établissements
   (.my-stores-hero, dégradé, titre 44 px, chiffres en dégradé), Gestion de réseau (.nm-hero, bleu nuit, mosaïque décorative),
   livres blancs (.wpx-h1 32 px) ---------- */
html.psu .vg-hero, html.psu[data-dk] .vg-hero, html.psu .my-stores-hero, html.psu[data-dk] .my-stores-hero, html.psu .nm-hero, html.psu[data-dk] .nm-hero { background: none; color: var(--psu-ink); border: 0; border-radius: 0; box-shadow: none; padding: 4px 0 8px; }
html.psu :is(.vg-hero, .my-stores-hero, .nm-hero)::before, html.psu :is(.vg-hero, .my-stores-hero, .nm-hero)::after, html.psu .nm-hero__signature { display: none; }
html.psu .vg-hero h1, html.psu[data-dk] .vg-hero h1, html.psu .my-stores-hero h1, html.psu[data-dk] .my-stores-hero h1, html.psu .nm-hero h1, html.psu[data-dk] .nm-hero h1, html.psu .wpx-h1, html.psu[data-dk] .wpx-h1 { color: var(--psu-ink); font: 700 26px/1.25 var(--psu-font); letter-spacing: 0; text-align: left; margin: 0; }
html.psu .vg-hero p, html.psu[data-dk] .vg-hero p, html.psu .my-stores-hero p, html.psu[data-dk] .my-stores-hero p, html.psu .nm-hero p, html.psu[data-dk] .nm-hero p { color: var(--psu-muted); font: 400 14.5px/1.55 var(--psu-font); max-width: 68ch; margin: 6px 0 0; }
html.psu .vg-hero .vg-sub, html.psu[data-dk] .vg-hero .vg-sub { color: var(--psu-muted); }
html.psu .vg-hero .vg-run, html.psu[data-dk] .vg-hero .vg-run { background: var(--psu-surface); color: var(--psu-brand-text); border: 1px solid var(--psu-line); border-radius: var(--psu-r); min-height: var(--psu-h-sm); font: 600 var(--psu-fs-sm)/1.3 var(--psu-font); box-shadow: none; }
html.psu .nm-hero .nm-pill, html.psu[data-dk] .nm-hero .nm-pill { background: var(--psu-brand-soft); color: var(--psu-brand-text); border: 0; box-shadow: none; font: 600 12px/1.5 var(--psu-font); }
html.psu .my-stores-hero .my-stores-stat, html.psu[data-dk] .my-stores-hero .my-stores-stat, html.psu .nm-hero .nm-stat, html.psu[data-dk] .nm-hero .nm-stat { background: var(--psu-surface); background-image: none; color: var(--psu-ink); border: 1px solid var(--psu-line-soft); border-radius: 12px; box-shadow: var(--psu-shadow); }
html.psu .my-stores-hero .my-stores-stat span, html.psu[data-dk] .my-stores-hero .my-stores-stat span, html.psu .nm-hero .nm-stat__label, html.psu[data-dk] .nm-hero .nm-stat__label { color: var(--psu-muted); font: 600 12px/1.4 var(--psu-font); }
html.psu .my-stores-hero .my-stores-stat strong, html.psu[data-dk] .my-stores-hero .my-stores-stat strong, html.psu .nm-hero .nm-stat__value, html.psu[data-dk] .nm-hero .nm-stat__value { color: var(--psu-ink); font: 700 20px/1.2 var(--psu-font); }
@media (max-width: 768px) { html.psu .vg-hero h1, html.psu[data-dk] .vg-hero h1, html.psu .my-stores-hero h1, html.psu[data-dk] .my-stores-hero h1, html.psu .nm-hero h1, html.psu[data-dk] .nm-hero h1, html.psu .wpx-h1, html.psu[data-dk] .wpx-h1 { font-size: 22px; }
  /* Gestion de réseau : le bandeau commence à 24 px sous une barre fixe de 52 px (titre déjà en partie masqué avant) */
  html.psu .nm-hero, html.psu[data-dk] .nm-hero { padding-top: 40px; } }

/* ---------- U5 · Historique des conversations : titre 42 px → 26 px (en-tête déjà sans bandeau) ---------- */
html.psu .my-history-hero h1, html.psu[data-dk] .my-history-hero h1 { color: var(--psu-ink); font: 700 26px/1.25 var(--psu-font); letter-spacing: 0; text-align: left; }
html.psu .my-history-hero p, html.psu[data-dk] .my-history-hero p { color: var(--psu-muted); font: 400 14.5px/1.55 var(--psu-font); }
@media (max-width: 768px) { html.psu .my-history-hero h1, html.psu[data-dk] .my-history-hero h1 { font-size: 22px; } }

/* Abonnement stratégie : dans le tableau des abonnements, des boutons plus larges passaient sur 2 lignes (+82 px par ligne) */
html.psu body.subscribe-strategy-page .btn { padding-left: 12px; padding-right: 12px; }
html.psu body.subscribe-strategy-page .svc-subscriptions-table .btn { height: auto; min-height: var(--psu-h-sm); padding: 0 10px; font-size: var(--psu-fs-sm); }
/* Analyses : bouton « Analyser » en height:42px et bleu #0073E6 hors charte (analytics_suite_nav.php) */
html.psu .nlai-analysis__btn, html.psu[data-dk] .nlai-analysis__btn { height: var(--psu-h); background-color: var(--psu-brand); font-weight: 600; }
html.psu .nlai-analysis__btn.is-loading { color: transparent; }

/* ---------- U5 · Newsletters (studio, style-newsletter-campaigns.css) : en-tête sobre (D1), boutons et onglets au gabarit,
   #007BFF → bleu Paisible, onglet actif bleu clair au lieu de noir, graisse 800 → 600 ---------- */
html.psu body.newsletter-campaigns-page .nlstudio-hero__copy, html.psu[data-dk] body.newsletter-campaigns-page .nlstudio-hero__copy { background: none; border: 0; border-radius: 0; box-shadow: none; padding: 4px 0 8px; }
html.psu body.newsletter-campaigns-page .nlstudio-chip, html.psu[data-dk] body.newsletter-campaigns-page .nlstudio-chip { min-height: 0; padding: 3px 10px; background: var(--psu-brand-soft); color: var(--psu-brand-text); font: 600 11.5px/1.4 var(--psu-font); letter-spacing: .06em; text-transform: uppercase; margin-bottom: 6px; }
html.psu body.newsletter-campaigns-page .nlstudio-hero h1, html.psu[data-dk] body.newsletter-campaigns-page .nlstudio-hero h1 { color: var(--psu-ink); font: 700 26px/1.25 var(--psu-font); margin: 0 0 6px; text-align: left; }
html.psu body.newsletter-campaigns-page .nlstudio-hero p, html.psu[data-dk] body.newsletter-campaigns-page .nlstudio-hero p { color: var(--psu-muted); font: 400 14.5px/1.55 var(--psu-font); max-width: 68ch; }
html.psu body.newsletter-campaigns-page :is(.nlstudio-btn, .nlstudio-tab) { min-height: var(--psu-h); padding: 0 14px; border-radius: var(--psu-r); font: 600 var(--psu-fs)/1.3 var(--psu-font); box-shadow: none; transform: none; }
html.psu body.newsletter-campaigns-page :is(.nlstudio-toolbar-btn, .nlstudio-block-action-btn, .nlstudio-add-row__btn) { font-weight: 600; }
html.psu body.newsletter-campaigns-page .nlstudio-btn--primary, html.psu[data-dk] body.newsletter-campaigns-page .nlstudio-btn--primary, html.psu body.newsletter-campaigns-page .nlstudio-template-btn.is-active, html.psu[data-dk] body.newsletter-campaigns-page .nlstudio-template-btn.is-active { background: var(--psu-brand); border-color: var(--psu-brand); color: #fff; box-shadow: none; }
html.psu body.newsletter-campaigns-page .nlstudio-tab.is-active, html.psu[data-dk] body.newsletter-campaigns-page .nlstudio-tab.is-active { background: var(--psu-brand-soft); border-color: transparent; color: var(--psu-brand-text); }
@media (max-width: 768px) { html.psu body.newsletter-campaigns-page .nlstudio-hero h1, html.psu[data-dk] body.newsletter-campaigns-page .nlstudio-hero h1 { font-size: 22px; } }

/* ---------- U6 · Pages publiques (D2 : identité B3 gardée ; mêmes boutons et icônes ; titres et textes inchangés pour le SEO).
   Appels à l'action en grande taille du socle (40 px, 44 px sur mobile), graisse 600, coins 10 px, sans dégradé ni ombre :
   pages fonction / métier / comparatifs (landing_render : .lnd__b1 plein, .lnd__b2 secondaire), pourquoi Paisible (.why-btn),
   à propos (.abt-btn 54 px), tarifs (.btn-cta-pricing #0B66FF, .flv-btn), chatbot pour site (.emb__btn #007BFF). ---------- */
html.psu :is(.lnd__b1, .lnd__b2, .why-btn, .abt-btn, .btn-cta-pricing, .flv-btn, .emb__btn) {
  min-height: var(--psu-h-lg); padding-top: 0; padding-bottom: 0; border-radius: var(--psu-r); font-weight: 600; letter-spacing: 0;
  box-shadow: none; transform: none; display: inline-flex; align-items: center; justify-content: center; }
html.psu :is(.lnd__b1, .lnd__b2, .why-btn, .abt-btn, .btn-cta-pricing, .flv-btn, .emb__btn):hover { transform: none; box-shadow: none; }
html.psu .lnd__b1, html.psu[data-dk] .lnd__b1, html.psu .why-btn, html.psu[data-dk] .why-btn, html.psu .abt-btn, html.psu[data-dk] .abt-btn, html.psu .btn-cta-pricing, html.psu[data-dk] .btn-cta-pricing, html.psu .flv-btn, html.psu[data-dk] .flv-btn, html.psu .emb__btn, html.psu[data-dk] .emb__btn { background-color: var(--psu-brand); background-image: none; border-color: var(--psu-brand); color: #fff; }
html.psu .lnd__b1:hover, html.psu[data-dk] .lnd__b1:hover, html.psu .why-btn:hover, html.psu[data-dk] .why-btn:hover, html.psu .abt-btn:hover, html.psu[data-dk] .abt-btn:hover, html.psu .btn-cta-pricing:hover, html.psu[data-dk] .btn-cta-pricing:hover, html.psu .flv-btn:hover, html.psu[data-dk] .flv-btn:hover, html.psu .emb__btn:hover, html.psu[data-dk] .emb__btn:hover { background-color: var(--psu-brand-hover); background-image: none; color: #fff; }
html.psu .lnd__b2, html.psu[data-dk] .lnd__b2 { background-color: var(--psu-surface); color: var(--psu-brand-text); border: 1px solid var(--psu-line); }
html.psu .lnd__b2:hover, html.psu[data-dk] .lnd__b2:hover { background-color: var(--psu-brand-soft); color: var(--psu-brand-text); }
html.psu .why-previewTab { min-height: var(--psu-h); font-weight: 600; box-shadow: none; }
/* Tarifs : .cta-row .btn-cta-pricing (0,3,1) imposait 46 px ; le contour (.btn-outline) garde sa couleur propre */
html.psu body.pricing-page .btn-cta-pricing, html.psu #pricing .pricing-plan-actions .btn-cta-pricing { min-height: var(--psu-h-lg); padding-top: 0; padding-bottom: 0; border-radius: var(--psu-r); font-weight: 600; }
html.psu body.pricing-page .btn-cta-pricing:not(.btn-outline), html.psu[data-dk] body.pricing-page .btn-cta-pricing:not(.btn-outline) { background-color: var(--psu-brand); color: #fff; }
html.psu body.pricing-page .btn-cta-pricing:not(.btn-outline):hover { background-color: var(--psu-brand-hover); }
html.psu body.pricing-page .btn-cta-pricing.btn-outline { color: var(--psu-brand-text); border-color: var(--psu-line); }
@media (max-width: 768px) { html.psu :is(.lnd__b1, .lnd__b2, .why-btn, .abt-btn, .btn-cta-pricing, .flv-btn, .emb__btn) { min-height: 44px; } }

/* PSI-DEBUT — bloc généré par _catalogue/ui_tools/gen_psi.py, ne pas modifier à la main.
   Icônes en CSS (masque) : <span class="psi psi-NOM"></span> pour les éléments créés en JavaScript sans innerHTML ;
   mêmes tracés que ps_icon() ; couleur = currentColor. */
:root {
  --psi-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E");
  --psi-check-circle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12l3 3 5-6'/%3E%3C/svg%3E");
  --psi-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
  --psi-x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
  --psi-edit: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16z'/%3E%3Cpath d='M13.5 6.5l4 4'/%3E%3C/svg%3E");
  --psi-trash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13M10 11v6M14 11v6'/%3E%3C/svg%3E");
  --psi-copy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15V5a2 2 0 0 1 2-2h8'/%3E%3C/svg%3E");
  --psi-download: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11M7 10l5 5 5-5M5 20h14'/%3E%3C/svg%3E");
  --psi-upload: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20V9M7 14l5-5 5 5M5 4h14'/%3E%3C/svg%3E");
  --psi-external: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4h6v6M20 4l-9 9M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5'/%3E%3C/svg%3E");
  --psi-link: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 14a4 4 0 0 0 5.66 0l3-3a4 4 0 0 0-5.66-5.66l-1 1'/%3E%3Cpath d='M14 10a4 4 0 0 0-5.66 0l-3 3a4 4 0 0 0 5.66 5.66l1-1'/%3E%3C/svg%3E");
  --psi-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");
  --psi-sliders: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h9M17 6h3M4 12h3M11 12h9M4 18h11M19 18h1'/%3E%3Ccircle cx='15' cy='6' r='2'/%3E%3Ccircle cx='9' cy='12' r='2'/%3E%3Ccircle cx='17' cy='18' r='2'/%3E%3C/svg%3E");
  --psi-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 20a8 8 0 0 1 16 0'/%3E%3C/svg%3E");
  --psi-users: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.5'/%3E%3Cpath d='M2.5 20a6.5 6.5 0 0 1 13 0M16 4.5a3.5 3.5 0 0 1 0 7M18 14a5.5 5.5 0 0 1 3.5 6'/%3E%3C/svg%3E");
  --psi-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E");
  --psi-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E");
  --psi-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E");
  --psi-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
  --psi-history: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7'/%3E%3Cpath d='M3 4v5h5M12 8v4l3 2'/%3E%3C/svg%3E");
  --psi-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2'/%3E%3Cpath d='M21 16l-5-5L5 20'/%3E%3C/svg%3E");
  --psi-video: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='13' height='12' rx='2'/%3E%3Cpath d='M16 10l5-3v10l-5-3'/%3E%3C/svg%3E");
  --psi-file: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3C/svg%3E");
  --psi-folder: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3C/svg%3E");
  --psi-paperclip: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 12l-8 8a5 5 0 0 1-7-7l9-9a3.5 3.5 0 0 1 5 5l-9 9a2 2 0 0 1-3-3l8-8'/%3E%3C/svg%3E");
  --psi-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.7 5.6 6.1.9-4.4 4.3 1 6.1L12 17l-5.4 2.9 1-6.1-4.4-4.3 6.1-.9z'/%3E%3C/svg%3E");
  --psi-heart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z'/%3E%3C/svg%3E");
  --psi-bell: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 16v-5a6 6 0 0 1 12 0v5l2 2H4z'/%3E%3Cpath d='M10 21h4'/%3E%3C/svg%3E");
  --psi-home: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11l8-7 8 7'/%3E%3Cpath d='M6 9.5V20h12V9.5M10 20v-6h4v6'/%3E%3C/svg%3E");
  --psi-store: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9l1.5-5h13L20 9z'/%3E%3Cpath d='M5 9v11h14V9M10 20v-5h4v5'/%3E%3C/svg%3E");
  --psi-globe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E");
  --psi-chart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 20h18M6 20V11M11 20V5M16 20v-7M21 20v-3'/%3E%3C/svg%3E");
  --psi-trend: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 17l6-6 4 4 8-8'/%3E%3Cpath d='M14 7h7v7'/%3E%3C/svg%3E");
  --psi-target: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Ccircle cx='12' cy='12' r='1'/%3E%3C/svg%3E");
  --psi-megaphone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11v2a1 1 0 0 0 1 1h3l6 4V6L7 10H4a1 1 0 0 0-1 1z'/%3E%3Cpath d='M16 9a4 4 0 0 1 0 6M7 14l1 5h2'/%3E%3C/svg%3E");
  --psi-sparkles: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.6 4.4L18 9l-4.4 1.6L12 15l-1.6-4.4L6 9l4.4-1.6z'/%3E%3Cpath d='M19 15l.8 2.2L22 18l-2.2.8L19 21l-.8-2.2L16 18l2.2-.8z'/%3E%3C/svg%3E");
  --psi-wand: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19L15 9M13 7l4 4M17 3v2M21 7h-2M19.5 4.5l-1.2 1.2'/%3E%3C/svg%3E");
  --psi-palette: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3a9 9 0 1 0 0 18c1 0 1.5-.8 1.5-1.6 0-1.3-1-1.4-1-2.4 0-.9.7-1.5 1.6-1.5H17a4 4 0 0 0 4-4C21 6.6 17 3 12 3z'/%3E%3Ccircle cx='7.5' cy='11' r='1'/%3E%3Ccircle cx='10' cy='7.5' r='1'/%3E%3Ccircle cx='14.5' cy='7.5' r='1'/%3E%3C/svg%3E");
  --psi-layout: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Cpath d='M3 9h18M9 9v11'/%3E%3C/svg%3E");
  --psi-list: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6h11M9 12h11M9 18h11M4.5 6h.01M4.5 12h.01M4.5 18h.01'/%3E%3C/svg%3E");
  --psi-grid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='7' height='7' rx='1.5'/%3E%3Crect x='13' y='4' width='7' height='7' rx='1.5'/%3E%3Crect x='4' y='13' width='7' height='7' rx='1.5'/%3E%3Crect x='13' y='13' width='7' height='7' rx='1.5'/%3E%3C/svg%3E");
  --psi-eye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  --psi-lock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E");
  --psi-unlock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 7.6-1.7'/%3E%3C/svg%3E");
  --psi-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6z'/%3E%3C/svg%3E");
  --psi-key: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='15' r='4'/%3E%3Cpath d='M11 12l9-9M17 6l2 2M15 8l2 2'/%3E%3C/svg%3E");
  --psi-refresh: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.9-3.5L4 9M4 4v5h5M4 13a8 8 0 0 0 14.9 3.5L20 15M20 20v-5h-5'/%3E%3C/svg%3E");
  --psi-arrow-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
  --psi-arrow-left: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M11 6l-6 6 6 6'/%3E%3C/svg%3E");
  --psi-chevron-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
  --psi-chevron-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --psi-more: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='5' cy='12' r='1.2'/%3E%3Ccircle cx='12' cy='12' r='1.2'/%3E%3Ccircle cx='19' cy='12' r='1.2'/%3E%3C/svg%3E");
  --psi-info: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5M12 8h.01'/%3E%3C/svg%3E");
  --psi-alert: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l9 16H3z'/%3E%3Cpath d='M12 10v4M12 17h.01'/%3E%3C/svg%3E");
  --psi-help: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9.5 9a2.5 2.5 0 1 1 3.5 2.3c-.6.3-1 .9-1 1.6V14M12 17h.01'/%3E%3C/svg%3E");
  --psi-play: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 5l12 7-12 7z'/%3E%3C/svg%3E");
  --psi-mic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3'/%3E%3C/svg%3E");
  --psi-message: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H9l-5 4z'/%3E%3C/svg%3E");
  --psi-send: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 3L3 10l7 3 3 7z'/%3E%3Cpath d='M10 13L21 3'/%3E%3C/svg%3E");
  --psi-share: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='18' cy='5' r='2.5'/%3E%3Ccircle cx='6' cy='12' r='2.5'/%3E%3Ccircle cx='18' cy='19' r='2.5'/%3E%3Cpath d='M8.2 10.8l7.6-4.4M8.2 13.2l7.6 4.4'/%3E%3C/svg%3E");
  --psi-tag: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12V4h8l10 10-8 8z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1.2'/%3E%3C/svg%3E");
  --psi-compass: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15.5 8.5l-2 5-5 2 2-5z'/%3E%3C/svg%3E");
  --psi-map-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6-7-11a7 7 0 0 1 14 0c0 5-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E");
  --psi-credit-card: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 10h18M7 15h3'/%3E%3C/svg%3E");
  --psi-gift: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M5 12v8h14v-8M12 8v12M12 8c-1.5-4-5.5-4-5-1 .2 1 2.5 1 5 1 2.5 0 4.8 0 5-1 .5-3-3.5-3-5 1'/%3E%3C/svg%3E");
  --psi-book: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h13v16H6.5A1.5 1.5 0 0 1 5 18.5z'/%3E%3Cpath d='M5 18.5A1.5 1.5 0 0 1 6.5 17H18'/%3E%3C/svg%3E");
  --psi-graduation: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 9l10-5 10 5-10 5z'/%3E%3Cpath d='M6 11v5c3 2 9 2 12 0v-5'/%3E%3C/svg%3E");
  --psi-rocket: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4c3.5 0 6 2.5 6 6l-8 8-6-6z'/%3E%3Ccircle cx='15' cy='9' r='1.5'/%3E%3Cpath d='M9 11l4 4M5 15c-1 1-1 4-1 4s3 0 4-1'/%3E%3C/svg%3E");
  --psi-zap: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 3L5 14h6l-1 7 8-11h-6z'/%3E%3C/svg%3E");
  --psi-layers: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l9 5-9 5-9-5z'/%3E%3Cpath d='M3 13l9 5 9-5'/%3E%3C/svg%3E");
  --psi-bot: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='8' width='16' height='12' rx='3'/%3E%3Cpath d='M12 4v4M9 18h6'/%3E%3Ccircle cx='9' cy='13.5' r='1'/%3E%3Ccircle cx='15' cy='13.5' r='1'/%3E%3C/svg%3E");
  --psi-plug: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 7V3M15 7V3'/%3E%3Cpath d='M6 7h12v4a6 6 0 0 1-12 0z'/%3E%3Cpath d='M12 17v4'/%3E%3C/svg%3E");
  --psi-logout: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 4H5a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h4M15 16l4-4-4-4M19 12H9'/%3E%3C/svg%3E");
}
.psi { display: inline-block; width: 16px; height: 16px; flex: none; vertical-align: -3px; background-color: currentColor;
  -webkit-mask: var(--psi) center / contain no-repeat; mask: var(--psi) center / contain no-repeat; }
.psi--sm { width: 14px; height: 14px; } .psi--lg { width: 20px; height: 20px; }
html.psu .psu-emoji { display: none; }
.psi-check { --psi: var(--psi-check); }
.psi-check-circle { --psi: var(--psi-check-circle); }
.psi-plus { --psi: var(--psi-plus); }
.psi-x { --psi: var(--psi-x); }
.psi-edit { --psi: var(--psi-edit); }
.psi-trash { --psi: var(--psi-trash); }
.psi-copy { --psi: var(--psi-copy); }
.psi-download { --psi: var(--psi-download); }
.psi-upload { --psi: var(--psi-upload); }
.psi-external { --psi: var(--psi-external); }
.psi-link { --psi: var(--psi-link); }
.psi-search { --psi: var(--psi-search); }
.psi-sliders { --psi: var(--psi-sliders); }
.psi-user { --psi: var(--psi-user); }
.psi-users { --psi: var(--psi-users); }
.psi-mail { --psi: var(--psi-mail); }
.psi-phone { --psi: var(--psi-phone); }
.psi-calendar { --psi: var(--psi-calendar); }
.psi-clock { --psi: var(--psi-clock); }
.psi-history { --psi: var(--psi-history); }
.psi-image { --psi: var(--psi-image); }
.psi-video { --psi: var(--psi-video); }
.psi-file { --psi: var(--psi-file); }
.psi-folder { --psi: var(--psi-folder); }
.psi-paperclip { --psi: var(--psi-paperclip); }
.psi-star { --psi: var(--psi-star); }
.psi-heart { --psi: var(--psi-heart); }
.psi-bell { --psi: var(--psi-bell); }
.psi-home { --psi: var(--psi-home); }
.psi-store { --psi: var(--psi-store); }
.psi-globe { --psi: var(--psi-globe); }
.psi-chart { --psi: var(--psi-chart); }
.psi-trend { --psi: var(--psi-trend); }
.psi-target { --psi: var(--psi-target); }
.psi-megaphone { --psi: var(--psi-megaphone); }
.psi-sparkles { --psi: var(--psi-sparkles); }
.psi-wand { --psi: var(--psi-wand); }
.psi-palette { --psi: var(--psi-palette); }
.psi-layout { --psi: var(--psi-layout); }
.psi-list { --psi: var(--psi-list); }
.psi-grid { --psi: var(--psi-grid); }
.psi-eye { --psi: var(--psi-eye); }
.psi-lock { --psi: var(--psi-lock); }
.psi-unlock { --psi: var(--psi-unlock); }
.psi-shield { --psi: var(--psi-shield); }
.psi-key { --psi: var(--psi-key); }
.psi-refresh { --psi: var(--psi-refresh); }
.psi-arrow-right { --psi: var(--psi-arrow-right); }
.psi-arrow-left { --psi: var(--psi-arrow-left); }
.psi-chevron-right { --psi: var(--psi-chevron-right); }
.psi-chevron-down { --psi: var(--psi-chevron-down); }
.psi-more { --psi: var(--psi-more); }
.psi-info { --psi: var(--psi-info); }
.psi-alert { --psi: var(--psi-alert); }
.psi-help { --psi: var(--psi-help); }
.psi-play { --psi: var(--psi-play); }
.psi-mic { --psi: var(--psi-mic); }
.psi-message { --psi: var(--psi-message); }
.psi-send { --psi: var(--psi-send); }
.psi-share { --psi: var(--psi-share); }
.psi-tag { --psi: var(--psi-tag); }
.psi-compass { --psi: var(--psi-compass); }
.psi-map-pin { --psi: var(--psi-map-pin); }
.psi-credit-card { --psi: var(--psi-credit-card); }
.psi-gift { --psi: var(--psi-gift); }
.psi-book { --psi: var(--psi-book); }
.psi-graduation { --psi: var(--psi-graduation); }
.psi-rocket { --psi: var(--psi-rocket); }
.psi-zap { --psi: var(--psi-zap); }
.psi-layers { --psi: var(--psi-layers); }
.psi-bot { --psi: var(--psi-bot); }
.psi-plug { --psi: var(--psi-plug); }
.psi-logout { --psi: var(--psi-logout); }
/* Font Awesome d'interface → icônes au trait (pages adoptées) ; logos de marque inchangés */
html.psu :is(.fa-trash, .fa-trash-alt, .fa-trash-can, .fa-times, .fa-xmark, .fa-plus, .fa-pen, .fa-pencil, .fa-pencil-alt, .fa-pen-to-square, .fa-edit, .fa-upload, .fa-download, .fa-external-link-alt, .fa-up-right-from-square, .fa-sync-alt, .fa-sync, .fa-rotate, .fa-arrows-rotate, .fa-redo, .fa-history, .fa-clock-rotate-left, .fa-globe, .fa-clock, .fa-circle-info, .fa-info-circle, .fa-calendar-check, .fa-calendar-alt, .fa-calendar, .fa-calendar-days, .fa-images, .fa-image, .fa-photo-video, .fa-photo-film, .fa-file-alt, .fa-file-lines, .fa-file, .fa-circle-play, .fa-play-circle, .fa-play, .fa-chevron-down, .fa-chevron-right, .fa-store, .fa-link, .fa-copy, .fa-search, .fa-magnifying-glass, .fa-check, .fa-bell, .fa-user, .fa-envelope, .fa-lock, .fa-eye, .fa-star, .fa-heart, .fa-share, .fa-share-alt, .fa-gear, .fa-cog, .fa-sliders-h, .fa-chart-line, .fa-chart-bar, .fa-bullhorn, .fa-magic, .fa-wand-magic-sparkles, .fa-video, .fa-folder, .fa-home, .fa-house, .fa-map-marker-alt, .fa-location-dot, .fa-tag, .fa-paper-plane, .fa-comment, .fa-comments, .fa-list, .fa-th, .fa-table-cells, .fa-robot, .fa-rocket, .fa-bolt, .fa-layer-group, .fa-arrow-right, .fa-arrow-left, .fa-ellipsis-h, .fa-ellipsis, .fa-exclamation-triangle, .fa-triangle-exclamation, .fa-question-circle, .fa-circle-question)::before {
  content: "" !important; display: inline-block; width: 1em; height: 1em; vertical-align: -0.125em; background-color: currentColor;
  -webkit-mask: var(--psi) center / contain no-repeat; mask: var(--psi) center / contain no-repeat; }
html.psu :is(.fa-trash, .fa-trash-alt, .fa-trash-can)::before { --psi: var(--psi-trash); }
html.psu :is(.fa-times, .fa-xmark)::before { --psi: var(--psi-x); }
html.psu :is(.fa-plus)::before { --psi: var(--psi-plus); }
html.psu :is(.fa-pen, .fa-pencil, .fa-pencil-alt, .fa-pen-to-square, .fa-edit)::before { --psi: var(--psi-edit); }
html.psu :is(.fa-upload)::before { --psi: var(--psi-upload); }
html.psu :is(.fa-download)::before { --psi: var(--psi-download); }
html.psu :is(.fa-external-link-alt, .fa-up-right-from-square)::before { --psi: var(--psi-external); }
html.psu :is(.fa-sync-alt, .fa-sync, .fa-rotate, .fa-arrows-rotate, .fa-redo)::before { --psi: var(--psi-refresh); }
html.psu :is(.fa-history, .fa-clock-rotate-left)::before { --psi: var(--psi-history); }
html.psu :is(.fa-globe)::before { --psi: var(--psi-globe); }
html.psu :is(.fa-clock)::before { --psi: var(--psi-clock); }
html.psu :is(.fa-circle-info, .fa-info-circle)::before { --psi: var(--psi-info); }
html.psu :is(.fa-calendar-check, .fa-calendar-alt, .fa-calendar, .fa-calendar-days)::before { --psi: var(--psi-calendar); }
html.psu :is(.fa-images, .fa-image, .fa-photo-video, .fa-photo-film)::before { --psi: var(--psi-image); }
html.psu :is(.fa-file-alt, .fa-file-lines, .fa-file)::before { --psi: var(--psi-file); }
html.psu :is(.fa-circle-play, .fa-play-circle, .fa-play)::before { --psi: var(--psi-play); }
html.psu :is(.fa-chevron-down)::before { --psi: var(--psi-chevron-down); }
html.psu :is(.fa-chevron-right)::before { --psi: var(--psi-chevron-right); }
html.psu :is(.fa-store)::before { --psi: var(--psi-store); }
html.psu :is(.fa-link)::before { --psi: var(--psi-link); }
html.psu :is(.fa-copy)::before { --psi: var(--psi-copy); }
html.psu :is(.fa-search, .fa-magnifying-glass)::before { --psi: var(--psi-search); }
html.psu :is(.fa-check)::before { --psi: var(--psi-check); }
html.psu :is(.fa-bell)::before { --psi: var(--psi-bell); }
html.psu :is(.fa-user)::before { --psi: var(--psi-user); }
html.psu :is(.fa-envelope)::before { --psi: var(--psi-mail); }
html.psu :is(.fa-lock)::before { --psi: var(--psi-lock); }
html.psu :is(.fa-eye)::before { --psi: var(--psi-eye); }
html.psu :is(.fa-star)::before { --psi: var(--psi-star); }
html.psu :is(.fa-heart)::before { --psi: var(--psi-heart); }
html.psu :is(.fa-share, .fa-share-alt)::before { --psi: var(--psi-share); }
html.psu :is(.fa-gear, .fa-cog, .fa-sliders-h)::before { --psi: var(--psi-sliders); }
html.psu :is(.fa-chart-line)::before { --psi: var(--psi-trend); }
html.psu :is(.fa-chart-bar)::before { --psi: var(--psi-chart); }
html.psu :is(.fa-bullhorn)::before { --psi: var(--psi-megaphone); }
html.psu :is(.fa-magic, .fa-wand-magic-sparkles)::before { --psi: var(--psi-wand); }
html.psu :is(.fa-video)::before { --psi: var(--psi-video); }
html.psu :is(.fa-folder)::before { --psi: var(--psi-folder); }
html.psu :is(.fa-home, .fa-house)::before { --psi: var(--psi-home); }
html.psu :is(.fa-map-marker-alt, .fa-location-dot)::before { --psi: var(--psi-map-pin); }
html.psu :is(.fa-tag)::before { --psi: var(--psi-tag); }
html.psu :is(.fa-paper-plane)::before { --psi: var(--psi-send); }
html.psu :is(.fa-comment, .fa-comments)::before { --psi: var(--psi-message); }
html.psu :is(.fa-list)::before { --psi: var(--psi-list); }
html.psu :is(.fa-th, .fa-table-cells)::before { --psi: var(--psi-grid); }
html.psu :is(.fa-robot)::before { --psi: var(--psi-bot); }
html.psu :is(.fa-rocket)::before { --psi: var(--psi-rocket); }
html.psu :is(.fa-bolt)::before { --psi: var(--psi-zap); }
html.psu :is(.fa-layer-group)::before { --psi: var(--psi-layers); }
html.psu :is(.fa-arrow-right)::before { --psi: var(--psi-arrow-right); }
html.psu :is(.fa-arrow-left)::before { --psi: var(--psi-arrow-left); }
html.psu :is(.fa-ellipsis-h, .fa-ellipsis)::before { --psi: var(--psi-more); }
html.psu :is(.fa-exclamation-triangle, .fa-triangle-exclamation)::before { --psi: var(--psi-alert); }
html.psu :is(.fa-question-circle, .fa-circle-question)::before { --psi: var(--psi-help); }
/* PSI-FIN */

@media (prefers-reduced-motion: reduce) { .psu-btn { transition: none; } }