:root{--navy:#0b2545;--teal:#0f766e;--teal-d:#0b5f59;--ink:#1a1f2b;--quiet:#4b5565;--line:#e3e8ef;--line2:#eef1f5;--bg:#f3f5f8;--card:#ffffff;--warn:#b45309;--ok:#176b3a;--crit:#a32d26}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--bg);font-size:14px;line-height:1.45}
a{color:var(--teal);text-decoration:none}a:hover{color:var(--teal-d);text-decoration:underline}
h1{margin:0;font-size:28px;font-weight:600;color:var(--navy)}h2{margin:0;font-size:18px;font-weight:600;color:var(--navy)}h3{margin:0;font-size:15px;font-weight:600;color:var(--navy)}
.app{display:flex;min-height:100vh}
.nav{flex:0 0 240px;background:var(--navy);padding:20px 14px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh;overflow:auto}
.nav.labo{background:#1f2d3d}.nav.admin{background:#17213a}.nav.lecture{background:#263238}
.brand{display:flex;align-items:center;gap:10px;padding:8px 10px 22px 10px}
.brand .logo{width:34px;height:34px;border-radius:8px;background:var(--teal);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:16px}
.brand .name{color:#fff;font-weight:700;font-size:16px;letter-spacing:.02em;display:block}.brand .tag{color:#9fb3cc;font-size:11px;display:block}
.nav a{display:flex;align-items:center;gap:12px;padding:11px 16px;border-radius:8px;color:#d6e0ee;font-size:14px;font-weight:500;min-height:42px}
.nav a:hover{background:#163a63;color:#fff;text-decoration:none}.nav a.active{background:var(--teal);color:#fff}
.nav .grow{flex-grow:1}.nav .sub{color:#9fb3cc;font-size:11px;padding:14px 16px 4px;text-transform:uppercase;letter-spacing:.06em}
.nav .who{color:#9fb3cc;font-size:12px;padding:10px 16px;border-top:1px solid rgba(255,255,255,.12);margin-top:6px}
main{flex:1 1 auto;min-width:0;padding:26px 34px 48px 34px;display:flex;flex-direction:column;gap:18px}
.crumb{font-size:12px;color:var(--quiet);display:flex;gap:6px;flex-wrap:wrap}.crumb b{color:var(--teal);font-weight:600}
.head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px}.head .sub{font-size:13px;color:var(--quiet);max-width:980px;display:block;margin-top:4px}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 16px;border-radius:8px;border:1px solid var(--teal);background:var(--teal);color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn:hover{background:var(--teal-d);color:#fff;text-decoration:none}.btn.secondary{background:#fff;color:var(--teal)}.btn.secondary:hover{background:#f0faf7}
.btn.small{min-height:34px;padding:0 12px;font-size:13px}.btn.danger{background:#fff;color:var(--crit);border-color:var(--crit)}.btn.quiet{background:#fff;color:var(--quiet);border-color:#cfd6e0}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:5px}
.kpi .l{font-size:11.5px;color:var(--quiet);font-weight:600;text-transform:uppercase;letter-spacing:.06em}.kpi .v{font-size:21px;font-weight:700;color:var(--navy);white-space:nowrap}.kpi .v.ok{color:var(--teal)}.kpi .v.warn{color:var(--warn)}.kpi .v.crit{color:var(--crit)}.kpi .s{font-size:12px;color:var(--quiet)}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:18px 22px;display:flex;flex-direction:column;gap:14px}
.card.tint{background:#f8fafc}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.grid32{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:18px;align-items:start}
.tabs{display:flex;flex-wrap:wrap;gap:4px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:0 8px}
.tabs a{display:inline-flex;align-items:center;min-height:42px;padding:0 14px;border-bottom:3px solid transparent;color:var(--quiet);font-size:14px;font-weight:600}.tabs a:hover{color:var(--teal);text-decoration:none}.tabs a.on{color:var(--teal);border-bottom-color:var(--teal)}
.filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 14px;padding:12px 14px;background:#f5f7fa;border:1px solid var(--line);border-radius:10px}
.field{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--quiet);font-weight:600;min-width:0}
.field input,.field select,.field textarea{min-height:40px;padding:0 12px;border:1px solid #cfd6e0;border-radius:8px;font:inherit;font-size:14px;color:var(--ink);background:#fff;width:100%}
.field textarea{padding:10px 12px;min-height:80px}.field .help{font-weight:400;color:var(--quiet);font-size:12px}
fieldset.period{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px;margin:0;padding:0;border:0;min-width:0}fieldset.period legend{padding:0;margin-bottom:4px;font-size:12px;color:var(--quiet);font-weight:600}
form.form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:end}form.form .span2{grid-column:span 2}form.form .span3{grid-column:span 3}
table{border-collapse:collapse;width:100%;font-size:13px}th{text-align:left;font-weight:600;color:var(--quiet);padding:9px 10px;border-bottom:1px solid var(--line);background:#f8fafc;vertical-align:bottom}
td{padding:10px;border-bottom:1px solid var(--line2);vertical-align:top}td.num,th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
table.wide{font-size:12px}table.wide td{padding:8px}tfoot td{font-weight:600;background:#f8fafc}.muted{color:var(--quiet)}.small{font-size:12px}
.scroll{overflow-x:auto}
.badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.ok{background:#e1f3ea;color:#176b3a}.wait{background:#eef1f5;color:#4b5565}.warn{background:#fdebd3;color:#8a4a06}.crit{background:#fbe3e1;color:#a32d26}.in{background:#e3ecfb;color:#1e4fae}.out{background:#efe4fb;color:#5b2da6}
.mini{display:flex;flex-direction:column;gap:6px;padding:14px 16px;background:#f8fafc;border:1px solid var(--line);border-radius:10px;font-size:12px;color:var(--quiet)}.mini b{font-size:14px;color:var(--navy)}
.kv{display:grid;grid-template-columns:200px minmax(0,1fr);gap:6px 14px;font-size:13px}.kv .k{color:var(--quiet);font-weight:600}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.step{display:flex;flex-direction:column;gap:6px;padding:12px 14px;background:#fff;border:1px solid var(--line);border-radius:10px}.stepn{width:26px;height:26px;border-radius:999px;background:var(--teal);color:#fff;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center}
.sheet{background:#fff;border:1px solid #cfd6e0;border-radius:6px;padding:26px 30px;box-shadow:0 1px 3px rgba(11,37,69,.08);font-size:13px;display:flex;flex-direction:column;gap:14px}.sheet h4{margin:0;font-size:12px;font-weight:600;color:var(--quiet);text-transform:uppercase;letter-spacing:.06em}
.flash{padding:12px 16px;border-radius:10px;font-weight:600}.flash.ok{background:#e1f3ea;color:#176b3a}.flash.err{background:#fbe3e1;color:#a32d26}.flash.info{background:#e3ecfb;color:#1e4fae}
.tl{list-style:none;margin:0;padding:0}.tl li{display:grid;grid-template-columns:120px 18px minmax(0,1fr);gap:0 12px;font-size:13px;padding-bottom:12px}.tl .t{color:var(--quiet);font-variant-numeric:tabular-nums}.tl .dot{width:12px;height:12px;border-radius:999px;background:var(--teal);margin-top:4px;justify-self:center}.tl .dot.todo{background:#fff;border:2px solid #b9c3d1}
.check{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}.check input{width:18px;height:18px}
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:80px;border:2px dashed #b9c3d1;border-radius:8px;background:#f8fafc;color:var(--quiet);font-size:12px;text-align:center;padding:10px}
.login{max-width:420px;margin:60px auto;display:flex;flex-direction:column;gap:16px}
.pill{display:inline-block;padding:2px 8px;border-radius:6px;background:#eef1f5;font-size:12px;color:var(--quiet)}
.inline{display:inline}.right{text-align:right}.nowrap{white-space:nowrap}
.bar{height:8px;background:#eef1f5;border-radius:999px;overflow:hidden}.bar i{display:block;height:100%;background:var(--teal)}
@media (max-width:900px){.app{flex-direction:column}.nav{position:static;height:auto;flex-direction:row;flex-wrap:wrap;gap:4px}.nav .brand{width:100%}.nav .grow,.nav .who,.nav .sub{display:none}main{padding:16px}form.form{grid-template-columns:1fr}form.form .span2,form.form .span3{grid-column:auto}.grid2,.grid3,.grid32{grid-template-columns:1fr}.kv{grid-template-columns:1fr}}
@media print{.nav,.actions,.filters,.tabs,.flash{display:none}main{padding:0}}

/* tables larges : la carte défile horizontalement plutôt que la page */
.card{overflow-x:auto}
.wrap .badge{white-space:normal}
