@layer components{
  /* ══ Socle composants - CDC_UPDATE.md lot U2 ══
     .btn : équivalent visuel du button global (03-layout.css:137) mais portable
     sur <a>/<label>. Variantes primary/secondary/danger/ghost, tailles sm/lg/mini.
     .btn-sm = alias historique émis par certains JS (= .btn.sm). */
  .btn,.btn-sm{font:inherit;font-size:var(--fs-md);border:1px solid var(--line);background:var(--card);color:var(--txt);
    padding:var(--sp-6) var(--sp-12);border-radius:var(--radius-sm);cursor:pointer;font-weight:var(--fw-medium);
    display:inline-flex;align-items:center;gap:var(--sp-6);text-decoration:none;user-select:none;
    transition:background .12s,border-color .12s,color .12s}
  .btn:hover,.btn-sm:hover{border-color:var(--mut2);background:var(--line2)}
  .btn.primary{background:var(--accent-plein);border-color:var(--accent-plein);color:var(--on-solid)}   /* --accent-plein : lisible sous l'encre blanche en sombre (2026-10-16) */
  .btn.primary:hover{background:color-mix(in srgb,var(--accent-plein) 88%,#000);border-color:color-mix(in srgb,var(--accent-plein) 88%,#000)}
  .btn.secondary{background:var(--card);border-color:color-mix(in srgb,var(--accent) 45%,var(--line));color:var(--txt)}
  .btn.secondary:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 6%,var(--card))}
  .btn.danger{border-color:color-mix(in srgb,var(--err) 40%,var(--line));color:var(--err);background:transparent}
  .btn.danger:hover{background:var(--err);color:var(--on-solid);border-color:var(--err)}
  .btn.ghost{border-color:transparent;background:transparent;color:var(--mut)}
  .btn.ghost:hover{color:var(--txt);background:var(--line2);border-color:transparent}
  /* Tailles */
  .btn.sm,.btn-sm{font-size:var(--fs-sm);padding:var(--sp-4) var(--sp-8)}
  .btn.lg{font-size:var(--fs-base);padding:var(--sp-8) var(--sp-16)}
  /* .mini : géométrie héritée de 11-business.css:402 (qui garde la main en cascade) */
  .btn.mini{padding:var(--sp-4) var(--sp-12);font-size:var(--fs-sm);font-weight:var(--fw-strong);background:var(--card2)}
  .btn.mini:hover{background:var(--card);border-color:var(--accent)}
  .btn[disabled],.btn.loading,.btn-sm[disabled]{opacity:.55;pointer-events:none}

  /* En-tête de section : titre + sous-titre + actions à droite */
  .sec-head{display:flex;align-items:flex-start;gap:var(--sp-14);margin-bottom:var(--sp-14)}
  .sec-head h2{margin:0 0 var(--sp-2);font-size:var(--fs-lg)}
  .sec-head p{margin:0;color:var(--mut);font-size:var(--fs-md)}
  .sec-head .sec-actions{margin-left:auto;display:flex;gap:var(--sp-8)}

  /* État vide générique */
  .empty-state{text-align:center;color:var(--mut);font-size:var(--fs-md);padding:var(--sp-26) var(--sp-16)}
  .empty-state .es-title{font-weight:var(--fw-strong);color:var(--txt);font-size:var(--fs-base);margin-bottom:var(--sp-4)}
  .empty-state .es-act{margin-top:var(--sp-12)}

  /* Scrollbars utilitaires */
  /* Conservé pour le code existant : la barre maison s'applique déjà partout. */
  .scroll-thin{scrollbar-color:var(--sb-thumb) transparent}
  .scroll-thin::-webkit-scrollbar{width:var(--sb-size);height:var(--sb-size)}
  .scroll-thin::-webkit-scrollbar-thumb{background:var(--sb-thumb);border-radius:var(--radius-pill);
    border:var(--sb-pad) solid transparent;background-clip:padding-box}
  .scroll-thin::-webkit-scrollbar-track{background:transparent}
  .scroll-hidden{scrollbar-width:none}
  .scroll-hidden::-webkit-scrollbar{display:none}
  /* ══ Fin socle composants ══ */

  /* ── Modal (native <dialog>) ── */
  dialog{border:none;padding:0;background:transparent;color:var(--txt);max-width:none;max-height:none;margin:auto}
  dialog::backdrop{background:var(--backdrop);backdrop-filter:blur(3px)}
  @media (prefers-reduced-motion:no-preference){
    dialog[open]{animation:pop .16s ease}
    @keyframes pop{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
  }
  .modal-card{width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto;
    background:var(--card);border:1px solid var(--line);border-radius:var(--radius-modal);box-shadow:var(--elev-1)}
  .modal-head{position:sticky;top:0;background:var(--card);display:flex;align-items:center;gap:var(--sp-12);
    padding:var(--sp-18) var(--sp-20);border-bottom:1px solid var(--line);z-index:1}
  .modal-head h2{margin:0;font-size:var(--fs-lg);font-weight:var(--fw-strong);flex:1;letter-spacing:-.01em}
  .modal-body{padding:var(--sp-18) var(--sp-20)}
  .modal-foot{position:sticky;bottom:0;background:var(--card);display:flex;gap:var(--sp-10);justify-content:flex-end;
    padding:var(--sp-16) var(--sp-20);border-top:1px solid var(--line)}
  .modal-foot .left{margin-right:auto}
  #modal.wide .modal-card{width:min(920px,calc(100vw - 32px))}

  /* ── Assistant « Nouveau projet » - modal plein format, split 1/3 (rail) / 2/3 (contenu) ── */
  /* Format FIXE et compact : la carte ne bouge plus d'une étape à l'autre - le chrome
     reste immobile, seul le contenu change. Les étapes longues défilent (cf. chaîne de
     contrainte plus bas), les courtes respirent. */
  #modal.wizard .modal-card{width:min(1020px,calc(100vw - 28px));height:min(660px,calc(100vh - 40px));
    display:flex;flex-direction:column;overflow:hidden}
  /* Survols instantanés : les transitions rendaient les longues listes poussives
     (des dizaines de lignes repeintes au passage de la souris). */
  #modal.wizard *,#modal.wizard *::before,#modal.wizard *::after{transition-duration:0s}
  #modal.wizard .wizx{flex:1 1 auto;min-height:0}
  #modal.wizard .wizx-head h3:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:var(--radius-xs)}
  #modal.wizard .wizx-head h3:focus:not(:focus-visible){outline:none}
  #modal.wizard .modal-head{display:none}
  /* Chaîne de contrainte : la carte plafonne, le corps se comprime, le contenu défile.
     Sans `display:flex` + `min-height:0` ici, une étape longue pousse la grille au-delà
     du plafond et se fait couper par l'`overflow:hidden` de la carte au lieu de défiler. */
  #modal.wizard .modal-body{flex:1 1 auto;min-height:0;padding:0;display:flex;overflow:hidden}
  .wizx{display:grid;grid-template-columns:minmax(258px,1fr) 2.2fr;min-height:0}
  .wizx-side{position:relative;display:flex;flex-direction:column;gap:var(--sp-12);padding:var(--sp-18) var(--sp-16) var(--sp-14);
    border-right:1px solid var(--line);background:var(--bg2);min-height:0;overflow:auto}
  /* Halo d'accent en haut de colonne : donne un point de départ au regard sans bruit. */
  .wizx-side::before{content:"";position:absolute;inset:0 0 auto;height:210px;pointer-events:none;
    background:radial-gradient(120% 100% at 22% 0,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%)}
  .wizx-side>*{position:relative}
  .wizx-brand{display:flex;align-items:center;gap:var(--sp-8)}
  .wizx-logo{width:30px;height:30px;border-radius:var(--radius);display:grid;place-items:center;flex:none;
    background:linear-gradient(135deg,var(--accent),var(--accent-h));color:var(--on-solid);
    box-shadow:0 3px 10px color-mix(in srgb,var(--accent) 32%,transparent)}
  .wizx-logo svg.ic{width:16px;height:16px}
  .wizx-bt{font-weight:var(--fw-bold);font-size:var(--fs-base);letter-spacing:-.01em}
  .wizx-bs{font-size:var(--fs-xs);color:var(--mut)}
  /* Jauge d'avancement : le repère immédiat, avant même de lire le rail. */
  .wizx-prog{height:3px;border-radius:var(--radius-xs);background:var(--line2);overflow:hidden;flex:none}
  .wizx-prog i{display:block;height:100%;border-radius:var(--radius-xs);background:var(--accent)}
  .wizx-art{margin:0 -4px;flex:none}
  .wizx-art svg{width:100%;height:auto;display:block;max-height:124px}
  .wizx-side--launch .wizx-art svg{max-height:210px}
  .wizx-rail{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;flex:0 0 auto}
  .wizx-fill{flex:1 1 auto;min-height:4px}
  .wizx-step{display:flex;gap:var(--sp-10);position:relative;padding:0 0 var(--sp-12);min-width:0}
  .wizx-step:last-child{padding-bottom:0}
  .wizx-step::before{content:"";position:absolute;left:9.5px;top:23px;bottom:3px;width:1.5px;border-radius:var(--radius-xs);background:var(--line2)}
  .wizx-step:last-child::before{display:none}
  .wizx-step.done::before{background:color-mix(in srgb,var(--accent) 45%,var(--line))}
  .wizx-dot{width:20px;height:20px;border-radius:50%;flex:none;display:grid;place-items:center;
    font-size:var(--fs-2xs);font-weight:var(--fw-bold);background:var(--card2);border:1.5px solid var(--line);color:var(--mut)}
  .wizx-dot svg.ic{width:11px;height:11px}
  .wizx-step.on .wizx-dot{background:var(--accent);border-color:var(--accent);color:var(--on-solid);
    box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}
  .wizx-step.done .wizx-dot{background:color-mix(in srgb,var(--accent) 14%,var(--card2));border-color:var(--accent);color:var(--accent)}
  .wizx-stxt{display:flex;flex-direction:column;min-width:0;padding-top:var(--sp-1)}
  .wizx-sl{font-size:var(--fs-sm);font-weight:var(--fw-strong);line-height:var(--lh-tight);color:var(--txt)}
  .wizx-step:not(.on):not(.done) .wizx-sl{color:var(--mut)}
  .wizx-sd{font-size:var(--fs-xs);color:var(--mut);margin-top:var(--sp-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .wizx-sbtn{display:flex;gap:var(--sp-10);background:none;border:0;padding:0;margin:0;cursor:pointer;
    text-align:left;color:inherit;font:inherit;min-width:0;flex:1}
  .wizx-sbtn:hover .wizx-sl{color:var(--accent)}
  .wizx-reassure{display:flex;gap:var(--sp-6);align-items:flex-start;font-size:var(--fs-2xs);color:var(--mut2);line-height:1.45;
    margin:0;padding-top:var(--sp-10);border-top:1px solid var(--line2)}
  .wizx-reassure svg.ic{width:12px;height:12px;flex:none;margin-top:var(--sp-1)}
  .wizx-main{display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden;position:relative}
  .wizx-close{position:absolute;top:12px;right:12px;z-index:2}
  .wizx-head{padding:var(--sp-18) var(--sp-24) var(--sp-2);padding-right:var(--sp-52)}
  .wizx-stepn{font-size:var(--fs-2xs);font-weight:var(--fw-bold);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--accent)}
  .wizx-head h3{margin:var(--sp-2) 0 var(--sp-4);font-size:var(--fs-lg);font-weight:var(--fw-bold);letter-spacing:-.015em}
  .wizx-lead{margin:0;font-size:var(--fs-sm);color:var(--mut);line-height:var(--lh-normal);max-width:600px}
  .wizx-lead b{color:var(--txt);font-weight:var(--fw-strong)}
  .wizx-content{flex:1;min-height:0;overflow:auto;padding:var(--sp-14) var(--sp-24) var(--sp-10);display:flex;flex-direction:column}
  .wizx-content>*{flex:none}
  .wizx-foot{display:flex;align-items:center;gap:var(--sp-8);padding:var(--sp-10) var(--sp-24);border-top:1px solid var(--line);background:var(--card)}
  .wizx-foot .primary svg.ic{width:15px;height:15px;vertical-align:-2px;margin-right:var(--sp-4)}
  .wizx-foot .primary[disabled]{opacity:.45;cursor:not-allowed}
  .wizx-foot-sp{flex:1 1 auto}
  .wizx-block{font-size:var(--fs-sm);color:var(--mut);text-align:right}
  .wizx-now{background:none;border:0;padding:var(--sp-6) var(--sp-4);color:var(--accent);font-weight:var(--fw-strong);font-size:var(--fs-sm);
    cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
  .wizx-now:hover{color:var(--accent-h,var(--accent));text-decoration-thickness:2px}
  /* Écran de démarrage : les cartes s'étirent pour occuper la hauteur au lieu de
     flotter au milieu ; le reste part en marges automatiques. */
  .wizx-content--center{padding-bottom:var(--sp-18)}
  .wizx-content--center>.wiz-launch{flex:1 1 auto;min-height:230px;max-height:420px;margin:auto 0}
  /* Doublage de classe : .wizx-will est déclaré PLUS BAS à spécificité égale et gagnerait sinon. */
  .wizx-will.wizx-will--promise{background:var(--card);border:0}
  .wizx-will--promise ul{margin:0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:var(--sp-6)}
  .wizx-will--promise li{position:relative;padding-left:var(--sp-16);font-size:var(--fs-xs);color:var(--mut);line-height:1.45}
  .wizx-will--promise li::before{content:"";position:absolute;left:2px;top:6px;width:5px;height:5px;
    border-radius:50%;background:color-mix(in srgb,var(--accent) 70%,transparent)}
  .wizx-will--promise li b{color:var(--txt)}
  #modal.wizard .wiz-glist{flex:1 1 auto;max-height:none;min-height:180px}
  #modal.wizard .fb-list{max-height:none;min-height:180px}
  /* Récap - « ce qui va se passer » */
  .wizx-will{border:1px solid var(--line);border-radius:var(--radius-sm);
    background:color-mix(in srgb,var(--accent) 4%,var(--card2));padding:var(--sp-8) var(--sp-10);max-height:36vh;overflow:auto}
  .wizx-will-t{display:flex;align-items:center;gap:var(--sp-4);font-size:var(--fs-2xs);font-weight:var(--fw-bold);letter-spacing:.06em;
    text-transform:uppercase;color:var(--accent);margin-bottom:var(--sp-4)}
  .wizx-will-t svg.ic{width:11px;height:11px}
  .wizx-will ol{margin:0;padding-left:var(--sp-14);display:flex;flex-direction:column;gap:var(--sp-4)}
  .wizx-will li{font-size:var(--fs-xs);color:var(--mut);line-height:1.42}
  .wizx-will li b{color:var(--txt)} .wizx-will li code{font-size:var(--fs-2xs);word-break:break-all}
  /* Étape « Compléments » */
  .wiz-adwrap{flex:0 1 auto;min-height:170px;max-height:min(46vh,360px);overflow:auto;border:1px solid var(--line);border-radius:var(--radius-sm);
    padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-1)}
  .wiz-ad{display:flex;align-items:flex-start;gap:var(--sp-10);padding:var(--sp-8) var(--sp-8);border-radius:var(--radius);cursor:pointer}
  .wiz-ad:hover{background:var(--line2)}
  .wiz-ad.on{background:color-mix(in srgb,var(--accent) 7%,transparent)}
  .wiz-ad.locked{cursor:default}
  .wiz-ad .wiz-tcb{margin-top:var(--sp-6)}
  .wiz-ad .cmp-ic{width:30px;height:30px;flex:none}
  .wiz-ad-main{display:flex;flex-direction:column;gap:var(--sp-2);min-width:0;flex:1}
  .wiz-ad-n{font-size:var(--fs-md);font-weight:var(--fw-strong)}
  .wiz-ad-v{font-size:var(--fs-2xs);color:var(--mut2);font-weight:var(--fw-medium)}
  .wiz-ad-d{font-size:var(--fs-xs);color:var(--mut);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .wiz-ad-cat{font-size:var(--fs-2xs);color:var(--mut2);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;
    border:1px solid var(--line2);border-radius:var(--radius-pill);padding:var(--sp-2) var(--sp-8);margin-top:var(--sp-4)}
  .wiz-adcfg{margin-top:var(--sp-12);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--card2);padding:var(--sp-12) var(--sp-14)}
  .wiz-adcfg-t{font-size:var(--fs-sm);font-weight:var(--fw-bold);display:flex;align-items:center;gap:var(--sp-6);margin-bottom:var(--sp-2)}
  .wiz-adcfg-t svg.ic{width:13px;height:13px;color:var(--accent)}
  .wiz-adcfg-s{font-size:var(--fs-xs);color:var(--mut);margin:0 0 var(--sp-10)}
  /* Écran étroit : rail horizontal compact en bandeau, illustration masquée */
  @media(max-width:880px){
    #modal.wizard .modal-card{height:calc(100vh - 20px);width:calc(100vw - 16px)}
    .wizx{grid-template-columns:1fr;grid-template-rows:auto 1fr}
    .wizx-side{flex-direction:row;align-items:center;gap:var(--sp-14);border-right:0;border-bottom:1px solid var(--line);
      padding:var(--sp-12) var(--sp-16);overflow-x:auto;overflow-y:hidden}
    .wizx-art,.wizx-reassure,.wizx-sd,.wizx-bs,.wizx-will,.wizx-fill,.wizx-prog{display:none}
    .wizx-side::before{display:none}
    .wizx-rail{flex-direction:row;gap:var(--sp-14);flex:1}
    .wizx-block{display:none}                      /* la raison reste dans le toast au clic */
    .wiz-idn{max-width:none}
    .wizx-step{padding:0;align-items:center}
    .wizx-step::before{display:none}
    .wizx-head{padding:var(--sp-18) var(--sp-20) var(--sp-4)}
    .wizx-content{padding:var(--sp-14) var(--sp-20) var(--sp-10)}
    .wizx-foot{padding:var(--sp-12) var(--sp-20)}
  }
  /* Store des compléments */
  .cmps-bar{margin-bottom:var(--sp-12)}
  .cmps-search{width:100%;padding:var(--sp-8) var(--sp-12);font-size:var(--fs-md)}
  .cmps-chips{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin-bottom:var(--sp-16)}
  .cmps-chip{font-size:var(--fs-sm);color:var(--mut);background:var(--card2);border:1px solid var(--line);
    border-radius:var(--radius-pill);padding:var(--sp-4) var(--sp-12);cursor:pointer;white-space:nowrap;transition:all .12s}
  .cmps-chip:hover{color:var(--txt);border-color:var(--mut2)}
  .cmps-chip.on{background:var(--accent);border-color:var(--accent);color:var(--on-solid)}
  .cmps-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-12)}
  #tabpane .cmps-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}   /* la Librairie dans la page (2026-10-18) : autant de colonnes que la largeur le permet */
  /* L'en-tête de la Librairie dans la page (2026-10-18) : une ligne, le retour en carré, le titre, la recherche pleine à droite. */
  .cmps-tete{display:flex;align-items:center;gap:var(--sp-10);margin-bottom:var(--sp-14)}
  .cmps-retour{display:grid;place-items:center;flex:none;width:32px;height:32px;padding:0;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--card);color:var(--txt);cursor:pointer}
  .cmps-retour:hover{background:var(--line2)} .cmps-retour svg.ic{width:16px;height:16px}
  .cmps-titre{flex:1;min-width:0;margin:0;font-size:var(--fs-lg);font-weight:var(--fw-strong);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .cmps-cherche{display:flex;align-items:center;gap:var(--sp-6);flex:0 1 280px;min-width:160px;height:32px;padding:0 var(--sp-10);border-radius:var(--radius-sm);background:color-mix(in srgb,var(--txt) 6%,var(--card));color:var(--mut)}
  .cmps-cherche svg.ic{width:14px;height:14px;flex:none}
  .cmps-tete .cmps-search{flex:1;min-width:0;width:auto;height:100%;padding:0;border:0;background:transparent;color:var(--txt);font-size:var(--fs-sm);box-shadow:none}
  .cmps-tete .cmps-search:focus{outline:none}
  .cmps-cherche:focus-within{box-shadow:0 0 0 2px var(--focus-anneau)}
  @media(max-width:640px){ .cmps-grid{grid-template-columns:1fr} }
  .cmps-card{display:flex;flex-direction:column;gap:var(--sp-8);background:var(--card2);border:1px solid var(--line2);
    border-radius:var(--radius);padding:var(--sp-12) var(--sp-14)}
  .cmps-top{display:flex;align-items:center;gap:var(--sp-10)}
  .cmps-id{display:flex;flex-direction:column;min-width:0}
  .cmps-cat{font-size:var(--fs-2xs);color:var(--mut2);text-transform:uppercase;letter-spacing:.04em;margin-top:var(--sp-2)}
  .cmps-card .cmp-desc{flex:1;margin-top:0}
  .cmps-stats{display:flex;align-items:center;gap:var(--sp-10);font-size:var(--fs-xs);color:var(--mut);flex-wrap:wrap}
  .cmp-stars{color:var(--accent);font-size:var(--fs-sm);letter-spacing:1px}
  .cmp-stars-off{color:var(--line)}
  .cmps-foot{display:flex;align-items:center;gap:var(--sp-8);border-top:1px solid var(--line2);padding-top:var(--sp-8)}
  .cmps-foot .mini svg.ic{width:14px;height:14px}

  /* ── Formulaires ── */
  .field{margin-bottom:var(--sp-14)}
  .field:last-child{margin-bottom:0}
  .two{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-14)}
  .three{display:grid;grid-template-columns:1fr 1.6fr 1fr;gap:var(--sp-14)}
  @media(max-width:480px){ .two,.three{grid-template-columns:1fr} }
  /* Une bordure qui englobe, un trait entre les entreprises (le proprio, 2026-10-25, comme les environnements et les plans). */
  .ent-list{display:flex;flex-direction:column;margin-top:var(--sp-12);border:.5px solid var(--line);border-radius:var(--radius);background:var(--bg2);overflow:hidden}
  .ent-card{display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-10) var(--sp-12)}
  .ent-card+.ent-card{border-top:.5px solid var(--line)}
  .ent-card-ic{flex:none;width:36px;height:36px;display:grid;place-items:center;border-radius:var(--radius);background:var(--card2);color:var(--accent)}
  .ent-card-ic svg{width:19px;height:19px}
  .ent-card-r{flex:1;min-width:0}
  .ent-card-n{font-size:var(--fs-md);font-weight:var(--fw-strong)}
  .ent-card-d{font-size:var(--fs-sm);color:var(--mut);margin-top:var(--sp-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ent-empty{display:flex;align-items:center;gap:var(--sp-12);margin-top:var(--sp-12);padding:var(--sp-18) var(--sp-16);border:1px dashed var(--line);border-radius:var(--radius-sm);color:var(--mut);font-size:var(--fs-sm);line-height:var(--lh-normal)}
  .ent-empty svg{flex:none;width:26px;height:26px;color:var(--mut2)}
  /* ── Logo entreprise ── */
  .ent-head-with-logo{display:flex;align-items:flex-start;gap:var(--sp-16)}
  .ent-head-text{flex:1;min-width:0}
  .ent-logo-zone{position:relative;width:68px;height:68px;flex:none;border-radius:var(--radius);background:var(--bg2);border:1.5px solid var(--line);display:grid;place-items:center;cursor:pointer;overflow:hidden;transition:border-color .15s,box-shadow .15s;user-select:none}
  .ent-logo-zone:hover{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)}
  .ent-logo-ph{display:grid;place-items:center;color:var(--mut2)}
  .ent-logo-ph svg.ic{width:28px;height:28px}
  .ent-logo-img{width:100%;height:100%;object-fit:cover;display:block}
  .ent-logo-ovl{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.42);color:var(--on-solid);opacity:0;transition:opacity .15s;pointer-events:none}
  .ent-logo-ovl svg.ic{width:17px;height:17px}
  .ent-logo-zone:hover .ent-logo-ovl{opacity:1}
  .ent-logo-rm{position:absolute;top:4px;right:4px;width:19px;height:19px;border-radius:50%;background:rgba(0,0,0,.6);color:var(--on-solid);border:none;cursor:pointer;display:grid;place-items:center;padding:0;opacity:0;transition:opacity .15s;z-index:2;line-height:var(--lh-flat)}
  .ent-logo-rm svg.ic{width:10px;height:10px}
  .ent-logo-zone:hover .ent-logo-rm{opacity:1}
  .lang-list{display:flex;flex-direction:column;gap:var(--sp-8);margin-top:var(--sp-10)}
  .lang-row{display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-10) var(--sp-12);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2)}
  .lang-row.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
  .lang-r{flex:1;min-width:0}
  .lang-n{font-size:var(--fs-md);font-weight:var(--fw-strong);display:flex;align-items:center;gap:var(--sp-8)}
  .lang-d{font-size:var(--fs-xs);color:var(--mut);margin-top:var(--sp-2)}
  .lang-tag{font-size:var(--fs-2xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.03em;padding:var(--sp-2) var(--sp-6);border-radius:var(--radius-pill);background:var(--card2);color:var(--mut);border:1px solid var(--line)}
  .lang-tag.ok{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
  .lang-tag.mut{opacity:.7}
  .lang-x{flex:none;width:30px;height:30px;display:grid;place-items:center;padding:0;border:1px solid var(--line);border-radius:var(--radius-sm);background:transparent;color:var(--mut);cursor:pointer}
  .lang-x:hover{color:var(--err);border-color:var(--err)}
  .lang-x svg{width:15px;height:15px}
  label{font-size:var(--fs-sm);color:var(--mut);display:block;margin-bottom:var(--sp-4);font-weight:var(--fw-medium)}
  .req{color:var(--err)}
  input,select{width:100%;background:var(--bg2);border:1px solid var(--line);color:var(--txt);
    padding:var(--sp-8) var(--sp-10);border-radius:var(--radius-sm);font:inherit;font-size:var(--fs-base)}
  input[type=checkbox],input[type=radio]{width:auto;padding:0;border:revert;background:revert}
  input::placeholder{color:var(--mut2)}
  input:hover,select:hover{border-color:var(--mut2)}
  input:focus,select:focus{border-color:var(--accent)}
  /* Chrome peint tout champ auto-rempli en jaune/bleu pâle, ignore `background`
     et ne laisse passer qu'une ombre : on ré-injecte donc le fond normal en
     `box-shadow` inset (assez large pour couvrir le champ) plutôt qu'en
     background - c'est le seul levier qui marche sur l'autofill. Le délai de
     transition à 9999s empêche le flash jaune le temps que Chrome bascule. */
  input:-webkit-autofill,
  input:-webkit-autofill:hover,
  input:-webkit-autofill:focus{
    -webkit-text-fill-color:var(--txt);caret-color:var(--txt);
    -webkit-box-shadow:0 0 0 1000px var(--bg2) inset;
    box-shadow:0 0 0 1000px var(--bg2) inset;
    transition:background-color 9999s ease-in-out 0s}
  .field .desc{font-size:var(--fs-xs);color:var(--mut2);margin-top:var(--sp-4)}
  .field textarea{width:100%;background:var(--bg2);border:1px solid var(--line);color:var(--txt);
    padding:var(--sp-8) var(--sp-10);border-radius:var(--radius-sm);font:inherit;font-size:var(--fs-base);resize:vertical;line-height:var(--lh-normal)}
  .field textarea::placeholder{color:var(--mut2)}
  .field textarea:hover{border-color:var(--mut2)} .field textarea:focus{border-color:var(--accent);outline:none}
  input[type=color]{padding:var(--sp-2);height:40px;cursor:pointer}
  .color-row{display:flex;gap:var(--sp-10);align-items:center}
  .color-row input[type=color]{width:52px;flex:none}
  .color-row input[type=text]{flex:1;font-family:var(--font-mono)}

  /* ── Assistant « Nouveau projet » ── */
  .wiz-prog{margin-bottom:var(--sp-18)}
  .wiz-dots{display:flex;gap:var(--sp-6);margin-bottom:var(--sp-8)}
  .wiz-dot{flex:1;height:5px;border-radius:var(--radius-xs);border:0;padding:0;background:var(--line);transition:background .15s}
  .wiz-dot.done{background:color-mix(in srgb,var(--accent) 55%,var(--line));cursor:pointer}
  .wiz-dot.done:hover{background:var(--accent)}
  .wiz-dot.on{background:var(--accent)}
  .wiz-prog-l{font-size:var(--fs-sm);color:var(--mut)}
  .wiz-prog-n{font-weight:var(--fw-strong);color:var(--txt)}
  .wiz-lead{margin:0 0 var(--sp-14);font-size:var(--fs-base);color:var(--mut)}
  .wiz-lead b{color:var(--txt);font-weight:var(--fw-strong)}
  /* Tuiles de plateformes (cible) */
  .wiz-sep{display:flex;align-items:center;gap:var(--sp-10);margin:var(--sp-20) 0 var(--sp-10);font-size:var(--fs-xs);font-weight:var(--fw-bold);
    letter-spacing:.06em;text-transform:uppercase;color:var(--mut2)}
  .wiz-sep::after{content:"";flex:1;height:1px;background:var(--line)}
  .wiz-tsec .wiz-sep:first-child{margin-top:var(--sp-22)}
  /* Étape « Identité » / « Emplacement » : formulaire court, colonne étroite lisible. */
  .wiz-idn{display:flex;flex-direction:column;gap:var(--sp-14);max-width:560px}
  .wiz-idn .field{margin:0}
  .wiz-plats{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:var(--sp-8)}
  .wiz-plat{display:flex;flex-direction:column;align-items:center;gap:var(--sp-8);text-align:center;padding:var(--sp-14) var(--sp-8);
    border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);cursor:pointer;transition:border-color .12s,background .12s}
  .wiz-plat:hover{border-color:var(--mut2)}
  .wiz-plat.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--bg2));box-shadow:0 0 0 1px var(--accent) inset}
  .wiz-plat-ic{display:grid;place-items:center;width:32px;height:32px;color:var(--mut)}
  .wiz-plat-d{font-size:var(--fs-xs);color:var(--mut);line-height:1.3}
  .wiz-plat.on .wiz-plat-ic{color:var(--accent)}
  .wiz-plat-ic svg.ic{width:22px;height:22px}
  .wiz-plat-l{font-size:var(--fs-sm);font-weight:var(--fw-medium);line-height:1.25}
  .wiz-choice{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-12)}
  @media(max-width:520px){ .wiz-choice{grid-template-columns:1fr} }
  .wiz-card{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-8);text-align:left;
    background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--sp-16);cursor:pointer}
  .wiz-card:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 6%,var(--card))}
  .wiz-card.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
  .wiz-card.big{min-height:150px}
  .wiz-card.disabled{opacity:.5;cursor:not-allowed}
  .wiz-card.disabled:hover{border-color:var(--line);background:var(--bg2)}
  /* Écran de démarrage : les trois entrées sont EN LIGNE (icône · texte · action) plutôt
     qu'en trois colonnes hautes. Le markup reste plat (4 spans) : c'est la grille qui les
     place, via des zones nommées - aucun changement côté JS. */
  .wiz-launch{display:grid;grid-template-columns:1fr;gap:var(--sp-10);align-content:center}
  .wiz-launch .wiz-card.big{min-height:0}
  .wiz-launch .wiz-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;
    grid-template-areas:"ic t go" "ic d go";align-items:center;column-gap:var(--sp-14);row-gap:var(--sp-2);padding:var(--sp-14) var(--sp-16)}
  .wiz-launch .wiz-ic{grid-area:ic}
  .wiz-launch .wiz-card-t{grid-area:t;align-self:end;font-size:var(--fs-base)}
  .wiz-launch .wiz-card-d{grid-area:d;align-self:start;font-size:var(--fs-sm);line-height:1.45}
  .wiz-launch .wiz-card-go{grid-area:go;margin:0;padding:0;white-space:nowrap}
  /* Étroit : l'action passe sous le texte plutôt que de comprimer la description. */
  @media(max-width:760px){
    .wiz-launch .wiz-card{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"ic t" "ic d" "go go"}
    .wiz-launch .wiz-card-go{margin-top:var(--sp-6)}
  }
  .wiz-card-go{margin-top:auto;padding-top:var(--sp-10);display:flex;align-items:center;gap:var(--sp-4);
    font-size:var(--fs-xs);font-weight:var(--fw-strong);color:var(--accent);opacity:.7}
  .wiz-card-go svg.ic{width:12px;height:12px}
  .wiz-card:hover .wiz-card-go,.wiz-card:focus-visible .wiz-card-go{opacity:1}
  .wiz-card-ai{background:color-mix(in srgb,var(--accent) 5%,var(--bg2));border-color:color-mix(in srgb,var(--accent) 30%,var(--line))}
  .wiz-card-ai .wiz-ic{background:var(--accent);color:var(--on-solid);flex-shrink:0}

  /* ── Mode « Discuter de votre projet » (36-wizard-ai.js, CDC_WIZARD_AI.md) ── */
  .wzai-rail .wizx-step:not(.on){opacity:.55}
  .wzai-wrap{padding-bottom:var(--sp-10)}
  .wzai-thread{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:var(--sp-10);padding:var(--sp-2) var(--sp-2) var(--sp-8)}
  .wzai-b{max-width:86%;padding:var(--sp-8) var(--sp-12);border-radius:var(--radius);font-size:var(--fs-md);line-height:1.55;white-space:normal;word-break:break-word}
  .wzai-b.me{align-self:flex-end;background:var(--accent);color:var(--on-solid);border-bottom-right-radius:4px;white-space:pre-wrap}
  .wzai-b.ai{align-self:flex-start;background:var(--bg2);border:1px solid var(--line);border-bottom-left-radius:4px}
  .wzai-b.ai code{font-size:var(--fs-xs)}
  .wzai-typing{align-self:flex-start;display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-8) var(--sp-12);color:var(--mut)}
  .wzai-typing span{width:6px;height:6px;border-radius:50%;background:var(--mut);animation:wzaiB 1.1s infinite}
  .wzai-typing span:nth-child(2){animation-delay:.18s} .wzai-typing span:nth-child(3){animation-delay:.36s}
  .wzai-typing i{font-style:normal;font-size:var(--fs-xs);color:var(--mut2);margin-left:var(--sp-6)}
  @keyframes wzaiB{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
  .wzai-bar{flex:none;display:flex;gap:var(--sp-8);align-items:flex-end;border-top:1px solid var(--line);padding-top:var(--sp-10)}
  .wzai-in{flex:1;resize:none;min-height:40px;max-height:120px;font-size:var(--fs-md);line-height:1.45}
  .wzai-send{flex:none}
  .wzai-mlabel{font-size:var(--fs-xs);color:var(--mut)}
  .wzai-model{max-width:210px;font-size:var(--fs-sm)}
  .wzai-hello{margin:auto;max-width:480px;text-align:center;display:flex;flex-direction:column;gap:var(--sp-8);align-items:center;padding:var(--sp-24) 0}
  .wzai-hello-ic{width:44px;height:44px;border-radius:var(--radius);display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}
  .wzai-hello-ic svg.ic{width:22px;height:22px}
  .wzai-hello-t{font-weight:var(--fw-bold);font-size:var(--fs-base)}
  .wzai-hello-d{font-size:var(--fs-sm);color:var(--mut);line-height:1.55}
  .wzai-ex{display:flex;flex-direction:column;gap:var(--sp-6);margin-top:var(--sp-8);width:100%}
  .wzai-exb{font-size:var(--fs-sm);text-align:left;background:var(--bg2);border:1px dashed var(--line);border-radius:var(--radius);padding:var(--sp-8) var(--sp-12);cursor:pointer;color:var(--txt)}
  .wzai-exb:hover{border-color:var(--accent);color:var(--accent)}
  /* Carte plan */
  .wzai-plan{align-self:stretch;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:var(--radius-sm);
    background:color-mix(in srgb,var(--accent) 4%,var(--card));padding:var(--sp-12) var(--sp-14);display:flex;flex-direction:column;gap:var(--sp-8)}
  .wzai-plan.off{flex-direction:row;align-items:center;gap:var(--sp-8);font-size:var(--fs-sm);color:var(--mut);opacity:.8}
  .wzai-plan.off svg.ic{width:14px;height:14px;color:var(--accent)}
  .wzai-plan-t{display:flex;align-items:center;gap:var(--sp-6);font-size:var(--fs-xs);font-weight:var(--fw-bold);letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
  .wzai-plan-t svg.ic{width:14px;height:14px}
  .wzai-pv{font-weight:var(--fw-medium);letter-spacing:var(--ls-none);text-transform:none;color:var(--mut);font-size:var(--fs-xs)}
  .wzai-plan-r{margin:0;font-size:var(--fs-sm);color:var(--txt);line-height:var(--lh-normal)}
  .wzai-warn{font-size:var(--fs-xs);color:var(--warn)} .wzai-err{font-size:var(--fs-xs);color:var(--bad)}
  .wzai-grid{margin:0;display:flex;flex-direction:column;gap:var(--sp-6)}
  .wzai-row{display:grid;grid-template-columns:130px 1fr;gap:var(--sp-10);align-items:start}
  .wzai-row dt{font-size:var(--fs-xs);color:var(--mut);padding-top:var(--sp-6);display:flex;align-items:center;gap:var(--sp-4)}
  .wzai-row dd{margin:0;display:flex;flex-wrap:wrap;gap:var(--sp-4);align-items:center}
  .wzai-row dd input:not([type=color]),.wzai-row dd select{width:100%;font-size:var(--fs-sm)}
  .wzai-row dd input[type=color]{width:44px;height:28px;padding:var(--sp-2)}
  .wzai-ads{display:flex;flex-wrap:wrap;gap:var(--sp-4);max-height:96px;overflow:auto}
  .wzai-why{width:16px;height:16px;border-radius:50%;border:1px solid var(--line);background:var(--bg2);color:var(--mut);
    font-size:var(--fs-2xs);line-height:var(--lh-flat);cursor:help;padding:0;flex:none}
  .wzai-why:hover{color:var(--accent);border-color:var(--accent)}
  .wzai-cta{display:flex;align-items:center;gap:var(--sp-10);margin-top:var(--sp-4);flex-wrap:wrap}
  .wzai-cta .primary svg.ic{width:14px;height:14px;vertical-align:-2px;margin-right:var(--sp-4)}
  .wzai-direct{display:flex;align-items:center;gap:var(--sp-4);font-size:var(--fs-xs);color:var(--mut);user-select:none}
  .wzai-badge{display:flex;align-items:center;gap:var(--sp-6);font-size:var(--fs-sm);color:var(--accent);margin-bottom:var(--sp-10);
    border:1px dashed color-mix(in srgb,var(--accent) 45%,var(--line));border-radius:var(--radius);padding:var(--sp-6) var(--sp-10);
    background:color-mix(in srgb,var(--accent) 5%,transparent)}
  .wzai-badge svg.ic{width:14px;height:14px;flex:none}
  .wiz-card-f{margin-top:auto;font-size:var(--fs-2xs);color:var(--mut2);word-break:break-all;font-family:var(--font-mono);line-height:1.4}
  .wiz-ic{width:34px;height:34px;border-radius:var(--radius);display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent)}
  .wiz-ic svg.ic{width:18px;height:18px}
  .wiz-card-t{font-weight:var(--fw-strong);font-size:var(--fs-base)}
  .wiz-card-d{font-size:var(--fs-sm);color:var(--mut);line-height:1.45}
  .wiz-pathline{font-size:var(--fs-sm);color:var(--mut)}
  .wiz-pathline code{font-family:var(--font-mono);color:var(--link);background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--sp-1) var(--sp-6);word-break:break-all}
  .wiz-adv{margin-top:var(--sp-4)}
  .wiz-adv summary{font-size:var(--fs-sm);color:var(--mut);cursor:pointer;padding:var(--sp-6) 0;user-select:none}
  .wiz-adv summary:hover{color:var(--txt)} .wiz-adv[open] summary{margin-bottom:var(--sp-8)}
  .wiz-tpls{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-8)}
  @media(max-width:520px){ .wiz-tpls{grid-template-columns:1fr} }
  .wiz-tpl{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-2);text-align:left;
    background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--sp-8) var(--sp-10);cursor:pointer}
  .wiz-tpl:hover{border-color:var(--accent)}
  .wiz-tpl.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
  .wiz-tpl-t{font-weight:var(--fw-strong);font-size:var(--fs-md)}
  .wiz-tpl-d{font-size:var(--fs-xs);color:var(--mut)}
  .wiz-note{display:flex;align-items:center;gap:var(--sp-6);margin-top:var(--sp-8);padding:var(--sp-8) var(--sp-10);border-radius:var(--radius-sm);
    font-size:var(--fs-xs);line-height:1.45;border:1px solid var(--line)}
  .wiz-note code{font-size:var(--fs-xs)}
  .wiz-note svg.ic{width:14px;height:14px;flex:none}
  .wiz-note.ok{background:color-mix(in srgb,var(--ok) 9%,var(--card2));border-color:color-mix(in srgb,var(--ok) 30%,var(--line));color:var(--mut)}
  .wiz-note.warn{background:color-mix(in srgb,var(--warn) 11%,var(--card2));border-color:color-mix(in srgb,var(--warn) 34%,var(--line));color:var(--txt)}
  .lbl-hint{font-weight:var(--fw-regular);color:var(--mut2);font-size:var(--fs-xs)}
  .wiz-hintbox{font-size:var(--fs-sm);color:var(--mut);background:var(--bg2);border:1px dashed var(--line);border-radius:var(--radius-sm);padding:var(--sp-8) var(--sp-10)}
  .wiz-chips{display:flex;flex-wrap:wrap;gap:var(--sp-8)}
  .wiz-chip{display:flex;align-items:center;gap:var(--sp-6);font-size:var(--fs-md);font-weight:var(--fw-medium);color:var(--mut);background:var(--bg2);border:1.5px solid var(--line);
    border-radius:var(--radius);padding:var(--sp-6) var(--sp-14);cursor:pointer;transition:background .12s,border-color .12s,color .12s}
  .wiz-chip:hover{color:var(--txt);border-color:var(--mut2);background:var(--bg3)}
  /* CDC_HDPLIO_FAMILLES F1 bis (2026-10-10) : l'accent nu sur sa teinte à 12 % rendait 3,15:1 en thème clair (mesuré au banc,
     N20) ; mêlé au texte, la puce active reste accentuée et passe 4,5:1 dans les trois états. */
  .wiz-chip.on{background:color-mix(in srgb,var(--accent) 12%,var(--bg2));border-color:var(--accent);color:color-mix(in srgb,var(--accent) 62%,var(--txt));font-weight:var(--fw-strong)}
  .wiz-chip svg.ic{width:15px;height:15px;flex:none}
  .wiz-name-wrap{display:flex;flex-direction:column;gap:var(--sp-16)}
  .wiz-pathline-name{margin-top:var(--sp-2);padding:var(--sp-10) var(--sp-12);background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm)}
  .wiz-fsearch{width:100%;padding:var(--sp-8) var(--sp-10);font-size:var(--fs-md);margin-bottom:var(--sp-8)}
  .wiz-gbar{display:flex;align-items:center;gap:var(--sp-8);margin-bottom:var(--sp-8)}
  .wiz-gcount{font-size:var(--fs-xs);color:var(--mut);margin-left:auto}
  .wiz-glist{display:flex;flex-direction:column;gap:var(--sp-1);max-height:340px;overflow:auto;border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--sp-4)}
  .wiz-trow{display:flex;align-items:center;gap:var(--sp-8);padding:var(--sp-4) var(--sp-6);border-radius:var(--radius-sm)}
  .wiz-trow:hover{background:var(--line2)}
  .wiz-tcaret{background:none;border:0;padding:0;display:inline-flex;align-items:center;justify-content:center;width:16px;flex:none;color:var(--mut2);cursor:pointer}
  .wiz-tcaret svg{width:13px;height:13px;transition:transform .12s}
  .wiz-tcaret.open svg{transform:rotate(90deg)}
  .wiz-tcaret-sp{width:16px;flex:none}
  .wiz-tcb{accent-color:var(--accent);width:15px;height:15px;flex:none;cursor:pointer}
  .wiz-gic{display:inline-flex;flex:none} .wiz-gic svg.ic{width:16px;height:16px;color:var(--mut)}
  .wiz-gname{flex:1;font-size:var(--fs-md);font-weight:var(--fw-medium);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-mono)}
  .wiz-gmeta{font-size:var(--fs-xs);color:var(--mut);white-space:nowrap;font-variant-numeric:tabular-nums}
  .wiz-ghint{font-size:var(--fs-xs);color:var(--mut);margin:var(--sp-10) 0 0}
  /* Liste de fonctionnalités (manifeste socle) */
  .wiz-fcat{font-size:var(--fs-2xs);text-transform:uppercase;letter-spacing:.05em;color:var(--mut2);font-weight:var(--fw-bold);padding:var(--sp-8) var(--sp-6) var(--sp-2)}
  .wiz-fcat:first-child{padding-top:var(--sp-2)}
  .wiz-feat{display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-8) var(--sp-8);border-radius:var(--radius);cursor:pointer}
  .wiz-feat:hover{background:var(--line2)}
  .wiz-feat.locked{cursor:default}
  .wiz-feat-ic{width:30px;height:30px;flex:none;display:grid;place-items:center;font-size:var(--fs-base);background:var(--card2);border:1px solid var(--line2);border-radius:var(--radius)}
  .wiz-feat-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--sp-1)}
  .wiz-feat-n{font-size:var(--fs-md);font-weight:var(--fw-strong);display:flex;align-items:center;gap:var(--sp-6)}
  .wiz-feat-d{font-size:var(--fs-xs);color:var(--mut);line-height:var(--lh-snug);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .wiz-feat-meta{font-size:var(--fs-xs);color:var(--mut2);white-space:nowrap;font-variant-numeric:tabular-nums}
  .wiz-feat-req{font-size:var(--fs-2xs);color:var(--accent);border:1px solid var(--accent);border-radius:var(--radius-xs);padding:var(--sp-1) var(--sp-4);text-transform:uppercase;letter-spacing:.03em;font-weight:var(--fw-bold)}
  .recap{margin:0;display:flex;flex-direction:column;gap:0;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
  .recap>div{display:flex;gap:var(--sp-12);padding:var(--sp-8) var(--sp-12)}
  .recap>div+div{border-top:1px solid var(--line2)}
  .recap dt{flex:none;width:130px;color:var(--mut);font-size:var(--fs-sm);margin:0}
  .recap dd{flex:1;min-width:0;margin:0;font-size:var(--fs-md);word-break:break-all;display:flex;align-items:center;gap:var(--sp-6)}
  .recap dd.mono{font-family:var(--font-mono);font-size:var(--fs-sm)}
  .recap-sw{width:14px;height:14px;border-radius:var(--radius-xs);flex:none;border:1px solid var(--line)}
  /* Navigateur de dossiers */
  .fb{border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;background:var(--bg2)}
  .fb-bar{display:flex;align-items:center;gap:var(--sp-6);padding:var(--sp-8) var(--sp-10);border-bottom:1px solid var(--line);background:var(--card2)}
  .fb-bar .mini{padding:var(--sp-4) var(--sp-8)}
  .fb-path{flex:1;min-width:0;padding:var(--sp-6) var(--sp-8);font-size:var(--fs-sm)}
  .fb-roots{display:flex;gap:var(--sp-6);flex-wrap:wrap;padding:var(--sp-8) var(--sp-10);border-bottom:1px solid var(--line2)}
  .fb-root{font-size:var(--fs-xs);padding:var(--sp-2) var(--sp-8);border:1px solid var(--line);background:var(--card);border-radius:var(--radius-pill);cursor:pointer;color:var(--mut)}
  .fb-root:hover{border-color:var(--accent);color:var(--txt)}
  .fb-list{max-height:300px;min-height:160px;overflow:auto;padding:var(--sp-4)}
  .fb-row{display:flex;align-items:center;gap:var(--sp-8);width:100%;text-align:left;background:transparent;border:none;
    border-radius:var(--radius-sm);padding:var(--sp-6) var(--sp-8);cursor:pointer;font:inherit;font-size:var(--fs-md)}
  .fb-row:hover{background:var(--line2)}
  .fb-row svg.ic{width:15px;height:15px;flex:none;color:var(--accent)}
  .fb-row .fb-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--txt)}
  .fb-row > svg.ic:last-child{color:var(--mut2);width:13px;height:13px}
  .fb-pick{padding:var(--sp-8) var(--sp-10);border-top:1px solid var(--line);background:var(--card2);font-size:var(--fs-sm);color:var(--mut)}
  .fb-pick code{font-family:var(--font-mono);color:var(--link);word-break:break-all}
  /* Étape « Nature » - que voulez-vous créer ? (multi-sélection, par catégories) */
  .wiz-kindcat{display:flex;align-items:center;gap:var(--sp-6);margin:var(--sp-18) var(--sp-2) var(--sp-8);
    font-size:var(--fs-xs);font-weight:var(--fw-bold);letter-spacing:.05em;text-transform:uppercase;color:var(--mut)}
  .wiz-kindcat:first-child{margin-top:var(--sp-2)}
  .wiz-kindcat svg.ic{width:14px;height:14px;color:var(--accent)}
  .wiz-kinds{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-10)}
  @media(max-width:560px){ .wiz-kinds{grid-template-columns:1fr} }
  .wiz-kind{display:flex;align-items:center;gap:var(--sp-12);text-align:left;padding:var(--sp-12) var(--sp-14);cursor:pointer;
    background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);transition:border-color .12s,background .12s}
  .wiz-kind:hover{border-color:var(--mut2)}
  .wiz-kind.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--bg2));box-shadow:0 0 0 1px var(--accent) inset}
  .wiz-kind-ic{width:36px;height:36px;flex:none;border-radius:var(--radius);display:grid;place-items:center;
    background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent)}
  .wiz-kind-ic svg.ic{width:19px;height:19px}
  .wiz-kind-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--sp-2)}
  .wiz-kind-l{font-size:var(--fs-md);font-weight:var(--fw-strong);line-height:var(--lh-tight)}
  .wiz-kind-d{font-size:var(--fs-xs);color:var(--mut);line-height:var(--lh-snug)}
  .wiz-kind-chk{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
    border:1.5px solid var(--line2);color:transparent;transition:all .12s}
  .wiz-kind-chk svg.ic{width:13px;height:13px}
  .wiz-kind.on .wiz-kind-chk{background:var(--accent);border-color:var(--accent);color:var(--on-solid)}
  /* Étape « Nature » - panneau « l'IA propose des idées » (en tête) */
  .wiz-ideas{margin:var(--sp-2) 0 var(--sp-4);padding:var(--sp-12) var(--sp-14);border:1px solid var(--line);border-radius:var(--radius-sm);
    background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 7%,var(--bg2)),var(--bg2))}
  .wiz-ideas-head{display:flex;align-items:center;gap:var(--sp-10)}
  .wiz-ideas-ic{width:30px;height:30px;flex:none;border-radius:var(--radius);display:grid;place-items:center;
    background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent)}
  .wiz-ideas-ic svg.ic{width:17px;height:17px}
  .wiz-ideas-tx{display:flex;flex-direction:column;gap:var(--sp-1);min-width:0}
  .wiz-ideas-tx b{font-size:var(--fs-md);font-weight:var(--fw-strong)}
  .wiz-ideas-tx i{font-size:var(--fs-xs);color:var(--mut);font-style:normal}
  .wiz-ideas-ask{display:flex;gap:var(--sp-8);margin-top:var(--sp-10)}
  .wiz-ideas-topic{flex:1;min-width:0;padding:var(--sp-8) var(--sp-10);font-size:var(--fs-md);border:1px solid var(--line);
    border-radius:var(--radius-sm);background:var(--bg);color:var(--fg)}
  .wiz-ideas-topic:focus{outline:none;border-color:var(--accent)}
  .wiz-ideas-go{flex:none;white-space:nowrap}
  .wiz-ideas-load{display:flex;align-items:center;gap:var(--sp-8);margin-top:var(--sp-10);font-size:var(--fs-sm);color:var(--mut)}
  .wiz-ideas-err{margin-top:var(--sp-8);font-size:var(--fs-sm);color:var(--err)}
  .wiz-ideas-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-8);margin-top:var(--sp-10)}
  @media(max-width:560px){ .wiz-ideas-grid{grid-template-columns:1fr} }
  .wiz-idea{display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-10) var(--sp-12);background:var(--bg);
    border:1px solid var(--line);border-radius:var(--radius-sm)}
  .wiz-idea-t{font-size:var(--fs-md);font-weight:var(--fw-strong);line-height:1.25}
  .wiz-idea-p{font-size:var(--fs-xs);color:var(--mut);line-height:1.4}
  .wiz-idea-ch{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-1)}
  .wiz-idea-chip{display:inline-flex;align-items:center;gap:var(--sp-4);padding:var(--sp-2) var(--sp-8);font-size:var(--fs-2xs);font-weight:var(--fw-medium);
    border-radius:var(--radius-pill);background:color-mix(in srgb,var(--accent) 11%,transparent);color:var(--accent)}
  .wiz-idea-chip svg.ic{width:11px;height:11px}
  .wiz-idea-pick{margin-top:var(--sp-4);align-self:flex-start;padding:var(--sp-4) var(--sp-12);font-size:var(--fs-sm);font-weight:var(--fw-strong);cursor:pointer;
    border:1px solid var(--accent);color:var(--accent);background:transparent;border-radius:var(--radius-pill);transition:all .12s}
  .wiz-idea-pick:hover{background:var(--accent);color:var(--on-solid)}
  .wiz-ideas-foot{margin-top:var(--sp-10)}
  .wiz-ideas-again{display:inline-flex;align-items:center;gap:var(--sp-6);padding:var(--sp-6) var(--sp-12);font-size:var(--fs-sm);cursor:pointer;
    border:1px solid var(--line);background:var(--bg);color:var(--fg);border-radius:var(--radius-sm)}
  .wiz-ideas-again svg.ic{width:13px;height:13px}
  /* Vue détail d'une idée (immersive) */
  .idd{display:flex;flex-direction:column;gap:var(--sp-16)}
  .idd-hero{position:relative;display:grid;grid-template-columns:minmax(0,210px) 1fr;gap:var(--sp-18);align-items:center;
    padding:var(--sp-16) var(--sp-18);border-radius:var(--radius);overflow:hidden;
    background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 16%,var(--bg2)),var(--bg2))}
  @media(max-width:680px){ .idd-hero{grid-template-columns:1fr} }
  .idd-prev{border-radius:var(--radius);padding:var(--sp-8);background:color-mix(in srgb,var(--accent) 8%,var(--bg));
    border:1px solid var(--line);box-shadow:0 6px 20px color-mix(in srgb,var(--accent) 14%,transparent)}
  .idd-prev-svg{display:block;width:100%;height:auto}
  .idd-hero-tx{display:flex;flex-direction:column;min-width:0}
  .idd-name{width:100%;font-size:var(--fs-xl);font-weight:var(--fw-bold);line-height:var(--lh-tight);padding:var(--sp-4) var(--sp-2);
    background:transparent;border:none;border-bottom:1.5px solid transparent;color:var(--fg)}
  .idd-name:focus{outline:none;border-bottom-color:var(--accent)}
  .idd-pitch{width:100%;margin-top:var(--sp-6);font-size:var(--fs-md);line-height:1.45;color:var(--mut);resize:vertical;
    background:transparent;border:1px solid transparent;border-radius:var(--radius);padding:var(--sp-6) var(--sp-8);font-family:inherit}
  .idd-pitch:hover{border-color:var(--line)}
  .idd-pitch:focus{outline:none;border-color:var(--accent);color:var(--fg)}
  .idd-cols{display:grid;grid-template-columns:1.5fr 1fr;gap:var(--sp-18);align-items:start}
  @media(max-width:680px){ .idd-cols{grid-template-columns:1fr} }
  .idd-col-main,.idd-col-side{display:flex;flex-direction:column;gap:var(--sp-14);min-width:0}
  .idd-sec h4{display:flex;align-items:center;gap:var(--sp-6);margin:0 0 var(--sp-8);font-size:var(--fs-sm);font-weight:var(--fw-bold);
    letter-spacing:.03em;text-transform:uppercase;color:var(--mut)}
  .idd-sec h4 svg.ic{width:14px;height:14px;color:var(--accent)}
  .idd-deliv{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-8)}
  .idd-deliv li{display:flex;align-items:flex-start;gap:var(--sp-10)}
  .idd-deliv-ic{width:30px;height:30px;flex:none;border-radius:var(--radius);display:grid;place-items:center;
    background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent)}
  .idd-deliv-ic svg.ic{width:16px;height:16px}
  .idd-deliv-tx{display:flex;flex-direction:column;gap:var(--sp-1);min-width:0}
  .idd-deliv-tx b{font-size:var(--fs-md);font-weight:var(--fw-strong)}
  .idd-deliv-tx i{font-size:var(--fs-xs);color:var(--mut);font-style:normal;line-height:var(--lh-snug)}
  .idd-empty{font-size:var(--fs-sm);color:var(--mut)}
  .idd-aisec{padding:var(--sp-12) var(--sp-12);border:1px solid var(--line);border-radius:var(--radius-sm);
    background:color-mix(in srgb,var(--accent) 4%,var(--bg2))}
  .idd-ov{margin:0;font-size:var(--fs-md);line-height:var(--lh-normal)}
  .idd-kv{margin-top:var(--sp-8);font-size:var(--fs-sm);color:var(--mut)}
  .idd-kv b{color:var(--fg);font-weight:var(--fw-strong);margin-right:var(--sp-4)}
  .idd-block{margin-top:var(--sp-10)}
  .idd-block h5{margin:0 0 var(--sp-6);font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--mut);text-transform:uppercase;letter-spacing:.03em}
  .idd-feat{margin:0;padding-left:var(--sp-18);display:flex;flex-direction:column;gap:var(--sp-4);font-size:var(--fs-sm);line-height:1.4}
  .idd-plan{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-8)}
  .idd-plan>li{padding:var(--sp-8) var(--sp-10);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg)}
  .idd-plan-h{display:flex;align-items:center;gap:var(--sp-8)}
  .idd-plan-h b{font-size:var(--fs-sm);font-weight:var(--fw-strong);flex:1;min-width:0}
  .idd-plan-add{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-8);font-size:var(--fs-xs);font-weight:var(--fw-strong);cursor:pointer;flex:none;
    border:1px solid var(--accent);color:var(--accent);background:transparent;border-radius:var(--radius-pill);transition:all .12s}
  .idd-plan-add:hover{background:var(--accent);color:var(--on-solid)}
  .idd-plan-add svg.ic{width:11px;height:11px}
  .idd-plan-note{margin-top:var(--sp-2);font-size:var(--fs-xs);color:var(--mut);line-height:var(--lh-snug)}
  .idd-plan-ch{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-6)}
  .idd-pchip{display:inline-flex;align-items:center;gap:var(--sp-4);padding:var(--sp-2) var(--sp-8);font-size:var(--fs-2xs);font-weight:var(--fw-medium);
    border-radius:var(--radius-pill);background:color-mix(in srgb,var(--accent) 11%,transparent);color:var(--accent)}
  .idd-pchip svg.ic{width:11px;height:11px}
  .idd-ai-load{display:flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-sm);color:var(--mut)}
  .idd-deepen{display:inline-flex;align-items:center;gap:var(--sp-6);padding:var(--sp-8) var(--sp-14);font-size:var(--fs-sm);font-weight:var(--fw-strong);cursor:pointer;
    border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--accent);border-radius:var(--radius-pill);transition:all .12s}
  .idd-deepen:hover{background:var(--accent);color:var(--on-solid)}
  .idd-deepen svg.ic{width:15px;height:15px}
  .idd-steps{margin:0;padding-left:var(--sp-20);display:flex;flex-direction:column;gap:var(--sp-6);font-size:var(--fs-sm);line-height:1.4}
  .idd-steps li{padding-left:var(--sp-2)}
  .idd-tags{display:flex;flex-wrap:wrap;gap:var(--sp-6)}
  .idd-tag{display:inline-flex;align-items:center;padding:var(--sp-4) var(--sp-10);font-size:var(--fs-xs);font-weight:var(--fw-medium);border-radius:var(--radius-pill);
    background:color-mix(in srgb,var(--accent) 11%,transparent);color:var(--accent)}
  .idd-tag.soft{background:var(--bg2);color:var(--mut)}
  .idd-nats{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin-bottom:var(--sp-8)}
  .idd-nat{display:inline-flex;align-items:center;gap:var(--sp-6);padding:var(--sp-4) var(--sp-6) var(--sp-4) var(--sp-8);font-size:var(--fs-sm);font-weight:var(--fw-medium);
    border:1px solid var(--line);border-radius:var(--radius-pill);background:var(--bg2)}
  .idd-nat-ic{display:inline-flex;color:var(--accent)}
  .idd-nat-ic svg.ic{width:13px;height:13px}
  .idd-nat-x{display:grid;place-items:center;width:18px;height:18px;border:none;border-radius:50%;cursor:pointer;
    background:transparent;color:var(--mut);transition:all .12s}
  .idd-nat-x:hover{background:var(--err);color:var(--on-solid)}
  .idd-nat-x svg.ic{width:11px;height:11px}
  .idd-add{width:100%}
  /* Étape « Cibles » - bloc */
  .wiz-tsec{display:flex;flex-direction:column;gap:var(--sp-14)}
  /* Étape « Emplacement » - affichage compact + bouton Finder */
  .wz-place{display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-8) var(--sp-10);background:var(--bg2);
    border:1px solid var(--line);border-radius:var(--radius-sm)}
  .wz-place-ic{flex:none;display:inline-flex;color:var(--accent)} .wz-place-ic svg.ic{width:17px;height:17px}
  .wz-place-path{flex:1;min-width:0;font-family:var(--font-mono);font-size:var(--fs-sm);color:var(--txt);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:rtl;text-align:left}
  .wz-place-btn{flex:none;width:34px;height:34px;border-radius:var(--radius);display:grid;place-items:center;
    border:1px solid var(--line);background:var(--card);color:var(--mut);cursor:pointer}
  .wz-place-btn:hover{border-color:var(--accent);color:var(--accent)} .wz-place-btn svg.ic{width:17px;height:17px}
  .wz-folder{display:flex;align-items:center;gap:var(--sp-8);margin-top:var(--sp-10);font-size:var(--fs-sm);color:var(--mut)}
  .wz-folder-k{display:inline-flex;align-items:center;gap:var(--sp-6)} .wz-folder-k svg.ic{width:14px;height:14px}
  .wz-folder-v{font-family:var(--font-mono);color:var(--link);background:var(--bg2);
    border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--sp-2) var(--sp-8);font-size:var(--fs-sm)}
  /* Navigateur de dossiers en pop-up empilée */
  #wz-fb-modal{border:none;padding:0;background:transparent;color:var(--txt);max-width:none;max-height:none;margin:auto}
  #wz-fb-modal::backdrop{background:var(--backdrop);backdrop-filter:blur(3px)}
  .wzfb-card{width:min(620px,calc(100vw - 32px));background:var(--card);border:1px solid var(--line);
    border-radius:var(--radius-modal);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column}
  .wzfb-head{display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-14) var(--sp-16);border-bottom:1px solid var(--line)}
  .wzfb-t{flex:1;font-weight:var(--fw-strong);font-size:var(--fs-base);display:flex;align-items:center;gap:var(--sp-8)}
  .wzfb-t svg.ic{width:17px;height:17px;color:var(--accent)}
  .wzfb-card .fb{border:0;border-radius:0;margin:0}
  .wzfb-foot{display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-12) var(--sp-16);border-top:1px solid var(--line);background:var(--card2)}

  /* ── Paramètres ── */
  .set-sec{margin-bottom:var(--sp-16);padding-bottom:var(--sp-14);border-bottom:1px solid var(--line2)}
  .set-sec:last-of-type{border-bottom:none;padding-bottom:0}
  .set-label{font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--mut);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--sp-10)}
  .set-label svg.ic{width:13px;height:13px;vertical-align:-2px;margin-right:var(--sp-4);opacity:.75}
  .set-row{display:flex;align-items:center;gap:var(--sp-12);min-height:34px}
  .set-row+.set-row{margin-top:var(--sp-4)}
  .set-k{flex:1;font-size:var(--fs-base);display:flex;flex-direction:column;gap:var(--sp-2)}
  .set-d{font-size:var(--fs-xs);color:var(--mut);font-weight:var(--fw-regular)}
  .set-v{flex:none;max-width:60%;font-size:var(--fs-md);color:var(--txt);text-align:right;word-break:break-word}
  .seg{display:inline-flex;gap:var(--sp-2);background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-2);flex:none}
  .seg-theme{display:inline-flex;align-items:center;gap:var(--sp-6);border:none;background:transparent;color:var(--mut);
    padding:var(--sp-6) var(--sp-10);border-radius:var(--radius-sm);font-size:var(--fs-sm);cursor:pointer}
  .seg-theme:hover{color:var(--txt);background:transparent}
  .seg-theme.on{background:var(--accent);color:var(--on-solid)}
  .seg-theme svg.ic{width:15px;height:15px}
  .set-note{font-size:var(--fs-sm);color:var(--mut2);margin:0 0 var(--sp-4);line-height:var(--lh-normal)}
  .set-select{flex:none;width:auto;padding:var(--sp-6) var(--sp-10);font-size:var(--fs-md)}
  .set-dir{display:flex;gap:var(--sp-6);align-items:center;flex:none;max-width:62%}
  .set-dirinput{width:230px;max-width:46vw;padding:var(--sp-6) var(--sp-8);font-size:var(--fs-sm)}
  /* ── Identifiants dans la conversation : flous par défaut, lisibles au survol ──────
     Pudeur d'affichage (épaule, partage d'écran, capture), pas une protection : la valeur
     est dans la page. Ce qui est protégé, c'est ce qui part sur le disque (77-secrets.js). */
  /* Pas de `nowrap` ici : une clé d'API de 60 caractères insécable élargit la bulle et fait
     apparaître une barre de défilement HORIZONTALE dans tout le fil. Elle se coupe donc. */
  .dh-secret{filter:blur(5px);border-radius:var(--radius-sm);cursor:default;
    background:color-mix(in srgb,var(--txt) 8%,transparent);
    transition:filter .12s ease;word-break:break-word;overflow-wrap:anywhere}
  .dh-secret:hover,.dh-secret:focus-visible{filter:none;background:transparent}
  @media (prefers-reduced-motion:reduce){ .dh-secret{transition:none} }
  /* interrupteur */
  .switch{flex:none;width:40px;height:23px;border-radius:var(--radius-pill);border:1px solid var(--line);background:var(--bg2);
    padding:0;cursor:pointer;position:relative;transition:background .15s,border-color .15s}
  .switch.on{background:var(--accent);border-color:var(--accent)}
  .switch-kn{position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;background:var(--on-solid);
    box-shadow:var(--elev-1);transition:left .15s}
  .switch.on .switch-kn{left:19px}
  /* Paramètres - disposition en menu */
  #modal.settings .modal-card{width:min(1080px,calc(100vw - 32px))}
  #modal.settings .modal-body{padding:0}
  .set-layout{display:flex;align-items:stretch;min-height:min(560px,72vh)}
  .set-nav{flex:none;width:208px;padding:var(--sp-10);border-right:1px solid var(--line);display:flex;flex-direction:column;gap:var(--sp-2)}
  .set-nav-item{display:flex;align-items:center;gap:var(--sp-10);width:100%;text-align:left;border:none;background:transparent;color:var(--mut);
    padding:var(--sp-8) var(--sp-10);border-radius:var(--radius);font:inherit;font-size:var(--fs-md);cursor:pointer;transition:background 0s,color 0s}
  .set-nav-item:hover{background:var(--line2);color:var(--txt)}
  .set-nav-item.on{background:var(--accent);color:var(--on-solid)}
  .set-nav-item svg.ic{width:16px;height:16px;flex:none}
  /* Accordéon : élément parent porteur d'un sous-menu + sa flèche */
  .set-nav-item.has-sub .set-nav-l{flex:1;min-width:0}
  .set-nav-caret{flex:none;display:grid;place-items:center;width:16px;height:16px;opacity:.6;transition:transform .15s}
  .set-nav-caret svg.ic{width:14px;height:14px}
  .set-nav-item.has-sub.expanded .set-nav-caret{transform:rotate(90deg)}
  /* Conteneur repliable des sous-éléments (show/hide fiable à toute profondeur) */
  .set-nav-subwrap{display:none;margin:var(--sp-2) 0 var(--sp-2) var(--sp-12);border-left:1px solid var(--line);padding-left:var(--sp-6)}
  .set-nav-subwrap.open{display:block;animation:setNavReveal .18s ease}
  @keyframes setNavReveal{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
  .set-nav-subinner{display:flex;flex-direction:column;gap:var(--sp-2)}
  .set-nav-item.set-nav-sub{font-size:var(--fs-md)}
  .set-pane{flex:1;min-width:0;padding:var(--sp-18) var(--sp-22);max-height:72vh;overflow:auto}
  .set-pane-h{font-size:var(--fs-base);font-weight:var(--fw-strong);margin:0 0 var(--sp-16);letter-spacing:-.01em}
  /* Paramètres → Contenu socle (gestion du contenu de la golden template) */
  .gc-head{display:flex;align-items:center;gap:var(--sp-10);margin:0 0 var(--sp-14)}
  .gc-head .gc-h-r{flex:1;min-width:0}
  .gc-path{font-size:var(--fs-sm);color:var(--mut);margin-top:var(--sp-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .gc-actions{display:flex;gap:var(--sp-6);flex:none}
  .gc-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:var(--sp-14);height:min(58vh,520px)}
  @media(max-width:760px){ .gc-grid{grid-template-columns:1fr;height:auto} }
  .gc-tree{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);overflow:auto;padding:var(--sp-6)}
  .gc-trow{display:flex;align-items:center;gap:var(--sp-6);padding:var(--sp-4) var(--sp-6);border-radius:var(--radius-sm);cursor:pointer;font-size:var(--fs-md);min-height:28px}
  .gc-trow:hover{background:var(--line2)}
  .gc-trow.on{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent)}
  .gc-tcaret{flex:none;width:16px;height:16px;display:grid;place-items:center;color:var(--mut);transition:transform .12s}
  .gc-tcaret.open{transform:rotate(90deg)}
  .gc-tcaret-sp{flex:none;width:16px}
  .gc-gic{flex:none;display:grid;place-items:center;color:var(--mut)}
  .gc-gic svg.ic{width:15px;height:15px}
  .gc-gname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .gc-gmeta{flex:none;font-size:var(--fs-xs);color:var(--mut)}
  .gc-trow .gc-x{flex:none;opacity:0;border:none;background:transparent;color:var(--mut);cursor:pointer;padding:var(--sp-2);border-radius:var(--radius-xs);display:grid;place-items:center}
  .gc-trow:hover .gc-x{opacity:1}
  .gc-trow .gc-x:hover{color:var(--err);background:var(--line)}
  .gc-trow .gc-x svg.ic{width:13px;height:13px}
  .gc-view{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);overflow:hidden}
  .gc-vbar{display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-8) var(--sp-10);border-bottom:1px solid var(--line);min-height:42px}
  .gc-vname{flex:1;min-width:0;font-size:var(--fs-md);font-weight:var(--fw-strong);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .gc-vmeta{flex:none;font-size:var(--fs-xs);color:var(--mut)}
  .gc-edit{flex:1;width:100%;border:none;outline:none;resize:none;background:var(--card);color:var(--txt);
    font-family:var(--mono,ui-monospace,monospace);font-size:var(--ed-font,13px);line-height:1.55;padding:var(--sp-12) var(--sp-14);tab-size:var(--ed-tab,2)}
  .gc-empty{flex:1;display:grid;place-items:center;text-align:center;color:var(--mut);font-size:var(--fs-md);padding:var(--sp-24)}
  .gc-empty svg.ic{width:30px;height:30px;opacity:.5;margin-bottom:var(--sp-8)}
  .gc-noconf{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-12);padding:var(--sp-22);border:1px dashed var(--line);border-radius:var(--radius-sm);background:var(--bg2)}
  .set-acc-head{display:flex;align-items:center;gap:var(--sp-14);margin-bottom:var(--sp-18)}
  .set-avatar{width:54px;height:54px;border-radius:50%;background:var(--accent);color:var(--on-solid);display:grid;place-items:center;
    font-size:var(--fs-lg);font-weight:var(--fw-bold);flex:none;letter-spacing:.02em}
  .set-acc-name{font-size:var(--fs-base);font-weight:var(--fw-strong)}
  /* La photo de profil sur le rond du compte (2026-10-19) : l'image remplit le rond ; l'appareil photo en pastille au coin. */
  .set-avatar{position:relative} .set-avatar.img{background:var(--card2)}
  .set-avatar.img img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
  .set-avatar-cam{position:absolute;right:-4px;bottom:-4px;display:grid;place-items:center;width:24px;height:24px;padding:0;border:2px solid var(--card);border-radius:var(--radius-pill);background:var(--txt);color:var(--bg);cursor:pointer}
  .set-avatar-cam svg.ic{width:12px;height:12px} .set-avatar-cam:hover{background:var(--accent);color:var(--on-solid)}
  .set-avatar-retirer{margin-top:var(--sp-4);padding:0;border:0;background:none;color:var(--mut);font-size:var(--fs-xs);cursor:pointer;text-decoration:underline}
  .set-avatar-retirer:hover{color:var(--txt)}
  .set-acc-champs{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-14)}   /* nom et adresse côte à côte (2026-10-19) */
  @media(max-width:640px){ .set-acc-champs{grid-template-columns:1fr;gap:0} }
  /* Les onglets du compte épurés (2026-10-19, sur le modèle de Profil) : un sous-titre par geste, un filet entre deux gestes. */
  .set-titre{margin:0 0 var(--sp-10);font-size:var(--fs-md);font-weight:var(--fw-strong);color:var(--txt)}
  /* La fenêtre des nouveautés (78c-nouveautes.js, 2026-10-19) : une mise à jour par bloc, sa date, son titre, ses points. */
  .nouv-liste{display:flex;flex-direction:column;gap:var(--sp-18);max-height:60vh;overflow:auto;padding-right:var(--sp-4)}
  .nouv-jour+.nouv-jour{padding-top:var(--sp-18);border-top:1px solid var(--line2)}
  .nouv-maj{margin-top:var(--sp-12)}
  .nouv-date{font-size:var(--fs-2xs);font-weight:var(--fw-strong);letter-spacing:.04em;text-transform:uppercase;color:var(--accent)}
  .nouv-badge{margin-left:var(--sp-8);font-size:var(--fs-2xs);font-weight:var(--fw-strong);padding:var(--sp-2) var(--sp-6);border-radius:var(--radius-xs);
    color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent);vertical-align:middle}
  /* La même liste dans Paramètres › Détails des mises à jour (2026-10-25) : la page défile, pas la liste. */
  .set-nouv .nouv-liste{max-height:none;overflow:visible;padding-right:0}
  .nouv-titre{margin:0 0 var(--sp-6);font-size:var(--fs-md);font-weight:var(--fw-strong);color:var(--txt)}
  .nouv-points{margin:0;padding-left:var(--sp-18);display:flex;flex-direction:column;gap:var(--sp-6);color:var(--mut);
    font-size:var(--fs-sm);line-height:var(--lh-normal)}
  .set-ligne{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-18)}
  .set-ligne-txt{flex:1;min-width:0}
  .set-ligne-txt .set-note:last-child{margin-bottom:0}
  .set-ligne > .mini,.set-ligne-cta{flex-shrink:0}
  .set-ligne-cta{display:flex;gap:var(--sp-8);flex-wrap:wrap;justify-content:flex-end}
  @media (max-width:640px){.set-ligne{flex-direction:column;align-items:stretch}}
  .sec-mdp-age{margin:var(--sp-6) 0 0;padding-left:var(--sp-10);border-left:2px solid var(--line2)}
  .sec-mdp-calme{border-left-color:var(--ok)}
  .sec-mdp-neutre{color:var(--txt)}
  .sec-mdp-appuye{border-left-color:var(--warn);color:var(--txt);font-weight:var(--fw-strong)}
  .set-acc-mail{font-size:var(--fs-sm);color:var(--mut)}
  .plan-card{display:flex;align-items:center;gap:var(--sp-14);padding:var(--sp-14) var(--sp-16);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2)}
  .plan-info{flex:1;min-width:0}
  .plan-name{font-size:var(--fs-base);font-weight:var(--fw-strong)}
  .plan-desc{font-size:var(--fs-sm);color:var(--mut);margin-top:var(--sp-2)}
  .plan-badge{flex:none;font-size:var(--fs-2xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.04em;padding:var(--sp-4) var(--sp-10);border-radius:var(--radius-pill);
    background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent)}
  .plan-list{display:flex;flex-direction:column;gap:var(--sp-8)}
  .plan-opt{display:flex;align-items:center;gap:var(--sp-12);width:100%;text-align:left;background:var(--bg2);border:1px solid var(--line);
    border-radius:var(--radius-sm);padding:var(--sp-12) var(--sp-14);cursor:pointer;transition:border-color .12s,box-shadow .12s}
  .plan-opt:hover{border-color:var(--mut2)}
  .plan-opt.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
  .plan-opt-r{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--sp-2)}
  .plan-opt-t{font-weight:var(--fw-strong);font-size:var(--fs-base)}
  .plan-opt-d{font-size:var(--fs-sm);color:var(--mut)}
  /* Cartes tarifaires (Abonnements) */
  .plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-12)}
  @media(max-width:760px){ .plan-grid{grid-template-columns:1fr 1fr} }
  @media(max-width:560px){ .plan-grid{grid-template-columns:1fr} }
  .plan-tile{display:flex;flex-direction:column;gap:var(--sp-10);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);padding:var(--sp-16)}
  .plan-tile.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
  .plan-tile-h{display:flex;align-items:center;gap:var(--sp-8)}
  .plan-tile-n{font-size:var(--fs-base);font-weight:var(--fw-strong)}
  .plan-price{display:flex;align-items:baseline;gap:var(--sp-6);flex-wrap:wrap}
  .plan-price b{font-size:var(--fs-2xl);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight)}
  .plan-per{font-size:var(--fs-xs);color:var(--mut);line-height:1.3}
  .plan-feats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-6)}
  .plan-feats li{display:flex;align-items:flex-start;gap:var(--sp-8);font-size:var(--fs-sm);color:var(--mut)}
  .plan-feats li svg.ic{width:14px;height:14px;flex:none;color:var(--accent);margin-top:var(--sp-1)}
  .plan-cta{margin-top:auto;padding-top:var(--sp-2)}
  .plan-cta button{width:100%}
  .plan-cta .mini[disabled]{opacity:.55;cursor:default}
  .plan-popular{position:relative;border-color:var(--accent);box-shadow:0 0 0 1.5px var(--accent) inset}
  .plan-pop-badge{font-size:var(--fs-2xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.06em;
    color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line));
    border-radius:var(--radius-pill);padding:var(--sp-2) var(--sp-8);width:fit-content;margin-bottom:var(--sp-2)}
  .plan-feat-no svg.ic,.plan-feat-no span{color:var(--mut)!important}
  .plan-saving{font-size:var(--fs-2xs);font-weight:var(--fw-bold);padding:var(--sp-2) var(--sp-8);border-radius:var(--radius-pill);
    background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok)}
  .plan-res-bar{height:4px;border-radius:var(--radius-xs);background:var(--line);margin-top:var(--sp-8);overflow:hidden}
  .plan-res-fill{height:100%;border-radius:var(--radius-xs);background:var(--accent)}
  .plan-tile-wide{max-width:none}
  .plan-card-empty{opacity:.65}

  /* ── Formules : une LISTE horizontale, puis le détail ──
     Quatre paliers aux libellés longs (« 99,95 %, avec pénalités »,
     « ingénieur nommé ») ne tiennent pas côte à côte sans devenir illisibles.
     Et ce qu'on compare d'abord, ce sont trois nombres et un prix : la ligne
     les ALIGNE, la colonne les empile. La ligne mène au détail, où tout ce
     qu'elle a tu se dit enfin. */
  .abos-list{display:flex;flex-direction:column;gap:var(--sp-8)}
  .abos-row{display:flex;align-items:center;gap:var(--sp-12);width:100%;text-align:left;
    background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius-sm);
    padding:var(--sp-14) var(--sp-16);cursor:pointer;
    transition:border-color .12s,box-shadow .12s,background .12s}
  .abos-row:hover{border-color:var(--mut2);background:var(--bg3,var(--bg2))}
  .abos-row.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
  .abos-row-id{flex:1 1 150px;min-width:0;display:flex;flex-direction:column;gap:var(--sp-2)}
  .abos-row-n{display:flex;align-items:center;gap:var(--sp-8);flex-wrap:wrap;
    font-size:var(--fs-base);font-weight:var(--fw-strong);color:var(--txt)}
  .abos-row-t{font-size:var(--fs-sm);color:var(--mut);
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .abos-row-facts{flex:1 1 240px;min-width:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-12)}
  .abos-fact{display:flex;flex-direction:column;gap:var(--sp-1);min-width:0}
  .abos-fact b{font-size:var(--fs-sm);font-weight:var(--fw-strong);color:var(--txt);
    font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  /* Étiquettes en bas de casse et sans interlettrage : « CRÉDITS / MOIS » en
     capitales espacées ne tient pas dans un tiers de 300 px, et une étiquette
     coupée par des points de suspension n'étiquette plus rien. */
  .abos-fact i{font-style:normal;font-size:var(--fs-2xs);color:var(--mut2);
    letter-spacing:var(--ls-none);
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .abos-row-p{flex:none;display:flex;align-items:baseline;gap:var(--sp-4)}
  .abos-row-p b{font-size:var(--fs-lg);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);
    color:var(--txt);font-variant-numeric:tabular-nums;white-space:nowrap}
  .abos-row-p i{font-style:normal;font-size:var(--fs-xs);color:var(--mut);white-space:nowrap}
  .abos-row-go{flex:none;display:flex;color:var(--mut2)}
  .abos-row-go svg.ic{width:16px;height:16px}
  .abos-row:hover .abos-row-go{color:var(--txt)}

  /* Sous 860 px la rangée se replie : l'identité et le prix restent sur la
     même ligne, les chiffres passent dessous. Rien ne disparaît. */
  @media(max-width:760px){
    .abos-row{flex-wrap:wrap;gap:var(--sp-10)}
    .abos-row-id{flex:1 1 auto}
    .abos-row-facts{flex:1 1 100%;order:3;grid-template-columns:repeat(3,minmax(0,1fr))}
  }

  .abos-detail{display:flex;flex-direction:column;gap:var(--sp-16)}
  .abos-back{align-self:flex-start;display:flex;align-items:center;gap:var(--sp-6);
    background:none;border:none;padding:0;cursor:pointer;color:var(--mut);font-size:var(--fs-sm)}
  .abos-back:hover{color:var(--txt)}
  .abos-back svg.ic{width:14px;height:14px;transform:rotate(180deg)}
  .abos-det-h{display:flex;align-items:flex-end;justify-content:space-between;
    gap:var(--sp-16);flex-wrap:wrap;padding-bottom:var(--sp-14);border-bottom:1px solid var(--line)}
  .abos-det-id{display:flex;flex-direction:column;gap:var(--sp-2);min-width:0}
  .abos-det-n{display:flex;align-items:center;gap:var(--sp-8);flex-wrap:wrap;
    font-size:var(--fs-xl);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);color:var(--txt)}
  .abos-det-t{font-size:var(--fs-sm);color:var(--mut)}
  .abos-det-p{display:flex;flex-direction:column;align-items:flex-end;gap:var(--sp-1);text-align:right}
  .abos-det-p b{font-size:var(--fs-2xl);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);
    color:var(--txt);font-variant-numeric:tabular-nums;white-space:nowrap}
  .abos-det-pitch{font-size:var(--fs-base);color:var(--mut);line-height:1.6;max-width:68ch}
  .abos-detail .abos-caps{margin-top:0}
  /* Dans le détail, une précision comme « Réponse sous 1 heure, 24/7, ingénieur
     nommé » est une PHRASE : en nowrap elle sortait de sa colonne et passait
     sous la voisine. Elle a le droit de tenir sur deux lignes. */
  .abos-detail .abos-cap .abos-approx{white-space:normal;line-height:1.45}
  .abos-detail .plan-cta button{width:auto;min-width:220px}
  .abos-lvl-d{font-size:var(--fs-sm);color:var(--mut)}

  /* ── Abonnements : quotas, jauges, extensions ──
     Sobriété chromatique (DA console) : l'accent ne marque qu'un ÉTAT - la
     formule sélectionnée, la part consommée, le total à payer. */
  .abos-badge-slot{min-height:19px;display:flex;align-items:center}
  .abos-badge-slot .plan-pop-badge{margin-bottom:0}
  .abos-caps{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--sp-10) var(--sp-22);margin-top:var(--sp-12)}
  .abos-cap{display:flex;flex-direction:column;gap:var(--sp-1);font-size:var(--fs-sm);min-width:0}
  .abos-cap-k{font-size:var(--fs-2xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.05em;color:var(--mut)}
  .abos-cap b{overflow:hidden;text-overflow:ellipsis}
  .abos-quota li b{color:var(--txt);font-weight:var(--fw-strong)}
  .abos-approx{color:var(--mut2);font-size:var(--fs-xs);white-space:nowrap;font-weight:var(--fw-regular)}
  .abos-fam-k{font-size:var(--fs-2xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.05em;color:var(--mut)}
  .abos-lvl{padding-top:var(--sp-10);border-top:1px solid var(--line);display:flex;flex-direction:column;gap:var(--sp-6)}
  .abos-lvl-n{font-size:var(--fs-md);font-weight:var(--fw-strong)}

  /* Les natures déployables, listées sous « Ce qu'elle déploie » dans le
     détail d'une formule. L'encart d'introduction qui les portait autrefois
     en tête de la liste a été retiré : la liste se lit sans préambule. */
  .abos-same-f{padding-top:var(--sp-6);border-top:1px solid var(--line);font-size:var(--fs-xs);color:var(--mut2)}

  /* Jauges (stockage, enveloppe Pilote) */
  .abos-gauge{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);padding:var(--sp-14) var(--sp-16)}
  .abos-gauge-h{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-16);flex-wrap:wrap}
  .abos-gauge-v{font-size:var(--fs-xl);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight)}
  .abos-gauge-d{font-size:var(--fs-sm);color:var(--mut);margin-top:var(--sp-2)}
  .abos-gauge-p{font-size:var(--fs-base);font-weight:var(--fw-strong);color:var(--accent);white-space:nowrap}
  .abos-gauge-p span{font-size:var(--fs-xs);font-weight:var(--fw-regular);color:var(--mut)}
  .abos-bar{display:flex;height:6px;border-radius:var(--radius-xs);overflow:hidden;background:var(--line);margin-top:var(--sp-12)}
  .abos-bar-a{background:var(--accent)}
  .abos-bar-a.warn{background:var(--warn)}
  .abos-bar-b{background:color-mix(in srgb,var(--accent) 22%,transparent)}
  .abos-legend{display:flex;align-items:center;gap:var(--sp-6);flex-wrap:wrap;margin-top:var(--sp-8);font-size:var(--fs-xs);color:var(--mut)}
  .abos-legend span[class^="abos-dot"]{width:8px;height:8px;border-radius:var(--radius-xs);flex:none}
  .abos-dot-a{background:var(--accent)}
  .abos-dot-b{background:color-mix(in srgb,var(--accent) 22%,transparent);margin-left:var(--sp-12)}
  .abos-mods{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin-top:var(--sp-12);padding-top:var(--sp-10);border-top:1px solid var(--line)}
  .abos-mod{display:flex;align-items:baseline;gap:var(--sp-6);font-size:var(--fs-xs);color:var(--mut);
    border:1px solid var(--line);border-radius:var(--radius-pill);padding:var(--sp-2) var(--sp-10)}
  .abos-mod b{color:var(--txt);font-variant-numeric:tabular-nums}

  .abos-scan{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-14);flex-wrap:wrap;
    margin-top:var(--sp-12);padding-top:var(--sp-10);border-top:1px solid var(--line);font-size:var(--fs-xs);color:var(--mut)}
  .abos-scan .mini{flex:none}
  .abos-scan .cmp-spin{margin-right:var(--sp-4)}

  /* Extensions de stockage */
  .abos-caps-list{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);padding:var(--sp-12) var(--sp-16)}
  .abos-ext-k{font-size:var(--fs-sm);font-weight:var(--fw-strong);margin:var(--sp-16) 0 var(--sp-8)}
  .abos-addons{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-10)}
  @media(max-width:560px){ .abos-addons{grid-template-columns:1fr} }
  .abos-addon{display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-10) var(--sp-14);border:1px solid var(--line);
    border-radius:var(--radius-sm);background:var(--bg2)}
  .abos-addon-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--sp-1);font-size:var(--fs-base)}
  .abos-addon-p{font-size:var(--fs-sm);color:var(--mut);font-weight:var(--fw-regular)}
  .abos-step{display:flex;align-items:center;gap:var(--sp-6);flex:none}
  .abos-step .mini{min-width:28px;padding:var(--sp-2) 0;text-align:center;line-height:var(--lh-tight)}
  .abos-step-q{min-width:20px;text-align:center;font-size:var(--fs-md);font-weight:var(--fw-strong);font-variant-numeric:tabular-nums}

  /* Nom de domaine offert : un registre, jamais une caisse. */
  .abos-dom-form{display:flex;gap:var(--sp-8);flex-wrap:wrap;align-items:center}
  .abos-dom-in{flex:1;min-width:200px;padding:var(--sp-6) var(--sp-10);border:1px solid var(--line);border-radius:var(--radius-sm);
    background:var(--card);color:var(--txt);font-size:var(--fs-md);font-family:var(--mono,ui-monospace,monospace)}
  .abos-dom-in:focus-visible{outline:none;border-color:var(--accent);box-shadow:var(--focus)}
  .abos-dom-form .set-select{flex:0 1 190px;min-width:150px}
  .abos-dom-res{display:flex;align-items:center;gap:var(--sp-8);flex-wrap:wrap;margin-top:var(--sp-10);padding:var(--sp-10) var(--sp-14);
    border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);font-size:var(--fs-md)}
  .abos-dom-res svg.ic{width:15px;height:15px;flex:none;color:var(--mut)}
  .abos-dom-res.libre{border-color:color-mix(in srgb,var(--ok) 45%,var(--line))}
  .abos-dom-res.libre svg.ic{color:var(--ok)}
  .abos-dom-res .mini{margin-left:auto}
  /* Les noms de domaine : un seul cadre, un trait entre les noms (comme les listes de l'atelier, 2026-10-25). */
  .abos-dom-rows{display:flex;flex-direction:column;border:.5px solid var(--line);border-radius:var(--radius);background:var(--bg2);overflow:hidden}
  .abos-dom-row{display:flex;align-items:center;gap:var(--sp-12);flex-wrap:wrap;padding:var(--sp-10) var(--sp-14)}
  .abos-dom-row+.abos-dom-row{border-top:.5px solid var(--line)}
  .abos-dom-vide{padding:var(--sp-12) var(--sp-14);border:.5px dashed var(--line);border-radius:var(--radius);font-size:var(--fs-sm);color:var(--mut)}
  .abos-dom-row.off{opacity:.6}
  .abos-dom-n{flex:1;min-width:180px;display:flex;flex-direction:column;gap:var(--sp-1)}
  .abos-dom-n b{font-size:var(--fs-base);font-family:var(--mono,ui-monospace,monospace)}
  .abos-dom-m{font-size:var(--fs-xs);color:var(--mut)}
  .abos-dom-etat{flex:none;font-size:var(--fs-2xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.04em;
    padding:var(--sp-2) var(--sp-8);border-radius:var(--radius-pill);background:var(--line2,var(--line));color:var(--mut)}
  .abos-dom-etat.s-a_commander{background:color-mix(in srgb,var(--warn) 16%,transparent);color:var(--warn)}
  .abos-dom-etat.s-actif{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok)}
  .abos-dom-act{display:flex;gap:var(--sp-6);flex:none;flex-wrap:wrap}

  /* Échelle d'infrastructure : elle se lit, elle ne s'achète pas à la carte. */
  .abos-ladder{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-10)}
  .abos-ladder-4{grid-template-columns:repeat(4,1fr)}
  @media(max-width:900px){ .abos-ladder-4{grid-template-columns:repeat(2,1fr)} }
  /* Le régime est un ÉTAT : c'est le seul endroit du panneau où la couleur alerte. */
  .abos-regime{margin-left:var(--sp-8);font-size:var(--fs-2xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.04em;
    padding:var(--sp-2) var(--sp-8);border-radius:var(--radius-pill);vertical-align:middle;
    background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent)}
  .abos-regime.economie{background:color-mix(in srgb,var(--warn) 18%,transparent);color:var(--warn)}
  .abos-regime.arret{background:color-mix(in srgb,var(--err) 18%,transparent);color:var(--err)}
  @media(max-width:700px){ .abos-ladder{grid-template-columns:1fr} }
  .abos-rung{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);padding:var(--sp-10) var(--sp-14)}
  .abos-rung.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
  .abos-rung-h{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-10);font-size:var(--fs-md)}
  .abos-rung-h span{font-size:var(--fs-xs);color:var(--mut);text-transform:uppercase;letter-spacing:.04em;font-weight:var(--fw-bold)}
  .abos-rung-d{font-size:var(--fs-xs);color:var(--mut);margin-top:var(--sp-2);line-height:var(--lh-normal)}

  /* Achat de crédits : le curseur est une commodité, la saisie n'a pas de plafond. */
  .abos-range{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:var(--radius-xs);
    background:var(--line);outline:none;margin:0 0 var(--sp-8)}
  .abos-range:focus-visible{box-shadow:var(--focus)}
  .abos-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;
    background:var(--accent);border:2px solid var(--card);box-shadow:0 0 0 1px var(--accent);cursor:pointer}
  .abos-range::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--accent);
    border:2px solid var(--card);box-shadow:0 0 0 1px var(--accent);cursor:pointer}
  .abos-buy{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-16);flex-wrap:wrap}
  .abos-range-out{font-size:var(--fs-md);font-weight:var(--fw-strong);font-variant-numeric:tabular-nums}
  .abos-buy-free{display:flex;align-items:center;gap:var(--sp-6);font-size:var(--fs-xs);color:var(--mut)}
  .abos-buy-n{width:74px;padding:var(--sp-4) var(--sp-8);border:1px solid var(--line);border-radius:var(--radius-sm);
    background:var(--card);color:var(--txt);font-size:var(--fs-md);font-variant-numeric:tabular-nums;text-align:right}
  .abos-buy-n:focus-visible{outline:none;border-color:var(--accent);box-shadow:var(--focus)}

  /* Récapitulatif engageant (le total vient du serveur) */
  /* La vue partagée de l'abonnement (le proprio, 2026-10-25 : « à gauche les options, à droite le récapitulatif total ») :
     le récapitulatif reste à l'écran pendant qu'on fait défiler les options ; en colonne sous 760 px. */
  .abos-sous-t{margin:var(--sp-24) 0 var(--sp-12);font-size:var(--fs-base);font-weight:var(--fw-strong);color:var(--txt)}
  .abos-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,300px);gap:var(--sp-20);align-items:start}
  .abos-opts{min-width:0;display:flex;flex-direction:column}
  .abos-opts>.seg{align-self:flex-start;margin-bottom:var(--sp-4)}
  .abos-recap{position:sticky;top:var(--sp-16);border:.5px solid var(--line);border-radius:var(--radius);background:var(--bg2);padding:var(--sp-14) var(--sp-16)}
  .abos-recap-t{font-size:var(--fs-xs);font-weight:var(--fw-strong);letter-spacing:.04em;text-transform:uppercase;color:var(--mut);margin-bottom:var(--sp-8)}
  .abos-recap-vide{font-size:var(--fs-sm);color:var(--mut);padding:var(--sp-6) 0;line-height:var(--lh-normal)}
  .abos-recap-go{width:100%;margin-top:var(--sp-14);justify-content:center}
  @media(max-width:760px){ .abos-split{grid-template-columns:1fr} .abos-recap{position:static} }
  .abos-recap-l{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-16);font-size:var(--fs-md);
    color:var(--mut);padding:var(--sp-2) 0}
  .abos-recap-l b{font-variant-numeric:tabular-nums;color:var(--txt);font-weight:var(--fw-strong)}
  .abos-recap-tot{margin-top:var(--sp-6);padding-top:var(--sp-8);border-top:.5px solid var(--line);color:var(--txt);font-weight:var(--fw-strong)}
  .abos-recap-tot b{font-size:var(--fs-lg);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);color:var(--accent)}
  .abos-recap-sum{font-size:var(--fs-sm);color:var(--mut);margin-top:var(--sp-2);line-height:var(--lh-normal)}
  .abos-pilote{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg2);padding:var(--sp-16)}
  .abos-pilote p{margin:0 0 var(--sp-12);font-size:var(--fs-md);line-height:1.6;color:var(--mut)}
  .abos-pilote li{font-size:var(--fs-sm);line-height:1.55}
  .abos-pilote li b{color:var(--txt);font-weight:var(--fw-strong)}

  /* ── Librairie boutique ── */
  /* Recherche */
  .lib-search-wrap{position:relative;margin-bottom:var(--sp-20)}
  .lib-search{width:100%;padding:var(--sp-8) var(--sp-12) var(--sp-8) var(--sp-36);border:none;border-radius:var(--radius);
    background:var(--bg2);color:var(--fg);font-size:var(--fs-md);outline:none;
    transition:box-shadow .12s;box-sizing:border-box}
  .lib-search:focus{box-shadow:var(--focus)}
  .lib-search-ic{position:absolute;left:11px;top:50%;transform:translateY(-50%);
    color:var(--mut);pointer-events:none;display:flex;font-size:var(--fs-base)}
  /* En-têtes de section */
  .lib-cat-section{margin-bottom:var(--sp-22)}
  .lib-cat-title{font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.09em;
    color:var(--mut);margin-bottom:var(--sp-6);padding:0 var(--sp-2);
    display:flex;align-items:center;gap:var(--sp-6)}
  .lib-cat-title-ic{display:flex;align-items:center;font-size:var(--fs-sm);flex:none}
  .lib-cat-label{flex:1}
  .lib-cat-count{font-size:var(--fs-xs);font-weight:var(--fw-regular);color:var(--mut);
    text-transform:none;letter-spacing:var(--ls-none)}
  .lib-cat-title .lib-reg-status{font-size:var(--fs-2xs);font-weight:var(--fw-regular);color:var(--mut);
    text-transform:none;letter-spacing:var(--ls-none)}
  .lib-cat-add-btn{display:inline-flex;align-items:center;gap:var(--sp-4);padding:var(--sp-2) var(--sp-10);
    border:1px solid var(--accent);border-radius:var(--radius-sm);background:transparent;
    font-size:var(--fs-2xs);font-weight:var(--fw-bold);color:var(--accent);cursor:pointer;text-transform:none;letter-spacing:var(--ls-none);
    transition:background .12s,color .12s}
  .lib-cat-add-btn:hover{background:var(--accent);color:var(--on-solid)}
  /* ── Frameworks modal ── */
  .fw-mtabs{display:flex;gap:0;margin-bottom:var(--sp-20);border-bottom:1px solid var(--line2)}
  .fw-mtab{padding:var(--sp-8) var(--sp-16);font-size:var(--fs-md);font-weight:var(--fw-strong);color:var(--mut);border:none;background:transparent;
    cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .12s,border-color .12s}
  .fw-mtab.on{color:var(--accent);border-bottom-color:var(--accent)}
  .fw-mtab:hover:not(.on){color:var(--fg)}
  .fw-catalog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-10)}
  @media(max-width:540px){.fw-catalog-grid{grid-template-columns:1fr}}
  .fw-catalog-card{border:1px solid var(--line2);border-radius:var(--radius);background:var(--card);
    padding:var(--sp-16);cursor:default;transition:border-color .12s;position:relative}
  .fw-catalog-card:hover{border-color:color-mix(in srgb,var(--lc,var(--accent)) 40%,var(--line2))}
  .fw-catalog-icon{width:36px;height:36px;border-radius:var(--radius);display:flex;align-items:center;
    justify-content:center;font-size:var(--fs-lg);margin-bottom:var(--sp-10)}
  .fw-catalog-name{font-size:var(--fs-md);font-weight:var(--fw-bold);color:var(--fg);margin-bottom:var(--sp-2)}
  .fw-catalog-desc{font-size:var(--fs-xs);color:var(--mut);line-height:var(--lh-normal)}
  .fw-catalog-tags{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-8)}
  .fw-catalog-tag{font-size:var(--fs-2xs);font-weight:var(--fw-strong);padding:var(--sp-2) var(--sp-6);border-radius:var(--radius-xs);
    background:var(--bg2);color:var(--mut);border:1px solid var(--line2)}
  .fw-install-btn{position:absolute;top:12px;right:12px;font-size:var(--fs-xs);padding:var(--sp-2) var(--sp-10);
    border:1px solid var(--line2);border-radius:var(--radius-sm);background:var(--card);color:var(--mut);cursor:pointer;
    transition:border-color .12s,color .12s}
  .fw-install-btn:hover{border-color:var(--accent);color:var(--accent)}
  .fw-install-btn.done{border-color:var(--ok);color:var(--ok);pointer-events:none}
  .fw-style-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6);margin-top:var(--sp-4)}
  .fw-style-btn{padding:var(--sp-8) var(--sp-4);border:1px solid var(--line2);border-radius:var(--radius);
    font-size:var(--fs-xs);font-weight:var(--fw-strong);text-align:center;color:var(--mut);background:var(--card);
    cursor:pointer;transition:border-color .12s,color .12s,background .12s}
  .fw-style-btn.on{border-color:var(--accent);color:var(--accent);
    background:color-mix(in srgb,var(--accent) 8%,var(--card))}
  .fw-gen-progress{display:flex;flex-direction:column;align-items:center;gap:var(--sp-18);padding:var(--sp-36) 0;text-align:center}
  .fw-gen-bar{width:100%;height:4px;background:var(--line2);border-radius:var(--radius-xs);overflow:hidden;margin-top:var(--sp-4)}
  .fw-gen-fill{height:100%;background:var(--accent);border-radius:var(--radius-xs);transition:width .5s ease}
  /* ── Framework detail amélioré ── */
  .fw-token-palette{display:flex;gap:var(--sp-8);flex-wrap:wrap;margin:var(--sp-10) 0 var(--sp-4)}
  .fw-token-swatch{width:44px;text-align:center}
  .fw-token-swatch-color{width:44px;height:36px;border-radius:var(--radius);border:1px solid var(--line2);margin-bottom:var(--sp-4)}
  .fw-token-swatch-name{font-size:var(--fs-2xs);color:var(--mut);font-weight:var(--fw-strong);overflow:hidden;
    text-overflow:ellipsis;white-space:nowrap;letter-spacing:var(--ls-none)}
  .fw-comp-list{border:1px solid var(--line2);border-radius:var(--radius);overflow:hidden}
  .fw-comp-row{padding:var(--sp-8) var(--sp-14);border-bottom:1px solid var(--line2);display:flex;
    align-items:center;gap:var(--sp-10);flex-wrap:wrap}
  .fw-comp-row:last-child{border-bottom:none}
  .fw-comp-name{font-size:var(--fs-sm);font-weight:var(--fw-strong);color:var(--fg);min-width:110px}
  .fw-comp-cat{font-size:var(--fs-2xs);color:var(--mut);font-weight:var(--fw-strong);letter-spacing:.04em;margin-left:var(--sp-2)}
  .fw-comp-variants{display:flex;gap:var(--sp-4);flex-wrap:wrap;margin-left:auto}
  .fw-comp-variant{font-size:var(--fs-2xs);padding:var(--sp-2) var(--sp-6);border-radius:var(--radius-xs);
    background:var(--bg2);color:var(--mut);border:1px solid var(--line2)}
  .fw-doc-link{display:inline-flex;align-items:center;gap:var(--sp-8);padding:var(--sp-10) var(--sp-18);
    border:1px solid var(--line2);border-radius:var(--radius);background:var(--card);
    font-size:var(--fs-md);font-weight:var(--fw-strong);color:var(--fg);text-decoration:none;cursor:pointer;
    transition:border-color .12s,color .12s}
  .fw-doc-link:hover{border-color:var(--accent);color:var(--accent)}

  /* ── Aperçu vivant de la doc framework (iframe incorporée) ───────────── */
  .fw-doc-frame{margin:var(--sp-6) 0 var(--sp-4);border:1px solid var(--line2);border-radius:var(--radius);
    overflow:hidden;background:var(--card);box-shadow:var(--shadow-sm,0 2px 8px rgba(0,0,0,.05))}
  .fw-doc-frame-bar{display:flex;align-items:center;gap:var(--sp-6);padding:var(--sp-8) var(--sp-12);
    background:var(--bg2);border-bottom:1px solid var(--line2)}
  .fw-doc-dot{width:9px;height:9px;border-radius:50%;background:var(--line2);flex:none}
  .fw-doc-dot:nth-child(1){background:#ff5f57}
  .fw-doc-dot:nth-child(2){background:#febc2e}
  .fw-doc-dot:nth-child(3){background:#28c840}
  .fw-doc-frame-url{margin-left:var(--sp-8);font-size:var(--fs-xs);font-family:var(--font-mono);
    color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fw-doc-frame-iframe{display:block;width:100%;height:540px;border:0;background:var(--paper)}
  .fw-doc-frame-btn{display:inline-flex;align-items:center;justify-content:center;
    width:30px;height:30px;border:1px solid var(--line2);border-radius:var(--radius);background:var(--card);
    color:var(--mut);cursor:pointer;transition:border-color .12s,color .12s}
  .fw-doc-frame-btn:hover{border-color:var(--accent);color:var(--accent)}
  /* Plein écran (modale) */
  .fw-doc-full{width:100%;height:min(78vh,720px)}
  .fw-doc-full-iframe{display:block;width:100%;height:100%;border:0;border-radius:var(--radius);background:var(--paper)}

  /* ── Breadcrumb fil d'Ariane ────────────────────────────────────────── */
  .lib-breadcrumb{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap}
  .lib-bc-link{background:none;border:none;padding:0;font-size:var(--fs-md);font-weight:var(--fw-strong);
    color:var(--mut);cursor:pointer;transition:color .12s}
  .lib-bc-link:hover{color:var(--accent)}
  .lib-bc-sep{font-size:var(--fs-sm);color:var(--line2);padding:0 var(--sp-2);user-select:none}
  .lib-bc-current{font-size:var(--fs-md);font-weight:var(--fw-bold);color:var(--fg)}

  /* ── Librairie - section cat sub ────────────────────────────────────── */
  .lib-cat-sub{font-size:var(--fs-xs);font-weight:var(--fw-medium);color:var(--mut);margin-left:var(--sp-8)}

  /* ── Librairie - store browse button ────────────────────────────────── */

  /* ── Librairie Store - vue catalogue ────────────────────────────────── */

  /* ── Font install modal ──────────────────────────────────────────────── */
  .fnt-bar{display:flex;flex-direction:column;gap:var(--sp-8);margin-bottom:var(--sp-12);
    position:sticky;top:0;z-index:1;background:var(--card);padding-bottom:var(--sp-4)}
  .fnt-live-count{position:absolute;right:12px;top:50%;transform:translateY(-50%);
    font-size:var(--fs-xs);font-weight:var(--fw-strong);color:var(--mut);pointer-events:none}
  .fnt-filter-row{display:flex;gap:var(--sp-4);overflow-x:auto;padding-bottom:var(--sp-2);scrollbar-width:none}
  .fnt-filter-row::-webkit-scrollbar{display:none}
  .fnt-filter-btn{display:inline-flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4) var(--sp-10);
    border:1px solid var(--line2);border-radius:var(--radius-modal);font-size:var(--fs-xs);font-weight:var(--fw-strong);
    color:var(--mut);background:var(--card);cursor:pointer;white-space:nowrap;flex-shrink:0;
    transition:border-color .1s,color .1s,background .1s}
  .fnt-filter-btn em{font-style:normal;font-size:var(--fs-2xs);opacity:.55;font-weight:var(--fw-bold)}
  .fnt-filter-btn:hover{border-color:var(--accent);color:var(--accent)}
  .fnt-filter-btn.on{background:var(--fg);border-color:var(--fg);color:var(--bg)}
  .fnt-filter-btn.on em{opacity:.5}
  .fnt-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
  .fnt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--sp-6);
    max-height:calc(100vh - 320px);min-height:280px;overflow-y:auto;padding-right:var(--sp-2)}
  .fnt-grid::-webkit-scrollbar{width:var(--sb-size)}
  .fnt-grid::-webkit-scrollbar-thumb{background:var(--sb-thumb);border-radius:var(--radius-pill);
    border:var(--sb-pad) solid transparent;background-clip:padding-box}
  .fnt-card{border-radius:var(--radius);background:var(--bg2);overflow:hidden;
    transition:transform .12s,box-shadow .12s}
  .fnt-card:hover{transform:translateY(-2px);box-shadow:var(--elev-2)}
  .fnt-card-sample{height:68px;display:flex;align-items:center;justify-content:center;
    font-size:var(--fs-4xl);line-height:var(--lh-flat);color:var(--fg);background:var(--card);
    border-bottom:1px solid var(--line2);transition:color .2s}
  .fnt-card-sample:not([style]){color:var(--line2)}
  .fnt-card-foot{padding:var(--sp-6) var(--sp-8);display:flex;align-items:center;gap:var(--sp-4);justify-content:space-between}
  .fnt-card-info{min-width:0;flex:1}
  .fnt-card-name{font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--fg);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fnt-card-cat{font-size:var(--fs-2xs);font-weight:var(--fw-strong);text-transform:uppercase;
    letter-spacing:.04em;margin-top:var(--sp-1);opacity:.8}
  .fnt-card-btn{width:22px;height:22px;border-radius:var(--radius-sm);border:1.5px solid var(--line2);
    background:transparent;color:var(--mut);font-size:var(--fs-base);cursor:pointer;flex-shrink:0;
    display:flex;align-items:center;justify-content:center;
    transition:background .1s,color .1s,border-color .1s;line-height:var(--lh-flat);padding:0}
  .fnt-card-btn:hover:not(:disabled){background:var(--accent);border-color:var(--accent);color:var(--on-solid)}
  .fnt-card.installed .fnt-card-btn{background:color-mix(in srgb,var(--ok) 15%,var(--bg2));
    border-color:color-mix(in srgb,var(--ok) 45%,var(--line2));color:var(--ok);
    cursor:default;font-size:var(--fs-xs)}
  .fnt-sentinel{height:1px;width:100%;grid-column:1/-1;pointer-events:none}
  .fnt-url-form{display:flex;flex-direction:column;gap:0}
  .fnt-url-suggestions{display:flex;align-items:center;gap:var(--sp-8);flex-wrap:wrap;margin-top:var(--sp-8)}
  .fnt-upload-zone{border:2px dashed var(--line2);border-radius:var(--radius);padding:var(--sp-36) var(--sp-24);
    text-align:center;cursor:pointer;transition:border-color .15s,background .15s;user-select:none}
  .fnt-upload-zone:hover,.fnt-upload-zone.drag-over{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 5%,var(--card))}
  .fnt-upload-icon{font-size:var(--fs-3xl);margin-bottom:var(--sp-10);color:var(--mut)}
  .fnt-upload-label{font-size:var(--fs-base);font-weight:var(--fw-strong);color:var(--fg)}
  .fnt-upload-hint{font-size:var(--fs-sm);color:var(--mut);margin-top:var(--sp-4)}
  /* Grouped list - 1 seule bordure autour du groupe */
  /* Ligne */
  /* Icône */
  /* Texte */
  /* Actions */
  .lib-card-chevron{color:var(--mut);display:flex;align-items:center;font-size:var(--fs-md);
    opacity:0;transform:translateX(-4px);transition:opacity .12s,transform .12s,color .12s}
  /* Badges - texte seul, sans fond */
  .lib-badge{display:inline-flex;align-items:center;font-size:var(--fs-2xs);font-weight:var(--fw-bold);
    letter-spacing:.03em;padding:0 var(--sp-2);white-space:nowrap;flex:none}
  .lib-badge-default{color:var(--accent)}
  .lib-badge-avail{color:var(--bc,var(--ok))}
  .lib-badge-remote{color:var(--accent)}
  .lib-badge-included{color:var(--warn)}
  .lib-badge-db{color:var(--err);margin-left:var(--sp-2)}
  .lib-badge-tech{color:var(--mut);background:var(--line2);border-radius:var(--radius-xs);margin-left:var(--sp-2);font-size:var(--fs-2xs);padding:var(--sp-1) var(--sp-4);letter-spacing:.04em}
  .lib-tabs-spacer{flex:1}
  /* ── Panel détail ── */
  #lib-pane-body{min-height:0}
  .lib-detail-view{display:flex;flex-direction:column;padding:0}
  .lib-detail-head{padding:0 0 var(--sp-14);display:flex;align-items:center}
  .lib-detail-back{display:inline-flex;align-items:center;gap:var(--sp-6);padding:var(--sp-6) var(--sp-12);
    border:none;border-radius:var(--radius);background:var(--bg2);font-size:var(--fs-sm);font-weight:var(--fw-medium);
    color:var(--mut);cursor:pointer;transition:background .1s,color .1s}
  .lib-detail-back:hover{background:color-mix(in srgb,var(--accent) 10%,var(--bg2));color:var(--fg)}
  /* Hero card - teinté couleur de la librairie */
  .lib-detail-hero{display:flex;align-items:center;gap:var(--sp-20);margin-bottom:var(--sp-22);
    padding:var(--sp-20) var(--sp-22);
    background:color-mix(in srgb,var(--lc,var(--accent)) 7%,var(--bg2));
    border:1px solid color-mix(in srgb,var(--lc,var(--accent)) 20%,var(--line2));
    border-radius:var(--radius)}
  .lib-detail-hero-body{flex:1;min-width:0}
  .lib-detail-icon{width:68px;height:68px;display:flex;align-items:center;justify-content:center;
    border:none;border-radius:var(--radius-modal);font-size:var(--fs-3xl);flex:none}
  .lib-detail-name{font-size:var(--fs-lg);font-weight:var(--fw-bold);line-height:1.1;letter-spacing:-.015em;
    display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-8)}
  .lib-detail-meta{font-size:var(--fs-xs);color:var(--mut);margin-top:var(--sp-6)}
  .lib-detail-desc{font-size:var(--fs-md);color:var(--fg);line-height:var(--lh-loose);margin-bottom:var(--sp-18)}
  .lib-detail-tags{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-bottom:var(--sp-22)}
  .lib-tag{font-size:var(--fs-xs);padding:var(--sp-2) var(--sp-10);border-radius:var(--radius-modal);
    background:var(--bg2);color:var(--mut);border:1px solid var(--line2)}
  /* Stats : bande horizontale, 1 seule bordure autour */
  .lib-detail-stats{display:flex;margin-bottom:var(--sp-24);
    border:1px solid var(--line2);border-radius:var(--radius);overflow:hidden}
  .lib-detail-stat{flex:1;padding:var(--sp-14) var(--sp-16);text-align:center;background:var(--card)}
  .lib-detail-stat+.lib-detail-stat{border-left:1px solid var(--line2)}
  .lib-detail-stat-v{font-size:var(--fs-base);font-weight:var(--fw-bold);color:var(--fg);line-height:var(--lh-flat)}
  .lib-detail-stat-k{font-size:var(--fs-2xs);color:var(--mut);margin-top:var(--sp-4);
    text-transform:uppercase;letter-spacing:var(--ls-wide)}
  /* Titres sous-sections dans le détail */
  .lib-detail-section-title{font-size:var(--fs-2xs);font-weight:var(--fw-bold);text-transform:uppercase;
    letter-spacing:.12em;color:var(--mut);margin-bottom:var(--sp-8);margin-top:var(--sp-24);
    display:flex;align-items:center;gap:var(--sp-8)}
  /* CDC_CONFIGURATION_SOLUTION K19 (2026-10-12) : ce que le moteur déclare au CMS, sur sa fiche de la Librairie. */
  .lib-cms{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--sp-10)}
  .lib-cms-partie{padding:var(--sp-10) var(--sp-12);border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
  .lib-cms-titre{font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--mut);margin-bottom:var(--sp-6)}
  .lib-cms-sec + .lib-cms-sec{margin-top:var(--sp-8)}
  .lib-cms ul{list-style:none;margin:var(--sp-4) 0 0;padding:0;display:flex;flex-direction:column;gap:var(--sp-4)}
  .lib-cms-champ{font-size:var(--fs-sm);color:var(--txt);overflow-wrap:anywhere}
  .lib-cms-champ code{font-size:var(--fs-2xs);color:var(--mut)}
  .lib-cms-n{font-size:var(--fs-xs);color:var(--mut)}
  .lib-detail-section-title::after{content:'';flex:1;height:1px;background:var(--line2)}
  /* Liste de fichiers sans bordures externes */
  .lib-detail-files{background:var(--bg2);border-radius:var(--radius);overflow:hidden;
    border:1px solid var(--line2)}
  .lib-detail-file{display:flex;align-items:center;justify-content:space-between;
    padding:var(--sp-8) var(--sp-14);font-size:var(--fs-sm)}
  .lib-detail-file+.lib-detail-file{border-top:1px solid var(--line2)}
  .lib-detail-file-path{font-family:var(--font-mono);color:var(--fg);display:flex;align-items:center;min-width:0}
  .lib-detail-file-size{color:var(--mut);flex:none;margin-left:var(--sp-12);font-size:var(--fs-xs)}
  .lib-detail-file-ic{flex:none;display:inline-flex;align-items:center;justify-content:center;
    width:15px;height:15px;margin-right:var(--sp-10);color:color-mix(in srgb,var(--lc,var(--accent)) 75%,var(--mut))}
  .lib-detail-file-ic svg{width:14px;height:14px}
  /* Tagline + pastilles tech dans le héro */
  .lib-detail-tagline{font-size:var(--fs-md);color:var(--fg);margin-top:var(--sp-6);font-weight:var(--fw-medium);line-height:1.45}
  .lib-detail-pills{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin-top:var(--sp-12)}
  .lib-pill{display:inline-flex;align-items:center;gap:var(--sp-6);font-size:var(--fs-2xs);font-weight:var(--fw-bold);
    letter-spacing:.04em;padding:var(--sp-2) var(--sp-10);border-radius:var(--radius-modal);
    color:color-mix(in srgb,var(--pc,var(--mut)) 82%,var(--fg));
    background:color-mix(in srgb,var(--pc,var(--mut)) 15%,var(--bg2));
    border:1px solid color-mix(in srgb,var(--pc,var(--mut)) 28%,transparent)}
  .lib-pill::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--pc,var(--mut))}
  /* Grille de fonctionnalités */
  .lib-feat-grid{list-style:none;margin:0 0 var(--sp-2);padding:0;display:grid;
    grid-template-columns:1fr 1fr;gap:var(--sp-8) var(--sp-20)}
  .lib-feat{display:flex;align-items:flex-start;gap:var(--sp-8);font-size:var(--fs-sm);color:var(--fg);line-height:1.45}
  .lib-feat-ic{flex:none;width:18px;height:18px;margin-top:.5px;display:flex;align-items:center;
    justify-content:center;border-radius:50%;color:var(--lc,var(--accent));
    background:color-mix(in srgb,var(--lc,var(--accent)) 15%,transparent)}
  .lib-feat-ic svg{width:11px;height:11px}
  @media (max-width:680px){ .lib-feat-grid{grid-template-columns:1fr} }
  /* ── Fiche moteur : deux niveaux de lecture ─────────────────────────────
     Une fiche sert deux publics opposés : quelqu'un qui découvre et veut
     comprendre à quoi ça sert, et quelqu'un qui va l'installer et veut tout.
     On ne fait pas la moyenne des deux (elle ne convient à personne) : on
     bascule d'un niveau à l'autre. ── */


  /* « En clair » — le bloc que lit quelqu'un qui découvre */
  .lib-clear{border-radius:var(--radius);padding:var(--sp-20) var(--sp-22);margin-bottom:var(--sp-22);
    background:color-mix(in srgb,var(--lc,var(--accent)) 7%,var(--bg2));
    border:1px solid color-mix(in srgb,var(--lc,var(--accent)) 20%,transparent)}
  .lib-clear-what{font-size:var(--fs-base);line-height:1.55;color:var(--fg);font-weight:var(--fw-medium);margin:0}
  .lib-clear-ex{display:flex;gap:var(--sp-8);align-items:flex-start;margin-top:var(--sp-14);
    font-size:var(--fs-sm);line-height:1.55;color:var(--mut);font-style:italic}
  .lib-clear-ex-ic{flex:none;width:17px;height:17px;margin-top:var(--sp-1);color:var(--lc,var(--accent))}
  .lib-clear-ex-ic svg{width:15px;height:15px}

  /* Bénéfices concrets : 3 cartes lisibles sans connaissance technique */
  .lib-why{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
    gap:var(--sp-12);margin-bottom:var(--sp-24)}
  .lib-why-card{background:var(--card);border:1px solid var(--line2);border-radius:var(--radius);
    padding:var(--sp-14) var(--sp-16)}
  .lib-why-ic{width:30px;height:30px;border-radius:var(--radius);display:flex;align-items:center;
    justify-content:center;margin-bottom:var(--sp-10);color:var(--lc,var(--accent));
    background:color-mix(in srgb,var(--lc,var(--accent)) 14%,transparent)}
  .lib-why-ic svg{width:16px;height:16px}
  .lib-why-t{font-size:var(--fs-md);font-weight:var(--fw-bold);color:var(--fg);line-height:1.3;margin-bottom:var(--sp-4)}
  .lib-why-d{font-size:var(--fs-sm);color:var(--mut);line-height:1.55}

  /* « Bon à savoir » : les faits en langage courant, pas en jargon */
  .lib-facts{display:flex;flex-wrap:wrap;gap:var(--sp-8);margin-bottom:var(--sp-24)}
  .lib-fact{display:inline-flex;align-items:center;gap:var(--sp-8);padding:var(--sp-8) var(--sp-14);
    border-radius:var(--radius);background:var(--bg2);border:1px solid var(--line2);
    font-size:var(--fs-sm);color:var(--fg);line-height:1.3}
  .lib-fact svg{width:15px;height:15px;flex:none;color:var(--lc,var(--accent))}
  .lib-fact.is-warn{background:color-mix(in srgb,var(--warn) 10%,var(--bg2));
    border-color:color-mix(in srgb,var(--warn) 30%,transparent)}
  .lib-fact.is-warn svg{color:var(--warn)}

  /* Sections repliables : le technique reste là, mais ne saute pas au visage */
  .lib-fold{border:1px solid var(--line2);border-radius:var(--radius);margin-bottom:var(--sp-12);
    background:var(--card);overflow:hidden}
  .lib-fold>summary{list-style:none;cursor:pointer;padding:var(--sp-14) var(--sp-16);
    display:flex;align-items:center;gap:var(--sp-10);font-size:var(--fs-md);font-weight:var(--fw-strong);color:var(--fg)}
  .lib-fold>summary::-webkit-details-marker{display:none}
  .lib-fold>summary:hover{background:var(--bg2)}
  .lib-fold-chev{margin-left:auto;color:var(--mut);display:inline-flex;transition:transform .16s}
  .lib-fold-chev svg{width:15px;height:15px}
  .lib-fold[open] .lib-fold-chev{transform:rotate(90deg)}
  .lib-fold-sub{font-weight:var(--fw-regular);color:var(--mut);font-size:var(--fs-xs)}
  .lib-fold-body{padding:var(--sp-2) var(--sp-16) var(--sp-18)}
  .lib-fold-body>.lib-detail-section-title:first-child{margin-top:0}
  @media (prefers-reduced-motion:reduce){ .lib-fold-chev{transition:none} }

  /* Phrase d'intro sous un titre de section : elle dit en langage courant
     ce qu'on va lire, pour que personne n'arrive nu devant une liste. */
  .lib-sec-intro{font-size:var(--fs-sm);color:var(--mut);line-height:1.6;margin:-6px 0 13px;max-width:70ch}

  /* ── Fiche framework : rendu NATIF (pas d'iframe) ─────────────────────
     La doc d'un framework est une page distante : l'incruster affiche le
     chrome d'un navigateur dans un panneau de réglages, avec un thème et
     une typographie étrangers. On rend nous-mêmes ce qu'on connaît. ── */

  /* Palette : les couleurs se jugent à l'œil, en grand, avec leur valeur */
  .fw-pal{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:var(--sp-10);margin-bottom:var(--sp-6)}
  .fw-pal-item{border:1px solid var(--line2);border-radius:var(--radius);overflow:hidden;background:var(--card)}
  .fw-pal-chip{height:56px;position:relative}
  /* Damier : sans lui, une couleur transparente paraît blanche. */
  .fw-pal-chip::after{content:'';position:absolute;inset:0;
    background-image:linear-gradient(45deg,rgba(0,0,0,.05) 25%,transparent 25%),
      linear-gradient(-45deg,rgba(0,0,0,.05) 25%,transparent 25%);
    background-size:10px 10px;z-index:-1}
  .fw-pal-meta{padding:var(--sp-8) var(--sp-10)}
  .fw-pal-name{font-size:var(--fs-xs);font-weight:var(--fw-strong);color:var(--fg);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fw-pal-val{font-size:var(--fs-2xs);color:var(--mut);font-family:var(--font-mono);margin-top:var(--sp-2)}
  .fw-pal-item.is-copy{cursor:pointer}
  .fw-pal-item.is-copy:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--line2))}

  /* Composants groupés par famille */
  .fw-fam{margin-bottom:var(--sp-18)}
  .fw-fam-h{display:flex;align-items:baseline;gap:var(--sp-8);margin-bottom:var(--sp-8)}
  .fw-fam-n{font-size:var(--fs-md);font-weight:var(--fw-bold);color:var(--fg)}
  .fw-fam-c{font-size:var(--fs-xs);color:var(--mut)}
  .fw-comps{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:var(--sp-10)}
  .fw-comp{background:var(--card);border:1px solid var(--line2);border-radius:var(--radius);padding:var(--sp-12) var(--sp-14)}
  .fw-comp-n{font-size:var(--fs-sm);font-weight:var(--fw-strong);color:var(--fg);margin-bottom:var(--sp-4);
    display:flex;align-items:center;gap:var(--sp-6)}
  .fw-comp-n::before{content:'';width:7px;height:7px;border-radius:var(--radius-xs);flex:none;
    background:var(--lc,var(--accent))}
  .fw-comp-d{font-size:var(--fs-sm);color:var(--mut);line-height:1.55}
  .fw-comp-vars{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-8)}
  .fw-comp-var{font-size:var(--fs-2xs);font-weight:var(--fw-strong);padding:var(--sp-2) var(--sp-6);border-radius:var(--radius-sm);
    background:var(--bg2);border:1px solid var(--line2);color:var(--mut)}

  /* Tokens : arrondis, ombres et typo se MONTRENT, ils ne se listent pas */
  .fw-tok{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:var(--sp-10)}
  .fw-tok-item{background:var(--card);border:1px solid var(--line2);border-radius:var(--radius);
    padding:var(--sp-12);text-align:center}
  .fw-tok-demo{height:52px;display:flex;align-items:center;justify-content:center;margin-bottom:var(--sp-8)}
  .fw-tok-box{width:56px;height:44px;background:color-mix(in srgb,var(--lc,var(--accent)) 22%,var(--bg2));
    border:1px solid color-mix(in srgb,var(--lc,var(--accent)) 40%,transparent)}
  .fw-tok-n{font-size:var(--fs-xs);font-weight:var(--fw-strong);color:var(--fg)}
  .fw-tok-v{font-size:var(--fs-2xs);color:var(--mut);font-family:var(--font-mono);margin-top:var(--sp-2);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fw-type-demo{background:var(--card);border:1px solid var(--line2);border-radius:var(--radius);padding:var(--sp-16) var(--sp-18)}
  .fw-type-line{color:var(--fg);line-height:1.25;margin-bottom:var(--sp-6)}
  .fw-type-meta{font-size:var(--fs-xs);color:var(--mut);font-family:var(--font-mono)}


  /* Section de composants et ses variantes réelles */
  .fw-sec{border:1px solid var(--line2);border-radius:var(--radius);background:var(--card);
    padding:var(--sp-14) var(--sp-14);margin-bottom:var(--sp-10)}
  .fw-sec-h{display:flex;align-items:baseline;gap:var(--sp-8);margin-bottom:var(--sp-4)}
  .fw-sec-n{font-size:var(--fs-md);font-weight:var(--fw-bold);color:var(--fg)}
  .fw-sec-c{font-size:var(--fs-xs);color:var(--mut)}
  .fw-sec-d{font-size:var(--fs-sm);color:var(--mut);line-height:1.55;margin-bottom:var(--sp-10);max-width:78ch}
  .fw-sec-none{font-size:var(--fs-sm);color:var(--mut);font-style:italic}

  .fw-vars{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:var(--sp-10)}
  .fw-var{border:1px solid var(--line2);border-radius:var(--radius);overflow:hidden;background:var(--bg2)}
  .fw-var-h{display:flex;align-items:baseline;gap:var(--sp-8);padding:var(--sp-8) var(--sp-10);flex-wrap:wrap}
  .fw-var-l{font-size:var(--fs-xs);font-weight:var(--fw-strong);color:var(--fg)}
  .fw-var-notes{font-size:var(--fs-2xs);color:var(--mut);font-family:var(--font-mono);
    background:var(--card);border:1px solid var(--line2);border-radius:var(--radius-sm);padding:var(--sp-1) var(--sp-4)}
  /* La scène porte un fond CLAIR quel que soit le thème de l'app : les
     composants d'un framework sont dessinés pour leur propre fond, pas pour
     le nôtre. Les afficher sur du sombre les rendrait illisibles. */
  /* La hauteur suit le composant. L'ascenseur n'apparaît que sur les rares
     variantes réellement hautes (grille de cartes), marquées par la mesure. */
  .fw-var-stage{background:var(--paper);padding:var(--sp-16);border-top:1px solid var(--line2);
    overflow:visible}
  .fw-var[data-h="scroll"] .fw-var-stage{overflow:auto;max-height:460px}

  /* Le nombre de colonnes qu'occupe chaque variante est calculé après montage
     (libFwFitPreviews) d'après sa largeur naturelle ET la grille réellement
     résolue — une media query sur la fenêtre se tromperait, la fiche pouvant
     être étroite dans un grand écran. Reste ici le cas des composants qui
     débordent même à pleine largeur : ils défilent, ils ne sont pas coupés. */
  .fw-var[data-w="scroll-x"] .fw-var-stage{overflow-x:auto}

  /* Variante dont le balisage appelle des classes absentes de la feuille :
     l'aperçu est fidèle, c'est le framework qui est incomplet. */
  .fw-var.is-incomplete{border-color:color-mix(in srgb,var(--warn) 45%,var(--line2))}
  .fw-var-warn{display:flex;align-items:center;gap:var(--sp-6);padding:var(--sp-6) var(--sp-10);
    font-size:var(--fs-xs);line-height:1.4;color:var(--warn);
    background:color-mix(in srgb,var(--warn) 12%,transparent);
    border-top:1px solid color-mix(in srgb,var(--warn) 28%,transparent);cursor:help}
  .fw-var-warn svg{width:13px;height:13px;flex:0 0 auto}

  /* ── Couche d'interactions du framework ── */
  .fw-js{border:1px solid var(--line2);border-radius:var(--radius);background:var(--card);
    padding:var(--sp-14) var(--sp-14)}
  .fw-js-api{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin-bottom:var(--sp-12)}
  .fw-js-fn{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--fg);
    background:var(--bg2);border:1px solid var(--line2);border-radius:var(--radius-sm);padding:var(--sp-2) var(--sp-8)}
  .fw-js-foot{display:flex;align-items:center;gap:var(--sp-12);flex-wrap:wrap}
  .fw-js-files{font-size:var(--fs-xs);color:var(--mut);font-family:var(--font-mono)}

  .fw-var-stage.on-navy{background:#16235e}
  .fw-var-stage.on-dark{background:#111}

  /* ── Palette modifiable ── */
  .fw-pal-bar{display:flex;align-items:center;gap:var(--sp-8);flex-wrap:wrap;margin-bottom:var(--sp-10)}
  .fw-pal-item.is-edit{cursor:pointer;position:relative}
  .fw-pal-item.is-edit .fw-pal-chip::before{content:'';position:absolute;inset:0;
    background:rgba(0,0,0,.28);opacity:0;transition:opacity .12s;
    display:flex;align-items:center;justify-content:center}
  .fw-pal-item.is-edit:hover .fw-pal-chip::before{opacity:1}
  .fw-pal-item.is-edit:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line2))}
  .fw-pal-item.is-dirty{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 22%,transparent)}

  .fw-pal-state{font-size:var(--fs-xs);color:var(--accent);font-weight:var(--fw-strong)}

  /* Batteries de palettes proposées en exemple */
  .fw-sets{display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:var(--sp-10);margin-bottom:var(--sp-6)}
  .fw-set{border:1px solid var(--line2);border-radius:var(--radius);padding:var(--sp-10) var(--sp-12);background:var(--card);
    cursor:pointer;text-align:left;transition:border-color .12s,transform .08s}
  .fw-set:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line2));transform:translateY(-1px)}
  /* Les enfants sont des <span> dans un <button> : sans display explicite ils
     restent en ligne et le bandeau de couleurs disparaît. */
  .fw-set-strip{display:flex;height:26px;border-radius:var(--radius-sm);overflow:hidden;margin-bottom:var(--sp-8);width:100%}
  .fw-set-strip i{flex:1 1 0;min-width:0}
  .fw-set-n{display:block;font-size:var(--fs-sm);font-weight:var(--fw-strong);color:var(--fg)}
  .fw-set-d{display:block;font-size:var(--fs-xs);color:var(--mut);margin-top:var(--sp-2);line-height:1.45}

  /* Bloc de code « mise en route » */
  .lib-code-wrap{position:relative}
  .lib-code{margin:0;background:var(--bg2);border:1px solid var(--line2);border-radius:var(--radius);
    padding:var(--sp-14) var(--sp-16);overflow:auto;font-size:var(--fs-sm);line-height:1.6;
    font-family:var(--font-mono);color:var(--fg)}
  .lib-code code{font-family:inherit;white-space:pre}
  .lib-code-copy{position:absolute;top:8px;right:8px;display:inline-flex;align-items:center;gap:var(--sp-4);
    font-size:var(--fs-xs);font-weight:var(--fw-strong);padding:var(--sp-4) var(--sp-10);border-radius:var(--radius-sm);cursor:pointer;
    border:1px solid var(--line2);background:var(--card);color:var(--mut);transition:color .1s,border-color .1s}
  .lib-code-copy:hover{color:var(--fg);border-color:color-mix(in srgb,var(--accent) 40%,var(--line2))}
  .lib-code-copy svg{width:12px;height:12px}
  /* Mots-clés (tags) en pied de fiche */
  .lib-detail-keywords{margin-top:var(--sp-22)}
  /* La recherche de la boutique (un seul rayonnage depuis le 2026-10-10 : plus d'onglets). */
  .lib-store .lib-nav{margin:0 0 var(--sp-22)}
  .lib-store .lib-search-wrap{max-width:440px;margin:0 0 var(--sp-12)}
  .lib-store .lib-search{border-radius:var(--radius-pill);padding-top:var(--sp-6);padding-bottom:var(--sp-6);font-size:var(--fs-sm)}
  @media(max-width:640px){ .lib-store .lib-search-wrap{max-width:none} }

  /* ── Polices - navigateur (vue secondaire) ── */
  /* ── Polices - détail police ── */

  /* ── Intégrations & SDKs ── */
  /* Hébergement local - layout deux colonnes */
  .lib-local-box{margin-top:var(--sp-4);padding:var(--sp-18) var(--sp-20);
    background:var(--bg2);border-radius:var(--radius);border:1px solid var(--line2);
    display:flex;align-items:center;gap:var(--sp-20)}
  .lib-local-info{flex:1;min-width:0}
  .lib-local-desc{font-size:var(--fs-md);color:var(--mut);margin:0;line-height:var(--lh-normal)}
  .lib-local-btn{flex:none;display:inline-flex;align-items:center;gap:var(--sp-6);padding:var(--sp-10) var(--sp-18);
    border:1px solid var(--line2);border-radius:var(--radius);background:var(--card);
    font-size:var(--fs-md);font-weight:var(--fw-strong);color:var(--fg);cursor:pointer;white-space:nowrap;
    transition:border-color .12s,color .12s}
  .lib-local-btn:hover{border-color:var(--accent);color:var(--accent)}
  .lib-local-btn:disabled{opacity:.45;cursor:not-allowed}
  /* Code blocks - style éditeur sombre */
  /* Commandes npm/composer - même style éditeur */
  /* Variables d'env */

  /* ── Stats trafic ── */
  .em-stats{padding:var(--sp-14)}
  .em-stats-empty{text-align:center;padding:var(--sp-32) var(--sp-20);color:var(--mut);display:flex;flex-direction:column;align-items:center;gap:var(--sp-8)}
  .em-stats-empty-icon{font-size:var(--fs-3xl);color:var(--mut)} .em-stats-empty-icon svg.ic{width:36px;height:36px}
  .em-stats-empty p{font-size:var(--fs-md);line-height:var(--lh-normal);max-width:360px}
  .em-stats-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-8);margin-bottom:var(--sp-16)}
  @media(max-width:640px){.em-stats-kpis{grid-template-columns:1fr 1fr}}
  .em-stats-kpi{background:var(--card2);border:1px solid var(--line2);border-radius:var(--radius-sm);padding:var(--sp-10) var(--sp-12)}
  .em-hv-warn .em-hv{color:var(--err)}
  .em-stats-chart{margin-bottom:var(--sp-16)}
  .em-stats-chart-title{font-size:var(--fs-xs);font-weight:var(--fw-strong);text-transform:uppercase;letter-spacing:.06em;
    color:var(--mut);margin-bottom:var(--sp-10)}
  .stat-bars{display:flex;align-items:flex-end;gap:var(--sp-4);height:90px;padding:0 var(--sp-2)}
  .stat-bar-wrap{display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);flex:1}
  .stat-bar{background:var(--accent);border-radius:var(--radius-xs) var(--radius-xs) 0 0;width:100%;min-height:3px;
    opacity:.8;transition:opacity .15s}
  .stat-bar-wrap:hover .stat-bar{opacity:1}
  .stat-bar-l{font-size:var(--fs-2xs);color:var(--mut);font-variant-numeric:tabular-nums}
  .em-stats-section{margin-bottom:var(--sp-14)}
  .em-stats-section-title{font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.06em;
    color:var(--mut);margin-bottom:var(--sp-8)}
  .stat-table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
  .stat-table th{text-align:left;font-size:var(--fs-2xs);font-weight:var(--fw-bold);text-transform:uppercase;
    letter-spacing:.06em;color:var(--mut);padding:var(--sp-4) var(--sp-6);border-bottom:1px solid var(--line)}
  .stat-table td{padding:var(--sp-4) var(--sp-6);border-bottom:1px solid var(--line2)}
  .st-rank{color:var(--mut);font-size:var(--fs-xs);width:24px}
  .st-path{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--fs-sm)}
  .st-n{text-align:right;font-variant-numeric:tabular-nums;color:var(--txt)}
  .st-pct{width:80px}.st-pct-bar{height:4px;background:var(--line2);border-radius:var(--radius-xs)}
  .st-pct-bar>div{height:100%;background:var(--accent);border-radius:var(--radius-xs);opacity:.7}
  .stat-refs{display:flex;flex-direction:column;gap:var(--sp-4)}
  .stat-ref{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-4) var(--sp-8);
    background:var(--bg2);border-radius:var(--radius-sm);font-size:var(--fs-sm)}
  .stat-ref-src{color:var(--txt);font-weight:var(--fw-medium)}
  .stat-ref-n{color:var(--mut);font-variant-numeric:tabular-nums}
  .stat-codes{display:flex;gap:var(--sp-8);flex-wrap:wrap}
  .stat-code{padding:var(--sp-6) var(--sp-12);border-radius:var(--radius);border:1px solid var(--line);background:var(--bg2);
    font-size:var(--fs-sm);display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);min-width:64px}
  .stat-code.ok{border-color:color-mix(in srgb,var(--ok) 35%,var(--line));background:color-mix(in srgb,var(--ok) 8%,var(--bg2))}
  .stat-code.err{border-color:color-mix(in srgb,var(--err) 35%,var(--line));background:color-mix(in srgb,var(--err) 8%,var(--bg2))}
  .stat-code.warn{border-color:color-mix(in srgb,var(--warn) 35%,var(--line));background:color-mix(in srgb,var(--warn) 8%,var(--bg2))}
  .stat-code-v{font-size:var(--fs-base);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums}
  .stat-code-n{font-size:var(--fs-xs);color:var(--mut)}
  .em-stats-footer{display:flex;align-items:center;gap:var(--sp-12);margin-top:var(--sp-8);padding-top:var(--sp-8);border-top:1px solid var(--line2)}
  @media(max-width:640px){
    #modal.settings .modal-card{width:calc(100vw - 24px)}
    .set-layout{flex-direction:column;min-height:0}
    .set-nav{flex-direction:row;width:auto;overflow-x:auto;border-right:none;border-bottom:1px solid var(--line)}
    .set-nav-item{white-space:nowrap}
    .set-pane{max-height:none}
  }

  /* ── Écran de connexion (verrou du poste, un seul compte local) ──
     Superposé à toute l'appli (z-index au-dessus du header fixe), retiré du
     DOM dès l'identifiant validé - cf. le script inline dans index.php.
     La marque reprend TEL QUEL le logo de l'en-tête (.brand-mark.bic, système
     solaire animé de 09-ai.css - mêmes id de dégradé #dh-pilot-grad/-orb) :
     pas un pictogramme générique, le même signe qu'ailleurs dans l'appli. */
  .dh-login{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;
    background:var(--bg);padding:var(--sp-24);overflow:hidden}
  /* Halo doux derrière la carte : un dégradé radial de l'accent, posé une fois,
     pas une pastille pleine - la couleur reste rare, juste assez pour ancrer
     la marque au centre d'un fond qui, sinon, serait entièrement plat. */
  .dh-login::before{content:'';position:absolute;top:50%;left:50%;width:640px;height:640px;
    transform:translate(-50%,-58%);border-radius:50%;pointer-events:none;
    background:radial-gradient(circle,color-mix(in srgb,var(--accent) 13%,transparent),transparent 70%)}
  .dh-login-card{position:relative;width:100%;max-width:360px;display:flex;flex-direction:column;align-items:center;
    text-align:center;gap:var(--sp-4);
    background:var(--card);border:1px solid var(--line);border-radius:calc(var(--radius-modal) + 8px);
    padding:var(--sp-32) var(--sp-28)}
  .dh-login-mark{width:52px;height:52px;display:grid;place-items:center;margin-bottom:var(--sp-14)}
  .dh-login-mark .bic{width:52px;height:52px}
  .dh-login-title{margin:0;font-size:var(--fs-2xl);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight)}
  .dh-login-title span{color:var(--accent)}
  .dh-login-sub{margin:0 0 var(--sp-24);color:var(--mut);font-size:var(--fs-md)}
  .dh-login-card .field{width:100%;text-align:left;margin-bottom:var(--sp-12)}
  .dh-login-err{width:100%;margin:0 0 var(--sp-10);font-size:var(--fs-sm);color:var(--err);text-align:left}
  /* L'œil du mot de passe (2026-10-25) : posé dans le champ, à droite ; le champ lui laisse la place. */
  .dh-login-mdp{position:relative}
  .dh-login-mdp input{width:100%;padding-inline-end:var(--sp-36)}
  .dh-login-oeil{position:absolute;inset-inline-end:var(--sp-4);top:50%;transform:translateY(-50%);width:30px;height:30px;padding:0;
    display:grid;place-items:center;border:0;background:transparent;color:var(--mut2);cursor:pointer;border-radius:var(--radius-sm);box-shadow:none}
  .dh-login-oeil:hover{color:var(--txt);background:var(--line2)}
  .dh-login-oeil:focus-visible{outline:none;box-shadow:var(--focus)}
  .dh-login-oeil svg{width:17px;height:17px}
  .dh-login-oeil .oeil-barre,.dh-login-oeil[aria-pressed="true"] .oeil-ouvert{display:none}
  .dh-login-oeil[aria-pressed="true"] .oeil-barre{display:block}
  /* La connexion rapide de l'app de bureau (2026-10-25) : le compte de l'appareil en une ligne-bouton, l'autre compte en lien,
     la confiance et l'oubli en petit dessous. « Rester connecté » : une case sous le mot de passe. */
  .dh-memo-compte{display:flex;align-items:center;gap:var(--sp-12);width:100%;padding:var(--sp-12) var(--sp-14);text-align:start;
    border:1px solid var(--line);border-radius:var(--radius);background:var(--card);color:var(--txt);cursor:pointer;font:inherit;box-shadow:none}
  .dh-memo-compte:hover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 5%,var(--card))}
  .dh-memo-compte:focus-visible{outline:none;box-shadow:var(--focus)}
  .dh-memo-av{flex:none;width:36px;height:36px;border-radius:var(--radius-pill);display:grid;place-items:center;
    background:var(--accent);color:var(--on-solid);font-weight:var(--fw-strong)}
  .dh-memo-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--sp-2)}
  .dh-memo-tx strong{font-size:var(--fs-md);font-weight:var(--fw-strong)}
  .dh-memo-tx span{font-size:var(--fs-sm);color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .dh-memo-go{flex:none;width:16px;height:16px;color:var(--mut2)}
  .dh-memo-autre{display:block;width:100%;margin-top:var(--sp-12);text-align:center;font-size:var(--fs-sm);color:var(--accent);text-decoration:none}
  .dh-memo-autre:hover{text-decoration:underline}
  .dh-memo-confiance{width:100%;margin:var(--sp-18) 0 0;font-size:var(--fs-xs);color:var(--mut2);text-align:center;line-height:1.6}
  .dh-memo-retirer{display:block;margin:var(--sp-4) auto 0;padding:0;border:0;background:none;color:var(--mut);font:inherit;font-size:var(--fs-xs);
    cursor:pointer;text-decoration:underline;box-shadow:none}
  .dh-memo-retirer:hover{color:var(--err);background:none}
  .dh-login-rester{display:flex;align-items:center;gap:var(--sp-8);width:100%;margin:0 0 var(--sp-12);font-size:var(--fs-sm);color:var(--txt);cursor:pointer}
  .dh-login-rester input{accent-color:var(--accent);width:15px;height:15px;margin:0}
  .dh-login-rester-d{color:var(--mut2)}
  .dh-login-btn{width:100%;margin-top:var(--sp-6);height:40px;justify-content:center;font-weight:var(--fw-strong)}
  /* Écran de connexion : le lien secondaire sous le bouton (mot de passe oublié,
     abandon du second facteur). Discret, mais pas illisible. */
  .dh-login-alt{width:100%;margin:var(--sp-14) 0 0;font-size:var(--fs-sm);color:var(--mut);text-align:center;line-height:1.5}
  .dh-login-alt a{color:var(--accent);text-decoration:none}
  .dh-login-alt a:hover{text-decoration:underline}
  /* Codes de secours : montrés une seule fois, donc lisibles sans effort. */
  .sec-2fa-codes{font-family:var(--mono);font-size:var(--fs-md);line-height:1.9;letter-spacing:.06em;
    margin:var(--sp-12) 0;padding:var(--sp-12);background:var(--card);border-radius:var(--r-md);
    border:1px solid var(--bd);user-select:all}
  @media(max-width:420px){ .dh-login-card{padding:var(--sp-24) var(--sp-20)} }

  /* ══ Librairie en boutique d'apps (2026-10-07) ══
     Recherche, onglets (la barre sur une ligne vit dans 17-settings.css), puis des étagères
     de tuiles. Une tuile = icône pleine (glyphe blanc sur la couleur du moteur, --lc), nom,
     une ligne de description, une ligne de méta, bouton « Voir ». La grille se règle sur la
     largeur réelle du panneau (auto-fill), jamais sur la fenêtre : les Paramètres peuvent
     être étroits dans un grand écran. Aucune valeur en dur (cliquets de da_test) : les
     teintes claire et sombre de l'icône dérivent de --lc en oklch relatif, pas d'un
     mélange avec un blanc ou un noir écrit ici. */
  .lib-search-empty{padding:var(--sp-24) 0;color:var(--mut);font-size:var(--fs-sm);text-align:center}

  .lib-shelf-head{display:flex;align-items:baseline;gap:var(--sp-8);margin:0 0 var(--sp-10)}
  .lib-shelf-title{margin:0;font-size:var(--fs-lg);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);color:var(--txt)}
  .lib-shelf-lead{margin:0 0 var(--sp-14);color:var(--mut);font-size:var(--fs-sm);max-width:620px;line-height:var(--lh-normal)}
  .lib-shelf{margin:0 0 var(--sp-28)}
  .lib-see-all{border:0;background:transparent;color:var(--accent);font:inherit;font-size:var(--fs-sm);
    font-weight:var(--fw-medium);cursor:pointer;padding:0}
  .lib-see-all:hover{text-decoration:underline}
  .lib-ray-grp{margin:0 0 var(--sp-24)}
  .lib-ray-title{margin:0 0 var(--sp-6);font-size:var(--fs-md);font-weight:var(--fw-bold);color:var(--txt)}

  .lib-tile-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));column-gap:var(--sp-24)}
  .lib-tile{display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-10) var(--sp-6);
    border-bottom:1px solid var(--line2);border-radius:var(--radius-xs);min-width:0;outline:none;
    transition:background .12s}
  .lib-tile[role=button]{cursor:pointer}
  .lib-tile[role=button]:hover{background:var(--hover)}
  .lib-tile[role=button]:focus-visible{box-shadow:var(--focus)}
  .lib-tile-ic{flex:none;width:48px;height:48px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;
    color:var(--on-solid);background:var(--lc);
    background:linear-gradient(150deg,oklch(from var(--lc) calc(l + .1) c h) 0%,var(--lc) 55%,oklch(from var(--lc) calc(l - .08) c h) 100%)}
  .lib-tile-ic svg{width:24px;height:24px}
  .lib-tile-txt{flex:1;min-width:0}
  .lib-tile-nm{font-size:var(--fs-md);font-weight:var(--fw-strong);color:var(--txt);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .lib-tile-d{font-size:var(--fs-sm);color:var(--mut);line-height:var(--lh-snug);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .lib-tile-meta{display:flex;align-items:center;gap:var(--sp-6);margin-top:var(--sp-2);
    font-size:var(--fs-xs);color:var(--mut);white-space:nowrap;overflow:hidden}
  .lib-tile-meta .lib-badge{padding:0;margin:0}
  .lib-tile-meta .mono{font-family:var(--font-mono)}
  .lib-tile-btn{flex:none;padding:var(--sp-4) var(--sp-14);border-radius:var(--radius-pill);
    background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);
    font-size:var(--fs-xs);font-weight:var(--fw-bold);transition:background .12s,color .12s}
  .lib-tile[role=button]:hover .lib-tile-btn{background:var(--accent);color:var(--on-solid)}

  /* Corps : trois grandes cartes, l'icône en tête. */
  .lib-tile-big{flex-direction:column;align-items:flex-start;gap:var(--sp-10);padding:var(--sp-18);
    border:1px solid var(--line);border-radius:var(--radius);background:var(--bg2)}
  .lib-tile-big .lib-tile-ic{width:60px;height:60px;border-radius:var(--radius-modal)}
  .lib-tile-big .lib-tile-ic svg{width:28px;height:28px}
  .lib-tile-big .lib-tile-d{white-space:normal;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
  .lib-tile-big .lib-tile-txt{width:100%}
  .lib-tile-big .lib-tile-btn{align-self:flex-start}

  /* Puces de rayon (onglet Moteurs). */
  .lib-chips{display:flex;flex-wrap:wrap;gap:var(--sp-6);margin:0 0 var(--sp-20)}
  .lib-chip{border:1px solid var(--line);background:transparent;color:var(--txt);font:inherit;font-size:var(--fs-sm);
    padding:var(--sp-4) var(--sp-12);border-radius:var(--radius-pill);cursor:pointer;transition:background .12s,border-color .12s}
  .lib-chip span{color:var(--mut);margin-left:var(--sp-2);font-variant-numeric:tabular-nums}
  .lib-chip:hover{background:var(--hover)}
  .lib-chip.on{background:var(--txt);border-color:var(--txt);color:var(--bg)}
  .lib-chip.on span{color:inherit;opacity:.7}

  @media(max-width:640px){ .lib-store .lib-search-wrap{max-width:none} }

  /* Fiche d'un moteur : la même icône pleine que sa tuile, en grand. */
  .lib-detail-hero-app{background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:var(--sp-4) 0 var(--sp-22)}
  .lib-detail-appicon{width:88px;height:88px;border-radius:calc(var(--radius) * 2)}
  .lib-detail-appicon svg{width:40px;height:40px}
  .lib-detail-id{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--mut)}
}

