/* ================================================================
   TABLONOIR STUDIO — design system v2 (10/2026), aligné sur la boutique refaite
   (C:\dev\tablonoir-shop-design\static\brand.css). Noir, blanc, gris clair ; police Inter ;
   titres grands et légers ; boutons noirs à angles droits ; cartes grises sans ombre ; filets fins.
   Thème clair par défaut (:root, classe .light posée par le script anti-flash) ;
   thème sombre monochrome (:root.dark), pour la projection en classe.
   Les noms de variables historiques (--board, --chalk, --accent…) sont conservés : les gabarits
   les lisent dans leurs styles en ligne. Seules leurs valeurs changent.
   ================================================================ */
:root{
  color-scheme:light;
  --board:#FFFFFF;--board-2:#F0F0F0;--board-3:#E4E4E4;--rail:#FFFFFF;
  --chalk:#141414;--chalk-dim:#5C5C5C;--chalk-faint:#707070;--read:#2A2A2A;
  --line:#E4E4E4;--line-2:#CFCFCF;
  --accent:#101010;--accent-hi:#2B2B2B;--on-accent:#FFFFFF;
  /* couleurs sémantiques, désaturées : succès, statuts, alerte, erreur */
  --teal:#2F6A4F;--cyan:#4A4A4A;--violet:#7A7A7A;--coral:#A23B2F;
  --warn:#86621A;--pending:#8C5A2E;
  --disp:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;--sans:var(--disp);--mono:var(--disp);
  --radius:0px;
}
:root.dark{
  color-scheme:dark;
  --board:#0B0B0B;--board-2:#1C1C1C;--board-3:#2A2A2A;--rail:#0B0B0B;
  --chalk:#FFFFFF;--chalk-dim:#B8B8B8;--chalk-faint:#8F8F8F;--read:#E8E8E8;
  --line:#2A2A2A;--line-2:#424242;
  --accent:#FFFFFF;--accent-hi:#E2E2E2;--on-accent:#101010;
  --teal:#93C4A9;--cyan:#CFCFCF;--violet:#A3A3A3;--coral:#E59C90;
  --warn:#DCC07A;--pending:#DFA97F;
}
*{margin:0;padding:0;box-sizing:border-box}
/* Angles droits partout (charte v2). Seuls les vrais ronds restent ronds : pastilles d'état,
   avatars, indicateurs de chargement. */
*,*::before,*::after{border-radius:0 !important}
.dot,.rond,.sp,.k-dot,.k-spin,.k-mini-spin,
[style*="border-radius:50%"],[style*="border-radius: 50%"]{border-radius:50% !important}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--sans);background:var(--board);color:var(--chalk);font-size:15px;line-height:1.55;
  letter-spacing:-.005em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
svg{stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
a{text-decoration:none;color:inherit}
strong,b{font-weight:500}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--chalk);outline-offset:2px}
.eyebrow{font-size:13px;color:var(--chalk-dim);letter-spacing:0}
.ico{width:16px;height:16px;flex-shrink:0;vertical-align:-3px}
.logo-tn{display:block;height:24px;width:auto;color:var(--chalk);stroke:none}
.logo-tn path{stroke:none}

/* ---------- layout ---------- */
.app{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100vh}

