:root{--nuit:#0e2233;--nuit2:#16324a;--eau:#6fd6ea;--eau-f:#1787a0;--fond:#f4f6f8;--carte:#fff;--trait:#dfe5ea;--texte:#1b2a36;--doux:#5d6f7d;
--vert:#1f8a5b;--vert-c:#e3f4ec;--rouge:#c0392b;--rouge-c:#fbe9e7;--ambre:#b7791f;--ambre-c:#fdf3dc;--bleu-c:#e4f6fa}
*{box-sizing:border-box}
body{margin:0;font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;color:var(--texte);background:var(--fond)}
a{color:var(--eau-f)}
.cadre{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
.barre{background:var(--nuit);color:#fff;padding:22px 0;position:sticky;top:0;height:100vh;overflow:auto}
.marque{padding:0 22px 4px;font-weight:800;font-size:22px;letter-spacing:.06em}
.marque .eau,.eau{color:var(--eau)}
.sous-marque{padding:0 22px 18px;color:#a9bccb;font-size:13px;border-bottom:1px solid #24435c}
.barre nav{padding:12px 0}
.barre nav a{display:block;padding:9px 22px;color:#d5e1ea;text-decoration:none;border-left:3px solid transparent}
.barre nav a:hover{background:var(--nuit2)}
.barre nav a.ici{background:var(--nuit2);border-left-color:var(--eau);color:#fff;font-weight:600}
.barre form{padding:14px 22px}
.barre button{background:none;border:1px solid #3a5a74;color:#a9bccb;border-radius:6px;padding:6px 10px;cursor:pointer}
main{padding:30px 38px 60px;max-width:1280px;min-width:0}
h1{font-size:26px;margin:0 0 4px}
.chapo{color:var(--doux);margin:0 0 22px;max-width:820px}
h2{font-size:18px;margin:30px 0 10px}
.carte{background:var(--carte);border:1px solid var(--trait);border-radius:10px;padding:18px 20px;margin-bottom:16px}
.grille{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.chiffre{font-size:34px;font-weight:700;line-height:1.1}
.legende{color:var(--doux);font-size:13px}
table{width:100%;border-collapse:collapse;background:var(--carte);border:1px solid var(--trait);border-radius:10px;overflow:hidden}
th{background:#eaf0f4;text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--doux);padding:9px 12px}
td{padding:10px 12px;border-top:1px solid var(--trait);vertical-align:top}
.defile{overflow-x:auto}
.pastille{display:inline-block;padding:2px 9px;border-radius:20px;font-size:12px;font-weight:600;white-space:nowrap;background:#eaf0f4;color:var(--doux)}
.p-vert{background:var(--vert-c);color:var(--vert)}.p-rouge{background:var(--rouge-c);color:var(--rouge)}
.p-ambre{background:var(--ambre-c);color:var(--ambre)}.p-bleu{background:var(--bleu-c);color:var(--eau-f)}
.bouton{display:inline-block;background:var(--nuit);color:#fff;border:0;border-radius:7px;padding:8px 14px;text-decoration:none;font-size:14px;cursor:pointer}
.bouton.clair{background:#fff;color:var(--texte);border:1px solid var(--trait)}
.bouton.rouge{background:var(--rouge)}
.petit{font-size:13px;color:var(--doux)}
.lien-m{font-size:13px;white-space:nowrap}
.entete{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.alerte{border-left:4px solid var(--rouge);background:var(--rouge-c)}
.info{border-left:4px solid var(--eau-f);background:var(--bleu-c)}
.attention{border-left:4px solid var(--ambre);background:var(--ambre-c)}
.messages{list-style:none;padding:0;margin:0 0 14px}.messages li{background:var(--vert-c);color:var(--vert);padding:8px 12px;border-radius:7px}
ul.liste{margin:0;padding-left:18px}ul.liste li{margin:5px 0}
/* jauge apprentis */
.jauge{position:relative;height:22px;background:#e6ecf0;border-radius:11px;margin:34px 0 30px}
.jauge .ecrit{position:absolute;left:0;top:0;bottom:0;background:var(--vert);border-radius:11px}
.jauge .oral{position:absolute;top:0;bottom:0;background:#9fd8bd}
.jauge .seuil{position:absolute;top:-8px;bottom:-8px;border-left:2px dashed var(--doux)}
.jauge .seuil span{position:absolute;top:-22px;left:-10px;font-size:12px;font-weight:700;color:var(--doux)}
.jauge .seuil.ok span{color:var(--vert)}
/* statut rapide */
.statuts{display:flex;gap:4px;flex-wrap:wrap}
.statuts button{border:1px solid var(--trait);background:#fff;border-radius:20px;padding:2px 9px;font-size:12px;cursor:pointer;color:var(--doux)}
.statuts button.actif{background:var(--nuit);color:#fff;border-color:var(--nuit)}
.statuts button.actif.fait{background:var(--vert);border-color:var(--vert)}
tr.fait td{color:#93a2ae}tr.fait .titre{text-decoration:line-through}
/* échéancier */
.mois{display:grid;grid-template-columns:150px 1fr;gap:18px;border-top:1px solid var(--trait);padding:14px 0}
.mois h3{margin:0;font-size:15px;text-transform:capitalize}
.ligne{display:grid;grid-template-columns:74px 1fr;gap:10px;padding:5px 0}
.ligne .jour{font-weight:700}.ligne.jalon .corps{font-weight:600}
.ref{display:inline-block;background:var(--bleu-c);color:var(--eau-f);border-radius:5px;padding:1px 6px;margin:1px 2px 1px 0;font-size:12px;white-space:nowrap}
.ref.inconnu{background:var(--rouge-c);color:var(--rouge)}
/* formulaires */
form.saisie p{margin:0 0 14px}form.saisie label{display:block;font-weight:600;margin-bottom:4px}
form.saisie input[type=text],form.saisie input[type=number],form.saisie input[type=date],form.saisie input[type=password],form.saisie select,form.saisie textarea{width:100%;max-width:640px;padding:8px 10px;border:1px solid #c5d0d8;border-radius:7px;font:inherit}
form.saisie .helptext,form.saisie .aide{display:block;color:var(--doux);font-size:13px}
form.saisie ul.errorlist{color:var(--rouge);margin:0 0 4px;padding-left:18px}
.porte{max-width:420px;margin:9vh auto;padding:0 16px}
.porte .tete{background:var(--nuit);color:#fff;border-radius:10px 10px 0 0;padding:20px 24px}
.porte .corps{background:#fff;border:1px solid var(--trait);border-top:0;border-radius:0 0 10px 10px;padding:22px 24px}
/* lettre */
.feuille{background:#fff;border:1px solid var(--trait);max-width:800px;padding:60px 70px;font:15px/1.6 Georgia,"Times New Roman",serif}
.feuille .vide{background:#ffe9a8;padding:0 4px;font-family:-apple-system,sans-serif;font-size:13px}
.feuille .douteux{background:#ffe9a8}
.feuille ul{padding-left:22px}
@media (max-width:860px){.cadre{grid-template-columns:1fr}.barre{position:static;height:auto}main{padding:20px 16px}.mois{grid-template-columns:1fr}.feuille{padding:28px 22px}}
@media print{.barre,.hors-impression,.messages{display:none!important}.cadre{display:block}main{padding:0;max-width:none}body{background:#fff}
.feuille{border:0;padding:0;max-width:none}.feuille .vide,.feuille .douteux{background:none}}