/* ══ Squelettes de chargement (2026-10-25, le proprio : « des skeletons shimmer minimalistes, propres, fidèles au contenu qui
   sera chargé ») ══ Une pièce .sq (barre, pastille, icône) prend la place d'un texte ou d'une image ; le reflet passe de gauche à
   droite. Les formes (.sq-grp, .sq-row…) se composent par écran, à l'image de ce qu'elles annoncent. Mouvement réduit : immobile. */
.sq{display:block;flex:none;height:8px;border-radius:var(--radius-pill);
  background:linear-gradient(90deg,var(--line2) 0%,var(--line2) 35%,color-mix(in srgb,var(--line2) 40%,var(--card)) 50%,var(--line2) 65%,var(--line2) 100%);
  background-size:300vw 100%;background-attachment:fixed;animation:sq-reflet 1.6s ease-in-out var(--sqk-phase,0s) infinite}
/* Même rythme partout (CDC_SQUELETTES Q0, 2026-10-28) : le reflet est fixé à l'écran (300vw et non 300 % de la pièce : une
   seule lumière balaie toutes les pièces, une icône au même pas qu'une ligne pleine largeur ; jusque-là chaque pièce avait la
   sienne, à sa vitesse) et chaque squelette reprend la phase de l'horloge de la page (--sqk-phase, posée par dhSq et
   dhSqPhase) : la fenêtre qui s'ouvre et le module qui la remplace battent ensemble, l'œil ne voit pas la relève.
   1.6s = SQ_PERIODE (33-modalx.js). */
