/* Charte reprise de canovanessa.com et de la maquette : barre latérale sur ordinateur, onglets en bas sur téléphone */
:root{
  --bg:#F4F1EA; --surface:#FBFAF6; --surface-2:#EFEBE1; --ink:#1A201D; --muted:#5C584F; --soft:#7E786C;
  --line:rgba(26,32,29,.12); --coral:#F0623E; --coral-ink:#fff; --coral-soft:rgba(240,98,62,.12);
  --bronze:#9E805F; --gold:#E6CC8E; --gold-soft:rgba(230,204,142,.35);
  --ok:#1F7A4D; --ok-soft:rgba(31,122,77,.12); --warn:#A86A12; --warn-soft:rgba(204,154,71,.2);
  --info:#3B5B8C; --info-soft:rgba(59,91,140,.12); --side:#1A201D; --side-fg:#F4F1EA; --side-muted:rgba(244,241,234,.62);
  --shadow:0 1px 2px rgba(26,32,29,.06),0 10px 30px rgba(26,32,29,.08);
  --f-display:"Space Grotesk",Helvetica,Arial,sans-serif; --f-accent:"Familjen Grotesk","Space Grotesk",sans-serif; --f-body:"Open Sans",Arial,sans-serif;
  --sig-filter:none;
  /* Une couleur par type de tâche, la même partout */
  --c-feu:#E0532F; --c-feu-soft:rgba(224,83,47,.10); --c-argent:#B8892B; --c-argent-soft:rgba(214,170,74,.16);
  --c-construire:#4F8A64; --c-construire-soft:rgba(79,138,100,.12); --c-admin:#8A8478; --c-admin-soft:rgba(138,132,120,.12);
}
@media (prefers-color-scheme:dark){:root{
  --bg:#141816; --surface:#1C211E; --surface-2:#252B27; --ink:#F1EDE4; --muted:#C2BBAD; --soft:#9A9386;
  --line:rgba(241,237,228,.13); --coral:#F27455; --coral-ink:#1A201D; --coral-soft:rgba(242,116,85,.16);
  --bronze:#C9A983; --gold-soft:rgba(230,204,142,.16); --ok:#5CC08E; --ok-soft:rgba(92,192,142,.14); --warn:#E3B062; --warn-soft:rgba(227,176,98,.16);
  --info:#8FB0E0; --info-soft:rgba(143,176,224,.14); --side:#0E110F; --side-fg:#F1EDE4; --side-muted:rgba(241,237,228,.58);
  --shadow:0 1px 2px rgba(0,0,0,.3),0 10px 30px rgba(0,0,0,.3); --sig-filter:invert(1); color-scheme:dark;
  --c-feu:#F27455; --c-feu-soft:rgba(242,116,85,.14); --c-argent:#E2BC6A; --c-argent-soft:rgba(226,188,106,.14);
  --c-construire:#7CC293; --c-construire-soft:rgba(124,194,147,.13); --c-admin:#A9A294; --c-admin-soft:rgba(169,162,148,.12)}}

*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--f-display);font-weight:600;letter-spacing:-.02em;line-height:1.15;margin:0;text-wrap:balance}
h1{font-size:clamp(1.65rem,3.4vw,2.2rem)} h2{font-size:1.3rem} h3{font-size:1.08rem}
p{margin:0}
a{color:var(--coral)}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--coral);outline-offset:2px;border-radius:6px}
em.acc{font-family:var(--f-accent);font-style:italic;font-weight:600;color:var(--coral)}
em.acc.gold{color:var(--gold)}
.eyebrow{font-family:var(--f-display);font-size:.74rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--bronze)}
.muted{color:var(--muted)} .soft{color:var(--soft);font-size:.88rem}
.block{display:block} .nowrap{white-space:nowrap} .num{font-variant-numeric:tabular-nums} .mt6{margin-top:6px} .disp{font-family:var(--f-display)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ico{width:20px;height:20px;flex:none}

/* Coquille */
.shell{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100%}
.side{background:var(--side);color:var(--side-fg);padding:22px 14px;display:flex;flex-direction:column;gap:6px;position:sticky;top:0;height:100vh;overflow-y:auto}
.brand{display:flex;align-items:center;gap:10px;padding:4px 8px 18px}
.brand small{display:block;color:var(--side-muted);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase}
.brand strong{font-family:var(--f-display);font-weight:600}
.mono{width:38px;height:38px;border-radius:50%;border:1.5px solid var(--gold);display:grid;place-items:center;font-family:var(--f-display);font-weight:600;font-size:.85rem;color:var(--gold);flex:none}
.mono.bronze,.mtop .mono{color:var(--bronze);border-color:var(--bronze)}
.mono.sm{width:32px;height:32px;font-size:.75rem}
.nav{display:flex;flex-direction:column;gap:2px}
.nav a{display:flex;align-items:center;gap:12px;color:var(--side-muted);padding:11px 12px;border-radius:10px;font-size:.95rem;font-weight:500;text-decoration:none}
.nav a:hover{color:var(--side-fg);background:rgba(244,241,234,.06)}
.nav a[aria-current="page"]{color:var(--side-fg);background:rgba(244,241,234,.1)}
.nav a[aria-current="page"] .ico{color:var(--coral)}
.count{margin-left:auto;background:var(--coral);color:#fff;font-size:.72rem;font-weight:700;border-radius:999px;padding:1px 8px}
.side .ask{margin-top:14px}
.side-foot{margin-top:auto;padding:14px 10px 0;border-top:1px solid rgba(244,241,234,.1);display:flex;gap:10px;align-items:center;font-size:.82rem;color:var(--side-muted)}
.side-foot .mini{font-size:.74rem}
.side-foot .out{margin-left:auto}
.side-foot .btn{color:var(--side-muted)}
.avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;object-position:50% 18%;flex:none;background:var(--surface-2)}
.dot{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex:none;font-family:var(--f-display);font-weight:700;font-size:.85rem;color:#fff;background:var(--bronze)}
.main{min-width:0;padding-block:28px 64px;padding-left:max(16px,min(4vw,40px),env(safe-area-inset-left,0px));padding-right:max(16px,min(4vw,40px),env(safe-area-inset-right,0px))}
.wrap{max-width:1040px;margin:0 auto;display:flex;flex-direction:column;gap:22px}
.wrap.narrow{max-width:760px}
.head{display:flex;flex-direction:column;gap:4px}
.head .sub{color:var(--muted);margin-top:4px;max-width:60ch}
.back{display:inline-flex;align-items:center;gap:4px;font-size:.9rem;text-decoration:none;color:var(--soft);margin-bottom:4px}
.back .ico{width:16px;height:16px}
.mtop{display:none;align-items:center;justify-content:space-between;gap:10px}
.bottom{display:none}
.fab{position:fixed;right:max(20px,env(safe-area-inset-right,0px));bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:30;box-shadow:var(--shadow)}

/* Éléments */
.card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px;min-width:0}
.card.hl{border-color:var(--coral);box-shadow:0 0 0 3px var(--coral-soft)}
.card.thin{padding:14px 18px}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;flex-wrap:wrap}
details.card>summary{cursor:pointer;list-style:none;display:flex;gap:8px;align-items:center;font-family:var(--f-display);font-weight:600}
details.card>summary::-webkit-details-marker{display:none}
details.card[open]>summary{margin-bottom:14px}
.stack{display:flex;flex-direction:column;gap:12px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.grow{flex:1;min-width:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:10px 16px;border-radius:999px;font-weight:600;font-size:.92rem;font-family:var(--f-display);white-space:nowrap;text-decoration:none;min-height:42px}
.btn:hover{border-color:var(--ink)}
.btn.primary{background:var(--coral);border-color:var(--coral);color:var(--coral-ink)}
.btn.primary:hover{filter:brightness(1.05)}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}
.btn.ghost{background:transparent;border-color:transparent;padding-inline:8px}
.btn.sm{padding:7px 12px;font-size:.84rem;min-height:36px}
.btn.big{padding:13px 20px;font-size:1rem}
.btn.block{width:100%}
.btn.danger{color:var(--coral)}
.btn.new{margin-top:14px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn .ico{width:18px;height:18px}
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:3px 10px;font-size:.76rem;font-weight:600;white-space:nowrap;background:var(--surface-2);color:var(--muted)}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.coral{background:var(--coral-soft);color:var(--coral)} .pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.warn{background:var(--warn-soft);color:var(--warn)} .pill.info{background:var(--info-soft);color:var(--info)}
.pill.gold{background:var(--gold-soft);color:var(--bronze)}
.tag-claude{display:inline-flex;align-items:center;gap:5px;font-size:.74rem;font-weight:600;color:var(--bronze);background:var(--gold-soft);padding:2px 8px;border-radius:6px}
.tag-claude .ico{width:14px;height:14px}
.list{display:flex;flex-direction:column}
.li{display:flex;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line);flex-wrap:wrap}
.li:first-child{border-top:0;padding-top:0}
.li .grow{flex:1 1 200px;min-width:0}
.li .t{font-weight:600;font-size:.95rem}
.li .s{color:var(--muted);font-size:.85rem}
.li .full{flex:1 1 100%}
a.li{color:inherit;text-decoration:none;flex-wrap:nowrap}
a.li:hover .t{color:var(--coral)}
.li.off{opacity:.55}
.li.new{background:var(--coral-soft);margin-inline:-10px;padding-inline:10px;border-radius:10px}
.li>.ico{color:var(--soft)}
.field{display:flex;flex-direction:column;gap:6px}
.field label,label.field{font-size:.85rem;font-weight:600;color:var(--muted)}
.input,textarea.input,select.input{width:100%;border:1px solid var(--line);background:var(--bg);border-radius:12px;padding:11px 13px;font-size:.95rem;font-weight:400;color:var(--ink)}
textarea.input{min-height:90px;resize:vertical;line-height:1.5}
.input:focus{outline:2px solid var(--coral-soft);border-color:var(--coral)}
.input.prio{width:auto;min-height:34px;height:34px;padding:2px 8px;font-size:.85rem}
.check{display:flex;gap:10px;align-items:center;cursor:pointer;font-size:.92rem}
.check input{width:20px;height:20px;accent-color:var(--bronze)}
.hint{display:flex;gap:10px;align-items:flex-start;background:var(--gold-soft);border-radius:14px;padding:12px 14px;font-size:.9rem;color:var(--ink)}
.hint .ico{color:var(--bronze);margin-top:2px}
.flash{padding:12px 16px;border-radius:14px;background:var(--ok-soft);color:var(--ok);font-weight:600}
.flash.warn{background:var(--warn-soft);color:var(--warn)}
details.more{border-top:1px solid var(--line);padding-top:12px;margin-top:4px}
details.more>summary{cursor:pointer;font-weight:600;font-family:var(--f-display);color:var(--coral);list-style:none;display:flex;gap:8px;align-items:center}
details.more>summary::-webkit-details-marker{display:none}
details.more[open]>summary{margin-bottom:12px}
.qadd{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;align-items:center}
.qadd>.input:first-of-type{flex:1 1 200px} .qadd>.input[type=date]{flex:0 1 170px}

/* Étapes */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.stp{display:flex;flex-direction:column;gap:6px;font-size:.78rem;color:var(--soft);line-height:1.3}
.stp i{display:block;height:5px;border-radius:999px;background:var(--surface-2)}
.stp.done{color:var(--ok)} .stp.done i{background:var(--ok)}
.stp.now{color:var(--ink);font-weight:700} .stp.now i{background:var(--coral)}

