:root{
  --bg:#f4f6f9; --card:#fff; --ink:#1b2430; --muted:#5d6b7c; --line:#dde3ea; --line2:#eef1f5;
  --pri:#1d4e89; --pri2:#e8f0fa; --ok:#1f7a4d; --okbg:#e3f4ea; --warn:#9a6200; --warnbg:#fff3d6;
  --ko:#b3261e; --kobg:#fde7e5; --grey:#8a94a3; --greybg:#e4e7ec; --vac:#f0f0f0;
  --r:10px; --sh:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.08);
  font-family: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-size:15px;line-height:1.45}
a{color:var(--pri)}
h1{font-size:1.5rem;margin:.2rem 0 1rem} h2{font-size:1.15rem;margin:1.2rem 0 .6rem} h3{font-size:1rem;margin:.8rem 0 .4rem}
.muted{color:var(--muted)} .small{font-size:.85rem} .pad{padding:1rem} .right{text-align:right} .nowrap{white-space:nowrap}
.top{display:flex;align-items:center;gap:1rem;padding:.6rem 1rem;background:var(--pri);color:#fff;position:sticky;top:0;z-index:20;flex-wrap:wrap}
.brand{display:flex;gap:.6rem;align-items:center;color:#fff;text-decoration:none}
.brand small{display:block;font-size:.75rem;opacity:.85}
.logo{height:46px;padding:4px 8px;border-radius:8px;background:#fff;display:flex;align-items:center}.logo img{height:38px;width:auto;display:block}
#topnav{display:flex;gap:.25rem;flex-wrap:wrap;flex:1}
#topnav a{color:#fff;text-decoration:none;padding:.35rem .7rem;border-radius:6px;font-size:.92rem;opacity:.9}
#topnav a.on,#topnav a:hover{background:rgba(255,255,255,.16);opacity:1}
#whoBox{display:flex;gap:.5rem;align-items:center;font-size:.85rem}
#whoBox button{background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.35)}
#banner:not(:empty){background:var(--warnbg);color:var(--warn);padding:.45rem 1rem;font-size:.85rem;border-bottom:1px solid #f1d58f}
main{max-width:1500px;margin:0 auto;padding:1.2rem 1rem 3rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:1rem 1.1rem;margin-bottom:1rem}
.grid{display:grid;gap:1rem} .g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))} .g3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))} .g4{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.row{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.spacer{flex:1}
button,.btn{font:inherit;font-size:.9rem;border:1px solid var(--line);background:#fff;color:var(--ink);padding:.42rem .8rem;border-radius:7px;cursor:pointer;text-decoration:none;display:inline-flex;gap:.35rem;align-items:center}
button:hover,.btn:hover{border-color:#b9c3cf}
.pri{background:var(--pri);border-color:var(--pri);color:#fff}.pri:hover{background:#163e6e}
.okb{background:var(--ok);border-color:var(--ok);color:#fff}
.kob{color:var(--ko);border-color:#f0b9b4}
.sm{padding:.25rem .55rem;font-size:.82rem}
button:disabled{opacity:.5;cursor:not-allowed}
input,select,textarea{font:inherit;font-size:.92rem;padding:.42rem .55rem;border:1px solid #c9d2dc;border-radius:7px;background:#fff;color:var(--ink);max-width:100%}
textarea{width:100%;min-height:70px}
label.f{display:flex;flex-direction:column;gap:.2rem;font-size:.85rem;color:var(--muted)}
label.f input,label.f select,label.f textarea{color:var(--ink);width:100%}
label.f.req{position:relative}.req::after{content:"*";color:var(--ko);position:absolute;top:0;right:2px}
fieldset{border:1px solid var(--line);border-radius:var(--r);padding:.8rem 1rem 1rem;margin:0 0 1rem}
legend{font-weight:600;padding:0 .4rem}
table{border-collapse:collapse;width:100%;font-size:.88rem}
th,td{border-bottom:1px solid var(--line2);padding:.4rem .5rem;text-align:left;vertical-align:top}
th{font-size:.78rem;text-transform:uppercase;letter-spacing:.02em;color:var(--muted);background:#f8fafc;position:sticky;top:0}
.tablewrap{overflow:auto;max-width:100%}
.kpi{padding:.8rem 1rem}.kpi b{display:block;font-size:1.6rem}.kpi span{color:var(--muted);font-size:.85rem}
.pill{display:inline-block;padding:.1rem .5rem;border-radius:99px;font-size:.78rem;font-weight:600;white-space:nowrap}
.st-wait{background:var(--warnbg);color:var(--warn)}.st-ok{background:var(--okbg);color:var(--ok)}.st-ko{background:var(--kobg);color:var(--ko)}.st-off{background:var(--greybg);color:var(--muted)}.st-done{background:var(--pri2);color:var(--pri)}
.tabs{display:flex;gap:.3rem;border-bottom:1px solid var(--line);margin-bottom:1rem;flex-wrap:wrap}
.tabs a{padding:.5rem .8rem;text-decoration:none;color:var(--muted);border-bottom:2px solid transparent;font-weight:500}
.tabs a.on{color:var(--pri);border-color:var(--pri)}
/* filtres */
.filters{display:grid;grid-template-columns:1fr;gap:.6rem}
.chips{display:flex;flex-wrap:wrap;gap:.3rem}
.chip{border:1px solid var(--line);background:#fff;border-radius:99px;padding:.2rem .6rem;font-size:.8rem;cursor:pointer;user-select:none}
.chip.on{background:var(--pri);color:#fff;border-color:var(--pri)}
.chip.vac{opacity:.45}
.clsgroups{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}
.clsgroups .grp{display:flex;flex-wrap:wrap;gap:.2rem .7rem;align-items:center}
.clsgroups .grp b{font-size:.8rem;color:var(--muted);cursor:pointer;margin-right:.2rem}
.clsgroups label{font-size:.85rem;display:inline-flex;gap:.25rem;align-items:center;cursor:pointer}
/* planning */
.plan{border-collapse:separate;border-spacing:0;font-size:.8rem}
.plan th,.plan td{border-bottom:1px solid var(--line2);border-right:1px solid var(--line2);padding:.25rem .3rem}
.plan th{text-align:center;text-transform:none;letter-spacing:0;font-size:.75rem;line-height:1.2;z-index:2}
.plan th.w small{display:block;font-weight:400;color:var(--muted)}
.plan td.lab{position:sticky;left:0;background:#fff;z-index:1;min-width:230px;max-width:280px}
.plan th.lab{position:sticky;left:0;z-index:3}
.plan td.lab b{font-size:.85rem}
.plan tr.cl-first td{border-top:2px solid #c9d2dc}
.cell{min-width:64px;height:40px;text-align:center;cursor:default;border-radius:5px;display:flex;flex-direction:column;justify-content:center;font-size:.72rem;line-height:1.15;padding:2px}
.cell.open{background:var(--okbg);color:var(--ok)}
.cell.full{background:#cfe1f6;color:var(--pri);font-weight:600}
.cell.closed{background:var(--greybg);color:#4b5563}
.cell.closed.prof{background:#fde4c8;color:#8a4b00}
.cell.vacances{background:repeating-linear-gradient(45deg,#f3f3f3,#f3f3f3 4px,#e8e8e8 4px,#e8e8e8 8px);color:#999}
.cell.click{cursor:pointer}.cell.click:hover{outline:2px solid var(--pri)}
.cell.sel{outline:3px solid #e8a400 !important}
.cell .d{font-weight:600}
.cell .badge{display:inline-block;background:var(--warn);color:#fff;border-radius:8px;padding:0 4px;font-size:.65rem;margin-left:2px}
.cell .nt{color:#b45309}
.legend{display:flex;gap:.8rem;flex-wrap:wrap;font-size:.8rem;color:var(--muted);align-items:center}
.legend i{display:inline-block;width:14px;height:14px;border-radius:3px;vertical-align:-2px;margin-right:4px}
/* modal */
.modal{position:fixed;inset:0;background:rgba(15,23,42,.45);display:flex;align-items:flex-start;justify-content:center;padding:4vh 1rem;z-index:50;overflow:auto}
.modal[hidden]{display:none}
.modal-card{background:#fff;border-radius:12px;max-width:960px;width:100%;padding:1.2rem 1.4rem;position:relative;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.modal-x{position:absolute;right:.6rem;top:.5rem;border:0;font-size:1.5rem;background:none}
#toast{position:fixed;bottom:1.2rem;left:50%;transform:translateX(-50%);background:#1b2430;color:#fff;padding:.6rem 1rem;border-radius:8px;z-index:60;box-shadow:var(--sh);max-width:90vw}
#toast.err{background:var(--ko)}
/* accueil */
.hero{background:linear-gradient(135deg,#1d4e89,#2f6db5);color:#fff;border-radius:14px;padding:1.6rem 1.6rem;margin-bottom:1.2rem}
.hero h1{margin:0 0 .4rem;font-size:1.7rem}.hero p{margin:0;opacity:.92;max-width:760px}
.role{display:flex;flex-direction:column;gap:.5rem}
.role h3{margin:0}.role p{margin:0;color:var(--muted);font-size:.9rem;flex:1}
.offer h3{margin:0 0 .2rem}
.slotlist{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.4rem}
.slotlist span{font-size:.75rem;background:var(--okbg);color:var(--ok);padding:.1rem .45rem;border-radius:5px}
.timeline{list-style:none;padding:0;margin:0;font-size:.85rem}
.timeline li{padding:.25rem 0 .25rem .9rem;border-left:2px solid var(--line);position:relative}
.timeline li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--pri);position:absolute;left:-5px;top:.55rem}
.kv{display:grid;grid-template-columns:170px 1fr;gap:.25rem .8rem;font-size:.9rem}
.kv dt{color:var(--muted)} .kv dd{margin:0}
.code{font-family:ui-monospace,Menlo,Consolas,monospace;background:var(--pri2);color:var(--pri);padding:.05rem .4rem;border-radius:4px;font-weight:600}
.notice{background:var(--pri2);border:1px solid #c7daf1;border-radius:8px;padding:.6rem .8rem;font-size:.9rem}
.notice.w{background:var(--warnbg);border-color:#f1d58f}
.bar{height:8px;background:var(--line2);border-radius:5px;overflow:hidden}.bar i{display:block;height:100%;background:var(--pri)}
#print{display:none}
@media (max-width:700px){ .kv{grid-template-columns:1fr} .plan td.lab{min-width:150px} main{padding:1rem .6rem 3rem}}
/* impression */
@media print{
  body{background:#fff}
  body.printing > *:not(#print){display:none !important}
  body.printing #print{display:block}
  @page{size:A4;margin:11mm 13mm}
}
.doc{font-family:"Times New Roman",Georgia,serif;font-size:10pt;color:#000;line-height:1.25}
.doc p.art{margin:1.6mm 0;text-align:justify}
.doc h1{text-align:center;font-size:15pt;margin:0 0 4mm;letter-spacing:.03em}
.doc h2{font-size:11pt;margin:3mm 0 1mm;text-decoration:underline}
.doc p{margin:1mm 0}
.doc .box{border:1px solid #000;padding:2.5mm 3.5mm;margin:2mm 0}
.doc .sig{display:grid;grid-template-columns:repeat(4,1fr);gap:4mm;margin-top:6mm;text-align:center;font-size:10pt}
.doc .sig div{min-height:26mm;border:1px solid #000;padding:1mm}
.doc .pb{page-break-after:always}
.doc table td,.doc table th{border:1px solid #000;padding:1.5mm 2mm;font-size:10pt;color:#000;background:none;text-transform:none;letter-spacing:0;position:static}
.doc .head{display:flex;justify-content:space-between;font-size:9pt;margin-bottom:4mm}
[hidden]{display:none !important}
.plan tr.dip td{background:var(--pri2);border-top:2px solid #b8cde6}.plan tr.dip td.lab{background:var(--pri2);color:var(--pri)}
button.sm,.btn.sm{white-space:nowrap}
.doc .logos{display:flex;justify-content:space-between;align-items:center;margin-bottom:3mm}
.doc .logos .lg-lycee{height:20mm}.doc .logos .lg-acad{height:17mm}
.doc .center{text-align:center}.doc .ital{font-style:italic}
.doc .fill{font-weight:bold;font-family:Arial,Helvetica,sans-serif;font-size:.95em}
.doc .dots{display:inline-block;min-width:60mm;border-bottom:1px dotted #000;height:1em;vertical-align:baseline}
.doc .wline{border-bottom:1px dotted #000;height:7.5mm}
.doc .fill-block{font-family:Arial,Helvetica,sans-serif;font-weight:bold;border-bottom:1px dotted #000;padding:1mm 0;min-height:12mm}
.doc .rbox{border:1.5px solid #000;border-radius:9mm;padding:5mm 8mm;margin-top:4mm}
.doc .rbox.grey{background:#efefef;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.doc .rbox p{margin:1.4mm 0}
.doc table.grille{border-collapse:collapse;margin-top:3mm;width:80%}
.doc table.grille td,.doc table.grille th{border:1px solid #000;padding:1mm 2mm;font-size:9.5pt;background:#fff}
.doc table.grille .n{width:9mm;text-align:center;font-weight:bold}
.doc table.grille .g{width:30mm;vertical-align:top}
.doc .logos.sm .lg-lycee{height:14mm}.doc .logos.sm .lg-acad{height:12mm}.doc .logos.sm{margin-bottom:1mm}
.doc h1.bh{margin:1mm 0 0}.doc .bsub{font-style:italic;margin:0 0 3mm}
.doc table.idt{width:100%;border-collapse:collapse;margin-bottom:3mm}
.doc table.idt td{border:1px solid #999;padding:1.2mm 2.5mm;width:50%;font-size:10pt}
.doc table.idt td span{display:block;font-size:8pt;color:#555;text-transform:uppercase;letter-spacing:.03em}
.doc table.kvp{width:100%;border-collapse:collapse}
.doc table.kvp th{width:62mm;text-align:left;font-weight:normal;color:#333;border:none;border-bottom:1px solid #ddd;padding:1.6mm 2mm 1.6mm 0;font-size:10pt;background:none;text-transform:none;letter-spacing:0;position:static}
.doc table.kvp td{border:none;border-bottom:1px solid #ddd;padding:1.6mm 0;font-size:10pt}
.doc .fv{font-family:Arial,Helvetica,sans-serif}
.doc table.grille2{width:100%;border-collapse:collapse;margin-top:4mm}
.doc table.grille2 th{border:1px solid #000;padding:1.2mm;font-size:8.5pt;text-align:center;background:#eee;-webkit-print-color-adjust:exact;print-color-adjust:exact;text-transform:none;letter-spacing:0;color:#000;position:static}
.doc table.grille2 th.cl,.doc table.grille2 td.cl{text-align:left;width:70mm}
.doc table.grille2 .nt{font-size:11pt;font-weight:bold}
.doc table.grille2 td{border:1px solid #000;padding:1.1mm 2mm;font-size:10pt;text-align:center;background:none}
.doc table.grille2 tr.gr td{text-align:left;font-weight:bold;background:#f3f3f3;-webkit-print-color-adjust:exact;print-color-adjust:exact;font-size:9pt;letter-spacing:.04em}
.doc .rd{display:inline-block;width:4.2mm;height:4.2mm;border:1.2px solid #000;border-radius:50%;line-height:4mm;font-size:9pt;text-align:center;vertical-align:middle}
.doc .rd.on{font-weight:bold}
.doc .blk{border:1px solid #000;margin-top:4mm}
.doc .blk .lbl{background:#eee;-webkit-print-color-adjust:exact;print-color-adjust:exact;padding:1mm 2mm;font-size:9pt;border-bottom:1px solid #000}
.doc .blk .txt{min-height:18mm;padding:2mm;font-family:Arial,Helvetica,sans-serif;font-size:10pt}
.doc .ck{font-size:12pt}
.doc .sigrow{display:flex;justify-content:space-between;align-items:flex-start;margin-top:5mm;gap:6mm}
.doc .sigbox{border:1px solid #000;width:75mm;height:20mm;padding:1mm 2mm;font-size:9pt}
.doc table.grille2 th:not(.cl){width:24mm}
a.kpi-link{text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s}a.kpi-link:hover{border-color:var(--pri);box-shadow:0 2px 8px rgba(29,78,137,.15)}a.kpi-link span{color:var(--muted)}
.doc .sig{grid-template-columns:repeat(4,minmax(0,1fr))}.doc .sig div{box-sizing:border-box}
.doc .sig{width:calc(100% - 2px)}
/* sauvegardes par section */
.backup-bar{display:inline-flex;gap:.35rem;flex-wrap:wrap}
.backup-bar .btn,.backup-bar button{font-size:.8rem;padding:.3rem .6rem}
.sec-head{margin-bottom:.7rem}
.page-head{margin-bottom:.4rem}.page-head h1{margin-bottom:.4rem}
label.chk{display:flex;gap:.45rem;align-items:flex-start;font-size:.9rem;margin:.25rem 0}
label.chk input{margin-top:.2rem}
fieldset.annee{background:var(--okbg,#eef7f1);border-color:#b6dfc6}
fieldset.annee input[name=anneeLabel]{font-size:1.1rem;font-weight:600}
/* impression planning / demandes */
.doc table.pgrid{width:100%;border-collapse:collapse;table-layout:fixed}
.doc table.pgrid th,.doc table.pgrid td{font-size:7.5pt;padding:.8mm 1mm;text-align:center;vertical-align:middle;line-height:1.15}
.doc table.pgrid th.lab,.doc table.pgrid td.lab{text-align:left;width:58mm}
.doc table.pgrid tr.dip td{text-align:left;background:#e8edf3 !important;font-size:8.5pt}
.doc tr{page-break-inside:avoid}
.doc thead{display:table-header-group}
.doc .g-closed{background:#d9d9d9 !important}.doc .g-open{background:#eaf6ee !important}.doc .g-full{background:#d6e6f7 !important}.doc .g-vac{background:repeating-linear-gradient(45deg,#eee,#eee 3px,#fff 3px,#fff 6px) !important}
.doc .g-closed,.doc .g-open,.doc .g-full,.doc .g-vac,.doc tr.dip td{-webkit-print-color-adjust:exact;print-color-adjust:exact}
.doc .small{font-size:8.5pt}.doc .nowrap{white-space:nowrap}
.doc .rq{border:1px solid #000;padding:2.5mm 3.5mm;margin:0 0 3mm;page-break-inside:avoid}
.doc .rq h3{margin:0 0 1.5mm;font-size:11pt;display:flex;justify-content:space-between}
.doc .rq dl{display:grid;grid-template-columns:38mm 1fr;gap:.6mm 3mm;margin:0;font-size:9.5pt}.doc .rq dt{font-weight:bold}.doc .rq dd{margin:0}