.sq-ic{width:28px;height:28px;border-radius:var(--radius-sm)}
.sq-l{height:8px}
.sq-grp{display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-10) var(--sp-12);border:.5px solid var(--line);border-bottom:0;
  border-radius:var(--radius) var(--radius) 0 0;background:var(--card)}
.sq-row{display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-10) var(--sp-12) var(--sp-10) calc(var(--sp-12) + 40px);
  border:.5px solid var(--line);border-radius:0 0 var(--radius) var(--radius);background:var(--card);margin-bottom:var(--sp-8)}
/* Le squelette d'un onglet de dossier (index.php, 2026-11-01) : les mesures sont celles du dossier rendu (.studio-body, .snav,
   tuiles du Studio deux par ligne, lignes d'environnement, cartes d'applications au quart). */
.sqk-dossier .sqk-dos-retour{display:flex;align-items:center;height:30px}
.sqk-dossier .studio-head{margin-bottom:var(--sp-18)}
.sqk-dossier .sh-ligne{display:flex;align-items:center;gap:var(--sp-12)}
.sqk-dossier .sh-txt{gap:var(--sp-8)}
.sqk-dos-ic{width:40px;height:40px;border-radius:var(--radius)}
.sqk-dos-nom{width:min(220px,50%);height:14px}
.sqk-dos-nav{display:flex;flex-direction:column;gap:var(--sp-14);padding:var(--sp-14) var(--sp-12)}
.sqk-dos-grp{margin-top:var(--sp-8)}
.sqk-dos-tuiles{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-16) var(--sp-8)}
.sqk-dos-tu{display:flex;align-items:center;gap:var(--sp-8);min-height:22px}
.sqk-dos-pic{width:16px;height:16px;border-radius:var(--radius-xs)}
.sqk-dos-sec{margin:var(--sp-4) 0 var(--sp-12)}
.sqk-dossier .tabpane > .sqk-cadre{margin-bottom:var(--sp-22)}
.sqk-dossier .tabpane > .sqk-cadre .sqk-li{min-height:44px}
.sqk-dos-tag{width:58px;height:16px;border-radius:var(--radius-sm)}
.sqk-dos-cartes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-12)}
.sqk-dos-cartes .sqk-ca{aspect-ratio:1;min-height:200px;gap:var(--sp-14)}
@media (max-width:900px){ .sqk-dos-cartes{grid-template-columns:repeat(2,minmax(0,1fr))} }
/* Les cartes de la Vue d'ensemble en attente (12-studio.js, ovwSquelette) : la forme de ce qu'elles montreront. */
.ovw-sq{display:flex;flex-direction:column;gap:var(--sp-10);padding:var(--sp-2) 0}
.ovw-sq-li{display:flex;align-items:center;gap:var(--sp-8);min-height:24px}
.ovw-sq-li .sq-ic{width:24px;height:24px}
.ovw-sq-tuiles{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6)}
.ovw-sq-tuile{display:flex;flex-direction:column;gap:var(--sp-6);padding:var(--sp-6) var(--sp-8);border-radius:var(--radius-sm);background:var(--card2)}
.ovw-sq-tuile .sq:first-child{width:22px;height:14px}
/* La vignette d'un fichier Figma (carte de la Vue d'ensemble, 2026-11-02) : à la hauteur de l'image qu'elle attend. Ici et
   non dans 04-studio.css : les pièces .sq sont hors couche, une règle de la couche modules ne les bat pas. */