/* ---------- barre latérale ---------- */
.side{background:var(--rail);border-right:1px solid var(--line);padding:18px 12px 14px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.s-brand{display:flex;align-items:center;gap:10px;padding:2px 10px 18px}
.s-brand .logo-tn{height:22px}
.s-brand .logo-tn-mono{display:none}
.s-brand .sub{font-size:13px;color:var(--chalk-faint);border-left:1px solid var(--line-2);padding-left:10px;line-height:1.1}
.nav{display:flex;flex-direction:column;gap:1px;flex:1;overflow-y:auto}
.nav-sec{font-size:12px;color:var(--chalk-faint);margin:16px 12px 5px;letter-spacing:0}
.nav-sec .n{display:none}
.nav-i{display:flex;align-items:center;gap:11px;padding:7px 12px;color:var(--chalk-dim);font-size:14px;font-weight:400;line-height:1.35}
.nav-i svg{width:17px;height:17px;flex-shrink:0;color:var(--chalk-faint)}
.nav-i:hover{background:var(--board-2);color:var(--chalk)}
.nav-i.active{background:var(--board-2);color:var(--chalk);font-weight:500;box-shadow:inset 2px 0 0 var(--chalk)}
.nav-i.active svg{color:var(--chalk)}
.nav-i .compte{margin-left:6px;background:var(--chalk);color:var(--board);padding:0 6px;font-size:11px;font-weight:500;line-height:18px}
.acct{display:flex;align-items:center;gap:10px;padding:10px 12px;margin-top:8px;border-top:1px solid var(--line)}
.ava{width:30px;height:30px;background:var(--board-3);color:var(--chalk);display:flex;align-items:center;justify-content:center;font-weight:500;font-size:12px;flex-shrink:0}
.acct .nm{font-size:13px;font-weight:500}.acct .rl{font-size:12px;color:var(--chalk-faint)}
.acct-out{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:30px;height:30px;color:var(--chalk-faint)}
.acct-out:hover{color:var(--chalk);background:var(--board-2)}

/* ---------- barre du haut ---------- */
.main{display:flex;flex-direction:column;min-width:0}
.bar{height:60px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 32px;position:sticky;top:0;background:var(--board);z-index:20}
.search{display:flex;align-items:center;gap:9px;background:var(--board);border:1px solid var(--line-2);padding:7px 12px;color:var(--chalk-faint);width:280px;max-width:32vw}
.search svg{width:16px;height:16px}
.search input{background:none;border:none;outline:none;color:var(--chalk);font-size:14px;width:100%}
.search input::placeholder{color:var(--chalk-faint)}
.bar-r{display:flex;align-items:center;gap:12px}
.keychip{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:400;color:var(--chalk-dim);padding:6px 4px;white-space:nowrap}
.keychip .d{width:7px;height:7px;background:var(--teal)}.keychip svg{display:none}
.keychip:hover{color:var(--chalk)}
.keychip.alerte .d{background:var(--warn)}.keychip.erreur .d{background:var(--coral)}
.themetog{display:inline-flex;border:1px solid var(--line-2)}
.themetog button{font-size:12.5px;font-weight:400;color:var(--chalk-dim);background:none;border:none;padding:6px 11px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.themetog button svg{width:14px;height:14px}
.themetog button.on{background:var(--chalk);color:var(--board)}

/* ---------- boutons ---------- */
/* .btn = bouton « ligne » noir (secondaire) ; .btn-solid = bouton noir plein (principal). */
.btn{font-size:13.5px;font-weight:500;line-height:1.2;cursor:pointer;min-height:38px;padding:0 16px;border:1px solid var(--chalk);color:var(--chalk);background:transparent;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;transition:background .15s,color .15s}
.btn svg{width:16px;height:16px}
.btn:hover{background:var(--chalk);color:var(--board)}
.btn-solid{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.btn-solid:hover{background:var(--accent-hi);border-color:var(--accent-hi);color:var(--on-accent)}
.btn[disabled],.btn:disabled{opacity:.45;cursor:default}
.btn-lg{min-height:48px;padding:0 24px;font-size:15px}
.btn-block{display:flex;width:100%}
.fleche{font-size:14px;font-weight:500;display:inline-flex;gap:8px;align-items:center}
.fleche::after{content:"\2192";transition:transform .15s}
.fleche:hover::after{transform:translateX(3px)}

/* ---------- contenu ---------- */
.content{padding:28px 32px 64px;max-width:1240px}
.thead{margin-bottom:22px}
.crumb{font-size:13px;color:var(--chalk-faint)}.crumb b{color:var(--chalk-dim);font-weight:400}
.thead h1{font-weight:400;font-size:32px;letter-spacing:-.03em;line-height:1.12;margin-top:6px}
.thead p{color:var(--chalk-dim);font-size:15px;margin-top:6px;max-width:80ch}

.welcome .eyebrow{display:inline-block;margin-bottom:8px}
.welcome h1{font-weight:400;font-size:40px;letter-spacing:-.035em;line-height:1.08;margin-bottom:8px}
.welcome p{color:var(--chalk-dim);font-size:16px;font-weight:300}
.libstate{margin-top:20px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:14px;color:var(--chalk-dim);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:11px 0}
.libstate svg{width:17px;height:17px;color:var(--chalk-faint)}
.libstate b{color:var(--chalk);font-weight:500}
.libstate a{color:var(--chalk);font-weight:500;text-decoration:underline;text-underline-offset:3px}

/* ---------- tuiles d'outils ---------- */
.grp{font-size:13px;color:var(--chalk-faint);margin:30px 0 12px;letter-spacing:0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.tool{background:var(--board-2);padding:20px 22px;display:flex;flex-direction:column;transition:background .15s}
.tool:hover{background:var(--board-3)}
.tool .ic{width:auto;height:auto;display:flex;margin-bottom:14px;color:var(--chalk)}
.tool .ic svg{width:22px;height:22px}
.tool h3{font-weight:400;font-size:20px;letter-spacing:-.02em;line-height:1.2;margin-bottom:6px}
.tool p{font-size:14px;color:var(--chalk-dim);flex:1;line-height:1.5}
.tool .go{margin-top:14px;font-size:13.5px;font-weight:500;color:var(--chalk);display:inline-flex;align-items:center;gap:6px;transition:gap .15s}
.tool:hover .go{gap:10px}
.tool.feature{grid-column:1/-1;flex-direction:row;align-items:center;gap:22px;padding:24px 26px}
.tool.feature .ic{margin:0;flex-shrink:0}
.tool.feature .txt{flex:1}.tool.feature h3{font-size:24px}
.t-violet .ic,.t-cyan .ic,.t-teal .ic{color:var(--chalk)}

/* ---------- cartes, badges, champs ---------- */
.card{background:var(--board-2);padding:22px 24px}
.card h3{font-weight:400;font-size:20px;letter-spacing:-.02em;line-height:1.2;margin-bottom:6px}
.card p{color:var(--chalk-dim);font-size:14px;line-height:1.55}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:820px){.grid2{grid-template-columns:1fr}}
.dropzone{border:1px dashed var(--line-2);padding:24px 16px;text-align:center;color:var(--chalk-dim);background:var(--board)}
.dropzone.over{border-color:var(--chalk);border-style:solid;background:var(--board-2);color:var(--chalk)}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:400;padding:3px 9px;border:1px solid}
.badge .dot{width:6px;height:6px}
.b-core{color:var(--teal);border-color:color-mix(in srgb,var(--teal) 45%,transparent);background:color-mix(in srgb,var(--teal) 8%,transparent)} .b-core .dot{background:var(--teal)}
.b-opt{color:var(--cyan);border-color:color-mix(in srgb,var(--cyan) 45%,transparent);background:transparent} .b-opt .dot{background:var(--cyan)}
.b-sugg{color:var(--violet);border-color:color-mix(in srgb,var(--violet) 45%,transparent);border-style:dashed;background:transparent} .b-sugg .dot{background:var(--violet)}
.b-gap{color:var(--coral);border-color:color-mix(in srgb,var(--coral) 45%,transparent);background:color-mix(in srgb,var(--coral) 7%,transparent)} .b-gap .dot{background:var(--coral)}
.lbl{display:block;font-size:13px;color:var(--chalk-dim);margin-bottom:6px;letter-spacing:0;text-transform:none}
.field{width:100%;min-height:40px;background:var(--board);border:1px solid var(--line-2);color:var(--chalk);padding:8px 12px;font-size:14px}
.field::placeholder{color:var(--chalk-faint)}
.field:focus{outline:none;border-color:var(--chalk);box-shadow:none}
textarea.field{min-height:96px;line-height:1.5}
input[type=checkbox],input[type=radio]{accent-color:var(--chalk)}

/* ---------- tableaux, onglets, listes dépliables ---------- */
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;font-weight:400;font-size:12.5px;color:var(--chalk-dim);padding:8px 10px;border-bottom:1px solid var(--line-2)}
.tbl td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl tr:hover td{background:var(--board-2)}
.onglets{display:flex;gap:26px;border-bottom:1px solid var(--line);font-size:14px;overflow-x:auto}
.onglets a,.onglets button{padding:11px 0;border:0;border-bottom:1px solid transparent;margin-bottom:-1px;color:var(--chalk-dim);background:none;cursor:pointer;white-space:nowrap}
.onglets a.on,.onglets button.on{border-color:var(--chalk);color:var(--chalk)}
.depl{border-bottom:1px solid var(--line-2)}
.depl:first-child{border-top:1px solid var(--line-2)}
.depl>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:15px 0;font-size:16px}
.depl>summary::-webkit-details-marker{display:none}
.depl>summary::after{content:"+";font-size:22px;font-weight:300;line-height:1;width:16px;text-align:center;flex-shrink:0}
.depl[open]>summary::after{content:"\2013"}
.specs-t{border-top:1px solid var(--line-2)}
.specs-t>div{display:grid;grid-template-columns:160px minmax(0,1fr);gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}
.specs-t dt{color:var(--chalk-dim)}.specs-t dd{margin:0}

/* ---------- état vide ---------- */
.empty{background:var(--board-2);padding:44px 28px;text-align:center}
.empty .ic{width:auto;height:auto;color:var(--chalk);display:flex;justify-content:center;margin:0 auto 14px}
.empty .ic svg{width:26px;height:26px}
.empty h3{font-weight:400;font-size:24px;letter-spacing:-.025em;margin-bottom:8px}
.empty p{color:var(--chalk-dim);font-size:15px;max-width:56ch;margin:0 auto 20px}
.empty .acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

/* ---------- messages (flash) ---------- */
.flash{margin:16px 32px 0;padding:10px 14px;font-size:14px;border:1px solid var(--line-2);border-left-width:3px;background:var(--board-2);color:var(--chalk)}
.flash.error{border-color:var(--coral);color:var(--chalk);background:color-mix(in srgb,var(--coral) 6%,var(--board))}
.flash.ok,.flash.success{border-color:var(--teal);background:color-mix(in srgb,var(--teal) 6%,var(--board))}
.flash.warn,.flash.warning{border-color:var(--warn)}

