:root{--bleu:#0b3d6e;--bleu2:#1565c0;--fond:#f3f5f8;--bord:#dde3ea;--texte:#1d2733;--gris:#6b7785;--rouge:#c62828;--vert:#2e7d32;--orange:#ef6c00}
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--fond);color:var(--texte);font-size:14px}
a{color:var(--bleu2);text-decoration:none}a:hover{text-decoration:underline}
.bandeau-exemple{background:#fff3cd;color:#7a5b00;text-align:center;padding:4px;font-size:12px;border-bottom:1px solid #f0d98a}
header.top{background:var(--bleu);color:#fff;display:flex;align-items:center;gap:20px;padding:0 20px;height:56px}
header.top .logo{font-weight:700;font-size:17px;white-space:nowrap}header.top .logo span{color:#ff8a80}
header.top nav{display:flex;gap:4px;flex:1}header.top nav a{color:#cfe0f5;padding:18px 12px;font-weight:500}
header.top nav a.actif,header.top nav a:hover{color:#fff;text-decoration:none;box-shadow:inset 0 -3px #ff8a80}
.qui{display:flex;align-items:center;gap:10px;font-size:13px}.qui select{padding:4px;border-radius:4px}
.badge-role{background:rgba(255,255,255,.15);padding:2px 8px;border-radius:10px;font-size:11px}
main{padding:20px;max-width:1500px;margin:0 auto}
h1{font-size:22px;margin:0 0 16px}h2{font-size:16px;margin:0 0 12px}
.barre{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}.barre h1{margin:0;flex:1}
.btn{background:var(--bleu2);color:#fff;border:0;border-radius:6px;padding:8px 14px;font-size:13px;cursor:pointer;font-weight:500}
.btn:hover{filter:brightness(1.1)}.btn.sec{background:#fff;color:var(--bleu2);border:1px solid var(--bord)}.btn.petit{padding:4px 9px;font-size:12px}.btn.danger{background:var(--rouge)}
input,select,textarea{font:inherit;padding:7px 9px;border:1px solid var(--bord);border-radius:6px;background:#fff;width:100%}
textarea{min-height:70px}label{display:block;font-size:12px;color:var(--gris);margin-bottom:3px;font-weight:600}
.carte{background:#fff;border:1px solid var(--bord);border-radius:10px;padding:16px}
.grille-kpi{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:16px}
.kpi .val{font-size:26px;font-weight:700;color:var(--bleu)}.kpi .lib{color:var(--gris);font-size:12px;text-transform:uppercase;letter-spacing:.4px}.kpi .sous{font-size:12px;color:var(--gris);margin-top:4px}
.kpi.alerte .val{color:var(--rouge)}
.deux{display:grid;grid-template-columns:3fr 2fr;gap:16px;margin-bottom:16px}
table{width:100%;border-collapse:collapse}th{text-align:left;font-size:11px;text-transform:uppercase;color:var(--gris);padding:8px;border-bottom:2px solid var(--bord)}
td{padding:8px;border-bottom:1px solid #eef1f4;vertical-align:middle}tr.clic{cursor:pointer}tr.clic:hover td{background:#f7faff}
.num{text-align:right;white-space:nowrap}.barre-h{height:8px;background:#e3eaf3;border-radius:4px;overflow:hidden;min-width:80px}.barre-h div{height:100%;background:var(--bleu2)}
.retard{color:var(--rouge);font-weight:600}.aujourdhui{color:var(--orange);font-weight:600}
.tag{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;background:#e8eef6;color:var(--bleu)}
.tag.nouveau{background:#e3f2fd;color:#1565c0}.tag.rdv{background:#ede7f6;color:#5e35b1}.tag.soumission{background:#fff3e0;color:#e65100}.tag.relance{background:#fce4ec;color:#ad1457}.tag.vendu{background:#e8f5e9;color:#2e7d32}.tag.perdu{background:#eceff1;color:#546e7a}
.tag.exemple{background:#fff3cd;color:#7a5b00}
/* Kanban */
.kanban{display:grid;grid-template-columns:repeat(6,minmax(200px,1fr));gap:12px;align-items:start;overflow-x:auto}
.col{background:#e9edf2;border-radius:10px;padding:8px;min-height:300px}.col.survol{background:#d6e4f5;outline:2px dashed var(--bleu2)}
.col-tete{display:flex;justify-content:space-between;align-items:baseline;padding:4px 6px 10px;border-top:4px solid var(--c);border-radius:4px 4px 0 0;padding-top:8px}
.col-tete b{font-size:13px}.col-tete small{color:var(--gris);font-size:11px}
.opp{background:#fff;border-radius:8px;padding:10px;margin-bottom:8px;box-shadow:0 1px 2px rgba(0,0,0,.08);cursor:grab;border-left:3px solid var(--c)}
.opp:active{cursor:grabbing}.opp .t{font-weight:600;font-size:13px;margin-bottom:4px}.opp .m{font-size:15px;font-weight:700;color:var(--bleu)}
.opp .meta{font-size:11px;color:var(--gris);display:flex;justify-content:space-between;margin-top:6px;gap:6px}
.opp .alerte{font-size:11px;color:var(--rouge);font-weight:600;margin-top:4px}
/* Fiche client */
.fiche{display:grid;grid-template-columns:340px 1fr;gap:16px}
.champ{margin-bottom:10px}.champ .v{font-size:14px}.champ .l{font-size:11px;color:var(--gris);text-transform:uppercase}
.timeline{list-style:none;padding:0;margin:0}.timeline li{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid #eef1f4}
.ico{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;background:#e8eef6}
.timeline .s{font-weight:600}.timeline .d{font-size:12px;color:var(--gris)}.timeline li.fait .s::before{content:'✓ ';color:var(--vert)}
.form-grille{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-grille .plein{grid-column:1/-1}
.modal{position:fixed;inset:0;background:rgba(10,25,45,.45);display:flex;align-items:flex-start;justify-content:center;padding-top:60px;z-index:50}
.modal.hidden,.hidden{display:none!important}.modal-box{background:#fff;border-radius:12px;padding:20px;width:620px;max-width:95vw;max-height:85vh;overflow:auto}
.actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#263238;color:#fff;padding:10px 18px;border-radius:8px;z-index:60}
.onglets{display:flex;gap:6px;margin-bottom:12px}.onglets button{border:1px solid var(--bord);background:#fff;padding:6px 12px;border-radius:16px;cursor:pointer}.onglets button.actif{background:var(--bleu);color:#fff;border-color:var(--bleu)}
/* Connexion */
.login{max-width:440px;margin:70px auto}.login .carte{padding:28px}.login h1{text-align:center;color:var(--bleu)}.login h1 span{color:var(--rouge)}
.vide{color:var(--gris);text-align:center;padding:20px}
@media (max-width:900px){.grille-kpi{grid-template-columns:1fr 1fr}.deux,.fiche{grid-template-columns:1fr}header.top{flex-wrap:wrap;height:auto}}
.carte{overflow-x:auto}
/* v2 : photos et installations */
.carte-opp{border:1px solid var(--bord);border-radius:8px;padding:12px;margin-bottom:10px}
.note-opp{background:#f7f9fc;border-left:3px solid var(--bleu2);padding:8px 10px;margin:8px 0;font-size:13px;border-radius:4px}
.titre-photos{font-weight:600;font-size:13px;margin:12px 0 6px}
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.photos figure{margin:0;cursor:zoom-in;border-radius:6px;overflow:hidden;border:1px solid var(--bord);background:#fafafa}
.photos img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}.photos figcaption{font-size:11px;padding:3px 6px;color:var(--gris);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lien-inst{margin-top:10px;font-size:13px;background:#e8f5e9;padding:8px 10px;border-radius:6px}
.btn.vert{background:var(--vert)}
.modal-box.large{width:1000px}.visionneuse img{width:100%;max-height:68vh;object-fit:contain;background:#111;border-radius:8px}
.vis-barre{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font-size:13px;gap:8px}
.kanban.k4{grid-template-columns:repeat(4,minmax(220px,1fr))}
.tag.inst-a_planifier{background:#ffebee;color:#c62828}.tag.inst-planifiee{background:#e3f2fd;color:#1565c0}.tag.inst-en_cours{background:#fff3e0;color:#e65100}.tag.inst-terminee{background:#e8f5e9;color:#2e7d32}
label.btn input[hidden]{display:none}
/* v3 : feuilles de temps */
.pointage{max-width:560px}.pointage .statut{font-size:18px;margin-bottom:6px}.pointage .ou{color:var(--gris);font-size:13px;margin-bottom:10px}
.pointage.en-poste{border:2px solid var(--vert);background:#f4fbf4}.btn.gros{width:100%;padding:14px;font-size:16px;margin-top:8px}
.tbl-temps td,.tbl-temps th{white-space:nowrap}