.ovw-fig-vi{display:block;flex:none;width:100%;height:56px;border-radius:0}
.ovw-sq-vi{width:100%;height:56px;border-radius:0}
.ovw-sq-figt{cursor:default}
.ovw-sq-importer{width:84px;height:24px;border-radius:var(--radius-xs)}
.ovw-sq-vide{align-items:center;justify-content:center;gap:var(--sp-8);height:100%}
.ovw-sq-visuel{width:76px;height:58px;border-radius:var(--radius)}
.ovw-sq-bouton{width:120px;height:28px;border-radius:var(--radius-sm);margin-top:var(--sp-6)}
@keyframes sq-reflet{0%{background-position:100% 0}100%{background-position:0 0}}
@media (prefers-reduced-motion:reduce){ .sq{animation:none} }

/* Le jeu de formes de dhSq (33-modalx.js), une par sorte de contenu. Le cadre reprend celui des listes de l'atelier : une bordure
   0,5 px qui englobe, un trait entre les lignes. */
.sqk{display:flex;flex-direction:column;gap:var(--sp-10)}
.sqk .sq-s{height:6px}
.sqk-li{display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-6) 0}
.sqk-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--sp-6)}
.sqk-cadre{gap:0;border:.5px solid var(--line);border-radius:var(--radius);background:var(--card)}
.sqk-cadre>.sqk-li,.sqk-cadre>.sqk-tr{padding:var(--sp-10) var(--sp-12)}
.sqk-cadre>:not(.sr-only)+:not(.sr-only){border-top:.5px solid var(--line)}
.sqk-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--sqk-tu,160px),1fr));gap:var(--sp-12)}
.sqk-tu{display:flex;flex-direction:column;gap:var(--sp-6)}
.sqk-vi{width:100%;height:var(--sqk-vi,96px);border-radius:var(--radius-sm);margin-bottom:var(--sp-4)}
.sqk-cartes{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--sqk-ca,220px),1fr));gap:var(--sp-12)}
.sqk-ca{display:flex;flex-direction:column;gap:var(--sp-8);padding:var(--sp-12);border:.5px solid var(--line);border-radius:var(--radius);background:var(--card)}
.sqk-texte{gap:var(--sp-8)}
.sqk-formulaire{gap:var(--sp-14)}
.sqk-ch{display:flex;flex-direction:column;gap:var(--sp-6)}
.sqk-champ{width:100%;height:32px;border-radius:var(--radius-sm)}
.sqk-tableau{gap:0}
.sqk-tr{display:grid;grid-template-columns:repeat(var(--sqk-cols,4),1fr);gap:var(--sp-12);padding:var(--sp-8) 0}
.sqk-th{border-bottom:.5px solid var(--line)}
.sqk-bu{display:flex;flex-direction:column;gap:var(--sp-6);width:min(70%,420px);padding:var(--sp-10) var(--sp-12);border:.5px solid var(--line);border-radius:var(--radius)}
.sqk-bu-d{align-self:flex-end}
.sqk-vu{width:100%;height:var(--sqk-h,240px);border-radius:var(--radius)}
.sqk-statut{display:inline-flex;align-items:center;gap:var(--sp-6);vertical-align:middle}
.sqk-pt{width:8px;height:8px}
/* Formes du 2026-10-28 (CDC_SQUELETTES Q0) : chiffres (tuiles d'indicateur), mois (grille de calendrier), page (feuille de
   document), barre (rangée d'outils), et la silhouette d'une app du Studio (editeur : menus, outils, corps). */
