:root { --fond:#f4f5f7; --carte:#fff; --texte:#111827; --doux:#6b7280; --trait:#e5e7eb; --bleu:#1d4ed8; --rouge:#b91c1c; --vert:#15803d; }
* { box-sizing:border-box; }
body { margin:0; background:var(--fond); color:var(--texte); font:15px/1.5 -apple-system, "Helvetica Neue", Arial, sans-serif; }
h1 { font-size:24px; margin:0 0 4px; } h2 { font-size:17px; margin:0 0 8px; } h3 { font-size:14px; margin:14px 0 6px; }
p { margin:0 0 10px; }
button, input, select, textarea { font:inherit; color:inherit; }
button { cursor:pointer; border-radius:8px; border:1px solid var(--trait); background:#fff; padding:8px 14px; }
button:disabled { opacity:.45; cursor:not-allowed; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, [contenteditable]:focus-visible { outline:2px solid var(--bleu); outline-offset:2px; }
.principal { background:var(--bleu); border-color:var(--bleu); color:#fff; font-weight:600; }
.discret { background:#fff; color:#374151; }
.lien { border:0; background:none; padding:0; color:var(--bleu); text-decoration:underline; }
input[type=text], input[type=url], input[type=password], textarea, select { width:100%; border:1px solid #d1d5db; border-radius:8px; padding:8px 10px; background:#fff; }
textarea { resize:vertical; margin:8px 0; }
label { display:block; font-size:13px; color:var(--doux); margin:12px 0 4px; }

.barre { display:flex; align-items:center; gap:18px; padding:10px 24px; background:#fff; border-bottom:1px solid var(--trait); position:sticky; top:0; z-index:5; }
.marque { font-size:17px; }
.barre nav { display:flex; gap:4px; flex:1; }
.onglet { border:0; background:none; padding:8px 12px; color:var(--doux); }
.onglet.actif { color:var(--texte); font-weight:600; box-shadow:inset 0 -2px 0 var(--bleu); border-radius:0; }
.connexion { display:grid; gap:10px; }
.profils { display:flex; gap:8px; margin-left:auto; } .profils select { width:auto; }

main { max-width:1180px; margin:0 auto; padding:24px; }
main.etroit { max-width:680px; }
.titre-page { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:16px; flex-wrap:wrap; }
.titre-page p { color:var(--doux); margin:0; }
.carte { background:var(--carte); border:1px solid var(--trait); border-radius:12px; padding:18px; margin-bottom:14px; }
.rangee { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:8px 0; }
.rangee input[type=text] { flex:1; min-width:120px; }
.colonnes { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
.colonnes.large-gauche { grid-template-columns:1.6fr 1fr; } .colonnes.large-droite { grid-template-columns:300px 1fr; }
.collant { position:sticky; top:70px; }
.note { color:var(--doux); font-size:13px; } .vide { color:var(--doux); padding:20px 0; }
.erreur { margin:12px 24px 0; padding:10px 14px; background:#fef2f2; border:1px solid #fecaca; color:#991b1b; border-radius:8px; display:flex; justify-content:space-between; gap:12px; }

.etapes { display:flex; gap:6px; margin-bottom:16px; flex-wrap:wrap; }
.etapes button { border-radius:999px; } .etapes .actif { background:var(--texte); color:#fff; border-color:var(--texte); }

.jauges { display:flex; gap:18px; }
.jauge { display:flex; align-items:center; gap:8px; }
.jauge-rond { width:58px; height:58px; border-radius:50%; display:grid; place-items:center; }
.jauge-rond b { width:44px; height:44px; border-radius:50%; background:var(--fond); display:grid; place-items:center; font-size:17px; }
.jauge-texte span { display:block; font-size:12px; color:var(--doux); } .jauge-texte strong { font-size:13px; }

.puces { display:flex; flex-wrap:wrap; gap:6px; margin:10px 0; }
.puce { display:inline-flex; align-items:center; gap:4px; border-radius:999px; padding:4px 10px; font-size:13px; background:#eef2ff; color:#3730a3; border:1px solid #c7d2fe; }
.puce.poids3 { background:#dbeafe; border-color:#93c5fd; color:#1e3a8a; font-weight:600; }
.puce.poids1 { background:#f3f4f6; border-color:#e5e7eb; color:#374151; }
.puce button { border:0; background:none; padding:0 2px; color:inherit; line-height:1; }
.puce.filtre { cursor:pointer; background:#fff; color:#374151; border-color:#d1d5db; }
.puce.filtre.actif { background:var(--bleu); color:#fff; border-color:var(--bleu); }
.mini-puce { font-size:11px; padding:1px 8px; }
.bascule { display:inline-flex; border:1px solid var(--trait); border-radius:8px; overflow:hidden; margin:6px 0; }
.bascule button { border:0; border-radius:0; padding:6px 12px; font-size:13px; } .bascule .actif { background:var(--texte); color:#fff; }
.couleurs { display:flex; gap:8px; margin-bottom:10px; } .couleurs button { width:28px; height:28px; border-radius:50%; padding:0; border:2px solid #fff; box-shadow:0 0 0 1px var(--trait); }
.couleurs .actif { box-shadow:0 0 0 2px var(--texte); }

.annonce { display:inline-block; background:#fee2e2; color:#991b1b; border-radius:8px; padding:6px 12px; font-weight:600; }
.verdict { padding:8px 12px; border-radius:8px; font-weight:600; } .verdict.ok { background:#dcfce7; color:#166534; } .verdict.non { background:#fee2e2; color:#991b1b; }
.compte { text-transform:uppercase; letter-spacing:.04em; font-size:12px; } .compte.bleu { color:var(--bleu); } .compte.rouge { color:var(--rouge); }
.foule { max-width:100%; height:auto; display:block; }

.proposition { background:#fff; border:1px solid var(--trait); border-left:4px solid #9ca3af; border-radius:10px; padding:14px; margin-bottom:10px; }
.proposition.acceptee { border-left-color:var(--vert); } .proposition.refusee { border-left-color:#d1d5db; opacity:.6; }
.prop-tete { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-bottom:6px; } .prop-mots { display:flex; gap:4px; flex-wrap:wrap; }
.diff { line-height:1.7; } .diff p { margin:0 0 4px; } .diff ins { background:#dcfce7; color:#14532d; text-decoration:none; border-radius:3px; } .diff del { background:#fee2e2; color:#991b1b; border-radius:3px; }
.absent { border-top:1px solid var(--trait); padding:10px 0; } .absent button { font-size:13px; padding:5px 10px; }

.suivi { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--trait); border-radius:12px; overflow:hidden; }
.suivi th, .suivi td { text-align:left; padding:10px 12px; border-bottom:1px solid var(--trait); vertical-align:middle; }
.suivi th { font-size:12px; color:var(--doux); text-transform:uppercase; letter-spacing:.04em; }
.suivi small { display:block; color:var(--doux); }
.pastille { display:inline-block; min-width:34px; text-align:center; border-radius:999px; padding:2px 8px; font-weight:700; color:#fff; }
.pastille.vert { background:var(--vert); } .pastille.orange { background:#b45309; } .pastille.rouge { background:var(--rouge); }

/* ----- la feuille du CV ----- */
.feuille { background:#fff; box-shadow:0 1px 8px rgba(0,0,0,.08); border-radius:4px; padding:14mm; max-width:210mm; margin:0 auto; }
.cv { --accent:#1f2937; color:#111; font-size:10.5pt; line-height:1.42; font-family:"Helvetica Neue", Arial, sans-serif; }
.cv.taille-petit { font-size:9.5pt; } .cv.taille-grand { font-size:11.5pt; }
.cv h1 { font-size:2.1em; margin:0; line-height:1.15; color:var(--accent); }
.cv-titre { font-size:1.2em; margin:2px 0 4px; font-weight:600; }
.cv-contact { color:#374151; margin:0; }
.cv section { margin-top:1.1em; }
.cv h2 { font-size:1em; text-transform:uppercase; letter-spacing:.08em; color:var(--accent); border-bottom:1.5px solid var(--accent); padding-bottom:2px; margin:0 0 .55em; }
.cv-bloc { margin-bottom:.8em; break-inside:avoid; }
.cv-ligne { display:flex; justify-content:space-between; gap:12px; align-items:baseline; }
.cv-org::before { content:"· "; } .cv-periode { color:#374151; white-space:nowrap; font-size:.95em; }
.cv ul { margin:.25em 0 .2em; padding-left:1.2em; } .cv li { margin-bottom:.15em; }
.cv p { margin:0 0 .3em; } .cv-detail { color:#374151; }
.cv.gabarit-classique { font-family:Georgia, "Times New Roman", serif; }
.cv.gabarit-classique header { text-align:center; } .cv.gabarit-classique h1 { color:#111; }
.cv.gabarit-classique h2 { text-align:center; border-bottom:1px solid #111; color:#111; letter-spacing:.14em; }
.cv.gabarit-compact { line-height:1.3; } .cv.gabarit-compact h1 { font-size:1.7em; }
.cv.gabarit-compact section { margin-top:.7em; } .cv.gabarit-compact h2 { border-bottom:0; border-left:4px solid var(--accent); padding-left:6px; margin-bottom:.35em; }
.cv.gabarit-compact .cv-bloc { margin-bottom:.5em; }
.cv [contenteditable] { border-radius:3px; } .cv p[contenteditable], .cv h1[contenteditable] { display:block; }
.cv [contenteditable]:hover { background:#fef9c3; }
.cv [data-invite]:empty::before { content:attr(data-invite); color:#9ca3af; font-weight:400; }
.cv .mini { font-size:11px; padding:1px 8px; margin:2px 6px 2px 0; color:var(--doux); border-style:dashed; }
.cv li .mini { margin-left:6px; }
.lettre p { margin:0 0 1em; } .lettre .droite { text-align:right; }
.lettre-texte { font-family:Georgia, serif; line-height:1.6; }

#occupe { position:fixed; inset:0; background:rgba(17,24,39,.45); display:grid; place-items:center; z-index:20; }
#occupe[hidden] { display:none; }
#occupe .boite { background:#fff; border-radius:12px; padding:22px 28px; text-align:center; max-width:340px; }
.roue { width:30px; height:30px; margin:0 auto 10px; border:3px solid var(--trait); border-top-color:var(--bleu); border-radius:50%; animation:tour 1s linear infinite; }
@keyframes tour { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .roue { animation:none; } }
#impression { display:none; }

@media (max-width:860px) { .barre { flex-wrap:wrap; gap:8px; padding:8px 16px; } .barre nav { flex:none; } .profils select { max-width:140px; } main { padding:16px; } .cv-ligne { flex-wrap:wrap; } .suivi { display:block; overflow-x:auto; } .colonnes, .colonnes.large-gauche, .colonnes.large-droite { grid-template-columns:1fr; } .collant { position:static; } .feuille { padding:16px; } }

@page { size:A4; margin:14mm; }
@media print {
  body { background:#fff; }
  body > *:not(#impression) { display:none !important; }
  #impression { display:block; }
  .cv { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}