/* Cases à cocher (to-do, factures) */
.chk{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}
.chk:first-of-type{border-top:0}
.chk.done .t{text-decoration:line-through;color:var(--soft)}
.chk form{margin:0}
.chk .t{font-weight:500}
.box{width:22px;height:22px;border-radius:6px;border:1.5px solid var(--soft);background:transparent;flex:none;margin-top:2px;display:grid;place-items:center;color:#fff;padding:0;font-size:.8rem}
.box[aria-checked="true"]{background:var(--ok);border-color:var(--ok)}
.auto{color:var(--bronze)}
.meta{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin-top:6px;font-size:.85rem}
.inline{display:inline}
.when{color:var(--soft);font-weight:600} .when.hot{color:var(--coral)}
details.edit[open]{width:100%;padding:8px 0}
details.edit>summary{list-style:none;cursor:pointer;display:inline-flex}
details.edit>summary::-webkit-details-marker{display:none}
details.add{margin-top:14px} details.add>summary{list-style:none;display:inline-flex} details.add>summary::-webkit-details-marker{display:none} details.add[open]>summary{margin-bottom:12px}

/* Plannings et envoi */
.planning{padding:16px 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:12px}
.planning:first-of-type{border-top:0;padding-top:0}
.planning .card-h{margin:0}
.relu{display:flex;gap:8px;align-items:center;margin:0;font-size:.92rem}
blockquote{margin:0;padding:10px 14px;border-left:3px solid var(--warn);background:var(--warn-soft);border-radius:0 10px 10px 0}
.code{font-family:ui-monospace,Menlo,monospace;font-size:.9rem;background:var(--bg);padding:12px;border-radius:10px;word-break:break-all}
.step{display:flex;flex-direction:column;gap:8px;align-items:flex-start;padding-top:14px;border-top:1px solid var(--line)}
.mail-sig{border-top:1px dashed var(--line);padding-top:12px;display:flex;flex-direction:column;gap:4px;font-size:.86rem;color:var(--muted)}
.sig{height:30px;width:auto;filter:var(--sig-filter)}
.avatar-l{width:38px;height:38px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;font-family:var(--f-display);font-weight:600;flex:none}

/* Accueil client */
.c-hello{display:flex;gap:14px;align-items:center}
.c-hello img{width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:50% 20%;border:2px solid var(--surface);flex:none;box-shadow:var(--shadow)}
.c-hello h1{font-size:clamp(1.5rem,3vw,1.9rem)}
.vmsg{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--coral);border-radius:18px;padding:14px 16px}
.vmsg p{margin:4px 0 0;font-size:1rem;line-height:1.5}
.sec{display:flex;flex-direction:column;gap:12px}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.next{background:var(--coral);color:var(--coral-ink);border-radius:22px;padding:22px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow)}
.next .eyebrow{color:inherit;opacity:.85}
.next h2{font-size:1.45rem;line-height:1.2}
.next p{opacity:.92;font-size:.95rem;max-width:52ch}
.next .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.next .acts form{margin:0}
.next .btn{background:var(--surface);color:var(--ink);border-color:transparent}
.next .modifs>summary{list-style:none;cursor:pointer;display:inline-flex;gap:8px;align-items:center;font-family:var(--f-display);font-weight:600;font-size:.92rem;opacity:.95}
.next .modifs>summary::-webkit-details-marker{display:none}
.next .modifs[open]>summary{margin-bottom:10px}
.next .modifs .input{background:var(--surface)}
.allgood{display:flex;gap:14px;align-items:center;background:var(--ok-soft);color:var(--ink);border-radius:18px;padding:18px}
.allgood .ico{color:var(--ok);width:26px;height:26px}
a.nx{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}
a.nx .n{width:28px;height:28px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;font-family:var(--f-display);font-weight:700;font-size:.85rem;flex:none}
a.nx .t{display:block;font-weight:600;font-size:.95rem} a.nx .s{color:var(--soft);font-size:.8rem}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.tile{display:flex;flex-direction:column;align-items:flex-start;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:14px;min-width:0}
.tile .ti{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--surface-2);color:var(--bronze)}
.tile b{font-family:var(--f-display);font-size:1.15rem;line-height:1.15;letter-spacing:-.01em;font-weight:600}
.tile .tl2{font-size:.8rem;color:var(--soft);line-height:1.3}
.tile.t-coral .ti{background:var(--coral-soft);color:var(--coral)} .tile.t-coral b{color:var(--coral)}
.tile.t-ok .ti{background:var(--ok-soft);color:var(--ok)}
.tile.t-info .ti{background:var(--info-soft);color:var(--info)}

