:root{
  --bg:#13151a; --bg2:#191c23; --bg3:#20242d; --card:#1b1e26;
  --bord:#2a2f3a; --txt:#e7e9ee; --txt2:#9aa1b0; --txt3:#6b7280;
  --acc:#5b8def; --acc2:#3f6fd1; --ok:#3fae6a; --warn:#d99a3a; --rouge:#d1556a;
  --r:12px; --r2:8px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--txt);font:15px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
button{font-family:inherit;cursor:pointer}
input,textarea,select{font-family:inherit}
.muted{color:var(--txt2)}
.err{color:var(--rouge);min-height:1.2em;margin:.4em 0 0}

/* ---------- login ---------- */
.login-body{display:flex;align-items:center;justify-content:center}
.login-card{background:var(--card);border:1px solid var(--bord);border-radius:var(--r);padding:34px 30px;width:340px}
.marque{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.06em;font-size:13px;color:var(--txt2)}
.logo-sq{width:16px;height:16px;border-radius:5px;background:linear-gradient(135deg,var(--acc),var(--acc2))}
.login-card h1{font-size:22px;margin:16px 0 4px}
.login-card label{display:block;font-size:13px;color:var(--txt2);margin:18px 0 6px}
.login-card input{width:100%;padding:11px 12px;background:var(--bg2);border:1px solid var(--bord);border-radius:var(--r2);color:var(--txt);font-size:15px}
.login-card input:focus{outline:none;border-color:var(--acc)}
.btn-primary{background:var(--acc);color:#fff;border:none;border-radius:var(--r2);padding:11px 16px;font-weight:600;font-size:15px}
.btn-primary:hover{background:var(--acc2)}
.btn-bloc{width:100%;margin-top:20px}

/* ---------- cadre général ---------- */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:var(--bg2);border-bottom:1px solid var(--bord);position:sticky;top:0;z-index:30}
.topbar .marque{font-size:14px;color:var(--txt)}
.tabs{display:flex;gap:4px}
.tab{background:transparent;border:1px solid transparent;color:var(--txt2);padding:8px 14px;border-radius:var(--r2);font-size:14px;display:flex;align-items:center;gap:7px}
.tab:hover{color:var(--txt);background:var(--bg3)}
.tab.actif{background:var(--bg3);color:var(--txt);border-color:var(--bord)}
.tab-ic{font-size:15px}
.topbar-droite{display:flex;align-items:center;gap:12px}
.btn-ghost{background:transparent;border:1px solid var(--bord);color:var(--txt2);border-radius:var(--r2);padding:7px 12px;font-size:13px}
.btn-ghost:hover{color:var(--txt);border-color:var(--acc)}

.wrap{padding:22px;max-width:1500px;margin:0 auto}
.view{display:none}
.view.actif{display:block}
.view-tete{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:10px}
.view-tete h2{margin:0;font-size:20px}
.view-tete p{margin:2px 0 0;color:var(--txt2);font-size:13px}