.sqk-bord{gap:var(--sp-16)}
.sqk-chiffres{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--sqk-ca,140px),1fr));gap:var(--sp-12)}
.sqk-ki{display:flex;flex-direction:column;gap:var(--sp-8);padding:var(--sp-12);border:.5px solid var(--line);border-radius:var(--radius);background:var(--card)}
.sqk-nb{height:18px;border-radius:var(--radius-sm)}
.sqk-mois{display:grid;grid-template-columns:repeat(7,1fr);gap:0;border:.5px solid var(--line);border-radius:var(--radius);background:var(--card);overflow:hidden}
.sqk-js{padding:var(--sp-8) var(--sp-10);border-bottom:.5px solid var(--line)}
.sqk-jo{display:flex;flex-direction:column;gap:var(--sp-8);min-height:var(--sqk-h,72px);padding:var(--sp-8) var(--sp-10);border-top:.5px solid var(--line2)}
.sqk-jo:not(:nth-child(7n+1)){border-left:.5px solid var(--line2)}
.sqk-feuille{display:flex;flex-direction:column;gap:var(--sp-10);width:min(100%,720px);margin:0 auto;padding:var(--sp-32) var(--sp-40);
  border:.5px solid var(--line);border-radius:var(--radius-sm);background:var(--card)}
