:root{
  --fond:#f5f7fa;
  --surface:#ffffff;
  --surface2:#eef4f8;
  --trait:#e1e7ec;
  --trait2:#cfd9e1;
  --texte:#17212b;
  --texte2:#536171;
  --texte3:#7b8794;
  --orange:#087eaa;
  --orange-fond:#e9f6fb;
  --vert:#239565;
  --ambre:#b26a11;
  --ambre-fond:#fff5e6;
  --rouge:#c84b4b;
}

html{scroll-behavior:smooth;background:var(--fond)}
body{background:var(--fond);color:var(--texte)}
body,button,input,select,textarea{letter-spacing:0}
::selection{background:#c7edf8;color:#10232b}
:focus-visible{outline:3px solid rgba(8,126,170,.22);outline-offset:2px;border-radius:6px}
.large{max-width:1440px;padding-left:40px;padding-right:40px}

/* Navigation */
header{background:rgba(255,255,255,.94);border-bottom:1px solid var(--trait);box-shadow:0 1px 0 rgba(23,33,43,.02)}
.barre{height:68px;gap:28px}
.marque{width:142px;height:40px;display:flex;align-items:center;flex:0 0 auto;border:0;background:transparent;padding:0;cursor:pointer}
.marque img{display:block;width:100%;height:36px;object-fit:contain}
.nav-principale{display:flex;align-items:stretch;align-self:stretch;gap:4px}
.nav-principale button{display:flex;align-items:center;padding:0 14px;color:var(--texte2);font-size:14px;font-weight:600;border:0;border-bottom:2px solid transparent;background:transparent;cursor:pointer}
.nav-principale button:hover{color:var(--orange);border-bottom-color:#8bd3eb}
.nav-principale button.actif{color:var(--orange);border-bottom-color:var(--orange)}
.veille{padding:7px 11px;background:#f7fafc;border:1px solid var(--trait);border-radius:999px;color:var(--texte2);white-space:nowrap}
.point{flex:0 0 auto}

/* Vue d’ensemble */
.tete{padding:38px 0 24px;align-items:flex-end;justify-content:space-between;border-bottom:1px solid var(--trait);margin-bottom:24px}
.eyebrow{font-size:12px;line-height:1.3;font-weight:700;text-transform:uppercase;color:var(--orange);margin-bottom:7px}
h1{font-size:30px;letter-spacing:0}
h2{font-size:20px;letter-spacing:0}
.sous{justify-content:flex-end;gap:8px 10px;max-width:760px}
.sous span{background:var(--surface);border:1px solid var(--trait);border-radius:7px;padding:7px 10px;color:var(--texte2)}
.sous b{color:var(--texte)}
.sous .retard{color:var(--ambre);border-color:#f0d8b7;background:var(--ambre-fond)}
.rang{color:var(--texte);margin:0 0 11px;font-size:12px}
.rang small{color:var(--texte3);margin-left:2px}
.rang.suite{margin-top:27px}
.tuiles{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.tuile{padding:15px 16px 14px;background:var(--surface);border-color:var(--trait);border-radius:8px;box-shadow:0 1px 2px rgba(23,33,43,.03);gap:7px;min-height:112px}
.tuile:hover{background:#fbfdfe;border-color:#8ecbdf;box-shadow:0 6px 18px rgba(23,62,79,.08);transform:translateY(-1px)}
.tuile.alerte{border-color:#eac995;background:#fffdf9}
.tuile .slug{color:#087eaa}
.pre .tuile .slug{color:#687988}
.tuile .nom{font-size:16px;letter-spacing:0;line-height:1.3}
.tuile .det{font-size:12px;line-height:1.45;color:var(--texte3);margin-top:auto}
.v{color:#637282}
.puce{background:#f3f6f8;border-color:var(--trait);color:#526272;border-radius:5px}
.puce.prod{background:#e8f6fb;color:#087eaa;border-color:#c8e8f3}
.puce.alerte{background:var(--ambre-fond);color:var(--ambre);border-color:#efd7b4}

/* Une seule vue de travail à la fois */
.vue{display:none!important}
body[data-vue="overview"] .vue-overview{display:block!important}
body[data-vue="travail"] .vue-travail{display:block!important}
body[data-vue="catalogue"] .vue-catalogue{display:block!important}
body[data-vue="activite"] .vue-activite{display:block!important}
body:not([data-vue="overview"]) .tete{display:none}
body:not([data-vue="overview"]) .bas{display:block;margin-top:36px}
body[data-vue="overview"] .bas,body[data-vue="travail"] .bas{display:none}
body[data-vue="catalogue"] .bas>section{width:100%}
body[data-vue="activite"] .journal{position:static;max-width:920px;margin:0 auto}
body[data-vue="activite"] .fil{max-height:none;display:grid;grid-template-columns:1fr 1fr;column-gap:30px}

/* Travaux en cours */
.workbench{margin-top:44px}
.travail-onglets{display:flex;gap:4px;width:max-content;max-width:100%;padding:4px;background:#e9f0f3;border:1px solid var(--trait);border-radius:8px}
.travail-onglets button{border:0;border-radius:6px;padding:10px 16px;background:transparent;color:var(--texte2);font-weight:650;cursor:pointer;white-space:nowrap}
.travail-onglets button:hover{color:var(--orange)}
.travail-onglets button.actif{background:var(--surface);color:var(--orange);box-shadow:0 1px 3px rgba(24,43,53,.1)}
.workbench>section{display:none!important;margin-top:18px;background:var(--surface);border:1px solid var(--trait);border-radius:8px;padding:24px;min-width:0;overflow:hidden}
.workbench[data-travail="prompts"] #sec-optims,.workbench[data-travail="scenarios"] #sec-creations{display:block!important}
.workbench .h2-s{min-height:42px}
.workbench table{display:table;table-layout:auto}
.workbench th{top:68px;background:var(--surface)}
.section-entete{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.section-entete>div{min-width:0}
.section-entete .op-go{flex:0 0 auto;margin-top:1px}
.choix-base{width:min(680px,calc(100vw - 32px));max-height:min(720px,calc(100vh - 32px));padding:0;border:1px solid var(--trait2);border-radius:8px;background:var(--surface);color:var(--texte);box-shadow:0 24px 70px rgba(23,33,43,.22)}
.choix-base::backdrop{background:rgba(30,43,54,.34);backdrop-filter:blur(2px)}
.choix-base-entete{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:22px 22px 16px;border-bottom:1px solid var(--trait)}
.choix-base-entete h2{margin:0}
.choix-base>.champ{display:block;width:calc(100% - 44px);max-width:none;margin:18px 22px 10px}
.choix-base-liste{padding:0 22px 22px;display:grid;gap:7px;overflow:auto}
.base-active{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;min-height:64px;padding:11px 13px;border:1px solid var(--trait);border-radius:7px;background:var(--surface);color:var(--texte);text-align:left;cursor:pointer}
.base-active:hover,.base-active:focus-visible{border-color:#4aa8c8;background:#f4fafc}
.base-active>span:first-child{display:flex;flex-direction:column;min-width:0}
.base-active b{font-size:14px;overflow-wrap:anywhere}
.base-active small{font-size:11.5px;color:var(--texte3)}
.base-clusters{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:4px}
.base-clusters i{font-style:normal}

/* Catalogue et activité */
.bas{grid-template-columns:minmax(0,1fr) 360px;gap:42px;margin-top:44px;padding-bottom:80px}
.bas>section,.journal{background:var(--surface);border:1px solid var(--trait);border-radius:8px;padding:24px}
.h2-s{color:var(--texte3);margin-bottom:17px}
.outils{padding:12px;background:#f7fafc;border:1px solid var(--trait);border-radius:7px;margin-bottom:6px}
.champ,.t-cherche,.cr-zone{background:var(--surface);border-color:var(--trait2);color:var(--texte);box-shadow:inset 0 1px 2px rgba(23,33,43,.025)}
.champ:focus,.t-cherche:focus,.cr-zone:focus{border-color:#4aa8c8;box-shadow:0 0 0 3px rgba(8,126,170,.1)}
.coche input{accent-color:var(--orange)}
th{top:68px;background:var(--surface);color:var(--texte3);border-color:var(--trait)}
td{border-color:var(--trait)}
.ligne:hover td,tr.choix:hover td{background:#f5fafc}
.ligne:hover .nom{color:var(--orange)}
td .desc{color:var(--texte3)}
.journal{top:92px}
.fil{max-height:calc(100vh - 186px)}
.fil li{border-left-color:var(--trait2)}
.fil li::before{box-shadow:0 0 0 4px var(--surface)}
.fil li.prod::before{background:var(--orange)}

/* Panneau scénario */
.voile{z-index:40;background:rgba(30,43,54,.32);backdrop-filter:blur(2px)}
.tiroir{z-index:41;background:#f8fafc;border-left-color:var(--trait2);box-shadow:-20px 0 50px rgba(28,43,54,.16)}
.t-tete{background:var(--surface);border-color:var(--trait)}
.t-titre{letter-spacing:0}
.btn,.fermer{background:var(--surface);border-color:var(--trait2);color:var(--texte2);border-radius:6px}
.btn:hover,.fermer:hover{background:#f3f8fa;border-color:#69b6d0;color:var(--texte)}
.onglet{color:var(--texte3)}
.onglet:hover{color:var(--orange)}
.onglet.actif{color:var(--orange);border-bottom-color:var(--orange);font-weight:700}
.t-corps{background:#f8fafc}
.arbre summary:hover{background:#edf5f8}
.k{color:#166f9a}.s{color:#327c55}.nb{color:#a85d1a}.b{color:#765a9a}
.etat,.noeud,.pousse,.duo,.champ-r,.etape-d,.sv-v,.sv-l,.sv-analyse,.cr-dosages button,.cr-aa{background:var(--surface);border-color:var(--trait);border-radius:8px}
.etat-t,.champ-r .tt,.etape-c,.sv-tours,.cr-pied,.pousse-ok{border-color:var(--trait)}
.dit.parole{border-left-color:var(--orange)}
.tr{border-color:var(--trait)}
.courbe{background:var(--surface);border-color:var(--trait);border-radius:8px}
.op-go{background:#087eaa;color:#fff;border-radius:6px;box-shadow:0 1px 2px rgba(8,72,96,.18)}
.op-go:hover{background:#066d94}
.op-redacteurs{margin:20px 0 14px;padding:0;border:0}
.op-redacteurs legend{margin-bottom:9px;font-size:13px;font-weight:700;color:var(--texte)}
.op-redacteurs-liste{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:9px}
.op-redacteur{display:flex;align-items:center;gap:10px;min-height:58px;padding:10px 12px;border:1px solid var(--trait2);border-radius:7px;background:var(--surface);cursor:pointer}
.op-redacteur:has(input:checked){border-color:#2997bc;background:#edf8fb;box-shadow:0 0 0 2px rgba(41,151,188,.1)}
.op-redacteur input{width:16px;height:16px;accent-color:#087eaa;flex:0 0 auto}
.op-redacteur span{display:flex;flex-direction:column;min-width:0}
.op-redacteur b{font-size:13.5px}
.op-redacteur small{font-size:11.5px;color:#327c55}
.op-redacteur.indisponible{opacity:.58;cursor:not-allowed;background:#f4f6f7}
.op-redacteur.indisponible small{color:var(--texte3)}
.jauge{background:#e3edf1}
.jauge i{background:linear-gradient(90deg,#087eaa,#42badc)}
.sv-f{background:var(--surface);border-color:var(--trait2);color:var(--texte2)}
.sv-f.actif{border-color:var(--orange);color:var(--orange);background:var(--orange-fond)}
tr.choisi td{background:var(--orange-fond)}
.sv-analyse{border-left-color:var(--orange)}
.bandeau{border:1px solid #efd7b4}
.barre2,.noeud svg line{background:#e6edf1}

/* Création */
select.champ option,select.champ optgroup{background:var(--surface);color:var(--texte)}
.cr-seg{background:var(--surface);border-color:var(--trait2)}
.cr-seg button+button{border-color:var(--trait2)}
.cr-seg button.actif{background:var(--orange);color:#fff}
.cr-seg button.actif.non{background:#e6edf1;color:var(--texte)}
.cr-dosages button:hover{border-color:#77bdd5}
.cr-dosages button.actif{border-color:var(--orange);background:var(--orange-fond)}
.cr-dosages button.actif b{color:var(--orange)}
.cr-barre{background:#f8fafc;border-color:var(--trait)}
.cr-chiffres div,.cr-mesure,.cr-rep.robot{background:#f2f7f9;border-color:var(--trait)}
.cr-rep.client{background:#e8f3f7}
.cr-p.oui{border-color:#8bc9af}

@media (max-width:1080px){
  .workbench .cache-m{display:none}
  .bas{grid-template-columns:1fr;gap:24px}
  .journal{position:static}
  .fil{max-height:540px}
}

@media (max-width:760px){
  header{position:static;backdrop-filter:none}
  .large{padding-left:16px;padding-right:16px}
  .barre{height:60px;gap:12px}
  .marque{width:112px;height:34px}
  .marque img{height:30px}
  .nav-principale{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;height:58px;background:rgba(255,255,255,.97);border-top:1px solid var(--trait);z-index:30;padding:0 6px;padding-bottom:env(safe-area-inset-bottom)}
  .nav-principale button{justify-content:center;padding:0 3px;border-bottom:0;border-top:2px solid transparent;font-size:11px}
  .nav-principale button:hover,.nav-principale button.actif{border-bottom:0;border-top-color:var(--orange)}
  .veille{margin-left:auto;padding:6px 9px;font-size:12px}
  .tete{padding:28px 0 18px;align-items:flex-start;margin-bottom:20px}
  h1{font-size:25px}
  .sous{justify-content:flex-start;width:100%;gap:7px}
  .sous span{padding:6px 8px;font-size:12px}
  .sous .retard{width:100%}
  .tuiles{grid-template-columns:1fr 1fr;gap:9px}
  .tuile{min-height:108px;padding:12px}
  .tuile .haut{align-items:flex-start}
  .tuile .slug{font-size:11px}
  .tuile .v{font-size:10.5px}
  .tuile .nom{font-size:14px}
  .workbench{margin-top:34px;gap:16px}
  .travail-onglets{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:3px}
  .travail-onglets button{padding:9px 8px;white-space:normal;font-size:13px;line-height:1.25}
  .workbench>section,.bas>section,.journal{padding:18px 14px}
  .section-entete{display:block}
  .section-entete .op-go{margin:0 0 16px}
  .choix-base-entete{padding:18px 16px 14px}
  .choix-base>.champ{width:calc(100% - 32px);margin:14px 16px 8px}
  .choix-base-liste{padding:0 16px 16px}
  .base-active{align-items:flex-start;flex-direction:column;gap:8px}
  .base-clusters{justify-content:flex-start}
  #sec-optims th:nth-child(2),#sec-optims td:nth-child(2),
  #sec-optims th:nth-child(3),#sec-optims td:nth-child(3){display:none}
  .op-redacteurs-liste{grid-template-columns:1fr}
  .bas{margin-top:32px}
  .outils{gap:10px;padding:10px}
  .champ{max-width:none;width:100%}
  .coche{font-size:13px}
  th{top:60px}
  .tiroir{width:100vw}
  .t-corps{background:#f8fafc}
  body{padding-bottom:58px}
  body[data-vue="activite"] .fil{grid-template-columns:1fr}
}

@media (max-width:420px){
  .tuiles{grid-template-columns:1fr}
  .tuile{min-height:96px}
  .veille span{display:none}
}