/* Luciole : « Mes classes » (connexion au Hub). L'ambiance reste visible derrière (choix de Badri, 15/11/2026) :
   simple voile sombre, PAS de flou d'arrière-plan (fait chauffer le Mac). */
.cxBouton{position:absolute;top:clamp(18px,4vh,44px);right:clamp(20px,3.2vw,56px);display:flex;align-items:center;gap:10px;
  border:1px solid rgba(255,255,255,.22);border-radius:12px;padding:10px 16px;font-size:16px;font-weight:600;
  background:rgba(4,6,14,.55);transition:background .15s,border-color .15s}
.cxBouton:hover{background:rgba(255,255,255,.1);border-color:rgba(242,198,109,.6)}
.cxBouton small{font-weight:400;font-size:13.5px;color:var(--doux)}
.cxPoint{width:9px;height:9px;border-radius:50%;background:var(--calme);box-shadow:0 0 10px var(--calme)}
body:not([data-mode=accueil]) .cxBouton{display:none}

#connexion{position:fixed;inset:0;z-index:40;display:grid;place-items:center;background:rgba(2,3,8,.45)}
.cxBoite{width:min(1100px,94vw);max-height:92vh;display:flex;flex-direction:column;gap:16px;padding:26px 32px;
  border:1px solid var(--trait);border-radius:18px;background:rgba(6,8,19,.88);box-shadow:0 20px 60px rgba(0,0,0,.5)}
.cxTete{display:flex;align-items:center;gap:14px}
.cxTete h2{font-size:28px;font-weight:500}
.esp{flex:1}
.cxFil{display:flex;gap:8px;font-size:14px;color:var(--doux)}
.cxFil b{color:var(--or);font-weight:600}
.cxAide{color:var(--doux);font-size:15.5px;line-height:1.45}
.cxErreur{color:var(--bruit);font-size:15px}
.cxGrille{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;overflow:auto;min-height:0}
.cxGrille .chip{padding:10px 12px;font-size:15.5px;text-align:left}
.cxRecherche{font:inherit;font-size:18px;padding:12px 16px;border:1px solid var(--trait);border-radius:12px;
  background:transparent;color:inherit;max-width:460px;width:100%}
.cxRecherche:focus{outline:none;border-color:var(--or)}
.cxMdp{display:flex;flex-direction:column;gap:12px;max-width:460px}
.cxQui{font-size:20px}
.cxMdp input[type=password]{font:inherit;font-size:22px;letter-spacing:.2em;padding:12px 16px;border-radius:11px;
  border:1px solid var(--trait);background:rgba(255,255,255,.05);color:var(--texte)}
.cxReste{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.4;cursor:pointer}
.cxReste input{width:20px;height:20px;margin-top:2px;accent-color:var(--or)}
.cxReste small{color:var(--doux);font-size:13.5px}
.cxBoutons{display:flex;gap:10px}
.cxPropose{display:flex;align-items:center;gap:18px;padding:18px 22px;border:1px solid var(--or);border-radius:14px;background:var(--or-fond)}
.cxPropose div{display:flex;flex-direction:column;gap:2px}
.cxPropose strong{font-family:Fraunces,Georgia,serif;font-size:40px;font-weight:500;line-height:1.1}
.cxDoux{color:var(--doux);font-size:14px}
.cxClasses{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;overflow:auto;min-height:0}
.cxCarte{border:1px solid var(--trait);border-radius:14px;padding:12px 16px;text-align:left;display:flex;flex-direction:column;gap:4px}
.cxCarte:hover{border-color:var(--or)}
.cxCarte strong{font-family:Fraunces,Georgia,serif;font-size:24px;font-weight:500}
.cxCarte span{color:var(--doux);font-size:14px}
.cxCarte.test{border-style:dashed}
.cxPied{display:flex;gap:12px;align-items:center;border-top:1px solid var(--trait);padding-top:14px;font-size:14px;color:var(--doux)}