:root{--ink:#173b35;--green:#12664f;--muted:#667e76;--line:#dae4dc;--paper:#f6f7f1;--gold:#e4b15f}*{box-sizing:border-box}body{margin:0;font:15px/1.55 system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:var(--paper)}[hidden]{display:none!important}button,input{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.6;cursor:wait}a{color:inherit;text-decoration:none}.top{height:91px;padding:0 6%;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line);background:#fff}.brand{display:flex;align-items:center;gap:12px;font-size:23px;font-weight:800;line-height:1.1;letter-spacing:-.6px}.brand small{display:block;font-size:9px;letter-spacing:2px;margin-top:5px;color:var(--muted)}.logo{display:grid;place-items:center;border-radius:14px 14px 4px 14px;background:var(--green);color:#fff;width:45px;height:45px;font:italic 700 33px Georgia}.school{margin-left:auto;color:var(--muted);font-size:13px}main{max-width:1240px;margin:auto;padding:54px 42px 70px}#auth{display:grid;grid-template-columns:1.1fr 1fr;gap:90px;align-items:center;min-height:620px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:var(--green)}h1{font-size:43px;line-height:1.17;letter-spacing:-1.6px;margin:18px 0}h1 em{font-family:Georgia,serif;font-weight:500;color:var(--green)}p{color:var(--muted);margin:10px 0 22px}h2{font-size:23px;line-height:1.25;letter-spacing:-.5px;margin:14px 0} .intro>p{max-width:450px;font-size:16px;line-height:1.8}.features{display:grid;gap:17px;margin:38px 0;color:#ab9371;font-size:12px}.features b{color:var(--ink);font-weight:500;margin-left:16px;font-size:14px}.seal{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted);margin-top:50px}.seal span{background:#e2ebdc;padding:5px 10px;border-radius:50%;color:var(--green)}.login-card,.panel{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 20px 60px #2a523509;padding:32px}.tabs{display:flex;background:var(--paper);padding:5px;border-radius:12px;margin-bottom:32px}.tabs button{width:50%;border:0;background:none;color:var(--muted);padding:11px;border-radius:9px;font-weight:650;font-size:13px}.tabs .selected{background:white;color:var(--green);box-shadow:0 2px 8px #0000000e}.login-card p{font-size:13px}.login-card h2{font-size:25px}label{display:block;font-size:12px;font-weight:700;margin:17px 0 7px}input:not([type=checkbox]){width:100%;border:1px solid #cddcd2;border-radius:9px;padding:12px 13px;color:var(--ink);background:white;outline:none}input:focus{border-color:var(--green);box-shadow:0 0 0 3px #12664f14}.primary,.secondary,.quiet,.icon{border-radius:9px;padding:11px 18px;border:0;font-weight:650;font-size:13px}.primary{background:var(--green);color:white}.primary:hover{background:#0a503d}.primary span{float:right}.secondary{background:white;border:1px solid var(--line);color:var(--ink)}.quiet{background:none;color:var(--ink);border:1px solid var(--line)}.icon{background:var(--paper);padding:5px 12px;font-size:23px}.wide{width:100%;margin-top:20px}.hint{font-size:11px!important;line-height:1.6;margin:8px 0;color:var(--muted)}.card-foot{margin-top:25px;padding-top:19px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);text-align:center}.error{padding:11px 13px;margin-top:16px;background:#fff1ee;border-radius:8px;color:#963a29;font-size:13px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:20px}.section-head h1{font-size:35px}.section-head p{margin-bottom:0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0 36px}.stats>div{padding:21px 24px;background:white;border:1px solid var(--line);border-radius:13px}.stats span{font-size:12px;color:var(--muted)}.stats strong{display:block;font-size:32px;font-weight:600;margin-top:6px}.section-title{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:30px 0 17px}.section-title h2{margin:0}.section-title span,.section-title p{font-size:12px;color:var(--muted);margin:5px 0}.class-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.class-card{background:white;border:1px solid var(--line);border-radius:13px;padding:23px;text-align:left;transition:transform .15s,border-color .15s}.class-card:hover{transform:translateY(-3px);border-color:var(--green)}.class-card .number{display:grid;place-items:center;width:50px;height:48px;border-radius:12px;background:#e6efe7;color:var(--green);font-size:18px;font-weight:800}.class-card:nth-child(3n+2) .number{background:#e7eef6;color:#2c567e}.class-card:nth-child(3n) .number{background:#f7eddd;color:#8a6230}.class-card h3{margin:15px 0 5px;font-size:18px}.class-card p{margin:0;font-size:12px}.class-card .go{display:block;margin-top:19px;font-size:12px;color:var(--green);font-weight:700}.table-wrap{background:white;border:1px solid var(--line);border-radius:12px;overflow:auto}table{border-collapse:collapse;width:100%;font-size:13px}th,td{text-align:left;padding:16px;border-bottom:1px solid #e9eee8}th{font-size:10px;letter-spacing:.6px;text-transform:uppercase;background:#f0f4ed}td button{margin:3px;font-size:11px;padding:7px 10px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink)}.pill{display:inline-block;padding:3px 9px;border-radius:5px;background:#e7f1e7;color:var(--green);font-size:11px;margin-right:4px}.off{background:#f3e8e4;color:#92543a}.empty{padding:28px;border:1px dashed #b9cebc;border-radius:12px;color:var(--muted);font-size:13px}.notice{font-size:12px;color:var(--muted);line-height:1.8;margin-top:40px;border-left:3px solid var(--gold);padding:5px 20px}.notice b{display:block;color:var(--ink)}.setup-form{max-width:540px;margin-top:25px}dialog{border:1px solid var(--line);border-radius:18px;width:500px;max-width:calc(100% - 24px);padding:28px;color:var(--ink)}dialog::backdrop{background:#112c2666;backdrop-filter:blur(3px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:20px}.dialog-head h2{margin:0}dialog p{font-size:13px}.checks{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.checks label{border:1px solid var(--line);padding:10px;border-radius:8px;margin:0;font-size:13px}.checkline{display:flex;gap:10px;align-items:center}input[type=checkbox]{accent-color:var(--green);width:16px;height:16px}.code{font:700 25px monospace;letter-spacing:3px;background:var(--paper);padding:20px;text-align:center;border-radius:10px;user-select:all}footer{display:flex;justify-content:space-between;gap:20px;padding:24px 6%;border-top:1px solid var(--line);font-size:10px;letter-spacing:1px;color:var(--muted)}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:90%;background:var(--ink);color:white;border-radius:12px;padding:13px 22px;font-size:13px;z-index:50}.loading{text-align:center;padding:100px;color:var(--muted)}@media(max-width:850px){#auth{gap:28px;grid-template-columns:1fr;min-height:0}.intro{padding-bottom:0}.intro h1{font-size:35px}.features,.seal{display:none}.login-card{max-width:520px;width:100%}.school{display:none}.top{height:76px;padding:0 22px}.top #logout{margin-left:auto}main{padding:30px 20px 45px}.class-grid{grid-template-columns:repeat(2,1fr)}.section-head,.section-title{align-items:flex-start;flex-direction:column}.stats{grid-template-columns:repeat(2,1fr)}.stats>div{padding:17px}.section-head h1{font-size:30px}}@media(max-width:420px){.class-grid{grid-template-columns:1fr}.login-card{padding:22px}.brand{font-size:21px}.quiet{font-size:11px;padding:10px}.checks{grid-template-columns:repeat(2,1fr)}}
/* EduSuivi — identité visuelle connexion 2.0.1.
   Aucune modification des droits, des appels API ou des écrans de classe. */
body:has(#auth:not([hidden])){min-height:100vh;background-repeat:no-repeat;background:#eef3f6;background-image:radial-gradient(ellipse at 8% 80%,#dcebe9 0,transparent 42%),radial-gradient(ellipse at 94% 15%,#e6eafb 0,transparent 40%);color:#193747}
body:has(#auth:not([hidden])) .top{height:85px;border-bottom:1px solid #dce6eb;background:#ffffffdd;padding:0 max(28px,calc((100vw - 1160px)/2));gap:20px}
body:has(#auth:not([hidden])) .brand{color:#153c49;font-size:25px;letter-spacing:-.8px}
body:has(#auth:not([hidden])) .logo{background:linear-gradient(140deg,#147d66,#115547);box-shadow:0 5px 12px #13675320;border-radius:13px 13px 4px 13px;position:relative}
body:has(#auth:not([hidden])) .logo:after{content:"";position:absolute;height:4px;width:18px;background:#f1aa64;right:-4px;bottom:5px;border-radius:3px}
body:has(#auth:not([hidden])) .school{font-size:12px;color:#637f8a}
body:has(#auth:not([hidden])) .school:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#2a9e78;margin-right:9px;box-shadow:0 0 0 4px #e8f4ee}
body:has(#auth:not([hidden])) main{max-width:1220px;padding:48px 30px 42px}
#auth{gap:0;grid-template-columns:1.07fr 1fr;align-items:stretch;min-height:0;background:#fff;border:1px solid #dbe5e8;border-radius:25px;overflow:hidden;box-shadow:0 24px 65px #17374d10,0 4px 12px #17374d06}
#auth .intro{position:relative;overflow:hidden;padding:40px 42px 24px;background:radial-gradient(ellipse at 85% 100%,#166d64 0,transparent 60%),linear-gradient(140deg,#122e47,#123e4b 65%,#185755);min-height:652px;color:white;isolation:isolate}
#auth .intro:before{content:"";position:absolute;z-index:-1;width:370px;height:370px;border:1px solid #ffffff0d;border-radius:50%;top:-255px;right:-128px;box-shadow:0 0 0 36px #ffffff03,0 0 0 73px #ffffff03}
.auth-badge{display:inline-flex;align-items:center;gap:9px;color:#c2e2dc;border:1px solid #8ccbb72a;border-radius:6px;background:#ffffff06;padding:7px 10px;letter-spacing:1.7px;font-size:9px;font-weight:750}
.auth-badge>span{width:6px;height:6px;background:#80d6ae;border-radius:50%;box-shadow:0 0 0 3px #80d6ae12}
#auth .intro h1{color:#fff;font-size:49px;line-height:1.09;letter-spacing:-1.8px;margin:26px 0 20px;font-weight:750}
#auth .intro h1 em{color:#9ee0bc;font-family:Georgia,'Times New Roman',serif;font-size:1.05em;font-weight:500;letter-spacing:-1.5px}
#auth .intro .intro-copy{font-size:14px;line-height:1.8;color:#b9d2d8;margin:0;font-weight:400;max-width:370px}
.school-illustration{margin:16px -15px 6px;position:relative}
.school-illustration svg{width:100%;height:auto;display:block;max-height:214px}
.auth-benefits{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.auth-benefits>span{display:flex;align-items:center;gap:6px;font-size:10px;color:#dceee6;border:1px solid #8ad0b526;border-radius:7px;padding:7px 8px;background:#e4fff508;white-space:nowrap}
.auth-benefits b{font-size:10px;color:#8ddbaf}
.intro-bottom{display:flex;gap:9px;align-items:center;margin-top:25px;padding-top:19px;border-top:1px solid #a6d8cf20;font-size:10px;color:#accbcb}
.ivory-flag{display:inline-flex;width:21px;height:13px;border-radius:2px;overflow:hidden;flex:none;box-shadow:0 0 0 1px #ffffff18}
.ivory-flag i{width:7px;background:#f29955}.ivory-flag i:nth-child(2){background:#fff}.ivory-flag i:nth-child(3){background:#39a87c}
#auth .login-card{align-self:stretch;border:0;border-radius:0;box-shadow:none;padding:38px 44px 35px;background:#fff;display:flex;flex-direction:column;justify-content:center;max-width:none}
.login-welcome{display:flex;align-items:center;gap:11px;margin-bottom:26px;color:#54707b;letter-spacing:1.8px;font-size:9px;font-weight:800}
.welcome-icon{display:grid;place-items:center;width:38px;height:38px;background:#eaf5ef;color:#208265;border-radius:11px;flex:none}.welcome-icon svg{width:25px;height:25px}
#auth .tabs{border:1px solid #e1e8eb;background:#f1f5f6;border-radius:11px;padding:5px;gap:5px;margin-bottom:28px}
#auth .tabs button{padding:11px 7px;font-size:12px;position:relative;transition:background .15s,color .15s,box-shadow .15s;color:#667d88}
#auth .tabs .selected{background:#166f5b;color:#fff;box-shadow:0 3px 9px #166f5b24;border-radius:7px}
#auth .tabs [data-role=director].selected{background:#254c76;box-shadow:0 3px 9px #254c7624}
#auth #roleLabel{font-size:9px;letter-spacing:1.7px;color:#188365}
#auth .login-card:has([data-role=director].selected) #roleLabel{color:#38658d}
#auth .login-card h2{font-size:28px;line-height:1.2;letter-spacing:-.9px;color:#16384a;margin:10px 0 12px}
#auth #loginHelp{color:#738791;font-size:12px;line-height:1.75;margin:0 0 23px;max-width:320px}
#auth label{font-size:11px;font-weight:700;letter-spacing:.1px;color:#314e5d;margin:16px 0 8px}
#auth input{font-size:14px;border:1px solid #d7e2e6;background:#f9fbfc;border-radius:9px;padding:14px 15px;min-height:49px;transition:border-color .15s,box-shadow .15s}
#auth input::placeholder{color:#98a7ae;font-size:12px}
#auth input:focus{border-color:#39977c;box-shadow:0 0 0 3px #20836612;background:#fff}
#auth #teacherCode{font-size:21px;letter-spacing:3px;padding-top:10px;padding-bottom:10px}
#auth #teacherCode::placeholder{letter-spacing:.3px;font-size:12px}
#auth .hint{font-size:10px!important;color:#83959c;margin-top:10px;line-height:1.65}
#auth .primary.wide{background:linear-gradient(100deg,#14785f,#168768);border-radius:9px;min-height:49px;margin-top:20px;font-size:12px;text-align:left;padding:14px 18px;box-shadow:0 5px 13px #167d6120;transition:transform .15s,box-shadow .15s}
#auth .primary.wide:hover{transform:translateY(-1px);box-shadow:0 8px 16px #167d612a}
#auth .primary.wide span{font-size:17px;line-height:1.2}
#auth .login-card:has([data-role=director].selected) .primary.wide{background:linear-gradient(100deg,#204664,#2f6088);box-shadow:0 5px 13px #254c7620}
#auth .card-foot{display:flex;align-items:center;gap:10px;text-align:left;font-size:10px;color:#7c929a;line-height:1.65;border-top:1px solid #e9eff1;margin-top:25px;padding-top:21px}
#auth .card-foot>svg{width:26px;height:26px;color:#78a393;flex:none}
#auth .card-foot strong{font-weight:500;color:#607e89}
#auth .error{font-size:11px;border:1px solid #f8d8cc;background:#fff6f2;color:#a1402b}
body:has(#auth:not([hidden])) footer{max-width:1160px;margin:auto;padding:0 0 24px;border:0;color:#8aa0a9;font-size:9px;letter-spacing:1.2px}
#auth button:focus-visible{outline:3px solid #efb376;outline-offset:3px}
@media(min-width:1300px){body:has(#auth:not([hidden])) main{padding-top:52px;padding-bottom:34px}}
@media(max-width:1050px) and (min-width:761px){#auth .intro{padding:34px 28px 23px}#auth .intro h1{font-size:43px}#auth .login-card{padding:35px 28px}#auth .login-card h2{font-size:26px}.auth-benefits{gap:5px}.auth-benefits>span{font-size:9px;padding:7px 6px}}
@media(max-width:760px){
body:has(#auth:not([hidden])) .top{height:72px;padding:0 22px}body:has(#auth:not([hidden])) .brand{font-size:23px}body:has(#auth:not([hidden])) .school{display:none}
body:has(#auth:not([hidden])) main{padding:22px 16px 25px;max-width:570px}
#auth{grid-template-columns:1fr;border-radius:19px;gap:0}
#auth .intro{min-height:0;padding:24px 25px 23px}
.auth-badge{font-size:8px;padding:6px 8px;letter-spacing:1.2px}
#auth .intro h1{font-size:36px;line-height:1.07;margin:17px 0 12px;letter-spacing:-1px}
#auth .intro h1 br{display:none}#auth .intro h1 em{display:block;margin-top:3px}
#auth .intro .intro-copy{font-size:12px;line-height:1.7;max-width:290px}
#auth .intro .intro-copy br{display:none}#auth .intro .intro-copy br:after{content:' '}
.school-illustration{display:none}.intro-bottom{display:none}.auth-benefits{margin-top:16px;gap:6px}.auth-benefits>span{font-size:8px;padding:5px 6px}
#auth .login-card{padding:26px 25px 28px}.login-welcome{display:none}
#auth .tabs{margin-bottom:24px}#auth .tabs button{font-size:12px;padding:11px 6px}
#auth .login-card h2{font-size:26px;max-width:300px}#auth #loginHelp{font-size:12px;margin-bottom:20px}
#auth .card-foot{margin-top:22px;padding-top:18px}body:has(#auth:not([hidden])) footer{padding:0 23px 22px;max-width:570px;font-size:8px;letter-spacing:.6px;gap:12px}
}
@media(prefers-reduced-motion:reduce){#auth button,#auth input{transition:none!important}#auth .primary.wide:hover{transform:none}}

/* EduSuivi 2.0.2 — tableau de bord direction et enseignants.
   Les données, formulaires et autorisations sont inchangés. */
body:has(#workspace:not([hidden])){min-height:100vh;background:#f1f5f7;background-image:radial-gradient(ellipse at 100% 0,#e8edf8 0,transparent 35%);color:#173949}
body:has(#workspace:not([hidden])) .top{height:82px;padding:0 max(25px,calc((100vw - 1200px)/2));background:#fff;border-bottom:1px solid #dce6ea}
body:has(#workspace:not([hidden])) .brand{color:#153c49;font-size:25px}
body:has(#workspace:not([hidden])) .logo{background:linear-gradient(140deg,#147d66,#115547);border-radius:13px 13px 4px 13px;position:relative;box-shadow:0 5px 12px #13675320}
body:has(#workspace:not([hidden])) .logo:after{content:"";position:absolute;height:4px;width:18px;background:#f1aa64;right:-4px;bottom:5px;border-radius:3px}
body:has(#workspace:not([hidden])) .school{font-size:12px;color:#738a96}
body:has(#workspace:not([hidden])) #logout{color:#496774;border:1px solid #d9e5e9;border-radius:8px;font-size:11px;padding:10px 13px;background:#fafcfd}
body:has(#workspace:not([hidden])) #logout:hover{background:#edf4f2;border-color:#9cbbad}
body:has(#workspace:not([hidden])) main{max-width:1260px;padding:34px 30px 40px}
#workspace>.section-head{position:relative;isolation:isolate;overflow:hidden;min-height:208px;padding:31px 34px 49px;border-radius:20px;background:radial-gradient(ellipse at 70% 140%,#197b67,transparent 65%),linear-gradient(110deg,#12364d,#154553 75%,#1b555a);color:#fff;box-shadow:0 12px 30px #12364d12;display:block}
#workspace>.section-head:before{content:"";position:absolute;z-index:-1;width:330px;height:330px;border:1px solid #ffffff0b;right:70px;top:-230px;border-radius:50%;box-shadow:0 0 0 30px #ffffff03,0 0 0 62px #ffffff03}
#workspace>.section-head>div:not(.dashboard-art){max-width:calc(100% - 275px);position:relative}
#workspace #spaceTag{color:#ace2c8;font-size:9px;letter-spacing:1.9px;display:inline-flex;gap:8px;align-items:center;font-weight:750}
#workspace #spaceTag:before{content:"";width:6px;height:6px;flex:none;border-radius:50%;background:#80d6ae;box-shadow:0 0 0 3px #80d6ae16}
#workspace #greeting{font-size:32px;line-height:1.25;color:#fff;letter-spacing:-1px;margin:12px 0 11px;font-weight:700;overflow-wrap:anywhere}
#workspace #spaceHelp{font-size:12px;line-height:1.8;color:#bdd8de;max-width:650px;margin:0}
.dashboard-art{position:absolute;pointer-events:none;right:27px;top:1px;width:247px;height:131px;opacity:.86}
.dashboard-art svg{width:100%;height:100%}
#workspace #backup{position:absolute;bottom:37px;right:33px;background:#ffffff12;color:#f2fff8;border:1px solid #9bd8bf65;border-radius:8px;box-shadow:0 2px 8px #143d4711;font-size:11px;padding:10px 15px;white-space:nowrap}
#workspace #backup:hover{background:#ffffff22;border-color:#b7efdc}
#workspace .stats{position:relative;z-index:1;margin:-18px 20px 32px;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
#workspace .stats>div{position:relative;overflow:hidden;background:#fff;border:1px solid #e0e9eb;border-radius:13px;padding:21px 22px 18px;box-shadow:0 7px 16px #173f4c05;--metric:#198465;--metric-bg:#e9f5ef;min-height:110px}
#workspace .stats>div:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--metric);opacity:.8}
#workspace .stats>div:nth-child(2){--metric:#3a77b4;--metric-bg:#edf3fc}
#workspace .stats>div:nth-child(3){--metric:#bc8443;--metric-bg:#fbf2e6}
#workspace .stats>div>span:not(.metric-icon){color:#68818b;font-size:11px;display:block;padding-right:43px;line-height:1.5}
#workspace .stats strong{font-size:33px;line-height:1.1;font-weight:750;color:#183f4f;margin-top:9px;letter-spacing:-1px}
#workspace .stats .metric-icon{position:absolute;right:20px;top:29px;width:43px;height:43px;border-radius:12px;background:var(--metric-bg);color:var(--metric);display:grid;place-items:center}
.metric-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
#workspace .stats:has(#teacherStat[hidden]){grid-template-columns:repeat(2,minmax(0,1fr))}
#workspace>.section-title{margin:0 0 19px;gap:16px;align-items:center;flex-direction:row}
#workspace #classesTitle{font-size:23px;font-weight:750;color:#193f4e;letter-spacing:-.65px;display:flex;align-items:center;gap:11px}
#workspace #classesTitle:before{content:"";height:23px;width:4px;border-radius:4px;background:#20896c}
#workspace>.section-title>span{font-size:10px;color:#78909a;letter-spacing:.1px}
#workspace .class-grid{gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))}
#workspace .class-card{--accent:#198469;--soft:#e5f3eb;--wash:#f8fcf9;position:relative;overflow:hidden;border:1px solid #dce7e7;border-top:3px solid var(--accent);background:linear-gradient(125deg,#fff 38%,var(--wash));border-radius:13px;padding:21px 22px 18px;box-shadow:0 3px 6px #183d4c03;transition:transform .16s,box-shadow .16s,border-color .16s;min-height:208px}
#workspace .class-card[href='/app/CP2']{--accent:#377bae;--soft:#e9f1fb;--wash:#f6f9ff}
#workspace .class-card[href='/app/CE1']{--accent:#b47a32;--soft:#fbefdc;--wash:#fdfaf4}
#workspace .class-card[href='/app/CE2']{--accent:#258994;--soft:#e5f3f4;--wash:#f6fbfc}
#workspace .class-card[href='/app/CM1']{--accent:#8165ad;--soft:#f0eaf9;--wash:#faf8ff}
#workspace .class-card[href='/app/CM2']{--accent:#b76868;--soft:#f9eaea;--wash:#fff8f7}
#workspace .class-card:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:0 12px 25px #143f4b0d}
#workspace .class-card:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
#workspace .class-card:before{content:"";position:absolute;right:-22px;top:-21px;width:108px;height:108px;border-radius:35%;transform:rotate(24deg);background:var(--soft);opacity:.6}
#workspace .class-card:after{content:"";position:absolute;right:25px;top:28px;width:31px;height:29px;background:var(--accent);opacity:.4;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M3 6c5-2 9-2 13 1 4-3 8-3 13-1v20c-5-2-9-2-13 1-4-3-8-3-13-1V6zm13 1v20' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
#workspace .class-card .number{position:relative;width:49px;height:45px;border-radius:10px;background:var(--soft);color:var(--accent);font-size:16px;letter-spacing:-.3px;font-weight:800}
#workspace .class-card h3{font-size:18px;line-height:1.3;letter-spacing:-.3px;margin:16px 0 5px;color:#1d3f4e;font-weight:750}
#workspace .class-card p{font-size:11px;color:#7c939b;margin-bottom:17px;line-height:1.6}
#workspace .class-card .go{border-top:1px solid #d5e1e46b;padding-top:13px;margin:0;font-size:11px;font-weight:750;color:var(--accent);letter-spacing:.1px}
#workspace #directorArea{margin-top:34px;padding:27px 27px 20px;border:1px solid #dce6ea;border-radius:16px;background:#fff;box-shadow:0 5px 14px #15374b03}
#workspace #directorArea .section-title{margin:0 0 21px;flex-direction:row;align-items:center;gap:18px}
#workspace #directorArea .team-eyebrow{font-size:8px;font-weight:800;letter-spacing:1.6px;color:#25876d;display:block;margin:0 0 9px}
#workspace #directorArea h2{font-size:22px;color:#193f4e;letter-spacing:-.6px;margin:0 0 6px}
#workspace #directorArea .section-title p{font-size:11px;color:#78919a}
#workspace #addTeacher{background:linear-gradient(100deg,#177760,#238b6a);border:1px solid #178066;font-size:11px;padding:11px 15px;border-radius:8px;white-space:nowrap;box-shadow:0 4px 9px #17776014}
#workspace #addTeacher:hover{background:#116b55}
#workspace .table-wrap{border:1px solid #e0e9ec;border-radius:10px}
#workspace table{font-size:12px}
#workspace th{color:#d1e3e6;background:#234957;border-bottom:0;font-size:9px;letter-spacing:.8px;font-weight:650;padding:13px 16px}
#workspace td{padding:14px 16px;border-color:#e8eff1;color:#385865}
#workspace tbody tr:nth-child(even){background:#f8fafb}
#workspace tbody tr:hover{background:#f1f7f5}
#workspace tbody tr:last-child td{border-bottom:0}
#workspace td:first-child{font-weight:600;color:#264956}
#workspace td .pill{background:#eaf3ef;color:#2a7d62;border-radius:5px;font-size:10px;padding:4px 8px}
#workspace td .pill.off{background:#faece7;color:#a4654c}
#workspace td button{font-size:10px;padding:7px 10px;border-radius:6px;border-color:#dce7e9;color:#44616d;background:#fff}
#workspace td button:first-child{background:#eef6f3;border-color:#d8e9e1;color:#2a7861}
#workspace td button:hover{border-color:#6c9e8c;box-shadow:0 2px 5px #153f4910}
#workspace #directorArea>.hint{font-size:10px!important;color:#8ba0a8;line-height:1.7;margin:15px 1px 0}
#workspace .empty{border-color:#c9ded4;background:#f6fbf8;color:#63887b;font-size:12px}
#workspace .notice{margin-top:25px;border:1px solid #d9e6e6;border-left:4px solid #65a494;border-radius:10px;background:#eaf3f1;padding:15px 20px;font-size:11px;color:#6a858b;line-height:1.8}
#workspace .notice b{color:#36685f;font-size:12px;margin-bottom:3px}
body:has(#workspace:not([hidden])) footer{max-width:1200px;margin:auto;padding:0 0 25px;border:0;font-size:9px;letter-spacing:1px;color:#8da0a7}
body:has(#workspace:not([hidden])) dialog{border-color:#d8e5e8;box-shadow:0 25px 100px #102f4040;border-radius:17px;color:#204653}
body:has(#workspace:not([hidden])) dialog .primary{background:#177c61}
body:has(#workspace:not([hidden])) dialog .checks label:has(input:checked){border-color:#2c9675;background:#edf8f1;color:#166747}
@media(max-width:1000px){#workspace .stats{margin-left:13px;margin-right:13px}#workspace .stats>div{padding:19px 17px}#workspace .stats .metric-icon{right:14px;width:37px;height:37px}#workspace #greeting{font-size:28px}#workspace .class-card{padding:19px;min-height:205px}}
@media(max-width:760px){
body:has(#workspace:not([hidden])) .top{height:73px;padding:0 18px;gap:14px}body:has(#workspace:not([hidden])) .brand{font-size:22px}body:has(#workspace:not([hidden])) .school{display:none}body:has(#workspace:not([hidden])) #logout{font-size:10px;padding:9px;margin-left:auto}
body:has(#workspace:not([hidden])) main{padding:22px 16px 27px}
#workspace>.section-head{padding:26px 23px 48px;border-radius:16px;min-height:0}
#workspace>.section-head>div:not(.dashboard-art){max-width:100%}
.dashboard-art{display:none}#workspace #spaceTag{font-size:8px;letter-spacing:1.1px}
#workspace #greeting{font-size:26px;line-height:1.24;letter-spacing:-.7px;margin-top:13px}#workspace #spaceHelp{font-size:11px;line-height:1.8}
#workspace #backup{position:static;margin-top:19px;display:inline-block;padding:10px 13px;font-size:10px}
#workspace .stats{margin:-21px 11px 26px;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
#workspace .stats>div{padding:15px 11px 13px;border-radius:10px;min-height:111px}
#workspace .stats>div>span:not(.metric-icon){padding:0;font-size:9px;line-height:1.55;min-height:28px}
#workspace .stats .metric-icon{display:none}#workspace .stats strong{font-size:28px;margin-top:7px}
#workspace>.section-title{align-items:flex-start;gap:10px;flex-direction:column;margin-bottom:16px}
#workspace #classesTitle{font-size:21px;gap:9px}#workspace #classesTitle:before{height:21px;width:3px}#workspace>.section-title>span{font-size:9px;margin:0 0 0 12px}
#workspace .class-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#workspace .class-card{padding:17px 14px 14px;border-radius:12px;min-height:193px}
#workspace .class-card .number{width:42px;height:39px;font-size:14px;border-radius:8px}
#workspace .class-card:before{width:87px;height:87px;right:-24px;top:-21px}
#workspace .class-card:after{width:22px;height:22px;right:16px;top:24px}
#workspace .class-card h3{font-size:15px;margin-top:14px;line-height:1.4}
#workspace .class-card p{font-size:10px;margin-bottom:15px}
#workspace .class-card .go{font-size:10px;padding-top:12px;letter-spacing:0}
#workspace #directorArea{margin-top:26px;padding:21px 17px 16px;border-radius:13px}
#workspace #directorArea .section-title{flex-direction:column;align-items:flex-start;gap:13px;margin-bottom:18px}
#workspace #directorArea h2{font-size:20px}#workspace #directorArea .section-title p{font-size:10px}
#workspace #addTeacher{font-size:11px;padding:11px 13px}
#workspace .table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
#workspace table{min-width:570px;font-size:11px}#workspace th,#workspace td{padding:12px}
#workspace #directorArea>.hint{font-size:9px!important}
#workspace .notice{font-size:10px;padding:13px 15px;line-height:1.8;margin-top:20px}#workspace .notice b{font-size:11px}
body:has(#workspace:not([hidden])) footer{padding:0 18px 23px;font-size:8px;letter-spacing:.3px;gap:10px}
}
@media(max-width:360px){#workspace .class-grid{gap:9px}#workspace .class-card{padding:15px 11px 13px}#workspace .class-card h3{font-size:14px}#workspace .stats{margin-left:6px;margin-right:6px;gap:6px}#workspace .stats>div{padding:13px 9px}#workspace .stats>div>span:not(.metric-icon){font-size:8px}#workspace #greeting{font-size:24px}body:has(#workspace:not([hidden])) .brand{font-size:20px}}
@media(prefers-reduced-motion:reduce){#workspace .class-card{transition:none}#workspace .class-card:hover{transform:none}}
/* Sur téléphone, chaque enseignant devient une fiche : les actions restent visibles. */
@media(max-width:760px){
#workspace #directorArea .table-wrap{border:0;border-radius:0;overflow:visible;background:transparent}
#workspace #teachersTable{display:block;min-width:0;width:100%}
#workspace #teachersTable thead{display:none}
#workspace #teachers{display:grid;gap:10px}
#workspace #teachers tr{display:grid;grid-template-columns:1fr auto;gap:10px 14px;border:1px solid #e0e9ec;border-radius:10px;padding:14px;background:#f9fbfc}
#workspace #teachers td{display:block;border:0;padding:0;min-width:0}
#workspace #teachers td:first-child{grid-column:1/-1;font-size:12px;line-height:1.5;color:#214b59}
#workspace #teachers td:nth-child(2):before{content:"CLASSES";display:block;font-size:7px;letter-spacing:1px;color:#849aa3;margin-bottom:5px}
#workspace #teachers td:nth-child(3):before{content:"ACCÈS";display:block;font-size:7px;letter-spacing:1px;color:#849aa3;margin-bottom:5px}
#workspace #teachers td:nth-child(3){justify-self:end}
#workspace #teachers td:last-child{grid-column:1/-1;border-top:1px solid #e1eaed;padding-top:10px;display:flex;gap:7px;flex-wrap:wrap}
#workspace #teachers td button{margin:0;padding:8px 11px;font-size:10px;background:#fff}
#workspace #teachers td button:first-child{background:#edf6f1;border-color:#d1e5d9}
}