.sqk-feuille>.sq-l:first-child{height:14px;margin-bottom:var(--sp-8)}
.sqk-barre{display:flex;align-items:center;gap:var(--sp-6);flex:none;min-width:0;overflow:hidden;padding:var(--sp-6) var(--sp-10)}
.sqk-ou{width:22px;height:22px;border-radius:var(--radius-sm)}
.sqk-menus .sqk-ou{width:44px;height:8px;border-radius:var(--radius-pill)}
.sqk-sep{flex:none;width:.5px;height:18px;margin:0 var(--sp-4);background:var(--line)}
.sqk-avec-barre{gap:0}
.sqk-avec-barre>.sqk-barre{border-bottom:.5px solid var(--line);margin-bottom:var(--sp-12)}
/* La silhouette remplit la fenêtre plein écran de l'app (78-appwin.js), dont l'hôte n'a pas toujours de hauteur définie
   (la bibliothèque s'y intercale) : la hauteur de l'écran moins la barre de titre, le surplus caché. */
.sqk-editeur{gap:0;height:calc(100dvh - 64px);min-height:0;overflow:hidden;background:var(--bg)}
.sqk-ed-plat{padding:0 var(--sp-12)}
.sqk-ed-plat>.sqk-tableau{flex:1;min-height:0;overflow:hidden}
.sqk-ed-fond>.sqk-page{height:100%}
.sqk-ed-fond .sqk-feuille{min-height:100%}
.sqk-editeur>.sqk-barre{background:var(--card);border-bottom:.5px solid var(--line)}
.sqk-ed-corps{display:flex;flex:1;min-height:0;padding:var(--sp-12)}
.sqk-ed-corps>.sqk{flex:1;min-width:0}
.sqk-ed-col{flex-direction:column;gap:var(--sp-12)}
.sqk-ed-fond{overflow:hidden;padding:var(--sp-24)}
.sqk-ed-cotes{gap:var(--sp-12)}
.sqk-ed-cote{flex:none;width:200px;min-width:0}
.sqk-ed-cotes .sqk-apercu{display:flex}
.sqk-ed-cotes .sqk-vu,.sqk-ed-col>.sqk-apercu>.sqk-vu{height:100%}
.sqk-ed-col>.sqk-apercu{display:flex;flex:1}
.sqk-pistes{flex:none}
.sqk-pied{padding:0}
.sqk-pied .sqk-ou{width:72px;height:10px;border-radius:var(--radius-pill)}
.mx-loading.mx-sq{display:block;min-height:160px;padding:var(--sp-4) 0}
/* Les dix apps du Studio (VAGUE_UI_MODIF2 S1 à S3, 2026-11-04) : la silhouette remplit l'hôte comme l'écran, sans marge ; sous
   le bandeau, la racine de l'app (ses propres classes, ses jetons) prend la place restante. Elle reste unlayered comme le kit,
   et ne pose que ce qui fait tenir l'ossature : le reste vient des feuilles de l'app. */
