/* ===================================================================
   UNIVERS · la lumière réelle de chaque produit, lue dans son code.

   Chaque univers redéfinit les 7 tokens de la salle (DESIGN.md) avec les
   valeurs EXACTES du produit, sa fonte d'affichage (--u-display, --u-poids,
   --u-espace), sa fonte d'interface (--u-sans), sa nappe de lumière
   (--u-lumiere : les orbes, halos ou scrims du produit) et son grain
   (--u-grain : le même feTurbulence que le produit, mêmes réglages).

   Puis son spécimen : un composant du produit, markup et CSS repris du
   dépôt, scoped sous .u-<slug>. Les variables locales portent les noms
   du produit pour que le CSS reste lisible à côté de sa source.

   Sources : rapports d'extraction du 29 août 2026, un par dépôt (voir
   docs/RECITS-DECLENCHEURS.md pour la table de provenance).
   =================================================================== */

/* -------------------------------------------------------------------
   FONTES DES PRODUITS · auto-hébergées ici, sous-ensemble latin.
   Inter, Plus Jakarta Sans, Caveat, Schibsted Grotesk : Google Fonts,
   telles que les produits les chargent. Fraunces, Archivo, JetBrains
   Mono : copies des fichiers Fontsource servis par Toul'Barz. Arverna :
   la police maison de l'Abeille (capitales seules).
   ------------------------------------------------------------------- */