/* boutons communs */
.btn-min{background:var(--bg3);border:1px solid var(--bord);color:var(--txt);border-radius:var(--r2);padding:8px 13px;font-size:14px}
.btn-min:hover{border-color:var(--acc)}
.btn-acc{background:var(--acc);color:#fff;border:none;border-radius:var(--r2);padding:8px 13px;font-size:14px;font-weight:600}
.btn-acc:hover{background:var(--acc2)}
.btn-x{background:transparent;border:none;color:var(--txt3);font-size:16px;line-height:1;padding:2px 6px;border-radius:6px}
.btn-x:hover{color:var(--rouge);background:var(--bg3)}

/* ---------- checklists ---------- */
.cl-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.cl-carte{background:var(--card);border:1px solid var(--bord);border-radius:var(--r);padding:16px}
.cl-tete{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.cl-tete input.titre{flex:1;background:transparent;border:none;color:var(--txt);font-size:16px;font-weight:600;border-bottom:1px solid transparent;padding:4px 0}
.cl-tete input.titre:focus{outline:none;border-bottom-color:var(--acc)}
.cl-prog{height:5px;background:var(--bg3);border-radius:3px;overflow:hidden;margin-bottom:12px}
.cl-prog span{display:block;height:100%;background:var(--ok);transition:width .25s}
.cl-item{display:flex;align-items:center;gap:9px;padding:5px 0}
.cl-item input[type=checkbox]{width:17px;height:17px;accent-color:var(--ok);flex:none}
.cl-item input.txt{flex:1;background:transparent;border:none;color:var(--txt);font-size:14px;padding:3px 0}
.cl-item input.txt:focus{outline:none}
.cl-item.fait input.txt{color:var(--txt3);text-decoration:line-through}
.cl-ajout{display:flex;gap:6px;margin-top:10px}
.cl-ajout input{flex:1;background:var(--bg2);border:1px solid var(--bord);border-radius:var(--r2);color:var(--txt);padding:7px 10px;font-size:13px}
.cl-ajout input:focus{outline:none;border-color:var(--acc)}

/* ---------- carte mentale ---------- */
#mm-zone{position:relative;height:72vh;background:var(--bg2);border:1px solid var(--bord);border-radius:var(--r);overflow:hidden}
#mm-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.mm-noeud{position:absolute;background:var(--card);border:1px solid var(--bord);border-left:4px solid var(--acc);border-radius:var(--r2);padding:9px 12px;min-width:90px;max-width:220px;cursor:grab;user-select:none;box-shadow:0 2px 8px rgba(0,0,0,.3);font-size:14px}
.mm-noeud.sel{border-color:var(--acc);box-shadow:0 0 0 2px var(--acc)}
.mm-noeud textarea{width:100%;background:transparent;border:none;color:var(--txt);resize:none;font-size:14px;line-height:1.35;overflow:hidden}
.mm-noeud textarea:focus{outline:none}
.mm-aide{position:absolute;bottom:12px;left:12px;color:var(--txt3);font-size:12px;background:var(--bg3);padding:6px 10px;border-radius:6px;pointer-events:none}

/* ---------- calendrier ---------- */
.cal-tete{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.cal-mois{font-size:17px;font-weight:600;min-width:170px;text-align:center}
.cal-grille{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--bord);border:1px solid var(--bord);border-radius:var(--r);overflow:hidden}
.cal-jh{background:var(--bg2);padding:8px;text-align:center;font-size:12px;color:var(--txt2);font-weight:600}
.cal-case{background:var(--card);min-height:96px;padding:6px;position:relative}
.cal-case.vide{background:var(--bg)}
.cal-case.ajd{box-shadow:inset 0 0 0 2px var(--acc)}
.cal-num{font-size:12px;color:var(--txt2)}
.cal-case:hover .cal-plus{opacity:1}
.cal-plus{position:absolute;top:4px;right:4px;opacity:0;transition:opacity .15s;font-size:15px;color:var(--txt3);background:none;border:none}
.cal-plus:hover{color:var(--acc)}
.cal-ev{margin-top:3px;font-size:12px;padding:2px 6px;border-radius:5px;background:var(--acc2);color:#fff;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- palettes ---------- */
.pal-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.pal-carte{background:var(--card);border:1px solid var(--bord);border-radius:var(--r);overflow:hidden}
.pal-bande{display:flex;height:70px}
.pal-bande .sw{flex:1;position:relative;cursor:pointer}
.pal-bande .sw:hover::after{content:attr(data-hex);position:absolute;bottom:4px;left:0;right:0;text-align:center;font-size:10px;color:#fff;text-shadow:0 1px 2px #000}
.pal-bas{padding:12px}
.pal-bas input.nom{background:transparent;border:none;color:var(--txt);font-weight:600;font-size:15px;width:100%;padding:2px 0}
.pal-bas input.nom:focus{outline:none;border-bottom:1px solid var(--acc)}
.pal-outils{display:flex;gap:6px;margin-top:10px;align-items:center}
.pal-outils input[type=color]{width:34px;height:30px;border:1px solid var(--bord);border-radius:6px;background:none;padding:2px;cursor:pointer}

/* ---------- inspirations ---------- */
.insp-barre{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.insp-barre input[type=text]{flex:1;min-width:220px;background:var(--bg2);border:1px solid var(--bord);border-radius:var(--r2);color:var(--txt);padding:9px 12px;font-size:14px}
.insp-barre input:focus{outline:none;border-color:var(--acc)}
.insp-depot{border:2px dashed var(--bord);border-radius:var(--r);padding:14px 18px;color:var(--txt2);text-align:center;cursor:pointer;transition:all .15s}
.insp-depot.survol{border-color:var(--acc);color:var(--txt);background:var(--bg3)}
.insp-grille{columns:4;column-gap:14px}
@media(max-width:1100px){.insp-grille{columns:3}}
@media(max-width:800px){.insp-grille{columns:2}}
.insp-item{break-inside:avoid;margin-bottom:14px;position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--bord);background:var(--card)}
.insp-item img{width:100%;display:block}
.insp-leg{padding:7px 10px;font-size:12px;color:var(--txt2)}
.insp-item .btn-x{position:absolute;top:6px;right:6px;background:rgba(0,0,0,.6);color:#fff}

/* ---------- toasts ---------- */
.toasts{position:fixed;bottom:18px;right:18px;display:flex;flex-direction:column;gap:8px;z-index:60}
.toast{background:var(--bg3);border:1px solid var(--bord);border-left:3px solid var(--ok);border-radius:var(--r2);padding:10px 14px;font-size:13px;box-shadow:0 4px 14px rgba(0,0,0,.4);animation:slide .25s ease}
@keyframes slide{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:none}}

input[type=color]{cursor:pointer}

/* ---------- point live ---------- */
.live-dot{font-size:11px;color:var(--txt3);transition:color .3s}
.live-dot.on{color:var(--ok)}
.live-dot.off{color:var(--rouge)}
.live-dot.pulse{animation:pulse .6s ease}
@keyframes pulse{0%{transform:scale(1)}40%{transform:scale(1.8);color:var(--acc)}100%{transform:scale(1)}}

/* ---------- drive ---------- */
.drive-fil{margin:0 0 14px;font-size:13px;color:var(--txt2)}
.drive-fil a{color:var(--acc);text-decoration:none}
.drive-fil span{color:var(--txt)}
.drive-depot{border:2px dashed var(--bord);border-radius:var(--r);padding:22px;text-align:center;color:var(--txt2);font-size:13px;cursor:pointer;transition:.15s;margin-bottom:16px}
.drive-depot.survol{border-color:var(--acc);background:var(--bg2);color:var(--txt)}
.drive-liste{display:flex;flex-direction:column;gap:2px}
.drive-ligne{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--card);border:1px solid var(--bord);border-radius:var(--r2)}
.drive-ligne.dossier{background:var(--bg2)}
.drive-ic{color:var(--txt3);font-size:13px}
.drive-ligne.dossier .drive-ic{color:var(--acc);cursor:pointer}
.drive-nom{flex:1;color:var(--txt);text-decoration:none;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
a.drive-nom:hover{color:var(--acc);text-decoration:underline}
.drive-meta{color:var(--txt3);font-size:12px;white-space:nowrap}
.drive-vide{color:var(--txt3);font-size:13px;padding:18px;text-align:center}

/* ---------- dashboard ---------- */
.dash-cartes{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:22px}
.dash-carte{background:var(--card);border:1px solid var(--bord);border-radius:var(--r);padding:16px}
.dash-t{color:var(--txt2);font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.dash-v{font-size:28px;font-weight:600;margin:6px 0 2px;color:var(--txt)}
.dash-sub{color:var(--txt3);font-size:12px}
.dash-bas{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:720px){.dash-bas{grid-template-columns:1fr}}
.dash-bloc{background:var(--card);border:1px solid var(--bord);border-radius:var(--r);padding:16px}
.dash-bloc h3{margin:0 0 14px;font-size:14px;color:var(--txt)}
.dash-barre-l{margin-bottom:12px}
.dash-barre-tete{display:flex;justify-content:space-between;font-size:13px;margin-bottom:5px}
.dash-barre{height:7px;background:var(--bg3);border-radius:4px;overflow:hidden}
.dash-barre span{display:block;height:100%;background:var(--acc);border-radius:4px;transition:width .3s}
.dash-ev{display:flex;align-items:center;gap:10px;font-size:13px;padding:7px 0;border-bottom:1px solid var(--bord)}
.dash-ev:last-child{border-bottom:none}
.dash-ev-d{width:8px;height:8px;border-radius:50%;flex:none}
.dash-ev-date{color:var(--txt3);font-variant-numeric:tabular-nums;white-space:nowrap}