.sqk-editeur.sqk-app{display:flex;flex-direction:column;gap:0;height:100%;min-height:0;overflow:hidden;background:var(--card)}
.sqk-app>.sqk-host,.sqk-app>.sqk-racine{flex:1 1 0;height:auto;min-height:0}
.ed-loading:has(>.sqk-app){height:100%;padding:0}
.sqk-app .sqk-menu{pointer-events:none}
.sqk-app .sqk-menu .sqk-ou,.sqk-app .sqk-pied-app .sqk-ou,.sqk-app .sqk-droite .sqk-ou,.sqk-app .sqk-tete .sqk-ou{height:10px;border-radius:var(--radius-pill)}
.sqk-app .sqk-droite{display:inline-flex;align-items:center;margin-inline-end:var(--sp-6)}
.sqk-app .sqk-outils .sqk-ou{width:22px;height:var(--outils-h,28px)}   /* les contrôles d'une rangée font --outils-h : la rangée a la même hauteur */
.sqk-app .sqk-onglets{align-items:center;gap:var(--sp-10);padding:0 var(--sp-10);height:var(--outils-h,28px)}
.sqk-app .sqk-formule{display:flex;align-items:center;gap:var(--sp-12)}
.sqk-app .sqk-formule :is(.sqk-ou,.sq-l){height:var(--outils-h,28px);border-radius:var(--radius-sm)}
.sqk-app .sqk-pied-app .sqk-pied-geste{flex:none}
.sqk-app .sqk-grille>.sqk-tableau{height:100%;overflow:hidden}
.sqk-app :is(.vid-scene,.cao-2d,.cao-3d,.gph-canvas-wrap,.cms-centre,.rv-stage)>.sqk-apercu{display:flex;height:100%}
.sqk-app :is(.vid-scene,.cao-2d,.cao-3d,.gph-canvas-wrap,.cms-centre,.rv-stage)>.sqk-apercu>.sqk-vu{height:100%;flex:1}

/* Survol sans fondu, PARTOUT (le proprio, 2026-11-02 : « transition 0s pour tous les éléments qui ont un hover, pour un effet
   réactif », d'abord dans la vue d'un dossier, puis « oui, partout ») : ce qui se clique ou se survole change de fond, de
   couleur ou de bordure aussitôt, avec ses icônes. Hors de la règle : les panneaux, fenêtres, toasts et interrupteurs (leur
   glissement ou leur fondu dit une arrivée, pas un survol), et les animations (squelettes, LED), qui ne sont pas des transitions.
   Hors couche et en !important : une transition posée plus haut par un composant ne la reprend pas. */
:is(a,button,summary,[role=button],[role=tab],[role=menuitem],[role=option],[onclick],.ov-env-row2,.ovw-card,.ovw-fichier,.env-card),
:is(a,button,summary,[role=button],[role=tab],[role=menuitem],[role=option]) > :is(svg,span,i){transition-duration:0s!important}