/* ---------- connexion ---------- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:var(--board-2)}
.login-card{width:100%;max-width:400px}
.login-card .brand{display:flex;align-items:center;gap:12px;justify-content:center;margin-bottom:26px}
.login-card .brand .logo-tn{height:30px}
.login-card .panel{background:var(--board);padding:32px 30px}
.login-card h1{font-weight:400;font-size:28px;letter-spacing:-.03em;line-height:1.15;margin-bottom:6px}
.login-card .sub{color:var(--chalk-dim);font-size:14px;margin-bottom:22px}
.login-card .frow{margin-bottom:14px}
.login-card button{width:100%;margin-top:6px;min-height:46px}
.login-card .hint{text-align:center;font-size:12.5px;color:var(--chalk-faint);margin-top:16px}

/* ---------- module Analyse ---------- */
.selbar{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end;background:var(--board-2);padding:14px 16px;margin-bottom:22px}
.selbar .f{display:flex;flex-direction:column;gap:6px}
.selbar select.field{min-width:250px;cursor:pointer}
.selbar .spacer{flex:1}
.split{display:grid;grid-template-columns:320px minmax(0,1fr);gap:24px;align-items:start}
@media(max-width:980px){.split{grid-template-columns:1fr}}
.attente{background:var(--board-2);padding:20px 22px;position:sticky;top:80px}
.attente .k{font-size:12.5px;color:var(--chalk-faint);margin-bottom:8px}
.attente .mat{font-weight:400;font-size:21px;letter-spacing:-.02em;line-height:1.2}
.attente .facts{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0 4px}
.pill{font-size:12px;color:var(--chalk-dim);border:1px solid var(--line-2);padding:2px 8px}
.attente h4{font-size:12.5px;font-weight:400;color:var(--chalk-faint);margin:20px 0 8px}
.attente ul{list-style:none;display:flex;flex-direction:column;gap:7px}
.attente li{font-size:13.5px;color:var(--chalk);display:flex;gap:9px;line-height:1.45}
.attente li::before{content:"";width:5px;height:5px;background:var(--chalk-faint);margin-top:8px;flex-shrink:0}
.attente .exig li::before{background:var(--teal)}
.attente .exig li.gap{color:var(--coral)} .attente .exig li.gap::before{background:var(--coral)}
.attente .src{margin-top:18px;padding-top:12px;border-top:1px solid var(--line-2);font-size:12px;color:var(--chalk-faint);line-height:1.5}
.summary{display:flex;gap:0;flex-wrap:wrap;margin-bottom:22px;border-top:1px solid var(--line-2)}
.stat{padding:12px 28px 4px 0;min-width:110px}
.stat .n{font-weight:300;font-size:28px;line-height:1;letter-spacing:-.02em}
.stat .l{font-size:12.5px;color:var(--chalk-dim);margin-top:5px}
.stat.c-core .n{color:var(--teal)}.stat.c-opt .n{color:var(--cyan)}.stat.c-sugg .n{color:var(--violet)}.stat.c-gap .n{color:var(--coral)}
.sect{margin-bottom:26px}
.sect-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.sect-h .cnt{font-size:12.5px;color:var(--chalk-faint)}
.fiche{display:flex;align-items:center;gap:16px;background:var(--board);border-bottom:1px solid var(--line);padding:11px 4px;transition:background .12s}
.fiche:first-of-type{border-top:1px solid var(--line)}
.fiche:hover{background:var(--board-2)}
.fi-main{flex:1;min-width:0}
.fi-title{font-size:14.5px;font-weight:400;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.fi-code{font-size:12px;font-weight:500;color:var(--chalk-dim);font-variant-numeric:tabular-nums;border:1px solid var(--line-2);padding:0 6px}
.fi-meta{font-size:12.5px;color:var(--chalk-dim);margin-top:4px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.fi-meta .why{color:var(--chalk-faint)}
.src{font-size:11.5px;padding:1px 7px;border:1px solid;white-space:nowrap}
.src-lib{color:var(--chalk-dim);border-color:var(--line-2)}
.src-tn{color:var(--chalk);border-color:var(--chalk)}
.statuspill{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:400;padding:6px 10px;border:1px solid;white-space:nowrap;flex-shrink:0;background:var(--board)}
.statuspill .car{font-size:9px;opacity:.7}
.st-core{color:var(--teal);border-color:color-mix(in srgb,var(--teal) 45%,transparent);background:color-mix(in srgb,var(--teal) 7%,var(--board))}
.st-opt{color:var(--cyan);border-color:color-mix(in srgb,var(--cyan) 45%,transparent)}
.st-sugg{color:var(--violet);border-color:color-mix(in srgb,var(--violet) 45%,transparent);border-style:dashed}
.manque{display:flex;align-items:center;gap:16px;background:color-mix(in srgb,var(--coral) 5%,var(--board));border-left:2px solid var(--coral);border-bottom:1px solid var(--line);padding:11px 14px;margin-bottom:0}
.macts{display:flex;gap:8px;flex-shrink:0}
.mini{font-size:12.5px;font-weight:500;min-height:32px;padding:0 11px;border:1px solid var(--line-2);color:var(--chalk);background:var(--board);cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:7px}
.mini:hover{border-color:var(--chalk)}
.mini.solid{background:var(--chalk);color:var(--board);border-color:var(--chalk)}
.mini.solid:hover{background:var(--accent-hi);border-color:var(--accent-hi)}
.linkbtn{background:none;border:none;padding:0;font:inherit;cursor:pointer;color:inherit}
select.statuspill{cursor:pointer}

/* ---------- chiffres (tableau de bord) ---------- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:22px 0 4px}
.kpis .k{background:var(--board-2);padding:16px 18px}
.kpis .k b{display:block;font-weight:300;font-size:38px;line-height:1;letter-spacing:-.03em;color:var(--chalk)}
.kpis .k span{font-size:13px;color:var(--chalk-dim);display:block;margin-top:6px}

/* ---------- espace élève (gabarits eleve_*) ---------- */
.el-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0 16px;border-bottom:1px solid var(--line);margin-bottom:22px}
.el-top .logo-tn{height:20px}
.el-retour{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--chalk-dim);min-height:40px}
.el-retour:hover{color:var(--chalk)}
/* Bandeau média en tête de l'espace élève et de sa page de connexion (_bandeau_eleve.html) :
   photo ; sur grand écran de l'espace, vidéo muette en boucle posée sur la photo. Voile sombre
   en bas pour lire le titre, dans les deux thèmes. Téléphone : photo seule, 180 px de haut. */