/* Connexion */
.login{min-height:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.login-art{position:relative;background:var(--side);overflow:hidden;min-height:260px}
.login-art img{width:100%;height:100%;object-fit:cover;object-position:52% 62%;display:block}
.login-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,18,16,.62) 0%,rgba(20,18,16,.15) 38%,rgba(20,18,16,0) 60%)}
.login-art .quote{position:absolute;z-index:1;left:28px;right:28px;top:26px;margin:0;color:#F4F1EA;font-family:var(--f-display);font-size:1.35rem;line-height:1.3;text-shadow:0 2px 20px rgba(0,0,0,.4)}
.login-form{display:flex;flex-direction:column;justify-content:center;gap:16px;padding-block:40px;padding-left:max(16px,6vw,env(safe-area-inset-left,0px));padding-right:max(16px,6vw,env(safe-area-inset-right,0px));max-width:560px}

/* Téléphone */
@media (max-width:820px){
  .shell{grid-template-columns:minmax(0,1fr)}
  .side{display:none}
  .main{padding-block:18px 120px}
  .mtop{display:flex}
  .bottom{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--surface);border-top:1px solid var(--line);padding:6px max(6px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(6px,env(safe-area-inset-left,0px))}
  .bottom a{display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center;line-height:1.15;font-size:.7rem;font-weight:600;color:var(--soft);padding:6px 2px;position:relative;text-decoration:none}
  .bottom a[aria-current="page"]{color:var(--coral)}
  .bottom .count{position:absolute;top:2px;left:calc(50% + 6px);margin:0;font-size:.62rem;padding:0 5px}
  .login{grid-template-columns:minmax(0,1fr)}
  .login-art{min-height:200px;max-height:240px}
  .login-art .quote{font-size:1.05rem}
}
@media (max-width:560px){
  .card{padding:16px}
  .steps{gap:5px}
  .stp{font-size:.68rem}
  .next{padding:18px}
  .next .acts .btn,.next .acts form{flex:1 1 auto}
  .next .acts form .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.eyebrow .pill{text-transform:none;letter-spacing:0;font-family:var(--f-body)}
/* Sur ordinateur, le bouton est déjà dans la barre latérale */
@media (min-width:821px){.fab{display:none}}

/* ---------- Étape 2 : l'espace client complet ---------- */
.head-row{display:flex;gap:12px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap}
.tabs{display:flex;gap:4px;overflow-x:auto;border-bottom:1px solid var(--line);scrollbar-width:none;margin-top:-6px}
.tabs::-webkit-scrollbar{display:none}
.tabs a{padding:11px 14px;font-weight:600;font-size:.92rem;color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap;font-family:var(--f-display);display:flex;gap:8px;align-items:center;text-decoration:none}
.tabs a[aria-current="page"]{color:var(--ink);border-color:var(--coral)}
.tabs .count{background:var(--coral);color:#fff;font-size:.7rem;border-radius:999px;padding:0 7px}
.edrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.edrow .t{font-weight:500} .edrow .s{color:var(--muted);font-size:.85rem}
.edform{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-top:12px}
.edform .wide{grid-column:1/-1}
.mw0{min-width:0} .ell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .nw{flex-wrap:nowrap;gap:6px}
.mods{display:flex;flex-wrap:wrap;gap:10px 22px}
.g3{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.kpi-box{display:flex;flex-direction:column;gap:6px;background:var(--surface-2);border-radius:14px;padding:12px 14px;font-size:.92rem}
.kpi-box .ico{color:var(--bronze)} .kpi-box b{font-family:var(--f-display);font-weight:600}
.idee{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:10px 0;border-bottom:1px solid var(--line)}
.idee .t{flex:1 1 220px;min-width:0}
.idee form{margin:0;gap:6px}
.composer{display:flex;gap:8px;margin-top:12px}
.composer .input{flex:1;min-width:0}
.tl{display:flex;flex-direction:column}
.tl .ev{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;padding:9px 0;border-top:1px solid var(--line);font-size:.92rem}
.tl .ev:first-child{border-top:0;padding-top:0}
.tl .ev b{font-family:var(--f-display);font-size:.8rem;color:var(--bronze);font-weight:600}
details.collab>summary{cursor:pointer;list-style:none;display:flex;gap:8px;align-items:center;font-family:var(--f-display);font-weight:600}
details.collab>summary::-webkit-details-marker{display:none}
details.collab[open]>summary{margin-bottom:14px}
.ch{font-size:.95rem;margin-bottom:4px}
.c-ok{color:var(--ok)} .c-soft{color:var(--soft)}
.lk{color:var(--bronze);display:grid}
.linkbtn{border:0;background:none;padding:0;color:var(--coral);font-weight:600;text-decoration:underline;text-underline-offset:2px;cursor:pointer;font:inherit;font-weight:600}
summary.linkbtn{list-style:none;display:inline-flex;gap:6px;align-items:center;text-decoration:none}
summary.linkbtn::-webkit-details-marker{display:none}
a.tile{color:inherit;text-decoration:none} a.tile:hover{border-color:var(--coral)}
.tile.t-info .ti{background:var(--info-soft);color:var(--info)}
.tile b.sm{font-size:1rem} .tile b.big{font-size:1.7rem;line-height:1} .mt-auto{margin-top:auto;padding-top:4px}
b.sm{font-size:.9rem;display:block;margin-top:10px}
.apercu{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--info-soft);border-radius:14px;padding:10px 14px;font-size:.9rem}
.apercu .ico{color:var(--info)} .apercu span{flex:1 1 220px}
.chk .n{color:var(--coral);font-weight:700;font-family:var(--f-display);min-width:22px}
/* Barre d'avancée et étapes du site */
.bar{height:8px;border-radius:99px;background:var(--surface-2);overflow:hidden}
.bar i{display:block;height:100%;background:var(--ok);border-radius:99px}
ol.etapes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.et{display:flex;gap:12px;align-items:flex-start;padding:14px 0;border-top:1px solid var(--line)}
.et:first-child{border-top:0}
.et .num{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--surface-2);font-family:var(--f-display);font-weight:700;font-size:.85rem;color:var(--muted)}
.et.fait .num{background:var(--ok-soft);color:var(--ok)}
.et.en_cours .num{background:var(--info-soft);color:var(--info)}
.et.act .num{background:var(--coral);color:var(--coral-ink)}
.et.act{background:var(--coral-soft);margin-inline:-12px;padding-inline:12px;border-radius:14px;border-top-color:transparent}
.et.fait .et-h b{color:var(--muted)}
.et .grow{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.et-h{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.et .muted{margin:0;font-size:.92rem}
.et form{margin:0}
.et .modifs>summary{margin-top:2px}
.et-adm{border-bottom:1px solid var(--line)} .et-adm .edrow{border-bottom:0}
.et-adm details.edit{padding-bottom:8px}
@media (max-width:560px){.tl .ev{grid-template-columns:78px minmax(0,1fr)}.edrow{grid-template-columns:1fr}.edrow>.row,.edrow>form{justify-self:start}}
@media (max-width:420px){.hide-s{display:none}}

/* ---------- Étape 3 : ton cockpit ---------- */
.c-coral{color:var(--coral)} .ta-r{text-align:right} .between{justify-content:space-between} .num.big{font-size:1.35rem}
.sprint{border:1.5px solid var(--coral);box-shadow:var(--shadow)}
.monthly{border-left:4px solid var(--gold)} .monthly.ok{border-left-color:var(--ok)}
.focus-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}
.focus-card .fc-n{width:42px;height:42px;border-radius:12px;background:var(--surface-2);display:grid;place-items:center;font-size:1.3rem}
.focus-card h3{margin-top:2px}
.focus-card .acts{margin-top:10px}
.focus-card .acts form{margin:0}
.focus-card.done{opacity:.65} .focus-card.done h3{text-decoration:line-through}
.rules{margin:10px 0;padding-left:20px;display:flex;flex-direction:column;gap:6px;font-size:.92rem}
.chk .meta form.inline{display:inline-flex;gap:6px;align-items:center}
.pipe{display:flex;flex-wrap:wrap;gap:8px}
.pipe a{display:inline-flex;gap:6px;align-items:center;border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:6px 12px;font-size:.88rem;color:var(--ink);text-decoration:none}
.pipe a b{font-family:var(--f-display);color:var(--soft)}
.pipe a[aria-current]{background:var(--ink);color:var(--bg);border-color:var(--ink)} .pipe a[aria-current] b{color:inherit;opacity:.75}
.dossier{scroll-margin-top:16px}
.meter{display:flex;gap:10px;align-items:center;margin:10px 0 2px} .meter .bar{flex:1}
.mbars{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:100%;gap:6px;height:70px;margin:6px 0 8px}
.mbars.big{height:120px}
.mb{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;height:100%}
.mb i{width:100%;min-height:2px;max-height:calc(100% - 18px);background:var(--gold);border-radius:4px 4px 0 0}
.mb.now i{background:var(--coral)}
.mb span{font-size:.64rem;color:var(--soft)}
.months{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}
.tbl-wrap{overflow-x:auto;margin:6px 0 10px}
.tbl{border-collapse:collapse;width:100%;font-size:.86rem;font-variant-numeric:tabular-nums}
.tbl th,.tbl td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.tbl th[scope="row"]{text-align:left;font-weight:600}
.tbl thead th{color:var(--soft);font-weight:600} .tbl .now{color:var(--coral)}
.tbl tr.tot th,.tbl tr.tot td{font-weight:700;border-bottom:0}
.chipset{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:99px;padding:4px 12px;font-size:.86rem;cursor:pointer;background:var(--surface)}
.chip:has(input:checked){background:var(--ink);color:var(--bg);border-color:var(--ink)}
.chip input{accent-color:var(--coral);margin:0}
fieldset.field{border:0;padding:0;margin:0;min-width:0} fieldset.field legend{padding:0;margin-bottom:6px}
.toggle{display:flex;align-items:center;gap:12px;font-weight:600;cursor:pointer}
.toggle input{position:absolute;opacity:0;pointer-events:none}
.toggle span{position:relative;width:44px;height:26px;border-radius:99px;background:var(--surface-2);border:1px solid var(--line);flex:none}
.toggle span::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--soft);transition:transform .2s}
.toggle input:checked+span{background:var(--coral);border-color:var(--coral)}
.toggle input:checked+span::after{transform:translateX(18px);background:#fff}
.toggle input:focus-visible+span{outline:2px solid var(--coral);outline-offset:2px}
.choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;margin:6px 0 10px}
.choices form{margin:0}
.choice{display:flex;flex-direction:column;gap:2px;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:16px;padding:14px 16px;width:100%;color:var(--ink)}
.choice:hover{border-color:var(--coral)} .choice span{font-size:.86rem;color:var(--soft)}
.dispo{padding:12px 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.dispo:first-of-type{border-top:0} .dispo .acts form{margin:0}
.dossier .acts form,.card .acts form{margin:0}
.absent{background:var(--info-soft)}
.acts{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start;margin-top:10px}
.qadd>select.input{flex:0 1 200px}

/* Barres : largeur ou hauteur par pas de 5 % */
.bar i.p0{width:0%} .mb i.p0{height:0%}
.bar i.p5{width:5%} .mb i.p5{height:5%}
.bar i.p10{width:10%} .mb i.p10{height:10%}
.bar i.p15{width:15%} .mb i.p15{height:15%}
.bar i.p20{width:20%} .mb i.p20{height:20%}
.bar i.p25{width:25%} .mb i.p25{height:25%}
.bar i.p30{width:30%} .mb i.p30{height:30%}
.bar i.p35{width:35%} .mb i.p35{height:35%}
.bar i.p40{width:40%} .mb i.p40{height:40%}
.bar i.p45{width:45%} .mb i.p45{height:45%}
.bar i.p50{width:50%} .mb i.p50{height:50%}
.bar i.p55{width:55%} .mb i.p55{height:55%}
.bar i.p60{width:60%} .mb i.p60{height:60%}
.bar i.p65{width:65%} .mb i.p65{height:65%}
.bar i.p70{width:70%} .mb i.p70{height:70%}
.bar i.p75{width:75%} .mb i.p75{height:75%}
.bar i.p80{width:80%} .mb i.p80{height:80%}
.bar i.p85{width:85%} .mb i.p85{height:85%}
.bar i.p90{width:90%} .mb i.p90{height:90%}
.bar i.p95{width:95%} .mb i.p95{height:95%}
.bar i.p100{width:100%} .mb i.p100{height:100%}
.when{white-space:nowrap;font-size:.85rem}

/* ---------- v4 : une journée qui se lit en un coup d'œil ---------- */
.cat-feu{--cc:var(--c-feu);--cs:var(--c-feu-soft)} .cat-argent{--cc:var(--c-argent);--cs:var(--c-argent-soft)}
.cat-construire{--cc:var(--c-construire);--cs:var(--c-construire-soft)} .cat-admin{--cc:var(--c-admin);--cs:var(--c-admin-soft)}
.resume{display:flex;gap:10px;flex-wrap:wrap;margin-top:-6px}
.rs{display:flex;align-items:baseline;gap:8px;padding:10px 16px;border-radius:14px;background:var(--surface);border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.rs b{font-family:var(--f-display);font-size:1.5rem;line-height:1;font-weight:600}
.rs span{font-size:.86rem;color:var(--muted)}
.rs:hover{border-color:var(--ink)}
.rs.hot{background:var(--c-feu-soft);border-color:transparent} .rs.hot b{color:var(--c-feu)}
.rs.gold{background:var(--c-argent-soft);border-color:transparent} .rs.gold b{color:var(--c-argent)}
.day{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:22px;align-items:start}
.day-main,.day-side{display:flex;flex-direction:column;gap:18px;min-width:0}
.day-side{position:sticky;top:20px}
.side-card{padding:16px}
.side-card h3{font-size:1rem;display:flex;gap:8px;align-items:center}
.side-card .card-h{margin-bottom:10px}
.side-card .li{padding:10px 0}
.side-card .li .t{font-size:.92rem}
.side-note{display:flex;gap:8px;align-items:flex-start}
details.side-card>summary{cursor:pointer;list-style:none;display:flex;gap:10px;align-items:center;font-family:var(--f-display);font-weight:600}
details.side-card>summary::-webkit-details-marker{display:none}
details.side-card[open]>summary{margin-bottom:12px}
details.side-card>summary .pill{margin-left:auto}
details.monthly>summary h3{margin-top:2px}
/* Focus : trois grandes cartes de couleur */
.focus-card{border:0;border-left:6px solid var(--cc,var(--line));background:linear-gradient(90deg,var(--cs,transparent),var(--surface) 70%)}
.focus-card .fc-n{background:var(--surface);box-shadow:0 0 0 2px var(--cc,var(--line)) inset}
.focus-card .eyebrow{color:var(--cc,var(--bronze))}
.focus-card h3{font-size:1.18rem}
.focus-card .acts{align-items:center}
/* Une tâche = case, texte, date. Le reste est derrière « ⋯ » */
.tasks{display:flex;flex-direction:column}
.task{display:flex;gap:10px;align-items:flex-start;padding:10px 4px 10px 12px;border-top:1px solid var(--line);position:relative}
.task:first-child{border-top:0}
.task::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:4px;border-radius:4px;background:var(--cc,var(--line))}
.task .t{font-weight:500;line-height:1.4}
.task.urgent .t{font-weight:700}
.task.done .t{text-decoration:line-through;color:var(--soft)} .task.done::before{opacity:.35}
.task form{margin:0}
.task .meta{margin-top:3px;gap:4px 10px}
.task>details.opts{margin-left:auto}
details.opts{position:relative}
details.opts>summary{list-style:none;min-height:32px;padding:4px 6px;color:var(--soft)}
details.opts>summary::-webkit-details-marker{display:none}
details.opts[open]>summary{color:var(--ink)}
.opts-b{position:absolute;right:0;top:calc(100% + 4px);z-index:20;width:min(340px,86vw);background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:10px}
.focus-card .opts-b{left:auto;right:0}
details.fold{margin-top:10px;border-top:1px solid var(--line);padding-top:10px}
details.fold>summary{cursor:pointer;list-style:none;display:flex;gap:8px;align-items:center;font-family:var(--f-display);font-weight:600;color:var(--muted);font-size:.95rem}
details.fold>summary::-webkit-details-marker{display:none}
details.fold>summary .ico{width:18px;height:18px}
details.fold[open]>summary{margin-bottom:6px}
.imprevu{margin:0 0 12px;padding:10px;border-radius:14px;background:var(--bg)}
.imprevu>select.input{flex:0 1 230px}
/* Rappels : seul le très urgent est rouge */
.rp{gap:10px;flex-wrap:nowrap} .rp a{color:inherit;text-decoration:none} .rp a:hover .t{color:var(--coral)}
.pdot{width:10px;height:10px;border-radius:50%;flex:none;background:var(--line)}
.rp.p1 .pdot{background:var(--c-feu);box-shadow:0 0 0 4px var(--c-feu-soft)} .rp.p2 .pdot{background:var(--c-argent)}
.rp.p1 .t{color:var(--c-feu)}
.star{color:var(--c-argent)}
.opco-card{border-left:4px solid var(--c-feu)}
@media (max-width:980px){.day{grid-template-columns:minmax(0,1fr)}.day-side{position:static}}
@media (max-width:560px){.rs{padding:8px 12px}.rs b{font-size:1.25rem}.focus-card{padding:16px 14px}.opts-b{position:fixed;left:12px;right:12px;top:auto;bottom:calc(76px + env(safe-area-inset-bottom,0px));width:auto}}
/* Rappels par importance */
.rprio.p1{border-left:4px solid var(--c-feu)} .rprio.p2{border-left:4px solid var(--c-argent)}
/* OPCO : dossiers prioritaires */
.starbtn{color:var(--soft)} .starbtn.on{color:var(--c-argent);border-color:var(--c-argent);background:var(--c-argent-soft)}
.dossier.prio{border-left:4px solid var(--c-argent)}
/* Écoles : une école = un accordéon */
details.ecole>summary{display:flex;gap:14px;align-items:center;cursor:pointer;list-style:none}
details.ecole>summary::-webkit-details-marker{display:none}
details.ecole>summary h3{margin:0}
details.ecole[open]>summary{margin-bottom:10px;padding-bottom:12px;border-bottom:1px solid var(--line)}
details.ecole>b.sm{display:block;margin-top:16px}
.chev{color:var(--soft);transition:transform .2s;flex:none}
details[open]>summary .chev{transform:rotate(180deg)}
.ta-r{text-align:right}
.mois-l{display:flex;flex-direction:column;margin-bottom:10px}
details.mo{border-top:1px solid var(--line)}
details.mo>summary{display:grid;grid-template-columns:130px minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 0;cursor:pointer;list-style:none}
details.mo>summary::-webkit-details-marker{display:none}
details.mo.now .mo-n{color:var(--coral)}
.mo-n{font-weight:600} .mo-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
details.mo[open]{padding-bottom:10px} details.mo .qadd{margin-top:0}
.qadd>.input.euro,.input.euro{flex:0 1 110px;max-width:130px}
/* Stats : captures d'écran */
.caps{display:flex;flex-direction:column;gap:8px;padding:10px 0;border-top:1px solid var(--line)}
.caps-l{display:flex;flex-wrap:wrap;gap:8px}
.cap{position:relative;display:inline-flex;flex-direction:column;gap:4px}
.cap img{width:96px;height:96px;object-fit:cover;border-radius:10px;border:1px solid var(--line);display:block}
.cap>a{display:inline-flex;align-items:center;gap:6px;color:inherit;font-size:.82rem}
/* Fiche client */
ul.inclus{margin:6px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:4px}
.notes textarea{background:var(--surface-2)}
/* Revenus : groupes du tableau */
.tbl tr.gh th,.tbl tr.gh td{font-weight:700;background:var(--surface-2);border-bottom:0}
.tbl tr.sub th[scope="row"]{font-weight:400;padding-left:18px;color:var(--muted)}
.tbl tr.sub td{color:var(--muted)}
@media (max-width:560px){details.mo>summary{grid-template-columns:90px minmax(0,1fr) auto}.cap img{width:78px;height:78px}}
/* Le libellé reste visible quand on fait défiler les mois */
.tbl th[scope="row"]{position:sticky;left:0;background:var(--surface);z-index:1;white-space:normal;min-width:130px;max-width:190px}
.tbl tr.gh th[scope="row"]{background:var(--surface-2)}
.tbl thead th:first-child{position:sticky;left:0;background:var(--surface);z-index:2}
/* Glisser dans le focus */
[data-drag]{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;cursor:grab}
[data-drag].dragging{opacity:.4}
body.drag-on,body.drag-on *{cursor:grabbing}
.drag-ghost{position:fixed;left:0;top:0;z-index:100;pointer-events:none;max-width:280px;padding:10px 14px;border-radius:14px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);font-weight:600;font-size:.92rem;line-height:1.3}
.focus-card{transition:box-shadow .15s,transform .15s}
body.drag-on .focus-card[data-drop]{outline:2px dashed var(--cc);outline-offset:3px}
.focus-card.drop-on{transform:scale(1.02);box-shadow:0 0 0 3px var(--cc),var(--shadow)}
.focus-vide{background:transparent;border:2px dashed var(--line);border-left:6px solid var(--cc)}
.focus-vide p{margin:4px 0 0}
.drag-tip{margin:-6px 0 10px}
@media (hover:none){.drag-tip::after{content:" (appui long au doigt)"}}
.vers-focus{display:flex;align-items:center;gap:6px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:10px}
.vers-focus form{margin:0}
.rp>details.opts{margin-left:2px}
/* Finances OPCO, repliées en bas de la journée */
details.finances>summary .s{display:block;font-family:var(--f-body,inherit);font-weight:400;font-size:.82rem;color:var(--soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
details.finances>summary b{font-size:1rem}
details.finances .fold>summary .num{margin-left:auto}
details.finances>.btn{margin-top:10px}
/* Revenus : ton Google Sheet dans la page */
.sheet-frame{position:relative;height:min(78vh,760px);min-height:420px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;margin:4px 0 10px}
.sheet-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.routine{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:8px 0 0;font-size:.9rem;color:var(--muted)}
/* Le statut de Vanessa, en haut de l'espace client */
.statut{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0 0 14px;padding:10px 14px;border-radius:14px;background:var(--surface);border:1px solid var(--line);font-size:.9rem}
.statut span:not(.sdot){color:var(--muted)}
.sdot{width:10px;height:10px;border-radius:50%;background:var(--soft);flex:none}
.statut.dispo .sdot{background:#3E9B62;box-shadow:0 0 0 4px rgba(62,155,98,.16)}
.statut.occupee .sdot{background:var(--c-argent)}
.statut.absente{border-left:4px solid var(--coral)} .statut.absente .sdot{background:var(--coral)}
/* Rappels de la colonne : le texte en entier, la date et les boutons dessous */
.side-card .rp{flex-wrap:wrap;row-gap:4px}
.side-card .rp>a.grow{flex:1 1 calc(100% - 24px)}
.side-card .rp>.when{margin-left:20px;margin-right:auto;font-size:.82rem}
/* Mails triés dans Ma journée */
.ml{flex-wrap:nowrap;gap:10px}
.ml .dot{background:transparent;font-size:1rem}
.ml a{color:inherit;text-decoration:none} .ml a:hover .t{color:var(--coral)}
.ml .s{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cap .pill{font-size:.7rem;padding:2px 6px}
.heures{align-items:flex-end}.heures .field{flex:none}.heures .input{width:90px;flex:none;height:auto}
/* Mails reçus pendant une formation */
.ml.pdt{border-left:3px solid var(--warn);padding-left:8px}
.ml .pdt-l{color:var(--warn);font-weight:600}

/* ---------- v6 : chaque page a sa couleur, ses compteurs et des titres qui ressortent ---------- */
:root{--c-bleu:#3B6FB0;--c-bleu-soft:rgba(59,111,176,.11);--c-vert:#2F8A5B;--c-vert-soft:rgba(47,138,91,.11);--c-violet:#7A5BA6;--c-violet-soft:rgba(122,91,166,.11)}
@media (prefers-color-scheme:dark){:root{--c-bleu:#8DB3E8;--c-bleu-soft:rgba(141,179,232,.13);--c-vert:#6CC796;--c-vert-soft:rgba(108,199,150,.13);--c-violet:#B9A0DE;--c-violet-soft:rgba(185,160,222,.13)}}
body{--pa:var(--coral);--pa-soft:var(--coral-soft)}
.pg-clients,.pg-client,.pg-mail{--pa:var(--c-bleu);--pa-soft:var(--c-bleu-soft)}
.pg-opco,.pg-revenus{--pa:var(--c-argent);--pa-soft:var(--c-argent-soft)}
.pg-ecoles{--pa:var(--c-vert);--pa-soft:var(--c-vert-soft)}
.pg-rappels{--pa:var(--c-feu);--pa-soft:var(--c-feu-soft)}
.pg-dispos{--pa:var(--c-violet);--pa-soft:var(--c-violet-soft)}
.pg-modeles,.pg-modele,.pg-journal,.pg-reglages,.pg-plus{--pa:var(--bronze);--pa-soft:var(--gold-soft)}
/* La page dans la barre de gauche prend sa couleur */
.bo .nav a[aria-current="page"]{box-shadow:inset 3px 0 0 var(--pa)}
.bo .nav a[aria-current="page"] .ico{color:var(--pa)}
/* En-tête : un bandeau de la couleur de la page (Ma journée garde le sien) */
.bo:not(.pg-admin) .head{position:relative;padding:22px 24px 20px;border-radius:22px;background:linear-gradient(115deg,var(--pa-soft),var(--surface) 78%);border:1px solid var(--line);overflow:hidden}
.bo:not(.pg-admin) .head::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--pa)}
.bo:not(.pg-admin) .head .eyebrow{color:var(--pa)}
.bo:not(.pg-admin) .head h1{font-size:clamp(1.8rem,3.8vw,2.5rem)}
.bo:not(.pg-admin) .head .resume{margin-top:14px}
.bo:not(.pg-admin) .head .rs{background:var(--surface)}
.rs.blue{background:var(--c-bleu-soft);border-color:transparent} .rs.blue b{color:var(--c-bleu)}
.rs.green{background:var(--c-vert-soft);border-color:transparent} .rs.green b{color:var(--c-vert)}
.bo .head .rs.hot{background:var(--c-feu-soft)} .bo .head .rs.gold{background:var(--c-argent-soft)}
.bo .head .rs.blue{background:var(--c-bleu-soft)} .bo .head .rs.green{background:var(--c-vert-soft)}
.head-row{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
/* Titres de section : une barre de couleur, le compte à droite */
.bo:not(.pg-admin) .sec-h h2{display:flex;align-items:center;gap:10px}
.bo:not(.pg-admin) .sec-h h2::before{content:"";width:5px;height:1.1em;border-radius:3px;background:var(--sc,var(--pa))}
.bo:not(.pg-admin) .card-h h3 .ico,.bo:not(.pg-admin) details.card>summary>.ico{color:var(--pa)}
.bo:not(.pg-admin) .tabs a[aria-current="page"]{border-color:var(--pa);color:var(--pa)}
.bo:not(.pg-admin) .btn.primary{background:var(--coral)}
/* Pastilles des clients : une teinte chacun */
.dot.hue0{background:#C0623F} .dot.hue1{background:#3B6FB0} .dot.hue2{background:#2F8A5B} .dot.hue3{background:#8A5BA6} .dot.hue4{background:#B8892B} .dot.hue5{background:#3F8C93}
.dot.big{width:56px;height:56px;border-radius:16px;font-size:1.4rem}
/* Clients : des tuiles */
.ctiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.ctile{display:flex;gap:14px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px;text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
.ctile:hover{border-color:var(--pa);transform:translateY(-1px)} .ctile:hover .t{color:var(--pa)}
.ctile .t{font-family:var(--f-display);font-weight:600;font-size:1.05rem}
.ctile .s{color:var(--muted);font-size:.86rem;margin-top:2px}
.ctile-f{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ctile-f .pill .ico{width:13px;height:13px}
.ctile>.ico{color:var(--soft);margin-top:2px}
.ctile.due{border-left:5px solid var(--c-argent)}
.ctile.off{opacity:.55}
/* OPCO : une couleur par groupe, partout (filtres, titres, cartes) */
.g-prospects{--sc:var(--c-bleu);--ss:var(--c-bleu-soft)} .g-cours{--sc:var(--c-argent);--ss:var(--c-argent-soft)}
.g-rembours{--sc:var(--c-feu);--ss:var(--c-feu-soft)} .g-fini{--sc:var(--c-vert);--ss:var(--c-vert-soft)}
.pipe a[class^="g-"]::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--sc)}
.pipe a[class^="g-"][aria-current]{background:var(--sc);border-color:var(--sc);color:#fff}
.pipe a[class^="g-"][aria-current]::before{background:#fff}
.sec[class*="g-"] .dossier{border-left:5px solid var(--sc)}
.sec[class*="g-"] .dossier.prio{border-left-width:8px}
details.dossier>summary{cursor:pointer;list-style:none;margin-bottom:0;flex-wrap:wrap}
details.dossier>summary::-webkit-details-marker{display:none}
details.dossier[open]>summary{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
details.dossier>summary .meter.mini{flex:1 1 100%;margin:4px 0 0}
details.dossier:not([open]):hover{border-color:var(--sc,var(--line));background:linear-gradient(90deg,var(--ss,transparent),var(--surface) 55%)}
.meter.mini .bar{height:6px;max-width:260px}
.meter.mini .bar i{background:var(--sc,var(--pa))}
/* Écoles : vert pour les écoles, bronze pour les organismes */
.t-ecole{--sc:var(--c-vert);--ss:var(--c-vert-soft)} .t-organisme{--sc:var(--bronze);--ss:var(--gold-soft)}
.sec[class*="t-"] details.ecole{border-left:5px solid var(--sc)}
details.ecole>summary h3{font-size:1.15rem}
details.ecole>summary .ta-r b{font-family:var(--f-display);font-size:1.3rem;color:var(--sc)}
details.ecole:not([open]):hover{background:linear-gradient(90deg,var(--ss),var(--surface) 55%)}
details.ecole .meter.mini{margin-top:8px}
.next-t{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:.88rem;font-weight:600;margin-top:4px}
.next-t .ico{width:16px;height:16px;color:var(--sc,var(--pa))}
/* Rappels : la couleur de l'importance sur toute la carte */
.rprio{border-left:5px solid var(--line)}
.rprio.p1{border-left-color:var(--c-feu)} .rprio.p2{border-left-color:var(--c-argent)}
.rprio .card-h h3{font-size:1.15rem}
/* Dispos */
.pg-dispos .dispo{padding:14px 16px;border:1px solid var(--line);border-left:5px solid var(--c-vert);border-radius:14px;margin-top:10px}
.pg-dispos .dispo.pris{border-left-color:var(--c-bleu);background:var(--c-bleu-soft)}
.pg-dispos .dispo:has(.pill.warn){border-left-color:var(--c-feu)}
@media (max-width:720px){
  .bo:not(.pg-admin) .head{padding:18px 16px 16px;border-radius:18px}
  .ctiles{grid-template-columns:1fr}
  .bo:not(.pg-admin) .head .resume{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .bo:not(.pg-admin) .head .rs{flex-direction:column;align-items:flex-start;gap:2px;padding:9px 12px}
  .bo:not(.pg-admin) .head .rs b{font-size:1.2rem}
  .bo:not(.pg-admin) .head .rs span{font-size:.78rem;line-height:1.3}
  .dot.big{width:46px;height:46px;font-size:1.15rem}
}

/* v10 : shootings à venir (Clients), suivi des visites */
.shoots{border-left:4px solid var(--coral)}
.shoots .li{gap:12px;color:inherit;text-decoration:none;flex-wrap:wrap}
.shoots .li:hover .t{color:var(--coral)}
.shoots .li .when{margin-left:auto}
.shoots .li>.ico{width:16px;height:16px;color:var(--muted)}
@media (max-width:640px){.shoots .li .when{margin-left:0}}

/* Un client avec beaucoup de rubriques : le menu du bas défile de côté au lieu de tout serrer */
@media (max-width:820px){
  .bottom.many{grid-auto-columns:minmax(68px,1fr);overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
  .bottom.many::-webkit-scrollbar{display:none}
}

/* ---------- v10 : trois niveaux, quatre domaines en couleur ---------- */
.cat-urgent{--cc:var(--c-feu);--cs:var(--c-feu-soft)} .cat-business{--cc:var(--c-violet);--cs:var(--c-violet-soft)}
.dom-clients{--cc:var(--c-bleu);--cs:var(--c-bleu-soft)} .dom-opco{--cc:var(--c-argent);--cs:var(--c-argent-soft)}
.dom-ecoles{--cc:var(--c-vert);--cs:var(--c-vert-soft)} .dom-business{--cc:var(--c-violet);--cs:var(--c-violet-soft)}
.dtag{display:inline-flex;align-items:center;font-size:.74rem;font-weight:600;color:var(--cc);background:var(--cs);padding:1px 8px;border-radius:6px}
.dom-filtre{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 2px}
.dchip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:99px;padding:4px 12px;font:inherit;font-size:.86rem;cursor:pointer;background:var(--surface);color:var(--ink)}
.dchip i{width:9px;height:9px;border-radius:50%;background:var(--cc)}
.dchip.on{background:var(--ink);color:var(--bg);border-color:var(--ink)} .dchip.on .soft{color:inherit}
.niv-g{margin-top:14px} .niv-h{font-size:.9rem;display:flex;align-items:center;gap:8px;margin:0 0 2px;color:var(--muted)}
.niv-urgent .niv-h{color:var(--c-feu)} .niv-argent .niv-h{color:var(--c-argent)}
.task[hidden],.niv-g[hidden]{display:none}

/* ---------- v10 : messagerie ---------- */
.msgr{display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr);gap:18px;align-items:start}
.msgr-l{padding:10px;position:sticky;top:20px}
.msgr-l .li{padding:10px;border-radius:12px;text-decoration:none;color:var(--ink);border-top:0}
.msgr-l .li.on{background:var(--c-bleu-soft)}
.msgr-l .li:hover{background:var(--surface-2)}
.ell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fil{display:flex;flex-direction:column;gap:10px;margin:6px 0 16px}
.bulle{max-width:88%;padding:12px 14px;border-radius:16px;background:var(--surface-2)}
.bulle.moi{margin-left:auto;background:var(--coral-soft);border-bottom-right-radius:4px}
.bulle.autre{border-bottom-left-radius:4px}
.bulle-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:.84rem;margin-bottom:4px}
.bulle-h .ico{width:14px;height:14px;vertical-align:-2px}
.bulle p{margin:0;white-space:normal;overflow-wrap:anywhere}
.msg-rep{border-top:1px solid var(--line);padding-top:14px}
.dlg{width:min(580px,calc(100vw - 24px));max-height:calc(100dvh - 32px);overflow:auto;border:0;border-radius:20px;padding:20px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
.dlg::backdrop{background:rgba(20,24,22,.45)}
.dlg .card-h form{margin:0}
.notif-att ul{margin:6px 0 10px;padding-left:18px}
.notif-att .row form{margin:0}
/* Le bouton d'un petit formulaire d'ajout passe sur sa propre ligne : son texte ne déborde plus */
.edform>.btn{grid-column:1/-1;justify-self:end;white-space:normal;text-align:center}
@media (max-width:820px){.msgr{grid-template-columns:1fr}.msgr-l{position:static}.edform>.btn{justify-self:stretch;justify-content:center}}

/* ---------- v10 : OPCO, bouton en haut et dossiers sur deux colonnes ---------- */
.bo:not(.pg-admin) .head.has-cta{padding-right:220px}
.head-cta{position:absolute;top:22px;right:24px;z-index:1}
.dgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.dgrid>.dossier{margin:0}
@media (max-width:1100px){.dgrid{grid-template-columns:1fr}}
@media (max-width:820px){.bo:not(.pg-admin) .head.has-cta{padding-right:16px}.head-cta{position:static;margin-bottom:10px;align-self:flex-start}}
.pnote{font-size:.86rem;color:var(--muted);background:var(--surface-2);border-radius:8px;padding:4px 8px;margin-top:4px;white-space:normal}
.chk .edit.pn{position:relative} .chk .edit.pn[open]>form{position:absolute;right:0;z-index:5;width:min(320px,80vw);background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px;box-shadow:var(--shadow)}
.chk>.btn,.chk>form,.chk>details{flex:none}
.drive-l{display:inline-flex;align-items:center;gap:3px;font-weight:600}
.drive-l .ico,.dossier .pill .ico{width:14px;height:14px}
.ask-docs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:10px 0}
.ask-docs .btn{background:var(--c-argent-soft)}
.dsuivi{border-top:1px solid var(--line);margin-top:10px}
.dsuivi .li{padding:8px 0;font-size:.9rem}

/* ---------- v12 : Mes contenus ---------- */
.pg-contenus,.pg-messagerie{--pa:var(--c-violet);--pa-soft:var(--c-violet-soft)}
.mq-canovanessa{--cc:var(--c-violet);--cs:var(--c-violet-soft)} .mq-formation{--cc:var(--c-vert);--cs:var(--c-vert-soft)}
.rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.rcard{padding:14px 16px;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.rcard h3{font-size:1rem}
.rcard .meter{width:100%}
.rcard.ok{border-color:var(--ok)}
.ct{display:flex;gap:10px;align-items:flex-start;padding:12px 0;border-top:1px solid var(--line)}
.ct:first-of-type{border-top:0}
.ct .t{font-weight:600}
.ct .meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin-top:4px;font-size:.86rem}
.ct .meta a{display:inline-flex;align-items:center;gap:3px}
.ct .meta .ico{width:14px;height:14px}
.ct-a{display:flex;align-items:center;gap:6px;flex:none}
.ct-a form{margin:0}
.ct-a .input{width:auto;padding:6px 8px;font-size:.86rem}
.ct-a details.edit{position:relative}
.ct-a details.edit[open]>.pop{position:absolute;right:0;top:40px;z-index:6;width:min(340px,86vw);background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:var(--shadow)}
.ct-a .pop{display:flex;flex-direction:column;gap:8px} .ct-a .pop .input{width:100%;font-size:1rem;padding:10px 12px}
.brief{margin-top:16px;padding:14px;border-radius:14px;background:var(--surface-2);display:flex;flex-direction:column;gap:8px}
.brief p{margin:0}
.mono-in{font-family:ui-monospace,Menlo,monospace;font-size:.8rem}
@media (max-width:560px){.ct{flex-direction:column}.ct-a{width:100%;justify-content:space-between}.ct-a details.edit[open]>.pop{position:fixed;left:12px;right:12px;top:auto;bottom:calc(76px + env(safe-area-inset-bottom,0px));width:auto;max-height:70dvh;overflow:auto}}
/* Double authentification */
.code-in{font-family:ui-monospace,Menlo,monospace;letter-spacing:.15em;font-size:1.2rem;max-width:220px}
.cle-a2f code{display:inline-block;font-size:1.05rem;letter-spacing:.06em;padding:10px 12px;border-radius:10px;background:var(--surface-2);overflow-wrap:anywhere;max-width:100%}
.codes{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:6px;margin-top:8px}
.codes code{padding:6px 8px;border-radius:8px;background:var(--surface);font-size:.95rem;text-align:center}
.warn-box{background:var(--warn-soft)}
/* ---------- v13 : Je souhaite devenir client ---------- */
.dc{max-width:760px;margin:0 auto;padding:32px max(16px,env(safe-area-inset-left,0px)) 48px;display:flex;flex-direction:column;gap:20px}
.dc-h{display:flex;flex-direction:column;gap:10px}
.dc-h h1{font-size:clamp(2rem,6vw,3rem)}
.dc-h .sub{color:var(--muted);font-size:1.05rem;margin:0;max-width:56ch}
.dc-form{gap:16px}
.dc-s{border:1px solid var(--line);display:flex;flex-direction:column;gap:14px;min-width:0}
.dc-s legend{font-family:var(--f-display);font-weight:600;font-size:1.2rem;display:flex;align-items:center;gap:10px;padding:0;float:left;width:100%}
.dc-s legend+*{clear:both}
.dc-n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--coral);color:var(--coral-ink);font-size:.95rem;flex:none}
.dc-s .row>.field{min-width:min(220px,100%)}
.dc-s .field>span{font-weight:600;font-size:.95rem}
.besoins{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.besoins.manque{outline:2px solid var(--coral);outline-offset:4px;border-radius:14px}
.besoin{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);cursor:pointer}
.besoin:has(input:checked){border-color:var(--coral);background:var(--coral-soft)}
.besoin input{accent-color:var(--coral);margin-top:4px;flex:none}
.besoin span{display:flex;flex-direction:column;gap:2px;min-width:0}
.besoin small{color:var(--muted);font-size:.85rem;line-height:1.35}
.si{display:flex;flex-direction:column;gap:12px;padding:14px 16px;border-radius:14px;background:var(--surface-2);border-left:3px solid var(--coral)}
.si h3{font-size:1.05rem}
.dc-form.js .si:not(.on){display:none}
.dc .chip{white-space:normal;line-height:1.3;padding:7px 13px}
.jours{display:flex;flex-direction:column;gap:6px}
.jour{border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.jour summary{cursor:pointer;padding:10px 14px;font-weight:600;display:flex;justify-content:space-between;gap:8px;list-style:none}
.jour summary::-webkit-details-marker{display:none}
.jour[open] summary{border-bottom:1px solid var(--line)}
.jour:has(input:checked){border-color:var(--coral)}
.jour .chipset{padding:10px 14px}
.rgpd{font-size:.9rem;color:var(--muted);align-items:flex-start}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.dc-merci{display:flex;gap:14px;align-items:flex-start;border-left:3px solid var(--ok)}
.dc-merci>.ico{width:32px;height:32px;color:var(--ok);flex:none}
.dc-merci p{margin:.4em 0 0}
.dc-pied{text-align:center}
.dc-cta{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 16px;border-radius:14px;border:1px dashed var(--bronze);color:inherit;text-decoration:none;background:var(--gold-soft)}
.dc-cta span:first-child{display:flex;flex-direction:column}
.dc-cta small{color:var(--muted)}
.dm-l{display:grid;grid-template-columns:minmax(120px,200px) 1fr;gap:6px 16px;margin:16px 0}
.dm-l dt{color:var(--muted);font-size:.9rem}
.dm-l dd{margin:0;overflow-wrap:anywhere}
@media (max-width:560px){.dm-l{grid-template-columns:1fr}.dm-l dd{margin-bottom:6px}.dc{padding-top:20px}}
/* ---------- v14 : argent et temps des clients ---------- */
.mrow{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px;align-items:end;margin:14px 0 4px}
.mcol{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0}
.mcol .num{font-size:.72rem;color:var(--muted);white-space:nowrap}
.mcol .vcol{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;height:90px;width:100%;max-width:34px}
.mcol .vcol i{display:block;width:100%;border-radius:4px 4px 0 0;background:var(--c-violet-soft);border:1px solid var(--c-violet);border-bottom:0;min-height:2px}
.mcol.ck .vcol i{background:var(--c-violet);}
.mcol.now .lab{font-weight:700;color:var(--ink)}
.mcol .lab{font-size:.72rem;color:var(--soft)}
.leg{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:.82rem}
.lg{display:inline-block;width:12px;height:12px;border-radius:3px;margin-left:8px}
.lg.ck{background:var(--c-violet)} .lg.pv{background:var(--c-violet-soft);border:1px solid var(--c-violet)}
/* barres verticales : hauteur en % (pc()) */
.vb i.p0{height:0%} .vb i.p5{height:5%} .vb i.p10{height:10%} .vb i.p15{height:15%} .vb i.p20{height:20%} .vb i.p25{height:25%} .vb i.p30{height:30%} .vb i.p35{height:35%} .vb i.p40{height:40%} .vb i.p45{height:45%} .vb i.p50{height:50%} .vb i.p55{height:55%} .vb i.p60{height:60%} .vb i.p65{height:65%} .vb i.p70{height:70%} .vb i.p75{height:75%} .vb i.p80{height:80%} .vb i.p85{height:85%} .vb i.p90{height:90%} .vb i.p95{height:95%} .vb i.p100{height:100%}
.mcol .vcol i.p0{display:none}
#rapporte h4,#temps h4{margin:18px 0 6px;font-family:var(--f-display)}
.tlist{display:flex;flex-direction:column;gap:6px;margin:12px 0}
.trow{display:grid;grid-template-columns:minmax(90px,130px) 1fr auto;gap:10px;align-items:center;font-size:.9rem}
.trow .bar{height:10px;border-radius:99px;background:var(--surface-2);overflow:hidden}
.trow .bar i{display:block;height:100%;background:var(--info);border-radius:99px}
.head-btns{flex-wrap:wrap;justify-content:flex-end}
.chrono-f{margin:0}
.btn.chrono.on{background:var(--info);color:#fff;border-color:var(--info)}
.btn.chrono.on span{font-variant-numeric:tabular-nums;font-weight:700}
.chrono-g{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:8px 12px;margin-bottom:12px;border-radius:12px;background:var(--info-soft);border:1px solid var(--info)}
.chrono-g a{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none}
.chrono-g b{font-variant-numeric:tabular-nums}
.ctile-eur{display:block;font-size:.82rem;color:var(--c-violet);font-weight:600;margin-top:2px}
.tbl.ca tr.off th a{color:var(--soft)}
.tbl.ca th a{color:inherit}
.tbl td.now{background:var(--gold-soft)}
@media (max-width:560px){.mrow{gap:2px}.mcol .num{font-size:.6rem;writing-mode:vertical-rl;transform:rotate(180deg);height:44px}.mcol .vcol{height:70px}}
/* ---------- Revenus : graphiques ---------- */
.g-ecole{background:var(--c-vert)} .g-orga{background:var(--c-bleu)} .g-client{background:var(--c-violet)} .g-opco{background:var(--c-argent)} .g-ponct{background:var(--c-feu)}
.legende{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.85rem;color:var(--muted);margin:8px 0}
.legende span{display:inline-flex;align-items:center;gap:6px}
.sw{display:inline-block;width:12px;height:12px;border-radius:3px}
.stack-ch{display:grid;grid-template-columns:repeat(auto-fit,minmax(28px,1fr));gap:6px;align-items:end;margin-top:10px}
.sc{display:flex;flex-direction:column;align-items:center;gap:4px;color:inherit;text-decoration:none;min-width:0;padding:4px 0;border-radius:10px}
.sc:hover,.sc:focus-visible{background:var(--surface-2)}
.sc .num{font-size:.75rem;color:var(--muted);white-space:nowrap}
.sc-col{display:flex;flex-direction:column;justify-content:flex-end;height:160px;width:100%;max-width:44px}
.sc-col>i{display:flex;flex-direction:column;gap:2px;width:100%;min-height:2px;border-radius:4px 4px 0 0;overflow:hidden}
.sc-col em{display:block;width:100%;min-height:2px}
.sc .lab{font-size:.75rem;color:var(--soft)}
.sc.now .lab{color:var(--ink);font-weight:700}
.stack-ch:has(.sc:not(.on)) .sc:not(.on) .sc-col{opacity:.35}
.sc-col em.h0{flex:0 0 0} .sc-col em.h5{flex:5 0 0} .sc-col em.h10{flex:10 0 0} .sc-col em.h15{flex:15 0 0} .sc-col em.h20{flex:20 0 0} .sc-col em.h25{flex:25 0 0} .sc-col em.h30{flex:30 0 0} .sc-col em.h35{flex:35 0 0} .sc-col em.h40{flex:40 0 0} .sc-col em.h45{flex:45 0 0} .sc-col em.h50{flex:50 0 0} .sc-col em.h55{flex:55 0 0} .sc-col em.h60{flex:60 0 0} .sc-col em.h65{flex:65 0 0} .sc-col em.h70{flex:70 0 0} .sc-col em.h75{flex:75 0 0} .sc-col em.h80{flex:80 0 0} .sc-col em.h85{flex:85 0 0} .sc-col em.h90{flex:90 0 0} .sc-col em.h95{flex:95 0 0} .sc-col em.h100{flex:100 0 0}
.split i.w1{flex:1 0 0} .split i.w2{flex:2 0 0} .split i.w3{flex:3 0 0} .split i.w4{flex:4 0 0} .split i.w5{flex:5 0 0} .split i.w6{flex:6 0 0} .split i.w7{flex:7 0 0} .split i.w8{flex:8 0 0} .split i.w9{flex:9 0 0} .split i.w10{flex:10 0 0} .split i.w11{flex:11 0 0} .split i.w12{flex:12 0 0} .split i.w13{flex:13 0 0} .split i.w14{flex:14 0 0} .split i.w15{flex:15 0 0} .split i.w16{flex:16 0 0} .split i.w17{flex:17 0 0} .split i.w18{flex:18 0 0} .split i.w19{flex:19 0 0} .split i.w20{flex:20 0 0} .split i.w21{flex:21 0 0} .split i.w22{flex:22 0 0} .split i.w23{flex:23 0 0} .split i.w24{flex:24 0 0} .split i.w25{flex:25 0 0} .split i.w26{flex:26 0 0} .split i.w27{flex:27 0 0} .split i.w28{flex:28 0 0} .split i.w29{flex:29 0 0} .split i.w30{flex:30 0 0} .split i.w31{flex:31 0 0} .split i.w32{flex:32 0 0} .split i.w33{flex:33 0 0} .split i.w34{flex:34 0 0} .split i.w35{flex:35 0 0} .split i.w36{flex:36 0 0} .split i.w37{flex:37 0 0} .split i.w38{flex:38 0 0} .split i.w39{flex:39 0 0} .split i.w40{flex:40 0 0} .split i.w41{flex:41 0 0} .split i.w42{flex:42 0 0} .split i.w43{flex:43 0 0} .split i.w44{flex:44 0 0} .split i.w45{flex:45 0 0} .split i.w46{flex:46 0 0} .split i.w47{flex:47 0 0} .split i.w48{flex:48 0 0} .split i.w49{flex:49 0 0} .split i.w50{flex:50 0 0} .split i.w51{flex:51 0 0} .split i.w52{flex:52 0 0} .split i.w53{flex:53 0 0} .split i.w54{flex:54 0 0} .split i.w55{flex:55 0 0} .split i.w56{flex:56 0 0} .split i.w57{flex:57 0 0} .split i.w58{flex:58 0 0} .split i.w59{flex:59 0 0} .split i.w60{flex:60 0 0} .split i.w61{flex:61 0 0} .split i.w62{flex:62 0 0} .split i.w63{flex:63 0 0} .split i.w64{flex:64 0 0} .split i.w65{flex:65 0 0} .split i.w66{flex:66 0 0} .split i.w67{flex:67 0 0} .split i.w68{flex:68 0 0} .split i.w69{flex:69 0 0} .split i.w70{flex:70 0 0} .split i.w71{flex:71 0 0} .split i.w72{flex:72 0 0} .split i.w73{flex:73 0 0} .split i.w74{flex:74 0 0} .split i.w75{flex:75 0 0} .split i.w76{flex:76 0 0} .split i.w77{flex:77 0 0} .split i.w78{flex:78 0 0} .split i.w79{flex:79 0 0} .split i.w80{flex:80 0 0} .split i.w81{flex:81 0 0} .split i.w82{flex:82 0 0} .split i.w83{flex:83 0 0} .split i.w84{flex:84 0 0} .split i.w85{flex:85 0 0} .split i.w86{flex:86 0 0} .split i.w87{flex:87 0 0} .split i.w88{flex:88 0 0} .split i.w89{flex:89 0 0} .split i.w90{flex:90 0 0} .split i.w91{flex:91 0 0} .split i.w92{flex:92 0 0} .split i.w93{flex:93 0 0} .split i.w94{flex:94 0 0} .split i.w95{flex:95 0 0} .split i.w96{flex:96 0 0} .split i.w97{flex:97 0 0} .split i.w98{flex:98 0 0} .split i.w99{flex:99 0 0} .split i.w100{flex:100 0 0}
.split{display:flex;gap:2px;height:14px;border-radius:99px;overflow:hidden;margin:12px 0 4px}
.split i{display:block;min-width:3px}
.per{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;margin:6px 0 4px}
.per .field{display:flex;flex-direction:column;gap:4px;flex:1 1 130px;max-width:220px;min-width:0}
.rk{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.rk li{display:grid;grid-template-columns:24px 1fr auto 44px;gap:10px;align-items:center}
.rk-n{font-family:var(--f-display);color:var(--soft);font-size:.9rem;text-align:right}
.rk-l{display:flex;flex-direction:column;gap:4px;min-width:0}
.rk-l .t{font-weight:600;font-size:.92rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rk-b{height:10px;border-radius:99px;background:var(--surface-2);overflow:hidden}
.rk-b i{display:block;height:100%;border-radius:99px}
.rk-b i.p0{width:0} .rk-b i.p5{width:5%} .rk-b i.p10{width:10%} .rk-b i.p15{width:15%} .rk-b i.p20{width:20%} .rk-b i.p25{width:25%} .rk-b i.p30{width:30%} .rk-b i.p35{width:35%} .rk-b i.p40{width:40%} .rk-b i.p45{width:45%} .rk-b i.p50{width:50%} .rk-b i.p55{width:55%} .rk-b i.p60{width:60%} .rk-b i.p65{width:65%} .rk-b i.p70{width:70%} .rk-b i.p75{width:75%} .rk-b i.p80{width:80%} .rk-b i.p85{width:85%} .rk-b i.p90{width:90%} .rk-b i.p95{width:95%} .rk-b i.p100{width:100%}
.rk-p{font-size:.8rem;text-align:right}
.oubli a{font-weight:600}
@media (max-width:560px){.rk li{grid-template-columns:20px 1fr auto}.rk-p{display:none}.sc-col{height:120px}.sc .num{font-size:.62rem}}
/* ---------- Inspirations ---------- */
.inspis{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin-top:12px}
.inspi{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface);min-width:0}
.inspi-img{display:block;background:var(--surface-2)}
.inspi-img img{display:block;width:100%;max-height:260px;object-fit:cover}
.inspi-doc{display:flex;align-items:center;gap:8px;padding:14px;background:var(--surface-2);color:inherit;text-decoration:none;font-weight:600}
.inspi-b{display:flex;flex-direction:column;gap:8px;padding:12px 14px;flex:1}
.inspi-b p{margin:0;overflow-wrap:anywhere}
.inspi-l{display:inline-flex;align-items:center;gap:6px;font-weight:600;overflow-wrap:anywhere}
.inspi-l .ico{width:15px;height:15px;flex:none}
.inspi-f{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:auto;font-size:.82rem}
.inspi-f>.soft{flex:1 1 auto}
.inspi-f form{margin:0}
.inspi-add{display:flex;flex-direction:column;gap:12px;margin-top:12px}
/* ---------- Exports ---------- */
.exp{position:relative}
.exp>summary{list-style:none;cursor:pointer}
.exp>summary::-webkit-details-marker{display:none}
.exp-pop{position:absolute;right:0;top:calc(100% + 6px);z-index:8;width:min(290px,86vw);background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:6px;box-shadow:var(--shadow);display:flex;flex-direction:column}
.exp-pop a{display:flex;gap:10px;align-items:flex-start;padding:10px;border-radius:10px;color:inherit;text-decoration:none}
.exp-pop a:hover,.exp-pop a:focus-visible{background:var(--surface-2)}
.exp-pop span{display:flex;flex-direction:column}
.exp-pop small{color:var(--muted);font-size:.8rem}
.prompt-t{font-family:ui-monospace,Menlo,monospace;font-size:.82rem;line-height:1.45;margin-top:12px;min-height:50vh}
@media (max-width:560px){.exp-pop{position:fixed;left:12px;right:12px;top:auto;bottom:calc(76px + env(safe-area-inset-bottom,0px));width:auto}}
.exp-row{justify-content:flex-end;margin:6px 0}
.head:has(.exp[open]),.card:has(.exp[open]){overflow:visible;z-index:30;position:relative}
.exp[open]{z-index:40}
/* ---------- v15 : Ma to-do, plus aérée ---------- */
.todo .card-h p{margin:2px 0 0}
.dtabs{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;scrollbar-width:none;margin:14px -4px 14px;padding:2px 4px;min-width:0}
.dtabs::-webkit-scrollbar{display:none}
.dtabs .dchip{flex:none;padding:8px 14px;font-weight:600;font-size:.9rem;gap:8px}
.dtabs .dchip .n{display:inline-grid;place-items:center;min-width:22px;height:20px;padding:0 6px;border-radius:99px;background:var(--surface-2);color:var(--muted);font-size:.75rem;font-weight:700}
.dtabs .dchip.on{background:var(--cs,var(--ink));color:var(--cc,var(--bg));border-color:var(--cc,var(--ink))}
.dtabs .dchip.on .n{background:var(--surface);color:var(--cc,var(--ink))}
.imprevu{display:flex;flex-direction:column;gap:8px;margin:0 0 6px;padding:12px;border-radius:16px;background:var(--bg);border:1px dashed var(--line)}
.imp-l{display:flex;gap:8px}
.imp-l .input{flex:1 1 auto;min-width:0;background:var(--surface)}
.imp-o{display:flex;flex-wrap:wrap;gap:6px}
.imp-o .input{flex:1 1 150px;width:auto;padding:6px 10px;font-size:.85rem;background:var(--surface)}
.todo .niv-g{margin-top:14px;padding:12px;border-radius:18px;background:var(--surface-2)}
.todo .niv-urgent{background:var(--c-feu-soft)} .todo .niv-argent{background:var(--c-argent-soft)}
.todo .niv-h{display:flex;align-items:center;gap:8px;margin:0 2px 10px;font-family:var(--f-display);font-size:1rem;color:var(--ink)}
.todo .niv-h .n{font-family:var(--f-body);font-size:.75rem;font-weight:700;color:var(--muted);background:var(--surface);border-radius:99px;padding:1px 8px}
.todo .tasks{gap:8px}
.todo .task{border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:12px 10px 12px 16px;align-items:center;overflow:visible}
.todo .task:first-child{border-top:1px solid var(--line)}
.todo .task::before{top:10px;bottom:10px;left:6px;width:3px}
.todo .task:hover{box-shadow:var(--shadow)}
.todo .task .t{font-weight:500;font-size:.97rem;line-height:1.4}
.todo .task.urgent .t{font-weight:600}
.todo .box{width:24px;height:24px;border-radius:50%;margin-top:0}
.todo .task .meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin-top:4px;font-size:.8rem;color:var(--muted)}
.ddom{display:inline-flex;align-items:center;gap:5px}
.ddom i{width:8px;height:8px;border-radius:50%;background:var(--cc)}
.todo .auto{color:var(--soft);font-size:.75rem}
.t-eur{flex:none;font-size:.9rem;color:var(--c-argent);white-space:nowrap}
.todo .task>details.opts{margin-left:0}
.todo .task>details.opts>summary{opacity:.45}
.todo .task:hover>details.opts>summary,.todo .task>details.opts[open]>summary,.todo .task>details.opts>summary:focus-visible{opacity:1}
@media (hover:none){.todo .task>details.opts>summary{opacity:.8}}
.todo details.fold{margin-top:14px}
.todo details.fold .tasks{margin-top:10px}
.m-eur{display:none;color:var(--c-argent)}
@media (max-width:560px){.todo .niv-g{margin-left:-6px;margin-right:-6px;padding:10px 8px}.todo .task{padding:11px 4px 11px 14px;gap:8px}.t-eur{display:none}.m-eur{display:inline}
  .imp-o{display:grid;grid-template-columns:1fr 1fr}.imp-o .input[type=date]{grid-column:1/-1}}

/* v18 : cellules du cockpit choisies à la main */
details.cel{margin-top:12px}
.cel-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:560px){.cel-g{grid-template-columns:1fr}}
.dispo-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:start}
.pg-dispos .dispo-g .dispo{margin-top:0;min-width:0}
.dispo-g .dispo .row.between{flex-direction:column;align-items:flex-start;gap:6px}
.dispo-g .acts{display:flex;flex-wrap:wrap;gap:6px}
.dispo-g details.edit[open]{grid-column:1/-1}
@media (max-width:1100px){.dispo-g{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.dispo-g{grid-template-columns:1fr}}
.sheet-frame{height:min(88vh,1000px)}
.pj input[type=file]{padding:8px}
.pg-revenus .wrap{max-width:1320px}

/* v18 : photos des clients */
.drop{display:flex;flex-direction:column;align-items:center;gap:6px;padding:22px 14px;border:2px dashed var(--line);border-radius:16px;text-align:center;cursor:pointer;background:var(--surface-2)}
.drop:hover,.drop:focus-within{border-color:var(--pa,var(--accent))}
.drop input{max-width:100%;font-size:.9rem}
.drop svg{width:28px;height:28px}
.ph-lot{border-top:1px solid var(--line);padding:12px 0}
.ph-lot:first-child{border-top:0;padding-top:0}
.ph-note{margin:6px 0;color:var(--soft);overflow-wrap:anywhere}
.ph-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin-top:8px}
.ph{margin:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface);min-width:0;display:flex;flex-direction:column}
.ph img{display:block;width:100%;aspect-ratio:1;object-fit:cover}
.ph-doc{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;aspect-ratio:1;padding:10px;color:inherit;text-decoration:none;text-align:center;font-size:.82rem;overflow-wrap:anywhere}
.ph figcaption{display:flex;align-items:center;gap:6px;padding:6px 8px;font-size:.78rem;min-width:0}
.ph figcaption a{flex:1;min-width:0;display:flex;align-items:center;gap:4px}
.ph figcaption a svg{width:14px;height:14px;flex:none}
.ph figcaption form{display:flex;gap:6px;margin:0}
@media (max-width:560px){.ph-g{grid-template-columns:repeat(2,minmax(0,1fr))}}
.couv{margin:-4px 0 4px;border-radius:20px;overflow:hidden;max-height:220px}
.couv img{display:block;width:100%;height:220px;object-fit:cover}
@media (max-width:560px){.couv,.couv img{height:150px}}
.couv-apercu{display:block;width:100%;max-height:200px;object-fit:cover;border-radius:14px}
.avis-l{display:flex;flex-direction:column;gap:6px;margin-top:8px;padding:10px;border-radius:12px;background:var(--surface-2)}
.avis-l code{overflow-wrap:anywhere;font-size:.85rem}
.sec-t{display:flex;align-items:center;gap:8px;margin:18px 0 0;font-size:1.25rem}

/* v18 : étapes OPCO qui se plient */
details.etape-pli{border:1px solid var(--line);border-left:6px solid var(--sc,var(--line));border-radius:16px;padding:4px 14px;background:var(--surface)}
details.etape-pli>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:10px 0;margin:0;min-width:0}
details.etape-pli>summary::-webkit-details-marker{display:none}
details.etape-pli>summary h2{margin:0;font-size:1.1rem}
details.etape-pli>summary .noms{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:40%}
details.etape-pli>summary .chev{display:inline-flex;transition:transform .2s}
details.etape-pli[open]>summary .chev{transform:rotate(180deg)}
details.etape-pli[open]>summary{border-bottom:1px solid var(--line);margin-bottom:12px}
details.etape-pli>.dgrid{padding-bottom:12px}
details.etape-pli:not([open]):hover{background:linear-gradient(90deg,var(--ss,transparent),var(--surface) 60%)}

/* v18 : mon branding */
.brand-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:10px}
.brand{border:1px solid var(--line);border-radius:14px;padding:12px 14px;min-width:0;display:flex;flex-direction:column;gap:6px}
.brand h3{margin:0 0 4px}
.brand .edrow a{color:inherit;text-decoration:none}
@media (max-width:760px){.brand-g{grid-template-columns:1fr}}
.dc-liens{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
@media (max-width:1100px){.head-row{flex-wrap:wrap}.head-row>.grow{flex:1 1 220px}.head-row .head-btns{flex:1 1 100%;flex-wrap:wrap}}
/* La remarque d'une étape OPCO, sur téléphone : elle s'ouvre sous la case, sur toute la largeur, sans déborder */
@media (max-width:560px){.chk:has(>.edit.pn[open]),.chk:has(.edit.pn[open]){flex-wrap:wrap}.chk .edit.pn[open]{flex:1 0 100%;order:9}.chk .edit.pn[open]>form{position:static;width:auto;box-shadow:none;margin-top:6px}}
/* Mise en route guidée (Réglages) */
details.mer>summary{list-style:none;cursor:pointer} details.mer>summary::-webkit-details-marker{display:none}
.mer-e{border-top:1px solid var(--line);padding:10px 0} .mer-e:first-of-type{margin-top:8px}
.mer-e>summary{display:flex;align-items:center;gap:10px;list-style:none;cursor:pointer;min-height:44px} .mer-e>summary::-webkit-details-marker{display:none}
.mer-n{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font-size:.85rem;font-weight:600}
.mer-e:has(.pill.ok) .mer-n{background:var(--ink);color:var(--bg)}
.mer-b{padding:4px 0 6px 36px} .mer-l{margin:0;padding-left:20px} .mer-l li{margin:4px 0} .mer-b .code{margin:6px 0}
@media (max-width:560px){.mer-b{padding-left:0}}
.mer-b .btn{max-width:100%;white-space:normal}
.mer-b code{overflow-wrap:anywhere}
/* Questionnaire de satisfaction */
.avis-q legend{font-family:var(--f-display);font-weight:600;font-size:1.05rem;display:flex;gap:10px;align-items:flex-start;margin-bottom:12px}
.avis-n{flex:none;width:26px;height:26px;border-radius:50%;background:var(--coral);color:#fff;display:grid;place-items:center;font-size:.85rem}
.avis-r{border-top:1px solid var(--line);padding-top:10px;margin-top:10px} .avis-r summary{cursor:pointer}
.ok-t{color:var(--ok,#2E7D4F)} .ko-t{color:var(--coral)}
/* Satisfaction : les graphiques (vert = le mieux, corail = le moins bien) */
:root{--sv4:#1F7A4D;--sv3:#8CC5A0;--sv2:#CC9A47;--sv1:#F0623E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--sv4:#3FA372;--sv3:#9FD3B0;--sv2:#D9AE5E;--sv1:#F27455}}
:root[data-theme="dark"]{--sv4:#3FA372;--sv3:#9FD3B0;--sv2:#D9AE5E;--sv1:#F27455}
.sv4{fill:var(--sv4);background:var(--sv4)} .sv3{fill:var(--sv3);background:var(--sv3)} .sv2{fill:var(--sv2);background:var(--sv2)} .sv1{fill:var(--sv1);background:var(--sv1)}
.avis-graph{display:grid;gap:16px}
.avis-bilan{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.avis-bilan>div{display:flex;flex-direction:column;gap:6px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:14px}
.avis-leg,.avis-det{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.82rem;color:var(--muted)}
.avis-leg span,.avis-det span{display:inline-flex;align-items:center;gap:6px}
.sw{display:inline-block;width:10px;height:10px;border-radius:3px}
.avis-bar{display:grid;gap:6px}
.avis-bt{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;font-weight:600}
.avis-svg{width:100%;height:12px;display:block;border-radius:6px;overflow:hidden;background:var(--line)}
.avis-h{margin:4px 0 8px;font-family:var(--f-display);font-size:1rem}
.cherche{position:relative;display:block;margin:0 0 12px}.cherche svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;opacity:.55;pointer-events:none}.cherche .input{padding-left:36px;width:100%}
.li[hidden],.card[hidden]{display:none}
/* Mon branding : la charte de chaque marque, comme une planche */
.bk{border:1px solid var(--line);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:14px;min-width:0;background:var(--surface)}
.bk-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}.bk-h h3{margin:2px 0;font-size:1.3rem}.bk-h p{margin:0}
.bk-b h4{display:flex;align-items:center;gap:6px;margin:0 0 8px;font-size:.92rem}.bk-b h4 svg{width:16px;height:16px;opacity:.7}
.bk-pal{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.bk-sw{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:2px;border:1px solid var(--line);border-radius:12px;overflow:hidden;padding:0 0 8px;background:var(--surface);font-size:.82rem}
.bk-sw svg{display:block;width:100%;height:64px;margin-bottom:6px;border-bottom:1px solid var(--line)}.bk-sw b,.bk-sw span{padding:0 10px}.bk-sw span{color:var(--muted);font-size:.76rem}
.bk-sw:hover,.bk-sw:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
.bk-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.bk-typos{display:flex;flex-direction:column;gap:8px}.bk-typo{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:12px;padding:8px 12px}
.bk-typo .mw0{display:flex;flex-direction:column}.bk-aa{font-family:var(--f-display);font-size:1.9rem;line-height:1;min-width:44px}
.bk-ton{margin:0;padding:10px 14px;border-left:3px solid var(--coral);background:var(--surface-2);border-radius:0 12px 12px 0;font-size:.92rem;line-height:1.5}
.bk-dl{margin:0;display:flex;flex-direction:column;gap:6px;font-size:.88rem}.bk-dl div{display:flex;gap:8px;flex-wrap:wrap}.bk-dl dt{font-weight:600;min-width:80px}.bk-dl dd{margin:0;flex:1;min-width:0;overflow-wrap:anywhere}
.bk-kit{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.bk-k{display:flex;flex-direction:column;gap:4px;border:1px dashed var(--line);border-radius:12px;padding:10px;color:inherit;text-decoration:none;min-width:0}
.bk-k .ti svg{width:16px;height:16px}.bk-k .s{color:var(--muted);font-size:.76rem}.bk-k.ok{border-style:solid}.bk-k.ok .ti{color:var(--ok,#2f7d4f)}a.bk-k:hover{border-color:var(--ink)}
@media (max-width:760px){.bk-2{grid-template-columns:1fr}.bk-pal{grid-template-columns:repeat(2,minmax(0,1fr))}.bk-kit{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bk-b h4{flex-wrap:wrap}.bk-b h4 .soft{font-weight:400;font-size:.78rem}
@media (max-width:760px){.bk-kit{grid-template-columns:1fr;gap:6px}.bk-k{flex-direction:row;align-items:center;gap:10px;padding:8px 10px}.bk-k b{flex:1;min-width:0}.bk-k .s{text-align:right;max-width:40%}}
@media (max-width:760px){.head-row .head-btns{justify-content:flex-start}.head-row .head-btns .export{order:3}}
/* Mes dispos : le formulaire (date, puis de / à côte à côte), et le calendrier vu par les clients et sur le lien public */
.dispo-f{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:end}
@media (max-width:600px){.dispo-f{grid-template-columns:1fr 1fr}.dispo-f .d-date{grid-column:1 / -1}}
.chip.tous,.chip.pub{font-weight:600}.chip svg{width:14px;height:14px;margin-right:4px;vertical-align:-2px}
.rdv-lien .row{flex-wrap:wrap}.rdv-lien #rdv-url{min-width:0;flex:1 1 220px}
.cal-ms{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-bottom:14px}
.cal-t{display:block;margin-bottom:6px;font-family:var(--f-display)}
.cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center;font-size:.85rem}
.cal-w{color:var(--soft);font-size:.72rem;padding-bottom:2px}
.cal-d{display:grid;place-items:center;aspect-ratio:1;border-radius:10px;color:var(--soft)}.cal-d.past{opacity:.45}
a.cal-d.on{background:var(--coral);color:var(--coral-ink);font-weight:700;text-decoration:none}a.cal-d.on:hover{filter:brightness(.92)}
.cal-js{display:flex;flex-direction:column;gap:10px}
.cal-j{display:flex;gap:12px;border:1px solid var(--line);border-radius:14px;padding:10px 12px;scroll-margin-top:80px}.cal-j:target{border-color:var(--coral);box-shadow:0 0 0 2px var(--coral-soft)}
.cal-jd{display:flex;flex-direction:column;align-items:center;min-width:46px;line-height:1.1;font-size:.75rem;color:var(--soft)}.cal-jd b{font-size:1.5rem;color:var(--ink);font-family:var(--f-display)}
.cal-sl{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}
.cal-s{display:flex;align-items:center;gap:12px}.cal-s form{margin:0}
.cal-bar{display:block;width:100%;height:10px;margin-top:6px}.cal-bg{fill:var(--surface-2)}.cal-on{fill:var(--coral)}
.cal-h{display:flex;justify-content:space-between;font-size:.66rem;color:var(--soft)}
.rdv-choix{display:flex;flex-direction:column;gap:2px}.rdv-choix b{font-size:1.1rem}

/* Formation sur mesure : jauge d'heures, progression, étapes, bon à savoir */
.jauge{display:flex;flex-direction:column;gap:8px}
.jauge-n{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.jauge-n b{font-family:var(--f-display);font-size:1.8rem;line-height:1}.jauge-n span{color:var(--muted)}
.jauge-bar{width:100%;height:14px;display:block}
.j-bg{fill:var(--line)}.j-p{fill:var(--gold)}.j-f{fill:var(--ok)}
.jauge-l{display:flex;gap:14px;flex-wrap:wrap;font-size:.85rem;color:var(--muted)}
.sw{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:0}
.sw.j-bg{background:var(--line)}.sw.j-p{background:var(--gold)}.sw.j-f{background:var(--ok)}
.prog{display:flex;flex-direction:column}
.prog-i{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-top:1px solid var(--line)}.prog-i:first-child{border-top:0}
.prog-i p{margin:4px 0 0}.prog-i .soft{display:block;margin-top:4px;font-size:.85rem}
.hum{font-size:1.5rem;line-height:1;flex:none;width:32px;text-align:center}
.jalons{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column}
.jalons li{display:flex;gap:12px;align-items:flex-start;padding:10px 0;position:relative}
.jalons li:not(:last-child)::before{content:"";position:absolute;left:11px;top:34px;bottom:-4px;width:2px;background:var(--line)}
.jalons li>.mw0{flex:1}.jalons p{margin:2px 0 0}
.j-dot{flex:none;width:24px;height:24px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;background:var(--surface)}
.j-dot svg{width:14px;height:14px}
.j-fait .j-dot{background:var(--ok);border-color:var(--ok);color:#fff}
.j-encours .j-dot{border-color:var(--bronze);box-shadow:inset 0 0 0 4px var(--gold-soft)}
.j-fait b{color:var(--muted)}
.astuce{background:var(--gold-soft);display:flex;flex-direction:column;gap:8px;align-items:flex-start}.astuce p{margin:0}
.chipset.col{flex-direction:column;align-items:stretch}.chipset.col .chip{border-radius:12px;padding:10px 14px;font-size:.95rem}
.resa-l{padding:8px 0;border-top:1px solid var(--line);flex-wrap:wrap;gap:8px}.resa-l p{margin:0}
.seance-a>summary{list-style:none;cursor:pointer}.seance-a>summary::-webkit-details-marker{display:none}
.seance-a[open]>summary{border-bottom:0}.seance-f{padding:4px 0 16px;border-bottom:1px solid var(--line)}
.seance-f fieldset{border:0;padding:0;margin:0}
.jauge-s{margin:2px 0 0;font-size:.92rem}.jauge-s a{color:var(--coral);font-weight:600;white-space:nowrap}
.dem{margin-bottom:14px}.dem>div{display:flex;flex-direction:column;gap:4px}.dem-l{padding-top:8px;border-top:1px solid var(--line);margin-top:6px;flex-wrap:wrap;gap:8px}.dem-l form{margin:0}
.resa-l .pill{margin-left:6px}
