/* =====================================================================
   JEUX EN CLASSE — LES OUTILS DU PROF (bloc D, 26 octobre 2026)
   Le bouton et la boîte à outils, la fenêtre « Imprimer », les cœurs des
   favoris, la rangée « Joués récemment ».
   ===================================================================== */

/* --- Le bouton de la boîte à outils, en bas à droite, hors des parties --- */
.mj-boite-btn{position:fixed;right:16px;bottom:16px;z-index:80;display:inline-flex;align-items:center;gap:9px;border-radius:999px;padding:11px 18px;font-weight:800;font-size:.95rem;
  background:#1B2052 !important;color:#F3F1FF !important;border:1.5px solid rgba(79,216,240,.6) !important;box-shadow:0 12px 30px -12px rgba(0,0,0,.7);cursor:pointer}
.mj-boite-btn svg{width:20px;height:20px;fill:none;stroke:#4FD8F0;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.mj-boite-btn:hover{border-color:#4FD8F0 !important}
html:has(#scene:not([hidden])) .mj-boite-btn,html.bo-ouverte .mj-boite-btn{display:none}
@media (max-width:560px){ .mj-boite-btn span{display:none} .mj-boite-btn{padding:12px} }

/* --- Les cœurs des favoris --- */
.mj-theme{position:relative}
.mj-coeur{flex:none;margin-left:auto;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  background:transparent;border:1.5px solid rgba(255,255,255,.3);transition:transform .15s,border-color .15s}
.mj-coeur[aria-pressed="true"]{border-color:#FF6FA5}
.mj-coeur svg{width:21px;height:21px;fill:none;stroke:#fff;stroke-width:2;stroke-linejoin:round}
.mj-coeur[aria-pressed="true"] svg{fill:#FF6FA5;stroke:#FF6FA5}
.mj-coeur:hover{transform:scale(1.08)}
.mj-coeur:focus-visible{outline:3px solid #4FD8F0;outline-offset:2px}
.mj-coeur.bat{animation:mjbat .45s cubic-bezier(.2,1.6,.4,1)}
@keyframes mjbat{40%{transform:scale(1.3)}}
.mj-favoris small{color:#FF6FA5}
.mj-favoris[aria-pressed="true"]{border-color:#FF6FA5}

/* --- Joués récemment --- */
.mj-recents{grid-column:1/-1;margin:0 0 6px}
.mj-recents h3{font-family:'Baloo 2','Nunito',sans-serif;font-weight:800;font-size:1.25rem;margin-bottom:10px}
.mj-recents-liste{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.mj-recent{display:flex;align-items:center;gap:10px;min-width:0;padding:8px 12px 8px 8px;border-radius:16px;background:#171B47;border:1px solid rgba(255,255,255,.12);color:#F3F1FF;font:inherit;text-align:left;cursor:pointer;transition:border-color .15s,transform .15s}
.mj-recent:hover{border-color:#FFD54A;transform:translateY(-2px)}
.mj-recent:focus-visible{outline:3px solid #4FD8F0;outline-offset:2px}
.mj-recent-ill{flex:none;width:52px;height:52px;border-radius:12px;background:linear-gradient(150deg,var(--c1),var(--c2));display:grid;place-items:center;overflow:hidden}
.mj-recent-ill svg{width:86%;height:86%}
.mj-recent-txt{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.mj-recent-txt b{font-size:.92rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mj-recent-txt small{color:#B9B7DA;font-size:.78rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:1100px){ .mj-recents-liste{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:640px){ .mj-recents-liste{grid-template-columns:1fr 1fr} }

/* --- La fenêtre « Imprimer » --- */
.mj-imprimer{width:min(760px,calc(100vw - 24px))}
.imp-corps{padding:16px 20px 20px;display:flex;flex-direction:column;gap:14px}
.imp-choix{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.imp-format{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;padding:12px;border-radius:16px;border:1.5px solid var(--bord);cursor:pointer;position:relative}
.imp-format:has(input:checked){border-color:var(--jaune);background:rgba(255,213,74,.06)}
.imp-format:has(input:focus-visible){outline:3px solid var(--cyan);outline-offset:2px}
.imp-format input{position:absolute;opacity:0;pointer-events:none}
.imp-dessin svg{width:60px;height:78px;display:block;filter:drop-shadow(0 4px 8px rgba(0,0,0,.4))}
.imp-format b{display:block;font-size:1.05rem;margin-bottom:4px}
.imp-format small{color:var(--doux);font-size:.88rem;line-height:1.4;display:block}
@media (max-width:640px){ .imp-choix{grid-template-columns:1fr} }

/* --- La boîte à outils --- */
.bo{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;color:#fff;font-family:'Nunito',system-ui,sans-serif;
  background:radial-gradient(120% 90% at 50% -10%,#2a2f78 0%,#141846 55%,#0b0d26 100%);outline:none}
.bo[hidden]{display:none}
.bo:fullscreen{width:100%;height:100%}
html.bo-ouverte{overflow:hidden}
.bo-haut{display:flex;align-items:center;gap:14px 20px;flex-wrap:wrap;padding:14px 22px;border-bottom:1px solid rgba(255,255,255,.12)}
.bo-titre{font-family:'Baloo 2','Nunito',sans-serif;font-size:1.5rem;font-weight:800}
.bo-onglets{display:flex;gap:6px;flex-wrap:wrap;flex:1}
.bo-onglet{font:800 .98rem 'Nunito',sans-serif;padding:9px 16px;border-radius:99px;border:1.5px solid rgba(255,255,255,.2);background:transparent;color:#fff;cursor:pointer}
.bo-onglet[aria-selected="true"]{background:#FFD54A;color:#2A1D00;border-color:transparent}
.bo-actions{display:flex;gap:8px}
.bo-btn{display:inline-flex;align-items:center;gap:8px;font:800 .92rem 'Nunito',sans-serif;padding:9px 14px;border-radius:12px;border:1.5px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#fff;cursor:pointer}
.bo-btn:disabled{opacity:.4;cursor:default}
.bo kbd{font:700 .72em/1 'Space Grotesk',sans-serif;padding:.3em .5em;border-radius:6px;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.3)}
.bo-onglet:focus-visible,.bo-btn:focus-visible,.bo-gros:focus-visible,.bo-preset:focus-visible,.bo-plus button:focus-visible{outline:3px solid #4FD8F0;outline-offset:2px}
.bo-corps{flex:1;min-height:0;overflow:auto;padding:22px clamp(16px,3vw,40px);display:flex}
.bo-outil{flex:1;min-height:0}
.bo-label{display:flex;align-items:center;gap:8px;font-weight:800;font-size:1rem}
.bo-gros{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:800 clamp(1.05rem,1.6vw,1.35rem) 'Baloo 2','Nunito',sans-serif;padding:12px 26px;border-radius:16px;border:0;background:#FFD54A;color:#2A1D00;cursor:pointer;box-shadow:0 5px 0 #E0A400}
.bo-gros:active{transform:translateY(2px);box-shadow:0 3px 0 #E0A400}
.bo-gros:disabled{opacity:.45;cursor:default}
.bo-gros kbd{background:rgba(0,0,0,.08);border-color:rgba(42,29,0,.25)}
.bo-info{color:#B9B7DA;font-weight:700}
.bo-discret{color:#8f8db5;font-size:.85rem}
.bo-lien{background:none;border:0;color:#4FD8F0;font:800 .95rem 'Nunito',sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:0;align-self:flex-start}
.bo select,.bo input[type="text"]{font:700 1rem 'Nunito',sans-serif;color:#fff;background:rgba(0,0,0,.28);border:1.5px solid rgba(255,255,255,.25);border-radius:12px;padding:9px 12px;color-scheme:dark}

/* Nom au hasard */
.bo-nom{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.6fr);gap:clamp(18px,3vw,44px)}
.bo-gauche{display:flex;flex-direction:column;gap:10px;min-height:0}
.bo-noms{width:100%;flex:1;min-height:200px;resize:vertical;font:700 1rem/1.5 'Nunito',sans-serif;color:#fff;background:rgba(0,0,0,.28);border:1.5px solid rgba(255,255,255,.25);border-radius:14px;padding:10px 12px;color-scheme:dark}
.bo-case{display:flex;gap:10px;align-items:flex-start;font-weight:800;cursor:pointer}
.bo-case input{width:18px;height:18px;margin-top:3px;accent-color:#FFD54A}
.bo-case small{display:block;font-weight:600;color:#B9B7DA;font-size:.85rem}
.bo-droite{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;min-height:0}
.bo-roue-cadre{position:relative;width:min(62vh,100%,560px);aspect-ratio:1}
.bo-roue{width:100%;height:100%}
.bo-roue svg{width:100%;height:100%;filter:drop-shadow(0 18px 30px rgba(0,0,0,.5))}
.bo-roue-g{transform-origin:0 0}
.bo-roue-vide{width:100%;height:100%;border-radius:50%;border:3px dashed rgba(255,255,255,.25);display:grid;place-items:center;text-align:center;padding:20%;color:#B9B7DA;font-weight:800;font-size:1.1rem}
.bo-pointeur{position:absolute;left:50%;top:-14px;transform:translateX(-50%);width:0;height:0;border-left:16px solid transparent;border-right:16px solid transparent;border-top:30px solid #fff;filter:drop-shadow(0 3px 2px rgba(0,0,0,.5))}
.bo-resultat{min-height:1.2em;font:800 clamp(2rem,5vw,4.2rem)/1.1 'Baloo 2','Nunito',sans-serif;color:#FFD54A;text-align:center}
.bo-resultat.vu{animation:boum .55s cubic-bezier(.2,1.6,.4,1)}

/* Équipes au hasard */
.bo-eq{display:flex;flex-direction:column;gap:18px}
.bo-reglage{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bo-equipes{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.bo-equipe{--c:#fff;border-radius:18px;padding:12px 14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-top:5px solid var(--c);animation:ouvre .35s ease both}
.bo-equipe b{font:800 1.3rem 'Baloo 2','Nunito',sans-serif;color:var(--c)}
.bo-equipe small{display:block;color:#B9B7DA;font-weight:700;margin-bottom:6px}
.bo-equipe ul{list-style:none;display:grid;gap:3px;font-weight:700;font-size:1.08rem}

/* Minuterie géante */
.bo-min{display:flex;flex-direction:column;align-items:center;gap:18px}
.bo-presets{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;align-items:center}
.bo-preset{font:800 1rem 'Nunito',sans-serif;padding:9px 14px;border-radius:12px;border:1.5px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#fff;cursor:pointer}
.bo-form{display:flex;gap:6px;margin-left:8px}
.bo-saisie{width:90px;text-align:center}
.bo-cadran{position:relative;width:min(58vh,92vw,620px);aspect-ratio:1;display:grid;place-items:center}
.bo-anneau{position:absolute;inset:0}
.bo-anneau svg{width:100%;height:100%;transform:rotate(-90deg)}
.bo-anneau circle{fill:none;stroke-width:6}
.bo-anneau .fond{stroke:rgba(255,255,255,.12)}
.bo-anneau .reste{stroke:#FFD54A;stroke-linecap:round;stroke-dasharray:100;transition:stroke-dashoffset .25s linear}
.bo-chiffres{position:relative;font:800 clamp(4rem,14vh,10rem)/1 'Bricolage Grotesque','Baloo 2',sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.bo-min.bientot .bo-chiffres,.bo-min.bientot .reste{color:#ffb15c;stroke:#ffb15c}
.bo-min.fini .reste{opacity:0}
.bo-min.fini .bo-chiffres{color:#ff7a6e;animation:clignote .8s steps(2) infinite}
.bo-boutons{display:flex;gap:12px;align-items:center}

/* Tableau de points */
.bo-pts{display:flex;flex-direction:column;gap:18px}
.bo-points{flex:1;display:grid;grid-template-columns:repeat(min(var(--n),3),minmax(0,1fr));gap:16px}
@media (min-width:1300px){ .bo-points{grid-template-columns:repeat(var(--n),minmax(0,1fr))} }
.bo-pt{--c:#fff;position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px;border-radius:22px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-top:6px solid var(--c)}
.bo-pt.tete{box-shadow:0 0 0 2px var(--c),0 18px 40px -18px var(--c)}
.bo-pt input{width:100%;text-align:center;font:800 1.2rem 'Baloo 2','Nunito',sans-serif !important;color:var(--c) !important;background:transparent !important;border-color:transparent !important}
.bo-pt input:focus{border-color:rgba(255,255,255,.3) !important}
.bo-score{font:800 clamp(3.4rem,9vh,6.5rem)/1 'Bricolage Grotesque','Baloo 2',sans-serif;font-variant-numeric:tabular-nums}
.bo-score.neg{color:#ff9a8a}
.bo-plus{display:flex;gap:8px}
.bo-plus button{font:800 1.15rem 'Nunito',sans-serif;min-width:60px;padding:10px 12px;border-radius:14px;border:1.5px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;cursor:pointer}
.bo-plus button:nth-child(2),.bo-plus button:nth-child(3){background:var(--c);color:#14110c;border-color:transparent}
.bo-touche{position:absolute;top:10px;left:12px}
.bo .pop{position:absolute;left:50%;top:40%;transform:translateX(-50%);font:800 2rem 'Baloo 2',sans-serif;color:#5ff0a8;pointer-events:none;animation:envol 1.25s ease-out forwards}
.bo .pop.neg{color:#ff8a7a}
@media (max-width:820px){ .bo-nom{grid-template-columns:1fr} }