.e-bandeau{position:relative;height:280px;overflow:hidden;background:#1C1C1C;color:#fff;margin:0 0 18px}
.e-bandeau img,.e-bandeau video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block}
.e-bandeau::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(0,0,0,.74) 0%,rgba(0,0,0,.38) 48%,rgba(0,0,0,.06) 100%)}
.e-bandeau-texte{position:absolute;left:24px;right:76px;bottom:20px;z-index:2}
.e-bandeau-texte h1{color:#fff;margin:0;font-weight:400;font-size:34px;letter-spacing:-.03em;line-height:1.1}
.e-bandeau-texte p{color:#E6E6E6;margin:6px 0 0;font-size:14.5px;line-height:1.4}
.e-bandeau-pause{position:absolute;right:16px;bottom:16px;z-index:3;width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0;background:rgba(0,0,0,.35);color:#fff;border:1px solid rgba(255,255,255,.7);cursor:pointer}
.e-bandeau-pause[hidden]{display:none}
.e-bandeau-pause:hover{background:rgba(0,0,0,.6);border-color:#fff}
.e-bandeau-pause:focus-visible{outline:2px solid #fff;outline-offset:3px}
.e-bandeau-pause svg{width:16px;height:16px;fill:currentColor}
.e-bandeau-pause .i-lecture,.e-bandeau-pause.en-pause .i-pause{display:none}
.e-bandeau-pause.en-pause .i-lecture{display:block}
.login-card .e-bandeau{height:170px;margin:0}
.login-card .e-bandeau-texte{left:22px;right:22px;bottom:16px}
.login-card .e-bandeau-texte h1{font-size:28px}
@media(max-width:767px){
  .e-bandeau{height:180px}
  .e-bandeau video,.e-bandeau-pause{display:none}
  .e-bandeau-texte{left:16px;right:16px;bottom:14px}
  .e-bandeau-texte h1{font-size:28px}
  .login-card .e-bandeau{height:150px}
}

/* ---------- barres de défilement fines ---------- */
.nav{scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
.nav::-webkit-scrollbar{width:6px}
.nav::-webkit-scrollbar-thumb{background:var(--line-2)}
.nav::-webkit-scrollbar-track{background:transparent}

@media(max-width:860px){
  .app{grid-template-columns:64px minmax(0,1fr)}
  .s-brand .logo-tn:not(.logo-tn-mono),.s-brand .sub,.nav-i span,.nav-sec,.acct .nm,.acct .rl{display:none}
  .s-brand .logo-tn-mono{display:block;height:26px}
  .s-brand{justify-content:center;padding:4px 0 18px}.nav-i{justify-content:center;padding:10px 0}.acct{justify-content:center;padding:10px 0}
  .acct-out{display:none}
  .search{display:none}
  .bar{padding:0 16px}.content{padding:22px 16px 48px}.flash{margin:14px 16px 0}
  .keychip span:not(.d){display:none}
}
.login-card .brand .brand-sub{font-size:15px;color:var(--chalk-faint);border-left:1px solid var(--line-2);padding-left:12px;line-height:1.1}
/* pastilles d'état (diffusion) : publié, programmé, optionnel */
.pastille{display:inline-block;width:8px;height:8px;border-radius:50% !important;background:var(--teal);vertical-align:1px}
.pastille.prog{background:var(--pending)}
.pastille.opt{background:transparent;border:1px solid var(--chalk-faint)}
/* Nouvelle interface, aperçu activable par compte (lot B2.1, 10/2026) : barre à cinq entrées, onglets
   provisoires de la rubrique dans la barre du haut, filtre par année, confirmations dans la page. */
.side-v2 .nav{gap:2px}
.side-v2 .nav-i{padding:9px 12px;font-size:14.5px}
.v2-tag{display:block;margin:8px 12px 8px;padding:5px 8px;font-size:11.5px;color:var(--chalk-faint);border:1px solid var(--line);text-align:center}
.v2-tag:hover{color:var(--chalk);border-color:var(--chalk-faint)}
.bar-l{min-width:0;align-self:stretch;display:flex}
.v2-onglets{display:flex;align-items:stretch;gap:2px;overflow-x:auto;scrollbar-width:none;min-width:0}
.v2-onglets::-webkit-scrollbar{display:none}
.v2-onglets a{display:flex;align-items:center;padding:0 12px;font-size:13.5px;color:var(--chalk-dim);border-bottom:2px solid transparent;white-space:nowrap}
.v2-onglets a:hover{color:var(--chalk)}
.v2-onglets a.on{color:var(--chalk);font-weight:500;border-bottom-color:var(--chalk)}
.v2-filtre{display:inline-flex;flex-wrap:wrap;border:1px solid var(--line-2);max-width:100%}
.v2-filtre a{padding:6px 12px;font-size:13px;color:var(--chalk-dim);border-right:1px solid var(--line-2);white-space:nowrap}
.v2-filtre a:last-child{border-right:0}
.v2-filtre a:hover{color:var(--chalk)}
.v2-filtre a.on{background:var(--chalk);color:var(--board)}
.v2-filtre .n{font-family:var(--mono);font-size:11.5px;margin-left:6px;opacity:.75}
.v2-filtre.serre{display:flex;flex-wrap:nowrap}.v2-filtre.serre a{flex:1 1 auto;text-align:center;padding:6px 6px;font-size:12px}.v2-filtre.serre .n{margin-left:4px}
.v2-annee{display:inline-block;font-family:var(--mono);font-size:11px;color:var(--chalk-dim);border:1px solid var(--line-2);padding:0 6px;line-height:18px;margin-left:6px;vertical-align:1px}
.v2-annee.arch{color:var(--board);background:var(--chalk-dim);border-color:var(--chalk-dim)}
.v2-confirm>summary{list-style:none;cursor:pointer;display:inline-flex}
.v2-confirm>summary::-webkit-details-marker{display:none}
.v2-confirm[open]>summary{display:none}
.v2-confirm .v2-panneau{border:1px solid var(--line-2);background:var(--board);padding:12px 14px;font-size:13px;color:var(--chalk-dim);max-width:520px}
.v2-confirm .v2-panneau p{margin:0 0 10px}
.v2-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.v2-suggestion{margin-top:12px;border:1px dashed var(--line-2);padding:10px 12px;font-size:12.5px;color:var(--chalk-dim)}
.v2-suggestion>summary{cursor:pointer;list-style:none}
.v2-suggestion>summary::-webkit-details-marker{display:none}
.v2-suggestion label{display:flex;gap:8px;align-items:flex-start;padding:4px 0;font-size:13px;color:var(--chalk)}
.v2-suggestion input{margin-top:3px;accent-color:var(--chalk)}
@media(max-width:860px){.v2-tag{display:none}.v2-onglets a{padding:0 9px}}
/* ---------- Lot B2 (10/2026, aperçu) : pages Matière et Classe à onglets, recherche Ctrl+K, retours en place.
   Uniquement des jetons de couleur ; angles droits ; rien ne déborde à 390 px (les tableaux larges défilent
   dans leur cadre, la rangée d'onglets défile horizontalement). ---------- */
.v2-page{max-width:1240px}
.v2-ariane{font-size:13px;color:var(--chalk-faint);display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}
.v2-ariane a{color:var(--chalk-dim)}
.v2-ariane a:hover{color:var(--chalk);text-decoration:underline;text-underline-offset:3px}
.v2-ariane .sep{color:var(--line-2)}
.v2-ariane [aria-current]{color:var(--chalk-dim)}
.v2-entete{display:flex;gap:24px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.v2-entete .tx{flex:1 1 420px;min-width:0}
.v2-entete h1{font-weight:400;font-size:34px;letter-spacing:-.03em;line-height:1.12;margin-top:8px;overflow-wrap:anywhere}
.v2-meta{display:flex;flex-wrap:wrap;gap:4px 20px;font-size:14px;color:var(--chalk-dim);margin-top:10px}
.v2-meta b{color:var(--chalk);font-weight:500}
.v2-meta a{color:var(--chalk);text-decoration:underline;text-underline-offset:3px}
.v2-acces{display:flex;gap:14px;align-items:center;border:1px solid var(--line-2);padding:10px 12px;background:var(--board)}
.v2-acces img{width:84px;height:84px;flex-shrink:0}
.v2-acces .code{font-size:22px;letter-spacing:.08em;font-weight:500;color:var(--chalk)}
.v2-acces .lb{font-size:12px;color:var(--chalk-faint)}
.v2-tabs{display:flex;gap:30px;border-bottom:1px solid var(--line);margin:24px 0 28px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.v2-tabs::-webkit-scrollbar{display:none}
.v2-tabs a{padding:12px 0 11px;border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--chalk-dim);white-space:nowrap;font-size:15px;flex-shrink:0}
.v2-tabs a:hover{color:var(--chalk)}
.v2-tabs a.on{border-color:var(--chalk);color:var(--chalk);font-weight:500}
.v2-sec{margin-bottom:38px}
.v2-sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:6px 14px;flex-wrap:wrap;margin-bottom:12px}
.v2-sec-h h2{font-size:21px;font-weight:400;letter-spacing:-.02em;margin:0}
.v2-sec-h h2 .n{font-size:14px;color:var(--chalk-faint);margin-left:8px;letter-spacing:0}
.v2-sec-h .aide{font-size:13px;color:var(--chalk-faint)}
.v2-note{font-size:14px;color:var(--chalk-dim);max-width:78ch;line-height:1.55}
.v2-note+.v2-note{margin-top:6px}
.v2-vide{font-size:14px;color:var(--chalk-dim);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 2px}
.v2-lien{color:var(--chalk);text-decoration:underline;text-underline-offset:3px;font-size:13.5px}
.v2-lien:hover{text-decoration-thickness:2px}
.v2-liens{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:12px}
.v2-lignes{border-top:1px solid var(--line-2)}
.v2-ligne{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding:13px 4px;border-bottom:1px solid var(--line);scroll-margin-top:80px}
a.v2-ligne{color:inherit}
a.v2-ligne:hover{background:var(--board-2)}
.v2-ligne .tt{flex:1 1 280px;min-width:0}
.v2-ligne .nm{font-size:15px;color:var(--chalk);overflow-wrap:anywhere}
.v2-ligne .nm .code{font-size:12.5px;color:var(--chalk-dim);border:1px solid var(--line-2);padding:0 6px;margin-right:8px;font-variant-numeric:tabular-nums;white-space:nowrap}
.v2-ligne .sb{font-size:12.5px;color:var(--chalk-faint);margin-top:3px;overflow-wrap:anywhere}
.v2-ligne .ac{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.v2-ligne .ac form{margin:0;display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
.v2-ligne .ch{font-size:13px;color:var(--chalk-dim);white-space:nowrap;font-variant-numeric:tabular-nums}
.v2-ligne:target,.v2-page tr:target td{background:var(--board-2);box-shadow:inset 3px 0 0 var(--chalk)}
.v2-ligne.off .nm{color:var(--chalk-faint)}
.v2-etat{display:inline-flex;align-items:center;gap:6px;font-size:12px;border:1px solid var(--line-2);padding:1px 8px;color:var(--chalk-dim);white-space:nowrap;line-height:20px}
.v2-etat.ok{color:var(--teal);border-color:color-mix(in srgb,var(--teal) 45%,transparent)}
.v2-etat.prog{color:var(--pending);border-color:color-mix(in srgb,var(--pending) 45%,transparent)}
.v2-etat.alerte{color:var(--coral);border-color:color-mix(in srgb,var(--coral) 45%,transparent)}
.v2-etat.plein{background:var(--chalk);color:var(--board);border-color:var(--chalk)}
.v2-groupe-h{font-size:13px;color:var(--chalk-dim);margin:22px 0 6px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.v2-groupe-h b{color:var(--chalk);font-weight:500;font-size:14px}
.v2-cartes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px}
.v2-carte{background:var(--board-2);padding:16px 18px;min-width:0}
.v2-carte .v{font-weight:300;font-size:30px;line-height:1.05;letter-spacing:-.02em;color:var(--chalk)}
.v2-carte .l{font-size:13px;color:var(--chalk-dim);margin-top:6px}
.v2-form{background:var(--board-2);padding:20px 22px}
.v2-form .rang{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:12px}
.v2-form .rang+.rang,.v2-form .champ+.champ,.v2-form .rang+.champ,.v2-form .champ+.rang{margin-top:12px}
.v2-form textarea.field{font-size:14px}
.v2-actions-form{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin-top:16px}
.v2-mini-form{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap;margin:0}
.v2-mini-form select.field,.v2-mini-form input.field{min-height:32px;padding:4px 8px;font-size:13px;width:auto;max-width:100%}
.v2-retour{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 10px;font-size:13px;color:var(--chalk-dim);line-height:1.4;max-width:100%}
.v2-retour.ok{color:var(--teal)}
.v2-retour.erreur{color:var(--coral)}
.v2-retour a{color:var(--chalk);text-decoration:underline;text-underline-offset:3px}
.v2-retour form{display:inline-flex;margin:0}
.v2-retour .mini{min-height:28px}
.v2-zone-retour{display:flex;flex-direction:column;gap:6px;margin:0 0 12px}
.v2-zone-retour:empty{display:none}
.v2-zone-retour .v2-retour{display:flex;border-left:3px solid var(--line-2);padding:8px 12px;background:var(--board-2);color:var(--chalk)}
.v2-zone-retour .v2-retour.erreur{border-color:var(--coral)}
.v2-zone-retour .v2-retour.ok{border-color:var(--teal)}
.v2-flash-plus{margin:8px 32px 0;display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:14px}
.v2-flash-plus form{display:inline-flex;gap:8px;align-items:center;margin:0}
.v2-flash-plus .q{font-size:12.5px;color:var(--chalk-faint)}
.v2-flash-plus a{color:var(--chalk);text-decoration:underline;text-underline-offset:3px}
.v2-progression{height:4px;background:var(--board-3);margin-top:12px;overflow:hidden;max-width:520px}
.v2-progression i{display:block;height:100%;width:0;background:var(--chalk);transition:width .2s linear}
.v2-progression-tx{font-size:12.5px;color:var(--chalk-dim);margin-top:6px;font-variant-numeric:tabular-nums}
.v2-defile{overflow-x:auto;max-width:100%}
.v2-tab{width:100%;border-collapse:collapse;font-size:13.5px}
.v2-tab th{text-align:left;font-weight:400;font-size:12.5px;color:var(--chalk-dim);padding:8px 10px;border-bottom:1px solid var(--line-2);white-space:nowrap}
.v2-tab td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.v2-tab td.n{white-space:nowrap;font-variant-numeric:tabular-nums}
.v2-tab a{color:var(--chalk);text-decoration:underline;text-underline-offset:3px}
.v2-plie>summary{cursor:pointer;list-style:none;font-size:13px;color:var(--chalk-dim);display:inline-flex;gap:6px;align-items:center}
.v2-plie>summary::-webkit-details-marker{display:none}
.v2-plie>summary::before{content:"+";width:12px;text-align:center;color:var(--chalk-faint)}
.v2-plie[open]>summary::before{content:"\2212"}
.v2-plie .corps{padding:8px 0 4px 18px;font-size:13.5px;color:var(--chalk-dim)}
.v2-liste-points{margin:6px 0 0 18px;font-size:14px;line-height:1.55;color:var(--read)}
.v2-liste-points li{margin:3px 0}
.v2-liste-points li.partiel{color:var(--chalk-dim)}
.v2-md{font-size:15px;line-height:1.7;color:var(--read);max-width:80ch;overflow-wrap:anywhere}
.v2-md h2,.v2-md h3,.v2-md h4{font-weight:500;color:var(--chalk);margin:20px 0 8px}
.v2-md h2{font-size:20px}.v2-md h3{font-size:17px}.v2-md h4{font-size:15px}
.v2-md p{margin:8px 0}.v2-md ul,.v2-md ol{margin:6px 0 6px 22px}
.v2-md .mdtbl{overflow-x:auto}.v2-md table{border-collapse:collapse;font-size:13.5px}
.v2-md th,.v2-md td{border:1px solid var(--line);padding:6px 8px;text-align:left;vertical-align:top}
.v2-md.brut{white-space:pre-wrap}
.v2-reprendre{display:flex;align-items:center;gap:6px 16px;flex-wrap:wrap;border:1px solid var(--line-2);padding:12px 16px;margin:18px 0 6px;color:inherit}
.v2-reprendre:hover{border-color:var(--chalk)}
.v2-reprendre .k{font-size:13px;color:var(--chalk-faint)}
.v2-reprendre .nm{font-size:16px;color:var(--chalk)}
.v2-reprendre .fl{margin-left:auto;font-size:13.5px}
.v2-outils{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin:20px 0 26px}
.v2-retour-lien{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--chalk-dim);padding:0 2px;max-width:100%;min-width:0}
.v2-retour-lien span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v2-retour-lien:hover{color:var(--chalk)}
.v2-chercher{margin:0 0 10px;border:1px solid var(--line)}
.v2-chercher .v2-kbd{margin-left:auto}
.v2-kbd{font-family:var(--sans);font-size:11px;border:1px solid var(--line-2);padding:0 5px;color:var(--chalk-faint);line-height:18px;white-space:nowrap}
.v2-sans-defilement{overflow:hidden}
.v2-palette-fond{position:fixed;inset:0;z-index:100;background:color-mix(in srgb,var(--board) 80%,transparent);display:flex;align-items:flex-start;justify-content:center;padding:9vh 16px 16px}
.v2-palette-fond[hidden]{display:none}
.v2-palette{width:100%;max-width:660px;background:var(--board);border:1px solid var(--line-2);display:flex;flex-direction:column;max-height:78vh;min-width:0}
.v2-palette .tete{display:flex;align-items:center;gap:10px;padding:0 14px 0 18px;border-bottom:1px solid var(--line)}
.v2-palette .tete .ico{color:var(--chalk-faint);width:18px;height:18px}
.v2-palette input{flex:1;min-width:0;border:0;padding:17px 0;font-size:17px;background:transparent;outline:none;color:var(--chalk)}
.v2-palette input::placeholder{color:var(--chalk-faint)}
.v2-palette .fermer{background:none;border:1px solid var(--line-2);color:var(--chalk-dim);font-size:12px;padding:2px 8px;cursor:pointer}
.v2-palette .res{overflow-y:auto;padding:4px 0 8px;min-height:60px}
.v2-palette .grp{font-size:12px;color:var(--chalk-faint);padding:12px 18px 4px;display:flex;justify-content:space-between;gap:10px}
.v2-palette [role=option]{display:flex;flex-direction:column;gap:1px;padding:8px 18px;cursor:pointer;color:inherit}
.v2-palette [role=option] .t{color:var(--chalk);font-size:14.5px;overflow-wrap:anywhere}
.v2-palette [role=option] .d{color:var(--chalk-faint);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v2-palette [role=option][aria-selected=true]{background:var(--board-2);box-shadow:inset 3px 0 0 var(--chalk)}
.v2-palette mark,.v2-resultats mark{background:none;color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.v2-palette .etat{padding:16px 18px;font-size:13.5px;color:var(--chalk-dim)}
.v2-palette .pied{border-top:1px solid var(--line);padding:8px 18px;font-size:12px;color:var(--chalk-faint);display:flex;gap:6px 16px;flex-wrap:wrap}
.v2-palette .pied a{color:var(--chalk-dim);text-decoration:underline;margin-left:auto}
@media(max-width:860px){
  .v2-entete h1{font-size:28px}
  .v2-tabs{gap:22px;margin:18px 0 22px}
  .v2-flash-plus{margin:8px 16px 0}
  .v2-chercher{border:0;margin:0 0 4px}
  .v2-chercher .v2-kbd{display:none}
  .v2-acces img{width:64px;height:64px}
  .v2-retour-lien{font-size:13px}
}
@media(max-width:480px){
  .v2-form{padding:16px 14px}
  .v2-palette-fond{padding:12px 8px}
  .v2-palette{max-height:88vh}
}
.v2-cache{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;padding:0;margin:-1px}
.v2-page [id]{scroll-margin-top:84px}
.v2-bloc{border-bottom:1px solid var(--line)}
.v2-bloc:first-of-type{border-top:1px solid var(--line-2)}
.v2-bloc>.v2-ligne{border-bottom:0}
.v2-sous-bloc{margin:0 4px 14px}
.v2-page .af-actions .af-retrait{display:inline-block;position:relative;vertical-align:middle;margin-left:6px}
.v2-page .af-actions .af-retrait>summary{display:inline-flex}
.v2-page .af-actions .af-retrait .v2-panneau{position:absolute;right:0;top:100%;z-index:6;width:min(340px,78vw);white-space:normal;text-align:left}
/* Un élément caché aux yeux (v2-cache, af-cache) dans un tableau qui défile reste dans son cadre : sans
   position relative, il s'aligne sur la page et l'élargit à 390 px. */
.v2-defile,.v2-page .af-defile{position:relative}
.v2-page .btn{white-space:normal;text-align:center;height:auto;padding-top:7px;padding-bottom:7px}
.v2-ligne .ac,.v2-ligne .ac form,.v2-mini-form{max-width:100%;min-width:0}
.v2-mini-form select.field{max-width:100%;text-overflow:ellipsis}
.v2-tab td:first-child{min-width:150px}
/* ---------- Lot C2 (10/2026, aperçu) : demandes de production. Jetons existants, angles droits, aucune ombre ;
   rien ne déborde à 390 px (le formulaire et les panneaux prennent la largeur disponible). ---------- */
.dem-produire{margin:0 0 14px}
.dem-produire>summary{list-style:none;cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.dem-produire>summary::-webkit-details-marker{display:none}
.dem-produire[open]>summary{margin-bottom:10px}
.dem-produire [data-pour][hidden]{display:none}
.dem-detail{margin:-4px 4px 14px;font-size:13.5px;line-height:1.5;color:var(--chalk-dim);display:grid;gap:6px;max-width:86ch;overflow-wrap:anywhere}
.dem-detail p{margin:0;white-space:pre-line}
.dem-detail b{color:var(--chalk);font-weight:500}
.dem-objets{margin:0;padding:0;list-style:none;display:grid;gap:4px}
.dem-objets a{color:var(--chalk);text-decoration:underline;text-underline-offset:3px}
.dem-objets .sb{color:var(--chalk-faint);font-size:12.5px}
.dem-objets ul{margin:4px 0 2px 16px;padding:0;list-style:none;display:grid;gap:2px;font-size:13px}
.dem-reprise .v2-panneau,.dem-corriger .v2-panneau{width:min(420px,100%)}
.dem-reprise textarea.field,.dem-corriger textarea.field{min-height:76px}
a.v2-etat:hover{border-color:var(--chalk-faint);color:var(--chalk)}
.v2-ligne>.v2-retour{flex:1 1 100%}
/* ---------- Lot B3 (10/2026, aperçu) : Bibliothèque. Une liste filtrable (vue liste dense ou cartes à vignettes),
   un panneau d'aperçu fixé à droite qui a sa propre adresse. Jetons de couleur seulement, angles droits, aucune
   ombre ; rien ne déborde à 390 px (les onglets de type défilent dans leur cadre). ---------- */
.bib-pour{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;border:1px solid var(--chalk);padding:12px 16px;margin:18px 0 0;font-size:14px;color:var(--chalk)}
.bib-pour b{font-weight:500}
.bib-types{display:flex;gap:26px;border-bottom:1px solid var(--line);margin:22px 0 0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.bib-types::-webkit-scrollbar{display:none}
.bib-types a{padding:10px 0 9px;border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--chalk-dim);white-space:nowrap;font-size:14.5px;flex-shrink:0}
.bib-types a:hover{color:var(--chalk)}
.bib-types a.on{border-color:var(--chalk);color:var(--chalk);font-weight:500}
.bib-types .n{font-size:12px;color:var(--chalk-faint);margin-left:7px;font-weight:400;font-variant-numeric:tabular-nums}
.bib-filtres{background:var(--board-2);padding:14px 16px;margin:14px 0 0}
.bib-champs{display:grid;grid-template-columns:minmax(0,1.7fr) repeat(5,minmax(0,1fr)) auto;gap:10px;align-items:end}
.bib-champs .lbl{font-size:12px;margin-bottom:4px}
.bib-champs .field{min-height:36px;padding:6px 10px;font-size:13.5px;text-overflow:ellipsis}
.bib-boutons{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.bib-boutons .btn{min-height:36px}
@media(max-width:1180px){.bib-champs{grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}.bib-q{grid-column:1/-1}}
.bib-barre{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between;margin:18px 0 10px}
.bib-total{font-size:13.5px;color:var(--chalk-dim)}
.bib-vues{display:inline-flex;border:1px solid var(--line-2)}
.bib-vues a{display:inline-flex;gap:6px;align-items:center;padding:5px 12px;font-size:13px;color:var(--chalk-dim)}
.bib-vues a+a{border-left:1px solid var(--line-2)}
.bib-vues a:hover{color:var(--chalk)}
.bib-vues a.on{background:var(--chalk);color:var(--board)}
.bib-resultats{transition:opacity .15s}
.bib-resultats.bib-charge{opacity:.5}
.bib-liste{list-style:none;border-top:1px solid var(--line-2)}
.bib-ligne{display:grid;grid-template-columns:18px minmax(0,1fr) fit-content(440px);gap:2px 14px;align-items:start;padding:11px 4px;border-bottom:1px solid var(--line);scroll-margin-top:80px}
.bib-ligne:hover{background:var(--board-2)}
.bib-ligne.ouvert{background:var(--board-2);box-shadow:inset 3px 0 0 var(--chalk)}
.bib-ligne .pic{display:flex;color:var(--chalk-faint);padding-top:3px}
.bib-ligne .tt{min-width:0}
.bib-ligne .nm{font-size:15px;color:var(--chalk);overflow-wrap:anywhere}
.bib-ligne .nm:hover{text-decoration:underline;text-underline-offset:3px}
.bib-ligne .sb{font-size:12.5px;color:var(--chalk-faint);margin-top:2px;overflow-wrap:anywhere}
.bib-ligne .ex{font-size:12.5px;color:var(--chalk-dim);margin-top:3px;overflow-wrap:anywhere}
.bib-ligne .ac{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;justify-content:flex-end;max-width:100%;min-width:0}
.bib-ligne .ty,.bib-carte .ty{font-size:12.5px;color:var(--chalk-dim);white-space:nowrap}
.bib .code{font-size:12.5px;color:var(--chalk-dim);border:1px solid var(--line-2);padding:0 6px;margin-right:8px;font-variant-numeric:tabular-nums;white-space:nowrap;display:inline-block;line-height:20px;vertical-align:1px}
.bib-ajout{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap;margin:0;max-width:100%}
.bib-ajout select.field{min-height:32px;padding:4px 8px;font-size:13px;width:auto;max-width:100%}
.bib-cartes{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,232px),1fr));gap:16px}
.bib-carte{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);background:var(--board);scroll-margin-top:80px}
.bib-carte:hover{border-color:var(--chalk-faint)}
.bib-carte.ouvert{border-color:var(--chalk);box-shadow:inset 0 0 0 1px var(--chalk)}
.bib-carte .lien{display:flex;flex-direction:column;flex:1;color:inherit;min-width:0}
.bib-carte .vis{display:flex;align-items:center;justify-content:center;aspect-ratio:16/9;background:var(--board-2);overflow:hidden;border-bottom:1px solid var(--line)}
.bib-carte .vis img{display:block;width:100%;height:100%;object-fit:cover}
.bib-carte .vis img.page{object-position:top}
.bib-carte .tx{display:flex;flex-direction:column;gap:3px;padding:10px 12px 12px;min-width:0}
.bib-carte .nm{font-size:14.5px;color:var(--chalk);line-height:1.35;overflow-wrap:anywhere}
.bib-carte .sb{font-size:12px;color:var(--chalk-faint);overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bib-carte .pied{padding:0 12px 12px}
.bib-tuile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;height:100%;padding:12px;text-align:center;color:var(--chalk-dim)}
.bib-tuile .cd{font-size:24px;font-weight:300;letter-spacing:-.01em;color:var(--chalk);font-variant-numeric:tabular-nums}
.bib-tuile .fm{font-size:12px;color:var(--chalk-faint)}
.bib-tuile .ico{width:26px;height:26px}
.bib-pages{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:20px;font-size:13.5px}
.bib-pages a,.bib-pages span.on{min-width:34px;height:34px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line-2);color:var(--chalk-dim);font-variant-numeric:tabular-nums}
.bib-pages a:hover{border-color:var(--chalk);color:var(--chalk)}
.bib-pages span.on{background:var(--chalk);color:var(--board);border-color:var(--chalk)}
.bib-pages .ell{color:var(--chalk-faint);padding:0 2px}
.bib-panneau{position:fixed;top:0;right:0;bottom:0;z-index:40;width:min(600px,100%);background:var(--board);border-left:1px solid var(--line-2);overflow-y:auto;overscroll-behavior:contain;padding:0 28px 48px}
.bib-panneau .tete{position:sticky;top:0;z-index:2;background:var(--board);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0 12px;border-bottom:1px solid var(--line);margin-bottom:18px}
.bib-panneau .tete .ty{display:inline-flex;gap:8px;align-items:center;font-size:13px;color:var(--chalk-dim);min-width:0}
.bib-fermer{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--chalk-dim);border:1px solid var(--line-2);padding:5px 10px;white-space:nowrap}
.bib-fermer:hover{color:var(--chalk);border-color:var(--chalk)}
.bib-panneau h2{font-size:25px;font-weight:400;letter-spacing:-.025em;line-height:1.22;overflow-wrap:anywhere;outline:none}
.bib-panneau .meta{font-size:13.5px;color:var(--chalk-dim);margin-top:8px;overflow-wrap:anywhere}
.bib-origine{font-size:13.5px;color:var(--chalk-dim);margin-top:14px;border-left:2px solid var(--line-2);padding:2px 0 2px 10px;overflow-wrap:anywhere}
.bib-objet{font-size:14.5px;line-height:1.6;color:var(--read);margin-top:12px}
.bib-p-sec{margin-top:28px}
.bib-p-sec h3{font-size:16px;font-weight:500;letter-spacing:-.01em;margin:0 0 10px}
.bib-p-sec h3 .n{font-size:13px;color:var(--chalk-faint);margin-left:8px;font-weight:400}
.bib-p-sec>.v2-sec-h{margin-bottom:0}
.bib-p-sec .v2-zone-retour{margin:0 0 10px}
.bib-visuels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.bib-visuels a{display:block;border:1px solid var(--line);background:var(--board-2);overflow:hidden;aspect-ratio:16/9}
.bib-visuels a.page{aspect-ratio:70/99}
.bib-visuels img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.bib-fichiers,.bib-pliste{list-style:none;border-top:1px solid var(--line)}
.bib-fichiers li,.bib-pliste li{display:flex;flex-wrap:wrap;gap:2px 12px;align-items:baseline;padding:8px 2px;border-bottom:1px solid var(--line);font-size:14px;min-width:0}
.bib-fichiers a,.bib-pliste a,.bib-pub .tt a{color:var(--chalk);text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.bib-fichiers .nf,.bib-pliste .q{font-size:12px;color:var(--chalk-faint);overflow-wrap:anywhere}
.bib-fichiers+.v2-note,.bib-pliste+.v2-note{margin-top:8px;font-size:13px}
.bib-pub{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;padding:10px 2px;border-bottom:1px solid var(--line)}
.bib-pub:first-of-type{border-top:1px solid var(--line)}
.bib-pub .tt{flex:1 1 220px;min-width:0;font-size:14px}
.bib-pub .sb{font-size:12.5px;color:var(--chalk-faint);margin-top:2px}
.bib-pub .ac{display:flex;gap:6px;flex-wrap:wrap;max-width:100%}
.bib-pub .ac form{margin:0;display:inline-flex}
.bib-form{background:var(--board-2);padding:14px 16px;margin-top:12px}
.bib-form .rang{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,170px);gap:10px}
.bib-form .rang>div:only-child{grid-column:1/-1}
.bib-form .v2-actions-form{margin-top:12px}
.bib-form .v2-note{font-size:12.5px;margin-top:10px}
.bib-attente{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:var(--chalk-dim);border:1px dashed var(--line-2);padding:10px 12px;margin-top:12px}
.bib-attente .ico{margin-top:2px}
.bib-texte{margin-top:16px !important;padding-top:14px !important}
.bib-texte .v2-md{font-size:14.5px}
.bib-texte .v2-md h1{font-size:21px;font-weight:500;margin:6px 0 10px;letter-spacing:-.015em}
.bib-texte .v2-md h2{font-size:18px}
.bib-rattacher{display:flex;gap:10px;flex-wrap:wrap}
.bib-rattacher .field{flex:1 1 260px;min-width:0}
@media(min-width:1280px){
  .v2-page.bib-avec-panneau{padding-right:632px}
  .bib-avec-panneau .bib-champs{grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
  .bib-avec-panneau .bib-q{grid-column:1/-1}
  .bib-avec-panneau .bib-types{gap:20px}
}
@media(max-width:640px){
  .bib-champs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bib-ligne{grid-template-columns:18px minmax(0,1fr)}
  .bib-ligne .ac{grid-column:2;justify-content:flex-start}
  .bib-panneau{padding:0 16px 40px}
  .bib-panneau h2{font-size:22px}
  .bib-form .rang{grid-template-columns:minmax(0,1fr)}
  .bib-types{gap:20px}
}
/* ---------- Lot B4 (10/2026) : un Studio moins austère. Connexion en écran partagé (vue de tous), couvertures photo
   des formations et des matières, accès aux pages web du lecteur, Accueil « Ma semaine » (aperçu). Jetons de couleur
   seulement, sauf le texte posé sur une photo, toujours blanc sur un dégradé sombre (comme le bandeau élève). Angles
   droits, aucune ombre ; rien ne déborde à 390 px. ---------- */
/* B4.2 · Connexion : média à gauche (en haut sur téléphone), formulaire à droite. */
.login-wrap.cx{display:grid;grid-template-columns:minmax(0,1fr) minmax(400px,40%);align-items:stretch;justify-content:stretch;padding:0;background:var(--board);min-height:100vh}
.cx-media{position:relative;overflow:hidden;background:#1C1C1C;min-height:100vh}
.cx-media img,.cx-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:42% 35%;display:block}
.cx-media .cx-pause{right:20px;bottom:20px}
.cx-form{display:flex;align-items:center;justify-content:center;padding:40px 32px;min-width:0;background:var(--board)}
.cx .login-card .brand{justify-content:flex-start}
.cx .login-card .panel{padding:6px 0 0;background:transparent}
@media(max-width:859px){
  .login-wrap.cx{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr}
  .cx-media{min-height:0;height:210px}
  .cx-media video,.cx-media .cx-pause{display:none}
  .cx-form{align-items:flex-start;padding:28px 16px 40px}
}
/* B4.1 · Couvertures : bandeau photo de la matière et de la formation, vignettes, choix de la couverture. */
.couv{position:relative;height:230px;margin:14px 0 2px;overflow:hidden;background:var(--board-3)}
.couv-img{position:absolute;inset:0}
.couv-img img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 40%}
.couv-img::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.34) 50%,rgba(0,0,0,.04) 100%)}
.couv-tx{position:absolute;left:26px;right:230px;bottom:20px;z-index:2;min-width:0}
.couv .couv-tx h1,.couv .couv-tx h2,.couv .couv-titre{color:#fff;margin:0;overflow-wrap:anywhere}
.couv-changer{position:absolute;right:18px;bottom:18px;z-index:3;font-size:13px;color:#fff;border:1px solid rgba(255,255,255,.75);padding:6px 12px;background:rgba(0,0,0,.25);white-space:nowrap}
.couv-changer:hover{background:rgba(0,0,0,.55);border-color:#fff}
.couv-changer:focus-visible{outline:2px solid #fff;outline-offset:3px}
.couv-formation{height:150px;margin:0 0 10px}
.couv-formation h2{font-size:24px;font-weight:400;letter-spacing:-.02em;line-height:1.2}
.couv .v2-annee{color:#fff;border-color:rgba(255,255,255,.7)}
.couv .v2-annee.arch{background:rgba(0,0,0,.35)}
.couv-apercu{height:200px;margin-top:20px}
.couv-titre{font-size:24px;font-weight:400;letter-spacing:-.02em;line-height:1.2}
.couv-vign{flex:0 0 72px;width:72px;height:48px;overflow:hidden;background:var(--board-3)}
.couv-vign img{display:block;width:100%;height:100%;object-fit:cover}
.couv-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:14px;margin-top:10px}
.couv-choix{display:flex;flex-direction:column;text-align:left;padding:0;border:1px solid var(--line);background:var(--board);color:var(--chalk);cursor:pointer;min-width:0;font:inherit}
.couv-choix:hover{border-color:var(--chalk-faint)}
.couv-choix.on{border-color:var(--chalk);box-shadow:inset 0 0 0 1px var(--chalk)}
.couv-choix img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;background:var(--board-2)}
.couv-choix .tx{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:8px 10px 10px;font-size:12.5px;line-height:1.4;color:var(--chalk-dim)}
.couv-choix[disabled]{cursor:default;opacity:1}
.couv-groupe+.couv-groupe{margin-top:24px}
.couv-groupe .v2-sec-h,.couv-groupe .v2-groupe-h{margin:0 0 4px}
.couv-groupe .v2-zone-retour{margin:8px 0 6px}
.couv-sec{margin-top:32px}
.couv-groupe [data-v2-retour]:empty{display:none}
.couv-etat{margin-top:12px}
.couv-etat .v2-actions-form{margin-top:10px}
@media(max-width:640px){
  .couv{height:auto;background:none}
  .couv-img{position:relative;height:150px;background:var(--board-3)}
  .couv-img::after{display:none}
  .couv-tx{position:static;padding:12px 0 0}
  .couv .couv-tx h1,.couv .couv-tx h2,.couv .couv-titre{color:var(--chalk)}
  .couv .v2-annee{color:var(--chalk-dim);border-color:var(--line-2);background:none}
  .couv .v2-annee.arch{color:var(--board);background:var(--chalk-dim)}
  .couv-changer{position:static;display:inline-block;margin-top:8px;color:var(--chalk);border-color:var(--line-2);background:none;padding:4px 10px;white-space:normal}
  .couv-changer:hover{border-color:var(--chalk);background:none}
  .couv-changer:focus-visible{outline-color:var(--chalk)}
  .couv-formation .couv-img{height:110px}
  .couv-vign{flex-basis:56px;width:56px;height:38px}
}
/* B4.0 · Pages web du lecteur en ligne. */
.v2-web{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin-top:14px}
.bib-types a.bib-web{margin-left:auto;display:inline-flex;gap:7px;align-items:center;color:var(--chalk);position:relative}
.bib-types a.bib-web:hover{text-decoration:underline;text-underline-offset:3px}
.bib-panneau .v2-web{margin-top:14px}
/* B4.3 · Accueil « Ma semaine ». */
.sem-bandeau{position:relative;height:250px;overflow:hidden;background:var(--board-3)}
.sem-bandeau img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 38%;display:block}
.sem-bandeau::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(0,0,0,.74) 0%,rgba(0,0,0,.36) 52%,rgba(0,0,0,.06) 100%)}
.sem-bandeau-tx{position:absolute;left:28px;right:28px;bottom:22px;z-index:2;max-width:880px}
.sem-bandeau-tx .sur{font-size:13px;color:#E6E6E6;margin:0 0 4px}
.sem-bandeau-tx h1{color:#fff;font-weight:400;font-size:40px;letter-spacing:-.035em;line-height:1.08;margin:0}
.sem-bandeau-tx p:last-child{color:#E6E6E6;font-size:15px;margin:8px 0 0;line-height:1.45}
.sem-liens{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin:18px 0 28px}
.sem-prochaine{border:1px solid var(--chalk);padding:20px 22px;background:var(--board)}
.sem-prochaine .quand{font-size:13.5px;color:var(--chalk-dim);font-variant-numeric:tabular-nums;margin:0}
.sem-prochaine .titre{font-size:26px;font-weight:400;letter-spacing:-.025em;line-height:1.2;margin:4px 0 0;overflow-wrap:anywhere}
.sem-prochaine .titre a:hover,.sem-ligne .nm a:hover{text-decoration:underline;text-underline-offset:4px}
.sem-prochaine .qui{font-size:14px;color:var(--chalk-dim);margin:6px 0 0}
.sem-prochaine .qui a,.sem-ligne .sb a{color:var(--chalk);text-decoration:underline;text-underline-offset:3px}
.sem-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px}
.sem-actions form{margin:0}
.sem-ligne{align-items:flex-start}
.sem-ligne .h{flex:0 0 96px;font-variant-numeric:tabular-nums;font-size:14px;color:var(--chalk);padding-top:1px}
.sem-ligne .nm a{color:inherit}
.sem-fiches{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;font-size:12.5px;color:var(--chalk-dim);margin-top:8px}
.sem-fiches .k{color:var(--chalk-faint)}
.sem-fiche{display:inline-flex;gap:8px;align-items:baseline}
.sem-fiche .code{border:1px solid var(--line-2);padding:0 6px;color:var(--chalk-dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.sem-fiche a{color:var(--chalk);text-decoration:underline;text-underline-offset:3px}
.sem-quiz{display:inline-block;max-width:100%}
.sem-quiz .corps{display:flex;flex-direction:column;gap:6px}
.sem-quiz .v2-mini-form>span{font-size:13px;color:var(--chalk-dim)}
.sem-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:0 36px}
.sem-faible{color:var(--chalk-faint);font-size:13px}
.sem-mono{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
@media(max-width:860px){
  .sem-bandeau{height:auto;min-height:210px;display:flex;align-items:flex-end}
  .sem-bandeau::after{background:linear-gradient(0deg,rgba(0,0,0,.8) 0%,rgba(0,0,0,.56) 58%,rgba(0,0,0,.22) 100%)}
  .sem-bandeau-tx{position:relative;left:auto;right:auto;bottom:auto;padding:84px 16px 16px}
  .sem-bandeau-tx h1{font-size:30px}
  .sem-bandeau-tx p:last-child{font-size:13.5px}
  .sem-prochaine{padding:16px}
  .sem-prochaine .titre{font-size:22px}
  .sem-ligne .h{flex-basis:100%}
}
/* Barre du haut sur téléphone (11/10/2026) : les onglets de la rubrique passent sur une seconde ligne sous les
   boutons, au lieu d'être écrasés à zéro de large par « Importer » et « Clair / Sombre ». */
@media(max-width:600px){
  .bar{height:auto;min-height:56px;flex-wrap:wrap;row-gap:0;padding:8px 16px 0}
  .bar-r{margin-left:auto;padding-bottom:8px}
  .bar-l{order:2;flex:1 0 100%;height:42px;margin:0 -16px;padding:0 4px;border-top:1px solid var(--line)}
  .bar-l:empty{display:none}
}