@font-face{font-family:'Inter';src:url('univers/fonts/inter-var.woff2') format('woff2');font-weight:400 600;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans';src:url('univers/fonts/plus-jakarta-sans-var.woff2') format('woff2');font-weight:400 800;font-display:swap}
@font-face{font-family:'Caveat';src:url('univers/fonts/caveat-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Schibsted Grotesk';src:url('univers/fonts/schibsted-grotesk-var.woff2') format('woff2');font-weight:400 600;font-display:swap}
@font-face{font-family:'Fraunces Variable';src:url('univers/fonts/fraunces-var.woff2') format('woff2-variations');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'Fraunces Variable';src:url('univers/fonts/fraunces-var-italic.woff2') format('woff2-variations');font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:'Archivo Variable';src:url('univers/fonts/archivo-var.woff2') format('woff2-variations');font-weight:100 900;font-display:swap}
@font-face{font-family:'JetBrains Mono Variable';src:url('univers/fonts/jetbrains-mono-var.woff2') format('woff2-variations');font-weight:100 800;font-display:swap}
@font-face{font-family:'Arverna';src:url('univers/fonts/arverna.woff2') format('woff2');font-weight:normal;font-display:swap}


/* ===================================================================
   01 · QSE (« Brunel ») · src/index.css, index.html, MessageBubble.tsx
   Clair et seulement clair : ardoise 50, encre ardoise 900, bleu 600.
   Pile système (la CSP interdit toute fonte tierce), hiérarchie par le
   poids : font-black 900. Orbes bleu / indigo / cyan, grain 0.8 à 2 %.
   =================================================================== */
html[data-univers="qse"]{
  --noir:#f8fafc;--surface:#ffffff;--ligne:#e2e8f0;--blanc:#0f172a;--gris:#475569;
  --ambre:#2563eb;--ambre-clair:#1d4ed8;
  --u-display:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --u-sans:var(--u-display);--u-poids:900;--u-espace:-.025em;
  /* les orbes de la salle, plus discrets que ceux de la fenêtre : sinon les deux angles
     de la fenêtre (haut gauche, bas droite) se fondent dans la lumière de la pièce */
  --u-lumiere:radial-gradient(50% 55% at 4% 0%,rgba(219,234,254,.42),transparent 60%),radial-gradient(42% 50% at 100% 100%,rgba(224,231,255,.34),transparent 60%);
  --u-grain:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --u-grain-taille:200px 200px;--u-grain-mode:multiply;--u-grain-opacite:.02;
}
.u-qse{
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#0f172a;
  -webkit-font-smoothing:antialiased;
}
/* la coque de la fenêtre de chat : atmosphère, orbes, verre (ChatInterface.tsx) */
.qse-fenetre{
  position:relative;overflow:hidden;border-radius:32px;padding:22px 20px 20px;
  background:linear-gradient(to bottom right,#f8fafc,rgba(239,246,255,.3));
  box-shadow:0 25px 50px -12px rgba(15,23,42,.35),0 0 0 1px rgba(15,23,42,.09);outline:1px solid rgba(255,255,255,.35);
}
.qse-orbes i{position:absolute;border-radius:50%;filter:blur(60px);opacity:.6;pointer-events:none}
.qse-orbes .o1{top:-22%;left:-16%;width:230px;height:230px;background:#60a5fa}
.qse-orbes .o2{bottom:-22%;right:-16%;width:190px;height:190px;background:#818cf8}
.qse-orbes .o3{top:38%;left:32%;width:140px;height:140px;background:#22d3ee}
.qse-verre{position:absolute;inset:0;background:rgba(255,255,255,.6);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.qse-fil{position:relative;display:flex;flex-direction:column;gap:12px}
.qse-msg{display:flex;gap:10px;align-items:flex-end;max-width:86%}
.qse-moi{align-self:flex-end}
/* l'avatar biométrique et son aura (BiometricAvatar.tsx : cyan-400 quand la crédibilité est haute) */
.qse-avatar{
  width:40px;height:40px;border-radius:50%;background:#0f172a;border:2px solid #22d3ee;
  display:grid;place-items:center;color:#fff;font-weight:900;font-size:11px;flex:none;
  animation:qse-aura 3s ease-in-out infinite;
}
@keyframes qse-aura{0%,100%{box-shadow:0 0 10px #22d3ee}50%{box-shadow:0 0 25px #22d3ee}}
.qse-nom{margin:0 0 6px 4px;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#475569}
.qse-bulle{padding:14px 20px;font-size:15px;border-radius:24px}
.qse-ia .qse-bulle{
  background:rgba(248,250,252,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  color:#1e293b;border:1px solid rgba(255,255,255,.6);box-shadow:0 2px 10px rgba(0,0,0,.03);
  line-height:1.75;letter-spacing:-.01em;
}
.qse-moi .qse-bulle{
  background:linear-gradient(to bottom right,#2563eb,#4f46e5);color:#fff;
  font-weight:500;letter-spacing:.025em;line-height:1.55;
  box-shadow:0 10px 15px -3px rgba(59,130,246,.3);border:1px solid rgba(59,130,246,.5);
}
/* la capsule de saisie et l'orbe micro (ChatInput.tsx) */
.qse-saisie{display:flex;gap:10px;align-items:center;margin-top:6px}
.qse-capsule{
  flex:1;min-width:0;height:56px;display:flex;align-items:center;padding:0 8px 0 22px;border-radius:2rem;
  background:rgba(248,250,252,.8);border:1px solid rgba(255,255,255,.6);
  box-shadow:inset 0 2px 4px rgba(0,0,0,.02);color:#64748b;font-weight:500;font-size:15px;
}
.qse-placeholder{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.qse-envoi{
  margin-left:auto;flex:none;width:40px;height:40px;border-radius:50%;background:#2563eb;color:#fff;
  display:grid;place-items:center;box-shadow:0 10px 15px -3px rgba(59,130,246,.3);
}
.qse-micro{
  width:56px;height:56px;border-radius:50%;background:#fff;color:#475569;flex:none;
  border:1px solid rgba(255,255,255,.6);box-shadow:0 10px 15px -3px rgba(0,0,0,.1);display:grid;place-items:center;
}
.qse-envoi svg,.qse-micro svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.qse-envoi svg{width:20px;height:20px;stroke-width:2.5}
.qse-micro svg{width:24px;height:24px;stroke-width:2}


/* ===================================================================
   03 · STUDIO 9 · app/vue.mjs (source unique de la console)
   Clair par défaut, neutres à chroma nul, un vert « en marche », un
   ocre-rouge qui signale. Inter 400/500/600, cv05 + ss01. Blocs bordés
   jamais ombrés, aucun grain, aucune image : la lumière est plate.
   =================================================================== */
html[data-univers="studio9"]{
  --noir:#ffffff;--surface:#f6f6f7;--ligne:#e5e5ea;--blanc:#141416;--gris:#63636b;
  --ambre:#166b41;--ambre-clair:#2f5bd1;
  --u-display:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;--u-sans:var(--u-display);
  --u-poids:600;--u-espace:-.02em;
  --u-lumiere:none;--u-grain:none;--u-grain-opacite:0;
}
.u-s9{
  --fond:#ffffff;--fond-2:#f6f6f7;--encre:#141416;--doux:#63636b;--tres-doux:#6e6e78;
  --trait:#e5e5ea;--trait-fort:#cfcfd6;--action:#141416;--sur-action:#ffffff;
  --actif:#166b41;--actif-fond:#e9f3ed;--alerte:#9c3418;--alerte-fond:#fbeee9;
  --r-s:8px;--r-m:12px;--e1:4px;--e2:8px;--e3:12px;--e4:16px;--e5:24px;
  --sortie:cubic-bezier(.22,1,.36,1);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:.9375rem;line-height:1.55;
  font-feature-settings:"cv05" 1,"ss01" 1;-webkit-font-smoothing:antialiased;color:var(--encre);
}
.s9-page{background:var(--fond);border:1px solid var(--trait);border-radius:var(--r-m);padding:var(--e5) var(--e4) var(--e4)}
/* l'en-tête : marque typographique, pastille d'état, interrupteur (vue.mjs:76-111, 182-200) */
.s9-marque{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--e4)}
.s9-marque .s9-titre{margin:0;font-size:1.0625rem;font-weight:600;letter-spacing:-.011em;line-height:1.3;color:var(--encre)}
.s9-marque p{margin:2px 0 0;font-size:.8125rem;color:var(--doux);line-height:1.3}
.s9-droite{display:flex;flex-direction:column;align-items:flex-end;gap:var(--e3);flex:none;margin-left:auto}
.s9-etat{
  display:inline-flex;align-items:center;gap:7px;margin-top:2px;font-size:.8125rem;font-weight:500;
  padding:5px 11px;border-radius:99px;white-space:nowrap;
  color:var(--actif);border:1px solid color-mix(in srgb,var(--actif) 40%,transparent);background:var(--actif-fond);
}
.s9-point{width:7px;height:7px;border-radius:50%;background:var(--actif)}
.s9-inter{display:inline-flex;align-items:center;gap:10px;font-size:.8125rem;color:var(--doux)}
.s9-switch{position:relative;width:38px;height:22px;border-radius:99px;background:var(--actif)}
.s9-switch::after{
  content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:99px;
  background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.28);transform:translateX(16px);
}
.s9-onglets{display:flex;border-bottom:1px solid var(--trait);margin-top:var(--e5);overflow:hidden}
.s9-onglets span{border-bottom:2px solid transparent;margin-bottom:-1px;padding:9px 0;margin-right:var(--e5);font-size:.9375rem;color:var(--doux);white-space:nowrap}
.s9-onglets span[aria-current]{color:var(--encre);border-color:var(--encre);font-weight:500}
/* la carte de signalement (vue.mjs:1044-1059, 225-231) : le message que le studio reçoit */
.s9-signal{border:1px solid var(--trait);border-radius:var(--r-m);padding:var(--e4);background:var(--fond);margin-top:var(--e4)}
.s9-haut{display:flex;align-items:baseline;justify-content:space-between;gap:var(--e3)}
.s9-signal b{font-size:1rem;font-weight:600;letter-spacing:-.008em}
.s9-signal time{font-size:.8125rem;color:var(--tres-doux);white-space:nowrap}
.s9-ou{font-size:.8125rem;color:var(--doux);margin-top:2px}
.s9-signal p{margin:var(--e1) 0 0;font-size:.875rem;line-height:1.5;color:var(--encre)}
.s9-actions{display:flex;gap:var(--e2);margin-top:var(--e3);flex-wrap:wrap}
.s9-bouton{
  display:inline-flex;align-items:center;padding:6px 12px;border-radius:var(--r-s);
  background:var(--action);color:var(--sur-action);font-size:.8125rem;font-weight:500;border:1px solid var(--action);
}
.s9-creux{background:transparent;color:var(--encre);border-color:var(--trait-fort)}


/* ===================================================================
   04 · STEP UP FACTORY · bilan.stepupfactory.fr, src/index.css, tokens.ts
   Sombre : ardoise bleue 161C28, cartes 252D3D, pastilles 1E2535. Lime
   c1ff72 en action, tri-dégradé pêche > magenta > lime toujours en
   « to top right ». SF Pro Display 400 à -0.025em (.title-ios). Aucun
   grain dans l'app de réservation.
   =================================================================== */
html[data-univers="stepup"]{
  --noir:#161C28;--surface:#252D3D;--ligne:color-mix(in srgb,#ffffff 10%,#161C28);--blanc:#f2f2f2;
  --gris:color-mix(in srgb,#f2f2f2 60%,#161C28);--ambre:#c1ff72;--ambre-clair:#d8ff9f;
  --u-display:"SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --u-sans:var(--u-display);--u-poids:400;--u-espace:-.025em;
  --u-lumiere:radial-gradient(38% 40% at 84% 12%,rgba(255,189,89,.10),transparent 65%),radial-gradient(36% 38% at 14% 88%,rgba(193,255,114,.08),transparent 65%),radial-gradient(30% 30% at 50% 50%,rgba(255,155,217,.05),transparent 65%);
  --u-grain:none;--u-grain-opacite:0;
}
.u-su{
  --su-bg:#161C28;--su-card:#252D3D;--su-chip:#1E2535;--su-lime:#c1ff72;--su-peach:#ffbd59;--su-magenta:#ff9bd9;--su-text:#f2f2f2;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color:#fff;-webkit-font-smoothing:antialiased;
}
.su-page{background:var(--su-bg);border-radius:20px;padding:18px 16px 16px;box-shadow:0 24px 60px -20px rgba(0,0,0,.65);border:1px solid rgba(255,255,255,.06)}
/* le hero de la page de réservation : badge d'offre, titre .title-ios, tagline (App.tsx:193-197, 1219-1295) */
.su-badge{
  display:inline-flex;align-items:center;gap:8px;padding:5px 11px;border-radius:9999px;background:var(--su-chip);
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 10px 15px -3px rgba(0,0,0,.3);
}
.su-badge s{font-weight:500;color:rgba(242,242,242,.6)}
.su-titre{margin:12px 0 0;font-size:26px;font-weight:400;letter-spacing:-.025em;line-height:1.1}
.su-titre b{font-weight:400;color:var(--su-lime)}
.su-tag{margin:6px 0 0;font-size:13px;color:rgba(242,242,242,.6)}
.su-label{margin:18px 0 8px;font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:rgba(242,242,242,.5)}
/* le sélecteur de jour (DaySelector.tsx:50-77) */
.su-jours{display:flex;gap:12px;overflow:hidden}
.su-jour{
  flex:none;min-width:104px;padding:8px 12px;min-height:48px;border-radius:9999px;
  border:1px solid rgba(255,255,255,.1);background:var(--su-chip);color:rgba(242,242,242,.8);
  font-size:12px;white-space:nowrap;display:flex;flex-direction:column;justify-content:center;
}
.su-jour b{font-weight:600}
.su-jour small{font-size:10px;color:rgba(242,242,242,.6)}
.su-jour.est-actif{border-color:transparent;color:#000;background:linear-gradient(to top right,var(--su-lime),var(--su-peach),var(--su-magenta))}
.su-jour.est-actif small{color:rgba(0,0,0,.6)}
/* la grille de créneaux (SlotGrid.tsx:89-161) */
.su-grille{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.su-creneau{
  position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;
  min-height:74px;padding:12px;border-radius:1rem;border:1px solid var(--su-chip);background:rgba(30,37,53,.8);
  box-shadow:0 1px 2px rgba(0,0,0,.3);font-size:14px;
}
.su-creneau b{font-weight:500;color:#fff}
.su-creneau small{font-size:11px;color:rgba(242,242,242,.6)}
.su-creneau em{
  font-style:normal;position:absolute;top:13px;left:66px;font-size:10px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;padding:2px 8px;border-radius:9999px;color:#000;background:var(--su-lime);
}
.su-creneau .su-pilule{display:inline-flex;margin-top:4px;padding:3px 10px;border-radius:9999px;border:1px solid rgba(255,255,255,.12);background:var(--su-chip);font-size:10px;font-weight:500;color:rgba(242,242,242,.8)}
.su-creneau.est-choisi{border-color:var(--su-lime);background:var(--su-chip)}
.su-coche{position:absolute;top:8px;right:8px;width:16px;height:16px;border-radius:50%;background:var(--su-lime)}
.su-coche::after{content:"";position:absolute;left:5px;top:2.5px;width:4px;height:7px;border:solid #000;border-width:0 2px 2px 0;transform:rotate(45deg)}


/* ===================================================================
   05 · TOUL'BARZ · toulbarz-platform, design-system/tokens, WorkShell
   Monochrome strict : noir 080808, surface 111111, filet 1E1E1E, argent
   C4C4C4 pour le seuil, encre 14141A posée sur l'argent. Fraunces pour
   les titres, Archivo pour l'interface, aucun radius sur les primitives,
   aucune ombre, grain 0.82 en overlay à 7 %, halo qui respire en haut.
   =================================================================== */
html[data-univers="toulbarz"]{
  --noir:#080808;--surface:#111111;--ligne:#1E1E1E;--blanc:#FFFFFF;--gris:#7d7d7d;
  --ambre:#C4C4C4;--ambre-clair:#FFFFFF;
  --u-display:"Fraunces Variable",Fraunces,Georgia,serif;--u-sans:"Archivo Variable",Archivo,system-ui,sans-serif;
  --u-poids:400;--u-espace:-.03em;
  --u-lumiere:radial-gradient(115% 75% at 50% -8%,rgba(255,255,255,.16) 0%,rgba(255,255,255,.06) 22%,rgba(255,255,255,0) 52%),radial-gradient(circle at 50% 32%,transparent 0%,rgba(5,5,5,.66) 58%);
  --u-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch' seed='7'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E");
  --u-grain-taille:240px 240px;--u-grain-mode:overlay;--u-grain-opacite:.07;
}
.u-tb{
  --bg:#080808;--surface:#111111;--elevated:#181818;--border:#1E1E1E;--muted:#4A4A4A;--danger:#E55353;
  --w-canvas:#0a0a0c;--w-panel:#121216;--w-line:#26262d;--w-ink:#ededf0;
  font-family:"Archivo Variable",Archivo,system-ui,sans-serif;color:#fff;-webkit-font-smoothing:antialiased;
}
/* la coque de travail et son flare de titre (WorkShell.vue, PageHeader.vue:24-32) */
.tb-canvas{position:relative;background:var(--w-canvas);border:1px solid var(--w-line);border-radius:12px;padding:24px 22px 22px;overflow:hidden}
.tb-canvas::before{content:"";position:absolute;inset:0;background:radial-gradient(58% 80% at 22% 42%,rgba(255,255,255,.08),rgba(255,255,255,0) 70%);pointer-events:none}
.tb-canvas::after{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.28),rgba(255,255,255,0));
}
.tb-tete{position:relative}
.tb-tete p{margin:5px 0 0;font-size:.875rem;color:rgba(255,255,255,.55)}
.tb-tete .tb-titre{margin:0;font-family:"Fraunces Variable",Fraunces,Georgia,serif;font-weight:400;font-size:1.9rem;letter-spacing:-.025em;line-height:1.1;color:#fff}
/* le cycle de vie d'un événement en cinq états (StatusStepper.vue, ADR 0020) */
.tb-stepper{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:8px 0;margin-top:24px}
.tb-stepper i{width:16px;height:1px;margin:0 4px;background:rgba(255,255,255,.2)}
.tb-etape{
  border:1px solid rgba(255,255,255,.2);padding:6px 12px;font-size:11px;text-transform:uppercase;
  letter-spacing:.25em;color:rgba(255,255,255,.45);white-space:nowrap;
}
.tb-etape.est-passee{border-color:rgba(255,255,255,.4);color:rgba(255,255,255,.7)}
.tb-etape.est-courante{border-color:#fff;background:#fff;color:#000}
.tb-annuler{margin-left:8px;padding:6px 12px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:rgba(255,255,255,.45);white-space:nowrap}
/* une ligne de la liste, à filet, sans radius */
.tb-ligne{position:relative;display:flex;align-items:center;gap:12px;margin-top:20px;padding-top:14px;border-top:1px solid var(--w-line);font-size:.875rem}
.tb-badge{display:inline-flex;align-items:center;padding:2px 8px;font-size:10px;text-transform:uppercase;letter-spacing:.25em;border:1px solid #7DDE92;color:#7DDE92}
.tb-nom{color:rgba(255,255,255,.85);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.tb-copier{margin-left:auto;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.66);border-bottom:1px solid rgba(255,255,255,.3)}


/* ===================================================================
   06 · L'ABEILLE ANGLOYE QUI RIT · portail.module.css, globals.css
   Crème fbf8f2, cire f3ecdd, miel d9a441 en remplissage et miel foncé
   8f6210 en texte (AA), encre chaude 2a211b, vert prairie sur les
   eyebrows. Arverna (police maison, capitales) sur le seul h1, Fraunces
   partout ailleurs, Schibsted Grotesk en corps. Grain 0.86 multiply à
   4 %, la « goutte de lumière » pollen en halo.
   =================================================================== */
html[data-univers="abeille"]{
  --noir:#fbf8f2;--surface:#f3ecdd;--ligne:#dcd2be;--blanc:#2a211b;--gris:#6e655a;
  --ambre:#8f6210;--ambre-clair:#2a211b;
  --u-display:"Fraunces Variable",Fraunces,Georgia,serif;--u-sans:"Schibsted Grotesk",system-ui,sans-serif;
  --u-poids:540;--u-espace:-.015em;
  --u-lumiere:radial-gradient(50% 60% at 72% 30%,rgba(232,198,107,.38) 0%,transparent 60%);
  --u-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.86' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  --u-grain-taille:160px 160px;--u-grain-mode:multiply;--u-grain-opacite:.04;
}
.u-ab{
  --fond:#fbf8f2;--cire:#f3ecdd;--action:#d9a441;--action-fonce:#8f6210;--halo:#e8c66b;
  --encre:#2a211b;--encre-pale:#cbb38a;--sepia:#6e655a;--filet:#dcd2be;--prairie:#2f4a3c;
  font-family:"Schibsted Grotesk",system-ui,sans-serif;color:var(--encre);letter-spacing:-.006em;
}
/* la scène du hero : ambre profond ad7d41, scrim de lisibilité à gauche (portail.module.css:97, 205-224) */
.ab-scene{position:relative;overflow:hidden;border-radius:16px;background:#ad7d41;min-height:26rem;padding:1.1rem 1.1rem 1rem}
.ab-scrim{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(102deg,rgba(251,248,242,.86) 0%,rgba(251,248,242,.52) 26%,rgba(251,248,242,.12) 46%,transparent 62%),linear-gradient(to top,rgba(42,33,27,.18) 0%,transparent 22%);
}
.ab-marque{position:relative;margin:0;font-family:"Fraunces Variable",Fraunces,Georgia,serif;font-size:.98rem;font-weight:480;color:var(--encre)}
.ab-marque em{font-style:italic;font-weight:460}
/* le h1, en Arverna : capitales seules, fer forgé (portail.module.css:496-509) */
.ab-h1{
  position:relative;margin:.9rem 0 0;font-family:'Arverna',"Fraunces Variable",Georgia,serif;
  text-transform:uppercase;font-size:1.95rem;line-height:.98;letter-spacing:0;color:var(--encre);max-width:9ch;
}
/* le jeton de cire (portail.module.css:2238-2314) */
.ab-act{
  position:relative;display:inline-flex;align-items:center;gap:.5em;margin-top:.95rem;
  padding:.62em 1.05em;min-height:44px;font-weight:600;font-size:.95rem;color:var(--encre);
  border:1.5px solid var(--action);border-radius:5px;background:var(--action);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 4px 10px -4px rgba(140,98,16,.4);
}
.ab-act svg{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round}
.ab-act i{font-style:normal;font-family:"JetBrains Mono Variable","JetBrains Mono",monospace;font-size:.9em}
/* les fiches-planche en verre teinté miel (portail.module.css:661-752) */
.ab-fiches{position:absolute;right:1rem;bottom:1rem;display:flex;align-items:flex-end;gap:.55rem}
.ab-fiche{
  display:flex;flex-direction:column;justify-content:flex-end;gap:.22rem;
  width:clamp(5.6rem,27%,7.6rem);height:9.4rem;padding:.8rem .7rem;border-radius:16px;color:var(--encre);
  background:linear-gradient(158deg,color-mix(in oklab,var(--halo) 30%,transparent),color-mix(in oklab,var(--cire) 68%,transparent));
  backdrop-filter:blur(11px) saturate(1.18);-webkit-backdrop-filter:blur(11px) saturate(1.18);
  border:1px solid color-mix(in oklab,var(--action) 32%,var(--filet));
  box-shadow:0 16px 42px -20px rgba(42,33,27,.55),inset 0 1px 0 rgba(255,252,245,.4);
}
/* l'abeille au fil : la vidéo à fond transparent du hero (abeille-fil.webm VP9 alpha,
   abeille-fil.mov HEVC alpha pour Safari). Elle ne joue que quand la salle est chez elle. */
.ab-vol{position:absolute;right:-6%;top:-4%;width:64%;max-width:none;height:auto;pointer-events:none;opacity:0;transition:opacity .6s ease .15s}
.bloc.actif .ab-vol,.rejoue .ab-vol{opacity:1}
.ab-num{font-family:"Fraunces Variable",Georgia,serif;font-size:.82rem;letter-spacing:.16em;color:var(--action-fonce);font-weight:600}
.ab-titre{font-family:"Fraunces Variable",Georgia,serif;font-size:.98rem;font-weight:540;line-height:1.05}
.ab-sous{font-size:.66rem;line-height:1.32;color:color-mix(in oklab,var(--sepia) 72%,var(--encre))}


/* ===================================================================
   07 · VOCAL FLOW · frontend/src/index.css, pages/landing2.css
   Thème « Atelier » : papier faf6f1, encre 292018, terracotta c2785c
   (texte a8623f), teal 1f8a94, panneau espresso 2b2119, beurre e3b761.
   Plus Jakarta Sans en corps, Fraunces 560 en titres, Caveat pour
   l'annotation. Grain 0.8 multiply, tampons inclinés, letterpress.
   =================================================================== */
html[data-univers="vocalflow"]{
  --noir:#faf6f1;--surface:#fdfbf8;--ligne:#d6ccc2;--blanc:#292018;--gris:#6b5d4f;
  --ambre:#a8623f;--ambre-clair:#7e4227;
  --u-display:"Fraunces Variable",Fraunces,Georgia,serif;--u-sans:"Plus Jakarta Sans",system-ui,-apple-system,sans-serif;
  --u-poids:560;--u-espace:-.015em;
  --u-lumiere:none;
  --u-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='0.055'/%3E%3C/svg%3E");
  --u-grain-taille:240px 240px;--u-grain-mode:multiply;--u-grain-opacite:1;
}
.u-vf{
  --paper:#faf6f1;--ink:#292018;--ink-2:#6b5d4f;--terra:#c2785c;--terra-deep:#a8623f;--teal:#1f8a94;
  --espresso:#2b2119;--espresso-2:#3a2d22;--cream:#f5eee4;--butter:#e3b761;
  --font-body:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;--font-display:'Fraunces Variable',Georgia,serif;--font-hand:'Caveat',cursive;
  font-family:var(--font-body);color:var(--ink);
}
/* l'annotation manuscrite du hero (landing2.css:119-127) */
.vfl-scribble{margin:0 0 .5rem .4rem;font-family:var(--font-hand);font-size:21px;font-weight:600;color:var(--terra-deep);transform:rotate(-2.5deg);transform-origin:left bottom}
/* la carte « appel du soir » (LandingPage2.jsx:245-297, landing2.css:291-395) */
.vfl-call{background:var(--espresso);color:var(--cream);border-radius:20px;padding:22px;width:100%;box-shadow:0 30px 60px rgba(41,32,24,.30);position:relative}
.vfl-call-head{display:flex;align-items:center;gap:12px;padding-bottom:15px;border-bottom:1px solid rgba(245,238,228,.14)}
.vfl-call-avatar{width:42px;height:42px;border-radius:50%;background:rgba(194,120,92,.28);color:#ecb99f;font-family:var(--font-display);font-weight:600;font-size:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.vfl-call-meta{flex:1;min-width:0}
.vfl-call-name{font-size:14px;font-weight:700}
.vfl-call-status{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--butter);margin-top:3px}
.vfl-dot{width:7px;height:7px;border-radius:50%;background:var(--butter);animation:vfl-pulse 2s ease-in-out infinite}
.vfl-listen{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:800;font-family:var(--font-body);color:var(--espresso);background:var(--butter);border-radius:10px;padding:10px 14px;box-shadow:0 3px 0 #a8823c;white-space:nowrap}
.vfl-call-body{padding:18px 2px 6px;display:flex;flex-direction:column;gap:10px}
.vfl-bubble{max-width:88%;padding:10px 14px;border-radius:14px;font-size:13.5px;line-height:1.5;opacity:0;transform:translateY(8px)}
.vfl-bubble-ai{align-self:flex-start;background:var(--espresso-2);border-bottom-left-radius:5px}
.vfl-bubble-client{align-self:flex-end;background:rgba(194,120,92,.26);border-bottom-right-radius:5px}
.vfl-bubble-tag{display:block;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.09em;margin-bottom:3px}
.vfl-bubble-ai .vfl-bubble-tag{color:#8fc7cd}
.vfl-bubble-client .vfl-bubble-tag{color:#ecb99f}
.vfl-call-stamp{
  align-self:flex-start;margin:8px 0 2px 2px;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:#a3c292;border:2px solid currentColor;border-radius:5px;padding:7px 11px 6px;transform:rotate(-3.5deg);opacity:0;
}
/* la chorégraphie du produit, rejouée à chaque fois que la salle entre chez lui
   (.bloc.actif sur la liste, .rejoue sur une page projet) */
.bloc.actif .vfl-bubble,.rejoue .vfl-bubble{animation:vfl-bubble-in 420ms cubic-bezier(.2,.8,.3,1) forwards;animation-delay:calc(var(--i) * .7s + .25s)}
.bloc.actif .vfl-call-stamp,.rejoue .vfl-call-stamp{animation:vfl-stamp-in 360ms cubic-bezier(.2,1.4,.4,1) forwards;animation-delay:3.9s}
@keyframes vfl-pulse{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes vfl-bubble-in{to{opacity:1;transform:none}}
@keyframes vfl-stamp-in{0%{opacity:0;transform:rotate(-3.5deg) scale(1.5)}100%{opacity:1;transform:rotate(-3.5deg) scale(1)}}
@media (prefers-reduced-motion:reduce){
  .vfl-bubble,.vfl-call-stamp{opacity:1;transform:none;animation:none!important}
  .vfl-call-stamp{transform:rotate(-3.5deg)}
  .vfl-dot{animation:none}
}


/* ===================================================================
   08 · VOIXFLASH · voixflash.py (rumps + AppKit), aucune couleur propre
   Le produit ne peint rien : macOS peint tout. Ce qui suit reprend les
   couleurs système d'Apple en apparence sombre (barre des menus, menu,
   accent bleu 0A84FF) et la police système. Les libellés sont ceux du
   menu réel (voixflash.py:938-1006) ; les cinq états sont les noms des
   symboles SF (voixflash.py:159-164), qu'on ne peut pas embarquer : on
   les écrit.
   =================================================================== */
html[data-univers="voixflash"]{
  --noir:#1E1E1E;--surface:#282828;--ligne:#3D3D3D;--blanc:#FFFFFF;--gris:#98989D;
  --ambre:#0A84FF;--ambre-clair:#409CFF;
  --u-display:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Helvetica,Arial,sans-serif;
  --u-sans:var(--u-display);--u-poids:700;--u-espace:-.02em;
  --u-lumiere:none;--u-grain:none;--u-grain-opacite:0;
}
.u-vx{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  color:#fff;-webkit-font-smoothing:antialiased;width:min(100%,21rem);margin-left:auto;
}
.vx-barre{
  display:flex;align-items:center;justify-content:flex-end;gap:14px;height:26px;padding:0 10px;
  background:rgba(30,30,30,.85);border-radius:8px 8px 0 0;font-size:13px;color:#fff;
}
.vx-micro{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:4px;background:rgba(255,255,255,.18)}
.vx-micro svg{width:15px;height:15px}
.vx-micro rect{fill:#fff}
.vx-micro path{fill:none;stroke:#fff;stroke-width:1.3;stroke-linecap:round}
.vx-menu{
  margin:2px 0 0;padding:5px;display:flex;flex-direction:column;
  background:rgba(40,40,40,.92);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);
  border-radius:8px;border:1px solid rgba(255,255,255,.12);box-shadow:0 12px 34px rgba(0,0,0,.45);font-size:13px;
}
.vx-menu span{position:relative;padding:3px 24px 3px 22px;border-radius:4px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vx-menu span:first-child{background:#0A84FF}
.vx-sous::after{content:"\203A";position:absolute;right:9px;top:2px;font-weight:600;color:rgba(255,255,255,.6)}
.vx-coche::before{content:"\2713";position:absolute;left:7px;top:3px;font-size:12px}
.vx-menu hr{border:0;border-top:1px solid rgba(255,255,255,.14);margin:4px 8px}
.vx-etats{margin:10px 0 0;font-size:11px;color:#98989D;text-align:right;line-height:1.7}
.vx-etats code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#fff;font-size:11px}


/* ===================================================================
   02 · SAVE & CARE · V1/apps/web/src/index.css, TaskCard.tsx, Checkbox.tsx
   Papier crème f7f3eb, carte efe9da, encre 1c1a17, mousse 3d5a3e pour
   la case cochée et la rature, ocre pour le critique. Fraunces + Inter.
   Ombres ambrées, jamais grises. Aucun grain. Le mode soir existe (de
   19 h à 6 h, sans bouton) : ici, le jour.
   =================================================================== */
html[data-univers="sanctuaire"]{
  --noir:#f7f3eb;--surface:#efe9da;--ligne:#e6dfca;--blanc:#1c1a17;--gris:#5a5147;
  --ambre:#3d5a3e;--ambre-clair:#2c4530;
  --u-display:"Fraunces Variable",Fraunces,ui-serif,Georgia,serif;--u-sans:Inter,ui-sans-serif,system-ui,sans-serif;
  --u-poids:500;--u-espace:-.01em;
  --u-lumiere:none;--u-grain:none;--u-grain-opacite:0;
}
.u-sc{
  --cream:#f7f3eb;--cream-dim:#efe9da;--cream-deep:#e6dfca;--text:#1c1a17;--text-soft:#5a5147;--text-mute:#6a5f52;
  --text-on-dark:#f0ebde;--moss:#3d5a3e;--ochre:#c8965a;--ochre-deep:#8a5a1f;
  --shadow-warm:0 1px 2px rgba(80,50,20,.06),0 4px 12px rgba(80,50,20,.08);--sortie:cubic-bezier(.22,1,.36,1);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.55;letter-spacing:.005em;
  color:var(--text);-webkit-font-smoothing:antialiased;
}
.sc-tete{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:0 4px 14px}
.sc-salut{margin:0;font-family:"Fraunces Variable",Georgia,serif;font-weight:500;font-size:26px;line-height:1.1;letter-spacing:-.01em}
.sc-date{margin:0;font-size:14px;color:var(--text-mute);white-space:nowrap}
/* la section et son anneau de progression (SectionCard + ProgressRing) */
.sc-section-tete{display:flex;align-items:center;gap:12px;padding:0 6px 10px}
.sc-anneau{width:32px;height:32px;border-radius:50%;background:conic-gradient(var(--moss) 33%,var(--cream-deep) 0);display:grid;place-items:center;flex:none}
.sc-anneau::after{content:"";width:22px;height:22px;border-radius:50%;background:var(--cream)}
.sc-section-tete .sc-section-titre{margin:0;font-family:"Fraunces Variable",Georgia,serif;font-weight:500;font-size:18px;letter-spacing:-.01em;color:var(--text)}
.sc-compte{margin-left:auto;font-size:13px;color:var(--text-mute);font-variant-numeric:tabular-nums}
/* la ligne de tâche cochable (TaskCard.tsx:167-287) : toute la carte est la surface de tap */
.sc-lignes{display:flex;flex-direction:column;gap:8px}
.sc-ligne{
  display:flex;align-items:center;gap:12px;padding:16px;min-height:72px;border-radius:18px;
  background:var(--cream-dim);box-shadow:var(--shadow-warm);
  transition:background-color .28s var(--sortie),box-shadow .28s var(--sortie),opacity .24s var(--sortie);
}
.sc-case{
  width:32px;height:32px;border-radius:8px;border:2px solid var(--text-mute);flex:none;
  display:inline-flex;align-items:center;justify-content:center;transition:background-color .2s ease-out,border-color .2s ease-out;
}
.sc-case svg{width:20px;height:20px;fill:none;stroke:var(--text-on-dark);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;transform:scale(.5);opacity:0}
.sc-corps{flex:1;min-width:0}
/* La rature : dans le produit, un trait absolu de 1,5 px tiré de gauche à droite.
   Ici le même trait est un fond cloné par ligne (box-decoration-break), pour
   qu'il suive chaque fragment quand le titre se replie sur deux lignes. */
.sc-titre{
  display:inline;margin:0;font-size:16px;font-weight:500;line-height:1.375;transition:color .28s var(--sortie);
  background-image:linear-gradient(var(--moss),var(--moss));background-repeat:no-repeat;
  background-position:0 56%;background-size:0% 1.5px;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}
.sc-desc{margin:2px 0 0;font-size:14px;line-height:1.375;color:var(--text-soft)}
.sc-critique{display:inline-flex;align-items:center;margin-left:8px;padding:2px 8px;border-radius:99px;font-size:12px;font-weight:500;background:color-mix(in srgb,var(--ochre) 15%,transparent);color:var(--ochre-deep);vertical-align:2px}
.sc-portrait{
  width:56px;height:56px;border-radius:50%;flex:none;display:grid;place-items:center;overflow:hidden;
  background:var(--cream-deep);color:var(--ochre-deep);font-family:"Fraunces Variable",Georgia,serif;font-weight:500;font-size:22px;
  box-shadow:0 0 0 1px var(--cream-deep);
}
/* le vrai portrait quand il existe : le produit affiche la photo, sinon l'initiale */
.sc-portrait img{width:100%;height:100%;object-fit:cover;display:block}
/* une tâche faite ne quitte pas sa section : elle s'installe sur place */
.sc-ligne.est-faite{background:transparent;box-shadow:none;opacity:.65;min-height:0;padding:10px 16px}
.est-faite .sc-case{background:var(--moss);border-color:var(--moss)}
.est-faite .sc-case svg{transform:none;opacity:1}
.est-faite .sc-titre{color:var(--text-soft);background-size:100% 1.5px}
.est-faite .sc-desc,.est-faite .sc-portrait{display:none}
/* quand la salle entre au sanctuaire, une ligne se coche : le geste du produit, à ses durées */
.bloc.actif .va-se-cocher,.rejoue .va-se-cocher{animation:sc-installe .28s var(--sortie) 1.15s forwards}
.bloc.actif .va-se-cocher .sc-case,.rejoue .va-se-cocher .sc-case{animation:sc-case .2s ease-out 1s forwards}
.bloc.actif .va-se-cocher .sc-case svg,.rejoue .va-se-cocher .sc-case svg{animation:sc-coche .45s cubic-bezier(.34,1.56,.64,1) 1.02s forwards}
.bloc.actif .va-se-cocher .sc-titre,.rejoue .va-se-cocher .sc-titre{
  animation:sc-titre .28s var(--sortie) 1.1s forwards,sc-rature .32s var(--sortie) 1.14s forwards;
}
@keyframes sc-case{to{background:var(--moss);border-color:var(--moss)}}
@keyframes sc-coche{to{transform:none;opacity:1}}
@keyframes sc-titre{to{color:var(--text-soft)}}
@keyframes sc-rature{to{background-size:100% 1.5px}}
@keyframes sc-installe{to{background:transparent;box-shadow:none;opacity:.65}}
@media (prefers-reduced-motion:reduce){
  .va-se-cocher,.va-se-cocher .sc-case,.va-se-cocher .sc-case svg,.va-se-cocher .sc-titre{animation-delay:0s!important}
}


/* ===================================================================
   09 · MES-MCP · envoi/web/css/console.css, image-gen/src/gallery.ts
   Des postes de travail sombres, denses, calmes, en fontes système, un
   seul accent bleu. Ici la console envoi, la seule porte de sortie :
   fond 0e1116, panneaux 151a21, filet 232a34, encre e8ebef, bleu 5b8def.
   Aucun grain. La matière du produit, c'est le journal des outils.
   =================================================================== */
html[data-univers="mesmcp"]{
  --noir:#0e1116;--surface:#151a21;--ligne:#232a34;--blanc:#e8ebef;--gris:#9aa4b1;
  --ambre:#5b8def;--ambre-clair:#7c97ff;
  --u-display:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--u-sans:var(--u-display);
  --u-poids:650;--u-espace:-.01em;
  --u-lumiere:none;--u-grain:none;--u-grain-opacite:0;
}
.u-mcp{
  --bg:#0e1116;--bg-raised:#151a21;--bg-inset:#0a0d11;--border:#232a34;--border-strong:#303a47;
  --text:#e8ebef;--text-muted:#9aa4b1;--text-faint:#6b7684;--accent:#5b8def;--accent-soft:rgba(91,141,239,.14);
  --ok:#3fb27f;--radius:8px;--radius-sm:5px;--shadow:0 8px 28px rgba(0,0,0,.45);
  --font:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  font-family:var(--font);font-size:14px;line-height:1.45;color:var(--text);-webkit-font-smoothing:antialiased;
}
.mcp-console{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.mcp-topbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;
  background:rgba(14,17,22,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border);
}
.mcp-brand{display:inline-flex;align-items:center;gap:8px;font-size:13px}
.mcp-brand strong{font-weight:600;color:var(--text)}
.mcp-brand span{color:var(--text-muted)}
.mcp-logo{display:inline-block;width:16px;height:16px}
.mcp-badge{display:inline-flex;align-items:center;gap:6px;padding:2px 9px;border-radius:99px;font-size:12px;color:var(--ok);background:rgba(63,178,127,.14)}
.mcp-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.mcp-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:12px 14px 0}
.mcp-kpis div{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius);padding:10px 12px}
.mcp-kpis b{display:block;font-size:26px;font-weight:650;line-height:1.1;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.mcp-kpis span{font-size:12px;color:var(--text-muted)}
/* les projets : tout est compartimenté côté serveur */
.mcp-tenants{display:flex;flex-wrap:wrap;gap:6px;padding:12px 14px 0}
.mcp-tenants span{padding:2px 9px;border-radius:99px;border:1px solid var(--border-strong);font-size:12px;color:var(--text-muted);font-family:var(--mono)}
.mcp-tenants .est-actif{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
/* le journal : ce que les outils répondent, en phrases écrites pour un LLM (envoi/src/tools/send.ts) */
.mcp-log{
  margin:12px 14px 14px;padding:12px 14px;background:var(--bg-inset);border:1px solid var(--border);border-radius:var(--radius);
  font-family:var(--mono);font-size:11px;line-height:1.65;color:var(--text);white-space:pre-wrap;overflow:hidden;
}
.mcp-log .mcp-app{color:var(--accent);font-weight:600}
.mcp-log .mcp-doux{color:var(--text-muted)}


/* ===================================================================
   LES BOUTONS D'ENTRÉE · un par projet, dans le style exact du bouton
   principal du produit. Sur la liste, il apparaît quand le bloc est
   allumé ; sur la page, il ouvre le produit en ligne. Ce sont des
   objets visuels : la cible cliquable est la phrase (liste) ou le lien
   qui les enveloppe (page).
   =================================================================== */
.cta{
  display:inline-flex;align-items:center;gap:.6em;white-space:nowrap;cursor:pointer;
  text-decoration:none;-webkit-font-smoothing:antialiased;
  transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .4s ease,box-shadow .3s ease,filter .3s ease;
}
.cta:hover{filter:brightness(1.05)}
.cta svg{display:block;flex:none}
/* sur la liste : caché tant que le bloc n'est pas allumé */
.bloc .cta{opacity:0;transform:translateY(6px)}
.bloc.actif .cta{opacity:1;transform:none;transition-delay:.12s}

/* QSE : la capsule bleue de la saisie, l'orbe d'envoi (ChatInput.tsx) */
.cta-qse{
  height:48px;padding:0 6px 0 22px;border-radius:2rem;
  background:linear-gradient(to bottom right,#2563eb,#4f46e5);color:#fff;
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:14px;font-weight:600;letter-spacing:.01em;
  box-shadow:0 10px 15px -3px rgba(59,130,246,.3);border:1px solid rgba(59,130,246,.5);
}
.cta-qse i{width:36px;height:36px;border-radius:50%;background:#fff;color:#2563eb;display:grid;place-items:center;margin-left:8px}
.cta-qse i svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}

/* Save & Care : la ligne cochée, mousse sur crème (TaskCard + CheckboxVisual) */
.cta-sc{
  padding:12px 18px 12px 12px;border-radius:18px;background:#3d5a3e;color:#f0ebde;
  font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:15px;font-weight:500;letter-spacing:.005em;
  box-shadow:0 1px 2px rgba(80,50,20,.06),0 4px 12px rgba(80,50,20,.18);
}
.cta-sc i{width:26px;height:26px;border-radius:7px;border:2px solid #f0ebde;display:grid;place-items:center}
.cta-sc i svg{width:16px;height:16px;fill:none;stroke:#f0ebde;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}

/* Studio 9 : le bouton d'action, noir, radius 8 (vue.mjs) */
.cta-s9{
  padding:9px 14px;border-radius:8px;background:#141416;color:#fff;border:1px solid #141416;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:.875rem;font-weight:500;
  font-feature-settings:"cv05" 1,"ss01" 1;
}
.cta-s9 i{font-style:normal;color:#9a9aa3}

/* Step Up Factory : la pilule tri-dégradée, texte noir (DaySelector actif) */
.cta-su{
  padding:12px 20px;border-radius:9999px;color:#000;
  background:linear-gradient(to top right,#c1ff72,#ffbd59,#ff9bd9);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,sans-serif;font-size:14px;font-weight:600;letter-spacing:-.01em;
  box-shadow:0 10px 15px -3px rgba(0,0,0,.3);
}

/* Toul'Barz : la pile « Entrer » de la vitrine, capitales espacées, filet qui s'étire */
.cta-tb{
  position:relative;padding:10px 18px;border:1px solid rgba(255,255,255,.35);color:#fff;background:transparent;
  font-family:"Archivo Variable",Archivo,system-ui,sans-serif;font-size:11px;text-transform:uppercase;letter-spacing:.28em;
}
.cta-tb::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:#fff;transition:width .5s cubic-bezier(.22,1,.36,1)}
.cta-tb:hover::after{width:100%}
.cta-tb i{font-family:"Fraunces Variable",Fraunces,Georgia,serif;font-style:italic;font-size:14px;letter-spacing:0;text-transform:none;color:#C4C4C4}

/* L'Abeille : le jeton de cire, alvéole et flèche mono (portail.module.css) */
.cta-ab{
  padding:.62em 1.05em;min-height:44px;border-radius:5px;background:#d9a441;border:1.5px solid #d9a441;color:#2a211b;
  font-family:"Schibsted Grotesk",system-ui,sans-serif;font-size:.95rem;font-weight:600;letter-spacing:-.006em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 4px 10px -4px rgba(140,98,16,.4);
}
.cta-ab svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round}
.cta-ab i{font-style:normal;font-family:"JetBrains Mono Variable","JetBrains Mono",monospace;font-size:.9em}

/* Vocal Flow : le bouton beurre à ombre dure de la carte d'appel (vfl-listen) */
.cta-vf{
  padding:10px 14px;border-radius:10px;background:#e3b761;color:#2b2119;box-shadow:0 3px 0 #a8823c;
  font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;font-size:13px;font-weight:800;
}
.cta-vf:hover{transform:translateY(1px);box-shadow:0 2px 0 #a8823c}
.cta-vf svg{width:12px;height:12px;fill:currentColor}

/* VoixFlash : le bouton système de macOS, accent bleu, apparence sombre */
.cta-vx{
  padding:5px 14px;border-radius:6px;background:#0A84FF;color:#fff;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;font-weight:500;
  box-shadow:0 1px 1px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.16);
}

/* mes-mcp : l'invite de la console, mono, curseur qui bat */
.cta-mcp{
  padding:8px 14px;border-radius:5px;background:#0a0d11;border:1px solid #303a47;color:#e8ebef;
  font-family:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;
}
.cta-mcp b{font-weight:600;color:#5b8def}
.cta-mcp::after{content:"";width:7px;height:13px;background:#e8ebef;margin-left:2px;animation:mcp-curseur 1.1s steps(1) infinite}
@keyframes mcp-curseur{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.cta-mcp::after{animation:none}}


/* le logo de la console envoi : les couleurs vivent ici, jamais dans le HTML
   des pages (la charte de la maison scanne les *.html de la racine) */
.mcp-logo-fond{fill:#5b8def}
.mcp-logo-trait{fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
