/* Polices hébergées sur le serveur de Grignon (aucune requête vers Google). Licence SIL Open Font License. */
@font-face {
  font-family: 'Andika';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/vendor/fonts/Andika-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Andika';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/vendor/fonts/Andika-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Andika';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/vendor/fonts/Andika-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Andika';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/vendor/fonts/Andika-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Baloo 2';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/vendor/fonts/Baloo2-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Baloo 2';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/vendor/fonts/Baloo2-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Baloo 2';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/vendor/fonts/Baloo2-800-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Baloo 2';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/vendor/fonts/Baloo2-800-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/vendor/fonts/BricolageGrotesque-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/vendor/fonts/BricolageGrotesque-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/vendor/fonts/BricolageGrotesque-800-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/vendor/fonts/BricolageGrotesque-800-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/vendor/fonts/Manrope-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/vendor/fonts/Manrope-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/vendor/fonts/Manrope-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/vendor/fonts/Manrope-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/vendor/fonts/Manrope-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/vendor/fonts/Manrope-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Patrick Hand';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/vendor/fonts/PatrickHand-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Patrick Hand';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/vendor/fonts/PatrickHand-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Ogrelo : bouton flottant, panneau de discussion, tableau blanc */
[hidden]{display:none!important}
:root{--board:#FFFFFF;--board-line:#DCE6EC;--marker:#24303A;--marker-red:#D23A2E;--marker-blue:#1F66C2;--marker-green:#2B8A3E;--hand:"Patrick Hand","Comic Sans MS",cursive}
/* couleurs de TEXTE lisibles (AA 4.5:1 sur --card et sur les fonds ok/ko) : --ok/--ko restent pour les bordures et pastilles */
:root{--ok-t:#1B7A40;--ko-t:#B8322A;--info-t:#2471AE;--warn-t:#8A5A00}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--board:#F7F5EE;--ok-t:#5FD08E;--ko-t:#FF8A7E;--info-t:#8DB6F0;--warn-t:#F2B44A}}
:root[data-theme="dark"]{--board:#F7F5EE;--ok-t:#5FD08E;--ko-t:#FF8A7E;--info-t:#8DB6F0;--warn-t:#F2B44A}

.g-fab{position:fixed;right:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:40;display:flex;align-items:flex-end;gap:6px;border:0;background:none;padding:0}
.g-fab .face{width:74px;height:74px;border-radius:50%;background:var(--card);border:4px solid var(--ogre-d);box-shadow:0 6px 0 rgba(0,0,0,.18);display:grid;place-items:center;overflow:hidden}
.g-fab .face .ogre{width:66px;height:66px}
.g-fab .tip{background:var(--ink);color:var(--paper);font-family:var(--display);font-weight:800;border-radius:16px 16px 4px 16px;padding:8px 12px;margin-bottom:40px;white-space:nowrap;box-shadow:var(--shadow)}
body.g-open .g-fab{display:none}
body .wrap{padding-bottom:130px}

.g-msg.him .w{opacity:.18;transition:opacity .15s}
.g-msg.him .w.on{opacity:1}
.g-msg.him{font-size:1.1rem;line-height:1.45}
.g-panel{position:fixed;inset:auto 0 0 0;z-index:45;height:min(90vh,820px);display:flex;flex-direction:column;background:var(--paper);border-top:4px solid var(--ogre-d);border-radius:26px 26px 0 0;box-shadow:0 -10px 30px rgba(0,0,0,.25);padding-bottom:env(safe-area-inset-bottom,0px)}
.g-panel[hidden]{display:none!important}
@media (min-width:760px){.g-panel{left:auto;right:16px;bottom:16px;width:440px;height:min(88vh,780px);border-radius:26px;border:4px solid var(--ogre-d)}}
.g-head{display:flex;align-items:center;gap:10px;padding:10px 14px 6px}
.g-head .ogre{width:52px;height:52px}
.g-head b{font-family:var(--display);font-size:1.2rem;flex:1}
.g-head small{display:block;font-family:var(--body);font-weight:400;color:var(--soft);font-size:.8rem}
.g-x{border:0;background:var(--card);border-radius:999px;width:40px;height:40px;font-size:1.2rem;box-shadow:var(--shadow)}
.g-body{flex:1;min-height:0;overflow-y:auto;padding:4px 14px 8px;display:flex;flex-direction:column;gap:10px}

/* Tableau blanc */
.g-board{background:var(--board);border:6px solid #8A6A43;border-radius:12px;padding:12px 14px;color:var(--marker);font-family:var(--hand);font-size:1.25rem;line-height:1.35;box-shadow:inset 0 0 0 2px #6E5333, var(--shadow);background-image:linear-gradient(var(--board-line) 1px,transparent 1px);background-size:100% 34px}
.g-board h4{font-family:var(--hand);font-size:1.5rem;margin:0 0 6px;color:var(--marker-blue);text-decoration:underline wavy var(--marker-red) 2px;text-underline-offset:5px}
.g-board .el{margin:6px 0;opacity:0}
.g-board .el.on{animation:g-draw .45s ease-out forwards}
@keyframes g-draw{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}   /* simple apparition, sans glissement horizontal */
.g-board .c-rouge{color:var(--marker-red)} .g-board .c-bleu{color:var(--marker-blue)} .g-board .c-vert{color:var(--marker-green)}
.g-board ul{margin:0;padding-left:1.2em}
.g-board ol{margin:0;padding:0;list-style:none;counter-reset:g}
.g-board ol li{counter-increment:g;display:flex;gap:8px;align-items:baseline}
.g-board ol li::before{content:counter(g);border:2px solid var(--marker-red);color:var(--marker-red);border-radius:50%;min-width:28px;height:28px;display:inline-grid;place-items:center;font-size:1rem}
.g-board .flow{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.g-board .flow span.b{border:2px solid var(--marker);border-radius:10px;padding:0 8px}
.g-board .flow i{font-style:normal;color:var(--marker-red);font-size:1.4rem}
.g-board .mot{display:flex;flex-wrap:wrap;gap:2px}
.g-board .mot span{display:flex;flex-direction:column;align-items:center;font-size:1.8rem}
.g-board .mot span small{font-size:.95rem;border-top:2px solid currentColor;padding-top:1px}
.g-board .mot span:nth-child(1){color:var(--marker-blue)} .g-board .mot span:nth-child(2){color:var(--marker-red)} .g-board .mot span:nth-child(3){color:var(--marker-green)}
.g-board mark{--hl:#FFE45C;color:inherit;padding:0 .2em}   /* même surligneur en bandes que partout (cartes.css) */
.g-board .cmp{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.g-board .cmp>div{border:2px dashed var(--marker);border-radius:10px;padding:4px 8px;min-width:0}
.g-board .cmp b{color:var(--marker-blue)}
.g-board table{border-collapse:collapse;width:100%;font-size:1.05rem}
.g-board td,.g-board th{border:2px solid var(--marker);padding:2px 6px;text-align:left;vertical-align:top}
.g-board th{color:var(--marker-blue)}
.g-board .dessin{font-size:2.4rem;letter-spacing:6px;text-align:center}
.g-board .tblwrap{overflow-x:auto}

/* Bulles */
.g-msg{max-width:88%;padding:8px 12px;border-radius:18px;font-size:1rem}
.g-msg.me{align-self:flex-end;background:#2471AE;color:#fff;border-bottom-right-radius:4px}
.g-msg.him{align-self:flex-start;background:var(--card);border:2px solid var(--line);border-bottom-left-radius:4px}
.g-msg.info{align-self:center;background:none;color:var(--soft);font-size:.88rem;text-align:center}
.g-msg.err{align-self:center;background:var(--ko-bg);color:var(--ink);border:2px solid var(--ko)}
.g-chips{display:flex;flex-wrap:wrap;gap:6px}
.g-chip{border:2px solid var(--ogre);background:var(--card);border-radius:999px;padding:6px 12px;font-size:.92rem}

/* Barre du bas */
.g-bar{display:flex;align-items:center;gap:10px;padding:8px 14px 12px;border-top:2px solid var(--line)}
.g-mic{width:72px;height:72px;border-radius:50%;border:0;background:var(--ogre-d);color:#fff;font-size:1.9rem;flex:none;box-shadow:0 5px 0 rgba(0,0,0,.2);position:relative}
.g-mic.rec{background:var(--ko);animation:g-pulse 1.1s ease-in-out infinite}
.g-mic.busy{background:var(--soft)}
@keyframes g-pulse{0%,100%{box-shadow:0 0 0 0 rgba(224,71,60,.5)}50%{box-shadow:0 0 0 14px rgba(224,71,60,0)}}
.g-status{flex:1;min-width:0;font-size:.95rem;color:var(--soft)}
.g-status b{display:block;color:var(--ink);font-family:var(--display);font-size:1.05rem}
.g-kb{border:0;background:var(--card);border-radius:14px;width:48px;height:48px;font-size:1.3rem;box-shadow:var(--shadow);flex:none}
.g-type{display:flex;gap:8px;padding:0 14px 10px}
.g-type input{flex:1;min-width:0;border:3px solid var(--line);border-radius:14px;padding:10px 12px;font:inherit;background:var(--card);color:var(--ink)}
.g-type button{border:0;border-radius:14px;background:var(--ogre-d);color:#fff;font-family:var(--display);font-weight:800;padding:0 16px}
.g-code{display:grid;gap:10px;padding:6px 0}
.g-code input{border:3px solid var(--line);border-radius:14px;padding:12px;font:inherit;font-size:1.2rem;text-align:center;letter-spacing:2px;background:var(--card);color:var(--ink)}
.g-dots::after{content:"";animation:g-dots 1.2s steps(4) infinite}
@keyframes g-dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}
.ogre.talk .mouth{animation:g-talk .25s ease-in-out infinite alternate;transform-origin:50px 70px}
@keyframes g-talk{from{transform:scaleY(.6)}to{transform:scaleY(1.15)}}
@media (prefers-reduced-motion: reduce){.g-board .el.on{animation:none;opacity:1}.g-mic.rec,.ogre.talk .mouth,.g-dots::after{animation:none}}

/* Devoirs Pronote */
.pday{margin-bottom:12px}
.pdate{font-family:var(--display);font-weight:800;margin:4px 2px 6px;color:var(--soft)}
.pdv{background:var(--card);border:3px solid var(--line);border-radius:18px;padding:10px 12px;margin-bottom:8px;box-shadow:var(--shadow)}
.pdv p{margin:6px 0 2px;white-space:pre-line}
.pdv small{color:var(--soft)}
.pmat{display:inline-block;color:#fff;font-family:var(--display);font-weight:800;font-size:.8rem;border-radius:999px;padding:1px 10px}
.pneed{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px;padding-top:8px;border-top:2px dashed var(--line)}
.pneed span{flex:1;min-width:160px;font-size:.95rem}
.pbtn{width:auto;display:inline-block;margin:0;padding:8px 14px;font-size:.95rem;cursor:pointer}
.linkbtn2{background:none;border:0;color:var(--sky);text-decoration:underline;font:inherit;padding:0}

/* bulle « Ogrelo écrit… » */
.g-typing{display:inline-flex;gap:5px;align-items:center;padding:14px 16px!important;min-height:0}
.g-typing span{width:8px;height:8px;border-radius:50%;background:var(--soft);opacity:.45;animation:g-wave 1.2s ease-in-out infinite}
.g-typing span:nth-child(2){animation-delay:.15s}.g-typing span:nth-child(3){animation-delay:.3s}
@keyframes g-wave{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-6px);opacity:1}}
@media (prefers-reduced-motion: reduce){.g-typing span{animation:none;opacity:.7}}
.g-kb{display:grid;place-items:center;font-size:1.6rem;color:var(--ink);width:52px;height:52px}.g-kb i{width:1.1em;height:1.1em}.chev i,.go i{vertical-align:-.2em}

/* chat ouvert : pas de conflit de scroll avec la page en dessous */
body.g-lock{position:fixed;left:0;right:0;overflow:hidden}
.g-panel,.g-body{overscroll-behavior:contain}
@media (max-width:700px){.g-panel{inset:0;height:100dvh;max-height:none;border-radius:0;border-top:0;padding-top:env(safe-area-inset-top)}}
body.g-open .demo-bar{display:none}
/* réponse en cours d'écriture (flux) : petit curseur qui clignote */
.g-msg.g-flux::after{content:"";display:inline-block;width:.5em;height:1em;margin-left:2px;vertical-align:-2px;border-radius:2px;background:var(--ogre);animation:gFlux 1s steps(2) infinite}
@keyframes gFlux{50%{opacity:0}}
@media (prefers-reduced-motion: reduce){.g-msg.g-flux::after{animation:none}}

/* chat en texte : champ de saisie bien visible en bas */
.g-panel.g-texte .g-type{display:flex;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--paper)}
.g-panel.g-texte .g-type input{flex:1;min-width:0;font:inherit;font-size:1rem;padding:12px 14px;border:2px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink)}
.g-panel.g-texte .g-type input:focus{outline:none;border-color:var(--ogre)}
.g-panel.g-texte .g-type button{border:0;border-radius:999px;background:var(--ogre);color:#fff;font-weight:800;padding:0 18px}
.g-fab .tip[hidden]{display:none}
/* la bulle s'efface sur les écrans qui ont leur propre bouton « J'ai une question », et quand elle passerait sur un bouton */
.g-fab.g-fab-off{display:none}
.g-fab{transition:opacity .2s,transform .2s}.g-fab.g-fab-loin{opacity:0;transform:translateY(16px);pointer-events:none}
@media (prefers-reduced-motion: reduce){.g-fab{transition:none}}
/* chat : bouton photo à gauche du champ, et bouton quand Ogrelo demande la leçon */
.g-cam{flex:none;width:46px;height:46px;border-radius:50%!important;border:2px solid var(--line)!important;background:var(--card)!important;color:var(--ogre-d)!important;display:grid;place-items:center;padding:0!important;font-size:1.2rem;cursor:pointer}
.g-cam:active{transform:scale(.94)}
.g-chip-photo{display:inline-flex;align-items:center;gap:8px;background:var(--ogre)!important;color:#fff!important;border-color:var(--ogre-d)!important;font-weight:800;margin:6px 0 4px}
/* grand écran : le chat est un bottom sheet centré, comme sur mobile (plus un panneau collé à droite), avec la page assombrie derrière */
@media (min-width:760px){
  .g-panel{left:50%!important;right:auto!important;bottom:0!important;top:auto!important;transform:translateX(-50%);width:min(640px,92vw)!important;height:min(86vh,800px)!important;
    border-radius:26px 26px 0 0!important;border:4px solid var(--ogre-d)!important;border-bottom:0!important;animation:gSheet .35s cubic-bezier(.2,1.1,.4,1)}
  body.g-open::before{content:"";position:fixed;inset:0;background:rgba(20,26,40,.38);z-index:44;animation:gVoile .3s ease}
}
@keyframes gSheet{from{transform:translate(-50%,40px);opacity:.4}}
@keyframes gVoile{from{opacity:0}}
@media (prefers-reduced-motion: reduce){.g-panel,body.g-open::before{animation:none}}
/* bouton d'envoi : icône seule sur mobile, icône + mot sur grand écran */
#gSend{display:inline-flex;align-items:center;justify-content:center;gap:6px}
#gSend i{width:1.25em;height:1.25em}
@media (max-width:640px){#gSend{width:46px;min-width:46px;padding:0!important}#gSend .g-send-l{display:none}}
/* réponses structurées dans le chat : carte sobre, même style que les bulles (plus de tableau blanc) */
.g-board.g-net{align-self:flex-start;max-width:88%;background:var(--card);background-image:none;border:2px solid var(--line);border-radius:18px;box-shadow:none;color:var(--ink);font-family:inherit;font-size:1rem;line-height:1.45;padding:12px 14px}
.g-board.g-net h4{font-family:var(--display);font-size:1rem;color:var(--ink);text-decoration:none;margin:0 0 8px}
.g-board.g-net .c-rouge{color:var(--ko,#C0392B)} .g-board.g-net .c-bleu{color:#2471AE} .g-board.g-net .c-vert{color:var(--ok,#3E9B4F)}
.g-board.g-net ol li::before{border:0;background:color-mix(in srgb,var(--ogre) 18%,var(--card));color:var(--ink);min-width:24px;height:24px;font-size:.85rem;font-weight:800}
.g-board.g-net .flow span.b{border:1.5px solid var(--line);background:var(--paper);font-size:.95rem}
.g-board.g-net .flow i{color:var(--soft);font-size:1rem}
.g-board.g-net .mot span{font-size:1.3rem}
.g-board.g-net .cmp>div{background:var(--paper);border:0;border-radius:12px;padding:8px 10px}
.g-board.g-net .cmp b{font-family:var(--display);color:var(--ink)}
.g-board.g-net .cmp b{display:block;margin-bottom:4px}
.g-board.g-net table{border-collapse:collapse;width:100%;font-size:.95rem}
.g-board.g-net th,.g-board.g-net td{border-bottom:1px solid var(--line);padding:6px 8px;text-align:left}
/* ---------- passe lisibilité du chat (375 px, clair et sombre) ---------- */
/* bulles : police de lecture (plus d'écriture manuscrite), mots longs coupés, jamais de débordement */
.g-body>*{min-width:0;flex-shrink:0}   /* jamais écrasé en hauteur, même sous un grand exercice (les bulles défilent en largeur) */
.g-body .g-msg{overflow-wrap:anywhere}
.g-body .g-msg.him{font-family:var(--body);font-size:1.05rem;line-height:1.5;letter-spacing:0}
.g-body .g-msg.info{font-size:.95rem}
.g-chips{gap:8px}
.g-chip{font-size:.84rem;line-height:1.3;padding:6px 12px;color:var(--ink);text-align:left}   /* suggestions : plus discrètes que les messages */
.g-chip-photo{background:var(--ogre-d)!important}   /* blanc sur --ogre = 2.9:1, sur --ogre-d = 4.9:1 */
.g-body>.g-chip{align-self:flex-start;max-width:100%}   /* puce seule (photo, écouter) : pas étirée comme un champ */
.g-panel.g-texte .g-type button{background:var(--ogre-d)}
/* carte structurée : toute la largeur (tableaux, comparaisons), plus d'air entre les blocs */
.g-board.g-net{align-self:stretch;max-width:100%;padding:14px 16px;overflow-wrap:anywhere;container-type:inline-size}
.g-board.g-net .el{margin:0 0 12px}.g-board.g-net .el:last-child{margin-bottom:0}
.g-board.g-net h4{font-size:1.1rem;line-height:1.3}
.g-board.g-net .c-rouge{color:var(--ko-t)} .g-board.g-net .c-bleu{color:var(--info-t)} .g-board.g-net .c-vert{color:var(--ok-t)}
.g-board.g-net ul{padding-left:1.25em}.g-board.g-net li{margin:4px 0}
.g-board.g-net ol li{gap:10px;margin:8px 0}.g-board.g-net ol li::before{flex:none}
.g-board.g-net .flow{gap:8px}
.g-board.g-net .flow span.b{color:var(--ink);padding:4px 10px;max-width:100%;line-height:1.35}
.g-board.g-net .mot{gap:6px}
.g-board.g-net .mot span:nth-child(1){color:var(--info-t)} .g-board.g-net .mot span:nth-child(2){color:var(--ko-t)} .g-board.g-net .mot span:nth-child(3){color:var(--ok-t)}
.g-board.g-net .mot span small{font-size:.75em;font-weight:700;padding-top:2px;color:var(--ink)}
.g-board.g-net .cmp ul{margin:0}
/* comparaison : deux colonnes seulement s'il y a la place, sinon l'une sous l'autre */
@container (max-width:420px){.g-board.g-net .cmp{grid-template-columns:1fr}}
/* tableau : défile en largeur si besoin, filets fins, en-tête lisible dans les deux thèmes */
.g-board.g-net .tblwrap{overflow-x:auto;padding-bottom:4px}
.g-board.g-net table{width:max-content;min-width:100%;overflow-wrap:normal}   /* pas de mots coupés en morceaux : on fait défiler */
.g-board.g-net th,.g-board.g-net td{border:0;border-bottom:1px solid var(--line);padding:8px 10px;vertical-align:top;min-width:6.5em;max-width:13em;line-height:1.35}
.g-board.g-net th{color:var(--ink);font-weight:800;background:var(--paper)}
.g-board.g-net tr:last-child td{border-bottom:0}
.g-board.g-net .dessin{font-size:1.8rem;letter-spacing:2px;line-height:1.3}
/* formules : une longue formule défile au lieu de dépasser de la bulle */
.g-body .katex-display{overflow-x:auto;overflow-y:hidden;max-width:100%}
.g-body .g-msg .katex,.g-board.g-net .katex{overflow-wrap:normal}
/* formule en ligne trop large (ex. \ce{…} d'un seul bloc) : la bulle défile au lieu de déborder de son cadre */
.g-body .g-msg,.g-board.g-net .el{overflow-x:auto;overflow-y:hidden}

/* iPhone : Safari zoome toute la page sur un champ écrit à moins de 16 px */
@supports (-webkit-touch-callout:none){input:not([type=checkbox]):not([type=radio]):not([type=range]),textarea,select{font-size:max(16px,1em)!important}}
input:focus,input:focus-visible,textarea:focus,textarea:focus-visible{outline:none!important}input:not([type=checkbox]):not([type=radio]):not([type=range]):focus{border-color:var(--ogre-d,#3E7F31)!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--ogre-d,#3E7F31) 22%,transparent)!important}

/* Nouvelle interface élève : en-tête illustré, semaine, filtres, cartes, barre de navigation */
:root{--wall:#BFE0F5;--wall2:#9CCDEE;--floor:#E8B678;--sheet:#FFFFFF;--navink:#16201B;
  --t-crit:#C2362C;--t-crit-bg:#FDE4E1;--t-info:#2F5E9E;--t-info-bg:#E3ECF8;--t-warn:#A86A00;--t-warn-bg:#FFF1D6;--t-good:#1F8A4C;--t-good-bg:#E1F4E8;--t-mute:#6B6880;--t-mute-bg:#EFEDF3}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--sheet:#22212F;--navink:#F5F1E6;--t-crit-bg:#45231F;--t-info-bg:#1B2A40;--t-warn-bg:#3A2C10;--t-good-bg:#1F3B2A;--t-mute-bg:#2E2D3D;--t-crit:#FF8A7E;--t-info:#8DB6F0;--t-warn:#F2B44A;--t-good:#5FD08E;--t-mute:#B9B4CC}}
:root[data-theme="dark"]{--sheet:#22212F;--navink:#F5F1E6;--t-crit-bg:#45231F;--t-info-bg:#1B2A40;--t-warn-bg:#3A2C10;--t-good-bg:#1F3B2A;--t-mute-bg:#2E2D3D;--t-crit:#FF8A7E;--t-info:#8DB6F0;--t-warn:#F2B44A;--t-good:#5FD08E;--t-mute:#B9B4CC}

body.h-on .g-fab{display:none}
body.h-on .wrap{padding-bottom:130px}
.h-hero{position:relative;margin:-12px -16px 0;height:min(56vw,260px);min-height:210px;overflow:hidden;border-radius:0 0 4px 4px}
.h-hero svg.scene{position:absolute;inset:0;width:100%;height:100%}
.h-stars{position:absolute;right:14px;top:14px;background:var(--sun);color:#3A2A00;font-family:var(--display);font-weight:800;border-radius:999px;padding:4px 12px;box-shadow:0 3px 0 rgba(0,0,0,.15)}
.h-sheet{position:relative;margin:-26px -16px 0;background:var(--sheet);border-radius:28px 28px 0 0;padding:20px 16px 8px;min-height:60vh;box-shadow:0 -6px 20px rgba(0,0,0,.06)}
@media (min-width:640px){.h-hero{border-radius:0 0 28px 28px}.h-sheet{border-radius:28px;margin-top:-26px}}

/* semaine */
.h-month{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.h-month b{font-family:var(--display);font-size:1.15rem;text-transform:capitalize}
.h-arrows{display:flex;gap:6px}
.h-arrows button{width:38px;height:38px;border-radius:50%;border:0;background:color-mix(in srgb,var(--sky) 16%,var(--sheet));color:var(--sky);font-size:1.35rem;font-weight:800;line-height:1;display:grid;place-items:center;box-shadow:0 2px 0 color-mix(in srgb,var(--sky) 25%,transparent)}
.h-arrows button:active{transform:translateY(1px);box-shadow:none}
.h-week{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:18px}
.h-day{border:0;background:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.78rem;color:var(--soft)}
.h-day .n{width:40px;height:40px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:1.05rem;color:var(--ink)}
.h-day.today .n{border-color:var(--ogre)}
.h-day[aria-pressed="true"] .n{background:var(--navink);color:var(--sheet);border-color:var(--navink)}
.h-day[aria-pressed="true"]{color:var(--ink);font-weight:800}
.h-dots{display:flex;gap:3px;height:6px}
.h-dots i{width:6px;height:6px;border-radius:50%;background:var(--sky)}
.h-dots i.c{background:var(--t-crit)}

/* filtres */
.h-q{font-family:var(--display);font-size:1.2rem;margin:0 0 10px}
.h-chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin:0 -16px 14px;padding-inline:16px;scrollbar-width:none}
.h-chip{flex:none;border:1.5px solid var(--line);background:var(--sheet);border-radius:999px;padding:8px 16px;font-weight:700;color:var(--ink)}
.h-chip[aria-pressed="true"]{background:var(--sky);border-color:var(--sky);color:#fff}
.h-chip .k{opacity:.7;font-weight:600;margin-left:4px}

/* cartes */
.h-list{display:grid;gap:12px}
.h-card{display:grid;grid-template-columns:58px 1fr auto;gap:12px;align-items:center;text-align:left;background:var(--sheet);border:1.5px solid var(--line);border-radius:20px;padding:12px;box-shadow:0 2px 0 rgba(0,0,0,.03)}
.h-ico{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-size:1.7rem}
.h-tag{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;font-weight:800;letter-spacing:.04em;border-radius:999px;padding:3px 10px}
.h-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.h-tag.crit{background:var(--t-crit-bg);color:var(--t-crit)}.h-tag.info{background:var(--t-info-bg);color:var(--t-info)}.h-tag.warn{background:var(--t-warn-bg);color:var(--t-warn)}.h-tag.good{background:var(--t-good-bg);color:var(--t-good)}.h-tag.mute{background:var(--t-mute-bg);color:var(--t-mute)}
.h-card h3{font-family:var(--body);font-size:1rem;font-weight:700;margin:6px 0 2px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.h-card h3 .m{color:var(--soft);font-weight:700}
.h-card .due{font-size:.82rem;color:var(--soft)}
.h-card .stt{font-size:.82rem;font-weight:700;margin-top:3px}
.h-card .go{color:var(--soft);font-size:1.3rem}
.h-card.done{opacity:.6}
.h-mini{width:40px;height:40px}
.h-empty{text-align:center;padding:18px 8px;color:var(--soft)}
.h-empty b{display:block;font-family:var(--display);font-size:1.15rem;color:var(--ink);margin-bottom:4px}
.h-sub{font-family:var(--display);font-size:1rem;margin:20px 0 10px;color:var(--soft)}
.h-dayhead{font-weight:800;margin:18px 2px 8px;color:var(--soft);font-size:.9rem;text-transform:capitalize}

/* barre de navigation */
.h-nav{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--sheet);border-top:1px solid var(--line);padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px))}
.h-nav-in{max-width:480px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);align-items:end}
.h-tab{border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:.75rem;font-weight:700;color:var(--soft);padding:4px 0;position:relative}
.h-tab svg{width:24px;height:24px}
.h-tab[aria-current="page"]{color:var(--sky)}
.h-tab[aria-current="page"]::before{content:"";position:absolute;top:-9px;width:28px;height:3px;border-radius:3px;background:var(--sky)}
.h-tab.mid .bub{width:62px;height:62px;border-radius:50%;background:var(--navink);display:grid;place-items:center;margin-top:-30px;box-shadow:0 6px 14px rgba(0,0,0,.25);border:4px solid var(--sheet)}
.h-tab.mid .bub .ogre{width:50px;height:50px}
body.g-open .h-nav{display:none}

/* page d'un devoir */
.d-head{border-radius:24px;padding:16px;color:#fff;margin-bottom:14px}
.d-head .tagrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.d-head .h-tag{background:rgba(255,255,255,.22);color:#fff}
.d-head h2{font-size:1.5rem;margin:8px 0 2px}
.d-head p{margin:0;opacity:.92}
.d-box{background:var(--card);border:2px solid var(--line);border-radius:18px;padding:14px;margin-bottom:12px}
.d-box h3{font-size:1rem;margin:0 0 6px;font-family:var(--display)}
.d-box p{margin:0;white-space:pre-line}
.d-acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.d-act{border:0;border-radius:18px;padding:14px 12px;text-align:left;color:#fff;font-weight:700;display:flex;flex-direction:column;gap:4px;box-shadow:0 4px 0 rgba(0,0,0,.15)}
.d-act .i{font-size:1.6rem}
.d-act b{font-family:var(--display);font-size:1.05rem}
.d-act small{opacity:.9;font-weight:600}
.d-act.wide{grid-column:1/-1;flex-direction:row;align-items:center;gap:12px}
.d-act:disabled{opacity:.5}

/* matières */
.m-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.m-card{border:1.5px solid var(--line);background:var(--sheet);border-radius:20px;padding:14px;text-align:left;display:flex;flex-direction:column;gap:6px}
.m-card .e{font-size:1.8rem}
.m-card b{font-family:var(--display);font-size:1.05rem}
.m-card small{color:var(--soft)}
.m-bar{height:6px;border-radius:9px;background:var(--line);overflow:hidden}.m-bar i{display:block;height:100%;background:var(--ogre)}

.d-act .tx{display:flex;flex-direction:column;gap:2px;min-width:0}
body.g-ctx .g-fab{display:none}
.m-card .tx{display:flex;flex-direction:column;gap:2px}

/* Ogrelo qui parle sur la page d'un devoir */
.g-say{display:flex;gap:10px;align-items:flex-end;margin:0 0 12px}
.g-say-face .ogre{width:64px;height:64px}
.g-say-b{position:relative;flex:1;min-width:0;background:var(--card);border:3px solid var(--ink);border-radius:20px;padding:10px 12px;box-shadow:var(--shadow)}
.g-say-b::before{content:"";position:absolute;left:-14px;bottom:16px;border:9px solid transparent;border-right-color:var(--ink)}
.g-say-b p{margin:0;font-size:1.02rem}
.g-say-play{margin-top:6px;border:0;background:color-mix(in srgb,var(--ogre) 18%,transparent);color:var(--ogre-d);border-radius:999px;padding:4px 12px;font-weight:800}
.need-list{display:grid;gap:12px}
.need{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center}
.need .ck{width:28px;height:28px;border-radius:50%;border:2.5px solid var(--line);display:grid;place-items:center;font-weight:800;color:#fff}
.need.ok .ck{background:var(--ok);border-color:var(--ok)}
.need .tx{display:flex;flex-direction:column;min-width:0}
.need .tx small{color:var(--soft)}
.need-btn{width:auto;margin:0;padding:8px 12px;font-size:.95rem;cursor:pointer;white-space:nowrap}
.h-prep{margin-top:18px}
.h-prep h3{font-family:var(--display);font-size:1rem;margin:0 0 8px;color:var(--soft)}
.need .tx b{font-family:var(--body);font-size:.98rem;line-height:1.3}
.h-hello{position:absolute;left:12px;bottom:30px;margin:0;max-width:62%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--display);font-size:1.05rem;line-height:1;color:#16304A;background:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:999px;padding:6px 12px;box-shadow:0 3px 10px rgba(22,48,74,.12)}

/* Ogrelo t'aide */
.a-box h3{margin-bottom:10px}
.a-grid{display:grid;gap:10px}
.a-btn{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:2px solid color-mix(in srgb,var(--c) 35%,transparent);background:color-mix(in srgb,var(--c) 9%,var(--card));border-radius:16px;padding:12px;cursor:pointer;color:var(--ink)}
.a-btn .i{width:44px;height:44px;border-radius:12px;background:var(--c);display:grid;place-items:center;font-size:1.4rem;flex:none}
.a-btn .tx{display:flex;flex-direction:column;min-width:0}
.a-btn b{font-family:var(--display);font-size:1.05rem}
.a-btn small{color:var(--soft)}
.a-chat{display:block;width:100%;margin-top:10px;border:0;background:none;color:var(--sky);font-weight:800;font-size:.95rem;text-align:left;padding:6px 0;cursor:pointer}

/* Interrogation orale */
.i-wrap{display:grid;gap:12px}
.i-say .g-say-b p{font-size:1.15rem;font-weight:700;line-height:1.4}
.i-go{font-size:1.2rem;padding:16px}
.i-mic{display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 0;text-align:center}
.i-mic .g-mic{width:88px;height:88px;font-size:2.2rem}
.i-mic p{margin:0;color:var(--soft)}.i-mic p b{display:block;color:var(--ink);font-family:var(--display)}
.i-said{font-style:italic;color:var(--ink2,var(--soft))}
.i-idk{display:block;margin:4px auto 0}
.i-verdict{border-radius:20px;padding:14px;border:3px solid}
.i-verdict b{font-family:var(--display);font-size:1.3rem;display:block}
.i-verdict p{margin:6px 0 0}
.i-verdict.good{background:var(--ok-bg);border-color:var(--ok)}.i-verdict.warn{background:var(--t-warn-bg);border-color:var(--t-warn)}.i-verdict.crit{background:var(--ko-bg);border-color:var(--ko)}
.i-model span{font-weight:800}
.i-rev{border-top:1px solid var(--line);padding:8px 0}.i-rev summary{cursor:pointer;font-weight:700}.i-rev p{margin:6px 0 0}

/* Ogrelo dit : humeur selon la situation */
.h-mood{display:flex;gap:12px;align-items:center;border-radius:20px;padding:12px;margin-bottom:16px;border:2px solid}
.h-mood .f .ogre{width:64px;height:64px}
.h-mood .t{flex:1;min-width:0}.h-mood p{margin:0;font-weight:700}
.h-mood .btn{margin:8px 0 0;padding:9px 14px;font-size:1rem;width:auto}
.m-cry,.m-angry{background:var(--t-crit-bg);border-color:var(--t-crit)}
.m-sad,.m-worried{background:var(--t-warn-bg);border-color:var(--t-warn)}
.m-sleepy{background:var(--t-info-bg);border-color:var(--t-info)}
.m-wow,.m-happy{background:var(--t-good-bg);border-color:var(--t-good)}
.m-cry .btn,.m-angry .btn{background:var(--t-crit)}
.ogre .tear{animation:tear 1.6s ease-in infinite}
@keyframes tear{0%{transform:translateY(0);opacity:1}100%{transform:translateY(6px);opacity:.2}}
@media (prefers-reduced-motion: reduce){.ogre .tear{animation:none}}

/* Notes */
.n-card{background:var(--sheet);border:1.5px solid var(--line);border-radius:20px;padding:12px}
.n-card.big{border-width:2px;border-color:color-mix(in srgb,var(--t-crit) 45%,var(--line))}
.n-top{display:grid;grid-template-columns:48px 1fr auto;gap:10px;align-items:center}
.n-top .h-ico{width:48px;height:48px;font-size:1.4rem}
.n-t{min-width:0;display:flex;flex-direction:column}.n-t b{font-family:var(--display);font-size:1.05rem}.n-t small{color:var(--soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.n-v{font-family:var(--display);font-weight:800;font-size:1.6rem;font-variant-numeric:tabular-nums}.n-v small{font-size:.9rem;color:var(--soft)}
.n-moy{font-size:.85rem;color:var(--soft);margin-top:6px}
.n-ask{margin:10px 0 0;font-weight:700}
.n-acts{display:grid;gap:8px;margin-top:10px}
.n-go{margin:10px 0 0;cursor:pointer;text-align:center;display:block}
.n-acts .n-go{margin:0}
.n-moys{display:grid;gap:8px}
.n-mrow{display:grid;grid-template-columns:minmax(80px,34%) 1fr 3em;gap:10px;align-items:center}
.n-mrow span:first-child{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.n-mrow b{font-family:var(--display);text-align:right;font-variant-numeric:tabular-nums}

/* Pronote pas connecté : une action, le reste verrouillé */
.h-conn{display:flex;gap:12px;align-items:flex-start;background:color-mix(in srgb,var(--sky) 10%,var(--sheet));border:2px solid var(--sky);border-radius:22px;padding:14px;margin-bottom:18px}
.h-conn .f .ogre{width:70px;height:70px}
.h-conn .t{flex:1;min-width:0}.h-conn b{font-family:var(--display);font-size:1.25rem;display:block}
.h-conn p{margin:4px 0 10px}.h-conn .btn{margin:0}
.h-locked{position:relative;opacity:.38;filter:grayscale(1);pointer-events:none;user-select:none}
.h-lock{position:absolute;z-index:2;left:50%;top:70px;transform:translateX(-50%);background:var(--ink);color:var(--paper);font-weight:800;font-size:.85rem;padding:6px 12px;border-radius:999px;white-space:nowrap;opacity:1}
.h-lockwrap{position:relative}

/* Mission du jour */
.mi{background:linear-gradient(160deg,color-mix(in srgb,var(--ogre) 16%,var(--sheet)),var(--sheet) 70%);border:2px solid var(--ogre);border-radius:24px;padding:14px;margin-bottom:18px;box-shadow:0 6px 18px rgba(62,127,49,.12)}
.mi.fin{border-color:var(--sun);background:linear-gradient(160deg,color-mix(in srgb,var(--sun) 22%,var(--sheet)),var(--sheet) 70%)}
.mi-h{display:flex;gap:12px;align-items:center}
.mi-h .f .ogre{width:62px;height:62px}
.mi-eye{font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ogre-d)}
.mi h2{font-size:1.25rem;margin:2px 0 2px}
.mi small{color:var(--soft);font-weight:700}
.mi-bar{height:8px;border-radius:99px;background:color-mix(in srgb,var(--ogre) 18%,transparent);overflow:hidden;margin:12px 0 10px}
.mi-bar i{display:block;height:100%;background:var(--ogre-d);border-radius:99px;transition:width .4s}
.mi-steps{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px}
.mi-steps button{width:100%;display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;text-align:left;border:0;background:var(--sheet);border-radius:14px;padding:9px 10px;color:var(--ink)}
.mi-steps .ck{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-family:var(--display);border:2px solid var(--line);color:var(--soft)}
.mi-steps .lb{font-weight:700;font-size:.95rem;min-width:0}
.mi-steps .mn{font-size:.8rem;color:var(--soft);font-weight:700;white-space:nowrap}
.mi-steps li.cur button{outline:2px solid var(--ogre);background:color-mix(in srgb,var(--ogre) 8%,var(--sheet))}
.mi-steps li.ok .ck{background:var(--ok);border-color:var(--ok);color:#fff}
.mi-steps li.ok .lb{text-decoration:line-through;color:var(--soft)}
.mi-go{margin:0;font-size:1.15rem;padding:15px}
/* Ogrelo mange la photo */
.miam{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:rgba(22,32,27,.45);animation:miamIn .2s ease}
.miam.out{opacity:0;transition:opacity .35s}
.miam-in{background:var(--card);border-radius:28px;padding:24px 28px;text-align:center;position:relative;box-shadow:0 20px 40px rgba(0,0,0,.25)}
.miam-in .ogre{width:130px;height:130px;display:block;margin:0 auto}
.miam-in .ogre .mouth{animation:chomp .22s ease-in-out .5s 5 alternate;transform-origin:50px 72px}
.miam-in .doc{position:absolute;left:50%;top:-10px;font-size:2.4rem;animation:feed .6s ease-in forwards}
.miam-in b{display:block;font-family:var(--display);font-size:1.5rem;margin-top:6px}
.miam-in small{color:var(--soft)}
@keyframes feed{0%{transform:translate(-50%,-30px) rotate(-10deg);opacity:1}80%{transform:translate(-50%,95px) scale(.6);opacity:1}100%{transform:translate(-50%,110px) scale(.2);opacity:0}}
@keyframes chomp{from{transform:scaleY(1)}to{transform:scaleY(.25)}}
@keyframes miamIn{from{opacity:0}to{opacity:1}}

/* Écran de chargement */
#gLoad{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:24px;background:radial-gradient(120% 80% at 50% 0%,#CFE8FB 0%,#EAF5FF 45%,var(--paper) 100%);transition:opacity .45s}
#gLoad.out{opacity:0}
.gl-in{width:min(360px,100%);text-align:center}
.gl-stage{position:relative;width:180px;height:180px;margin:0 auto 10px}
.gl-stage .ogre{width:150px;height:150px;position:absolute;left:15px;top:20px;animation:glBob 1.8s ease-in-out infinite}
.gl-glow{position:absolute;inset:20px;border-radius:50%;background:radial-gradient(circle,rgba(255,200,61,.55),transparent 70%);animation:glPulse 1.8s ease-in-out infinite}
.gl-book{position:absolute;right:6px;bottom:8px;font-size:2.4rem;animation:glBook 1.8s ease-in-out infinite;transform-origin:50% 100%}
.gl-star{position:absolute;color:#FFC83D;font-size:1.2rem;animation:glTw 1.6s ease-in-out infinite}
.gl-star.s1{left:8px;top:18px}.gl-star.s2{right:20px;top:4px;animation-delay:.5s}.gl-star.s3{left:30px;bottom:14px;animation-delay:1s}
#gLoad h2{font-family:var(--display);font-size:1.6rem;margin:4px 0 14px;color:#16304A}
.gl-steps{list-style:none;padding:0;margin:0 auto;display:grid;gap:10px;text-align:left;width:fit-content}
.gl-steps li{display:flex;align-items:center;gap:10px;font-weight:700;color:#7A8A98;transition:color .3s}
.gl-steps li i{width:22px;height:22px;border-radius:50%;border:2.5px solid #C9D6E2;display:grid;place-items:center;flex:none;font-style:normal;transition:all .3s}
.gl-steps li.cur{color:#16304A}.gl-steps li.cur i{border-color:#3C9DE0;border-top-color:transparent;animation:glSpin .8s linear infinite}
.gl-steps li.ok{color:#2F8A4A}.gl-steps li.ok i{background:#2FA35A;border-color:#2FA35A}
.gl-steps li.ok i::after{content:"";width:.8rem;height:.8rem;background:#fff;-webkit-mask:var(--gi-check) center/contain no-repeat;mask:var(--gi-check) center/contain no-repeat}
.gl-tip{margin:18px auto 0;color:#4A6378;font-size:.95rem;min-height:2.6em;transition:opacity .3s}.gl-tip.fade{opacity:0}
@keyframes glBob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(2deg)}}
@keyframes glPulse{0%,100%{transform:scale(.92);opacity:.7}50%{transform:scale(1.05);opacity:1}}
@keyframes glBook{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg) translateY(-4px)}}
@keyframes glTw{0%,100%{opacity:.2;transform:scale(.7)}50%{opacity:1;transform:scale(1.15)}}
@keyframes glSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){.gl-stage .ogre,.gl-glow,.gl-book,.gl-star,.gl-steps li.cur i{animation:none}}
/* Synchronisation en arrière-plan */
.h-sync{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;font-weight:800;color:var(--sky);background:color-mix(in srgb,var(--sky) 12%,var(--sheet));border-radius:999px;padding:5px 12px;margin:0 0 12px;animation:glPulse 2s ease-in-out infinite}
.h-toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:85;background:var(--ink);color:var(--paper);font-weight:800;padding:10px 16px;border-radius:999px;box-shadow:0 8px 20px rgba(0,0,0,.25);transition:opacity .4s;max-width:90vw;text-align:center}
.h-toast.out{opacity:0}
.mi-steps li.wait .ck{border-style:dashed}.mi-steps li.wait .lb{color:var(--soft)}
.mi-wait{margin:0;font-weight:700;color:var(--soft);text-align:center}

/* Petite fenêtre (popin) */
.h-pop{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:20px;background:rgba(22,32,58,.5);animation:miamIn .25s ease}
.h-pop.out{opacity:0;transition:opacity .3s}
.pop-in{width:min(360px,100%);background:var(--card);border-radius:28px;padding:22px 20px 18px;text-align:center;box-shadow:0 24px 50px rgba(0,0,0,.3);animation:pop .35s ease}
.pop-f .ogre{width:110px;height:110px}
.pop-in h3{font-family:var(--display);font-size:1.45rem;margin:4px 0 6px}
.pop-in p{margin:0 0 16px;color:var(--soft);font-size:1.02rem}
.pop-acts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pop-acts .btn{margin:0;font-size:1rem;padding:12px 10px}
.pop-acts:has(#nPromis){grid-template-columns:1fr}
.gh{display:inline-block;width:1.5em;height:1.5em;vertical-align:-.4em;flex:none}.gh .ogre{width:100%;height:100%;display:block}
.a-btn .i .gh{width:38px;height:38px;vertical-align:0}
.pop-acts .btn{white-space:nowrap;font-size:.95rem;display:flex;align-items:center;justify-content:center;gap:6px}

/* Réciter / converser */
.r-lines p{margin:4px 0}.r-roles{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin-bottom:6px}.r-roles .btn{margin:0}
.r-run{display:grid;gap:6px;margin-bottom:10px}.r-past{margin:0;color:var(--soft);font-size:.95rem}.r-past.me{color:var(--ink)}.r-past b{color:var(--sky)}
.r-sc{font-size:.8rem;font-weight:800;color:var(--ok)}
.r-me{background:var(--card);border:3px solid var(--sky);border-radius:22px;padding:14px}
.r-who{display:block;font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--sky)}
.r-hint{font-size:1.25rem;font-weight:700;line-height:1.5;margin:6px 0;letter-spacing:.02em}
.w-ok{color:var(--ok)}.w-ko{color:var(--ko);text-decoration:underline wavy}
.r-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.r-acts .btn{margin:0}.r-acts .btn:last-child:nth-child(odd){grid-column:1/-1}
.r-him{display:flex;gap:10px;align-items:flex-end;margin-bottom:12px}.r-him .ogre{width:56px;height:56px}.r-him .g-say-b{position:relative;flex:1;background:var(--card);border:3px solid var(--ink);border-radius:20px;padding:10px 12px}.r-him p{margin:2px 0 0;font-size:1.15rem;font-weight:700}
.c-list{display:grid;gap:10px;margin-bottom:12px}
.c-me{justify-self:end;max-width:85%;background:var(--sky);color:#fff;border-radius:18px 18px 4px 18px;padding:9px 13px;font-weight:700}
.c-him{display:flex;gap:8px;align-items:flex-end;max-width:94%}.c-him .ogre{width:44px;height:44px}.c-him .g-say-b{flex:1;min-width:0;background:var(--card);border:2px solid var(--line);border-radius:18px 18px 18px 4px;padding:9px 12px}.c-him p{margin:0;font-size:1.08rem;font-weight:700}
.c-him details{margin-top:4px;color:var(--soft);font-size:.9rem}.c-him summary{cursor:pointer;font-weight:700}
.c-corr{background:var(--t-warn-bg);border:2px solid var(--t-warn);border-radius:16px;padding:9px 12px;font-size:.95rem}
.c-aide{margin-top:6px;background:color-mix(in srgb,var(--ogre) 12%,var(--card));border-radius:12px;padding:6px 10px;font-size:.95rem}
.c-play{border:0;background:none;color:var(--sky);font-weight:800;padding:2px 4px;cursor:pointer}
.c-bar{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:10px;background:var(--card);border:2px solid var(--line);border-radius:24px;padding:10px;box-shadow:0 8px 20px rgba(0,0,0,.12)}
.c-bar p{flex:1;margin:0;color:var(--soft);font-size:.92rem}.c-bar p b{display:block;color:var(--ink);font-family:var(--display)}.c-bar .btn{margin:0;width:auto;padding:10px 14px}

/* Bulle d'Ogrelo : plus douce, avec son nom, une queue arrondie vers sa bouche, et un texte tapé */
.bubble,.g-say-b{position:relative;background:var(--card);border:0!important;border-radius:22px;padding:24px 15px 12px;box-shadow:none;
  filter:drop-shadow(0 0 1.5px color-mix(in srgb,var(--ogre-d) 75%,transparent)) drop-shadow(0 7px 14px rgba(20,50,30,.14));
  animation:bIn .4s cubic-bezier(.2,1.4,.4,1) both;transform-origin:0 100%}
.bubble::before,.g-say-b::before{content:"";position:absolute;left:-13px;bottom:16px;width:18px;height:20px;border:0!important;background:var(--card);clip-path:polygon(100% 0,0 75%,100% 100%)}
.bubble::after,.g-say-b::after{content:"Grignon";position:absolute;top:8px;left:15px;font:800 .66rem/1 var(--display);letter-spacing:.09em;text-transform:uppercase;color:var(--ogre-d)}
.c-him .g-say-b,.r-him .g-say-b{padding-top:10px}.c-him .g-say-b::after,.r-him .g-say-b::after{content:none}
.bubble p,.g-say-b p{line-height:1.45}
.hello{align-items:flex-end;gap:12px}.hello .ogre{width:104px;height:104px;flex:none}
.tw-caret{display:inline-block;width:2px;height:1.05em;background:var(--ogre-d);margin-left:2px;vertical-align:-.15em;animation:twBlink .75s steps(1) infinite}
@keyframes twBlink{50%{opacity:0}}
@keyframes bIn{from{opacity:0;transform:scale(.86) translateY(8px)}}
@media (prefers-reduced-motion: reduce){.bubble,.g-say-b{animation:none}.tw-caret{display:none}}

/* Ogrelo écrit à la main */
.bubble p,.bubble .big,.g-say-b p,.g-say-b h3,.pop-in h3,.pop-in p,.h-conn p,.h-mood p,.g-msg.him,.c-him p,.r-him p,.mi-wait{font-family:"Patrick Hand","Comic Sans MS",cursive;letter-spacing:.01em}
.bubble p,.g-say-b p,.g-msg.him,.c-him p,.r-him p{font-size:1.18rem;line-height:1.35}
.bubble .big{font-size:1.35rem}.i-say .g-say-b p{font-size:1.3rem}
.bubble::after,.g-say-b::after{content:none!important}.bubble,.g-say-b{padding-top:12px}

/* Lecteur d'exercices */
.exo{background:var(--card);border:2px solid var(--line);border-radius:20px;padding:12px}
.exo-top{display:flex;justify-content:space-between;font-size:.78rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ogre-d)}
.exo-bar{height:6px;border-radius:9px;background:var(--line);overflow:hidden;margin:6px 0 10px}.exo-bar i{display:block;height:100%;background:var(--ogre)}
.exo-q{font-weight:800;font-size:1.05rem;margin-bottom:10px}
.exo-ch{display:grid;gap:8px}.exo-ch.two{grid-template-columns:1fr 1fr}
.exo-ch button,.exo-bank button,.exo-pool button,.exo-ord button{border:2px solid var(--line);background:var(--card);border-radius:14px;padding:10px 12px;text-align:left;font-weight:700;color:var(--ink);cursor:pointer}
.exo-ch button.good,.exo-ord button.ok{border-color:var(--ok);background:var(--ok-bg)}.exo-ch button.bad,.exo-ord button.ko{border-color:var(--ko);background:var(--ko-bg)}.exo-ch button.dim{opacity:.5}
.exo-trous{font-size:1.1rem;line-height:2.2;margin:0 0 8px}
.tr-in{font:inherit;font-weight:700;border:0;border-bottom:2.5px dashed var(--sky);background:color-mix(in srgb,var(--sky) 8%,transparent);border-radius:6px 6px 0 0;padding:0 6px;color:var(--ink);text-align:center;max-width:100%}
.tr{font-weight:800;border-radius:6px;padding:0 5px}.tr.ok{background:var(--ok-bg);color:var(--ok)}.tr.ko{background:var(--ko-bg);color:var(--ko)}.tr.mid{background:var(--t-warn-bg);color:#8a5a00}.tr small{color:var(--ok);font-weight:800}
.exo-bank,.exo-pool{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}.exo-bank button:disabled{opacity:.35}
.exo-rel{display:grid;gap:8px;margin-bottom:10px}.rel-row{display:grid;grid-template-columns:minmax(80px,40%) 1fr;gap:8px;align-items:center}
.rel-g{font-weight:800}.rel-row select{font:inherit;padding:9px;border-radius:12px;border:2px solid var(--line);background:var(--card);color:var(--ink);min-width:0;width:100%}
.rel-d{border-radius:10px;padding:6px 8px;font-weight:700}.rel-d.ok{background:var(--ok-bg)}.rel-d.ko{background:var(--ko-bg)}.rel-d small{display:block;color:var(--ok)}
.exo-ord{list-style:none;padding:0;margin:0 0 8px;display:grid;gap:6px;counter-reset:o}.exo-ord li{counter-increment:o;display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:center}
.exo-ord li::before{content:counter(o);font-weight:800;color:var(--sky);text-align:center}.exo-ord li.vide{display:block;color:var(--soft);text-align:center}.exo-ord li.vide::before{content:none}.exo-ord small{display:block;color:var(--ko)}
.exo-in{width:100%;font:inherit;font-size:1.05rem;padding:11px;border:2px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);margin-bottom:8px}
.exo-rep{margin:4px 0}
.exo-fb{border-radius:16px;padding:12px 14px;margin:16px 0 14px;border:2px solid;display:flex;gap:12px;align-items:flex-start}.exo-fb b{font-family:var(--display);font-size:1.1rem}.exo-fb p{margin:4px 0 0}
.exo-fb.ok{background:var(--ok-bg);border-color:var(--ok)}.exo-fb.mid{background:var(--t-warn-bg);border-color:var(--t-warn)}.exo-fb.ko{background:var(--ko-bg);border-color:var(--ko)}
.exo .btn{margin:6px 0 0}
.exo-carte{border:2px dashed var(--sky);border-radius:18px;padding:22px 14px;text-align:center;margin-bottom:8px}.exo-carte .rc{font-family:var(--display);font-size:1.3rem}.exo-carte .vs{margin-top:10px;padding-top:10px;border-top:2px dashed var(--line);font-weight:700}
.exo-fin{text-align:center}.exo-fin b{font-family:var(--display);font-size:1.3rem;display:block}.exo-fin .pc{font-family:var(--display);font-weight:800;font-size:2.2rem;color:var(--ogre-d)}.exo-fin p{margin:0 0 8px;color:var(--soft)}
.exo-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.exo-acts .btn{margin:0}
.exo-full{position:fixed;inset:0;z-index:75;background:var(--paper);overflow:auto;padding:12px 16px calc(24px + env(safe-area-inset-bottom,0px))}
.exo-full-in{max-width:620px;margin:0 auto}.exo-full-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.exo-full-top b{font-family:var(--display);font-size:1.25rem}
.exo-full .exo{padding:18px}.exo-full .exo-q{font-size:1.2rem}
.g-exo{margin:4px 0}
.g-audio{display:flex;gap:10px;align-items:flex-start;background:var(--card);border:2px solid var(--sky);border-radius:16px;padding:10px}
.g-audio-play{width:44px;height:44px;border-radius:50%;border:0;background:var(--sky);color:#fff;font-size:1.1rem;flex:none;cursor:pointer}
.g-audio b{display:block}.g-audio details{color:var(--soft);font-size:.9rem}.g-audio summary{cursor:pointer}

.dz-txt{font-weight:700}.dz{background:var(--ko-bg);color:var(--ko);border-radius:5px;padding:0 3px;text-decoration:underline wavy}

/* mission repliée : une ligne sous le calendrier */
.mi-mini{position:relative;width:100%;display:grid;grid-template-columns:44px 1fr 18px;gap:10px;align-items:center;text-align:left;border:2px solid var(--ogre);background:color-mix(in srgb,var(--ogre) 10%,var(--sheet));border-radius:18px;padding:8px 12px 12px;margin:12px 0 16px;color:var(--ink);cursor:pointer;overflow:hidden}
.mi-mini .f .ogre{width:44px;height:44px}
.mi-mini .tx{display:flex;flex-direction:column;min-width:0}
.mi-mini b{font-family:var(--display);font-size:1.02rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mi-mini small{color:var(--soft);font-weight:700;font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mi-mini .chev{font-size:1.6rem;color:var(--ogre-d);font-weight:800}
.mi-mini .mi-bar{position:absolute;left:0;right:0;bottom:0;height:4px;margin:0;border-radius:0}
.mi-mini.m-angry,.mi-mini.m-cry,.mi-mini.m-sad{border-color:var(--ko);background:color-mix(in srgb,var(--ko) 7%,var(--sheet))}
.mi-mini.m-angry small,.mi-mini.m-cry small,.mi-mini.m-sad small{color:var(--ko)}
.mi{position:relative;margin-top:12px}
.mi-close{position:absolute;right:10px;top:10px;border:0;background:var(--sheet);border-radius:50%;width:32px;height:32px;font-weight:800;color:var(--ogre-d)}
/* formules (KaTeX) : même taille que le texte, jamais de débordement sur téléphone */
.katex{font-size:1.08em;line-height:1.2}
.katex-display{margin:.5em 0;overflow-x:auto;overflow-y:hidden;padding:2px 0}
.exo-ch button .katex,.tr .katex{font-size:1.2em}
.exo-ch button{min-height:52px}

.exo-face{flex:none;width:52px;height:52px;display:block}
.exo-face .ogre{width:52px;height:52px}
.exo-face.big{width:96px;height:96px;margin:0 auto 8px}.exo-face.big .ogre{width:96px;height:96px}
.exo-fbt{min-width:0;flex:1}.exo-fbt p{line-height:1.45}
/* notes sous la moyenne : fond rosé */
.n-card.bad{background:color-mix(in srgb,var(--t-crit) 7%,var(--sheet));border-color:color-mix(in srgb,var(--t-crit) 35%,var(--line))}
.n-card.bad.big{border-color:color-mix(in srgb,var(--t-crit) 55%,var(--line))}
/* onglet Moi : une seule couleur (le vert d'Ogrelo), le rouge seulement pour ce qui est faible */
.moi-load{display:flex;gap:12px;align-items:center;color:var(--soft);padding:24px 4px}.moi-load .gh{width:48px;height:48px}
.moi-card{background:var(--sheet);border:1px solid var(--line);border-radius:22px;padding:18px;margin:0 0 18px}
.moi-card h3{font-family:var(--display);font-size:1.12rem;margin:0 0 4px}
.moi-lead{margin:0 0 18px;color:var(--soft);line-height:1.5;font-size:.95rem}.moi-lead b{color:var(--ink)}
.moi-prof{display:flex;gap:16px;align-items:center}.moi-prof .gh{width:64px;height:64px}
.moi-prof .tx{min-width:0;flex:1}.moi-prof b{display:block;font-family:var(--display);font-size:1.4rem;line-height:1.1}
.moi-prof small{display:block;color:var(--soft);font-weight:700;margin-top:4px;line-height:1.35}
.moi-prof .pr{display:inline-flex;gap:6px;align-items:center;margin-top:10px;font-size:.82rem;font-weight:800;padding:5px 10px;border-radius:999px;background:var(--t-warn-bg);color:var(--t-warn)}
.moi-prof .pr.ok{background:var(--ok-bg);color:var(--ok)}
.moi-kpis{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 18px}
.moi-kpi{background:var(--sheet);border:1px solid var(--line);border-radius:20px;padding:16px;display:flex;flex-direction:column;gap:6px}
.moi-kpi .ki{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--ogre) 14%,transparent);color:var(--ogre-d);margin-bottom:4px}
.moi-kpi b{font-family:var(--display);font-size:1.5rem;line-height:1}.moi-kpi small{color:var(--soft);font-weight:700;font-size:.8rem;line-height:1.35}
.moi-tips{background:color-mix(in srgb,var(--ogre) 7%,var(--sheet));border-color:color-mix(in srgb,var(--ogre) 30%,var(--line))}
.moi-tips .th{display:flex;gap:12px;align-items:center;margin-bottom:12px}.moi-tips .th .gh{width:46px;height:46px}.moi-tips .th b{font-family:var(--display);font-size:1.1rem}
.moi-tips ul{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.moi-tips li{position:relative;padding-left:18px;line-height:1.5}.moi-tips li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--ogre)}
.moi-hours{display:flex;align-items:flex-end;gap:4px;height:110px;padding-bottom:22px}
.moi-hb{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.moi-hb i{display:block;background:color-mix(in srgb,var(--ogre) 45%,transparent);border-radius:5px 5px 2px 2px}.moi-hb.best i{background:var(--ogre-d)}
.moi-hb small{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);font-size:.7rem;color:var(--soft);white-space:nowrap;font-weight:700}
.moi-row{display:grid;grid-template-columns:118px 1fr 46px;gap:12px;align-items:center;padding:9px 0}
.moi-row.mat{grid-template-columns:108px 1fr 42px 50px}
.moi-row .nm{font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.moi-row b{text-align:right;font-family:var(--display);font-size:.98rem}.moi-row.best .nm,.moi-row.best b{color:var(--ogre-d)}
.mb{display:block;height:8px;border-radius:9px;background:color-mix(in srgb,var(--line) 70%,transparent);overflow:hidden}
.mb i{display:block;height:100%;border-radius:9px;background:var(--ogre)}.mb i.low{background:color-mix(in srgb,var(--t-crit) 75%,#fff)}
.moi-row .moy{font-weight:800;color:var(--soft);text-align:right;font-size:.85rem}.moi-row .moy.bad{color:var(--t-crit)}
.moi-sems{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.moi-sem{display:grid;grid-template-rows:20px 100px auto auto;justify-items:center;gap:6px;text-align:center}
.moi-sem .v{font-family:var(--display);font-weight:800;font-size:.92rem;color:var(--soft)}.moi-sem.now .v{color:var(--ink)}
.moi-sem .col{height:100px;width:100%;max-width:42px;display:flex;align-items:flex-end;background:color-mix(in srgb,var(--line) 45%,transparent);border-radius:10px;overflow:hidden}
.moi-sem .col i{display:block;width:100%;background:color-mix(in srgb,var(--ogre) 50%,transparent);border-radius:10px 10px 0 0}.moi-sem.now .col i{background:var(--ogre-d)}
.moi-sem small{font-size:.72rem;color:var(--soft);font-weight:700;line-height:1.25}.moi-sem small.m{color:var(--ink)}
.moi-sait{list-style:none;margin:10px 0 16px;padding:0;display:grid;gap:12px}
.moi-sait li{display:grid;grid-template-columns:22px 1fr;gap:8px;line-height:1.45}.moi-sait i{color:var(--ogre-d);margin-top:2px}
.moi-priv{margin:0;font-size:.84rem;color:var(--soft);line-height:1.5;padding-top:12px;border-top:1px dashed var(--line)}
.moi-out{margin:28px 0 8px;display:flex;flex-direction:column;gap:12px;align-items:stretch}
.moi-logout{background:var(--sheet)!important;color:var(--ko)!important;border:2px solid var(--ko)!important;box-shadow:none!important;font-size:1.05rem}
.d-astuce{display:grid;grid-template-columns:22px 1fr;gap:8px;margin:14px 0 0;padding:12px;border-radius:14px;background:color-mix(in srgb,var(--sun) 16%,var(--sheet));line-height:1.45;font-size:.92rem}.d-astuce i{color:#9a6a00;margin-top:2px}
/* ---------- jeux du lecteur d'exercices ---------- */
.exo-aide{color:var(--soft);font-weight:700;margin:6px 0 12px;line-height:1.45}.exo-aide.c{text-align:center}
.exo-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.exo-grid button,.exo-phrase button,.exo-lettres button,.exo-clavier button,.chip{border:2px solid var(--line);background:var(--sheet);border-radius:14px;font-weight:800;color:var(--ink);cursor:pointer;transition:transform .08s}
.exo-grid button{min-height:58px;padding:10px;font-size:1.05rem}
.exo-grid button:active,.exo-phrase button:active,.exo-lettres button:active,.exo-clavier button:active,.chip:active{transform:scale(.96)}
.exo-grid .good,.chip.ok,.exo-phrase .ok,.exo-clavier .ok{background:var(--ok-bg);border-color:var(--ok);color:var(--ok)}
.exo-grid .bad,.chip.ko,.exo-phrase .ko,.exo-clavier .ko{background:var(--ko-bg);border-color:var(--ko);color:var(--ko)}
.exo-grid .dim{opacity:.5}
.exo-phrase{line-height:2.6;margin:6px 0 14px}.exo-phrase button{padding:6px 10px;font-size:1.05rem}
.exo-phrase .sel{background:color-mix(in srgb,var(--sky) 18%,var(--sheet));border-color:var(--sky)}
.exo-phrase .rate{border-style:dashed;border-color:var(--t-warn);background:var(--t-warn-bg)}
.exo-legende{display:flex;gap:12px;font-size:.8rem;font-weight:800;margin:0 0 8px}.exo-legende span{padding:2px 8px;border-radius:8px}
.exo-legende .ok{background:var(--ok-bg);color:var(--ok)}.exo-legende .rate{background:var(--t-warn-bg);color:#8a5a00}.exo-legende .ko{background:var(--ko-bg);color:var(--ko)}
.exo-pool{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;min-height:44px}.exo-pool .vide{color:var(--soft);font-weight:700;padding:10px 0}
.chip{padding:8px 14px;font-size:1rem}.chip.sel{border-color:var(--sky);background:color-mix(in srgb,var(--sky) 18%,var(--sheet));transform:translateY(-2px)}
.exo-boites{display:grid;gap:12px;margin-bottom:14px}
.boite{border:2px dashed var(--line);border-radius:16px;padding:12px;min-height:70px;transition:border-color .15s,background .15s}
.boite.cible{border-color:var(--sky);background:color-mix(in srgb,var(--sky) 7%,transparent)}
.boite b{display:block;font-family:var(--display);margin-bottom:8px}.boite div{display:flex;flex-wrap:wrap;gap:8px}
.exo-mot{display:flex;flex-wrap:nowrap;gap:5px;justify-content:center;margin:10px 0 16px}
.exo-mot .case{flex:1 1 0;max-width:38px;min-width:0;height:46px;border-bottom:3px solid var(--ink);display:grid;place-items:center;font-family:var(--display);font-size:1.5rem;font-weight:800}
.exo-mot .case.ok{color:var(--ok);border-color:var(--ok)}.exo-mot .case.ko{color:var(--ko);border-color:var(--ko)}.exo-mot .esp{width:16px}
.exo-lettres{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:12px}
.exo-lettres button{width:50px;height:54px;font-family:var(--display);font-size:1.4rem}.exo-lettres button:disabled{opacity:.25}
.exo-clavier{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;margin-bottom:8px}
.exo-clavier button{height:44px;padding:0;font-size:1rem}.exo-clavier button:disabled{opacity:.8}
.exo-vies{text-align:center;color:var(--sun);font-size:1.2rem;margin:0 0 12px}.exo-vies .perdu{color:var(--line)}.exo-vies small{display:block;color:var(--soft);font-size:.82rem;font-weight:700;margin-top:4px}
.exo-droite{padding:34px 14px 8px;margin-bottom:12px}
.exo-droite .ligne{position:relative;height:4px;background:var(--ink);border-radius:2px;margin-bottom:22px}
.exo-droite .tick{position:absolute;top:-8px;width:2px;height:20px;background:var(--ink);transform:translateX(-1px)}.exo-droite .tick.fort{height:26px;top:-11px;width:3px}
.exo-droite .lab{position:absolute;top:20px;transform:translateX(-50%);font-family:var(--display);font-weight:800}
.exo-droite .curseur{position:absolute;top:-30px;width:24px;height:24px;transform:translateX(-50%);background:var(--sky);border-radius:50% 50% 50% 0;rotate:-45deg;box-shadow:0 2px 6px rgba(0,0,0,.25);transition:left .05s}
.exo-droite .curseur.ok{background:var(--ok)}.exo-droite .curseur.ko{background:var(--ko)}
.exo-droite .vrai{position:absolute;top:-14px;width:6px;height:32px;background:var(--ok);border-radius:3px;transform:translateX(-50%)}
.exo-droite input{width:100%;height:44px;margin-top:4px;accent-color:var(--sky)}
.exo-memory{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:8px}
.mcard{aspect-ratio:3/4;border:0;border-radius:14px;background:linear-gradient(150deg,var(--ogre),var(--ogre-d));color:#fff;font-size:1.6rem;display:grid;place-items:center;box-shadow:0 3px 0 rgba(0,0,0,.15);cursor:pointer;padding:6px}
.mcard.vis{background:var(--sheet);color:var(--ink);border:2px solid var(--line);font-size:.98rem;font-weight:800;line-height:1.25}
.mcard.ok{border-color:var(--ok);background:var(--ok-bg);color:var(--ok)}
.exo-dire{background:color-mix(in srgb,var(--sky) 8%,var(--sheet));border-radius:16px;padding:16px;margin-bottom:14px;text-align:center}
.exo-dire .phrase{font-family:var(--display);font-size:1.25rem;margin:0 0 12px;line-height:1.35}
.exo-micro{display:block;margin:4px auto 4px;width:76px;height:76px;border-radius:50%;border:0;background:var(--berry,#C42E63);color:#fff;font-size:2rem;box-shadow:0 5px 0 rgba(0,0,0,.18)}
.exo-micro.rec{animation:pulse 1s infinite;background:var(--ko)}.exo-micro.busy{opacity:.6}
@keyframes pulse{50%{transform:scale(1.07)}}
/* notification : en haut, sur une ligne si possible, jamais par-dessus les boutons */
.h-toast{bottom:auto!important;top:calc(14px + env(safe-area-inset-top,0px));width:max-content;max-width:calc(100vw - 32px);text-align:center;line-height:1.35;border-radius:16px!important;z-index:200!important}
/* ---------- respiration : plus d'air entre les blocs, cartes moins tassées (passe UX du 20/10) ---------- */
body{line-height:1.5}
.h-sheet{padding:24px 18px 16px}
.h-month{margin-bottom:14px}.h-week{gap:6px;margin-bottom:26px}
.h-q{font-size:1.25rem;margin:0 0 14px}
.h-chips{gap:10px;margin-bottom:20px}
.h-list{gap:16px}
.h-card{padding:16px;gap:14px;border-radius:22px}
.h-card h3{margin:8px 0 4px}
.h-sub{margin:30px 0 14px}
.h-prep{margin-top:28px}
.d-box{padding:18px;margin-bottom:18px;border-radius:20px}.d-box h3{margin:0 0 10px}
.d-acts{gap:12px;margin-bottom:18px}.d-act{padding:16px 14px;gap:6px}
.need-list{gap:16px}
.n-card{padding:16px;border-radius:22px}.n-moy{margin-top:6px}.n-ask{margin:12px 0 0;font-weight:600;font-size:.95rem;line-height:1.45}.n-acts{margin-top:12px}
.a-btn{padding:14px 16px;margin-bottom:12px}
.blk{padding:18px;margin-bottom:18px}.top{margin-bottom:20px}.fhero{padding:22px;margin-bottom:20px}.qcard{padding:22px;margin-bottom:20px}
.btn{margin-bottom:12px}
.exo{padding-bottom:18px}.exo-q{margin:4px 0 16px;line-height:1.4}.exo-ch{gap:12px}.exo-top{margin-bottom:8px}.exo-bar{margin-bottom:16px}
.g-msg{padding:10px 14px;line-height:1.45}
/* réponse choisie mais pas encore validée : l'élève peut encore changer d'avis */
.exo-ch button.sel,.exo-grid button.sel,.opt.sel{border-color:var(--sky)!important;background:color-mix(in srgb,var(--sky) 14%,var(--sheet))!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--sky) 25%,transparent)}
.exo-valide,#qVal{margin-top:16px}
.exo-valide:disabled,#qVal:disabled,.exo-ok2:disabled{opacity:.45;box-shadow:none}
.moi-row .nm{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.25;overflow-wrap:anywhere}
.moi-try{display:grid;grid-template-columns:22px 1fr;gap:8px;margin:16px 0 0;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--sun) 14%,var(--sheet));line-height:1.45;font-size:.92rem}.moi-try i{color:#9a6a00;margin-top:2px}
/* ---------- lecteur d'exercices : de l'air partout (passe UX) ---------- */
.exo-ch{gap:12px}
.exo-ch button,.exo-bank button,.exo-pool button,.exo-ord button{padding:14px 16px;min-height:52px;line-height:1.35;border-radius:16px}
.exo-ord{gap:12px;margin:0 0 20px}
.exo-ord li{gap:12px;grid-template-columns:28px 1fr}
.exo-ord li::before{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--sky) 14%,transparent)}
.exo-ord li.vide{padding:18px;border:2px dashed var(--line);border-radius:16px}
.exo-bank,.exo-pool{gap:10px;margin:12px 0 20px}
.exo-rel{gap:14px;margin-bottom:20px}
.rel-row{gap:12px!important}
.exo-trous{line-height:2.5;margin:0 0 18px}
.exo-in{padding:14px;margin-bottom:16px}
.exo-rep{margin:10px 0}
.exo-carte{padding:28px 18px;margin-bottom:20px}
.exo-grid{gap:12px;margin-bottom:4px}
.exo-boites{gap:16px;margin-bottom:20px}
.exo-phrase{margin:10px 0 20px}
.exo-lettres{gap:10px;margin-bottom:20px}
.exo-clavier{gap:6px;margin-bottom:16px}
.exo-memory{gap:12px;margin-bottom:16px}
/* chaque bouton d'action est séparé de ce qui précède */
.exo .btn,.exo-host .btn{margin-top:20px;margin-bottom:0}
.exo .btn+.btn,.exo-host .btn+.btn{margin-top:12px}
.exo-fb{margin:20px 0 0}
.exo-fb+.btn{margin-top:16px}
.exo-bon{margin:8px 0 4px;padding-left:22px;display:grid;gap:6px;line-height:1.4}.exo-fbt p:empty{display:none}
.n-mrow{gap:12px!important;padding:6px 0;align-items:center}.n-mrow span:first-child{white-space:normal!important;overflow:visible!important;line-height:1.25;font-weight:700}
.n-moys .m-bar{height:8px}
/* ---------- écran « accord d'un parent » ---------- */
.acc{max-width:520px;margin:0 auto;padding:28px 18px 40px}
.acc-h{display:flex;gap:16px;align-items:center;margin-bottom:22px}.acc-h .ogre{width:84px;height:84px;flex:none}
.acc-h h1{font-family:var(--display);font-size:1.5rem;margin:0 0 6px}.acc-h p{margin:0;line-height:1.5;color:var(--soft)}.acc-h p b{color:var(--ink)}
.acc-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:color-mix(in srgb,var(--line) 50%,transparent);padding:5px;border-radius:16px;margin-bottom:16px}
.acc-tabs button{border:0;background:transparent;border-radius:12px;padding:12px 8px;font-weight:800;color:var(--soft);font:inherit;font-weight:800;cursor:pointer}
.acc-tabs button[aria-selected="true"]{background:var(--sheet);color:var(--ink);box-shadow:0 2px 6px rgba(0,0,0,.08)}
.acc-card{background:var(--sheet);border:1.5px solid var(--line);border-radius:22px;padding:20px;margin-bottom:18px}
.acc-l{font-weight:700;line-height:1.5;margin:0 0 14px;display:block}.acc-s{color:var(--soft);font-size:.9rem;margin:12px 0 0;line-height:1.45}.acc-s:empty{display:none}
.acc-qr{background:#fff;border-radius:16px;padding:12px;width:min(260px,100%);margin:0 auto;aspect-ratio:1/1;display:grid;place-items:center;color:#333}.acc-qr svg{width:100%;height:auto;display:block}
.acc-wait{display:flex;gap:10px;align-items:center;justify-content:center;color:var(--soft);font-weight:700;margin:6px 0 22px}
.dotw{display:inline-flex;gap:4px}.dotw i{width:7px;height:7px;border-radius:50%;background:var(--ogre);animation:g-wave 1.2s ease-in-out infinite}.dotw i:nth-child(2){animation-delay:.15s}.dotw i:nth-child(3){animation-delay:.3s}
@keyframes g-wave{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-5px);opacity:1}}
.acc-plus{background:color-mix(in srgb,var(--ogre) 7%,var(--sheet));border-radius:18px;padding:14px 16px}
.acc-plus summary{font-weight:800;cursor:pointer}.acc-plus ul{margin:12px 0;padding-left:20px;display:grid;gap:8px;line-height:1.45}.acc-plus a{font-weight:700;color:var(--ogre-d)}

.acc-t{font-family:var(--display);font-size:1.15rem;margin:0 0 12px}
.acc-li{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:10px}.acc-li li{display:grid;grid-template-columns:22px 1fr;gap:10px;line-height:1.45}
.acc-li.oui i{color:var(--ogre-d);margin-top:3px}.acc-li.non i{color:var(--ko);margin-top:3px}
.acc-c{display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:start;padding:12px 0;font-weight:700;cursor:pointer;border-top:1px solid var(--line)}
.acc-c input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--ogre-d)}
.acc-card a{color:var(--ogre-d);font-weight:700}
.moi-sync{text-align:center;font-size:.8rem;color:var(--soft);margin:4px 0 0;min-height:1em}.moi-sync i{font-size:.9em;vertical-align:-1px}
.moi-legal{text-align:center;font-size:.85rem;color:var(--soft);margin:18px 0 0}.moi-legal a{color:var(--soft);font-weight:700}

.ecoles{display:grid;gap:8px;margin-top:14px;max-height:340px;overflow:auto}
.ecoles button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;border:1.5px solid var(--line);background:var(--sheet);border-radius:14px;padding:12px 14px;color:var(--ink);cursor:pointer}
.ecoles button small{color:var(--soft)}
#pTel label{display:block;margin:10px 0 6px}
.pin-in{font-family:var(--display);letter-spacing:4px;font-size:1.15em;background:var(--paper);border:2px dashed var(--line);border-radius:8px;padding:0 6px}
#tOuv{text-align:center;text-decoration:none}
/* lecteur du tuto en images (écran de connexion) */
.tuto{margin:14px 0 4px}
.tuto-vue{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;touch-action:pan-y;aspect-ratio:16/10;display:grid;place-items:center}
.tuto-vue img{display:block;width:100%;height:100%;object-fit:contain}
.tuto-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.tuto-nav button{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);background:var(--sheet);color:var(--ink);display:grid;place-items:center;font-size:1.1rem;cursor:pointer}
#pTutoN{display:flex;align-items:center;gap:6px}#pTutoN i{width:8px;height:8px;border-radius:50%;background:var(--line)}#pTutoN i.on{background:var(--ogre-d);width:20px;border-radius:6px}
#pTutoN b{margin-left:6px;font-size:.85rem;color:var(--soft)}
.tuto-svg{width:100%;height:100%}.tuto-svg svg{display:block;width:100%;height:100%}
#pEd label{display:block;margin:10px 0 6px}
.ecoles{display:grid;gap:8px;margin-top:4px}.ecoles button{display:block;text-align:left;border:1.5px solid var(--line);background:var(--sheet);border-radius:14px;padding:12px 14px;color:var(--ink);font-weight:700;cursor:pointer}
.acc-mail{border-top:1px solid var(--line);padding:12px 0 4px;margin-top:4px}.acc-mail summary{font-weight:700;cursor:pointer;line-height:1.4}.acc-mail summary small{color:var(--soft);font-weight:600}
.acc-mail .exo-in{margin:12px 0 10px}.acc-freq{display:flex;gap:16px;flex-wrap:wrap;font-weight:600}.acc-freq input{accent-color:var(--ogre-d);width:18px;height:18px;vertical-align:-3px;margin-right:6px}
.ed-t{display:flex;align-items:center;gap:10px;margin:0 0 10px}.ed-logo{width:34px;height:34px;object-fit:contain}
.ed-l{font-weight:600;color:var(--soft)}
.sko-ecole{margin:0 0 12px;line-height:1.5}#pSko .ecoles button span{display:block}#pSko a.btn{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;margin:4px 0 14px}
.moi-rap{display:flex;align-items:center;justify-content:space-between;gap:12px}.moi-rap .btn{width:auto;margin:0;flex:none}

/* boutons de validation : jamais collés au bord de la carte */
.exo-ok,.exo-ok2,.exo-valide,.exo-next{display:block;width:100%;margin-top:26px}
/* relier : pastilles à la place des menus déroulants */
.rel-row{align-items:start}
.rel-row .rel-g{padding-top:11px}
.rel-pick{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-width:0;min-height:46px;padding:10px 14px;border-radius:999px;border:2px dashed color-mix(in srgb,var(--ogre) 45%,var(--line));background:color-mix(in srgb,var(--ogre) 5%,var(--card));color:var(--soft);font:inherit;font-weight:700;text-align:left;cursor:pointer;transition:background .15s,border-color .15s,transform .1s}
.rel-pick span{min-width:0;overflow-wrap:anywhere}
.rel-pick i{flex:none;transition:transform .2s;opacity:.7}
.rel-pick:active{transform:scale(.98)}
.rel-pick.pris{border-style:solid;border-color:var(--ogre);background:color-mix(in srgb,var(--ogre) 13%,var(--card));color:var(--ink)}
.rel-pick.ouv{border-style:solid;border-color:var(--ogre-d,var(--ogre));box-shadow:0 0 0 4px color-mix(in srgb,var(--ogre) 18%,transparent)}
.rel-pick.ouv i{transform:rotate(180deg)}
.rel-opts{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;padding:12px;margin-top:2px;border-radius:18px;background:color-mix(in srgb,var(--ogre) 7%,var(--paper));animation:relIn .18s ease}
.rel-opts button{border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:9px 14px;font:inherit;font-weight:700;cursor:pointer;box-shadow:0 2px 0 var(--line)}
.rel-opts button:active{transform:translateY(1px);box-shadow:none}
.rel-opts button.sel{background:var(--ogre);border-color:var(--ogre);color:#fff;box-shadow:none}
.rel-opts button.deja{opacity:.5}
@keyframes relIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.rel-opts{animation:none}.rel-pick i{transition:none}}

/* glisser-déposer (classer) */
.exo-pool [data-ch],.boite [data-ch]{touch-action:none;cursor:grab}
.chip.tire{opacity:.3}
.chip.fantome{position:fixed;left:0;top:0;z-index:500;pointer-events:none;margin:0;box-shadow:0 10px 24px rgba(0,0,0,.22);opacity:.95}
.boite.survol,.exo-pool.survol{border-color:var(--ogre);border-style:solid;background:color-mix(in srgb,var(--ogre) 12%,transparent);transform:scale(1.02)}
.boite{transition:border-color .15s,background .15s,transform .15s}
.exo-pool{border-radius:16px;transition:background .15s}
/* relier : la réponse choisie tient sur une ligne (début + « … ») ; le texte complet reste lisible dans la liste */
.rel-pick span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal}
.exo-rel .rel-row{grid-template-columns:fit-content(38%) minmax(0,1fr)}

/* glisser-déposer (ordre) : trait d'insertion */
.exo-pool [data-k],.exo-ord [data-p]{touch-action:none;cursor:grab}
.exo-ord li{position:relative}
.exo-ord li.survol::after{content:"";position:absolute;left:36px;right:0;top:-8px;height:4px;border-radius:4px;background:var(--ogre)}
.exo-ord li.survol.apres::after{top:auto;bottom:-8px}
.exo-ord.survol{outline:2px dashed var(--ogre);outline-offset:6px;border-radius:12px}
button.fantome{position:fixed;left:0;top:0;z-index:500;pointer-events:none;margin:0;box-shadow:0 10px 24px rgba(0,0,0,.22);opacity:.95}
.exo-ord button.tire,.exo-pool button.tire{opacity:.3}
/* semaine : défile à l'horizontale si l'écran est trop étroit (le dimanche ne sort plus), sans faire bouger la page */
.h-week{display:flex;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;padding:2px 2px 4px;margin-left:-2px;margin-right:-2px}
.h-week::-webkit-scrollbar{display:none}
.h-week .h-day{flex:1 0 44px;scroll-snap-align:center}

/* lisibilité (clair et sombre) : texte blanc seulement sur des fonds assez foncés */
.h-chip[aria-pressed="true"]{background:#2471AE;border-color:#2471AE}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .exo-top{color:var(--ogre)}
  :root:not([data-theme="light"]) .moi-prof .pr.ok{color:#8FD9A8}}
:root[data-theme="dark"] .exo-top{color:var(--ogre)}
:root[data-theme="dark"] .moi-prof .pr.ok{color:#8FD9A8}
/* memory : cartes plus compactes, bien espacées, jamais collées au bord */
.exo-memory{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:12px;margin:6px 0 16px}
.mcard{aspect-ratio:auto;min-height:78px;font-size:1.3rem;padding:10px 8px}
.mcard.vis{font-size:.9rem;overflow-wrap:anywhere;hyphens:auto}
/* barre du bas : 5 onglets (Accueil · Notes · Ogrelo · Réviser · Moi) */
.h-nav-in{grid-template-columns:repeat(5,1fr)}
.h-tab{font-size:.72rem}
.mcard .mdos{display:grid;place-items:center;width:100%;height:100%}.mcard .mdos svg{width:46px;height:46px;filter:drop-shadow(0 2px 0 rgba(0,0,0,.15))}

/* exercice sur la feuille */
.fe-consigne{white-space:pre-line;font-size:1.08rem;font-weight:700;line-height:1.5;background:var(--paper);border:2px dashed var(--line);border-radius:16px;padding:14px;margin-bottom:14px}
.fe-flash{display:flex;align-items:center;gap:12px;border-radius:16px;padding:12px 14px;margin-bottom:14px;background:#FFE14D;color:#2A2300;border:3px solid #F2B705;animation:feFlash 1.4s ease-in-out infinite}
.fe-flash .i{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#2A2300;color:#FFE14D;font-size:1.3rem}
.fe-flash b{display:block;font-family:var(--display);font-size:1.1rem;text-transform:uppercase;letter-spacing:.02em}.fe-flash small{display:block;font-weight:700;margin-top:2px}
@keyframes feFlash{0%,100%{box-shadow:0 0 0 0 rgba(242,183,5,.7)}50%{box-shadow:0 0 0 8px rgba(242,183,5,0);transform:scale(1.015)}}
@media (prefers-reduced-motion: reduce){.fe-flash{animation:none}}
.fe-photo{display:flex!important;align-items:center;justify-content:center;gap:8px;width:100%;margin:6px 0 10px;cursor:pointer}
.fe-passer{display:block;margin:0 auto;color:var(--soft)}
.fe-err{background:var(--ko-bg);color:var(--ink);border-radius:14px;padding:10px 12px;margin:0 0 12px;line-height:1.4;font-weight:700}
.fe-wait{text-align:center;color:var(--soft);font-weight:700;margin:14px 0}
.fe-etapes{list-style:none;padding:0;margin:0 0 10px;display:grid;gap:6px}.fe-etapes li{display:flex;gap:8px;align-items:flex-start;line-height:1.4}
.fe-etapes li.ok i{color:var(--ok)}.fe-etapes li.ko i{color:var(--ko)}
.fe-indice{background:color-mix(in srgb,var(--sun,#FFC83D) 22%,var(--card));border-radius:12px;padding:10px 12px}
.fe-sol summary{cursor:pointer;font-weight:800;color:var(--soft)}

/* cartes de l'accueil : le texte prend toute la largeur, icône sur fond coloré de la matière */
.h-card{display:block;width:100%;padding:14px 16px 14px 18px;border-left:6px solid var(--c,var(--ogre));background:color-mix(in srgb,var(--c,var(--ogre)) 5%,var(--sheet))}
.h-top{display:flex;align-items:center;gap:10px;min-width:0}
.h-card .h-ico{flex:none;width:40px;height:40px;border-radius:12px;font-size:1.25rem;background:color-mix(in srgb,var(--c,var(--ogre)) 28%,var(--sheet));color:color-mix(in srgb,var(--c,var(--ogre)) 75%,#000)}
.h-mat{flex:1;min-width:0;font-size:.82rem;font-weight:800;color:var(--soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.h-card .go{flex:none;margin-left:auto}
.h-card h3{display:block;-webkit-line-clamp:unset;overflow:visible;margin:10px 0 4px;font-size:1.02rem;line-height:1.35}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-card .h-ico{color:color-mix(in srgb,var(--c,var(--ogre)) 55%,#fff)}}
/* cartes de l'accueil façon tuiles (comme Réviser) : bordure fine tout autour, fond teinté, ombre « bouton » en bas, pas de liseré sur le côté */
.h-card{border:2px solid color-mix(in srgb,var(--c,var(--ogre)) 40%,var(--line));border-left-width:2px;border-radius:22px;background:color-mix(in srgb,var(--c,var(--ogre)) 10%,var(--card));box-shadow:0 4px 0 color-mix(in srgb,var(--c,var(--ogre)) 28%,var(--line));padding:14px 16px;margin-bottom:4px;transition:transform .08s,box-shadow .08s}
.h-card:active{transform:translateY(3px);box-shadow:0 1px 0 color-mix(in srgb,var(--c,var(--ogre)) 28%,var(--line))}
.h-card.done{opacity:.6}

/* cartes de l'onglet Notes : même style de tuile que l'accueil (bordure fine, fond teinté, ombre bouton) ; notes à retravailler en rose */
.n-card{--cc:var(--c,var(--ogre));border:2px solid color-mix(in srgb,var(--cc) 38%,var(--line));border-radius:22px;background:color-mix(in srgb,var(--cc) 9%,var(--card));box-shadow:0 4px 0 color-mix(in srgb,var(--cc) 26%,var(--line));margin-bottom:6px}
.n-card.bad,.n-card.bad.big{--cc:var(--t-crit)}
.n-card .h-ico{border-radius:14px;background:color-mix(in srgb,var(--c,var(--ogre)) 28%,var(--card));color:color-mix(in srgb,var(--c,var(--ogre)) 75%,#000)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .n-card .h-ico{color:#fff}}
/* Notes : intitulé de l'évaluation en entier (jusqu'à 2 lignes) */
.n-t small{white-space:normal;overflow:visible;text-overflow:clip;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.35}
/* Notes : la note en haut à droite, l'intitulé sur toute la largeur dessous */
.n-top{grid-template-columns:44px 1fr auto}.n-top .h-ico{width:44px;height:44px;font-size:1.25rem}
.n-sous{margin-top:8px;font-weight:700;color:var(--ink);line-height:1.35}
/* exercices : jamais deux éléments collés (bouton écouter, zone de saisie, aide, boutons d'action) */
.exo .exo-play,.exo .exo-play2{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:6px 0 16px}
.exo .exo-in{margin-top:4px}
.exo .exo-aide{margin:0 0 14px}
.exo .exo-micro{margin-bottom:16px}
.exo .fe-photo{margin-bottom:16px!important}
.exo .exo-phrase{display:flex;flex-wrap:wrap;gap:8px 6px;line-height:1.3}

/* réglage de la vitesse de lecture */
.exo-vitesse{display:inline-flex;align-items:center;gap:6px;margin:-6px auto 14px;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:7px 14px;font:inherit;font-size:.88rem;font-weight:700;cursor:pointer}
.exo-dire .exo-vitesse,.exo .exo-vitesse{display:flex;width:max-content}
.cm-vit{display:block;margin-top:10px}.cm-vit .exo-vitesse{margin:0 auto}

/* vitesse : 3 choix côte à côte */
.exo-vitesse{display:flex!important;width:max-content;max-width:100%;margin:-6px auto 16px;padding:3px;gap:3px;border:2px solid var(--line);border-radius:999px;background:var(--card)}
.exo-vitesse button{border:0;background:none;color:var(--soft);font:inherit;font-size:.86rem;font-weight:800;padding:6px 14px;border-radius:999px;cursor:pointer}
.exo-vitesse button[aria-pressed="true"]{background:var(--ogre);color:#fff}

/* Moi : le bilan d'Ogrelo */
.moi-bilan{background:color-mix(in srgb,var(--ogre) 8%,var(--card));border:2px solid color-mix(in srgb,var(--ogre) 35%,var(--line));border-radius:24px;padding:16px;margin:0 0 20px;box-shadow:0 4px 0 color-mix(in srgb,var(--ogre) 22%,var(--line))}
.moi-bilan.vide{display:flex;gap:12px;align-items:center}.moi-bilan.vide p{margin:0;color:var(--soft);line-height:1.45}.moi-bilan .f svg{width:64px;height:64px}
.mb-head{display:flex;gap:12px;align-items:flex-start}.mb-head small{color:var(--soft);font-weight:700;font-size:.78rem}.mb-head h3{margin:2px 0 4px;font-family:var(--display);font-size:1.25rem;color:var(--ink)}.mb-head p{margin:0;line-height:1.45;color:var(--ink)}
.moi-bilan h4{margin:18px 2px 8px;font-family:var(--display);font-size:1rem;color:var(--soft)}
.mb-obj{margin-top:14px;background:var(--card);border:2px solid var(--line);border-radius:18px;padding:12px 14px}.mb-obj.ok{border-color:var(--ogre)}
.mb-obj-t{display:flex;justify-content:space-between;align-items:center}.mb-obj-t b{display:flex;gap:6px;align-items:center}.mb-obj-t span{font-weight:800;color:var(--ogre-d)}
.mb-obj p{margin:6px 0 8px;line-height:1.4}.mb-bar{height:10px;border-radius:10px;background:var(--line);overflow:hidden}.mb-bar i{display:block;height:100%;border-radius:10px;background:var(--ogre);transition:width .4s}
.mb-bravo{color:var(--ogre-d);font-weight:800;margin:8px 0 0!important}
.mb-trav{display:grid;gap:10px}
.mb-t{background:color-mix(in srgb,var(--c) 10%,var(--card));border:2px solid color-mix(in srgb,var(--c) 38%,var(--line));border-radius:18px;padding:12px 14px;box-shadow:0 3px 0 color-mix(in srgb,var(--c) 25%,var(--line))}
.mb-t-h{display:flex;gap:10px;align-items:center}.mb-t .h-ico{width:36px;height:36px;border-radius:12px;font-size:1.1rem;background:color-mix(in srgb,var(--c) 28%,var(--card));color:color-mix(in srgb,var(--c) 75%,#000)}
.mb-t .n{margin:8px 0 2px;font-weight:800;line-height:1.35}.mb-t .p{margin:0 0 10px;color:var(--soft);line-height:1.4;font-size:.92rem}.mb-t .btn{margin:0;width:100%;display:flex;align-items:center;justify-content:center;gap:8px}
.mb-forces{display:grid;gap:8px}.mb-f{display:flex;gap:10px;align-items:flex-start;background:var(--card);border-radius:14px;padding:10px 12px}.mb-f i{color:var(--sun,#E8A300);margin-top:2px}.mb-f b{display:block}.mb-f small{color:var(--soft)}
.mb-tend{display:grid;gap:6px}.mb-tn{display:grid;grid-template-columns:22px auto 1fr;gap:8px;align-items:center;background:var(--card);border-radius:12px;padding:8px 12px}.mb-tn small{color:var(--soft);text-align:right}
.mb-tn.monte i{color:var(--ogre-d)}.mb-tn.baisse i{color:var(--t-crit,#C8413B)}.mb-tn.stable i{color:var(--soft)}
.mb-hab{display:flex;gap:10px;align-items:flex-start;margin-top:14px;background:var(--card);border-radius:14px;padding:10px 12px}.mb-hab p{margin:0;line-height:1.4}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .mb-t .h-ico{color:#fff}:root:not([data-theme="light"]) .mb-obj-t span,:root:not([data-theme="light"]) .mb-bravo{color:var(--ogre)}}

/* Moi : blocs en tuiles, comme Accueil, Notes et Réviser */
.moi-card{background:color-mix(in srgb,var(--ogre) 6%,var(--card));border:2px solid color-mix(in srgb,var(--ogre) 28%,var(--line));border-radius:22px;box-shadow:0 4px 0 color-mix(in srgb,var(--ogre) 18%,var(--line))}
.moi-kpi{background:color-mix(in srgb,var(--sky,#3C9DE0) 8%,var(--card));border:2px solid color-mix(in srgb,var(--sky,#3C9DE0) 28%,var(--line));border-radius:20px;box-shadow:0 4px 0 color-mix(in srgb,var(--sky,#3C9DE0) 18%,var(--line))}
.moi-kpi .ki{background:color-mix(in srgb,var(--sky,#3C9DE0) 25%,var(--card));color:color-mix(in srgb,var(--sky,#3C9DE0) 75%,#000);border-radius:12px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .moi-kpi .ki{color:#fff}}

/* correction visuelle : barré en rouge, juste en vert */
.exo-corr{font-size:1.08rem;line-height:1.9;margin:4px 0 10px;font-weight:700}
.dm{display:inline}.dm.faux{border-radius:6px;padding:1px 3px;background:color-mix(in srgb,var(--ko) 8%,transparent)}
del.dm,del.dl{color:var(--ko);text-decoration:line-through 2px;text-decoration-color:var(--ko);background:var(--ko-bg);border-radius:4px;padding:0 2px}
ins.dm,ins.dl{color:var(--ok);text-decoration:none;background:var(--ok-bg);border-radius:4px;padding:0 2px;font-weight:800}
.exo-bonne{display:flex;gap:8px;align-items:center;margin:0 0 12px;font-weight:800;color:var(--ok)}
/* quiz solo façon jeu : points, série, chrono */
.q-jeu{display:flex;gap:10px;justify-content:space-between;align-items:center;margin:4px 2px 8px;font-weight:800}
.q-pts{color:#7B3FD1;display:flex;gap:6px;align-items:center}.q-serie{color:#E07020;display:flex;gap:6px;align-items:center;animation:dfPulse .6s ease}
.q-chrono{position:relative;height:22px;border-radius:999px;background:var(--line);overflow:hidden;margin:0 0 14px}.q-chrono i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#7B3FD1,#C2389E);border-radius:999px;transition:width .25s linear}
.q-chrono b{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-family:var(--display);font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.q-chrono.urgent i{background:linear-gradient(90deg,#E0384C,#FF7A00)}.q-chrono.urgent{animation:dfTremble .5s ease infinite}
.q-total{font-weight:800;color:#7B3FD1;margin:6px 0 0}
@media (prefers-reduced-motion: reduce){.q-chrono.urgent,.q-serie{animation:none}}
/* texte à trous : chaque trou est une petite case à bordure, bien séparée du texte et des autres (jamais collée) */
.exo-trous{line-height:2.9!important;margin:4px 0 18px!important;word-spacing:.04em}
.tr-in{display:inline-block;box-sizing:content-box;height:1.75em;line-height:1.75em;vertical-align:middle;margin:3px 7px;padding:0 10px;border:2px solid color-mix(in srgb,var(--sky) 55%,var(--line));border-radius:10px;background:color-mix(in srgb,var(--sky) 9%,var(--card));box-shadow:0 2px 0 color-mix(in srgb,var(--sky) 30%,var(--line));font-weight:800;color:var(--ink);text-align:center;max-width:calc(100% - 20px)}
.tr-in:focus{outline:none;border-color:var(--sky);background:var(--card);box-shadow:0 0 0 3px color-mix(in srgb,var(--sky) 25%,transparent)}
.tr-in:not(:placeholder-shown){border-color:var(--ogre);background:color-mix(in srgb,var(--ogre) 10%,var(--card))}
.tr{display:inline-block;line-height:1.75em;vertical-align:middle;margin:3px 7px;padding:0 10px;border:2px solid transparent;border-radius:10px}
.tr.ok{border-color:var(--ok)}.tr.ko{border-color:var(--ko)}.tr.mid{border-color:#E8A300}
.exo-bank{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 18px}
.exo-bank button{margin:0!important}
.tr-corr{display:inline-flex;align-items:center;gap:2px;vertical-align:middle}.tr-corr s.tr{text-decoration-thickness:2px;opacity:.85;margin-right:0}.tr-corr .tr.ok{margin-left:4px}
/* trou faux : case rosée à bordure rouge, mot faux barré en rouge, bonne réponse en vert juste en dessous */
.tr-corr{display:inline-flex!important;flex-direction:column;align-items:center;gap:2px;vertical-align:middle;margin:4px 7px;padding:3px 10px 4px;border:2px solid var(--ko);border-radius:10px;background:var(--ko-bg);line-height:1.25}
.tr-corr .faux{color:var(--ko);font-weight:800;text-decoration:line-through;text-decoration-thickness:2px}
.tr-corr .faux.vide{text-decoration:none;opacity:.6}
.tr-corr .bon{color:var(--ok);font-weight:800;font-size:.95em}
/* relier : étiquettes et menus alignés en deux colonnes */
.exo-rel .rel-row{display:grid!important;grid-template-columns:minmax(64px,38%) minmax(0,1fr);align-items:center;gap:10px}
.exo-rel .rel-g{font-weight:800;line-height:1.25;word-break:break-word}
.exo-rel .rel-row>.rel-opts{grid-column:1/-1}
.exo-rel .rel-pick{width:100%;min-width:0}
/* illustration de la classe (image) : remplit le bandeau, Ogrelo reste visible à droite */
.h-hero img.scene-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 38%;display:block}
/* le bonjour en haut à gauche, sur la zone calme (mur/plafond) de l'illustration : il ne cache plus les élèves */
.h-hello{top:12px;bottom:auto!important;box-shadow:0 4px 12px rgba(0,0,0,.12)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-hello{background:rgba(20,26,52,.78);color:#fff}}
:root[data-theme="dark"] .h-hello{background:rgba(20,26,52,.78);color:#fff}
.h-hello{top:5px;padding-top:6px!important;padding-bottom:6px!important}
/* bonjour collé tout en haut, comme un onglet : fond plein, très lisible */
.h-hello{top:0!important;left:12px;border-radius:0 0 14px 14px!important;background:#fff!important;color:#16304A!important;padding:9px 14px 8px!important;box-shadow:0 4px 10px rgba(0,0,0,.14)!important;-webkit-backdrop-filter:none;backdrop-filter:none}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-hello{background:#1B2242!important;color:#fff!important}}
:root[data-theme="dark"] .h-hello{background:#1B2242!important;color:#fff!important}
body.h-on{margin-top:0}   /* l'illustration de la classe colle au bandeau du haut */
body:not(:has(.demo-bar)) .h-hello{top:env(safe-area-inset-top,0px)!important}
/* Moi : le rapport de la semaine en tête (ce que les parents attendent) */
.moi-rap-top{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:0;border-radius:20px;padding:16px;margin:0 0 16px;cursor:pointer;color:#fff;font:inherit;
  background:linear-gradient(135deg,#1F78B8,#7B3FD1);box-shadow:0 5px 0 #1A4F8A}
.moi-rap-top:active{transform:translateY(3px);box-shadow:0 2px 0 #1A4F8A}
.moi-rap-top .i{flex:none;width:48px;height:48px;border-radius:14px;background:rgba(255,255,255,.2);display:grid;place-items:center;font-size:1.5rem}
.moi-rap-top .tx{flex:1;min-width:0}.moi-rap-top b{display:block;font-family:var(--display);font-size:1.1rem}.moi-rap-top small{display:block;opacity:.92;line-height:1.35;margin-top:2px}
.moi-rap-top .go{flex:none;font-weight:800;background:#fff;color:#1F78B8;border-radius:999px;padding:6px 12px;display:inline-flex;align-items:center;gap:4px}
/* Moi : carte « Mon rapport de la semaine » (sous le profil), dans le style des tuiles */
.moi-rap-top{display:none}
.moi-rap2{display:flex;align-items:center;gap:14px;width:100%;text-align:left;font:inherit;color:var(--ink);cursor:pointer;margin:0 0 16px;padding:14px 14px 14px 12px;
  background:linear-gradient(135deg,color-mix(in srgb,#1F78B8 9%,var(--card)),var(--card) 70%);border:2px solid color-mix(in srgb,#1F78B8 35%,var(--line));border-radius:20px;box-shadow:0 4px 0 color-mix(in srgb,#1F78B8 30%,var(--line));transition:transform .1s}
.moi-rap2:active{transform:translateY(3px);box-shadow:0 1px 0 color-mix(in srgb,#1F78B8 30%,var(--line))}
.moi-rap2 .doc{flex:none;width:46px;height:54px;filter:drop-shadow(0 3px 4px rgba(31,120,184,.18));transform:rotate(-4deg)}
.moi-rap2 .tx{flex:1;min-width:0}.moi-rap2 b{display:block;font-family:var(--display);font-size:1.05rem;line-height:1.2}.moi-rap2 small{display:block;color:var(--soft);font-weight:700;line-height:1.35;margin-top:3px}
.moi-rap2 .go{flex:none;display:inline-flex;align-items:center;gap:6px;background:#1F78B8;color:#fff;font-weight:800;font-size:.88rem;border-radius:999px;padding:8px 14px;box-shadow:0 3px 0 #155A8C;white-space:nowrap}
.moi-rap2 .go{width:42px;height:42px;padding:0;border-radius:50%;justify-content:center;font-size:1.1rem}
.moi-rap2 .go:not(:has(i)){width:auto;padding:0 12px;border-radius:999px;font-size:.8rem}   /* pendant la préparation du PDF */
.moi-rap2.charge .go i{opacity:0}
.moi-rap2.charge .go{position:relative}
.moi-rap2.charge .go::after{content:"";position:absolute;inset:11px;border-radius:50%;border:3px solid rgba(255,255,255,.35);border-top-color:#fff;animation:rapTourne .8s linear infinite}
@keyframes rapTourne{to{transform:rotate(360deg)}}
/* Moi : le suivi d'Ogrelo */
.moi-suivi .ms-l{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line);font-weight:600;line-height:1.4}
.moi-suivi .ms-l:first-of-type{border-top:0}
.moi-suivi .ms-l i{flex:none;margin-top:3px;color:var(--soft)}
.moi-suivi .ms-l.ok i{color:var(--ogre-d)}.moi-suivi .ms-l.ko i{color:#E8665A}.moi-suivi .ms-l.att i{color:#E8A300}
/* accueil : listes filtrées regroupées par jour */
.h-jour{font-family:var(--display);font-size:.95rem;color:var(--soft);margin:14px 2px 8px}
.h-jour::first-letter{text-transform:uppercase}
.h-list>.h-jour:first-child{margin-top:4px}
.h-plus{display:block;width:100%;margin:6px 0 4px;padding:12px;border:2px dashed var(--line);border-radius:16px;background:none;color:var(--ink);font:inherit;font-weight:800;cursor:pointer}

/* ---------- exercices : contraste du texte coloré (AA) et mots longs, dans le chat comme dans Réviser ---------- */
/* --ok/--ko sur leurs fonds pâles = 2.9:1 et 3.5:1 : le texte passe sur --ok-t/--ko-t (4.5:1 et plus, clair et sombre) */
.exo{overflow-wrap:anywhere}
.exo-q,.exo-fbt,.fe-consigne,.exo-carte,.exo-ch button{overflow-x:auto;overflow-y:hidden}   /* formule trop large : défile dans son cadre */
.exo-grid .good,.chip.ok,.exo-phrase .ok,.exo-clavier .ok,.exo-legende .ok,.tr.ok,.tr small,.tr-corr .bon,ins.dm,ins.dl,.exo-bonne,.rel-d small,.mcard.ok{color:var(--ok-t)}
.exo-grid .bad,.chip.ko,.exo-phrase .ko,.exo-clavier .ko,.exo-legende .ko,.tr.ko,.tr-corr .faux,del.dm,del.dl,.exo-ord small,.dz{color:var(--ko-t)}
del.dm,del.dl{text-decoration-color:var(--ko-t)}
.tr.mid,.exo-legende .rate{color:var(--warn-t)}
.exo-ord li::before{color:var(--info-t)}   /* numéros : --sky sur fond pâle = 2.8:1 */
.exo-acts .btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:12px 10px;font-size:1rem;line-height:1.25}   /* icône à côté du mot, pas au-dessus */
.exo-legende{font-size:.9rem;flex-wrap:wrap;gap:8px}
.g-audio details{font-size:1rem;line-height:1.45}.g-audio summary{font-weight:700}
.g-audio-play{background:var(--info-t);color:#fff}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .g-audio-play{background:#2471AE}}
:root[data-theme="dark"] .g-audio-play{background:#2471AE}
/* aide sur un devoir : grisée tant qu'Ogrelo n'a pas la consigne */
.a-btn.off{filter:grayscale(1);opacity:.55;border-style:dashed}
.a-btn.off .i{background:var(--soft)}
.d-box.flash{animation:d-flash 1.2s ease}
@keyframes d-flash{0%,100%{box-shadow:none}30%{box-shadow:0 0 0 4px color-mix(in srgb,var(--ogre) 45%,transparent)}}
.a-wait{display:flex;gap:12px;align-items:center;width:100%;text-align:left;font:inherit;color:var(--ink);cursor:pointer;margin:0 0 12px;padding:12px 14px;border:2px solid color-mix(in srgb,var(--ogre) 45%,var(--line));border-radius:16px;background:color-mix(in srgb,var(--ogre) 12%,var(--card))}
.a-wait .i{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--ogre);color:#fff;font-size:1.3rem}
.a-wait .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.a-wait b{font-family:var(--display);font-size:1rem}.a-wait small{color:var(--soft);line-height:1.35}
.a-wait .go{flex:none;color:var(--ogre-d,var(--ogre))}
.exo-dire-act{display:flex;gap:10px;margin-top:12px}.exo-dire-act .btn{flex:1;margin:0}
.exo-dire-act .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px}
/* Moi > Réglages : langue et thème */
.moi-regl h3{display:flex;align-items:center;gap:8px}
.rg-l{margin:12px 0 6px;font-weight:800;font-size:.9rem;color:var(--soft)}
.rg-seg{display:flex;flex-wrap:wrap;gap:8px}   /* pastilles qui passent à la ligne : rien ne déborde, même à 320 px */
.rg-seg button{flex:0 1 auto;max-width:100%;border:2px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);font:inherit;font-weight:700;font-size:.9rem;padding:8px 14px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.rg-seg button[aria-checked="true"]{border-color:var(--ogre);background:color-mix(in srgb,var(--ogre) 22%,var(--card));color:var(--ink);font-weight:800}
.rg-seg button:disabled{opacity:.55;cursor:default}.rg-seg small{font-size:.7rem;font-weight:700;color:var(--soft);background:var(--paper);border-radius:999px;padding:1px 6px}
/* image d'accueil : pleine largeur sur mobile (annule la marge du navigateur et celle de la colonne) */
@media (max-width:640px){.h-hero{width:100vw;margin-left:calc(50% - 50vw);margin-right:0;border-radius:0}}
/* verts du mode sombre : plus lumineux, pour rester lisibles sur fond sombre (texte, bordures, pastilles) ; les boutons gardent du texte blanc lisible */
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--ogre:#6DBF59;--ogre-d:#4C9A3B;--ok:#3DBE6C}}
:root[data-theme="dark"]{--ogre:#6DBF59;--ogre-d:#4C9A3B;--ok:#3DBE6C}
/* Mon année : tuile dans Réviser, puis le programme trimestre par trimestre */
.rv-annee{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font:inherit;color:var(--ink);cursor:pointer;margin:0 0 12px;padding:12px 14px;border-radius:18px;border:2px solid color-mix(in srgb,var(--sky) 45%,var(--line));background:color-mix(in srgb,var(--sky) 12%,var(--card));box-shadow:0 3px 0 color-mix(in srgb,var(--sky) 30%,var(--line))}
.rv-annee .i{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--sky);color:#fff;font-size:1.3rem}
.rv-annee .tx{flex:1;min-width:0;display:flex;flex-direction:column}.rv-annee b{font-family:var(--display);font-size:1.02rem}.rv-annee small{color:var(--soft);font-weight:700;font-size:.82rem}
.rv-annee .go{flex:none;color:var(--sky)}
.an-tete .moi-lead{margin:4px 0 12px}
.an-mats{margin:0 0 14px}
.an-tri{margin:0 0 10px;border:2px solid var(--line);border-radius:18px;background:var(--card);overflow:hidden}
.an-tri.cur{border-color:color-mix(in srgb,var(--ogre) 55%,var(--line))}
.an-th{display:flex;align-items:center;gap:10px;width:100%;padding:12px 14px;border:0;background:none;color:var(--ink);font:inherit;cursor:pointer;text-align:left}
.an-th span{flex:1;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.an-th b{font-family:var(--display);font-size:1.02rem}
.an-th em{font-style:normal;font-size:.72rem;font-weight:800;color:var(--ink);background:color-mix(in srgb,var(--ogre) 24%,var(--card));border-radius:999px;padding:2px 8px}
.an-th small{color:var(--soft);font-weight:700;font-size:.8rem;white-space:nowrap}
.an-liste{padding:0 10px 10px;display:flex;flex-direction:column;gap:8px}
.an-ch{display:flex;align-items:center;gap:10px;padding:10px;border-radius:14px;background:var(--paper)}
.an-ico{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--card);color:var(--soft)}
.an-ch.maitrise .an-ico{background:color-mix(in srgb,var(--sun) 30%,var(--card));color:#B07A00}
.an-ch.vu .an-ico{background:color-mix(in srgb,var(--ok) 20%,var(--card));color:var(--ok)}
.an-ch.en_cours .an-ico{background:color-mix(in srgb,var(--ogre) 22%,var(--card));color:var(--ogre-d)}
.an-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.an-tx b{font-size:.95rem;line-height:1.25}
.an-tx small{color:var(--soft);font-size:.78rem;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.an-et{font-size:.72rem;font-weight:800;color:var(--soft);text-transform:uppercase;letter-spacing:.02em}
.an-go{flex:none;border:0;border-radius:999px;background:var(--ogre-d);color:#fff;font:inherit;font-weight:800;font-size:.82rem;padding:8px 12px;cursor:pointer;display:inline-flex;align-items:center;gap:5px}
.an-go:disabled{opacity:.6}.an-prep{flex:none;font-size:.75rem;font-weight:700;color:var(--soft);display:inline-flex;align-items:center;gap:4px;max-width:96px}
@media (max-width:520px){.an-ch{flex-wrap:wrap;align-items:flex-start}.an-tx{flex-basis:calc(100% - 42px)}.an-go,.an-prep{margin-left:42px}}   /* mobile : le titre prend toute la largeur, le bouton passe dessous */
/* Réviser : deux onglets « Mes cours » / « Programme » */
.rv-onglets{display:flex;gap:4px;padding:4px;margin:0 0 14px;border-radius:16px;background:var(--paper);border:2px solid var(--line)}
.rv-onglets button{flex:1;min-width:0;border:0;border-radius:12px;background:none;color:var(--soft);font:inherit;font-family:var(--display);font-weight:800;font-size:.95rem;padding:10px 8px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rv-onglets button[aria-selected="true"]{background:var(--card);color:var(--ink);box-shadow:0 2px 0 var(--line)}

/* Compréhension orale (exercice « ecoute ») : carte d'écoute, questions sur le même écran, puis transcription */
.eo-carte{background:color-mix(in srgb,var(--sky) 9%,var(--card));border:2px solid color-mix(in srgb,var(--sky) 32%,var(--line));border-radius:22px;padding:16px;margin:0 0 24px;min-width:0}
.eo-tete{display:flex;gap:12px;align-items:center;margin:0 0 16px;min-width:0}
.eo-ico{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#1F78B8;color:#fff;font-size:22px}
.eo-tt{min-width:0}.eo-tt small{display:block;color:var(--soft);font-weight:800;font-size:.76rem;letter-spacing:.03em;text-transform:uppercase}
.eo-tt b{display:block;font-family:var(--display);font-size:1.15rem;line-height:1.25;color:var(--ink);overflow-wrap:anywhere}
.eo-lecteur{display:flex;align-items:center;gap:14px;min-width:0}
.eo-play{flex:none;width:64px;height:64px;border-radius:50%;border:0;padding:0;background:var(--ogre-d);color:#fff;display:grid;place-items:center;font-size:28px;cursor:pointer;box-shadow:0 4px 0 color-mix(in srgb,var(--ogre-d) 60%,#000);transition:transform .1s,box-shadow .1s}
.eo-play:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 color-mix(in srgb,var(--ogre-d) 60%,#000)}
.eo-play:disabled{background:var(--line);color:var(--soft);box-shadow:none;cursor:default}
.eo-play:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.eo-play.joue{box-shadow:0 0 0 6px color-mix(in srgb,var(--ogre) 25%,transparent),0 4px 0 color-mix(in srgb,var(--ogre-d) 60%,#000)}
.eo-spin{width:26px;height:26px;border-radius:50%;border:3px solid color-mix(in srgb,currentColor 30%,transparent);border-top-color:currentColor;animation:eo-tourne .8s linear infinite}
@keyframes eo-tourne{to{transform:rotate(360deg)}}
.eo-piste{flex:1;min-width:0}
.eo-barre{position:relative;height:10px;border-radius:10px;background:color-mix(in srgb,var(--soft) 22%,var(--card));overflow:hidden}
.eo-barre i{display:block;height:100%;width:0;border-radius:10px;background:var(--ogre);transition:width .25s linear}
.eo-barre.seek{cursor:pointer;height:12px}
.eo-temps{display:flex;justify-content:space-between;margin-top:8px;font-size:.8rem;font-weight:800;color:var(--soft);font-variant-numeric:tabular-nums}
.eo-bas{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}
.eo-carte .exo-vitesse{margin:0!important}
.eo-compte{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:.88rem;color:var(--ink);min-width:0}
.eo-pips{display:inline-flex;gap:5px}.eo-pips i{width:11px;height:11px;border-radius:50%;border:2px solid var(--ogre-d);box-sizing:border-box}.eo-pips i.pris{background:var(--ogre-d)}
.eo-etat{margin:14px 0 0;color:var(--soft);font-weight:700;font-size:.88rem;line-height:1.45}.eo-etat:empty{display:none}
.eo-qs{list-style:none;margin:0;padding:0;display:grid;gap:26px}
.eo-q{min-width:0}
.eo-qt{display:flex;gap:10px;align-items:flex-start;margin:0 0 12px;font-weight:700;line-height:1.4;color:var(--ink)}
.eo-qt>span:last-child{min-width:0;overflow-wrap:anywhere}
.eo-num{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:.85rem;font-weight:800;background:color-mix(in srgb,var(--ogre) 16%,var(--card));color:var(--ink)}
.eo-q.ok .eo-num{background:var(--ok);color:#fff}.eo-q.ko .eo-num{background:var(--ko);color:#fff}
.eo-q .exo-ch button{overflow-wrap:anywhere}
.eo-res{display:flex;gap:8px;align-items:flex-start;margin:12px 0 0;padding:10px 12px;border-radius:14px;line-height:1.45;font-size:.92rem;color:var(--ink);border:2px solid}
.eo-res>i{margin-top:.1em}.eo-res>span{min-width:0;overflow-wrap:anywhere}
.eo-q.ok .eo-res{background:var(--ok-bg);border-color:color-mix(in srgb,var(--ok) 45%,transparent)}.eo-q.ok .eo-res>i{color:var(--ok-t)}
.eo-q.ko .eo-res{background:var(--ko-bg);border-color:color-mix(in srgb,var(--ko) 45%,transparent)}.eo-q.ko .eo-res>i{color:var(--ko-t)}
.eo-valide{margin:28px 0 0!important}
.eo-reste{margin:12px 0 0!important}.eo-reste:empty{display:none}
.eo-trans{margin:26px 0 8px;padding:16px;border-radius:20px;background:var(--card);border:2px solid var(--line)}
.eo-trans h4{display:flex;align-items:center;gap:8px;margin:0 0 4px;font-family:var(--display);font-size:1.1rem;color:var(--ink)}
.eo-astuce{margin:0 0 14px;color:var(--soft);font-size:.86rem;font-weight:700;line-height:1.4}
.eo-lignes{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.eo-l{animation:eo-entre .4s ease-out both;animation-delay:var(--d,0ms)}
@keyframes eo-entre{from{opacity:0;transform:translateY(8px)}}
.eo-l button{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;font:inherit;color:var(--ink);background:var(--card);border:2px solid var(--line);border-radius:16px;padding:10px 12px;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.eo-qui{flex:none;min-width:28px;height:28px;padding:0 8px;box-sizing:border-box;border-radius:999px;display:grid;place-items:center;font-weight:800;font-size:.78rem;color:#fff;background:var(--c)}
.eo-tx{min-width:0;line-height:1.5;overflow-wrap:anywhere;padding-top:2px}
.v-A{--c:#3E7F31}.v-B{--c:#1F78B8}.v-C{--c:#6F3DB8}.v-N{--c:#6B6880}
.eo-l.dit button{border-color:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 22%,transparent)}
.eo-cle{background:color-mix(in srgb,var(--sun) 40%,transparent);color:inherit;border-radius:5px;padding:0 3px;font-weight:700;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.eo-gist{display:flex;gap:8px;align-items:flex-start;margin:16px 0 0;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--ogre) 9%,var(--card));line-height:1.45;color:var(--ink)}
.eo-gist>i{color:var(--ogre-d);margin-top:.15em}.eo-gist>span{min-width:0}
.eo-trans+.exo-fb,.exo-fb+.eo-trans{margin-top:22px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .eo-gist>i,:root:not([data-theme="light"]) .eo-pips i{color:var(--ogre);border-color:var(--ogre)}:root:not([data-theme="light"]) .eo-pips i.pris{background:var(--ogre)}:root:not([data-theme="light"]) .v-N{--c:#8C88A6}}
:root[data-theme="dark"] .eo-gist>i,:root[data-theme="dark"] .eo-pips i{color:var(--ogre);border-color:var(--ogre)}:root[data-theme="dark"] .eo-pips i.pris{background:var(--ogre)}:root[data-theme="dark"] .v-N{--c:#8C88A6}
@media (prefers-reduced-motion:reduce){.eo-l{animation:none}.eo-spin{animation-duration:2s}}
@media (max-width:360px){.eo-carte{padding:14px}.eo-lecteur{gap:12px}.eo-play{width:56px;height:56px;font-size:24px}.eo-trans{padding:14px 12px}}

/* Compréhension écrite (exercice « lecture ») : carte de lecture confortable, questions d'affilée, preuves surlignées */
.lu-carte{background:var(--card);border:2px solid var(--line);border-radius:22px;padding:18px 18px 14px;margin:0 0 14px;min-width:0}
.lu-ico{background:var(--ogre-d)}
.lu-texte{max-width:68ch;font-size:1.04rem;line-height:1.65;color:var(--ink);overflow-wrap:break-word;hyphens:auto}
.lu-texte p{margin:0 0 1em}.lu-texte p:last-child{margin-bottom:0}
.lu-carte.ferme .lu-texte{max-height:9.9em;overflow:hidden;-webkit-mask-image:linear-gradient(#000 45%,transparent);mask-image:linear-gradient(#000 45%,transparent)}
.lu-src{margin:12px 0 0;color:var(--soft);font-size:.86rem;font-style:italic}
.lu-plier{display:inline-flex;align-items:center;gap:6px;margin:12px 0 0;padding:8px 2px;border:0;background:none;color:var(--ogre-d);font:inherit;font-weight:800;font-size:.92rem;cursor:pointer}
.lu-colle{position:sticky;top:6px;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 22px;padding:6px 6px 6px 6px;border-radius:999px;background:color-mix(in srgb,var(--card) 92%,transparent);border:2px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 4px 12px rgba(0,0,0,.08)}
.lu-colle span{color:var(--soft);font-weight:800;font-size:.84rem;padding-right:10px;white-space:nowrap}
.lu-relire{display:inline-flex;align-items:center;gap:6px;min-width:0;border:0;border-radius:999px;background:var(--ogre-d);color:#fff;font:inherit;font-weight:800;font-size:.9rem;padding:8px 14px;cursor:pointer}
.lu-multi{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:-4px 0 10px;font-weight:800;font-size:.86rem;color:var(--ink)}
.lu-multi>i{color:var(--ogre-d)}.lu-multi small{flex-basis:100%;color:var(--soft);font-weight:700;font-size:.8rem}
.exo-ch.multi button{position:relative;padding-left:46px}
.exo-ch.multi button::before{content:"";position:absolute;left:14px;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:6px;border:2px solid var(--line);background:var(--card);box-sizing:border-box}
.exo-ch.multi button.sel::before,.exo-ch.multi button.good::before{background:var(--ogre-d);border-color:var(--ogre-d);box-shadow:inset 0 0 0 3px var(--card)}
.exo-ch.multi button.bad::before{background:var(--ko);border-color:var(--ko);box-shadow:inset 0 0 0 3px var(--card)}
.exo-ch button.rate{border-color:var(--ok);border-style:dashed;background:var(--card)}
.eo-q.mid .eo-num{background:var(--t-warn,#A86A00);color:#fff}
.eo-q.mid .eo-res{background:var(--t-warn-bg,#FFF1D6);border-color:color-mix(in srgb,var(--t-warn,#A86A00) 45%,transparent)}.eo-q.mid .eo-res>i{color:var(--warn-t)}
.lu-in{display:block;width:100%;box-sizing:border-box;margin:0}
.lu-ta{margin:0;color:var(--ink);overflow-wrap:anywhere}
.lu-voir{display:inline-flex;align-items:center;gap:6px;margin:10px 0 0;padding:6px 2px;border:0;background:none;color:var(--ogre-d);font:inherit;font-weight:800;font-size:.88rem;cursor:pointer}
.lu-preuve{background:color-mix(in srgb,var(--sun) 40%,transparent);color:inherit;border-radius:5px;padding:0 2px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.lu-preuve sup{font-size:.68em;font-weight:800;margin-left:2px;color:var(--soft)}
.lu-preuve.flash{animation:lu-flash 1.6s ease-out 2}
@keyframes lu-flash{0%,60%{box-shadow:0 0 0 3px color-mix(in srgb,var(--sun) 80%,transparent)}100%{box-shadow:0 0 0 0 transparent}}
.lu-feuille{position:fixed;inset:0;z-index:90;background:rgba(10,12,20,.45);display:flex;align-items:flex-end;justify-content:center}
.lu-feuille-in{width:100%;max-width:720px;max-height:88vh;overflow:auto;background:var(--card);border-radius:24px 24px 0 0;padding:0 20px calc(24px + env(safe-area-inset-bottom,0px));box-sizing:border-box;box-shadow:0 -10px 30px rgba(0,0,0,.25);animation:lu-monte .25s ease-out}
@keyframes lu-monte{from{transform:translateY(40px);opacity:0}}
.lu-feuille-top{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0 12px;background:var(--card);font-family:var(--display);font-size:1.1rem;color:var(--ink);z-index:1}
.lu-feuille-top b{min-width:0;overflow-wrap:anywhere}
.lu-feuille .lu-texte{margin:0 auto}
:root[data-theme="dark"] .lu-plier,:root[data-theme="dark"] .lu-voir,:root[data-theme="dark"] .lu-multi>i{color:var(--ogre)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .lu-plier,:root:not([data-theme="light"]) .lu-voir,:root:not([data-theme="light"]) .lu-multi>i{color:var(--ogre)}}
@media (prefers-reduced-motion:reduce){.lu-preuve.flash,.lu-feuille-in{animation:none}}
@media (max-width:360px){.lu-carte{padding:16px 14px 12px}.lu-texte{font-size:1rem}.lu-colle span{display:none}}

/* Expression orale / écrite (« oral_prod », « ecrit_prod ») : sujet d'examen, enregistrement ou écriture, correction /20 */
.pr-sujet{background:color-mix(in srgb,var(--ogre) 8%,var(--card));border:2px solid color-mix(in srgb,var(--ogre) 28%,var(--line));border-radius:22px;padding:16px;margin:0 0 22px;min-width:0}
.pr-sujet.compact{margin-bottom:18px}.pr-sujet .eo-tt b{font-size:1.1rem}
.pr-ico{background:var(--ogre-d)}
.pr-meta{margin:0}.pr-chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 12px;background:var(--card);border:2px solid var(--line);font-weight:800;font-size:.86rem;color:var(--ink)}
.pr-aide{margin:14px 0 0;padding:12px 14px;border-radius:16px;background:var(--card)}
.pr-aide h5,.pr-bloc h5,.pr-modele h5,.pr-texte h5{display:flex;align-items:center;gap:6px;margin:0 0 8px;font-family:var(--display);font-size:1rem;color:var(--ink)}
.pr-aide ul,.pr-bloc ul{margin:0;padding-left:20px;line-height:1.5;color:var(--ink)}.pr-aide li+li,.pr-bloc li+li{margin-top:4px}
.pr-grille{margin:12px 0 0;font-size:.86rem;line-height:1.45;color:var(--soft)}.pr-grille b{color:var(--ink)}
.pr-actions{display:grid;gap:12px;margin-top:6px}.pr-actions .btn{margin:0;display:flex;align-items:center;justify-content:center;gap:8px}
.pr-msg{display:flex;gap:8px;align-items:flex-start;margin:0 0 16px;padding:10px 12px;border-radius:14px;background:var(--t-warn-bg);color:var(--ink);font-weight:700;line-height:1.4}.pr-msg i{color:var(--warn-t);margin-top:.1em}
.pr-chrono{display:flex;flex-direction:column;align-items:center;gap:12px;margin:4px 0 18px;text-align:center}.pr-chrono p{margin:0;font-weight:800;color:var(--ink)}
.pr-rond{--p:0;--c:var(--ogre-d);width:132px;height:132px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--c) calc(var(--p)*360deg),color-mix(in srgb,var(--soft) 20%,var(--card)) 0)}
.pr-rond::before{content:"";grid-area:1/1;width:108px;height:108px;border-radius:50%;background:var(--card)}
.pr-temps{grid-area:1/1;position:relative;font-family:var(--display);font-weight:800;font-size:2rem;color:var(--ink);font-variant-numeric:tabular-nums}
.pr-chrono.rec .pr-rond{--c:var(--ko)}
.pr-point{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--ko);margin-right:4px;animation:pr-bat 1s ease-in-out infinite}
@keyframes pr-bat{50%{opacity:.25}}
.pr-stop{display:flex!important;align-items:center;justify-content:center;gap:8px;background:var(--ko)!important}
.pr-fait{display:flex;align-items:center;gap:14px;margin:0 0 16px;padding:12px 14px;border-radius:18px;background:var(--card);border:2px solid var(--line);font-weight:800;color:var(--ink)}
.pr-reecoute{flex:none;width:48px;height:48px;border-radius:50%;border:0;background:var(--ogre-d);color:#fff;display:grid;place-items:center;font-size:20px;cursor:pointer}
.pr-wait{justify-content:center;margin:8px 0 16px}
.pr-ta{display:block;width:100%;box-sizing:border-box;min-height:14em;resize:vertical;font:inherit;font-size:1.04rem;line-height:1.6;padding:14px 16px;border-radius:18px;margin:0}
.pr-compteur{margin:10px 0 18px}.pr-compteur p{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:8px 0 0;font-size:.88rem;color:var(--soft);font-weight:700}
.pr-compteur .pr-nb{color:var(--ink)}.pr-compteur.ok .pr-nb{color:var(--ok-t)}.pr-compteur.trop .pr-nb{color:var(--warn-t)}
.pr-jauge{height:8px;border-radius:8px;background:color-mix(in srgb,var(--soft) 20%,var(--card));overflow:hidden}.pr-jauge i{display:block;height:100%;width:0;background:var(--soft);border-radius:8px;transition:width .2s}
.pr-compteur.ok .pr-jauge i{background:var(--ok)}.pr-compteur.trop .pr-jauge i{background:var(--t-warn)}
.pr-sauve{display:inline-flex;align-items:center;gap:4px;margin-top:6px;font-size:.78rem;color:var(--soft);opacity:.55;transition:opacity .3s}.pr-sauve.vu{opacity:1}
.pr-envoi-e{display:flex!important;align-items:center;justify-content:center;gap:8px}
.pr-min:empty{display:none}
.pr-res{display:grid;gap:18px;min-width:0}
.pr-note{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:16px;border-radius:20px;background:var(--card);border:2px solid var(--line)}
.pr-chiffre{font-family:var(--display);font-weight:800;font-size:2.6rem;line-height:1;color:var(--ogre-d)}.pr-chiffre small{font-size:1.1rem;color:var(--soft);margin-left:2px}
.pr-cecrl{border-radius:999px;padding:5px 12px;background:color-mix(in srgb,var(--sky) 16%,var(--card));color:var(--ink);font-weight:800;font-size:.86rem}
.pr-bravo{flex-basis:100%;margin:0;line-height:1.45;color:var(--ink)}
.pr-crit{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pr-crit li{padding:12px 14px;border-radius:16px;background:var(--card);border:2px solid var(--line)}
.pr-ct{display:flex;justify-content:space-between;align-items:center;gap:10px}.pr-ct b{min-width:0;color:var(--ink);overflow-wrap:anywhere}
.pr-pts{flex:none;display:inline-flex;align-items:center;gap:8px}.pr-pts>span{display:inline-flex;gap:3px}.pr-pts i{width:12px;height:12px;border-radius:4px;background:color-mix(in srgb,var(--soft) 22%,var(--card))}.pr-pts i.on{background:var(--ogre-d)}.pr-pts small{font-weight:800;color:var(--soft)}
.pr-crit p{margin:6px 0 0;line-height:1.45;color:var(--ink);font-size:.93rem}
.pr-deux{display:grid;gap:12px}
.pr-bloc{padding:12px 14px;border-radius:16px}.pr-bloc.ok{background:var(--ok-bg)}.pr-bloc.ok h5 i{color:var(--ok-t)}.pr-bloc.idee{background:color-mix(in srgb,var(--sun) 16%,var(--card))}.pr-bloc.idee h5 i{color:var(--warn-t)}
.pr-modele{display:grid;gap:10px}.pr-paire{border-radius:16px;border:2px solid var(--line);overflow:hidden;background:var(--card)}
.pr-paire p{margin:0;padding:10px 14px;line-height:1.45;color:var(--ink);overflow-wrap:anywhere}.pr-paire small{display:block;font-weight:800;font-size:.75rem;text-transform:uppercase;letter-spacing:.03em;color:var(--soft);margin-bottom:2px}
.pr-paire .mieux{background:var(--ok-bg)}
.pr-entendu{border-radius:16px;border:2px solid var(--line);background:var(--card);padding:10px 14px}.pr-entendu summary{cursor:pointer;font-weight:800;color:var(--ink)}.pr-entendu p{margin:10px 0 0;line-height:1.55;color:var(--ink);overflow-wrap:anywhere}
.pr-texte{padding:14px 16px;border-radius:18px;background:var(--card);border:2px solid var(--line)}.pr-texte p{margin:0;line-height:1.7;color:var(--ink);overflow-wrap:anywhere}
.pr-err{background:var(--ko-bg);color:inherit;border-bottom:2px solid var(--ko);border-radius:4px 4px 0 0;padding:0 2px;-webkit-box-decoration-break:clone;box-decoration-break:clone}.pr-err sup{font-size:.68em;font-weight:800;color:var(--ko-t);margin-left:2px}
.pr-errs{margin:0;padding-left:26px;display:grid;gap:10px}.pr-errs li{line-height:1.45;color:var(--ink)}.pr-errs li::marker{font-weight:800;color:var(--ko-t)}
.pr-errs p{margin:0;overflow-wrap:anywhere}.pr-errs s{color:var(--ko-t)}.pr-errs b{color:var(--ok-t)}.pr-errs i{color:var(--soft);font-size:.9em}.pr-errs small{display:block;margin-top:2px;color:var(--soft);font-size:.88rem}
.pr-aucune{display:flex;gap:8px;align-items:center;margin:0;font-weight:800;color:var(--ok-t)}
.pr-deux{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.pr-actions{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}   /* deux colonnes seulement si la place le permet (chat étroit compris) */
@media (prefers-reduced-motion:reduce){.pr-point{animation:none}}
@media (max-width:360px){.pr-sujet{padding:14px}.pr-rond{width:116px;height:116px}.pr-rond::before{width:94px;height:94px}.pr-chiffre{font-size:2.2rem}}
:root[data-theme="dark"] .pr-chiffre,:root[data-theme="dark"] .pr-pts i.on{color:var(--ogre)}:root[data-theme="dark"] .pr-pts i.on{background:var(--ogre)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .pr-chiffre{color:var(--ogre)}:root:not([data-theme="light"]) .pr-pts i.on{background:var(--ogre)}}
/* « S'entraîner » (Mon année, annee.js) : banque d'exercices du chapitre en 3 niveaux, jouée sans IA */
.an-acts{flex:none;display:flex;flex-direction:column;gap:8px;align-items:stretch}
.an-go.alt{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--ogre) 50%,var(--line))}
.an-exp{font-size:.74rem;font-weight:800;color:var(--ink);margin-top:2px}
@media (max-width:520px){.an-acts{flex-direction:row;flex-wrap:wrap;margin-left:42px}.an-acts .an-go,.an-acts .an-prep{margin-left:0}}
.ex-retour{border:0;background:none;color:var(--ink);font:inherit;font-weight:800;display:inline-flex;align-items:center;gap:6px;padding:8px 4px 8px 0;margin:0 0 6px;cursor:pointer}
.ex-tete small{display:block;color:var(--soft);font-weight:800;font-size:.74rem;text-transform:uppercase;letter-spacing:.04em}
.ex-tete .rv-h3{margin:2px 0 8px;line-height:1.25}
.ex-lead{margin:0 0 18px}
.ex-nivs{display:flex;flex-direction:column;gap:14px;margin:0 0 18px}
.ex-niv{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:16px;border:2px solid var(--line);border-radius:18px;background:var(--card);color:var(--ink);font:inherit;cursor:pointer}
.ex-niv:active{transform:scale(.99)}
.ex-niv.conseil{border-color:color-mix(in srgb,var(--ogre) 65%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--ogre) 16%,transparent)}
.ex-pastille{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:1.2rem;background:color-mix(in srgb,var(--ogre) 20%,var(--card));color:var(--ink)}
.ex-niv.fait .ex-pastille{background:color-mix(in srgb,var(--ok) 22%,var(--card))}
.ex-niv-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.ex-niv-tx em{align-self:flex-start;font-style:normal;font-size:.7rem;font-weight:800;color:var(--ink);background:color-mix(in srgb,var(--ogre) 26%,var(--card));border-radius:999px;padding:2px 9px;margin-bottom:3px}
.ex-niv-tx b{font-family:var(--display);font-size:1.06rem;line-height:1.25}
.ex-niv-tx small{color:var(--soft);font-size:.84rem;line-height:1.35}
.ex-barre{display:block;height:8px;border-radius:999px;background:var(--paper);overflow:hidden;margin-top:9px}
.ex-barre i{display:block;height:100%;border-radius:inherit;background:var(--ogre);transition:width .4s}
.ex-compte{font-size:.8rem;font-weight:800;color:var(--soft);margin-top:2px}
.ex-fl{flex:none;color:var(--soft)}
.ex-jeu-tete{display:flex;align-items:center;gap:10px;margin:2px 0 14px}.ex-jeu-tete .ex-pastille{width:36px;height:36px;border-radius:12px;font-size:1rem}.ex-jeu-tete b{font-family:var(--display);font-size:1.06rem}
.ex-jeu{background:var(--card);border:2px solid var(--line);border-radius:18px;padding:16px 14px}
.ex-suite{margin:16px 0 8px}
.ex-bilan{border-radius:18px;padding:16px;background:var(--paper);display:flex;flex-direction:column;gap:14px;line-height:1.4}
.ex-bilan.bon{background:color-mix(in srgb,var(--ok) 14%,var(--card))}
.ex-bilan-acts{display:flex;flex-direction:column;gap:10px}.ex-bilan-acts .btn{width:100%;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:normal}
.ex-calme{display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px 12px;line-height:1.45}.ex-calme b{margin:0}.ex-calme .btn{margin:6px 0 0;width:auto}
.ex-calme-ico{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:1.4rem;background:color-mix(in srgb,var(--ogre) 16%,var(--card));color:var(--ink);margin-bottom:4px}
.exo-grid.une{grid-template-columns:1fr}
.ex-jeu .exo-acts{grid-template-columns:1fr;gap:10px}.ex-jeu .exo-acts .btn,.ex-jeu .exo-cartes{white-space:normal;overflow-wrap:normal;word-break:normal}
.ex-bilan-acts .btn{flex-direction:row}
@media (max-width:360px){.ex-jeu{padding:14px 10px}.ex-niv{padding:14px 12px;gap:12px}}
/* mobile : les deux boutons du chapitre (Fiche, Exos) se partagent toute la largeur, texte plus grand */
@media (max-width:520px){.an-acts{flex-basis:100%;margin-left:0;flex-wrap:nowrap;gap:10px}
  .an-acts .an-go,.an-acts .an-prep{flex:1 1 0;min-width:0;justify-content:center;font-size:.98rem;padding:11px 12px;gap:7px;max-width:none}
  .an-acts .an-go i{width:18px;height:18px}}
/* Moi : bandeau fin pour installer l'appli (PWA) */
.pw-bandeau{display:flex;align-items:stretch;margin:0 0 12px;border-radius:14px;overflow:hidden;background:linear-gradient(100deg,var(--ogre-d,#3E7F31),var(--ogre,#5BA84A) 55%,#3B8FC9);color:#fff;box-shadow:0 4px 12px rgba(62,127,49,.25)}
.pw-b-go{flex:1;min-width:0;display:flex;align-items:center;gap:10px;border:0;background:none;color:inherit;font:inherit;text-align:left;padding:8px 6px 8px 10px;cursor:pointer}
.pw-b-ic{flex:none;width:28px;height:28px;border-radius:9px;background:rgba(255,255,255,.22);display:grid;place-items:center}.pw-b-ic i{width:16px;height:16px}
.pw-b-t{flex:1;min-width:0;font-size:.85rem;line-height:1.3;opacity:.95}.pw-b-t b{font-weight:800;opacity:1}
.pw-b-fl{flex:none;width:16px;height:16px;opacity:.9}
.pw-b-x{flex:none;width:38px;border:0;border-left:1px solid rgba(255,255,255,.25);background:none;color:#fff;display:grid;place-items:center;cursor:pointer}.pw-b-x i{width:16px;height:16px}
.pw-b-go:focus-visible,.pw-b-x:focus-visible{outline:2px solid #fff;outline-offset:-3px}
.pw-b-t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (max-width:480px){.pw-b-plus{display:none}}.pw-b-go{padding:6px 6px 6px 8px}.pw-b-ic{width:26px;height:26px}

/* lecture du QR code Pronote : la photo est balayée, puis validée (coche) ou refusée ; pendant la connexion, le cadre respire */
.qr-anim{display:flex;justify-content:center;margin:14px 0 6px}
.qr-cadre{position:relative;width:150px;height:150px;border-radius:18px;overflow:hidden;background:var(--sheet,#fff);box-shadow:0 2px 10px color-mix(in srgb,#000 12%,transparent)}
.qr-cadre img{width:100%;height:100%;object-fit:cover;display:block;transition:filter .4s,opacity .4s}
.qr-c{position:absolute;width:26px;height:26px;border:4px solid var(--ogre);transition:all .35s ease}
.qr-c.c1{top:10px;left:10px;border-right:0;border-bottom:0;border-top-left-radius:10px}.qr-c.c2{top:10px;right:10px;border-left:0;border-bottom:0;border-top-right-radius:10px}
.qr-c.c3{bottom:10px;left:10px;border-right:0;border-top:0;border-bottom-left-radius:10px}.qr-c.c4{bottom:10px;right:10px;border-left:0;border-top:0;border-bottom-right-radius:10px}
.qr-laser{position:absolute;left:12px;right:12px;top:14px;height:3px;border-radius:3px;background:var(--ogre);box-shadow:0 0 12px 3px color-mix(in srgb,var(--ogre) 70%,transparent);opacity:0}
.qr-ok{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transform:scale(.6);transition:all .35s cubic-bezier(.2,1.4,.4,1)}
.qr-ok i{width:58px;height:58px;padding:12px;border-radius:50%;background:var(--ogre);color:#fff;box-sizing:border-box}
.qr-anim.lit .qr-laser{opacity:1;animation:qrBalai 1.1s ease-in-out infinite alternate}
.qr-anim.lit .qr-c{animation:qrViser 1.1s ease-in-out infinite alternate}
.qr-anim.lu img,.qr-anim.connecte img{filter:saturate(.4) brightness(1.08);opacity:.55}
.qr-anim.lu .qr-ok,.qr-anim.connecte .qr-ok{opacity:1;transform:scale(1)}
.qr-anim.connecte .qr-ok i{animation:qrRespire 1.2s ease-in-out infinite}
.qr-anim.connecte .qr-c{border-color:var(--ogre);animation:qrViser 1.2s ease-in-out infinite alternate}
.qr-anim.rate .qr-c{border-color:#D9534F}.qr-anim.rate img{opacity:.7}
.qr-anim.rate .qr-cadre{animation:qrNon .45s ease}
@keyframes qrBalai{from{top:14px}to{top:calc(100% - 17px)}}
@keyframes qrViser{from{margin:0}to{margin:6px}}
@keyframes qrRespire{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
@keyframes qrNon{0%,100%{transform:translateX(0)}25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}
@media (prefers-reduced-motion:reduce){.qr-anim *{animation:none!important;transition:none!important}.qr-anim.lit .qr-laser{top:50%}}

/* scanner du QR Pronote avec la caméra : plein écran, viseur au centre, trait qui balaie, vert quand c'est lu */
.qr-scan{position:fixed;inset:0;z-index:1000;background:#000;display:flex;align-items:center;justify-content:center}
.qr-scan video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.qr-scan-viseur{position:relative;width:min(70vw,300px);aspect-ratio:1;border-radius:24px;box-shadow:0 0 0 100vmax rgba(0,0,0,.5)}
.qr-scan-viseur .qr-c{width:44px;height:44px;border-width:5px;border-color:#fff}
.qr-scan-viseur .qr-laser{opacity:1;animation:qrBalai 1.4s ease-in-out infinite alternate;background:#fff;box-shadow:0 0 14px 4px rgba(255,255,255,.6)}
.qr-scan.ok .qr-c{border-color:var(--ogre)}.qr-scan.ok .qr-laser{opacity:0}
.qr-scan.ok .qr-scan-viseur{box-shadow:0 0 0 100vmax rgba(0,0,0,.5),inset 0 0 0 4px var(--ogre)}
.qr-scan-aide{position:absolute;left:16px;right:16px;bottom:calc(36px + env(safe-area-inset-bottom));margin:0;text-align:center;color:#fff;font-weight:700;line-height:1.4;text-shadow:0 1px 3px #000}
.qr-scan-x{position:absolute;top:calc(14px + env(safe-area-inset-top));right:14px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.18);color:#fff;display:grid;place-items:center;cursor:pointer}
@media (prefers-reduced-motion:reduce){.qr-scan-viseur .qr-laser{animation:none;top:50%}}


/* téléphones : bulles d'Ogrelo un peu plus compactes (toute l'appli) */
/* Ogrelo qui parle (écrans d'attente, ordre…) : tête plus petite, bulle compacte */
.hello .ogre{width:72px;height:72px}.hello .bubble{max-width:none;flex:1}
@media (max-width:430px){
  .hello .ogre{width:64px;height:64px}
  .bubble p,.g-say-b p{font-size:1.06rem;line-height:1.3}.bubble .big{font-size:1.18rem}
  .bubble,.g-say-b{padding:10px 13px 10px}
}

/* QR Pronote : Scanner et Importer côte à côte */
.qr-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 6px}.qr-btns .btn{margin:0;width:100%;display:flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;text-align:center}


/* ---------- Accueil : la liste du jour choisi (app-home.js, jourHTML) ---------- */
/* types : Devoir = orange / crayon, Contrôle = rouge / cible, Cours = bleu / livre (mêmes couleurs pour les points du calendrier) */
.k-dv{--k:var(--t-warn);--kb:var(--t-warn-bg)}.k-ct{--k:var(--t-crit);--kb:var(--t-crit-bg)}.k-co{--k:var(--t-info);--kb:var(--t-info-bg)}
.h-dots i.k-dv,.h-dots i.k-ct,.h-dots i.k-co{background:var(--k)}
.h-day.past{opacity:.75}
.h-day[aria-pressed="true"]{opacity:1}
.j-auj{border:0;border-radius:999px;padding:0 14px;height:38px;font:inherit;font-size:.85rem;font-weight:800;color:var(--sky);background:color-mix(in srgb,var(--sky) 12%,var(--sheet))}
.j-zone{display:flex;flex-direction:column;gap:18px;min-height:120px}
.j-titre{font-family:var(--display);font-size:1.05rem;margin:0 0 -6px;color:var(--soft)}
.j-titre::first-letter{text-transform:uppercase}
/* carte d'une chose à faire : la zone principale ouvre le devoir ; le pied porte l'action (« Fiche prête ») */
.j-card{padding:0;overflow:hidden}
.j-main{display:block;width:100%;border:0;background:none;font:inherit;color:inherit;text-align:left;padding:14px 16px 12px;cursor:pointer}
.j-k{flex:none;display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 10px 3px 8px;font-size:.74rem;font-weight:800;background:var(--kb);color:var(--k)}
.j-k i{font-size:.9em}
.j-card h3{margin:10px 0 2px}
.j-src{display:inline-flex;align-items:center;gap:5px;font-size:.78rem;font-weight:700;color:var(--soft)}
.j-pied{display:flex;align-items:center;gap:8px;padding:0 16px 14px;min-height:0}
.j-pied:empty{display:none}
.j-pied .stt{margin:0}
.j-fiche{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;padding:7px 12px;font:inherit;font-size:.84rem;font-weight:800;background:var(--t-good-bg);color:var(--t-good);cursor:pointer}
.j-fiche .gi-droite{font-size:.85em;opacity:.8}
.j-card.passe{opacity:.62;filter:saturate(.35)}
.j-card.passe.done{opacity:.7}
.j-card.done{opacity:.62}
.j-ri{flex:none;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;font-size:1.05rem;background:var(--t-mute-bg);color:var(--t-mute)}
.j-ri.k-dv,.j-ri.k-ct,.j-ri.k-co{background:var(--kb);color:var(--k)}
.j-ri.gr{background:var(--t-good-bg);overflow:hidden}.j-ri.gr svg{width:30px;height:30px}
/* jour vide : calme et clair, puis UNE suggestion */
.j-vide{background:var(--card);border:2px dashed var(--line);border-radius:22px;padding:18px 16px}
.j-vide-h{display:flex;align-items:center;gap:12px}
.j-vide-h .f{flex:none;width:46px;height:46px}.j-vide-h .f svg{width:100%;height:100%}
.j-vide-h b{font-family:var(--display);font-size:1.1rem;line-height:1.3}
.j-sug{margin-top:16px;padding:14px;border-radius:18px;background:color-mix(in srgb,var(--sun,#FFC83D) 16%,var(--sheet));display:flex;flex-direction:column;align-items:stretch;gap:4px}
.j-eye{font-size:.74rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--soft)}
.j-sug b{font-size:1rem;line-height:1.35}
.j-sug p{margin:0 0 10px;font-size:.88rem;color:var(--soft);line-height:1.4}
.j-go{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;font-size:1rem;margin:0}
.j-rien{text-align:center;color:var(--soft);font-weight:700;margin:18px 0}
/* aujourd'hui : contrôles des 3 prochains jours, en lignes discrètes */
.j-prep{display:flex;flex-direction:column;gap:6px}
.j-pl{display:flex;align-items:center;gap:10px;width:100%;border:0;border-radius:14px;background:color-mix(in srgb,var(--t-crit) 6%,transparent);font:inherit;font-size:.86rem;font-weight:600;color:var(--ink);text-align:left;padding:10px 12px;cursor:pointer}
.j-pl>i:first-child{color:var(--t-crit)}
.j-pl span{flex:1;min-width:0}
.j-pl .go{color:var(--soft)}
/* textes agrandis (Android 130 %) / petits écrans : rien ne se chevauche, la matière passe à la ligne plutôt que d'être coupée */
.h-month{gap:8px;flex-wrap:wrap}.h-month b{min-width:0}.h-arrows{margin-left:auto;align-items:center}
.h-arrows .j-auj{width:auto;white-space:nowrap;font-size:.85rem;padding:0 14px;box-shadow:none}
.j-main{position:relative}
.j-card .h-top{flex-wrap:wrap;row-gap:6px;padding-right:26px}
.j-card .h-mat{flex:1 1 7em}
.j-card .h-top .go{position:absolute;right:14px;top:24px}
.j-auj .c{display:none}
@media (max-width:400px){.j-auj .l{display:none}.j-auj .c{display:inline}}
/* jour vide : deux choix clairs (prendre de l'avance, réviser avec Ogrelo) */
.j-choix-l{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.j-choix{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font:inherit;color:var(--ink);background:var(--sheet);border:2px solid var(--line);border-radius:18px;padding:12px 12px;cursor:pointer}
.j-choix .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.j-choix .tx b{font-size:1rem;line-height:1.3}
.j-choix .tx small{font-size:.82rem;color:var(--soft);line-height:1.35}
.j-choix .go{flex:none;color:var(--soft)}
.j-choix.fort{border-color:color-mix(in srgb,var(--ogre-d,#3E7F31) 55%,var(--line));background:color-mix(in srgb,var(--ogre-d,#3E7F31) 8%,var(--sheet))}
.j-choix:active{transform:translateY(1px)}
.j-sug .j-go{width:100%}
.j-eye i{margin-right:2px}
.j-vide{padding:16px 12px}
.j-choix{padding:12px 10px;gap:10px}
/* ---------- onglet Notes : résumé, nouvelles notes, par matière ---------- */
.n-resume{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 10px;padding:12px 16px;border-radius:18px;background:var(--card);border:2px solid var(--line);margin-bottom:6px}
.n-resume .l{font-weight:700;color:var(--soft)}
.n-resume .v{font-family:var(--display);font-size:1.4rem}.n-resume .v small{font-size:.8rem;color:var(--soft)}
.n-tend{display:inline-flex;align-items:center;gap:4px;font-weight:800;font-size:.9rem;border-radius:999px;padding:2px 9px}
.n-tend.up{color:var(--t-good);background:var(--t-good-bg)}.n-tend.down{color:var(--t-crit);background:var(--t-crit-bg)}.n-tend.down i{transform:scaleY(-1)}
.n-tend.eq{color:var(--t-mute);background:var(--t-mute-bg)}
.n-resume .per{color:var(--soft);font-size:.8rem}
.n-mats{display:flex;flex-direction:column;gap:8px}
.n-mat{border:2px solid var(--line);border-radius:16px;background:var(--card);overflow:hidden}
.n-mat summary{list-style:none;display:grid;grid-template-columns:34px minmax(0,1fr) 44px 2.6em 16px;gap:10px;align-items:center;padding:10px 12px;cursor:pointer}
.n-mat summary::-webkit-details-marker{display:none}
.n-mat summary .h-ico{width:34px;height:34px;border-radius:10px;font-size:1rem;background:color-mix(in srgb,var(--c,var(--ogre)) 25%,var(--card));color:color-mix(in srgb,var(--c,var(--ogre)) 75%,#000)}
.n-mat summary .nm{font-weight:700;overflow-wrap:anywhere;line-height:1.25}
.n-mat summary b{text-align:right;font-family:var(--display)}
.n-mat .chev{color:var(--soft);transition:transform .2s}.n-mat[open] .chev{transform:rotate(180deg)}
.n-ul{list-style:none;margin:0;padding:0 12px 10px;display:flex;flex-direction:column}
.n-li{display:flex;align-items:center;gap:10px;padding:9px 2px;border-top:1px solid var(--line);font-size:.9rem}
.n-li .d{flex:none;width:3.6em;color:var(--soft);font-size:.8rem}
.n-li .tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.n-li b{flex:none;font-family:var(--display)}.n-li b small{font-size:.75em;color:var(--soft)}
.n-cp{flex:none;width:24px;height:24px;border-radius:8px;display:grid;place-items:center;font-size:.8rem;background:var(--t-mute-bg);color:var(--t-mute)}
.n-cp.photo{background:var(--t-warn-bg);color:var(--t-warn)}.n-cp.analyse{background:var(--t-info-bg);color:var(--t-info)}.n-cp.analysee{background:var(--t-info-bg);color:var(--t-info)}
.n-cp.consolide{background:var(--t-good-bg);color:var(--t-good)}.n-cp.a_revoir{background:var(--t-warn-bg);color:var(--t-warn)}
.n-cp .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .n-mat summary .h-ico{color:color-mix(in srgb,var(--c,var(--ogre)) 55%,#fff)}}
:root[data-theme="dark"] .n-mat summary .h-ico{color:color-mix(in srgb,var(--c,var(--ogre)) 55%,#fff)}
/* ---------- écran d'un devoir, un pas à la fois (étape 0 « Donne-moi l'exercice », 1 deux actions, 2 « Aller plus loin ») ---------- */
.dv-head{padding:14px 16px}.dv-head h2{font-size:1.3rem}
.dv-enonce p{font-size:1.05rem;line-height:1.5}
.dv-pieces{display:flex;gap:10px;overflow-x:auto;margin:12px -2px 0;padding:2px 2px 4px;scrollbar-width:none}
.dv-pj{flex:none;width:76px;border:0;background:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--soft);font-weight:700;cursor:pointer}
.dv-pj .im,.dv-pj .ic{width:76px;height:76px;border-radius:14px;border:1.5px solid var(--line);background:var(--sheet);display:grid;place-items:center;overflow:hidden;font-size:1.5rem;color:var(--soft)}
.dv-pj .im img{width:100%;height:100%;object-fit:cover}
.dv-pj small{font-size:.74rem;max-width:76px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dv-pj.add .ic{border-style:dashed}
.dv-pj[aria-disabled="true"]{cursor:default}
.dv-pj.lien{text-decoration:none}
.dv-pj.lien.ko .ic{border-style:dashed;opacity:.7}
.dv-lien-ko{margin:10px 0 0;font-size:.86rem;color:var(--soft);display:flex;gap:6px;align-items:baseline}
.dv-donne{background:var(--card);border:2px solid var(--line);border-radius:22px;padding:16px 14px;margin-bottom:12px}
.dv-donne .g-say{margin-bottom:14px}
.dv-donne .g-say-b p b{font-family:var(--display);font-size:1.08rem}
.dv-deux{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.dv-act{min-width:0;box-sizing:border-box;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:20px;padding:16px 12px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;text-align:left;cursor:pointer;min-height:132px;font:inherit}
.dv-act .i{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:1.35rem;background:color-mix(in srgb,var(--ogre) 16%,transparent);color:var(--ogre-d)}
.dv-act .tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.dv-act b{font-family:var(--display);font-size:1.06rem;line-height:1.2}
.dv-act small{color:var(--soft);font-weight:600;font-size:.84rem;line-height:1.3}
.dv-act.chat .i{background:color-mix(in srgb,#1F78B8 16%,transparent);color:#1F78B8}
.dv-act.fini .i{background:color-mix(in srgb,#2F8A4A 16%,transparent);color:#2F8A4A}
.dv-act.plein{background:var(--ogre);border-color:var(--ogre);color:#fff}.dv-act.plein .i{background:rgba(255,255,255,.2);color:#fff}
.dv-donne .dv-act{min-height:0;flex-direction:row;align-items:center;justify-content:center;gap:8px;padding:14px 8px}
.dv-donne .dv-act b{font-size:1rem;white-space:nowrap}
.dv-donne .dv-deux{grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}   /* côte à côte quand ça tient, l'un sous l'autre sinon */
.dv-donne .dv-act .i{width:auto;height:auto;background:none;color:inherit;font-size:1.25rem}
.dv-act.busy,.dv-pj.busy,.dv-relien.busy{opacity:.55;pointer-events:none}
.dv-fine{margin:0;color:var(--soft);font-size:.86rem;text-align:center}
.dv-quiz{width:100%;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:16px;padding:13px;font-family:var(--display);font-weight:800;font-size:1rem;display:flex;align-items:center;justify-content:center;gap:8px;margin:-2px 0 12px;cursor:pointer}
.dv-st{color:#E3A008;white-space:nowrap}
.dv-prep{display:flex;align-items:center;gap:10px;color:var(--soft);font-weight:700;margin:-2px 4px 12px}
.dv-verif{border-radius:20px;padding:14px;margin-bottom:12px;border:2px solid var(--line);background:var(--card)}
.dv-verif.ok{border-color:color-mix(in srgb,var(--ok) 55%,var(--line));background:color-mix(in srgb,var(--ok) 9%,var(--card))}
.dv-verif .t{margin:0;font-size:.86rem;color:var(--soft);font-weight:700;display:flex;gap:6px;align-items:center}
.dv-verif.ok .t i{color:#E3A008}
.dv-verif .r{margin:6px 0 0;font-family:var(--display);font-size:1.08rem;color:var(--ink)}
.dv-verif ul{margin:8px 0 0;padding-left:20px;color:var(--ink)}.dv-verif li{margin:4px 0}
.dv-relien{display:block;text-align:center;color:var(--soft);font-weight:700;text-decoration:underline;margin:4px 0 14px;cursor:pointer}
.dv-plus{border:2px solid var(--line);border-radius:20px;background:var(--card);margin-bottom:12px;padding:0 14px}
.dv-plus>summary{list-style:none;cursor:pointer;padding:14px 0;font-family:var(--display);font-weight:800;color:var(--soft);display:flex;align-items:center;gap:8px}
.dv-plus>summary::-webkit-details-marker{display:none}
.dv-plus>summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:rotate(45deg);transition:transform .2s}
.dv-plus[open]>summary::after{transform:rotate(-135deg)}
.dv-plus.loin{border-color:color-mix(in srgb,var(--ok) 45%,var(--line))}.dv-plus.loin>summary{color:var(--ok-t)}
.dv-plus-aide{margin:-6px 0 8px;color:var(--soft);font-size:.88rem}
.dv-plus-l{display:flex;flex-direction:column;gap:2px;padding-bottom:10px}
.dv-l{display:flex;align-items:center;gap:12px;border:0;background:none;padding:10px 0;text-align:left;color:var(--ink);font:inherit;cursor:pointer;border-top:1px solid var(--line)}
.dv-l:first-child{border-top:0}
.dv-li{width:38px;height:38px;flex:none;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--ogre) 13%,transparent);color:var(--ogre-d);font-size:1.1rem}
.dv-l .tx{flex:1;min-width:0;display:flex;flex-direction:column}.dv-l b{font-weight:800}.dv-l small{color:var(--soft);font-size:.84rem}
.dv-l .go{color:var(--soft)}
.dv-cartes{border-top:1px solid var(--line);padding:12px 0}.dv-cartes h3{font-size:1rem;margin:0 0 4px}
.dv-plus .bv-ctl:not([hidden]){border-top:1px solid var(--line);padding:12px 0}
.dv-done{opacity:.9}
@media (max-width:340px){.dv-deux{grid-template-columns:1fr}.dv-act{min-height:0}}
/* fiche : la leçon, puis « J'ai bien compris » → « Je m'entraîne » (grisé avant) / « J'ai une question » */
.f-fin{margin-top:18px;display:flex;flex-direction:column;gap:2px}
.f-fin .knowbtn{margin-bottom:8px}
.f-go.off{opacity:.42;filter:grayscale(.6);box-shadow:none}
.knowbtn.flash{animation:d-flash 1.2s ease}
.f-deux{display:grid;grid-template-columns:1fr 1fr;gap:10px}.f-deux .btn{margin:6px 0}
.recap-d{margin:10px 0}.recap-d>summary{cursor:pointer;font-family:var(--display);font-weight:800;padding:8px 2px;color:var(--soft)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .dv-act.chat .i{color:#8DB6F0}:root:not([data-theme="light"]) .dv-act.fini .i{color:#5FD08E}:root:not([data-theme="light"]) .dv-act:not(.plein) .i,:root:not([data-theme="light"]) .dv-li{color:var(--ogre)}}
:root[data-theme="dark"] .dv-act.chat .i{color:#8DB6F0}:root[data-theme="dark"] .dv-act.fini .i{color:#5FD08E}:root[data-theme="dark"] .dv-act:not(.plein) .i,:root[data-theme="dark"] .dv-li{color:var(--ogre)}

/* « J'ai terminé » verrouillé tant que le travail n'a pas été montré */
.dv-done.verrou{opacity:.55}
.attire{animation:dvAttire .5s ease 3}
@keyframes dvAttire{50%{transform:scale(1.04);box-shadow:0 0 0 4px color-mix(in srgb,var(--ogre) 35%,transparent)}}
@media (prefers-reduced-motion:reduce){.attire{animation:none;outline:3px solid var(--ogre)}}

/* Moi : profil et moyennes dans un seul bloc */
.moi-bloc .moi-prof{margin:0;padding:0;border:0;background:none;box-shadow:none}
.moi-bloc .mo-moy{margin:14px 0 0;padding:14px 0 0;border-top:1px solid var(--line)}

/* « Ajouter la photo » : un seul bouton net, centré */
.dv-photo1{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin:14px 0 0;font-size:1.05rem;padding:15px 12px;cursor:pointer}
.dv-photo1 i{width:22px;height:22px}

/* historique : miniatures d'images (démo / images publiques) */
.hs-mini{margin:0;display:inline-flex;flex-direction:column;align-items:center;gap:4px}.hs-mini .illus-c{padding:0;border:0;background:none;cursor:zoom-in}.hs-mini img{width:64px;height:84px;object-fit:cover;border-radius:10px;border:1px solid var(--line);display:block}
button.dv-relien{background:none;border:0;width:100%;font:inherit;font-weight:700;padding:10px;margin-top:26px}
/* menu Ogrelo : éventail de bulles au-dessus du bouton du milieu */
.om{position:fixed;inset:0;z-index:29;background:rgba(10,20,15,.0);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);transition:background .22s,backdrop-filter .22s}
.om.ouvert{background:rgba(10,20,15,.42);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.om-t{position:absolute;left:0;right:0;top:calc(var(--cy) - 300px);text-align:center;margin:0;color:#fff;font-weight:800;font-size:1.15rem;opacity:0;transform:translateY(8px);transition:.25s .1s}
.om.ouvert .om-t{opacity:1;transform:none}
.om-i{position:absolute;left:var(--cx);top:var(--cy);display:flex;flex-direction:column;align-items:center;gap:6px;background:none;border:0;padding:0;cursor:pointer;color:#fff;font:inherit;
  transform:translate(-50%,-50%) scale(.2);opacity:0;transition:transform .32s cubic-bezier(.3,1.5,.5,1) var(--d),opacity .2s var(--d)}
.om.ouvert .om-i{transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1);opacity:1}
.om-r{position:relative;width:64px;height:64px;border-radius:50%;background:var(--c);display:grid;place-items:center;box-shadow:0 8px 20px rgba(0,0,0,.3);border:3px solid rgba(255,255,255,.9)}
.om-r i{font-size:1.6rem;color:#fff}
.om-r .gr-live-dot{position:absolute;top:2px;right:2px}
.om-l{font-weight:800;font-size:.86rem;line-height:1.2;background:rgba(0,0,0,.4);padding:4px 10px;border-radius:12px;max-width:112px;text-align:center}
.om-i:focus-visible .om-r{outline:3px solid #fff;outline-offset:3px}
.om-i:active .om-r{transform:scale(.94)}
body.om-on .h-tab.mid .bub{transform:rotate(-8deg) scale(1.06);transition:transform .2s}
@media (prefers-reduced-motion:reduce){.om,.om-i,.om-t{transition:none}}

/* ===== Quiz : la même allure partout (quiz des fiches = référence ; exercices, Langues) =====
   Options : cartes arrondies, pastille de lettre en couleur (A bleu, B orange, C framboise, D violet), texte un peu plus petit (≥ 15 px), cibles ≥ 52 px. */
.opt{font-size:.94rem;line-height:1.35;min-height:56px;transition:transform .1s,box-shadow .1s}
.opt:not(:disabled):active{transform:translateY(3px);box-shadow:none}
.exo-ch{counter-reset:opt;gap:12px}
.exo-ch button{counter-increment:opt;display:flex;align-items:center;gap:12px;border-width:3px!important;border-radius:18px!important;background:var(--card);box-shadow:var(--shadow);font-size:.94rem!important;line-height:1.35;min-height:56px;padding:10px 14px 10px 10px!important;transition:transform .1s,box-shadow .1s}
.exo-ch button:not([data-carte])::before{content:counter(opt,upper-alpha);flex:none;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:1rem;color:#fff;background:#1F78B8}
.exo-ch button:not([data-carte]):nth-child(4n+2)::before{background:#D9631A}.exo-ch button:not([data-carte]):nth-child(4n+3)::before{background:#C42E63}.exo-ch button:not([data-carte]):nth-child(4n+4)::before{background:#6F3DB8}
.exo-ch button.good::before{background:var(--ok)}.exo-ch button.bad::before{background:var(--ko)}
.exo-ch button:not(:disabled):active{transform:translateY(3px);box-shadow:none}
.exo-ch button.good{color:var(--ink)}.exo-ch button.bad{color:var(--ink)}
.exo-bar{height:12px!important;border-radius:99px}.exo-bar i{background:linear-gradient(90deg,var(--ogre),var(--sun))!important;border-radius:99px;transition:width .3s}
.exo-fb{border-width:3px!important;border-radius:20px!important;align-items:center}
.exo-fb .exo-face,.exo-fb .exo-face .ogre{width:60px;height:60px}
.exo-fb.ok{animation:pop .4s ease both}.exo-fb.ko{animation:wig .4s ease both}
@media (prefers-reduced-motion:reduce){.exo-fb.ok,.exo-fb.ko{animation:none}}

/* ===== Bulles d'Ogrelo : texte écrit lettre par lettre (bubble.js · ecrireLettre) ===== */
.tw-lu{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.tw-on{cursor:pointer}
.tw-attente{opacity:0;pointer-events:none;transform:translateY(6px)}
.tw-vient{animation:twVient .35s ease both}
@keyframes twVient{from{opacity:0;transform:translateY(6px)}}
@media (prefers-reduced-motion: reduce){.tw-attente{opacity:1;pointer-events:auto;transform:none}.tw-vient{animation:none}}

/* bulles d'Ogrelo : composant commun dans bulles.css */
/* bonjour : un vrai panneau, contour franc comme l'avatar */
.h-hello{font-size:1.22rem!important;font-weight:900;letter-spacing:.01em;border:3px solid #16304A;border-top:0;padding:10px 16px 9px!important;box-shadow:0 0 0 3px #fff,0 8px 18px rgba(0,0,0,.25)!important;max-width:calc(100% - 92px)!important}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-hello{border-color:#fff;box-shadow:0 0 0 3px #16304A,0 8px 18px rgba(0,0,0,.45)!important}}
:root[data-theme="dark"] .h-hello{border-color:#fff;box-shadow:0 0 0 3px #16304A,0 8px 18px rgba(0,0,0,.45)!important}
#dVis .dv-c{display:none}@media (max-width:420px){#dVis .dv-l{display:none}#dVis .dv-c{display:inline}}
.j-ri.lg{background:#3557A8;color:#fff}

/* contrôle / leçon : « Envoie-moi ta leçon » (plusieurs pages d'un coup), actions visibles mais grisées tant que rien n'est reçu ;
   « 2 pages reçues » + « Ajouter des pages » ; leçon trop maigre : « Je complète avec le programme de ta classe ? » (tuiles à ombre pleine) */
.dv-lecon,.dv-recues{background:var(--card);border:2px solid color-mix(in srgb,var(--ogre) 40%,var(--line));border-radius:22px;padding:18px 16px;margin:0 0 22px;
  box-shadow:0 5px 0 color-mix(in srgb,var(--ogre) 45%,var(--line))}
.dv-lecon .g-say{margin-bottom:16px}
.dv-lecon .dv-photo1{margin:4px 0 0;box-shadow:0 5px 0 var(--ogre-d)}
.dv-lecon .dv-photo1:active{transform:translateY(4px);box-shadow:0 1px 0 var(--ogre-d)}
.dv-lecon-aide{margin:12px 2px 0;color:var(--soft);font-weight:700;font-size:.9rem;text-align:center}
.dv-donne .dv-lecon-aide{margin-top:10px}
.dv-act.gris{position:relative;opacity:.55;filter:grayscale(1);cursor:pointer;box-shadow:none}
.dv-act.gris .cad{position:absolute;top:12px;right:12px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--line);color:var(--soft);font-size:.85rem}
.dv-relien.gris{opacity:.55;text-decoration:none}
.dv-relien.gris i{margin-right:4px}
.dv-recues{padding:14px 16px;border-color:color-mix(in srgb,#2F8A4A 35%,var(--line));box-shadow:0 5px 0 color-mix(in srgb,#2F8A4A 40%,var(--line))}
.dv-recues-t{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.dv-recues .nb{display:inline-flex;align-items:center;gap:6px;font-family:var(--display);font-weight:800;color:#2F8A4A}
.dv-recues-minis{display:flex;gap:6px;flex-wrap:wrap}
.dv-recues-minis .dv-pj{width:46px;min-width:0;padding:0;border:0;background:none}
.dv-recues-minis .dv-pj small{display:none}
.dv-recues-minis .im{width:46px;height:58px;border-radius:9px;overflow:hidden;display:block;border:1px solid var(--line)}
.dv-recues-minis .im img{width:100%;height:100%;object-fit:cover}
.dv-recues p{margin:10px 0 12px;font-weight:700;line-height:1.4}
.dv-ajout{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;cursor:pointer;padding:12px}
.dv-ajout.busy,#dvCompleter.busy,.dv-ch.busy{opacity:.55;pointer-events:none}
.dv-maigre-acts{display:grid;gap:12px}
.dv-maigre-acts .btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:0;padding:14px 12px;font-size:1.02rem}
.dv-cp{display:block;margin-top:4px;color:#7B5A12;font-weight:800}
.dv-cp-bandeau{display:flex;gap:10px;align-items:flex-start;margin:0 0 18px;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,#E3A82B 14%,var(--card));border:2px solid color-mix(in srgb,#E3A82B 45%,var(--line));color:var(--ink);font-weight:700;line-height:1.4}
.dv-cp-bandeau i{flex:none;margin-top:2px;color:#9A6A00}
.dv-chs{display:grid;gap:12px;margin:4px 0 6px}
.dv-ch{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;text-align:left;font:inherit;font-weight:800;color:var(--ink);background:var(--card);
  border:2px solid var(--line);border-radius:18px;padding:14px 16px;cursor:pointer;box-shadow:0 4px 0 var(--line)}
.dv-ch:active{transform:translateY(3px);box-shadow:0 1px 0 var(--line)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .dv-recues .nb{color:#5FD08E}:root:not([data-theme="light"]) .dv-cp{color:#F2C46B}:root:not([data-theme="light"]) .dv-cp-bandeau i{color:#F2C46B}}
:root[data-theme="dark"] .dv-recues .nb{color:#5FD08E}:root[data-theme="dark"] .dv-cp{color:#F2C46B}:root[data-theme="dark"] .dv-cp-bandeau i{color:#F2C46B}
/* version gratuite : « Oui, complète » grisé avec le badge « Complet » (abonnement.js) ; « J'envoie d'autres photos » reste actif */
#dvCompleter.abo-lock{filter:grayscale(1);opacity:.6;box-shadow:none}
#dvCompleter .abo-badge{margin-left:6px}
.dv-photo1.dv-pages{display:flex!important;align-items:center;justify-content:center;gap:12px;line-height:1.2;text-align:left}.dv-photo1.dv-pages>i{flex:none;font-size:1.4rem;display:grid;place-items:center}
.demo-x{width:36px;height:36px;padding:0!important;border-radius:50%!important;display:inline-grid!important;place-items:center;font-size:1rem}
/* fin d'exercice façon Duolingo : visage qui rebondit, anneau de score animé, tuiles de stats */
@property --pp{syntax:'<number>';inherits:false;initial-value:0}
.exo-fin{--fc:#46A302;--fd:#2F7A00;text-align:center;padding:8px 4px 4px;animation:finIn .45s cubic-bezier(.3,1.4,.5,1)}
.exo-fin.fin-bien{--fc:#1CB0F6;--fd:#1288C4}.exo-fin.fin-go{--fc:#FF9600;--fd:#C46F00}
.exo-fin .exo-face.big{animation:finSaut .7s .15s cubic-bezier(.3,1.6,.5,1) both}
.exo-fin>b{font-family:var(--display);font-size:1.45rem;margin:6px 0 14px;display:block;color:var(--fd)}
.fin-ring{--pp:var(--p);width:150px;height:150px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(closest-side,var(--card,#fff) 76%,transparent 77% 100%),conic-gradient(var(--fc) calc(var(--pp)*1%),color-mix(in srgb,var(--fc) 15%,var(--line,#e5e7eb)) 0);
  box-shadow:0 6px 0 color-mix(in srgb,var(--fd) 35%,transparent);animation:finRing 1s .1s ease-out both}
.fin-ring .pc{font-family:var(--display);font-weight:900;font-size:2.4rem;color:var(--fd)!important}
@keyframes finRing{from{--pp:0}}
.fin-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 10px}
.fin-s{border:2px solid var(--line);border-radius:18px;padding:12px 8px;box-shadow:0 4px 0 var(--line);background:var(--card,#fff);display:flex;flex-direction:column;align-items:center;gap:2px;animation:finIn .4s both}
.fin-s.ok{animation-delay:.35s}.fin-s.tot{animation-delay:.45s}
.fin-s i{font-size:1.1rem;color:var(--fc)}
.fin-s b{font-family:var(--display);font-size:1.6rem;line-height:1}
.fin-s small{font-weight:800;color:var(--soft);font-size:.8rem;text-transform:uppercase;letter-spacing:.04em}
.fin-l{color:var(--soft);font-size:.9rem;margin:4px 0 18px}
.exo-fin .exo-acts{display:grid;gap:12px}
@keyframes finIn{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
@keyframes finSaut{0%{transform:scale(.3) rotate(-10deg);opacity:0}100%{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.exo-fin,.exo-fin *{animation:none!important}}
/* questions d écoute / lecture : une carte par question, numéro en pastille (plus de double numéro) */
.eo-qs{list-style:none!important;padding:0!important;margin:16px 0 0!important;display:grid;gap:14px}
.eo-qs>li::marker{content:""}
.eo-q{background:var(--card,#fff);border:2px solid var(--line);border-radius:20px;padding:14px 14px 12px;box-shadow:0 4px 0 var(--line)}
.eo-q.ok{border-color:#8BC34A;box-shadow:0 4px 0 #8BC34A}
.eo-q.ko{border-color:#FFB74D;box-shadow:0 4px 0 #FFB74D}
.eo-qt{display:flex;gap:10px;align-items:flex-start;margin:0 0 12px;font-weight:700}
.eo-num{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--sky,#1CB0F6);color:#fff;font-family:var(--display);font-weight:900;font-size:.9rem;box-shadow:0 2px 0 rgba(0,0,0,.15)}
/* alternance légère : une carte sur deux et une réplique sur deux un peu teintées */
.eo-qs>.eo-q:nth-child(even):not(.ok):not(.ko){background:color-mix(in srgb,var(--sky,#1CB0F6) 7%,var(--card,#fff))}
.eo-lignes>.eo-l:nth-child(odd)>button{background:color-mix(in srgb,var(--sky,#1CB0F6) 8%,transparent);border-radius:14px}
.eo-lignes>.eo-l:nth-child(even)>button{background:color-mix(in srgb,#8E44EC 7%,transparent);border-radius:14px}

/* Moi : raccourci vers la boutique, à droite du profil (gros croc dans un rond doré) */
.moi-shop{flex:none;align-self:flex-start;display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px;border:0;background:none;color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent}
.moi-shop .i{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,#F7B733 22%,transparent);border:2px solid color-mix(in srgb,#F7B733 60%,transparent);box-shadow:0 3px 0 color-mix(in srgb,#C98A10 45%,transparent)}
.moi-shop .i svg{width:30px;height:30px}
.moi-prof .moi-shop b{font-size:.78rem;font-weight:800;font-family:inherit;line-height:1}
.moi-shop:active .i{transform:translateY(2px);box-shadow:0 1px 0 color-mix(in srgb,#C98A10 45%,transparent)}
.moi-shop:focus-visible{outline:2px solid var(--ogre-d,#3E7F31);outline-offset:3px;border-radius:12px}
/* « Ce n'est pas un contrôle » / « C'est un contrôle » : action discrète (carte d'un devoir, écran du devoir) */
.j-ctl{margin-left:auto;background:none;border:0;padding:6px 2px;color:var(--soft);font:inherit;font-size:.8rem;display:inline-flex;align-items:center;gap:5px;cursor:pointer;border-radius:8px;min-height:32px}
.j-ctl:hover,.j-ctl:focus-visible{color:var(--ink);text-decoration:underline}
.j-ctl[disabled]{opacity:.5}
.dv-ctl{margin:-4px 0 14px;text-align:right}
.dv-ctl .j-ctl{margin-left:0}
.h-reco{border-color:var(--sun,#E8A33D);background:color-mix(in srgb,var(--sun,#E8A33D) 10%,var(--sheet))}

/* accueil : bloc « rien reçu » sans ENT, dans la zone du jour (photos, programme, code de classe), puis un atelier ou le bloc Langues */
.j-se{display:flex;flex-direction:column;gap:14px}
.j-se>.pe-carte,.j-se>.se-home{margin:0}
.j-se>.j-choix-l{margin-top:2px}
/* bloc Langues (façon Duolingo) : grande carte aux couleurs de la langue, drapeau ou glyphe en grand, Grignon qui parle, gros bouton */
.lgc{--tc:#3557A8;--tt:#fff;position:relative;overflow:hidden;margin-top:16px;border-radius:26px;padding:20px 18px 18px;background:linear-gradient(160deg,color-mix(in srgb,var(--tc) 82%,#fff),var(--tc) 55%,color-mix(in srgb,var(--tc) 82%,#000));color:var(--tt);box-shadow:0 6px 0 color-mix(in srgb,var(--tc) 55%,#000 30%)}
.j-se>.lgc{margin-top:2px}
.lgc-haut{display:flex;align-items:center;gap:14px}
.lgc-big{flex:none;display:grid;place-items:center;width:84px;height:60px;border-radius:16px;overflow:hidden;box-shadow:0 0 0 3px rgba(255,255,255,.9),0 4px 0 rgba(0,0,0,.18)}
.lgc-big svg{display:block;width:100%;height:100%}
.lgc-big.gl{width:72px;height:72px;border-radius:22px;background:rgba(255,255,255,.16);font-size:2.9rem;line-height:1;font-weight:700;color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.18)}
.lgc-nom{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.lgc-nom small{font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.85}
.lgc-nom b{font-family:var(--display);font-size:1.6rem;line-height:1.1}
.lgc-mini{display:block;width:30px;height:20px;border-radius:6px;overflow:hidden;margin-top:4px;box-shadow:0 0 0 2px rgba(255,255,255,.8)}.lgc-mini svg{display:block;width:100%;height:100%}
.lgc-niv{flex:none;display:grid;place-items:center;min-width:54px;height:54px;padding:0 8px;border-radius:17px;border:2px solid rgba(255,255,255,.85);background:rgba(255,255,255,.14);font-family:var(--display);font-weight:900;font-size:1.25rem;color:inherit}
.lgc-og{display:flex;align-items:flex-end;gap:10px;margin-top:18px}
.lgc-og .f{flex:none;width:58px;height:58px}.lgc-og .f svg{width:100%;height:100%}
.lgc-og p{position:relative;flex:1;margin:0 0 6px;padding:11px 14px;border-radius:18px 18px 18px 6px;background:#fff;color:#22212F;font-weight:600;line-height:1.4;font-size:.97rem}
.lgc-stats{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:16px}
.lgc-serie{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.18);font-weight:800;font-size:.9rem}
.lgc-prog{flex:1;min-width:170px;display:flex;flex-direction:column;gap:5px}
.lgc-prog small{font-size:.82rem;opacity:.9}
.lgc-barre{display:block;height:12px;border-radius:999px;background:rgba(0,0,0,.2);overflow:hidden}.lgc-barre i{display:block;height:100%;border-radius:inherit;background:#fff}
.lgc-next{margin-top:14px;padding:12px 14px;border-radius:16px;background:rgba(0,0,0,.16);display:flex;flex-direction:column;gap:3px}
.lgc-next small{font-size:.76rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;opacity:.85}.lgc-next b{line-height:1.35}
.lgc-go{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin-top:18px;padding:16px;border:0;border-radius:18px;background:#fff;color:color-mix(in srgb,var(--tc) 80%,#000);font:inherit;font-family:var(--display);font-weight:900;font-size:1.15rem;cursor:pointer;box-shadow:0 5px 0 rgba(0,0,0,.22)}
.lgc-go:active{transform:translateY(3px);box-shadow:0 2px 0 rgba(0,0,0,.22)}
.lgc-go i{font-size:1.25rem}
.lgc-inv{--tc:#2F6FD0}
.lgc-glo{display:grid;place-items:center;width:72px;height:72px;border-radius:22px;background:rgba(255,255,255,.16);font-size:2.4rem}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .lgc{background:linear-gradient(160deg,color-mix(in srgb,var(--tc) 70%,#22212F),color-mix(in srgb,var(--tc) 55%,#15141E));box-shadow:0 6px 0 color-mix(in srgb,var(--tc) 35%,#000)}:root:not([data-theme="light"]) .lgc-og p{background:#2E2D3D;color:#F5F1E6}:root:not([data-theme="light"]) .lgc-go{background:#F5F1E6}}
:root[data-theme="dark"] .lgc{background:linear-gradient(160deg,color-mix(in srgb,var(--tc) 70%,#22212F),color-mix(in srgb,var(--tc) 55%,#15141E));box-shadow:0 6px 0 color-mix(in srgb,var(--tc) 35%,#000)}
:root[data-theme="dark"] .lgc-og p{background:#2E2D3D;color:#F5F1E6}:root[data-theme="dark"] .lgc-go{background:#F5F1E6}

.lgc-flags{display:flex;flex-wrap:wrap;gap:12px 10px;justify-content:center}
.lgc-fl{border:0;background:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;color:inherit;font:inherit}
.lgc-fl-d{display:block;width:52px;height:36px;border-radius:9px;overflow:hidden;box-shadow:0 2px 0 rgba(0,0,0,.18),0 0 0 2px rgba(255,255,255,.7)}
.lgc-fl-d svg{width:100%;height:100%;display:block}
.lgc-fl small{font-size:.7rem;font-weight:800;opacity:.9}
.lg-t-lec{display:block;font-size:.72rem;font-weight:800;margin-top:2px;opacity:.95}

.h-hello-cl{display:block;font-family:var(--body);font-size:.78rem;font-weight:800;opacity:.75;line-height:1.2}
.h-conn-2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.h-conn-2 .btn,.h-conn>.t .h-conn-2 .btn{margin:0;width:100%;min-width:0;padding-left:6px;padding-right:6px;white-space:normal}

/* tuiles Devoirs et Contrôles : la matière en avant, deux lignes de description au plus */
.lv-h{align-items:center}
.lv-h .tx{gap:3px}
.lv-h .lv-mat{font-family:var(--display);font-size:1.14rem;line-height:1.2;color:var(--ink)}
.lv-h .lv-desc{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;font-size:.95rem;font-weight:600;line-height:1.3;color:var(--soft);overflow-wrap:anywhere}

.lv-card .j-pied{margin-top:10px}
/* Devoirs en bleu, Contrôles en vert : on sait tout de suite où on est */
.lv-card,.lv-ctl{border-color:var(--c)!important;box-shadow:0 4px 0 color-mix(in srgb,var(--c) 70%,#000)!important}
.lv-card .h-ico,.lv-ctl .h-ico{color:var(--c)}
.lv-card .ct-go:not(.alt),.lv-ctl .ct-go:not(.alt){background:var(--c)!important;color:#fff;box-shadow:0 4px 0 color-mix(in srgb,var(--c) 65%,#000)!important}
.lv-ctl .ct-go:not(.alt){color:#fff}
/* barre de titre assortie : Devoirs en bleu, Contrôles en vert */
html body .h-q.h-tete[data-k="accueil"]{background:#3E9B32!important;color:#fff}
html body .h-q.h-tete[data-k="notes"]{background:#3E9B32!important;color:#fff}
html body .h-q.h-tete[data-k="accueil"] .h-tete-t,html body .h-q.h-tete[data-k="accueil"] small{color:#fff}
html body .h-q.h-tete[data-k="notes"] .h-tete-t,html body .h-q.h-tete[data-k="notes"] small{color:#fff}
html body .h-q.h-tete[data-k="accueil"] .h-tete-i{background:rgba(255,255,255,.2);color:#fff;box-shadow:none}
html body .h-q.h-tete[data-k="notes"] .h-tete-i{background:rgba(255,255,255,.35);color:#fff;box-shadow:none}
html body .h-q.h-tete[data-k="notes"],html body .h-q.h-tete[data-k="notes"] *{color:#fff!important;-webkit-text-fill-color:#fff;text-shadow:none!important}
.lv-card .ct-go,.lv-card label.ct-go{background:var(--c)!important;border-color:var(--c)!important;color:#fff!important;box-shadow:0 4px 0 color-mix(in srgb,var(--c) 65%,#000)!important}
.lv-ctl .ct-go,.lv-ctl label.ct-go{background:var(--c)!important;border-color:var(--c)!important;color:#fff!important;box-shadow:0 4px 0 color-mix(in srgb,var(--c) 65%,#000)!important}
/* Moi (compte connecté) : l'élève en haut, les moyennes au milieu, le compte en bas, avec des marges régulières */
.lv-id{display:flex;align-items:center;gap:14px;padding:18px 16px 16px}
.lv-av{flex:none;width:64px;height:64px;border-radius:50%;overflow:hidden;background:var(--card,#fff);display:grid;place-items:center}
.lv-av svg{width:100%;height:100%}
.lv-id .tx{flex:1;min-width:0}
.lv-id h2{margin:0;font-family:var(--display);font-size:1.4rem;line-height:1.15}
.lv-id .lv-cl{display:block;margin-top:2px;font-weight:700;color:var(--soft)}
.lv-id p{margin:2px 0 0;font-size:.88rem;color:var(--soft)}
.lv-id p:empty{display:none}
html body .moi-modal>.mo-moy{width:auto;box-sizing:border-box;margin:0 16px 20px}
html body .moi-modal .lv-compte{padding:0 16px;text-align:center}
html body .moi-modal .lv-compte .btn{margin:0 0 14px}
html body .moi-modal .lv-compte .moi-legal{margin:0}
/* calendrier de Contrôles : le jour choisi et les boutons en vert */
html body .h-day[data-cday][aria-pressed="true"] .n{background:#3E9B32!important;border-color:#3E9B32!important;color:#fff!important;box-shadow:0 4px 0 color-mix(in srgb,#3E9B32 65%,#000)!important}
html body .h-day[data-cday][aria-pressed="true"]{color:#3E9B32!important}
html body #cArrows button,html body #cArrows .j-auj{color:#3E9B32!important}
html body .h-day[data-cday].today:not([aria-pressed="true"]) .n{border-color:#3E9B32!important;color:#6DBF59!important}
html body .h-tab[data-tab="notes"],html body .h-tab[data-tab="accueil"]{--tc:#3E9B32}
/* Devoirs et Contrôles : de l air entre les tuiles */
html body .ct-liste{gap:0!important}
html body .lv-card,html body .lv-ctl{margin:0 0 22px!important}
html body .lv-card .j-pied,html body .lv-ctl .ct-steps{margin-top:12px}
/* anciens contrôles : les notes aussi aérées que les autres tuiles */
html body #cPasses .n-card{margin:0 0 22px!important}
html body #cPasses .j-titre{margin:26px 0 14px!important}
html body #cPasses details{margin-top:0}
html body #cPasses summary{margin:0 0 18px}
/* notes et anciens contrôles : plus loin du bord de l écran, plus d air dans la tuile */
html body #cPasses{padding-left:8px;padding-right:8px;box-sizing:border-box}
html body #cPasses .n-card,html body #cPasses .ct-card{padding:18px 20px!important}
/* tuiles de notes : pas de fond, Grignon en sticker sur le coin */
html body .n-card,html body .n-card.bad,html body .n-card.bad.big{position:relative;background:var(--sheet)!important;border-color:var(--line)!important;box-shadow:0 3px 0 var(--line)!important}
.n-card .n-top{padding-right:46px}
.n-stick{position:absolute;top:-14px;right:-6px;width:56px;height:56px;transform:rotate(8deg);pointer-events:none;filter:drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(0 3px 4px rgba(0,0,0,.25))}
.n-stick svg{width:100%;height:100%;display:block}
html body.nav3 .wrap .h-q.h-tete:not(.moi-top *){margin-bottom:30px!important}
/* on ne gère pas les cours de la classe pour le moment : ni bloc En classe, ni mention Vu en classe */
.cz-classe,.cz-tag.vu{display:none!important}
.cz-notions li.vue .pt{display:none}
/* contrôles : le même sticker, Grignon réfléchit avant le contrôle, dort tant que la note n'est pas là */
.lv-ctl{position:relative}.lv-ctl .lv-h{padding-right:44px}
/* jour vide du calendrier */
.lv-rien{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:26px 16px 10px}.lv-rien .f{width:92px;height:92px;margin-bottom:6px}.lv-rien .f svg{width:100%;height:100%}
.lv-rien h3{margin:0;font-family:var(--display);font-size:1.3rem}.lv-rien p{margin:0 0 14px;color:var(--soft)}.lv-rien .btn{width:100%;margin:0 0 8px}
.lv-rien[data-k="dv"] .btn{background:#3E9B32;box-shadow:0 4px 0 color-mix(in srgb,#3E9B32 70%,#000);color:#fff;border-color:#3E9B32}.lv-rien[data-k="ctl"] .btn{background:var(--ogre-d);box-shadow:0 4px 0 color-mix(in srgb,var(--ogre-d) 70%,#000);color:#fff;border-color:var(--ogre-d)}
.j-vide .ct-go{margin-top:18px}.lv-rien p{margin-bottom:22px}
html body .n-card .n-moy{margin-bottom:18px}html body .n-card:has(.n-moy:last-child) .n-moy{margin-bottom:0}
html body #cPasses .ct-go,html body #cPasses label.ct-go{display:flex;align-items:center;justify-content:center;text-align:center;width:100%;box-sizing:border-box;align-self:stretch}
/* tuiles Devoirs et Contrôles : boutons sans icône, texte centré */
html body .ct-go>i{display:none!important}html body .ct-go,html body label.ct-go{display:flex;align-items:center;justify-content:center;text-align:center;width:100%;box-sizing:border-box;align-self:stretch}
.lv-notes-vide{margin:8px 0 0;padding:16px;border:2px dashed var(--line);border-radius:18px;color:var(--soft);text-align:center}
/* trois formats seulement sur un compte connecté : fiche, exos, flashcards */
body.nav3 #pOral,body.nav3 #dvOral,body.nav3 #pPlan,body.nav3 #pConv,body.nav3 #pRecit,body.nav3 .dv-gris>:nth-child(2){display:none!important}body.nav3 .dv-deux{grid-template-columns:1fr!important}

.lv-ajout{margin:14px 0 0;text-align:center}.lv-ajout .linkbtn2{min-height:44px;display:inline-flex;align-items:center;gap:6px}
.lv-inv{padding-top:14px}.lv-libre{padding:12px 14px;margin-bottom:10px}.lv-libre .tx{display:flex;flex-direction:column;gap:2px;margin-bottom:8px}.lv-libre small{color:var(--soft)}

/* Icônes SVG (dessinées en trait, prennent la couleur du texte). Générées par tools/icons.py */
[class^="gi-"],[class*=" gi-"]{display:inline-block;width:1.15em;height:1.15em;vertical-align:-.2em;flex:none;background:currentColor;-webkit-mask:var(--gi) center/contain no-repeat;mask:var(--gi) center/contain no-repeat}
:root{--gi-check:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%206%209%2017l-5-5%22/%3E%3C/svg%3E")}.gi-check{--gi:var(--gi-check)}
:root{--gi-x:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M18%206%206%2018%22/%3E%3Cpath%20d%3D%22m6%206%2012%2012%22/%3E%3C/svg%3E")}.gi-x{--gi:var(--gi-x)}
:root{--gi-mic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%202a3%203%200%200%200-3%203v7a3%203%200%200%200%206%200V5a3%203%200%200%200-3-3Z%22/%3E%3Cpath%20d%3D%22M19%2010v2a7%207%200%200%201-14%200v-2%22/%3E%3Cpath%20d%3D%22M12%2019v3%22/%3E%3C/svg%3E")}.gi-mic{--gi:var(--gi-mic)}
:root{--gi-wait:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%2022h14%22/%3E%3Cpath%20d%3D%22M5%202h14%22/%3E%3Cpath%20d%3D%22M17%2022v-4.172a2%202%200%200%200-.586-1.414L12%2012l-4.414%204.414A2%202%200%200%200%207%2017.828V22%22/%3E%3Cpath%20d%3D%22M7%202v4.172a2%202%200%200%200%20.586%201.414L12%2012l4.414-4.414A2%202%200%200%200%2017%206.172V2%22/%3E%3C/svg%3E")}.gi-wait{--gi:var(--gi-wait)}
:root{--gi-again:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2012a9%209%200%201%200%209-9%209.75%209.75%200%200%200-6.74%202.74L3%208%22/%3E%3Cpath%20d%3D%22M3%203v5h5%22/%3E%3C/svg%3E")}.gi-again{--gi:var(--gi-again)}
:root{--gi-sync:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2012a9%209%200%200%201%209-9%209.75%209.75%200%200%201%206.74%202.74L21%208%22/%3E%3Cpath%20d%3D%22M21%203v5h-5%22/%3E%3Cpath%20d%3D%22M21%2012a9%209%200%200%201-9%209%209.75%209.75%200%200%201-6.74-2.74L3%2016%22/%3E%3Cpath%20d%3D%22M8%2016H3v5%22/%3E%3C/svg%3E")}.gi-sync{--gi:var(--gi-sync)}
:root{--gi-cam:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14.5%204h-5L7%207H4a2%202%200%200%200-2%202v9a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2V9a2%202%200%200%200-2-2h-3l-2.5-3z%22/%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2213%22%20r%3D%223%22/%3E%3C/svg%3E")}.gi-cam{--gi:var(--gi-cam)}
:root{--gi-chat:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M7.9%2020A9%209%200%201%200%204%2016.1L2%2022Z%22/%3E%3C/svg%3E")}.gi-chat{--gi:var(--gi-chat)}
:root{--gi-son:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M11%204.7a.7.7%200%200%200-1.2-.5L6.4%207.6A1.4%201.4%200%200%201%205.4%208H3a1%201%200%200%200-1%201v6a1%201%200%200%200%201%201h2.4a1.4%201.4%200%200%201%201%20.4l3.4%203.4a.7.7%200%200%200%201.2-.5z%22/%3E%3Cpath%20d%3D%22M16%209a5%205%200%200%201%200%206%22/%3E%3Cpath%20d%3D%22M19.4%2018.4a9%209%200%200%200%200-12.8%22/%3E%3C/svg%3E")}.gi-son{--gi:var(--gi-son)}
:root{--gi-casque:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2014h3a2%202%200%200%201%202%202v3a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2v-7a9%209%200%200%201%2018%200v7a2%202%200%200%201-2%202h-1a2%202%200%200%201-2-2v-3a2%202%200%200%201%202-2h3%22/%3E%3C/svg%3E")}.gi-casque{--gi:var(--gi-casque)}
:root{--gi-cible:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22/%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%226%22/%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222%22/%3E%3C/svg%3E")}.gi-cible{--gi:var(--gi-cible)}
:root{--gi-cal:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%202v4%22/%3E%3Cpath%20d%3D%22M16%202v4%22/%3E%3Crect%20width%3D%2218%22%20height%3D%2218%22%20x%3D%223%22%20y%3D%224%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M3%2010h18%22/%3E%3C/svg%3E")}.gi-cal{--gi:var(--gi-cal)}
:root{--gi-livre:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%207v14%22/%3E%3Cpath%20d%3D%22M3%2018a1%201%200%200%201-1-1V4a1%201%200%200%201%201-1h5a4%204%200%200%201%204%204%204%204%200%200%201%204-4h5a1%201%200%200%201%201%201v13a1%201%200%200%201-1%201h-6a3%203%200%200%200-3%203%203%203%200%200%200-3-3z%22/%3E%3C/svg%3E")}.gi-livre{--gi:var(--gi-livre)}
:root{--gi-livres:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m16%206%204%2014%22/%3E%3Cpath%20d%3D%22M12%206v14%22/%3E%3Cpath%20d%3D%22M8%208v12%22/%3E%3Cpath%20d%3D%22M4%204v16%22/%3E%3C/svg%3E")}.gi-livres{--gi:var(--gi-livres)}
:root{--gi-puzzle:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M19.4%207.9c0%20.3.1.6.3.9l1.6%201.5c.5.5.7%201.1.7%201.7s-.2%201.2-.7%201.7l-1.6%201.6a1%201%200%200%201-.8.3c-.5-.1-.8-.5-1-.9a2.5%202.5%200%201%200-3.2%203.2c.4.2.9.5.9%201a1%201%200%200%201-.3.8l-1.6%201.6a2.4%202.4%200%200%201-3.4%200l-1.6-1.6a1%201%200%200%200-.9-.3c-.5.1-.8.5-1%201a2.5%202.5%200%201%201-3.2-3.2c.5-.2.9-.5%201-1a1%201%200%200%200-.3-.9L2.7%2013.7a2.4%202.4%200%200%201%200-3.4l1.5-1.5c.2-.3.6-.4.9-.3.5.1.9.5%201.1%201a2.5%202.5%200%201%200%203.3-3.3c-.5-.2-.9-.6-1-1.1%200-.3.1-.7.3-.9l1.5-1.5a2.4%202.4%200%200%201%203.4%200l1.6%201.6c.2.2.6.3.9.3.5-.1.8-.5%201-1a2.5%202.5%200%201%201%203.2%203.2c-.5.2-.9.5-1%201Z%22/%3E%3C/svg%3E")}.gi-puzzle{--gi:var(--gi-puzzle)}
:root{--gi-eclat:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9.9%2015.5A2%202%200%200%200%208.5%2014l-6.1-1.6a.5.5%200%200%201%200-1L8.5%2010A2%202%200%200%200%209.9%208.5l1.6-6.1a.5.5%200%200%201%201%200L14%208.5a2%202%200%200%200%201.5%201.4l6.1%201.6a.5.5%200%200%201%200%201L15.5%2014a2%202%200%200%200-1.4%201.5l-1.6%206.1a.5.5%200%200%201-1%200z%22/%3E%3C/svg%3E")}.gi-eclat{--gi:var(--gi-eclat)}
:root{--gi-miam:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%202v7c0%201.1.9%202%202%202h4a2%202%200%200%200%202-2V2%22/%3E%3Cpath%20d%3D%22M7%202v20%22/%3E%3Cpath%20d%3D%22M21%2015V2a5%205%200%200%200-5%205v6c0%201.1.9%202%202%202h3Zm0%200v7%22/%3E%3C/svg%3E")}.gi-miam{--gi:var(--gi-miam)}
:root{--gi-lien:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M10%2013a5%205%200%200%200%207.54.54l3-3a5%205%200%200%200-7.07-7.07l-1.72%201.71%22/%3E%3Cpath%20d%3D%22M14%2011a5%205%200%200%200-7.54-.54l-3%203a5%205%200%200%200%207.07%207.07l1.71-1.71%22/%3E%3C/svg%3E")}.gi-lien{--gi:var(--gi-lien)}
:root{--gi-cadenas:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20width%3D%2218%22%20height%3D%2211%22%20x%3D%223%22%20y%3D%2211%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M7%2011V7a5%205%200%200%201%2010%200v4%22/%3E%3C/svg%3E")}.gi-cadenas{--gi:var(--gi-cadenas)}
:root{--gi-etoile:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M11.5%202.3a.5.5%200%200%201%201%200l2.3%204.7a2.1%202.1%200%200%200%201.6%201.2l5.2.7a.5.5%200%200%201%20.3.9l-3.7%203.7a2.1%202.1%200%200%200-.6%201.9l.9%205.1a.5.5%200%200%201-.8.6l-4.6-2.4a2.1%202.1%200%200%200-2%200L6.4%2021a.5.5%200%200%201-.8-.6l.9-5.1a2.1%202.1%200%200%200-.6-1.9L2.2%209.8a.5.5%200%200%201%20.3-.9l5.1-.8A2.1%202.1%200%200%200%209.2%207z%22/%3E%3C/svg%3E")}.gi-etoile{--gi:var(--gi-etoile)}
:root{--gi-loupe:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%228%22/%3E%3Cpath%20d%3D%22m21%2021-4.3-4.3%22/%3E%3C/svg%3E")}.gi-loupe{--gi:var(--gi-loupe)}
:root{--gi-idee:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M15%2014c.2-1%20.7-1.7%201.5-2.5%201-.9%201.5-2.2%201.5-3.5A6%206%200%200%200%206%208c0%201%20.2%202.2%201.5%203.5.7.7%201.3%201.5%201.5%202.5%22/%3E%3Cpath%20d%3D%22M9%2018h6%22/%3E%3Cpath%20d%3D%22M10%2022h4%22/%3E%3C/svg%3E")}.gi-idee{--gi:var(--gi-idee)}
:root{--gi-reveil:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2213%22%20r%3D%228%22/%3E%3Cpath%20d%3D%22M12%209v4l2%202%22/%3E%3Cpath%20d%3D%22M5%203%202%206%22/%3E%3Cpath%20d%3D%22m22%206-3-3%22/%3E%3C/svg%3E")}.gi-reveil{--gi:var(--gi-reveil)}
:root{--gi-coupe:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%209H4.5a2.5%202.5%200%200%201%200-5H6%22/%3E%3Cpath%20d%3D%22M18%209h1.5a2.5%202.5%200%200%200%200-5H18%22/%3E%3Cpath%20d%3D%22M4%2022h16%22/%3E%3Cpath%20d%3D%22M10%2014.7V17c0%20.6-.5%201-1%201.2C7.9%2018.8%207%2020.2%207%2022%22/%3E%3Cpath%20d%3D%22M14%2014.7V17c0%20.6.5%201%201%201.2%201.1.6%202%202%202%203.8%22/%3E%3Cpath%20d%3D%22M18%202H6v7a6%206%200%200%200%2012%200V2Z%22/%3E%3C/svg%3E")}.gi-coupe{--gi:var(--gi-coupe)}
:root{--gi-fete:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5.8%2011.3%202%2022l10.7-3.8%22/%3E%3Cpath%20d%3D%22M4%203h.01%22/%3E%3Cpath%20d%3D%22M22%208h.01%22/%3E%3Cpath%20d%3D%22M15%202h.01%22/%3E%3Cpath%20d%3D%22M22%2020h.01%22/%3E%3Cpath%20d%3D%22m22%202-2.2.8a2.9%202.9%200%200%200-2%203.1c.1.9-.6%201.6-1.5%201.6h-.4c-.9%200-1.6.6-1.8%201.4L14%2010%22/%3E%3Cpath%20d%3D%22m22%2013-.8-.3c-.9-.3-1.8.2-2%201.1-.1.7-.7%201.2-1.4%201.2H17%22/%3E%3Cpath%20d%3D%22m11%202%20.3.8c.3.9-.2%201.8-1.1%202C9.5%204.9%209%205.5%209%206.2V7%22/%3E%3Cpath%20d%3D%22M11%2013c1.9%201.9%202.8%204.2%202%205-.8.8-3.1-.1-5-2-1.9-1.9-2.8-4.2-2-5%20.8-.8%203.1.1%205%202Z%22/%3E%3C/svg%3E")}.gi-fete{--gi:var(--gi-fete)}
:root{--gi-duo:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M16%2021v-2a4%204%200%200%200-4-4H6a4%204%200%200%200-4%204v2%22/%3E%3Ccircle%20cx%3D%229%22%20cy%3D%227%22%20r%3D%224%22/%3E%3Cpath%20d%3D%22M22%2021v-2a4%204%200%200%200-3-3.9%22/%3E%3Cpath%20d%3D%22M16%203.1a4%204%200%200%201%200%207.8%22/%3E%3C/svg%3E")}.gi-duo{--gi:var(--gi-duo)}
:root{--gi-trombone:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m21.4%2011-9.2%209.2a6%206%200%200%201-8.5-8.5l8.6-8.6A4%204%200%201%201%2018%208.8l-8.6%208.6a2%202%200%200%201-2.8-2.8l8.5-8.5%22/%3E%3C/svg%3E")}.gi-trombone{--gi:var(--gi-trombone)}
:root{--gi-monte:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M7%207h10v10%22/%3E%3Cpath%20d%3D%22M7%2017%2017%207%22/%3E%3C/svg%3E")}.gi-monte{--gi:var(--gi-monte)}
:root{--gi-alerte:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m21.7%2018-8-14a2%202%200%200%200-3.5%200l-8%2014A2%202%200%200%200%204%2021h16a2%202%200%200%200%201.7-3%22/%3E%3Cpath%20d%3D%22M12%209v4%22/%3E%3Cpath%20d%3D%22M12%2017h.01%22/%3E%3C/svg%3E")}.gi-alerte{--gi:var(--gi-alerte)}
:root{--gi-doc:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M15%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V7Z%22/%3E%3Cpath%20d%3D%22M14%202v4a2%202%200%200%200%202%202h4%22/%3E%3C/svg%3E")}.gi-doc{--gi:var(--gi-doc)}
:root{--gi-lune:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203a6%206%200%200%200%209%209%209%209%200%201%201-9-9Z%22/%3E%3C/svg%3E")}.gi-lune{--gi:var(--gi-lune)}
:root{--gi-haut:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m5%2012%207-7%207%207%22/%3E%3Cpath%20d%3D%22M12%2019V5%22/%3E%3C/svg%3E")}.gi-haut{--gi:var(--gi-haut)}
:root{--gi-sortie:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%2021H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h4%22/%3E%3Cpath%20d%3D%22m16%2017%205-5-5-5%22/%3E%3Cpath%20d%3D%22M21%2012H9%22/%3E%3C/svg%3E")}.gi-sortie{--gi:var(--gi-sortie)}
:root{--gi-clavier:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20width%3D%2220%22%20height%3D%2216%22%20x%3D%222%22%20y%3D%224%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M6%208h.01%22/%3E%3Cpath%20d%3D%22M10%208h.01%22/%3E%3Cpath%20d%3D%22M14%208h.01%22/%3E%3Cpath%20d%3D%22M18%208h.01%22/%3E%3Cpath%20d%3D%22M8%2012h.01%22/%3E%3Cpath%20d%3D%22M12%2012h.01%22/%3E%3Cpath%20d%3D%22M16%2012h.01%22/%3E%3Cpath%20d%3D%22M7%2016h10%22/%3E%3C/svg%3E")}.gi-clavier{--gi:var(--gi-clavier)}
:root{--gi-agrandir:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M15%203h6v6%22/%3E%3Cpath%20d%3D%22M9%2021H3v-6%22/%3E%3Cpath%20d%3D%22m21%203-7%207%22/%3E%3Cpath%20d%3D%22m3%2021%207-7%22/%3E%3C/svg%3E")}.gi-agrandir{--gi:var(--gi-agrandir)}
:root{--gi-bas:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m6%209%206%206%206-6%22/%3E%3C/svg%3E")}.gi-bas{--gi:var(--gi-bas)}
:root{--gi-droite:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m9%2018%206-6-6-6%22/%3E%3C/svg%3E")}.gi-droite{--gi:var(--gi-droite)}
:root{--gi-gauche:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m15%2018-6-6%206-6%22/%3E%3C/svg%3E")}.gi-gauche{--gi:var(--gi-gauche)}
:root{--gi-plus:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%2012h14%22/%3E%3Cpath%20d%3D%22M12%205v14%22/%3E%3C/svg%3E")}.gi-plus{--gi:var(--gi-plus)}
:root{--gi-points:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%221%22/%3E%3Ccircle%20cx%3D%2219%22%20cy%3D%2212%22%20r%3D%221%22/%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2212%22%20r%3D%221%22/%3E%3C/svg%3E")}.gi-points{--gi:var(--gi-points)}
:root{--gi-replie:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m18%2015-6-6-6%206%22/%3E%3C/svg%3E")}.gi-replie{--gi:var(--gi-replie)}
:root{--gi-crayon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21.2%206.8a1%201%200%200%200-4-4L3.8%2016.2a2%202%200%200%200-.5.8L2%2021.4a.5.5%200%200%200%20.6.6l4.4-1.3a2%202%200%200%200%20.8-.5z%22/%3E%3Cpath%20d%3D%22m15%205%204%204%22/%3E%3C/svg%3E")}.gi-crayon{--gi:var(--gi-crayon)}
:root{--gi-courbe:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M22%207%2013.5%2015.5%208.5%2010.5%202%2017%22/%3E%3Cpath%20d%3D%22M16%207h6v6%22/%3E%3C/svg%3E")}.gi-courbe{--gi:var(--gi-courbe)}
:root{--gi-pause:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%226%22%20y%3D%224%22%20width%3D%224%22%20height%3D%2216%22%20rx%3D%221%22/%3E%3Crect%20x%3D%2214%22%20y%3D%224%22%20width%3D%224%22%20height%3D%2216%22%20rx%3D%221%22/%3E%3C/svg%3E")}.gi-pause{--gi:var(--gi-pause)}
:root{--gi-play:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%203%2020%2012%206%2021Z%22/%3E%3C/svg%3E")}.gi-play{--gi:var(--gi-play)}
:root{--gi-stop:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20width%3D%2214%22%20height%3D%2214%22%20x%3D%225%22%20y%3D%225%22%20rx%3D%222%22/%3E%3C/svg%3E")}.gi-stop{--gi:var(--gi-stop)}
:root{--gi-rond:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22/%3E%3C/svg%3E")}.gi-rond{--gi:var(--gi-rond)}
:root{--gi-calc:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20width%3D%2216%22%20height%3D%2220%22%20x%3D%224%22%20y%3D%222%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M8%206h8%22/%3E%3Cpath%20d%3D%22M16%2014v4%22/%3E%3Cpath%20d%3D%22M16%2010h.01%22/%3E%3Cpath%20d%3D%22M12%2010h.01%22/%3E%3Cpath%20d%3D%22M8%2010h.01%22/%3E%3Cpath%20d%3D%22M12%2014h.01%22/%3E%3Cpath%20d%3D%22M8%2014h.01%22/%3E%3Cpath%20d%3D%22M12%2018h.01%22/%3E%3Cpath%20d%3D%22M8%2018h.01%22/%3E%3C/svg%3E")}.gi-calc{--gi:var(--gi-calc)}
:root{--gi-temple:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2022h18%22/%3E%3Cpath%20d%3D%22M6%2018v-7%22/%3E%3Cpath%20d%3D%22M10%2018v-7%22/%3E%3Cpath%20d%3D%22M14%2018v-7%22/%3E%3Cpath%20d%3D%22M18%2018v-7%22/%3E%3Cpath%20d%3D%22M12%202%2020%207H4Z%22/%3E%3C/svg%3E")}.gi-temple{--gi:var(--gi-temple)}
:root{--gi-feuille:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M11%2020A7%207%200%200%201%209.8%206.1C15.5%205%2017%204.5%2019%202c1%202%202%204.2%202%208%200%205.5-4.8%2010-10%2010Z%22/%3E%3Cpath%20d%3D%22M2%2021c0-3%201.9-5.4%205.1-6C9.5%2014.5%2012%2013%2013%2012%22/%3E%3C/svg%3E")}.gi-feuille{--gi:var(--gi-feuille)}
:root{--gi-fiole:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M10%202v7.5a2%202%200%200%201-.2.9L4.7%2020.6a1%201%200%200%200%20.9%201.4h12.8a1%201%200%200%200%20.9-1.4l-5.1-10.2a2%202%200%200%201-.2-.9V2%22/%3E%3Cpath%20d%3D%22M8.5%202h7%22/%3E%3Cpath%20d%3D%22M7%2016h10%22/%3E%3C/svg%3E")}.gi-fiole{--gi:var(--gi-fiole)}
:root{--gi-globe:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22/%3E%3Cpath%20d%3D%22M12%202a14.5%2014.5%200%200%200%200%2020%2014.5%2014.5%200%200%200%200-20%22/%3E%3Cpath%20d%3D%22M2%2012h20%22/%3E%3C/svg%3E")}.gi-globe{--gi:var(--gi-globe)}
:root{--gi-sport:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M22%2012h-2.5a2%202%200%200%200-1.9%201.5l-2.4%208.3a.3.3%200%200%201-.5%200L9.2%202.2a.3.3%200%200%200-.5%200l-2.3%208.3A2%202%200%200%201%204.5%2012H2%22/%3E%3C/svg%3E")}.gi-sport{--gi:var(--gi-sport)}
:root{--gi-note:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%2018V5l12-2v13%22/%3E%3Ccircle%20cx%3D%226%22%20cy%3D%2218%22%20r%3D%223%22/%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2216%22%20r%3D%223%22/%3E%3C/svg%3E")}.gi-note{--gi:var(--gi-note)}
:root{--gi-palette:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%202C6.5%202%202%206.5%202%2012s4.5%2010%2010%2010c.9%200%201.6-.7%201.6-1.7%200-.4-.2-.8-.4-1.1-.3-.3-.4-.7-.4-1.1a1.6%201.6%200%200%201%201.7-1.7h2c3%200%205.5-2.5%205.5-5.5C22%206%2017.5%202%2012%202z%22/%3E%3Ccircle%20cx%3D%2213.5%22%20cy%3D%226.5%22%20r%3D%221%22/%3E%3Ccircle%20cx%3D%2217.5%22%20cy%3D%2210.5%22%20r%3D%221%22/%3E%3Ccircle%20cx%3D%228.5%22%20cy%3D%227.5%22%20r%3D%221%22/%3E%3Ccircle%20cx%3D%226.5%22%20cy%3D%2212.5%22%20r%3D%221%22/%3E%3C/svg%3E")}.gi-palette{--gi:var(--gi-palette)}
:root{--gi-engrenage:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228%22/%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%222%22/%3E%3Cpath%20d%3D%22M12%202v2%22/%3E%3Cpath%20d%3D%22M12%2022v-2%22/%3E%3Cpath%20d%3D%22m17%2020.7-1-1.7%22/%3E%3Cpath%20d%3D%22M11%2010.3%207%203.3%22/%3E%3Cpath%20d%3D%22m20.7%2017-1.7-1%22/%3E%3Cpath%20d%3D%22m3.3%207%201.7%201%22/%3E%3Cpath%20d%3D%22M14%2012h8%22/%3E%3Cpath%20d%3D%22M2%2012h2%22/%3E%3Cpath%20d%3D%22m20.7%207-1.7%201%22/%3E%3Cpath%20d%3D%22m3.3%2017%201.7-1%22/%3E%3Cpath%20d%3D%22m17%203.3-1%201.7%22/%3E%3Cpath%20d%3D%22m11%2013.7-4%207%22/%3E%3C/svg%3E")}.gi-engrenage{--gi:var(--gi-engrenage)}
:root{--gi-vagues:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M2%206c.6.5%201.2%201%202.5%201C7%207%207%205%209.5%205c2.6%200%202.4%202%205%202%202.5%200%202.5-2%205-2%201.3%200%201.9.5%202.5%201%22/%3E%3Cpath%20d%3D%22M2%2012c.6.5%201.2%201%202.5%201%202.5%200%202.5-2%205-2%202.6%200%202.4%202%205%202%202.5%200%202.5-2%205-2%201.3%200%201.9.5%202.5%201%22/%3E%3Cpath%20d%3D%22M2%2018c.6.5%201.2%201%202.5%201%202.5%200%202.5-2%205-2%202.6%200%202.4%202%205%202%202.5%200%202.5-2%205-2%201.3%200%201.9.5%202.5%201%22/%3E%3C/svg%3E")}.gi-vagues{--gi:var(--gi-vagues)}
:root{--gi-balance:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m16%2016%203-8%203%208c-.9.6-1.9%201-3%201s-2.1-.4-3-1Z%22/%3E%3Cpath%20d%3D%22m2%2016%203-8%203%208c-.9.6-1.9%201-3%201s-2.1-.4-3-1Z%22/%3E%3Cpath%20d%3D%22M7%2021h10%22/%3E%3Cpath%20d%3D%22M12%203v18%22/%3E%3Cpath%20d%3D%22M3%207h2c2%200%205-1%207-2%202%201%205%202%207%202h2%22/%3E%3C/svg%3E")}.gi-balance{--gi:var(--gi-balance)}
:root{--gi-carte:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14.1%205.6a2%202%200%200%200%201.8%200l3.7-1.8a1%201%200%200%201%201.4.9v12.7a1%201%200%200%201-.6.9l-4.5%202.3a2%202%200%200%201-1.8%200l-4.2-2.1a2%202%200%200%200-1.8%200l-3.7%201.8A1%201%200%200%201%203%2019.4V6.6a1%201%200%200%201%20.6-.9l4.5-2.3a2%202%200%200%201%201.8%200z%22/%3E%3Cpath%20d%3D%22M15%205.8v15%22/%3E%3Cpath%20d%3D%22M9%203.2v15%22/%3E%3C/svg%3E")}.gi-carte{--gi:var(--gi-carte)}
:root{--gi-filtre:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%205h18%22/%3E%3Cpath%20d%3D%22M6%2012h12%22/%3E%3Cpath%20d%3D%22M10%2019h4%22/%3E%3C/svg%3E")}.gi-filtre{--gi:var(--gi-filtre)}
:root{--gi-send:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14.5%2021.7a.5.5%200%200%200%20.9%200l6.5-19a.5.5%200%200%200-.6-.6l-19%206.5a.5.5%200%200%200%200%20.9l7.9%203.2a2%202%200%200%201%201.1%201.1z%22/%3E%3Cpath%20d%3D%22m21.9%202.1-11%2011%22/%3E%3C/svg%3E")}.gi-send{--gi:var(--gi-send)}
:root{--gi-importer:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203v12%22/%3E%3Cpath%20d%3D%22m8%2011%204%204%204-4%22/%3E%3Cpath%20d%3D%22M8%205H4a2%202%200%200%200-2%202v10a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2V7a2%202%200%200%200-2-2h-4%22/%3E%3C/svg%3E")}.gi-importer{--gi:var(--gi-importer)}
:root{--gi-poubelle:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%206h18%22/%3E%3Cpath%20d%3D%22M19%206v14a2%202%200%200%201-2%202H7a2%202%200%200%201-2-2V6%22/%3E%3Cpath%20d%3D%22M8%206V4a2%202%200%200%201%202-2h4a2%202%200%200%201%202%202v2%22/%3E%3Cpath%20d%3D%22M10%2011v6%22/%3E%3Cpath%20d%3D%22M14%2011v6%22/%3E%3C/svg%3E")}.gi-poubelle{--gi:var(--gi-poubelle)}
:root{--gi-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22/%3E%3Ccircle%20cx%3D%229%22%20cy%3D%229%22%20r%3D%222%22/%3E%3Cpath%20d%3D%22m21%2015-3.1-3.1a2%202%200%200%200-2.8%200L6%2021%22/%3E%3C/svg%3E")}.gi-image{--gi:var(--gi-image)}
:root{--gi-langues:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m5%208%206%206%22/%3E%3Cpath%20d%3D%22m4%2014%206-6%202-3%22/%3E%3Cpath%20d%3D%22M2%205h12%22/%3E%3Cpath%20d%3D%22M7%202h1%22/%3E%3Cpath%20d%3D%22m22%2022-5-10-5%2010%22/%3E%3Cpath%20d%3D%22M14%2018h6%22/%3E%3C/svg%3E")}.gi-langues{--gi:var(--gi-langues)}
:root{--gi-onde:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M2%2010v3%22/%3E%3Cpath%20d%3D%22M6%206v11%22/%3E%3Cpath%20d%3D%22M10%203v18%22/%3E%3Cpath%20d%3D%22M14%208v7%22/%3E%3Cpath%20d%3D%22M18%205v13%22/%3E%3Cpath%20d%3D%22M22%2010v3%22/%3E%3C/svg%3E")}.gi-onde{--gi:var(--gi-onde)}
:root{--gi-drapeau:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2015s1-1%204-1%205%202%208%202%204-1%204-1V3s-1%201-4%201-5-2-8-2-4%201-4%201z%22/%3E%3Cpath%20d%3D%22M4%2022v-7%22/%3E%3C/svg%3E")}.gi-drapeau{--gi:var(--gi-drapeau)}

:root{--gi-cadenas-fort:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22black%22%20stroke-width=%223%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Crect%20width=%2218%22%20height=%2211%22%20x=%223%22%20y=%2211%22%20rx=%222%22/%3E%3Cpath%20d=%22M7%2011V7a5%205%200%200%201%2010%200v4%22/%3E%3C/svg%3E");--gi-cadenas-ouvert:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22black%22%20stroke-width=%223%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Crect%20width=%2218%22%20height=%2211%22%20x=%223%22%20y=%2211%22%20rx=%222%22/%3E%3Cpath%20d=%22M7%2011V7a5%205%200%200%201%209.9-1%22/%3E%3C/svg%3E")}.gi-cadenas-fort{--gi:var(--gi-cadenas-fort)}.gi-cadenas-ouvert{--gi:var(--gi-cadenas-ouvert)}
:root{--gi-corrige:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20width%3D%228%22%20height%3D%224%22%20x%3D%228%22%20y%3D%222%22%20rx%3D%221%22/%3E%3Cpath%20d%3D%22M16%204h2a2%202%200%200%201%202%202v14a2%202%200%200%201-2%202H6a2%202%200%200%201-2-2V6a2%202%200%200%201%202-2h2%22/%3E%3Cpath%20d%3D%22m9%2014%202%202%204-4%22/%3E%3C/svg%3E")}.gi-corrige{--gi:var(--gi-corrige)}
:root{--gi-visio:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m16%2013%205.223%203.482a.5.5%200%200%200%20.777-.416V7.87a.5.5%200%200%200-.752-.432L16%2010.5%22/%3E%3Crect%20x%3D%222%22%20y%3D%226%22%20width%3D%2214%22%20height%3D%2212%22%20rx%3D%222%22/%3E%3C/svg%3E")}.gi-visio{--gi:var(--gi-visio)}

/* Ogrelo · « Me situer » (situer.js) : carte calme, aérée, vert Ogrelo seulement ; jamais de rouge ici (ce n'est pas un point faible). */
.si-carte{margin:6px 0 22px;padding:16px 14px;border:2px solid var(--line);border-radius:18px;background:var(--card);display:flex;flex-direction:column;gap:14px}
.si-carte.si-res{margin:16px 0 4px}
.si-eye{margin:0;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ogre-d,var(--ink))}
.si-say{margin:0}
.si-say .g-say-face .ogre{width:52px;height:52px}
.si-say .g-say-b p{font-size:.98rem;line-height:1.45}
.si-ronds{display:flex;gap:6px;flex-wrap:wrap;padding-left:2px}
.si-ronds i{width:14px;height:14px;border-radius:50%;background:var(--paper,var(--line));border:2px solid var(--line)}
.si-ronds i.on{background:var(--ogre);border-color:var(--ogre)}
.si-astuce{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:14px;background:color-mix(in srgb,var(--ogre) 10%,var(--card))}
.si-astuce>i{flex:none;font-size:1.2rem;margin-top:2px}
.si-astuce>span{display:flex;flex-direction:column;gap:6px;min-width:0}
.si-astuce b{font-size:.92rem;line-height:1.35}
.si-q{display:block;font-size:.95rem;line-height:1.45;padding:8px 10px;border-radius:10px;background:var(--card);overflow-wrap:anywhere}
.si-astuce small,.si-l small{color:var(--soft);font-size:.82rem;line-height:1.35}
.si-note{margin:0;color:var(--soft);font-size:.78rem;line-height:1.4;display:flex;gap:6px;align-items:flex-start}
.si-note i{flex:none;margin-top:2px}
.si-seance{display:flex;flex-direction:column;gap:10px}
.si-l{display:flex;gap:12px;align-items:flex-start}
.si-l>i{flex:none;font-size:1.15rem;margin-top:2px}
.si-l>span{display:flex;flex-direction:column;gap:3px;min-width:0;line-height:1.4}
.si-barre{display:block;height:8px;border-radius:999px;background:var(--paper,var(--line));overflow:hidden}
.si-barre i{display:block;height:100%;border-radius:inherit;background:var(--ogre);transition:width .4s}
.si-choix{margin-top:2px}
.si-lien{align-self:flex-start;border:0;background:none;padding:6px 0;color:var(--soft);font:inherit;font-size:.84rem;font-weight:700;text-decoration:underline;cursor:pointer}
.si-moi{display:flex;flex-direction:column;gap:14px}
.si-moi h3{margin:0}
.si-ligne span{font-size:.96rem}

/* Commun élève / parent : feuille « rapport prêt » et bandeau du mode démo */
.pdf-sheet{position:fixed;inset:0;z-index:300;background:rgba(20,24,20,.45);display:flex;align-items:flex-end;justify-content:center}
.pdf-in{background:#fff;color:#22261F;width:min(520px,100%);border-radius:22px 22px 0 0;padding:22px 18px calc(18px + env(safe-area-inset-bottom,0px));display:grid;gap:10px;text-align:center}
.pdf-in p{margin:0;color:#5d6559;font-size:.9rem;word-break:break-all}.pdf-in .btn{margin:0;text-decoration:none;display:block;text-align:center}
.pdf-x{border:0;background:none;color:#5d6559;font-weight:700;padding:8px;cursor:pointer}
/* bandeau démo : fin, rouge, une seule ligne */
.demo-bar{position:fixed;top:0;left:0;right:0;height:34px;box-sizing:border-box;padding-top:env(safe-area-inset-top);z-index:60;display:flex;align-items:center;gap:8px;background:#C8413B;color:#fff;padding:5px 10px 5px 14px;font-size:.8rem;line-height:1.2;white-space:nowrap;box-shadow:0 1px 6px rgba(120,20,20,.25)}
.demo-bar>span:first-child{overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.demo-bar>span:first-child::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#fff;margin-right:7px;vertical-align:1px;animation:demoPoint 1.6s ease-in-out infinite}
.demo-bar button{border:0;border-radius:999px;font:inherit;font-weight:800;padding:5px 11px;cursor:pointer;flex:none}
#dVis{background:#fff;color:#B3332D;animation:demoPulse 1.8s ease-out infinite}
#dQuit{background:rgba(255,255,255,.16);color:#fff}
@keyframes demoPulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.75)}70%{box-shadow:0 0 0 9px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
@keyframes demoPoint{50%{opacity:.35}}
@media (prefers-reduced-motion: reduce){#dVis,.demo-bar>span:first-child::before{animation:none}}
.rap{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}

.demo-act{display:flex;gap:6px;flex:none}
/* visite guidée (visite.js) : une bulle, la tête d'Ogrelo, une idée ; l'élément montré est mis en lumière */
.vg{position:fixed;inset:0;z-index:400;--vg-bg:#FFFFFF;--vg-ink:#22261F;--vg-soft:#5D6559;--vg-pt:#D9D3C4;--vg-vert:#3E7F31;--vg-ring:#8FD16A}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .vg{--vg-bg:#2A2938;--vg-ink:#F5F1E6;--vg-soft:#C9C4D6;--vg-pt:#4A4860;--vg-vert:#5BA84A}}
:root[data-theme="dark"] .vg{--vg-bg:#2A2938;--vg-ink:#F5F1E6;--vg-soft:#C9C4D6;--vg-pt:#4A4860;--vg-vert:#5BA84A}
.vg-spot{position:fixed;border-radius:14px;box-shadow:0 0 0 9999px rgba(12,16,12,.62);outline:3px solid var(--vg-ring);transition:all .3s ease;pointer-events:none}
.vg.vg-centre .vg-spot{box-shadow:0 0 0 9999px rgba(12,16,12,.62);outline:0}
.vg-bulle{position:fixed;box-sizing:border-box;background:var(--vg-bg);color:var(--vg-ink);border-radius:20px;padding:14px 14px 12px;box-shadow:0 12px 30px rgba(0,0,0,.32);transition:top .3s ease,bottom .3s ease;max-height:calc(100vh - 24px);overflow:auto}
.vg-fl{position:absolute;width:14px;height:14px;background:var(--vg-bg);transform:rotate(45deg);margin-left:-7px}.vg-fl.haut{top:-6px}.vg-fl.bas{bottom:-6px}.vg-fl[hidden]{display:none}
.vg-haut{display:flex;gap:12px;align-items:flex-start;padding-right:30px}
.vg-tete{flex:none;width:44px;height:44px}.vg-tete svg{width:44px;height:44px}
.vg-centre .vg-haut{flex-direction:column;align-items:center;text-align:center;padding:4px 18px 0}
.vg-centre .vg-tete,.vg-centre .vg-tete svg{width:84px;height:84px}
.vg-txt{margin:0;line-height:1.42;font-size:1rem;overflow-wrap:anywhere}
.vg-centre .vg-txt{font-size:1.05rem}
.vg-x{position:absolute;top:6px;right:6px;width:36px;height:36px;border:0;border-radius:50%;background:none;color:var(--vg-soft);display:grid;place-items:center;cursor:pointer;font-size:1.05rem}
.vg-bas{display:flex;align-items:center;gap:8px;margin-top:12px}
.vg-pts{display:flex;gap:5px;margin-right:auto}.vg-pts i{width:7px;height:7px;border-radius:50%;background:var(--vg-pt)}.vg-pts i.vu{background:var(--vg-vert);opacity:.45}.vg-pts i.on{width:18px;border-radius:4px;background:var(--vg-vert)}
.vg-passer{border:0;background:none;color:var(--vg-soft);font:inherit;font-size:.88rem;font-weight:700;padding:8px 4px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.vg-passer[hidden],.vg-ret[hidden]{display:none}
.vg-nav{display:flex;gap:8px;margin-top:8px}
.vg-ret{flex:none;display:inline-flex;align-items:center;gap:4px;border:2px solid var(--vg-pt);background:none;color:var(--vg-ink);font:inherit;font-weight:800;font-size:.95rem;border-radius:999px;padding:9px 14px;cursor:pointer}
.vg-suiv{flex:1;min-width:0;border:0;background:var(--vg-vert);color:#fff;font:inherit;font-weight:800;font-size:1rem;border-radius:999px;padding:11px 16px;cursor:pointer}
.vg button:focus-visible{outline:2px solid var(--vg-ink);outline-offset:2px}
.vg-ann{position:fixed;border-radius:14px;outline:3px solid var(--vg-ring);background:rgba(255,255,255,.14);pointer-events:none;transition:all .3s ease}.vg-ann[hidden]{display:none}
@media (prefers-reduced-motion: reduce){.vg-spot,.vg-bulle,.vg-ann{transition:none}}
@media (max-width:430px){.dm-x{display:none}}
body:has(.demo-bar){padding-top:34px}
/* tout ce qu'on fait défiler vers le haut s'arrête sous le bandeau démo, jamais dessous */
html:has(.demo-bar){scroll-padding-top:46px}
/* pas de barre de défilement visible (la page et les zones internes défilent toujours au doigt, à la molette et au clavier) */
html,body,.g-body,.cm,.exo-full,.h-week,.h-chips{scrollbar-width:none;-ms-overflow-style:none}
html::-webkit-scrollbar,body::-webkit-scrollbar,.g-body::-webkit-scrollbar,.cm::-webkit-scrollbar,.exo-full::-webkit-scrollbar,.h-week::-webkit-scrollbar,.h-chips::-webkit-scrollbar{display:none;width:0;height:0}

/* toast du mode démo (photo) */
.t-demo{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));z-index:500;display:flex;align-items:center;gap:12px;width:min(92vw,420px);padding:12px 12px 12px 14px;border-radius:22px;
  background:linear-gradient(135deg,#3E7F31,#5BA84A);color:#fff;box-shadow:0 14px 30px rgba(30,60,20,.35),0 4px 0 #2E6124;transform:translate(-50%,30px) scale(.96);opacity:0;transition:transform .35s cubic-bezier(.2,1.4,.4,1),opacity .25s}
.t-demo.on{transform:translate(-50%,0) scale(1);opacity:1}
.t-demo .f svg{width:46px;height:46px;flex:none}.t-demo .tx{flex:1;min-width:0}.t-demo b{display:block;font-family:var(--display);font-size:1.05rem}.t-demo small{display:block;opacity:.95;line-height:1.35;margin-top:2px}
.t-demo button{flex:none;width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.2);color:#fff;display:grid;place-items:center;cursor:pointer}
@media (prefers-reduced-motion: reduce){.t-demo{transition:none}}
/* vitrine du mode démo */
.dm-vit{position:fixed;inset:0;z-index:520;display:flex;align-items:flex-end;justify-content:center;background:rgba(20,26,40,0);transition:background .3s}
.dm-vit.on{background:rgba(20,26,40,.5)}
.dm-in{position:relative;width:min(100%,480px);background:var(--paper);border-radius:26px 26px 0 0;padding:20px 16px calc(18px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .4s cubic-bezier(.2,1.2,.4,1);max-height:92vh;overflow:auto}
.dm-vit.on .dm-in{transform:none}
.dmv-x{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;border:2px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer}
.dm-h{display:flex;gap:12px;align-items:center;background:linear-gradient(135deg,#3E7F31,#5BA84A);color:#fff;border-radius:18px;padding:12px 14px;margin-right:44px}
.dm-h .f svg{width:52px;height:52px;flex:none}.dm-h b{font-family:var(--display);font-size:1.1rem}.dm-h p{margin:2px 0 0;font-size:.9rem;line-height:1.35;opacity:.95}
.dm-k{font-weight:800;margin:16px 2px 10px;color:var(--ink)}
.dm-g{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dm-t{display:flex;flex-direction:column;gap:8px;background:color-mix(in srgb,var(--c) 10%,var(--card));border:2px solid color-mix(in srgb,var(--c) 45%,var(--line));border-radius:16px;padding:12px;font-weight:700;font-size:.88rem;line-height:1.3;color:var(--ink);box-shadow:0 3px 0 color-mix(in srgb,var(--c) 30%,var(--line))}
.dm-t .i{width:36px;height:36px;border-radius:12px;background:var(--c);color:#fff;display:grid;place-items:center;font-size:1.1rem}
.dm-go{width:100%;margin-top:16px}.dm-non{display:block;margin:12px auto 0}
@media (prefers-reduced-motion: reduce){.dm-in,.dm-vit{transition:none}}
/* vitrine démo, version épurée */
.dm-in{text-align:center;padding-top:24px}
.dm-f svg{width:84px;height:84px}
.dm-in h3{font-family:var(--display);font-size:1.35rem;margin:6px 0 4px;color:var(--ink)}
.dm-p{margin:0 auto 16px;max-width:300px;color:var(--soft);font-weight:700;line-height:1.4}
.dm-l{list-style:none;margin:0 auto 4px;padding:0;max-width:300px;text-align:left;display:grid;gap:10px}
.dm-l li{display:flex;align-items:center;gap:10px;font-weight:800;color:var(--ink)}
.dm-l i{flex:none;width:30px;height:30px;border-radius:10px;background:color-mix(in srgb,var(--ogre) 16%,var(--card));color:var(--ogre-d);display:grid;place-items:center;font-size:.95rem}
.dm-h,.dm-k,.dm-g{display:none}
/* toaster démo : petit bouton « Me connecter » */
.t-demo .t-co{display:inline-block;margin-top:8px;border:0;border-radius:999px;background:#fff;color:#2E6124;font:inherit;font-weight:800;font-size:.85rem;padding:5px 12px;cursor:pointer}
.t-demo .t-x{align-self:flex-start}
.t-demo .t-co{width:auto!important;height:auto!important;display:inline-flex!important;white-space:nowrap;border-radius:999px!important;background:#fff!important;color:#2E6124!important;padding:6px 14px!important}
/* toaster démo en bottom sheet centré, au-dessus de la barre d'onglets */
.t-demo{left:50%!important;bottom:0!important;width:min(100%,480px)!important;border-radius:24px 24px 0 0!important;padding:16px 14px calc(16px + env(safe-area-inset-bottom)) 16px!important;z-index:520!important;transform:translate(-50%,100%)!important;box-shadow:0 -10px 30px rgba(30,60,20,.3)!important}
.t-demo.on{transform:translate(-50%,0)!important}

/* Réviser : les deux onglets « Mes cours » / « Programme » doivent sauter aux yeux (beaucoup d'élèves passeraient à côté) */
.rv-onglets{gap:6px;padding:5px;border-radius:18px;border:2px solid color-mix(in srgb,#FF8A1F 50%,var(--line));background:color-mix(in srgb,#FF8A1F 10%,var(--card))}
.rv-onglets button{padding:12px 8px;font-size:1rem;border-radius:14px;color:var(--ink)}
.rv-onglets button[aria-selected="true"]{background:#FF8A1F;color:#2A1400;box-shadow:0 3px 0 #C25E00}   /* couleur vive, même en sombre : texte très foncé (contraste ≈ 9:1) */
.rv-onglets button[aria-selected="false"]{background:var(--card);box-shadow:0 2px 0 var(--line)}
/* onglets sur petit écran : le texte reste toujours dans son bouton (taille réduite, puis sans icône) */
.rv-onglets button{min-width:0;font-size:clamp(.8rem,3.9vw,1rem);padding-inline:6px}
@media (max-width:360px){.rv-onglets button i{display:none}}
/* Fiches : tableaux nets (fines lignes horizontales, en-tête discret, cadre léger) et marges intérieures un peu plus larges */
.blk .tbl{border:1px solid var(--line);border-radius:12px;margin-top:6px}
.blk .tbl table{font-size:.94rem}
.blk .tbl th,.blk .tbl td{border:0;border-bottom:1px solid var(--line);padding:9px 12px;line-height:1.4}
.blk .tbl tr:last-child td{border-bottom:0}
.blk .tbl th .katex{text-transform:none}   /* a et A ne sont pas la même lettre */
.blk .tbl th{background:color-mix(in srgb,var(--ink) 5%,var(--card));color:var(--soft);font-family:var(--body);font-weight:800;font-size:.8rem;text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--line)}
.blk .tbl td:first-child{font-weight:700}
.blk.blk{padding:20px 20px}
.blk.blk h3{margin-bottom:10px}
.blk.blk li{margin:.4em 0}
/* onglets de Réviser : plus serrés et texte plus petit sur mobile, jamais de débordement */
@media (max-width:480px){.rv-onglets{gap:4px;padding:3px}.rv-onglets button{font-size:clamp(.74rem,3.5vw,.9rem);padding:10px 4px;gap:4px}}
@media (max-width:400px){.rv-onglets button i{display:none}}
@media (max-width:480px){.blk .tbl{margin-inline:-10px}.blk .tbl th,.blk .tbl td{padding:8px 7px;font-size:.86rem;hyphens:auto;overflow-wrap:anywhere}.blk .tbl th{font-size:.72rem}}
.blk .tbl td:first-child,.blk .tbl th:first-child{hyphens:manual;overflow-wrap:normal;word-break:normal}   /* 1re colonne : mots entiers, jamais coupés */
/* bouton retour : une simple flèche ronde (le texte « Retour » reste lu par les lecteurs d'écran), le titre prend la place */
.back{width:42px;height:42px;flex:none;padding:0!important;display:grid;place-items:center;font-size:0!important;color:var(--ink)}
.back::before{content:"";width:22px;height:22px;background:currentColor;-webkit-mask:var(--gi-gauche) center/contain no-repeat;mask:var(--gi-gauche) center/contain no-repeat}
/* quiz : minuteur lisible (le chiffre est à côté de la barre, jamais blanc sur fond clair) et points lisibles en sombre */
.q-chrono{overflow:visible;margin-right:40px}
.q-chrono i{border-radius:999px}
.q-chrono b{inset:0 -40px 0 auto;width:34px;color:var(--ink);text-shadow:none;font-size:1rem}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .q-pts{color:#B794F6}}
:root[data-theme="dark"] .q-pts{color:#B794F6}
.blk .tbl td+td,.blk .tbl th+th{border-left:1px solid color-mix(in srgb,var(--line) 70%,transparent)}   /* séparateur vertical léger entre colonnes */
/* Fiche : titre à droite de l'icône (plus d'icône seule sur sa ligne), intro en dessous sur toute la largeur */
.fhero{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center}
.fhero .em{font-size:2.2rem}
.fhero h2{margin:0;line-height:1.15;min-width:0}
.fhero p{grid-column:1/-1;margin-top:12px}
/* Bouton retour : flèche centrée (en grille, le texte masqué créait une 2e ligne et remontait la flèche) */
.back{display:flex!important;align-items:center;justify-content:center;line-height:0}
.back::before{margin-left:-2px}
/* Défi : 4 réponses toujours dans l'écran, même avec un mot long (« dénominateur ») à 320-375 px */
.df-choix{grid-template-columns:repeat(2,minmax(0,1fr))}
.df-choix>*{min-width:0;overflow-wrap:anywhere;hyphens:auto}
/* Tableaux de fiche sur mobile : on ne coupe plus les mots au milieu (« RÉSULT/AT ») et une formule reste sur une ligne */
@media (max-width:480px){.blk .tbl th,.blk .tbl td{overflow-wrap:break-word;word-break:normal}.blk .tbl th{hyphens:manual;letter-spacing:0}}
.blk .tbl .katex{white-space:nowrap}
/* Accueil : le « Bonne soirée, Léo ! » passe sur deux lignes au lieu d'être coupé par « … » */
.h-hello{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;max-width:calc(100% - 24px)!important;overflow-wrap:normal;line-height:1.2!important}
/* Connexion : la phrase de réassurance en petit, discrète */
.pr-rassure{color:var(--soft);font-size:.78rem;line-height:1.45;max-width:34ch;margin:10px auto 0;text-align:center}

/* mention du programme officiel (fiches Mon année, banques S'entraîner) */
.prog-off{display:flex;gap:8px;align-items:flex-start;margin:18px 4px 6px;font-size:.8rem;line-height:1.45;color:var(--soft)}
.prog-off i{flex:none;width:18px;height:18px;margin-top:1px}
.prog-off.ok i{color:var(--ogre)}
.prog-off a{color:inherit;text-decoration:underline;text-underline-offset:2px}


/* ===== sélecteur de la démo, version « rejoindre une partie » : plein écran coloré, gros titre, tuiles franches ===== */
html.dp-ouvert{overflow:hidden}
.dp-fond{position:fixed;inset:0;z-index:1200;overflow:auto;background:radial-gradient(120% 80% at 50% 0%,#3d8b3d 0%,#1f5a2a 55%,#143d1d 100%);display:block;color:#fff}
.dp-deco{position:fixed;inset:0;pointer-events:none;overflow:hidden}
.dp-deco i{position:absolute;border-radius:50%;background:rgba(255,255,255,.07)}
.dp-deco i:nth-child(1){width:220px;height:220px;top:-60px;left:-70px}
.dp-deco i:nth-child(2){width:140px;height:140px;top:18%;right:-40px;border-radius:32px;transform:rotate(18deg)}
.dp-deco i:nth-child(3){width:90px;height:90px;bottom:12%;left:6%;border-radius:24px;transform:rotate(-14deg)}
.dp-deco i:nth-child(4){width:260px;height:260px;bottom:-110px;right:-80px}
.dp-deco i:nth-child(5){width:46px;height:46px;top:42%;left:44%;background:rgba(255,255,255,.05)}
.dp-in{position:relative;max-width:560px;margin:0 auto;padding:max(20px,env(safe-area-inset-top)) 16px calc(28px + env(safe-area-inset-bottom))}
.dp-x{position:fixed;top:max(12px,env(safe-area-inset-top));right:12px;z-index:2;width:44px;height:44px;border-radius:14px;border:0;background:rgba(255,255,255,.16);color:#fff;display:grid;place-items:center;cursor:pointer}
.dp-x i{width:22px;height:22px}
.dp-tete{text-align:center;padding:18px 36px 4px}
.dp-ogre{display:block;width:84px;height:84px;margin:0 auto 4px;filter:drop-shadow(0 6px 0 rgba(0,0,0,.18));animation:dpSaute 2.4s ease-in-out infinite}
.dp-ogre svg{width:100%;height:100%}
@keyframes dpSaute{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.dp-tete h2{margin:0;font-family:var(--display,inherit);font-size:1.75rem;line-height:1.15;color:#fff;letter-spacing:.2px;text-shadow:0 3px 0 rgba(0,0,0,.18)}
.dp-switch{position:relative;display:grid;grid-template-columns:1fr 1fr;margin:18px auto 18px;max-width:360px;background:rgba(0,0,0,.25);border-radius:999px;padding:5px}
.dp-switch button{position:relative;z-index:1;border:0;background:none;color:rgba(255,255,255,.8);font:inherit;font-weight:800;font-size:1rem;padding:11px 8px;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:7px;cursor:pointer}
.dp-switch button i{width:19px;height:19px}
.dp-switch button.on{color:#1f5a2a}
.dp-pastille{position:absolute;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:999px;background:#fff;box-shadow:0 3px 0 rgba(0,0,0,.2);transition:transform .25s cubic-bezier(.3,1.4,.5,1)}
.dp-switch.droite .dp-pastille{transform:translateX(100%)}
.dp-grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.dp-carte{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 8px 16px;border:0;border-radius:24px;background:var(--n);color:#fff;font:inherit;cursor:pointer;box-shadow:0 7px 0 color-mix(in srgb,var(--n) 60%,#000);transform:translateY(0);animation:dpPop .4s calc(var(--i) * 70ms) both cubic-bezier(.3,1.5,.5,1);transition:transform .1s,box-shadow .1s}
.dp-carte:active{transform:translateY(5px);box-shadow:0 2px 0 color-mix(in srgb,var(--n) 60%,#000)}
@keyframes dpPop{from{opacity:0;transform:scale(.85) translateY(10px)}to{opacity:1;transform:none}}
.dp-carte .dp-av{width:86px;height:86px;border-radius:50%;background:#fff;display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 -5px 0 rgba(0,0,0,.08)}
.dp-av svg{width:88%;height:88%}
.dp-carte .dp-nom{font-size:1.3rem;font-weight:900;line-height:1.1;text-shadow:0 2px 0 rgba(0,0,0,.15)}
.dp-carte .dp-niv{font-weight:900;font-size:.95rem;color:var(--n);background:#fff;padding:4px 14px;border-radius:999px}
.dp-carte .dp-spe{font-weight:800;font-size:.74rem;line-height:1.25;text-align:center;color:rgba(255,255,255,.95);padding:0 4px}
.dp-groupe{display:flex;align-items:center;gap:8px;margin:4px 4px 12px;color:#fff;font-size:1.05rem;font-weight:900;letter-spacing:.2px}
.dp-groupe i{width:20px;height:20px}
.dp-grille+.dp-groupe{margin-top:24px}
.dp-liste{display:grid;gap:14px}
.dp-prof{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:14px 14px 14px 12px;border:0;border-radius:24px;background:var(--n);color:#fff;font:inherit;cursor:pointer;box-shadow:0 7px 0 color-mix(in srgb,var(--n) 60%,#000);animation:dpPop .4s calc(var(--i) * 80ms) both cubic-bezier(.3,1.5,.5,1);transition:transform .1s,box-shadow .1s}
.dp-prof:active{transform:translateY(5px);box-shadow:0 2px 0 color-mix(in srgb,var(--n) 60%,#000)}
.dp-prof .dp-av{flex:none;width:64px;height:64px;border-radius:50%;background:#fff;display:grid;place-items:center;overflow:hidden}
.dp-prof .dp-nom{font-size:1.2rem;font-weight:900;text-shadow:0 2px 0 rgba(0,0,0,.15)}
.dp-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.dp-tx small{color:rgba(255,255,255,.9);font-weight:700;font-size:.85rem}
.dp-mats{display:flex;flex-wrap:wrap;gap:6px}
.dp-mat{display:inline-flex;align-items:center;gap:5px;font-size:.8rem;font-weight:800;color:#fff;background:rgba(255,255,255,.2);padding:4px 10px 4px 7px;border-radius:999px}
.dp-mat i{width:15px;height:15px}
.dp-fl{flex:none;width:22px;height:22px;color:#fff}
.dp-pied{text-align:center;margin:22px 10px 0;color:rgba(255,255,255,.8);font-size:.88rem;line-height:1.45}
.dp-carte:focus-visible,.dp-prof:focus-visible,.dp-x:focus-visible,.dp-switch button:focus-visible{outline:3px solid #fff;outline-offset:3px}
.dp-carte.charge,.dp-prof.charge{opacity:.7}
.dp-charge,.dp-err{text-align:center;color:rgba(255,255,255,.85);padding:36px 0}
@media (min-width:480px){.dp-grille{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (prefers-reduced-motion:reduce){.dp-carte,.dp-prof,.dp-ogre{animation:none}.dp-pastille{transition:none}}

.demo-bar .demo-prof{border:0;background:color-mix(in srgb,#fff 18%,transparent);color:inherit;font:inherit;font-weight:800;border-radius:999px;padding:5px 10px;display:inline-flex;align-items:center;gap:4px;cursor:pointer}
.demo-bar .demo-prof i{width:14px;height:14px}
.vg-code{display:inline-block;margin-top:8px;padding:4px 14px;border-radius:12px;background:color-mix(in srgb,var(--ogre) 14%,var(--card));color:var(--ink);font-weight:900;font-size:1.25rem;letter-spacing:.14em;font-variant-numeric:tabular-nums}
/* visite guidée : bulle plus compacte, fond vert Ogrelo très clair au lieu du blanc */
.vg{--vg-bg:#EAF6E2}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .vg{--vg-bg:#1F3A1C;--vg-ink:#EAF6E2;--vg-soft:#B9D8AE}}
:root[data-theme="dark"] .vg{--vg-bg:#1F3A1C;--vg-ink:#EAF6E2;--vg-soft:#B9D8AE}
.vg-bulle{padding:10px 12px 9px!important;max-width:min(300px,calc(100vw - 32px))!important;border:2px solid #8FD16A;box-shadow:0 6px 16px rgba(0,0,0,.28)!important}
.vg-tete,.vg-tete svg{width:36px!important;height:36px!important}
.vg-centre .vg-tete,.vg-centre .vg-tete svg{width:64px!important;height:64px!important}
.vg-txt{font-size:1.02rem!important}
.vg-bulle{max-width:min(420px,calc(100vw - 24px))!important}

/* listes déroulantes « maison » (liste.js) : mêmes formes partout, couleurs du thème de chaque page, clair et sombre */
.gl{--gl-card:var(--card,var(--surface,#fff));--gl-line:var(--line,#E1E7E3);--gl-ink:var(--ink,#22261F);--gl-soft:var(--soft,var(--muted,#6B6880));--gl-acc:var(--ogre,var(--accent,#5BA84A));
  position:relative;width:100%;min-width:0;text-align:left}
.gl-cache{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important}
.gl-b{width:100%;min-height:46px;display:flex;align-items:center;gap:10px;font:inherit;font-weight:700;color:var(--gl-ink);background:var(--gl-card);border:2px solid var(--gl-line);border-radius:14px;padding:6px 10px 6px 8px;cursor:pointer;text-align:left;transition:border-color .15s}
.gl.vide .gl-b{color:var(--gl-soft)}
.gl.choisi .gl-b{border-color:color-mix(in srgb,var(--c,var(--gl-acc)) 50%,var(--gl-line))}
.gl.ouvert .gl-b{border-color:var(--gl-acc)}
.gl-b:disabled{opacity:.55;cursor:default}
.gl-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:2px}
.gl-fl{flex:none;width:18px;height:18px;color:var(--gl-soft);transition:transform .2s}.gl.ouvert .gl-fl{transform:rotate(180deg)}
.gl-ic{flex:none;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 15%,var(--gl-card));color:var(--c)}.gl-ic i{width:17px;height:17px}
.gl-l{margin-top:4px;border:2px solid var(--gl-line);border-radius:14px;background:var(--gl-card);max-height:252px;overflow:auto;padding:4px;box-shadow:0 10px 24px rgba(0,0,0,.12)}
.gl-o{width:100%;display:flex;align-items:center;gap:10px;font:inherit;font-weight:700;font-size:.95rem;line-height:1.25;color:var(--gl-ink);background:none;border:0;border-radius:10px;padding:8px;min-height:42px;cursor:pointer;text-align:left}
.gl-ot{flex:1;min-width:0}
.gl-o:hover,.gl-o:focus-visible{background:color-mix(in srgb,var(--c,var(--gl-acc)) 10%,var(--gl-card));outline:none}
.gl-o.on{background:color-mix(in srgb,var(--c,var(--gl-acc)) 15%,var(--gl-card))}
.gl-o:disabled{opacity:.45;cursor:default}
.gl-ok{flex:none;width:18px;height:18px;color:var(--c,var(--gl-acc));visibility:hidden}.gl-o.on .gl-ok{visibility:visible}
.gl-b:focus-visible{outline:3px solid color-mix(in srgb,var(--gl-acc) 60%,transparent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.gl-fl,.gl-b{transition:none}}

/* Ogrelo · figures exactes (figure.js) et opérations posées (pose.js), partagées par l'appli, l'espace parents et l'aperçu du professeur */
/* figures exactes des fiches (figure.js) : mêmes couleurs qu'autour, clair comme sombre */
.fig{margin:6px 0 2px;padding:10px 8px 8px;border-radius:16px;background:color-mix(in srgb,var(--card) 70%,var(--bg,transparent));border:2px solid var(--line)}
.fig-svg{display:block;width:100%;max-width:420px;height:auto;margin:0 auto;overflow:hidden}
.fig-svg .tr{stroke:var(--ink);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.fig-svg .tr.fin{stroke-width:1.6}
.fig-svg .tir{stroke-dasharray:5 4}
.fig-svg .acc{stroke:var(--ogre);fill:var(--ogre)}
.fig-svg .tr.acc{fill:none}
.fig-svg .pt{fill:var(--ink)}
.fig-svg circle.pt{stroke:none}
.fig-svg .ax{stroke:var(--ink);stroke-width:1.6;fill:none}
.fig-svg .gr{stroke:var(--line);stroke-width:1}
.fig-svg .flm{fill:var(--ink)}
.fig-svg .pg{fill:none;stroke:none}
.fig-svg .pg.rem{fill:color-mix(in srgb,var(--ogre) 16%,transparent)}
.fig-svg text{font:700 13px/1 inherit;font-family:inherit;fill:var(--ink)}
.fig-svg text.me{font-weight:600;font-size:12px;fill:var(--soft)}
.fig-svg text.acc{fill:var(--ogre)}
.fig figcaption{margin-top:6px;text-align:center;font-size:.85rem;color:var(--soft);line-height:1.4}
.fig-svg .tr.epais{stroke-width:4}
.fig-svg .tr.bg{fill:var(--card)}
.fig-svg .fla{fill:var(--ogre)}
.fig-svg .per{stroke:none;opacity:.85}
.fig-svg .per.p0{fill:color-mix(in srgb,var(--ogre) 45%,transparent)}
.fig-svg .per.p1{fill:color-mix(in srgb,#3B7BC8 45%,transparent)}
.fig-svg .per.p2{fill:color-mix(in srgb,#D9702A 45%,transparent)}
.fig-svg .per.p3{fill:color-mix(in srgb,#7B3FD1 45%,transparent)}
.fig-svg text.ev{font-weight:700;font-size:12px;fill:var(--ink)}
.fig-svg text{paint-order:stroke fill;stroke:var(--card);stroke-width:4px;stroke-linejoin:round}
.fig{background:var(--card)}
/* figure : bouton plein écran, frise large qui défile, vue plein écran */
.fig{position:relative}
.fig-zoom{position:absolute;top:6px;right:6px;z-index:1;width:34px;height:34px;border-radius:10px;border:0;display:grid;place-items:center;background:color-mix(in srgb,var(--ink) 7%,transparent);color:var(--soft);cursor:pointer}
.fig-zoom i{width:18px;height:18px}
.fig-svg{cursor:zoom-in}
.fig-defile{overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.fig-svg.large{width:var(--w);max-width:none}
.fig-plein{position:fixed;inset:0;z-index:1000;background:color-mix(in srgb,var(--bg,#000) 92%,transparent);display:flex;align-items:center;justify-content:center;padding:56px 12px 24px;touch-action:pinch-zoom}
.fig-plein-in{width:100%;max-height:100%;overflow:auto;background:var(--card);border-radius:20px;padding:14px;border:2px solid var(--line)}
.fig-plein .fig-svg{width:100%;max-width:none;cursor:default}
.fig-plein .fig-svg.large{width:max(100%,var(--w))}
.fig-plein figcaption{margin-top:8px;text-align:center;color:var(--soft)}
.fig-fermer{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:14px;border:2px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer}
.fig-fermer i{width:22px;height:22px}
@media (orientation:landscape){.fig-plein{padding:12px 64px}}
.fig-svg .pg{fill:none;stroke:var(--ink);stroke-width:2;stroke-linejoin:round}.fig-svg .pg.acc{stroke:var(--ogre);fill:none}.fig-svg .pg.rem{fill:color-mix(in srgb,var(--ogre) 16%,transparent)}
.fig-zoom{top:auto;bottom:6px;right:6px}.fig figcaption{min-height:34px;padding:0 40px;display:flex;align-items:center;justify-content:center}

/* opérations posées (pose.js) : chiffres à chasse fixe, alignés, ligne du résultat, retenues et zéros ajoutés en couleur */
.pose{margin:6px 0 2px;padding:14px 10px 10px;border-radius:16px;background:var(--card);border:2px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:8px;overflow-x:auto}
.pose-t{border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:700;color:var(--ink);line-height:1.15}
.pose-t td{width:.72em;min-width:.72em;padding:1px 1px;text-align:center}
.pose-t td.pv{width:.3em;min-width:.3em;padding:0}
.pose-t td.op{width:1em;color:var(--soft);font-weight:800}
.pose-t td.ajout{color:var(--ogre)}
.pose-t td.ret{font-size:.7rem;color:var(--ogre);vertical-align:bottom}
.pose-t tr.r-ret td{padding-bottom:0}
.pose-t tr.r-der td{border-bottom:2.5px solid var(--ink);padding-bottom:3px}
.pose-t tr.r-der td.op{border-bottom-color:transparent}
.pose-t tr.r-res td{padding-top:4px;color:var(--ogre)}
.pose-t tr.r-res td.op{color:var(--soft)}
.pose-t td.abaisse{color:var(--ogre)}
.pose-t td.reste{color:var(--ogre)}
.pose-div{display:flex;align-items:flex-start}
.pose-g{border-right:2.5px solid var(--ink)}
.pose-q td{text-align:left;padding:1px 10px;width:auto;min-width:0}
.pose-q tr.r-div td{border-bottom:2.5px solid var(--ink)}
.pose-q td.quot{color:var(--ogre)}
.pose figcaption{text-align:center;font-size:.85rem;color:var(--soft);line-height:1.4}
.pose-t td.sous{border-bottom:2.5px solid var(--ink)}
.fig-svg .lab-fond{fill:var(--card);opacity:.9}

/* illustrations dessinées (sans texte) : numéros sur l'image, légende en dessous */
.illus{margin:6px 0 2px}
.illus-c{position:relative;display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;cursor:zoom-in}
.illus-c img{display:block;width:100%;height:auto}
.illus-n{position:absolute;transform:translate(-50%,-50%);min-width:24px;height:24px;padding:0 6px;border-radius:12px;background:#2F6B26;color:#fff;font-weight:800;font-size:13px;line-height:24px;text-align:center;box-shadow:0 0 0 2px #fff,0 2px 6px rgba(0,0,0,.35);pointer-events:none}
.illus-l{margin:10px 0 0;padding:0;list-style:none;counter-reset:il;display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px 14px}
.illus-l li{counter-increment:il;display:flex;gap:8px;align-items:center;font-size:.9rem;line-height:1.3}
.illus-l li::before{content:counter(il);flex:none;width:22px;height:22px;border-radius:11px;background:#2F6B26;color:#fff;font-weight:800;font-size:.75rem;display:grid;place-items:center}
.illus figcaption{margin-top:8px;text-align:center;font-size:.85rem;color:var(--soft);line-height:1.4}
.illus-plein{position:fixed;inset:0;z-index:1000;background:color-mix(in srgb,var(--bg,#000) 94%,transparent);overflow:auto;padding:max(64px,env(safe-area-inset-top)) 12px 16px}
.illus-plein-in{max-width:900px;margin:0 auto;background:var(--card);border-radius:20px;padding:14px}
.illus-plein .illus-c{cursor:default}

/* cellules et chromosomes (figure.js) : couleurs fixes, lisibles en clair comme en sombre */
.fig-svg .cel{fill:color-mix(in srgb,#F4C9A0 30%,var(--card));stroke:#C98A55;stroke-width:2}
.fig-svg .noy{fill:color-mix(in srgb,#B9A3E3 30%,var(--card));stroke:#8E73C9;stroke-width:1.6;stroke-dasharray:4 3}
.fig-svg .chr{stroke-linecap:round}
.fig-svg .chr-b{stroke-linecap:butt}
.fig-svg .chr-bleu{stroke:#4F86D9}.fig-svg .chr-rose{stroke:#E57BA6}.fig-svg .chr-violet{stroke:#8E5BD6}.fig-svg .chr-vert{stroke:#49A35B}
.fig-svg .chr-orange{stroke:#E8913A}.fig-svg .chr-gris{stroke:#9AA0A6}.fig-svg .chr-rouge{stroke:#D9534F}.fig-svg .chr-jaune{stroke:#E7B92E}.fig-svg .chr-blanc{stroke:#FFFFFF}
.fig-etapes{margin:10px 6px 2px;grid-template-columns:1fr}.fig-etapes li{align-items:flex-start;font-size:.92rem;line-height:1.4}.fig-etapes li::before{margin-top:1px}
.fig-svg .num circle{fill:#2F6B26;stroke:#fff;stroke-width:2}.fig-svg .num text{fill:#fff;font-weight:800;font-size:12px;stroke:none;paint-order:normal}
/* légende des couleurs d'une figure : pastille + texte */
.fig-cles{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;margin:10px 4px 2px}
.fig-cle{display:inline-flex;align-items:center;gap:7px;font-size:.9rem;font-weight:700;color:var(--ink)}
.fig-cle .sw{flex:none;width:22px;height:10px;border-radius:5px}
.sw-bleu{background:#4F86D9}.sw-rose{background:#E57BA6}.sw-violet{background:#8E5BD6}.sw-vert{background:#49A35B}.sw-orange{background:#E8913A}.sw-gris{background:#9AA0A6}.sw-rouge{background:#D9534F}.sw-jaune{background:#E7B92E}.sw-blanc{background:#fff;box-shadow:inset 0 0 0 1.5px var(--line)}

/* cartes mémoire : fenêtre plein écran, carte aérée, notes avec les têtes d'Ogrelo */
body.cm-open{overflow:hidden}
.cm{position:fixed;inset:0;z-index:78;background:var(--paper);overflow-y:auto;overscroll-behavior:contain;padding:calc(12px + env(safe-area-inset-top)) 16px calc(28px + env(safe-area-inset-bottom))}
.cm-in{max-width:560px;margin:0 auto}
.cm-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.cm-top b{font-family:var(--display);font-size:1.2rem;color:var(--ink)}
.cm-x{width:42px;height:42px;border-radius:50%;border:2px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer;flex:none}
.cm-barre{height:8px;border-radius:8px;background:var(--line);overflow:hidden}.cm-barre i{display:block;height:100%;background:var(--ogre);border-radius:8px;transition:width .3s}
.cm-n{margin:6px 0 16px;text-align:right;font-size:.8rem;font-weight:800;color:var(--soft)}
.cm-carte{position:relative;background:var(--card);border:2px solid var(--line);border-radius:24px;padding:28px 20px 24px;min-height:190px;display:flex;flex-direction:column;justify-content:center;text-align:center;box-shadow:0 6px 0 var(--line);margin-bottom:18px;animation:cmIn .25s ease}
.cm-carte.ret{animation:cmFlip .35s ease}
.cm-mat{position:absolute;top:12px;left:16px;font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--soft)}
.cm-recto{font-family:var(--display);font-size:1.3rem;font-weight:800;line-height:1.35;margin:8px 0 0;color:var(--ink)}
.cm-carte.ret .cm-recto{font-size:1rem;color:var(--soft)}
.cm-verso{margin-top:14px;padding-top:14px;border-top:2px dashed var(--line);font-size:1.12rem;font-weight:700;line-height:1.45;color:var(--ink)}
.cm-sous{margin:8px 0 0;color:var(--soft);font-size:.92rem}
.cm-aide{color:var(--soft);text-align:center;margin:0 4px 16px;line-height:1.45}
.cm-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.cm-notes button{display:flex;flex-direction:column;align-items:center;gap:6px;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:18px;padding:12px 6px;font:inherit;font-weight:800;cursor:pointer;box-shadow:0 3px 0 var(--line)}
.cm-notes button:active{transform:translateY(2px);box-shadow:none}
.cm-notes .f svg,.cm-f svg{width:48px;height:48px}
.cm-notes button[data-n="0"]{border-color:color-mix(in srgb,var(--t-crit,#C8413B) 45%,var(--line))}
.cm-notes button[data-n="2"]{border-color:color-mix(in srgb,var(--ogre) 60%,var(--line))}
.cm .btn{display:block;width:100%;margin:0 0 10px}
.cm-moi{display:block;font-weight:700;color:var(--ink);margin-bottom:14px;line-height:1.4}
.cm textarea{display:block;width:100%;box-sizing:border-box;margin-top:8px;border:2px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink);font:inherit;padding:12px 14px;resize:vertical}
.cm textarea:focus{outline:none;border-color:var(--ogre)}
.cm-passer{display:block;margin:4px auto 0}
.cm-compare{display:grid;gap:10px;margin-bottom:14px}
.cm-v{border-radius:16px;padding:12px 14px;border:2px solid var(--line);background:var(--card)}
.cm-v small{display:block;font-size:.75rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--soft);margin-bottom:4px}
.cm-v p{margin:0;line-height:1.45;color:var(--ink)}
.cm-v.moi{border-color:color-mix(in srgb,var(--ogre) 55%,var(--line))}
.cm-acts{display:flex;gap:10px}.cm-acts.col{flex-direction:column;align-items:stretch}.cm-acts .btn{margin:0}
.cm-acts .linkbtn2{align-self:center;margin-top:4px}
.cm-vide{text-align:center;padding:20px 4px}.cm-vide h3{font-family:var(--display);font-size:1.35rem;margin:10px 0 8px;color:var(--ink)}.cm-vide p{color:var(--soft);line-height:1.5;margin:0 0 18px}
.cm-f svg{width:96px;height:96px}
.cm-petit{font-size:.88rem;color:var(--soft);margin:-8px 0 16px}
.cm-perso h3{font-family:var(--display);margin:0 0 6px;color:var(--ink)}.cm-perso label{display:block;font-weight:700;margin-bottom:14px;color:var(--ink)}
@keyframes cmIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes cmFlip{0%{transform:rotateY(90deg)}100%{transform:none}}
@media (prefers-reduced-motion: reduce){.cm-carte,.cm-carte.ret{animation:none}}
/* rappels sur l'accueil */
#hCartes{display:grid;gap:10px;margin:14px 0 4px}#hCartes:empty{display:none}
.h-rev{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:2px solid color-mix(in srgb,var(--ogre) 40%,var(--line));background:color-mix(in srgb,var(--ogre) 8%,var(--card));color:var(--ink);border-radius:18px;padding:12px 14px;font:inherit;cursor:pointer}
.h-rev.ctl{border-color:color-mix(in srgb,var(--t-crit,#C8413B) 35%,var(--line));background:color-mix(in srgb,var(--t-crit,#C8413B) 6%,var(--card))}
.h-rev .i{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--card);font-size:1.2rem}
.h-rev .tx{flex:1;min-width:0}.h-rev b{display:block;line-height:1.3}.h-rev small{display:block;color:var(--soft);margin-top:2px}
.h-rev .go{flex:none;font-weight:800;color:var(--ogre-d);font-size:.9rem}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-rev .go{color:var(--ogre)}}
/* encadré devoir + Moi */
.d-cartes h3{display:flex;align-items:center;gap:8px}.d-cartes:empty{display:none}
.d-cartes-acts{display:flex;gap:10px;margin-top:12px}.d-cartes-acts .btn{flex:1;margin:0}
.moi-cartes{display:block}.moi-cartes .d-cartes-acts{margin-top:14px}
.g-chip-cartes{border-color:var(--ogre);background:color-mix(in srgb,var(--ogre) 12%,var(--card));font-weight:800}
.d-cartes-acts .btn{display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;padding-left:10px;padding-right:10px}

/* découverte et révision : rapide et ludique */
.cm-notes.deux{grid-template-columns:1fr 1fr}
.cm-notes.deux button{padding:16px 8px;font-size:1.05rem}
.cm-notes.deux .f svg{width:58px;height:58px}
.cm-serie{height:26px;margin:-6px 0 8px;text-align:center;font-weight:800;color:var(--ogre-d);animation:cmPop .35s ease}
.cm-serie.vide{animation:none}
.cm-aide .gi-mic{vertical-align:-2px;color:var(--ogre-d)}
.cm-detail{font-weight:800;color:var(--ink)!important;margin-bottom:6px!important}
@keyframes cmPop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.15)}100%{transform:none;opacity:1}}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .cm-serie,:root:not([data-theme="light"]) .cm-aide .gi-mic{color:var(--ogre)}}
/* onglet Réviser */
.rv-intro{color:var(--soft);margin:-4px 0 18px;line-height:1.45}
.rv-sec{background:var(--card);border:2px solid var(--line);border-radius:22px;padding:16px;margin-bottom:16px}
.rv-sec h3{display:flex;align-items:center;gap:8px;margin:0 0 4px;font-family:var(--display);font-size:1.12rem;color:var(--ink)}
.rv-sous{color:var(--soft);margin:0 0 12px;line-height:1.45;font-size:.93rem}
.rv-paquet{margin-top:14px;display:grid;gap:14px}.rv-paquet:empty{display:none}
.rv-mh{display:flex;align-items:baseline;justify-content:space-between;margin:0 2px 6px}.rv-mh b{color:var(--ink)}.rv-mh small{color:var(--soft);font-weight:700}
.rv-ch{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:2px solid var(--line);background:var(--paper);color:var(--ink);border-radius:16px;padding:10px 12px;margin-bottom:8px;font:inherit;cursor:pointer}
.rv-ch .tx{flex:1;min-width:0}.rv-ch b{display:block;line-height:1.3}.rv-ch small{display:block;color:var(--soft);font-size:.82rem;margin:2px 0 6px}
.rv-bar{display:block;height:6px;border-radius:6px;background:var(--line);overflow:hidden}.rv-bar i{display:block;height:100%;background:var(--ogre);border-radius:6px}
.rv-due{flex:none;min-width:26px;height:26px;padding:0 7px;border-radius:13px;background:var(--t-crit,#C8413B);color:#fff;font-weight:800;font-size:.8rem;display:grid;place-items:center}
.rv-ch .go,.rv-l .go{flex:none;opacity:.5}
.rv-liste{display:grid;gap:8px}
.rv-l{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:2px solid var(--line);background:var(--paper);color:var(--ink);border-radius:16px;padding:11px 12px;font:inherit;cursor:pointer}
.rv-l .tx{flex:1;min-width:0}.rv-l b{display:block;line-height:1.3;font-size:.95rem}.rv-l small{display:block;color:var(--soft);font-size:.82rem;margin-top:2px}
.rv-li{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--ogre) 14%,var(--card));color:var(--ogre-d);font-size:1.1rem}
.rv-vide{color:var(--soft);margin:0;font-size:.92rem}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .rv-li{color:var(--ogre)}}
/* expression écrite */
.ec-consigne{display:block;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px 14px;margin-bottom:14px}
.ec-consigne small{display:block;font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--soft);margin-bottom:4px}
.ec-consigne p{margin:0;line-height:1.45;color:var(--ink)}
.ec-consigne input{width:100%;box-sizing:border-box;border:0;background:none;font:inherit;color:var(--ink);padding:2px 0}.ec-consigne input:focus{outline:none}
.ec-zone{position:relative;border:2px solid var(--line);border-radius:18px;background:var(--card);min-height:220px}
.ec-zone:focus-within{border-color:var(--ogre)}
.ec-miroir,.ec-zone textarea{box-sizing:border-box;width:100%;min-height:220px;margin:0;padding:14px 16px;font:inherit;font-size:1.05rem;line-height:1.7;letter-spacing:normal;white-space:pre-wrap;overflow-wrap:break-word;word-break:normal}
.ec-miroir{position:absolute;inset:0;color:transparent;overflow:hidden;pointer-events:none}
.ec-zone textarea{position:relative;display:block;resize:vertical;border:0;background:transparent;color:var(--ink);height:260px}
.ec-zone textarea:focus{outline:none}
.ec-miroir mark{color:transparent;border-radius:4px;padding:0;box-shadow:inset 0 -3px 0 currentColor}
.ec-miroir mark.m-o{background:rgba(232,69,124,.22);color:transparent;border-bottom:3px solid #E8457C}
.ec-miroir mark.m-a,.ec-miroir mark.m-c{background:rgba(255,138,61,.24);border-bottom:3px solid #E07020}
.ec-miroir mark.m-p{background:rgba(60,157,224,.22);border-bottom:3px solid #2471AE}
.ec-miroir mark.m-v{background:rgba(111,61,184,.18);border-bottom:3px solid #6F3DB8}
.ec-miroir mark{box-shadow:none}
.ec-etat{display:flex;justify-content:space-between;align-items:center;min-height:24px;margin:6px 4px 12px;font-size:.85rem;color:var(--soft);font-weight:700}
.ec-dots{display:inline-flex;gap:3px;vertical-align:middle}.ec-dots i{width:6px;height:6px;border-radius:50%;background:var(--ogre);animation:ecDot 1s infinite}.ec-dots i:nth-child(2){animation-delay:.15s}.ec-dots i:nth-child(3){animation-delay:.3s}
@keyframes ecDot{0%,100%{opacity:.3;transform:none}50%{opacity:1;transform:translateY(-3px)}}
.ec-grignon{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px}.ec-grignon .f svg{width:52px;height:52px}
.ec-dit{flex:1;background:var(--card);border:2px solid var(--line);border-radius:4px 18px 18px 18px;padding:10px 14px}
.ec-dit p{margin:0 0 6px;line-height:1.45;color:var(--ink)}.ec-dit p:last-child{margin:0}.ec-dit .rel{color:var(--soft)}
.ec-bilan{margin-top:10px;padding-top:10px;border-top:2px dashed var(--line)}.ec-bilan ul{margin:4px 0 8px;padding-left:20px}.ec-bilan li{margin-bottom:4px;line-height:1.4}
.ec-rem{display:grid;gap:8px;margin-bottom:16px}.ec-rem:empty{display:none}
.ec-r{border-radius:14px;padding:10px 12px;background:var(--card);border:2px solid var(--line);border-left-width:6px}
.ec-r.m-o{border-left-color:#E8457C}.ec-r.m-a,.ec-r.m-c{border-left-color:#E07020}.ec-r.m-p{border-left-color:#2471AE}.ec-r.m-v{border-left-color:#6F3DB8}
.ec-r .ty{display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--soft);margin-right:8px}
.ec-r b{color:var(--ink)}.ec-r p{margin:4px 0 0;line-height:1.4;color:var(--ink)}
@media (prefers-reduced-motion: reduce){.ec-dots i{animation:none}}
/* erreurs → cartes */
.exo-cartes{display:block;width:100%;margin:14px 0 4px}
.rv-sec .d-cartes-acts{flex-wrap:wrap}.rv-sec .d-cartes-acts .btn{min-width:0;flex:1 1 130px;font-size:.95rem}
.rv-sec .d-cartes-acts .btn{padding:12px 8px;font-size:.92rem;white-space:nowrap}

.cm-perso select,.cm-perso input{display:block;width:100%;box-sizing:border-box;margin-top:8px;border:2px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);font:inherit;padding:11px 12px}
.cm-perso select.manque{border-color:var(--t-crit,#C8413B)}
.cm-arch{display:block;margin:14px auto 0;color:var(--soft)}
.rv-arch{display:block;margin:6px auto 0;color:var(--soft)}
.cm-arch-liste{display:grid;gap:10px}
.cm-arch-c{display:flex;gap:12px;align-items:center;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px}
.cm-arch-c .tx{flex:1;min-width:0}.cm-arch-c small{display:block;color:var(--soft);font-weight:700;font-size:.78rem}.cm-arch-c b{display:block;margin:2px 0;color:var(--ink)}.cm-arch-c p{margin:0;color:var(--soft);font-size:.92rem}
.cm-arch-c .btn{width:auto;margin:0;flex:none;padding:9px 14px}

/* onglet Réviser : navigation matières → chapitres → cartes */
.rv-back{display:inline-flex;align-items:center;gap:6px;border:0;background:none;color:var(--soft);font:inherit;font-weight:800;padding:6px 0;margin-bottom:6px;cursor:pointer}
.rv-titre{margin-top:0}
.rv-grille{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.rv-tuile{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-height:118px;text-align:left;border:2px solid color-mix(in srgb,var(--c) 45%,var(--line));background:color-mix(in srgb,var(--c) 12%,var(--card));color:var(--ink);border-radius:22px;padding:14px;font:inherit;cursor:pointer;box-shadow:0 4px 0 color-mix(in srgb,var(--c) 30%,var(--line))}
.rv-tuile:active{transform:translateY(2px);box-shadow:none}
.rv-tuile .e{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--card);font-size:1.4rem}
.rv-tuile b{font-family:var(--display);font-size:1.05rem;line-height:1.2}
.rv-tuile small{color:var(--soft);font-weight:700;font-size:.82rem}
.rv-tuile .rv-due{position:absolute;top:10px;right:10px}
.rv-big{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:0;background:var(--ogre);color:#fff;border-radius:22px;padding:16px;margin-bottom:18px;font:inherit;cursor:pointer;box-shadow:0 5px 0 var(--ogre-d)}
.rv-big .i{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.2);font-size:1.4rem;flex:none}
.rv-big b{display:block;font-family:var(--display);font-size:1.12rem;line-height:1.25}.rv-big small{display:block;opacity:.92;margin-top:2px}
.rv-big:active{transform:translateY(3px);box-shadow:none}
.rv-mhead{display:flex;align-items:center;gap:12px;margin:0 0 16px}.rv-mhead .e{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 18%,var(--card));font-size:1.6rem}
.rv-mhead h2{margin:0;font-family:var(--display);font-size:1.5rem;color:var(--ink)}
.rv-h3{font-family:var(--display);font-size:1.02rem;color:var(--soft);margin:18px 2px 10px}
.rv-ajout{justify-content:center;border-style:dashed}.rv-ajout b{display:flex!important;align-items:center;gap:6px;justify-content:center;color:var(--ogre-d)}
.rv-gros{margin-bottom:6px}.rv-deux{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:10px}
.rv-moyen{display:flex;flex-direction:column;align-items:center;gap:6px;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:18px;padding:14px 8px;font:inherit;cursor:pointer;box-shadow:0 3px 0 var(--line)}
.rv-moyen i{font-size:1.4rem;color:var(--ogre-d)}.rv-moyen b{font-size:.9rem;text-align:center;line-height:1.2}
.rv-cartes{display:grid;gap:10px}
.rv-carte{display:block;width:100%;text-align:left;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:18px;padding:14px 16px;font:inherit;cursor:pointer;position:relative}
.rv-carte.due{border-color:color-mix(in srgb,var(--t-crit,#C8413B) 45%,var(--line))}
.rv-carte .r{display:block;font-weight:800;line-height:1.35;padding-right:40px}
.rv-carte .v{display:none;margin-top:8px;padding-top:8px;border-top:2px dashed var(--line);line-height:1.4}
.rv-carte.vue .v{display:block}
.rv-carte .b{position:absolute;top:14px;right:14px;display:flex;gap:2px}.rv-carte .b i{width:5px;height:12px;border-radius:2px;background:var(--ogre)}
.rv-astuce{color:var(--soft);font-size:.85rem;text-align:center;margin:10px 0 0}
.rv-arc{margin-top:18px}.rv-arc summary{cursor:pointer;color:var(--soft);font-weight:800;padding:8px 2px}.rv-arc .cm-arch-c{margin-top:8px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .rv-moyen i,:root:not([data-theme="light"]) .rv-ajout b{color:var(--ogre)}}

.cm-qcm{display:grid;gap:10px;margin-bottom:16px}
.cm-qcm button{text-align:left;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:16px;padding:13px 14px;font:inherit;font-weight:700;cursor:pointer;box-shadow:0 3px 0 var(--line)}
.cm-qcm button.bon{border-color:var(--ok);background:var(--ok-bg)}.cm-qcm button.faux{border-color:var(--ko);background:var(--ko-bg)}
.cm-qcm button:disabled{cursor:default}
/* rappels de l'accueil sur mobile : le texte prend toute la largeur, l'action passe dessous (plus de 3 colonnes serrées) */
.h-rev{display:grid;grid-template-columns:40px 1fr;grid-template-areas:"i tx" ". go";column-gap:12px;row-gap:8px;align-items:start}
.h-rev .i{grid-area:i}.h-rev .tx{grid-area:tx}
.h-rev .go{grid-area:go;justify-self:start;background:var(--ogre);color:#fff;border-radius:999px;padding:6px 14px;font-size:.88rem}
.h-rev.ctl .go{background:color-mix(in srgb,var(--t-crit,#C8413B) 85%,#000)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-rev .go{color:#fff}}
/* icônes sur fond coloré (plus de pastilles blanches) */
.h-rev .i{background:color-mix(in srgb,var(--ogre) 30%,var(--card));color:color-mix(in srgb,var(--ogre) 70%,#000)}
.h-rev.ctl .i{background:color-mix(in srgb,var(--t-crit,#C8413B) 25%,var(--card));color:color-mix(in srgb,var(--t-crit,#C8413B) 80%,#000)}
.rv-tuile .e{background:color-mix(in srgb,var(--c) 32%,var(--card));color:color-mix(in srgb,var(--c) 70%,#000)}
.rv-mhead .e{background:color-mix(in srgb,var(--c) 32%,var(--card));color:color-mix(in srgb,var(--c) 70%,#000)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-rev .i,:root:not([data-theme="light"]) .rv-tuile .e,:root:not([data-theme="light"]) .rv-mhead .e{color:#fff}}
.h-rev{border:2px solid color-mix(in srgb,var(--ogre) 40%,var(--line));border-radius:22px;box-shadow:0 4px 0 color-mix(in srgb,var(--ogre) 28%,var(--line));transition:transform .08s,box-shadow .08s}
.h-rev.ctl{border-color:color-mix(in srgb,var(--t-crit,#C8413B) 38%,var(--line));box-shadow:0 4px 0 color-mix(in srgb,var(--t-crit,#C8413B) 25%,var(--line))}
.h-rev:active{transform:translateY(3px);box-shadow:none}
#hCartes{gap:14px}

/* bouton écouter sur les cartes en langue */
.cm-son{display:inline-grid;place-items:center;width:36px;height:36px;margin-left:8px;vertical-align:middle;border:0;border-radius:50%;background:color-mix(in srgb,var(--ogre) 22%,var(--card));color:var(--ogre-d);font-size:1.05rem;cursor:pointer}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .cm-son{color:#fff}}

/* matière : deux grosses actions vertes en haut */
.rv-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 16px}
.rv-act{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:96px;text-align:center;border:0;border-radius:22px;background:var(--ogre);color:#fff;font:inherit;padding:12px 8px;cursor:pointer;box-shadow:0 5px 0 var(--ogre-d)}
.rv-act i{font-size:1.5rem}.rv-act b{font-family:var(--display);font-size:1rem;line-height:1.2}.rv-act small{opacity:.9;font-size:.78rem}
.rv-act:active{transform:translateY(3px);box-shadow:0 2px 0 var(--ogre-d)}
.rv-act.photo{background:#2F8A4A;box-shadow:0 5px 0 #1E6633}
.rv-act.busy{opacity:.6;pointer-events:none}
.rv-prep{display:flex;gap:10px;align-items:center;background:color-mix(in srgb,var(--ogre) 10%,var(--card));border:2px dashed color-mix(in srgb,var(--ogre) 40%,var(--line));border-radius:16px;padding:12px 14px;margin:0 0 14px;font-weight:700;line-height:1.35}
.rv-prep.manque{background:var(--ko-bg);border-color:color-mix(in srgb,var(--ko) 40%,var(--line))}

/* deux grandes actions, une par ligne, deux couleurs */
.rv-actions{grid-template-columns:1fr}
.rv-act{flex-direction:row;justify-content:flex-start;text-align:left;gap:14px;min-height:0;padding:14px 16px}
.rv-act .i{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.2);font-size:1.4rem}
.rv-act .tx{display:flex;flex-direction:column;gap:2px;min-width:0}.rv-act b{font-size:1.05rem}.rv-act small{font-size:.82rem}
.rv-act.photo{background:#2F8A4A;box-shadow:0 5px 0 #1E6633}
.rv-act.cree{background:#2471AE;box-shadow:0 5px 0 #18557F}

/* ---------- défi entre amis ---------- */
.df-hero{text-align:center;margin:4px 0 18px}.df-hero .f svg{width:90px;height:90px}.df-hero h3{font-family:var(--display);font-size:1.4rem;margin:6px 0 4px;color:var(--ink)}.df-hero p{color:var(--soft);margin:0;line-height:1.45}
.df-gros{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:0;border-radius:22px;padding:16px;color:#fff;font:inherit;cursor:pointer;margin-bottom:18px}
.df-gros.lancer{background:linear-gradient(135deg,#7B3FD1,#C2389E);box-shadow:0 5px 0 #5A2A9E}.df-gros .i{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.2);font-size:1.5rem;flex:none}
.df-gros b{display:block;font-family:var(--display);font-size:1.15rem}.df-gros small{opacity:.9}
.df-rej{background:var(--card);border:2px solid var(--line);border-radius:20px;padding:14px;box-shadow:0 4px 0 var(--line)}.df-rej b{display:block;margin-bottom:10px;color:var(--ink)}
.df-code-in{display:flex;gap:10px}.df-code-in input{flex:1;min-width:0;font:inherit;font-family:var(--display);font-size:1.6rem;letter-spacing:.3em;text-align:center;border:2px solid var(--line);border-radius:14px;padding:8px;background:var(--paper);color:var(--ink)}
.df-code-in .btn{margin:0;width:auto;padding:0 20px}.df-err{color:var(--ko);font-weight:700;margin:8px 0 0;min-height:1em}
.df-h{font-family:var(--display);font-size:1.15rem;margin:6px 0 10px;color:var(--ink)}.df-h.c,.df-sous.c,.df-aide.c{text-align:center}.df-sous{color:var(--soft);font-weight:800;margin:14px 2px 8px}
.df-pin{text-align:center;background:linear-gradient(135deg,#7B3FD1,#C2389E);color:#fff;border-radius:22px;padding:16px;margin:4px 0 12px;box-shadow:0 5px 0 #5A2A9E}.df-pin small{display:block;opacity:.9;font-weight:700}.df-pin b{display:block;font-family:var(--display);font-size:2.6rem;letter-spacing:.12em}
.df-part{display:flex!important;align-items:center;justify-content:center;gap:8px;margin-bottom:16px!important}
.df-salon{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}.df-j{display:flex;align-items:center;gap:8px;background:var(--card);border:2px solid var(--line);border-radius:999px;padding:4px 12px 4px 4px;font-weight:700;animation:cmIn .3s ease}
.df-av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,#7B3FD1 25%,var(--card));color:#5A2A9E;font-weight:800;flex:none;overflow:hidden}.df-av.moi{background:var(--ogre);color:#fff}.df-av svg{width:34px;height:34px}.df-av.bot{background:color-mix(in srgb,var(--ogre) 25%,var(--card))}
.df-bot{display:block;margin:0 auto 12px}.df-go{background:#7B3FD1!important;box-shadow:0 5px 0 #5A2A9E!important}.df-aide{color:var(--soft);line-height:1.45;margin:8px 0}
.df-haut{display:flex;justify-content:space-between;font-weight:800;color:var(--soft);font-size:.88rem;margin-bottom:8px}
.df-chrono{position:relative;height:30px;border-radius:999px;background:var(--line);overflow:hidden;margin-bottom:14px}.df-chrono i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#7B3FD1,#C2389E);border-radius:999px;transition:width 1s linear}
.df-chrono b{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-family:var(--display);font-size:1.05rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.df-q{font-family:var(--display);font-size:1.25rem;font-weight:800;line-height:1.35;text-align:center;background:var(--card);border:2px solid var(--line);border-radius:20px;padding:18px 14px;margin-bottom:14px;color:var(--ink)}.df-q.petit{font-size:1rem;padding:12px}
.df-choix{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.df-c{display:flex;align-items:center;gap:10px;min-height:76px;border:0;border-radius:18px;padding:10px 12px;color:#fff;font:inherit;font-weight:800;text-align:left;line-height:1.25;cursor:pointer;position:relative}
.df-c .sh svg{width:24px;height:24px;fill:rgba(255,255,255,.9);flex:none}.df-c>i{position:absolute;top:8px;right:8px}
.df-c.c0{background:#E0384C;box-shadow:0 4px 0 #A8263A}.df-c.c1{background:#2471AE;box-shadow:0 4px 0 #18557F}.df-c.c2{background:#D99A00;box-shadow:0 4px 0 #A87600}.df-c.c3{background:#2F8A4A;box-shadow:0 4px 0 #1E6633}
.df-c:active{transform:translateY(3px);box-shadow:none}.df-c.eteint{opacity:.35}.df-c.pris{outline:4px solid var(--ink);outline-offset:2px}.df-c.bon{outline:4px solid #fff;box-shadow:0 0 0 4px var(--ogre)}.df-c.faux{opacity:.6;text-decoration:line-through}
.df-res{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;border-radius:20px;padding:12px;margin-bottom:12px}.df-res.ok{background:var(--ok-bg)}.df-res.ko{background:var(--ko-bg)}.df-res .f svg{width:60px;height:60px}.df-res b{font-family:var(--display);font-size:1.25rem;color:var(--ink)}.df-res small{font-weight:800;color:var(--ogre-d)}
.df-expl{color:var(--soft);line-height:1.4;margin:12px 4px}
.df-classement{display:grid;gap:6px;margin-top:14px}.df-l{display:flex;align-items:center;gap:10px;background:var(--card);border:2px solid var(--line);border-radius:14px;padding:6px 12px}.df-l.moi{border-color:var(--ogre);background:color-mix(in srgb,var(--ogre) 10%,var(--card))}
.df-l .r{font-family:var(--display);font-weight:800;width:20px;color:var(--soft)}.df-l .n{flex:1;font-weight:700}.df-l .plus{color:var(--ogre-d);font-weight:800;font-size:.85rem}.df-l b{font-family:var(--display)}
.df-podium{display:flex;align-items:flex-end;justify-content:center;gap:8px;margin:10px 0 18px}.df-pod{display:flex;flex-direction:column;align-items:center;gap:4px;width:30%;text-align:center}.df-pod .df-av{width:56px;height:56px}.df-pod .df-av svg{width:56px;height:56px}
.df-pod b{font-size:.95rem}.df-pod small{color:var(--soft);font-weight:800}.df-pod .socle{width:100%;border-radius:14px 14px 4px 4px;color:#fff;font-family:var(--display);font-size:1.6rem;display:grid;place-items:center}
.df-pod.p1 .socle{height:110px;background:#E8A300}.df-pod.p2 .socle{height:80px;background:#9AA5B1}.df-pod.p3 .socle{height:60px;background:#C27C4A}.df-pod.moi b{color:var(--ogre-d)}
/* tuile « défi » dans Réviser */
.rv-defi{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:0;border-radius:22px;padding:16px;margin:0 0 16px;color:#fff;font:inherit;cursor:pointer;background:linear-gradient(135deg,#7B3FD1,#C2389E);box-shadow:0 5px 0 #5A2A9E}
.rv-defi .i{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.2);font-size:1.5rem;flex:none}.rv-defi b{display:block;font-family:var(--display);font-size:1.15rem}.rv-defi small{opacity:.92}
.rv-defi:active{transform:translateY(3px);box-shadow:0 2px 0 #5A2A9E}
@media (prefers-reduced-motion: reduce){.df-chrono i{transition:none}}
.rv-moyen.defi{background:linear-gradient(135deg,#7B3FD1,#C2389E);color:#fff;border:0;box-shadow:0 3px 0 #5A2A9E}.rv-moyen.defi i{color:#fff}

.df-gen{background:color-mix(in srgb,#7B3FD1 7%,var(--card));border:2px solid color-mix(in srgb,#7B3FD1 30%,var(--line));border-radius:20px;padding:14px;margin-bottom:14px;box-shadow:0 4px 0 color-mix(in srgb,#7B3FD1 20%,var(--line))}
.df-gen b{display:flex;gap:6px;align-items:center;margin-bottom:10px;color:var(--ink)}
.df-gen input,.df-gen select{display:block;width:100%;box-sizing:border-box;margin-bottom:10px;border:2px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);font:inherit;padding:11px 12px}
.df-gen .btn{margin:0}.df-attente{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:8px}.df-attente .f svg{width:64px;height:64px}.df-attente p{margin:0;font-weight:700}

/* défi : décompte, chrono qui s'affole, podium qui monte, coupe qui brille */
.df-son{width:42px;height:42px;border-radius:50%;border:2px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer;margin-left:auto;margin-right:8px}
.df-decompte{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center}.df-decompte p{font-weight:800;color:var(--soft);margin:0 0 10px}
.df-decompte b{font-family:var(--display);font-size:7rem;line-height:1;color:#7B3FD1}.df-decompte small{color:var(--soft);font-weight:700;margin-top:12px}
.pulse{animation:dfPulse .9s ease}@keyframes dfPulse{0%{transform:scale(2.2);opacity:0}40%{transform:scale(1);opacity:1}100%{transform:scale(.9)}}
.df-chrono.urgent i{background:linear-gradient(90deg,#E0384C,#FF7A00)}.df-chrono.urgent{animation:dfTremble .5s ease infinite}
@keyframes dfTremble{0%,100%{transform:none}25%{transform:translateX(-2px)}75%{transform:translateX(2px)}}
.df-pts{color:#7B3FD1}
.df-pod .socle{transform-origin:bottom;animation:dfMonte .6s cubic-bezier(.2,1.3,.4,1) backwards}.df-pod.p3 .socle{animation-delay:.3s}.df-pod.p2 .socle{animation-delay:.8s}.df-pod.p1 .socle{animation-delay:1.4s}
.df-pod>.df-av,.df-pod>b,.df-pod>small{animation:cmIn .4s ease backwards}.df-pod.p3>*{animation-delay:.6s}.df-pod.p2>*{animation-delay:1.1s}.df-pod.p1>*{animation-delay:1.8s}
@keyframes dfMonte{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.df-coupe{width:58px;height:58px;filter:drop-shadow(0 0 10px rgba(245,184,0,.7));animation:dfCoupe 1.2s ease 2s backwards,dfBrille 2s ease-in-out 3.2s infinite}
@keyframes dfCoupe{0%{transform:translateY(-40px) scale(.3) rotate(-30deg);opacity:0}70%{transform:translateY(4px) scale(1.15) rotate(6deg);opacity:1}100%{transform:none}}
@keyframes dfBrille{50%{filter:drop-shadow(0 0 18px rgba(245,184,0,1));transform:scale(1.06)}}
@media (prefers-reduced-motion: reduce){.pulse,.df-chrono.urgent,.df-pod .socle,.df-pod>*,.df-coupe{animation:none}}

/* choix du défi : couleurs Ogrelo + lettres ; le choix se soulève (plus de bordure noire) */
.df-c{border:3px solid transparent;transition:transform .12s,box-shadow .12s,opacity .2s}
.df-c .sh{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.25);font-family:var(--display);font-size:1rem}
.df-c.c0{background:#3E9B4F;box-shadow:0 5px 0 #2A7038}.df-c.c1{background:#7B3FD1;box-shadow:0 5px 0 #5A2A9E}.df-c.c2{background:#E8892B;box-shadow:0 5px 0 #B5661A}.df-c.c3{background:#1F8E9E;box-shadow:0 5px 0 #146873}
.df-c.pris{outline:none;transform:translateY(-5px);border-color:rgba(255,255,255,.55)}
.df-c.c0.pris{box-shadow:0 10px 0 #2A7038}.df-c.c1.pris{box-shadow:0 10px 0 #5A2A9E}.df-c.c2.pris{box-shadow:0 10px 0 #B5661A}.df-c.c3.pris{box-shadow:0 10px 0 #146873}
.df-c.bon{outline:none;border-color:#fff;transform:translateY(-3px)}
/* choix : tout est calme au départ, mon choix s'allume (opacité pleine + soulevé), les autres s'effacent */
.df-c{opacity:.88}.df-c:not(:disabled):hover{opacity:1}.df-c.pris{opacity:1}.df-c.eteint{opacity:.3}
/* correction : chaque option garde sa couleur ; seule la bordure parle (verte = bonne réponse, rouge = mon erreur + Ogrelo qui pleure) */
.df-choix{gap:16px 14px}.df-c{border-width:4px}
.df-c.bon{opacity:1;transform:translateY(-3px);border-color:#4ADE6A;animation:dfBon 1.2s ease-in-out 2}
.df-c.c0.bon,.df-c.c1.bon,.df-c.c2.bon,.df-c.c3.bon{box-shadow:0 5px 0 rgba(0,0,0,.25),0 0 14px rgba(74,222,106,.7)}
.df-c.faux{opacity:1;border-color:#FF3B4E;text-decoration:none;animation:dfTremble .4s ease 1}
.df-c.c0.faux,.df-c.c1.faux,.df-c.c2.faux,.df-c.c3.faux{box-shadow:0 5px 0 rgba(0,0,0,.25),0 0 14px rgba(255,59,78,.6)}
.df-c .df-mk{position:absolute;top:-12px;right:-8px;width:30px;height:30px;border-radius:50%;background:#4ADE6A;color:#fff;display:grid;place-items:center;box-shadow:0 2px 6px rgba(0,0,0,.2);font-size:1rem}
.df-c .df-mk.pleure{width:40px;height:40px;top:-16px;padding:2px;background:#FF3B4E}.df-c .df-mk.pleure svg{width:36px;height:36px}
@keyframes dfBon{50%{transform:translateY(-6px)}}
/* mini podium entre deux questions */
.df-mini{display:flex;align-items:flex-end;justify-content:center;gap:8px;margin:18px 0 10px}
.df-mp{position:relative;width:31%;display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center;animation:cmIn .35s ease backwards}
.df-mp.p1{animation-delay:.25s}.df-mp.p3{animation-delay:.1s}
.df-mp .df-av{width:44px;height:44px}.df-mp.p1 .df-av{width:52px;height:52px}.df-mp .df-av svg{width:100%;height:100%}
.df-mp>b{font-size:.88rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.df-mp.moi>b{color:var(--ogre-d)}
.df-mp .plus{color:var(--ogre-d);font-weight:800;font-size:.8rem;animation:dfPlus .6s ease .4s backwards}
.df-mp .socle{width:100%;border-radius:12px 12px 4px 4px;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;transform-origin:bottom;animation:dfMonte .5s cubic-bezier(.2,1.3,.4,1) backwards}
.df-mp .socle span{font-family:var(--display);font-size:1.3rem;line-height:1}.df-mp .socle small{font-weight:800;font-size:.75rem;opacity:.95}
.df-mp.p1 .socle{height:74px;background:#E8A300;box-shadow:0 4px 0 #B57F00}.df-mp.p2 .socle{height:56px;background:#9AA5B1;box-shadow:0 4px 0 #77818C}.df-mp.p3 .socle{height:44px;background:#C27C4A;box-shadow:0 4px 0 #965B33}
.df-mp.moi .socle{outline:3px solid var(--ogre);outline-offset:2px}
.df-mp.monte .df-av{animation:dfSaute .5s ease .3s 2}
.df-couronne .df-coupe{width:30px;height:30px;animation:dfBrille 2s ease-in-out infinite}
.df-mv{display:inline-flex;align-items:center;gap:1px;font-weight:800;font-size:.75rem;border-radius:999px;padding:1px 6px}
.df-mp .df-mv{position:absolute;top:0;right:0}
.df-mv.up{background:color-mix(in srgb,var(--ogre) 18%,var(--card));color:var(--ogre-d)}.df-mv.down{background:color-mix(in srgb,#D7263D 14%,var(--card));color:#C21F35}
.df-mini+.df-l{margin-top:8px}
@keyframes dfSaute{50%{transform:translateY(-8px)}}@keyframes dfPlus{from{opacity:0;transform:translateY(6px)}}
/* revanche : chacun choisit */
.df-rv{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:24px 8px}.df-rv .f svg{width:90px;height:90px}.df-rv h3{margin:0;font-family:var(--display)}.df-rv p{margin:0;color:var(--soft)}
.df-rv .btn{width:100%;margin-top:8px}.df-rv small{color:var(--soft);font-weight:700}
.df-rv-t{text-align:center;font-family:var(--display);color:#7B3FD1;font-weight:800;margin:0 0 4px}
.df-j.hesite{opacity:.55}.df-j .df-ok{color:var(--ogre-d)}.df-j .ec-dots{transform:scale(.7)}
/* fin : de l'air autour de « Revanche » */
.df-podium~.cm-acts,.df-classement+.cm-acts{margin:22px 4px 8px;gap:14px}
.df-podium~.cm-acts .btn{padding-top:14px;padding-bottom:14px}
@media (prefers-reduced-motion: reduce){.df-c.bon,.df-c.faux,.df-mp,.df-mp .socle,.df-mp.monte .df-av,.df-couronne .df-coupe,.df-mp .plus{animation:none}}
/* mon avatar Ogrelo */
.av-ed{display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px 2px 8px}
.av-big{width:132px;height:132px;border-radius:50%;background:color-mix(in srgb,var(--ogre) 10%,var(--card));display:grid;place-items:center;margin-bottom:8px;animation:cmIn .3s ease}.av-big svg{width:112px;height:112px}
.av-l{align-self:flex-start;font-weight:800;color:var(--soft);margin:10px 0 2px;font-size:.9rem}
.av-cols{display:grid;grid-template-columns:repeat(5,40px);gap:12px;justify-content:center;width:100%}
.av-hcols{grid-template-columns:repeat(4,40px)}
.av-col{width:40px;height:40px;border-radius:50%;background:var(--p);border:3px solid var(--card);box-shadow:0 0 0 2px var(--line);cursor:pointer;transition:transform .12s}
.av-col.on{box-shadow:0 0 0 3px var(--ogre);transform:scale(1.12)}
.av-accs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%}
.av-acc{aspect-ratio:1;border-radius:16px;background:var(--card);border:2px solid var(--line);box-shadow:0 3px 0 var(--line);display:grid;place-items:center;cursor:pointer;padding:6px}.av-acc svg{width:100%;height:100%}
.av-acc.on{border-color:var(--ogre);box-shadow:0 3px 0 var(--ogre-d);background:color-mix(in srgb,var(--ogre) 10%,var(--card))}
.av-hasard{margin-top:10px}.av-ok{width:100%;margin-top:14px}
.av-intro{padding-bottom:0}.av-intro h3{margin-bottom:2px}
.df-av svg{width:100%;height:100%}
.moi-av{position:relative;flex:none;width:72px;height:72px;border:0;padding:0;background:none;cursor:pointer}.moi-av>svg{width:72px;height:72px}
.moi-av .ed{position:absolute;right:-2px;bottom:-2px;width:26px;height:26px;border-radius:50%;background:var(--ogre);color:#fff;display:grid;place-items:center;border:2px solid var(--card);font-size:.8rem}
/* réactions rapides */
.df-reacs{display:none;gap:8px;overflow-x:auto;scrollbar-width:none;padding:10px 14px calc(10px + env(safe-area-inset-bottom));border-top:2px solid var(--line);background:var(--paper)}
.df-reacs::-webkit-scrollbar{display:none}.df-reacs.on{display:flex}
.df-reacs button{flex:none;display:inline-flex;align-items:center;gap:6px;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:5px 12px 5px 5px;font:inherit;font-weight:800;font-size:.85rem;box-shadow:0 3px 0 var(--line);cursor:pointer}
.df-reacs button:active{transform:translateY(2px);box-shadow:none}.df-reacs button:disabled{opacity:.5}
.df-reacs .rf{width:26px;height:26px}.df-reacs .rf svg{width:26px;height:26px}
.df-bulles{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.df-bulle{position:absolute;bottom:70px;display:flex;align-items:center;gap:6px;background:var(--card);border:2px solid var(--line);border-radius:999px;padding:4px 12px 4px 4px;box-shadow:0 6px 16px rgba(0,0,0,.15);animation:dfBulle 3.2s ease-out forwards;max-width:70%}
.df-bulle.moi{border-color:var(--ogre)}.df-bulle .df-av{width:32px;height:32px;flex:none}
.df-bulle small{display:block;font-size:.7rem;color:var(--soft);font-weight:800;line-height:1}.df-bulle b{font-size:.95rem;white-space:nowrap}
@keyframes dfBulle{0%{opacity:0;transform:translateY(20px) scale(.6)}12%{opacity:1;transform:translateY(0) scale(1.08)}20%{transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:translateY(-240px)}}
@media (prefers-reduced-motion: reduce){.df-bulle{animation:none}}
.df-reacs{position:fixed;left:0;right:0;bottom:0;z-index:80;justify-content:flex-start}
@media (min-width:600px){.df-reacs.on{justify-content:center}}
.df-bulles{position:fixed;z-index:81}
.cm.df-avec-reacs{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
.av-cols{flex-wrap:nowrap;gap:8px}.av-col{width:34px;height:34px;flex:none}
.av-accs{grid-template-columns:repeat(5,1fr);gap:8px}.av-acc{border-radius:14px;padding:4px}
/* barre de réactions : bien visible (fond coloré), grosses pastilles */
.df-reacs{flex-direction:column;gap:6px;background:linear-gradient(135deg,#7B3FD1,#C2389E);border-top:0;border-radius:22px 22px 0 0;padding:10px 0 calc(12px + env(safe-area-inset-bottom));box-shadow:0 -8px 24px rgba(123,63,209,.35);animation:dfReacIn .35s cubic-bezier(.2,1.3,.4,1)}
.df-reacs.on{display:flex}
.df-reacs-t{color:#fff;font-family:var(--display);font-weight:800;font-size:.95rem;padding:0 16px}
.df-reacs-l{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 16px 4px;scroll-snap-type:x proximity}.df-reacs-l::-webkit-scrollbar{display:none}
.df-reacs button{background:#fff;color:#2B2A3A;border:0;box-shadow:0 4px 0 rgba(0,0,0,.18);padding:6px 14px 6px 6px;font-size:.92rem;scroll-snap-align:start;transition:transform .12s}
.df-reacs button:active{transform:translateY(3px) scale(.96);box-shadow:0 1px 0 rgba(0,0,0,.18)}
.df-reacs .rf,.df-reacs .rf svg{width:30px;height:30px}
@media (min-width:600px){.df-reacs-l{justify-content:center}}
.cm.df-avec-reacs{padding-bottom:calc(120px + env(safe-area-inset-bottom))}
.df-bulle{bottom:120px;padding:5px 14px 5px 5px;border:3px solid #fff;background:linear-gradient(135deg,#FFF6D6,#fff);box-shadow:0 10px 24px rgba(0,0,0,.2)}
.df-bulle .df-av{width:38px;height:38px}.df-bulle b{font-size:1.05rem}
.df-bulle.moi{border-color:var(--ogre)}
@keyframes dfReacIn{from{transform:translateY(100%)}}
@keyframes dfBulle{0%{opacity:0;transform:translateY(30px) scale(.4) rotate(-6deg)}10%{opacity:1;transform:translateY(-6px) scale(1.15) rotate(3deg)}18%{transform:translateY(0) scale(1) rotate(0)}75%{opacity:1}100%{opacity:0;transform:translateY(-280px) scale(.9)}}
/* défi : choix du quiz, tuiles à la Duolingo */
.df-ts{display:grid;gap:12px;margin-bottom:6px}
.df-t{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:var(--card);border:2px solid var(--line);border-radius:18px;padding:14px;box-shadow:0 4px 0 var(--line);font:inherit;color:var(--ink);cursor:pointer;transition:transform .1s}
.df-t:active{transform:translateY(3px);box-shadow:0 1px 0 var(--line)}
.df-t .i{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:1.3rem;color:#fff}
.df-t.pret .i{background:#7B3FD1;box-shadow:0 3px 0 #5A2A9E}.df-t.ia .i{background:#E8892B;box-shadow:0 3px 0 #B5661A}
.df-t .tx{flex:1;min-width:0}.df-t b{display:block;font-weight:800;line-height:1.25}.df-t small{display:block;color:var(--soft);font-weight:700;margin-top:3px}
.df-t .go{color:var(--soft)}
.df-photo{margin-bottom:14px}
.df .rv-grille{margin-top:14px}
.df-t b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.df-reacs{border-radius:0;left:0;right:0;bottom:0;margin:0;width:100%}
/* réactions : bouton flottant qui se déplie (remplace la barre) */
.df-reacs{display:none!important}
.df-fab{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:82;display:none;flex-direction:column;align-items:flex-end;gap:12px;pointer-events:none}
.df-fab.on{display:flex}
.df-fab-b{pointer-events:auto;position:relative;width:64px;height:64px;border-radius:50%;border:4px solid #fff;background:linear-gradient(135deg,#7B3FD1,#C2389E);box-shadow:0 8px 22px rgba(123,63,209,.45),0 3px 0 #5A2A9E;display:grid;place-items:center;cursor:pointer;padding:0;animation:dfFabIn .45s cubic-bezier(.2,1.4,.4,1)}
.df-fab-b .o{width:44px;height:44px;transition:transform .25s,opacity .2s}.df-fab-b .o svg{width:44px;height:44px}
.df-fab-b .x{position:absolute;color:#fff;font-size:1.3rem;opacity:0;transform:rotate(-90deg) scale(.4);transition:transform .25s,opacity .2s}
.df-fab.ouvert .df-fab-b .o{transform:rotate(90deg) scale(.3);opacity:0}.df-fab.ouvert .df-fab-b .x{opacity:1;transform:none}
.df-fab-b::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:3px solid #C2389E;opacity:0;animation:dfFabPing 2.4s ease-out 1s 3}
.df-fab-b.tape{animation:dfFabTape .35s ease}
.df-fab-menu{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.df-fab-menu button{pointer-events:none;display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;background:#fff;color:#2B2A3A;padding:6px 16px 6px 6px;font:inherit;font-weight:800;font-size:.98rem;box-shadow:0 6px 18px rgba(43,42,58,.18),0 3px 0 rgba(43,42,58,.12);cursor:pointer;
  opacity:0;transform:translateY(24px) scale(.6);transform-origin:right center;transition:transform .28s cubic-bezier(.2,1.4,.4,1),opacity .18s;transition-delay:0ms}
.df-fab-menu .rf,.df-fab-menu .rf svg{width:34px;height:34px}
.df-fab.ouvert .df-fab-menu button{pointer-events:auto;opacity:1;transform:none;transition-delay:var(--d)}
.df-fab-menu button:active{transform:scale(.94)!important}
.df::before{content:"";position:fixed;inset:0;background:rgba(43,42,58,.0);pointer-events:none;transition:background .25s;z-index:81}
.df:has(.df-fab.ouvert)::before{background:rgba(43,42,58,.28)}
.cm.df-avec-reacs{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
.df-bulle{bottom:100px}
@keyframes dfFabIn{from{transform:scale(0) rotate(-30deg)}}
@keyframes dfFabPing{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(1.6)}}
@keyframes dfFabTape{50%{transform:scale(1.15) rotate(8deg)}}
@media (prefers-reduced-motion: reduce){.df-fab-b,.df-fab-b::after,.df-fab-menu button{animation:none;transition:none}}
/* invités */
.df-invt{margin:10px 0 4px}.df-invt .i{background:#1F8E9E;box-shadow:0 3px 0 #146873}
.df-j{position:relative}.df-j.inv .df-av{outline:2px dashed #1F8E9E;outline-offset:1px}
.df-inv{display:inline-block;margin-left:6px;font-size:.68rem;font-weight:800;color:#fff;background:#1F8E9E;border-radius:999px;padding:1px 7px;vertical-align:middle}
.df-retire{width:24px;height:24px;border-radius:50%;border:0;background:var(--line);color:var(--soft);display:grid;place-items:center;font-size:.7rem;cursor:pointer;margin-left:2px;flex:none}
.df-pseudo{display:flex;flex-direction:column;gap:6px;margin:6px 0 0}.df-pseudo b{font-weight:800;color:var(--soft);font-size:.9rem}
.df-pseudo input{font:inherit;font-family:var(--display);font-size:1.25rem;text-align:center;border:2px solid var(--line);border-radius:16px;padding:12px;background:var(--card);color:var(--ink);box-shadow:0 3px 0 var(--line)}
.df-pseudo input:focus{outline:none;border-color:#7B3FD1}
.df-bulle{max-width:230px}.df-invt{margin-bottom:16px}
/* code du défi : on le touche pour le copier */
.df-pin{display:block;width:100%;border:0;font:inherit;cursor:pointer;transition:transform .12s}.df-pin:active{transform:translateY(3px);box-shadow:0 2px 0 #5A2A9E}
.df-pin .cp{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:.8rem;font-weight:800;background:rgba(255,255,255,.2);border-radius:999px;padding:3px 10px}.df-pin .cp em{font-style:normal}
.df-pin.copie .cp{background:#fff;color:#7B3FD1}
.df-invt.copie .i{background:var(--ogre);box-shadow:0 3px 0 var(--ogre-d)}
/* file de réactions : empilées à gauche, au-dessus du bas de l'écran, sans chevauchement */
.df-bulle{left:16px!important;bottom:calc(104px + env(safe-area-inset-bottom));max-width:calc(100% - 110px);animation:dfBulleIn .4s cubic-bezier(.2,1.4,.4,1);transition:transform .35s cubic-bezier(.2,1,.4,1),opacity .3s}
.df-bulle.sort{opacity:0!important;transform:translateX(-30px) scale(.8)!important}
@keyframes dfBulleIn{from{opacity:0;transform:translateY(40px) scale(.5)}}
/* temps par question (choisi par l'hôte) */
.df-temps{margin:14px 0 6px}.df-temps>b{display:flex;align-items:center;gap:6px;font-weight:800;color:var(--soft);font-size:.9rem;margin-bottom:8px}
.df-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.df-seg button{border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:16px;padding:10px 4px;box-shadow:0 3px 0 var(--line);font:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;transition:transform .1s}
.df-seg button b{font-family:var(--display);font-size:1.15rem}.df-seg button small{font-weight:800;color:var(--soft);font-size:.78rem}
.df-seg button.on{border-color:#7B3FD1;background:color-mix(in srgb,#7B3FD1 12%,var(--card));box-shadow:0 3px 0 #5A2A9E}.df-seg button.on small{color:#7B3FD1}
.df-seg button:active{transform:translateY(2px);box-shadow:none}
.rv-deux{grid-template-columns:1fr 1fr;gap:12px}.rv-deux>.rv-moyen:last-child:nth-child(odd){grid-column:1/-1;flex-direction:row;justify-content:center}
@keyframes dfBulleIn{from{opacity:0;scale:.4}60%{scale:1.08}}.df-bulle{transform-origin:left center}
/* pile de réactions : une colonne en bas à gauche, chaque bulle prend sa place (aucun chevauchement), les autres glissent vers le haut */
.df-bulles{inset:auto auto calc(104px + env(safe-area-inset-bottom)) 16px;display:flex;flex-direction:column;align-items:flex-start;gap:0;max-width:calc(100% - 110px)}
.df-bulle,.df-bulle.moi{position:relative;left:auto!important;bottom:auto;max-width:100%;transform:none!important;margin-top:8px;max-height:64px;overflow:hidden;
  animation:dfPileIn .4s cubic-bezier(.2,1.2,.4,1);transition:max-height .3s ease,margin-top .3s ease,opacity .3s,padding .3s}
.df-bulle.vieille{opacity:.7}
.df-bulle.sort{opacity:0!important;max-height:0;margin-top:0;padding-top:0;padding-bottom:0;border-width:0}
@keyframes dfPileIn{from{max-height:0;margin-top:0;opacity:0}60%{opacity:1}}
/* code privé (cadenas) + message « copié » */
.df-pin small{display:inline-flex;align-items:center;gap:6px;justify-content:center}.df-pin small i{font-size:.9rem}
.df-pin.tape{animation:dfFabTape .35s ease}
.df-toast{position:fixed;left:50%;top:calc(16px + env(safe-area-inset-top));transform:translateX(-50%);z-index:300;display:flex;align-items:center;gap:10px;width:max-content;max-width:calc(100vw - 32px);
  background:var(--ogre);color:#fff;border-radius:18px;padding:10px 16px 10px 10px;box-shadow:0 10px 26px rgba(0,0,0,.25),0 4px 0 var(--ogre-d);animation:dfToastIn .4s cubic-bezier(.2,1.4,.4,1);transition:opacity .4s,transform .4s}
.df-toast .ic{width:32px;height:32px;border-radius:50%;background:#fff;color:var(--ogre-d);display:grid;place-items:center;flex:none}
.df-toast b{font-weight:800;line-height:1.3}
.df-toast.out{opacity:0;transform:translate(-50%,-20px)}
@keyframes dfToastIn{from{opacity:0;transform:translate(-50%,-30px) scale(.8)}}
/* salon : les joueurs en grille régulière (3 par ligne), avatar au-dessus, prénom dessous */
.df-salon{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:16px}
@media (min-width:480px){.df-salon{grid-template-columns:repeat(4,minmax(0,1fr))}}
.df-j{flex-direction:column;justify-content:flex-start;gap:4px;border-radius:18px;padding:10px 6px 8px;text-align:center;box-shadow:0 3px 0 var(--line);min-width:0}
.df-j .df-av{width:46px;height:46px}.df-j .df-av svg{width:46px;height:46px}
.df-j .nm{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.86rem;line-height:1.2;font-weight:800;word-break:break-word;max-width:100%}
.df-j .toi{font-size:.7rem;font-weight:800;color:#fff;background:var(--ogre);border-radius:999px;padding:1px 8px;line-height:1.4}
.df-j.moi{border-color:var(--ogre);box-shadow:0 3px 0 var(--ogre-d)}
.df-j .df-retire{position:absolute;top:4px;right:4px;margin:0;width:22px;height:22px}
.df-j .df-ok{position:absolute;top:6px;left:8px}.df-j .ec-dots{position:absolute;top:6px;left:2px}
.df-temps{margin-bottom:10px}.df .df-go#dfStart{margin-top:22px}.df .df-bot{display:block;margin:16px auto 0}
/* pastille « cartes à revoir aujourd'hui » : une info, pas une alerte → vert Ogrelo, pas de rouge */
.rv-due{background:var(--ogre);color:#fff;box-shadow:0 2px 0 var(--ogre-d);display:inline-flex;align-items:center;gap:3px;padding:0 8px 0 6px}
.rv-due i{font-size:.75rem}
/* interstitiel « Tu maîtrises ! Défie tes amis » */
.df-prop{position:fixed;inset:0;z-index:400;display:flex;align-items:flex-end;justify-content:center;background:rgba(43,42,58,0);transition:background .3s;padding:0 0 env(safe-area-inset-bottom)}
.df-prop.on{background:rgba(43,42,58,.55)}
.df-prop-in{position:relative;width:min(100%,480px);background:linear-gradient(160deg,#7B3FD1 0%,#9C3CC0 55%,#C2389E 100%);color:#fff;border-radius:28px 28px 0 0;padding:26px 22px calc(22px + env(safe-area-inset-bottom));text-align:center;
  box-shadow:0 -12px 40px rgba(123,63,209,.45);transform:translateY(100%);transition:transform .45s cubic-bezier(.2,1.2,.4,1);overflow:hidden}
.df-prop.on .df-prop-in{transform:none}
.df-prop-in::before{content:"";position:absolute;inset:-40% -20% auto;height:220px;background:radial-gradient(circle,rgba(255,255,255,.28),transparent 65%);pointer-events:none}
.df-prop-h{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;margin:6px 0 12px}
.df-prop-h .f{width:76px;height:76px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;border:3px solid rgba(255,255,255,.6);animation:dfSaute .6s ease .5s 2}
.df-prop-h .f svg{width:62px;height:62px}.df-prop-h .f.g{animation-delay:.8s}
.df-prop-h .vs{font-family:var(--display);font-weight:800;font-size:1.4rem;background:#F5B800;color:#5A2A00;border-radius:12px;padding:2px 10px;transform:rotate(-8deg);box-shadow:0 3px 0 #C98F00}
.df-prop-h .cp{position:absolute;top:-30px;left:50%;transform:translateX(-50%)}.df-prop-h .cp .df-coupe{width:38px;height:38px;animation:dfBrille 2s ease-in-out infinite}
.df-prop-k{display:inline-block;background:rgba(255,255,255,.2);border-radius:999px;padding:3px 12px;font-weight:800;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase}
.df-prop-in h3{font-family:var(--display);font-size:1.6rem;margin:8px 0 6px}.df-prop-in p{margin:0 auto 18px;max-width:340px;line-height:1.4;opacity:.95}
.df-prop-go{width:100%;background:#fff!important;color:#7B3FD1!important;box-shadow:0 5px 0 rgba(0,0,0,.2)!important;font-size:1.1rem;animation:dfPulseBtn 1.6s ease-in-out 1s infinite}
.df-prop-non{display:block;margin:14px auto 0;color:#fff!important;opacity:.85}
@keyframes dfPulseBtn{50%{transform:scale(1.03)}}
@media (prefers-reduced-motion: reduce){.df-prop-in,.df-prop-h .f,.df-prop-go{animation:none;transition:none}}
/* cartes mémoire en couleur : chaque carte prend la couleur de sa matière (fond teinté, bordure, ombre, étiquette) */
.cm-carte[style*="--c"]{background:linear-gradient(165deg,color-mix(in srgb,var(--c) 22%,var(--card)) 0%,color-mix(in srgb,var(--c) 8%,var(--card)) 70%);border:3px solid color-mix(in srgb,var(--c) 70%,var(--card));box-shadow:0 7px 0 color-mix(in srgb,var(--c) 75%,#000 25%);overflow:hidden}
.cm-carte[style*="--c"]::after{content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;background:color-mix(in srgb,var(--c) 18%,transparent);pointer-events:none}
.cm-carte[style*="--c"] .cm-mat{display:inline-flex;align-items:center;gap:6px;top:12px;left:12px;background:var(--c);color:#fff;border-radius:999px;padding:4px 10px 4px 4px;letter-spacing:.03em;box-shadow:0 2px 0 color-mix(in srgb,var(--c) 70%,#000 30%)}
.cm-mat .cm-mi{width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.25);display:grid;place-items:center;font-size:.75rem}
.cm-mat .cm-mi i{font-size:.75rem}
.cm-carte[style*="--c"] .cm-recto{margin-top:22px;position:relative;z-index:1}
.cm-carte[style*="--c"] .cm-verso{position:relative;z-index:1;border-top:2px dashed color-mix(in srgb,var(--c) 60%,var(--card));background:color-mix(in srgb,var(--card) 70%,transparent);margin:16px -8px 0;padding:14px 12px 4px;border-radius:0 0 14px 14px}
/* les 3 réponses honnêtes, en couleur */
.cm-notes button[data-n="0"]{background:color-mix(in srgb,#E8665A 14%,var(--card));border-color:#E8665A;box-shadow:0 3px 0 #B8473D}
.cm-notes button[data-n="1"]{background:color-mix(in srgb,#E8A300 14%,var(--card));border-color:#E8A300;box-shadow:0 3px 0 #B57F00}
.cm-notes button[data-n="2"]{background:color-mix(in srgb,var(--ogre) 16%,var(--card));border-color:var(--ogre);box-shadow:0 3px 0 var(--ogre-d)}
/* mise en forme du texte (partout) */
/* surligneur : une bande moins haute que la ligne (14 %→88 %), donc les lignes surlignées ne se touchent jamais, même collées */
mark{--hl:#FFE27A;background:linear-gradient(transparent 14%,var(--hl) 14%,var(--hl) 88%,transparent 88%);color:inherit;border-radius:4px;padding:0 .2em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
u{text-decoration-color:var(--ogre);text-decoration-thickness:2px;text-underline-offset:3px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) mark{--hl:#7A6514;color:#FFF6D6}}
:root[data-theme="dark"] mark{--hl:#7A6514;color:#FFF6D6}
.cm-carte[style*="--c"]{justify-content:flex-start;padding-top:16px}
.cm-carte[style*="--c"] .cm-mat{position:static;align-self:flex-start;font-size:.72rem;line-height:1;padding:5px 10px 5px 5px;margin-bottom:4px;z-index:1}
.cm-mat .cm-mi{width:20px;height:20px;overflow:hidden;flex:none}.cm-mat .cm-mi>*{width:14px!important;height:14px!important;font-size:.8rem!important;background:none!important;box-shadow:none!important;padding:0!important;color:#fff!important}
.cm-carte[style*="--c"] .cm-recto{margin-top:14px}
.cm-carte[style*="--c"].ret .cm-recto{margin-top:10px;color:color-mix(in srgb,var(--c) 55%,var(--ink))}
.cm-mat .cm-mi>i{background-color:#fff!important;width:13px!important;height:13px!important}
.cm-carte[style*="--c"] .cm-mat{background:color-mix(in srgb,var(--c) 68%,#000 32%);box-shadow:0 2px 0 color-mix(in srgb,var(--c) 50%,#000 50%)}
/* forces et points faibles dans Réviser */
.rv-st{display:inline-block;vertical-align:middle;margin-left:6px;font-size:.68rem;font-weight:800;letter-spacing:.02em;border-radius:999px;padding:2px 8px;white-space:nowrap}
.rv-st.st-f{background:color-mix(in srgb,#E8665A 16%,var(--card));color:#B8473D;border:1.5px solid #E8665A}
.rv-st.st-c{background:color-mix(in srgb,#E8A300 16%,var(--card));color:#8A5A00;border:1.5px solid #E8A300}
.rv-st.st-m{background:color-mix(in srgb,var(--ogre) 16%,var(--card));color:var(--ogre-d);border:1.5px solid var(--ogre)}
.rv-tuile .rv-st{margin:6px 0 0;align-self:flex-start}
.rv-prio{margin:4px 0 18px}.rv-prio .rv-h3{display:flex;align-items:center;gap:6px}
.rv-p{display:flex;align-items:center;gap:12px;width:100%;text-align:left;font:inherit;color:var(--ink);cursor:pointer;margin:0 0 10px;padding:12px;border-radius:18px;
  background:color-mix(in srgb,#E8665A 7%,var(--card));border:2px solid color-mix(in srgb,#E8665A 40%,var(--line));box-shadow:0 3px 0 color-mix(in srgb,#E8665A 30%,var(--line))}
.rv-p:active{transform:translateY(2px);box-shadow:none}.rv-p .tx{flex:1;min-width:0}.rv-p b{display:block;line-height:1.25}.rv-p small{display:block;color:var(--soft);font-weight:700;margin-top:2px}
.rv-p .go{flex:none;background:#E8665A;color:#fff;font-weight:800;font-size:.85rem;border-radius:999px;padding:7px 12px;box-shadow:0 3px 0 #B8473D}
.rv-bar.f{display:block;height:6px;border-radius:6px;background:var(--line);margin-top:6px;overflow:hidden}.rv-bar.f i{display:block;height:100%;background:#E8665A;border-radius:6px}
.rv-comble{display:flex;gap:8px;align-items:center;background:color-mix(in srgb,var(--ogre) 14%,var(--card));border:2px solid var(--ogre);border-radius:14px;padding:10px 12px;margin:0 0 10px;font-weight:700}
.rv-comble i{color:var(--ogre-d)}
.rv-bilan{display:flex;flex-direction:column;gap:6px;margin:-4px 0 16px;font-size:.88rem;font-weight:700;color:var(--soft)}.rv-bilan span{display:flex;gap:6px;align-items:baseline}
.rv-bilan .ok{color:var(--ogre-d)}.rv-bilan .ko{color:#B8473D}
.rv-mhead .rv-st{margin-left:auto}
.rv-p .h-ico{flex:none;width:38px!important;height:38px!important;min-width:0!important;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 18%,var(--card));color:var(--c);font-size:1.1rem;margin:0!important}
.rv-p .tx b{font-size:.98rem}.rv-p small{font-size:.8rem}
.rv-p .go{background:none!important;box-shadow:none!important;padding:0!important;color:#B8473D;font-size:1.1rem}
.rv-p i.go{background:currentColor!important;flex:none}
/* plan du jour */
.rv-p.plan{background:color-mix(in srgb,var(--c) 7%,var(--card));border-color:color-mix(in srgb,var(--c) 40%,var(--line));box-shadow:0 3px 0 color-mix(in srgb,var(--c) 30%,var(--line))}
.rv-p.plan .h-ico{background:color-mix(in srgb,var(--c) 18%,var(--card));color:var(--c)}
.rv-p.plan small{color:var(--soft);line-height:1.35}
.rv-p .mn{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;font-size:.72rem;font-weight:800;color:var(--c);margin-bottom:2px}
.rv-p .mn i{width:.95em;height:.95em}
.rv-p.plan i.go{color:var(--c)}
.rv-st.st-r{background:color-mix(in srgb,#E8892B 16%,var(--card));color:#9A5410;border:1.5px solid #E8892B}


/* === Tuiles de réponse (défis, groupes, mode classe) — une seule définition des 4 couleurs, IDENTIQUES en clair et en sombre
   (le tableau du prof et le téléphone d'un élève peuvent être dans des thèmes différents) ; lettre/symbole blancs, contraste ≥ 4,5:1.
   A vert + feuille, B violet + étoile, C orange + lune, D bleu-vert + vagues. Le symbole est AU-DESSUS du texte, texte à l'horizontale.
   .damier (2 × 2) seulement quand toutes les réponses sont courtes ; sinon .lignes : une réponse par ligne, pleine largeur. */
:root{--rep-a:#2F8540;--rep-a-d:#1F5E2C;--rep-b:#7B3FD1;--rep-b-d:#5A2A9E;--rep-c:#B85A0D;--rep-c-d:#8A430A;--rep-d:#16788A;--rep-d-d:#0F5866}
.df-c.c0{background:var(--rep-a);box-shadow:0 5px 0 var(--rep-a-d)}.df-c.c1{background:var(--rep-b);box-shadow:0 5px 0 var(--rep-b-d)}
.df-c.c2{background:var(--rep-c);box-shadow:0 5px 0 var(--rep-c-d)}.df-c.c3{background:var(--rep-d);box-shadow:0 5px 0 var(--rep-d-d)}
.df-c.c0.pris{box-shadow:0 10px 0 var(--rep-a-d)}.df-c.c1.pris{box-shadow:0 10px 0 var(--rep-b-d)}.df-c.c2.pris{box-shadow:0 10px 0 var(--rep-c-d)}.df-c.c3.pris{box-shadow:0 10px 0 var(--rep-d-d)}
.df-c{flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;text-align:left;min-width:0}
.df-c>span:not(.sh):not(.df-mk){width:100%;min-width:0;word-break:normal;overflow-wrap:break-word;hyphens:manual}   /* jamais de mot coupé, sauf un mot plus long que la ligne */
.df-c .sh i{width:1.1em;height:1.1em;color:#fff}
.df-choix.lignes{grid-template-columns:1fr}
.df-choix.lignes .df-c{min-height:0;padding:10px 14px 12px}
.df-choix.damier .df-c{align-items:center;text-align:center}
.df-choix.damier .df-c>span:not(.sh):not(.df-mk){text-align:center}
/* bulles de réaction : fond crème dans les deux thèmes, donc texte foncé (lisible en sombre aussi) */
.df-bulle b{color:#2B2A3A}.df-bulle small{color:#5C5770}
/* zones de toucher ≥ 44 px (le dessin reste petit) */
.df-retire{width:44px;height:44px;background:radial-gradient(circle,var(--line) 0 12px,transparent 13px);margin:-10px -10px -10px -6px}
.df-j .df-retire{top:-8px;right:-8px;width:44px;height:44px;margin:0}
.rv-back{min-height:44px}
/* défi et séance de groupe : bouton rond des réactions flottant en bas à droite, menu vertical vers le haut (règles .df-fab plus haut) */
.df .df-bulles{inset:calc(70px + env(safe-area-inset-top)) 16px auto auto;align-items:flex-end;max-width:calc(100% - 32px)}
.df .df-bulle{left:auto!important;transform-origin:right center}
.df .df-bulle.sort{transform:translateX(30px) scale(.8)!important}
.cm.df.df-avec-reacs{padding-bottom:calc(100px + env(safe-area-inset-bottom))}   /* bouton 64 px + marges : la dernière tuile remonte toujours au-dessus */

/* réponses écartées (après avoir répondu, et à la correction) : teinte claire de leur couleur, texte foncé à plein contraste — pas d'opacité */
.df-c.c0{--c:var(--rep-a)}.df-c.c1{--c:var(--rep-b)}.df-c.c2{--c:var(--rep-c)}.df-c.c3{--c:var(--rep-d)}
/* opacité pleine pour les tuiles (contraste du texte blanc garanti) */
.df-c,.df-c:not(:disabled):hover{opacity:1}
.df-c.eteint{opacity:1;background:color-mix(in srgb,var(--c) 14%,var(--card));color:var(--ink);box-shadow:none;border-color:color-mix(in srgb,var(--c) 50%,var(--line))}
.df-c.eteint .sh{background:var(--c)}
.df-c.faux{opacity:1;background:color-mix(in srgb,var(--c) 14%,var(--card));color:var(--ink);box-shadow:none}
.df-c.faux .sh{background:var(--c)}
/* chrono (défis, mode classe) : les secondes dans une petite pastille sombre au centre de la barre — lisibles quand la barre s'est vidée
   (blanc sur le fond clair de la piste : 1,3:1 ; sur la pastille : ≥ 4,8:1 partout) */
.df-chrono b{inset:3px auto 3px 50%;transform:translateX(-50%);min-width:2.6em;padding:0 10px;border-radius:999px;background:rgba(30,20,50,.55);line-height:1;text-shadow:none}
/* correction du défi : la coche / Ogrelo qui pleure DANS la tuile, coin haut droit (ils dépassaient de la tuile et du bord de l'écran) */
.df-c .df-mk{top:8px;right:8px}
.df-c .df-mk.pleure{top:4px;right:4px}
/* barre du haut du défi : titre sur une ligne à 375 px même avec le bouton des réactions (plus de « Challenge your / friends ») */
.df .cm-top{gap:8px}
.df .cm-top>b{font-size:1.05rem;line-height:1.15}
.df .cm-top .df-son{margin-right:0}
/* mesure du damier (défi.js / classe.js) : pendant la mesure, aucun mot n'est coupé, pour voir s'il déborde d'une demi-tuile */
.df-choix.mesure .df-c span{overflow-wrap:normal!important;word-break:normal!important}
/* une réponse par ligne : symbole en haut à gauche, texte aligné à gauche ; damier : symbole en haut, texte centré */
.df-choix.lignes .df-c{align-items:flex-start;text-align:left}.df-choix.lignes .df-c>span:not(.sh):not(.df-mk),.df-choix.lignes .df-c .tx{text-align:left}
.df-choix.damier .df-c .tx{text-align:center}
/* mini podium du défi : prénom en entier (plus de « Cousine Grog… »), chiffres foncés sur l'or et l'argent (blanc : 2,2:1) */
.df-mp>b{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:normal;line-height:1.15}
.df-mp.p1 .socle,.df-mp.p2 .socle,.df-pod.p1 .socle,.df-pod.p2 .socle{color:#2B2A3A}
/* « 16 pts » du défi en sombre : violet clair (le violet foncé tombait à 2,7:1 sur le fond sombre) */
:root[data-theme="dark"] .df-pts{color:#B18AF5}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .df-pts{color:#B18AF5}}
/* verts « +15 », « Série de 2… », « ↑ 1 » en sombre : vert clair lisible (le vert foncé tombait sous 4,5:1) */
:root[data-theme="dark"] .df-res small,:root[data-theme="dark"] .df-mp .plus,:root[data-theme="dark"] .df-mv.up,:root[data-theme="dark"] .df-mp.moi>b,:root[data-theme="dark"] .df-l .plus{color:#5FD08E}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .df-res small,:root:not([data-theme="light"]) .df-mp .plus,:root:not([data-theme="light"]) .df-mv.up,:root:not([data-theme="light"]) .df-mp.moi>b,:root:not([data-theme="light"]) .df-l .plus{color:#5FD08E}}
/* pendant la question : les bulles reçues passent au-dessus de la question, 2 au plus (jamais sur les tuiles ni le chrono) */
.df.df-en-q .df-bulles{top:calc(150px + env(safe-area-inset-top))}
.df.df-en-q .df-bulle:not(:nth-last-child(-n+2)){display:none}
/* jamais de texte coupé par « … » : titres des quiz du défi en entier ; prénoms des tuiles du salon sans couper un mot */
.df-t b{display:block;-webkit-line-clamp:none;overflow:visible}
.df-j .nm{word-break:normal;overflow-wrap:break-word}

/* ---------- invités des parties en direct (conversion.js, defi.js, classe.js) : sortir de la partie, garder ses points en créant son compte ---------- */
.iv{margin:18px 0 6px;text-align:left}
.iv-fin{background:var(--card);border:2px solid var(--line);border-radius:22px;padding:16px}
.iv-h{display:flex;align-items:center;gap:12px;margin-bottom:12px}.iv-h b{display:block;font-family:var(--display);font-size:1.1rem;line-height:1.2;color:var(--ink)}.iv-h small{display:block;color:var(--soft);font-size:.86rem;margin-top:2px}
.iv-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--ogre) 18%,transparent);color:var(--ogre-d);flex:none}
.iv-q{margin:0 0 8px;font-weight:700;color:var(--ink)}
.iv-roles{display:grid;gap:8px}
.iv-role{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;text-align:left;font:inherit;color:var(--ink);background:var(--paper);border:2px solid var(--line);border-radius:16px;padding:10px 12px;cursor:pointer}
.iv-role:hover,.iv-role:focus-visible{border-color:var(--ogre)}.iv-role:disabled{opacity:.6;cursor:wait}
.iv-role .tx{flex:1;min-width:0}.iv-role b{display:block;font-size:1rem}.iv-role small{display:block;color:var(--soft);font-size:.82rem;line-height:1.3}
.iv-role .go{color:var(--soft);flex:none}
.iv-ri{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--card);border:2px solid var(--line);flex:none}
.iv-err{color:var(--ko-t,#B8322A);min-height:0;margin:6px 0 0;font-size:.9rem}
.iv-parent p{margin:10px 0 12px;color:var(--ink);line-height:1.45}
.iv-bientot{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.85rem;color:var(--ogre-d);background:color-mix(in srgb,var(--ogre) 16%,transparent);border-radius:999px;padding:4px 10px}
.iv-retour{display:inline-flex;align-items:center;gap:6px;margin-top:8px}
.iv-salon{text-align:center;margin-top:14px}.iv-salon .iv-corps{text-align:left;margin-top:8px}.iv-ouvrir{display:inline-flex;align-items:center;gap:6px;font-size:.92rem}
.iv-note{color:var(--soft);font-size:.86rem;margin:0 0 10px}
.iv-accueil{display:flex;align-items:center;gap:12px;background:color-mix(in srgb,var(--ogre) 12%,var(--card));border:2px solid color-mix(in srgb,var(--ogre) 40%,transparent);border-radius:18px;padding:12px 14px;margin:0 0 14px}
.iv-accueil p{margin:0;font-weight:600;color:var(--ink);line-height:1.35}
.iv-toast{position:fixed;left:50%;top:max(14px,env(safe-area-inset-top));transform:translateX(-50%);z-index:10000;display:flex;align-items:center;gap:10px;width:min(420px,calc(100vw - 32px));box-sizing:border-box;background:var(--card);color:var(--ink);border:2px solid var(--line);border-radius:18px;padding:10px 14px;box-shadow:0 10px 30px rgba(0,0,0,.18);transition:opacity .4s}
.iv-toast.out{opacity:0}
/* barre « Quitter la partie » (téléphone de l'élève au quiz en direct) et liens de sortie */
.iv-barre{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.iv-barre .iv-code{font-weight:700;color:var(--soft);font-size:.9rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.iv-sorties{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:10px}
.iv-sorties .linkbtn2,.iv-sorties a{display:inline-flex;align-items:center;gap:6px}
/* confirmation (Quitter la partie ?) */
.iv-conf-fond{position:fixed;inset:0;z-index:400;background:rgba(20,18,30,.55);display:flex;align-items:flex-end;justify-content:center;padding:16px}
@media (min-width:700px){.iv-conf-fond{align-items:center}}
.iv-conf{width:100%;max-width:400px;background:var(--card);color:var(--ink);border-radius:24px;padding:22px 18px 18px;text-align:center;box-shadow:0 20px 50px rgba(0,0,0,.3)}
.iv-conf h2{font-family:var(--display);font-size:1.25rem;margin:0 0 6px}.iv-conf p{margin:0 0 16px;color:var(--soft)}
.iv-conf-b{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.iv-conf-b .btn{width:100%;margin:0}
.iv-conf-b .btn.alt{background:var(--card);color:var(--ink);border:2px solid var(--line);box-shadow:0 4px 0 var(--line)}
.iv-conf-b .btn.ko{background:#C9443A;box-shadow:0 4px 0 #8E2C24;color:#fff}
body.cl-tel .cl-tel-z>.iv-barre{position:relative;z-index:45}   /* au-dessus de l'écran plein « juste / raté » : la croix reste toujours visible */
.cl-tel-z:has(.cl-res) .iv-code{visibility:hidden}

/* ---------- Défi entre amis : couleur violette (distincte du vert d'Ogrelo et de l'or du brevet), façon Duolingo ----------
   tuiles pleines, ombre PLEINE dessous plus foncée, l'appui fait descendre la tuile. Mêmes jetons pour le menu d'Ogrelo et la carte gtDefi. */
:root{--dfv:#8E44EC;--dfv2:#A66BFF;--dfv-d:#6A2FC0;--dfv-grad:linear-gradient(150deg,#A66BFF 0%,#8E44EC 55%,#7F37E0 100%)}
.df-tete{background:var(--dfv-grad);border-radius:22px;padding:18px 14px 12px;margin:2px 0 18px;box-shadow:0 5px 0 var(--dfv-d)}
.df-tete .og-dit{margin:0}
.df-tete .og-dit>.f{width:64px;height:64px;filter:drop-shadow(0 3px 0 rgba(0,0,0,.18))}
.df-tete .og-bulle p+p{margin-top:6px}
.df-tete .og-bulle p:not(:first-child){font-size:1.04rem}
.df-tete .og-bulle b{font-family:var(--display);font-size:1.12rem;line-height:1.25}
.df-gros{transition:transform .08s ease,box-shadow .08s ease}
.df-gros.lancer{background:var(--dfv-grad);box-shadow:0 6px 0 var(--dfv-d);min-height:84px;padding:16px 16px 16px 14px;margin-bottom:22px}
.df-gros.lancer .i{width:52px;height:52px;border-radius:16px;background:rgba(255,255,255,.24);box-shadow:inset 0 -3px 0 rgba(0,0,0,.12)}
.df-gros.lancer .tx{flex:1;min-width:0}
.df-gros.lancer b{font-size:1.25rem;line-height:1.2}
.df-gros.lancer .go{color:#fff;opacity:.85;font-size:1.1rem}
.df-gros.lancer:active{transform:translateY(5px);box-shadow:0 1px 0 var(--dfv-d)}
.df-rej2{border:2px solid color-mix(in srgb,var(--dfv) 30%,var(--line));border-radius:22px;padding:16px;box-shadow:0 5px 0 color-mix(in srgb,var(--dfv) 35%,var(--line))}
.df-rej2>b{font-family:var(--display);font-size:1.08rem;margin-bottom:12px}
.df-cases{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:7px;cursor:text}
.df-cases input{position:absolute;inset:0;width:100%;height:100%;opacity:0;border:0;padding:0;font-size:16px;color:transparent;caret-color:transparent;background:transparent;z-index:1}
.df-case{height:54px;border-radius:14px;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:1.6rem;color:var(--ink);
  background:var(--paper);border:2px solid var(--line);box-shadow:0 4px 0 var(--line);transition:transform .08s ease,border-color .1s,box-shadow .1s}
.df-case.plein{border-color:color-mix(in srgb,var(--dfv) 55%,var(--line));box-shadow:0 4px 0 color-mix(in srgb,var(--dfv) 55%,var(--line));color:var(--dfv-d)}
.df-case.ici{border-color:var(--dfv);box-shadow:0 4px 0 var(--dfv-d);transform:translateY(-2px)}
.df-case.ici:empty::after{content:"";width:2px;height:24px;background:var(--dfv);animation:dfCurseur 1s steps(1) infinite}
@keyframes dfCurseur{50%{opacity:0}}
.df-go3{display:block;width:100%;min-height:54px;margin:18px 0 0;border:0;border-radius:16px;font:inherit;font-family:var(--display);font-weight:800;font-size:1.2rem;letter-spacing:.02em;cursor:pointer;
  color:color-mix(in srgb,var(--ink) 45%,transparent);background:color-mix(in srgb,var(--line) 70%,var(--card));box-shadow:0 5px 0 color-mix(in srgb,var(--line) 100%,#000 8%);transition:transform .08s ease,box-shadow .08s ease}
.df-go3.pret{color:#fff;background:var(--dfv-grad);box-shadow:0 5px 0 var(--dfv-d)}
.df-go3:active{transform:translateY(4px);box-shadow:0 1px 0 var(--dfv-d)}
.df-rej2 .df-err:empty{display:none}
/* salon : le code à partager, la carte « Défie tes amis » des révisions, le lien sous un chapitre : même violet */
.df-pin,.rv-defi,.rv-moyen.defi{background:var(--dfv-grad)!important;box-shadow:0 5px 0 var(--dfv-d)!important}
.df-pin:active,.rv-defi:active{box-shadow:0 2px 0 var(--dfv-d)!important}
.df-pin.copie .cp{color:var(--dfv-d)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .df-case.plein{color:#D9C2FF}}
:root[data-theme="dark"] .df-case.plein{color:#D9C2FF}
@media (prefers-reduced-motion: reduce){.df-case.ici:empty::after{animation:none}.df-gros,.df-go3,.df-case{transition:none}}

/* ---------- chargeur du quiz (défi) : Ogrelo parle, 4 cartes se mélangent, la barre avance ; violet du défi, clair et sombre ---------- */
.df-charge{display:flex;flex-direction:column;gap:22px;padding:14px 2px 8px}
.df-paquet{position:relative;height:118px;margin:4px auto 0;width:220px}
.df-carte{position:absolute;left:50%;top:10px;width:70px;height:94px;margin-left:-35px;border-radius:16px;display:grid;place-items:center;font-size:1.7rem;color:#fff;
  background:var(--dfv-grad);box-shadow:0 5px 0 var(--dfv-d);animation:dfMelange 2.4s cubic-bezier(.5,0,.3,1) infinite}
.df-carte.c1{background:linear-gradient(150deg,#4FC3F7,#1F8FD8);box-shadow:0 5px 0 #136AA6;animation-delay:-.6s}
.df-carte.c2{background:linear-gradient(150deg,#FFC23A,#EC820C);box-shadow:0 5px 0 #B85F00;animation-delay:-1.2s}
.df-carte.c3{background:linear-gradient(150deg,#7DDB5A,#3FA535);box-shadow:0 5px 0 #2B7A24;animation-delay:-1.8s}
@keyframes dfMelange{
  0%{transform:translateX(-78px) rotate(-12deg);z-index:1}
  25%{transform:translateX(-26px) rotate(-4deg) translateY(-10px);z-index:2}
  50%{transform:translateX(26px) rotate(4deg);z-index:3}
  75%{transform:translateX(78px) rotate(12deg) translateY(-6px);z-index:2}
  100%{transform:translateX(-78px) rotate(-12deg);z-index:1}}
.df-charge .og-dit{margin:0}
.df-charge .og-bulle b{font-family:var(--display);font-size:1.1rem}
.df-ligne{min-height:2.8em}
.df-ligne.vient{animation:dfLigne .45s ease both}
@keyframes dfLigne{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.df-barre{height:16px;border-radius:999px;background:color-mix(in srgb,var(--line) 80%,var(--card));box-shadow:inset 0 2px 0 rgba(0,0,0,.06);overflow:hidden;margin:0 6px}
.df-barre i{display:block;height:100%;width:4%;border-radius:inherit;background:var(--dfv-grad);box-shadow:inset 0 -4px 0 rgba(0,0,0,.12),inset 0 4px 0 rgba(255,255,255,.25);transition:width .5s linear}
@media (prefers-reduced-motion: reduce){
  .df-carte{animation:none}.df-carte.c0{transform:translateX(-78px) rotate(-10deg)}.df-carte.c1{transform:translateX(-26px) rotate(-3deg)}.df-carte.c2{transform:translateX(26px) rotate(3deg)}.df-carte.c3{transform:translateX(78px) rotate(10deg)}
  .df-ligne.vient{animation:none}.df-barre i{transition:none}}
/* quiz prêts à jouer (banques) en tête du choix */
.df-banque-ch{display:flex;justify-content:center;padding:14px 0}
.df-banque .df-t.banque .i{background:color-mix(in srgb,var(--dfv) 16%,var(--card));color:var(--dfv-d)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .df-banque .df-t.banque .i{color:#D9C2FF}}
:root[data-theme="dark"] .df-banque .df-t.banque .i{color:#D9C2FF}
.df-plus{display:block;margin:10px auto 0}
/* défi : bulle et mascotte sans fond violet ; « Rejoindre avec un code » sur un violet très clair (aussi en sombre) */
.df-tete{background:none!important;box-shadow:none!important;padding:0!important}
.df-rej2,.df-rej{background:#F3ECFF!important;color:#2A1A4A}
.df-rej2>b,.df-rej>b{color:#4B2A8C!important}
.df-rej2 input,.df-rej input,.df-code-in input{background:#fff!important;color:#2A1A4A!important}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .df-rej2,:root:not([data-theme="light"]) .df-rej{background:#E9DDFF!important;border-color:#B794F6!important;box-shadow:0 5px 0 #7C4DCC!important}}
:root[data-theme="dark"] .df-rej2,:root[data-theme="dark"] .df-rej{background:#E9DDFF!important;border-color:#B794F6!important;box-shadow:0 5px 0 #7C4DCC!important}
/* défi : la zone du code est « creusée » (ombre intérieure), comme un trou dans la carte */
.df-code-in input,.df-rej2 input,.df-rej input{background:#FBF8FF!important;border:2px solid #CDB8F2!important;box-shadow:inset 0 4px 0 rgba(74,40,140,.16),inset 0 2px 8px rgba(74,40,140,.18)!important}
.df-code-in input:focus,.df-rej2 input:focus,.df-rej input:focus{outline:none;border-color:#8E44EC!important;box-shadow:inset 0 4px 0 rgba(74,40,140,.2),inset 0 2px 8px rgba(74,40,140,.22),0 0 0 3px rgba(142,68,236,.25)!important}
/* défi : couleurs de la marque (décision du fondateur, 25/10/2026) — code de la partie et accents en vert moyen (--ogre),
   vert foncé réservé au bouton « C est parti » ; les quatre tuiles de réponse gardent leurs couleurs (repères des réponses) */
.df-pin,.df-gros.lancer,.df-reacs,.df-fab-b{background:var(--ogre,#5BA84A)!important;box-shadow:0 5px 0 var(--ogre-d,#3E7F31)!important}
.df-reacs{box-shadow:0 -8px 24px color-mix(in srgb,var(--ogre,#5BA84A) 35%,transparent)!important}
.df-chrono i{background:var(--ogre,#5BA84A)!important}
.df-av{background:color-mix(in srgb,var(--ogre,#5BA84A) 22%,var(--card))!important;color:var(--ogre-d,#3E7F31)!important}
.df-decompte b,.df-pts,.df-rv-t,.df-seg button.on small{color:var(--ogre-d,#3E7F31)!important}
.df-gen{background:color-mix(in srgb,var(--ogre,#5BA84A) 7%,var(--card))!important;border-color:color-mix(in srgb,var(--ogre,#5BA84A) 30%,var(--line))!important;box-shadow:0 4px 0 color-mix(in srgb,var(--ogre,#5BA84A) 20%,var(--line))!important}
.df-t.pret .i{background:var(--ogre,#5BA84A)!important;box-shadow:0 3px 0 var(--ogre-d,#3E7F31)!important}
.df-seg button.on{border-color:var(--ogre,#5BA84A)!important;background:color-mix(in srgb,var(--ogre,#5BA84A) 12%,var(--card))!important;box-shadow:0 3px 0 var(--ogre-d,#3E7F31)!important}
.df-pseudo input:focus{border-color:var(--ogre,#5BA84A)!important}
.df-pin.copie .cp,.df-prop-go{color:var(--ogre-d,#3E7F31)!important}
.df-go,.df .df-go#dfStart{background:var(--ogre-d,#3E7F31)!important;box-shadow:0 5px 0 #2C5E23!important}
.df-code-in input:focus,.df-rej2 input:focus,.df-rej input:focus{border-color:var(--ogre,#5BA84A)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--ogre,#5BA84A) 25%,transparent)!important}
/* classements du défi plus vifs (décision du fondateur, 25/10/2026) : or chaud, argent bleuté, bronze cuivré en dégradés ;
   pastille de rang colorée, ma ligne en vert de la marque, flèches vert / corail ; jamais de violet */
.df-pod.p1 .socle,.df-mp.p1 .socle{background:linear-gradient(180deg,#FFCF4A 0%,#F2A900 55%,#D98E00 100%)!important;box-shadow:0 4px 0 #A86E00,inset 0 2px 0 rgba(255,255,255,.45)!important;color:#4A3200!important}
.df-pod.p2 .socle,.df-mp.p2 .socle{background:linear-gradient(180deg,#E3ECF7 0%,#B4C3D6 55%,#8FA2BA 100%)!important;box-shadow:0 4px 0 #6D7F97,inset 0 2px 0 rgba(255,255,255,.6)!important;color:#23324A!important}
.df-pod.p3 .socle,.df-mp.p3 .socle{background:linear-gradient(180deg,#F2A877 0%,#D27A45 55%,#B05E2E 100%)!important;box-shadow:0 4px 0 #874420,inset 0 2px 0 rgba(255,255,255,.4)!important;color:#3D1A06!important}
.df-mp .socle small{opacity:1!important}
.df-l{position:relative;overflow:hidden}
.df-l .r{width:28px!important;height:28px;flex:none;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,#1F8E9E 16%,var(--card));color:#16707D!important;font-size:.9rem}
.df-l:nth-child(2n) .r{background:color-mix(in srgb,#E2721B 16%,var(--card));color:#A3500F!important}
.df-l:nth-child(3n) .r{background:color-mix(in srgb,#2F7FD1 16%,var(--card));color:#1F5E9E!important}
.df-l.moi{border-color:var(--ogre)!important;background:color-mix(in srgb,var(--ogre) 16%,var(--card))!important;box-shadow:0 3px 0 var(--ogre-d)}
.df-l.moi .r{background:var(--ogre-d)!important;color:#fff!important}
.df-l b{color:var(--ogre-d)}
.df-mv.down{background:color-mix(in srgb,#FF6B57 18%,var(--card))!important;color:#C2412F!important}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .df-l .r{color:#7FD3DE!important}:root:not([data-theme="light"]) .df-l:nth-child(2n) .r{color:#F2A766!important}:root:not([data-theme="light"]) .df-l:nth-child(3n) .r{color:#8DB6F0!important}:root:not([data-theme="light"]) .df-l b{color:#8FD07E}:root:not([data-theme="light"]) .df-mv.down{color:#FF9A8A!important}}
:root[data-theme="dark"] .df-l .r{color:#7FD3DE!important}:root[data-theme="dark"] .df-l:nth-child(2n) .r{color:#F2A766!important}:root[data-theme="dark"] .df-l:nth-child(3n) .r{color:#8DB6F0!important}:root[data-theme="dark"] .df-l b{color:#8FD07E}:root[data-theme="dark"] .df-mv.down{color:#FF9A8A!important}
/* défi, écran de question (fondateur, 25/10/2026) : carte de question nette, 4 grandes tuiles aux couleurs franches mais profondes
   avec leur forme (triangle, losange, cercle, carré), relief façon Duolingo, chrono discret ; code de la partie en vert profond */
.df{--rep-a:#C2364A;--rep-a-d:#8E2335;--rep-b:#2563A8;--rep-b-d:#1A4778;--rep-c:#A8690F;--rep-c-d:#7A4C0A;--rep-d:#2E7D46;--rep-d-d:#1F5A31}
.df-haut{font-size:.82rem;margin-bottom:10px}
.df-chrono{height:10px!important;margin:0 44px 22px 0!important;background:color-mix(in srgb,var(--ink) 10%,transparent)!important;overflow:visible!important;animation:none!important}
.df-chrono i{background:var(--ogre-d,#3E7F31)!important;border-radius:999px}
.df-chrono.urgent i{background:#C2364A!important}
.df-chrono b{inset:auto!important;left:calc(100% + 10px)!important;top:50%!important;transform:translateY(-50%)!important;background:none!important;color:var(--ink)!important;font-size:.95rem!important;padding:0!important;min-width:0!important;text-shadow:none!important}
.df-q{background:var(--card)!important;border:2px solid var(--line)!important;border-radius:22px!important;padding:22px 16px!important;margin-bottom:22px!important;font-size:1.3rem!important;box-shadow:0 4px 0 var(--line)!important}
.df-choix{gap:14px!important}
.df-c{min-height:96px;border-radius:20px!important;font-size:1.05rem;font-weight:800;color:#fff!important;opacity:1!important;border-width:3px}
.df-c .sh{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.2)!important;display:grid;place-items:center}
.df-c .sh svg{width:20px;height:20px;fill:#fff}
.df-c.c0{box-shadow:0 4px 0 var(--rep-a-d)}.df-c.c1{box-shadow:0 4px 0 var(--rep-b-d)}.df-c.c2{box-shadow:0 4px 0 var(--rep-c-d)}.df-c.c3{box-shadow:0 4px 0 var(--rep-d-d)}
.df-c.eteint,.df-c.faux{color:var(--ink)!important}
.df-pin{background:#4A8F3C!important;box-shadow:0 5px 0 #33692A!important}
/* défi : correction compacte + classement provisoire (sans podium) entre deux questions — fondateur, 25/10/2026 */
.df-corr{margin-bottom:6px}
.df-q.petit{position:relative;padding:14px 46px 14px 14px!important;font-size:1.05rem!important;margin-bottom:12px!important}
.df-q .sig-btn{position:absolute;top:8px;right:8px}
.df-bonne{display:flex;align-items:center;gap:10px;margin:0 0 8px;padding:10px 12px;border-radius:16px;background:var(--rep-d,#2E7D46);color:#fff;font-weight:800;box-shadow:0 4px 0 var(--rep-d-d,#1F5A31)}
.df-bonne .sh{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.2);display:grid;place-items:center;flex:none}
.df-bonne .sh svg{width:16px;height:16px;fill:#fff}.df-bonne>span{flex:1}.df-bonne .gi-check{width:20px;height:20px}
.df-tienne{margin:0 0 6px;color:var(--soft);font-weight:700;font-size:.9rem}.df-tienne span{color:var(--ink)}
.df-cl-t{margin:16px 0 8px;font-family:var(--display);font-size:1.05rem}
.df-prov{margin-top:0!important;gap:8px!important}
.df-prov .df-l{padding:8px 12px;border-radius:16px}
.df-prov .df-l .df-av{width:36px;height:36px}
.df-prov .df-l .n{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.df-gain{font-weight:800;font-size:.78rem;color:var(--ogre-d,#3E7F31);background:color-mix(in srgb,var(--ogre,#5BA84A) 14%,var(--card));border-radius:999px;padding:2px 7px}
.df-prov .df-l.rg1 .r{background:linear-gradient(180deg,#FFCF4A,#E09A00)!important;color:#4A3200!important}
.df-prov .df-l.rg2 .r{background:linear-gradient(180deg,#E3ECF7,#9FB0C6)!important;color:#23324A!important}
.df-prov .df-l.rg3 .r{background:linear-gradient(180deg,#F2A877,#C46A36)!important;color:#3D1A06!important}
.df-prov .df-l.moi .r{box-shadow:0 0 0 2px var(--ogre-d,#3E7F31)}
.df-prov .df-mv{margin-left:auto}
.df-prov .df-l.monte{animation:cmIn .35s ease}
@media (prefers-reduced-motion:reduce){.df-prov .df-l.monte{animation:none}}
/* entre deux questions : la question, la bonne réponse en relief avec sa coche (les autres atténuées), puis le classement */
.df-choix-rev{gap:10px!important;margin-bottom:6px}
.df-choix-rev .df-c{min-height:58px!important;padding:8px 10px!important;font-size:.92rem;animation:none!important}
.df-choix-rev .df-c.bon{transform:translateY(-3px);border-color:#fff!important;box-shadow:0 5px 0 var(--rep-d-d,#1F5A31),0 0 0 3px var(--ogre,#5BA84A)!important}
.df-choix-rev .df-c.eteint,.df-choix-rev .df-c.faux{box-shadow:none!important;transform:none}
.df-choix-rev .df-c .df-mk{top:6px;right:6px;width:24px;height:24px}
/* défi : couleurs Kahoot saturées, texte et forme en blanc gras ; à la correction, bonne tuile pleine + coche, les autres atténuées mais lisibles */
.df{--rep-a:#F01E46;--rep-a-d:#A8102C;--rep-b:#1672F0;--rep-b-d:#0B4BA8;--rep-c:#FFBF00;--rep-c-d:#B98A00;--rep-d:#1F9E0F;--rep-d-d:#136608}
.df-c.c0{background:#F01E46!important}.df-c.c1{background:#1672F0!important}.df-c.c2{background:#FFBF00!important}.df-c.c3{background:#1F9E0F!important}
.df-c,.df-c span,.df-c .tx{color:#fff!important;font-weight:800!important}
.df-c.c2,.df-c.c2 span,.df-c.c2 .tx{color:#2B1D00!important}.df-c.c2 .sh svg{fill:#2B1D00!important}   /* jaune vif : texte foncé, le blanc ne se lit pas */
.df-c span,.df-c .tx{text-shadow:0 1px 1px rgba(0,0,0,.25)}.df-c.c2 span,.df-c.c2 .tx{text-shadow:none}
.df-c .sh svg{fill:#fff!important}
.df-c.eteint,.df-c.faux,.df-choix-rev .df-c.eteint,.df-choix-rev .df-c.faux{opacity:1!important;filter:saturate(.3) brightness(.78)}   /* atténuées sans transparence : le texte reste lisible sur fond clair */
.df-choix-rev .df-c.bon{opacity:1!important;filter:none}
/* pastilles or / argent / bronze du classement provisoire : numéro toujours lisible (les règles sombres par ligne étaient plus fortes) */
.df .df-prov .df-l.rg1.rg1 .r{background:linear-gradient(180deg,#FFCF4A,#E09A00)!important;color:#3A2700!important}
.df .df-prov .df-l.rg2.rg2 .r{background:linear-gradient(180deg,#E3ECF7,#9FB0C6)!important;color:#1B2840!important}
.df .df-prov .df-l.rg3.rg3 .r{background:linear-gradient(180deg,#F2A877,#C46A36)!important;color:#2E1203!important}

/* défi (25/10) : bloc question sur fond vert profond, texte blanc ; minuteur bien visible ; avancée des questions sur l écran de correction ; drapeau dans la barre du haut */
.df .df-q{background:linear-gradient(135deg,#1F4D2B,#2E6B3A)!important;border:0!important;box-shadow:0 4px 0 #143620!important;color:#fff!important}
.df .df-q *{color:#fff!important}
.df-chrono{height:14px!important;background:color-mix(in srgb,var(--ink) 12%,transparent)!important}
.df-chrono i{background:linear-gradient(90deg,#2FBF4A,#7BE05A)!important;box-shadow:inset 0 -3px 0 rgba(0,0,0,.15)}
.df-chrono.urgent i{background:linear-gradient(90deg,#F01E46,#FF7A00)!important}
.df-chrono b{font-weight:800!important}
.df-avance{height:10px;border-radius:999px;background:color-mix(in srgb,var(--ink) 12%,transparent);overflow:hidden;margin:2px 0 16px}
.df-avance i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2FBF4A,#7BE05A)}
.df-q.petit{padding:14px!important}
.cm-top .df-sig{margin-left:auto;display:inline-flex}.cm-top .df-sig+.df-son{margin-left:8px}

/* « Un ami t’a donné un code ? » (défis, groupes) : panneau vert de la marque au lieu du violet ; en sombre, vert profond lumineux */
html .df-rej,html .df-rej2{background:linear-gradient(135deg,#EAF7E3 0%,#D7F0CB 100%)!important;border:2px solid #9FD58C!important;box-shadow:0 5px 0 #6FB65A!important;color:#1E3A16}
html .df-rej>b,html .df-rej2>b{color:#2C6B22!important}
html .df-rej input,html .df-rej2 input,html .df-code-in input{background:#fff!important;color:#1E3A16!important;border:2px solid #A9D99A!important;box-shadow:inset 0 3px 0 rgba(44,107,34,.10)!important}
html .df-rej input::placeholder,html .df-rej2 input::placeholder{color:#8FB386}
html .df-rej input:focus,html .df-rej2 input:focus,html .df-code-in input:focus{outline:none;border-color:#3E9B32!important;box-shadow:0 0 0 3px rgba(62,155,50,.28)!important}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .df-rej,:root:not([data-theme="light"]) .df-rej2{background:radial-gradient(120% 140% at 0% 0%,#2F6B29 0%,#1B3F1A 55%,#132E14 100%)!important;border-color:#3F8A36!important;box-shadow:0 5px 0 #0C1F0D!important;color:#EAF6E2}
  :root:not([data-theme="light"]) .df-rej>b,:root:not([data-theme="light"]) .df-rej2>b{color:#BFF0AE!important}
  :root:not([data-theme="light"]) .df-rej input,:root:not([data-theme="light"]) .df-rej2 input,:root:not([data-theme="light"]) .df-code-in input{background:#0F2410!important;color:#F1FBEC!important;border-color:#4C9A41!important;box-shadow:inset 0 3px 0 rgba(0,0,0,.35)!important}
  :root:not([data-theme="light"]) .df-rej input::placeholder,:root:not([data-theme="light"]) .df-rej2 input::placeholder{color:#6F9A66}}
:root[data-theme="dark"] .df-rej,:root[data-theme="dark"] .df-rej2{background:radial-gradient(120% 140% at 0% 0%,#2F6B29 0%,#1B3F1A 55%,#132E14 100%)!important;border-color:#3F8A36!important;box-shadow:0 5px 0 #0C1F0D!important;color:#EAF6E2}
:root[data-theme="dark"] .df-rej>b,:root[data-theme="dark"] .df-rej2>b{color:#BFF0AE!important}
:root[data-theme="dark"] .df-rej input,:root[data-theme="dark"] .df-rej2 input,:root[data-theme="dark"] .df-code-in input{background:#0F2410!important;color:#F1FBEC!important;border-color:#4C9A41!important;box-shadow:inset 0 3px 0 rgba(0,0,0,.35)!important}
:root[data-theme="dark"] .df-rej input::placeholder,:root[data-theme="dark"] .df-rej2 input::placeholder{color:#6F9A66}

/* décompte des quiz à plusieurs (decompte.js) : la tête de Grignon, un anneau qui se vide, le chiffre, puis « C'est parti ! ». Rien ne clignote, aucun fond plein */
.dc{--dc-t:clamp(84px,min(24vw,13vh),140px);--dc-c:clamp(168px,min(48vw,38vh),340px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center}
.pa-rebours.dc{min-height:72vh}.dc .dc-h,.dc .dc-b{max-width:100%;color:var(--soft,#6b6b6b)}.dc .dc-h{margin:0;font-weight:800}.dc small.dc-b{margin-top:6px}
.dc-tete{display:block;width:var(--dc-t);height:var(--dc-t);transform-origin:50% 90%}.dc-tete svg{display:block;width:100%;height:100%}
.dc-cadran{position:relative;display:grid;place-items:center;width:var(--dc-c);height:var(--dc-c);border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--ogre,#5BA84A) 15%,transparent),transparent)}
.dc-anneau{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);overflow:visible;transition:opacity .25s ease}.dc-anneau circle{fill:none;stroke-width:7}
.dc-fond{stroke:color-mix(in srgb,var(--ogre,#5BA84A) 20%,transparent)}.dc-v{stroke:var(--ogre,#5BA84A);stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:0;transition:stroke-dashoffset .1s linear}
.dc b.dc-n{position:relative;font-family:var(--display);font-size:calc(var(--dc-c)*.52);line-height:1;color:var(--ogre-d,#3E7F31);font-variant-numeric:tabular-nums}
.dc.go .dc-anneau{opacity:0}.dc.go b.dc-n{position:absolute;left:50%;top:50%;translate:-50% -50%;font-size:clamp(2.3rem,min(11vw,9vh),4.4rem);white-space:nowrap}
.dc-eclat{position:absolute;left:50%;top:50%;width:20px;height:20px;margin:-10px;opacity:0;fill:var(--or,#F5B800)}.dc-eclat:nth-of-type(odd){fill:var(--ogre,#5BA84A)}
.dc.go .dc-eclat{animation:dcEclat .75s ease-out both}
.dc-entre{animation:dcChiffre .38s cubic-bezier(.2,.8,.2,1)}.dc-hop{animation:dcHop .46s ease-in-out}.dc-saut{animation:dcSaut .62s cubic-bezier(.2,.8,.2,1)}
@keyframes dcChiffre{0%{opacity:0;transform:scale(.72)}55%{opacity:1;transform:scale(1.06)}100%{opacity:1;transform:scale(1)}}
@keyframes dcHop{0%,100%{transform:none}35%{transform:translateY(-8px) rotate(-3deg)}70%{transform:rotate(2deg)}}
@keyframes dcSaut{0%{transform:none}40%{transform:translateY(-20px) scale(1.12)}100%{transform:none}}
@keyframes dcEclat{0%{opacity:0;transform:scale(.5)}35%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(1)}}
@media (max-height:520px){.dc{--dc-t:56px;--dc-c:124px;gap:4px}}
@media (prefers-reduced-motion:reduce){.dc-entre,.dc-hop,.dc-saut{animation:none}.dc-eclat,.dc.go .dc-eclat{display:none}.dc-v,.dc-anneau{transition:none}}
:root[data-theme="dark"] .dc b.dc-n{color:var(--ogre,#6DBF59)!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .dc b.dc-n{color:var(--ogre,#6DBF59)!important}}

/* Ogrelo · onglet « Cours » : matières → chapitres vus en classe → fiche du chapitre. Calme, aéré, une chose à la fois. */
.cz-liste{display:grid;gap:8px}
.cz-l{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;text-align:left;border:1.5px solid var(--line);background:var(--sheet,var(--paper));color:var(--ink);border-radius:16px;padding:10px 12px;font:inherit;cursor:pointer}
.cz-l .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.cz-l b{font-weight:800;line-height:1.25;overflow-wrap:anywhere}
.cz-l small{color:var(--soft);font-size:.88rem;line-height:1.3;overflow-wrap:anywhere}
.cz-l .go{color:var(--soft);flex:none}
.cz-li{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:1.15rem;background:color-mix(in srgb,var(--c) 16%,var(--card));color:color-mix(in srgb,var(--c) 75%,var(--ink))}
.cz-mute{color:var(--soft)}
.cz-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.cz-tag{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:3px 10px;font-size:.8rem;font-weight:800;background:color-mix(in srgb,var(--soft) 12%,var(--card));color:var(--ink)}
.cz-tag.now{background:color-mix(in srgb,var(--ogre) 18%,var(--card));color:var(--ogre-d,var(--ink))}
.cz-tag.ctl{background:color-mix(in srgb,#C2389E 14%,var(--card));color:#9C2479}
.cz-tag.ton{background:color-mix(in srgb,#1F78B8 14%,var(--card));color:#17639A}
.cz-tag.fg{background:color-mix(in srgb,var(--ogre) 16%,var(--card));color:var(--ogre-d,var(--ink))}
/* une seule ligne en haut : le contrôle qui arrive ; la tuile Brevet (3e) */
.cz-ctl,.cz-bv{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:2px solid color-mix(in srgb,var(--c,#C2389E) 40%,var(--line));background:color-mix(in srgb,var(--c,#C2389E) 8%,var(--card));color:var(--ink);border-radius:18px;padding:12px;margin:0 0 12px;font:inherit;cursor:pointer}
.cz-bv{--c:#C9443A}
.cz-ctl .i,.cz-bv .i{flex:none;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:1.2rem;background:var(--c,#C2389E);color:#fff}
.cz-ctl .tx,.cz-bv .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.cz-ctl small,.cz-bv small{color:var(--soft);overflow-wrap:anywhere}
.cz-ctl .go,.cz-bv .go{color:var(--soft)}
/* en bas : Défis · Mon groupe, discrets */
.cz-bas{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 6px}
.cz-mini{display:inline-flex;align-items:center;gap:6px;min-height:44px;border:1.5px solid var(--line);background:transparent;color:var(--soft);border-radius:999px;padding:8px 14px;font:inherit;font-weight:800;cursor:pointer}
/* autres cours (non rangés) */
.cz-h4{font-size:.95rem}
.cz-autres{display:grid;gap:6px}
.cz-a{border-left:3px solid var(--line);padding:6px 0 6px 12px;display:flex;flex-direction:column;gap:2px}
.cz-a b{font-weight:700;color:var(--ink);overflow-wrap:anywhere}.cz-a small{color:var(--soft);font-size:.85rem}
.cz-pjs{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.cz-pjb{display:inline-flex;align-items:center;gap:6px;min-height:36px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:10px;padding:4px 10px;font:inherit;font-size:.85rem;cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* sections repliées */
.cz-pli{margin:14px 0 0;border:1.5px solid var(--line);border-radius:16px;background:var(--sheet,var(--paper))}
.cz-pli>summary{list-style:none;display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer;min-height:48px}
.cz-pli>summary::-webkit-details-marker{display:none}
.cz-pli>summary .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.cz-pli>summary b{font-weight:800;color:var(--ink)}.cz-pli>summary small{color:var(--soft);font-size:.86rem;overflow-wrap:anywhere}
.cz-fl{color:var(--soft);transition:transform .2s}
.cz-pli[open]>summary .cz-fl{transform:rotate(180deg)}
.cz-pli>.cz-liste,.cz-pli>.cz-errs{padding:0 10px 12px}
.cz-pas .cz-l{min-height:48px}
.cz-plis{margin:8px 0 24px}
/* chapitre : étiquettes, documents du professeur, demande de photo */
.cz-ch-tags{display:flex;flex-wrap:wrap;gap:6px;margin:12px 2px 4px}
.cz-pieces{display:flex;gap:10px;overflow-x:auto;padding:8px 2px 4px;margin-bottom:6px}
.cz-pj{flex:none;width:132px;display:flex;flex-direction:column;gap:6px;border:0;background:none;padding:0;text-align:left;color:var(--ink);font:inherit;cursor:pointer}
.cz-pj .im,.cz-pj .ic{width:132px;height:84px;border-radius:12px;border:1.5px solid var(--line);background:var(--card);overflow:hidden;display:grid;place-items:center;color:var(--soft);font-size:1.4rem}
.cz-pj .im img{width:100%;height:100%;object-fit:cover}
.cz-pj small{font-weight:700;font-size:.82rem;line-height:1.25;color:var(--ink)}
.cz-demande{margin:10px 0 6px;padding:12px;border-radius:18px;background:color-mix(in srgb,var(--ogre) 8%,var(--card));border:1.5px solid color-mix(in srgb,var(--ogre) 30%,var(--line))}
.cz-demande .g-say{margin-bottom:10px}
.cz-dem-acts{display:flex;flex-wrap:wrap;gap:8px}.cz-dem-acts .btn{flex:1 1 140px;min-height:44px}
.cz-dem-acts label.busy{opacity:.6;pointer-events:none}
.cz-errs{display:grid;gap:8px}
.cz-err{border-radius:12px;background:var(--card);border:1.5px solid var(--line);padding:10px 12px}
.cz-err small{color:var(--soft);font-size:.82rem}.cz-err p{margin:4px 0 0;line-height:1.4}
.cz-err .ok{color:var(--ok-t)}.cz-err .cs{color:var(--soft)}
/* visionneuse d'un document du professeur */
.cz-view{position:fixed;inset:0;z-index:95;background:rgba(10,12,18,.92);display:flex;flex-direction:column}
.cz-view-h{display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top,0px)) 12px 10px 16px;color:#fff}
.cz-view-h b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cz-view-x{width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:1.2rem;cursor:pointer}
.cz-view-im{flex:1;overflow:auto;display:grid;place-items:center;padding:8px}
.cz-view-im img{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .cz-tag.ctl{color:#F49AD8}:root:not([data-theme="light"]) .cz-tag.ton{color:#8DB6F0}:root:not([data-theme="light"]) .cz-li{color:color-mix(in srgb,var(--c) 45%,#fff)}}
:root[data-theme="dark"] .cz-tag.ctl{color:#F49AD8}:root[data-theme="dark"] .cz-tag.ton{color:#8DB6F0}:root[data-theme="dark"] .cz-li{color:color-mix(in srgb,var(--c) 45%,#fff)}

/* ---------- barre du bas : Devoirs · Contrôles · Ogrelo · Cours · Moi — une ligne par libellé, de 320 px à 430 px, texte à 130 % ---------- */
.h-tab{min-width:0;font-size:.7rem;letter-spacing:0;line-height:1.15}
.h-tab .h-tl{display:block;max-width:100%;white-space:nowrap;overflow:visible}
@media (max-width:360px){.h-tab{font-size:.64rem}}
@media (max-width:330px){.h-tab{font-size:.6rem}.h-tab svg{width:22px;height:22px}}
.h-tab.mid{white-space:nowrap}
/* ---------- roue dentée (Réglages), en haut à droite ---------- */
.h-gear{position:absolute;top:calc(8px + env(safe-area-inset-top,0px));right:12px;z-index:3;width:44px;height:44px;border-radius:50%;border:0;display:grid;place-items:center;font-size:1.25rem;background:rgba(255,255,255,.88);color:#16304A;box-shadow:0 4px 10px rgba(0,0,0,.14);cursor:pointer}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-gear{background:#1B2242;color:#fff}}
:root[data-theme="dark"] .h-gear{background:#1B2242;color:#fff}
.rg-page{display:grid;gap:12px;padding-bottom:30px}
.rg-page .moi-regl{margin:0}
.rg-rap{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:1.5px solid var(--line);background:var(--sheet,var(--paper));color:var(--ink);border-radius:18px;padding:12px;font:inherit;cursor:pointer}
.rg-rap .i{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,#1F78B8 14%,var(--card));color:#1F78B8;font-size:1.15rem}
.rg-rap .tx{flex:1;min-width:0;display:flex;flex-direction:column}.rg-rap small{color:var(--soft)}
.mo-regl{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;margin:18px 0 8px;border:1.5px solid var(--line);background:transparent;color:var(--soft);border-radius:16px;padding:10px 14px;font:inherit;font-weight:800;cursor:pointer}
.mo-regl .gi-droite{margin-left:auto}
/* ---------- Moi : moyennes ---------- */
.mo-moy{padding:14px}
.mo-g{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.mo-g .l{font-weight:800;color:var(--soft)}.mo-g .v{font-family:var(--display);font-size:1.8rem;color:var(--ink)}.mo-g .v small{font-size:.9rem;color:var(--soft)}
.mo-g .v.bad,.mo-m b.bad{color:var(--t-crit,var(--ko-t))}
.mo-rang{color:var(--soft);font-weight:700}
.mo-mats{display:grid;gap:8px}
.mo-m{display:grid;grid-template-columns:32px minmax(0,1fr) 64px auto;align-items:center;gap:8px}
.mo-m .h-ico{width:32px;height:32px;font-size:1rem}
.mo-m .nm{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mo-m b{font-variant-numeric:tabular-nums;min-width:2.6em;text-align:right}
/* ---------- Contrôles ---------- */
.ct-l{display:flex;flex-direction:column;gap:4px}
.ct-old{padding:0 12px 10px}
/* devoirs passés : grisés, avec leur état */
.j-card.passe{opacity:.62;filter:saturate(.6)}
.rg-page .moi-regl>h3{display:none}
.ct-rev{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:2px 0 8px;border:1.5px solid var(--line);background:var(--sheet,var(--paper));color:var(--ink);border-radius:999px;padding:4px 14px 4px 6px;font:inherit;font-weight:800;cursor:pointer}
.ct-rev .f{width:32px;height:32px;display:grid;place-items:center}.ct-rev .f .ogre{width:30px;height:30px}
/* histoire d'un devoir passé */
.hs-pli .hs-in{padding:0 14px 14px;display:grid;gap:10px}
.hs-txt{white-space:pre-line;margin:0;line-height:1.45}
.hs-essai,.hs-conv{border:1.5px solid var(--line);border-radius:14px;padding:10px 12px;background:var(--card)}
.hs-essai.ok{border-color:color-mix(in srgb,var(--ok-t) 40%,var(--line))}
.hs-essai p,.hs-conv p{margin:4px 0}.hs-essai ul{margin:4px 0 0;padding-left:18px}
.hs-d{color:var(--soft);font-size:.88rem;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.hs-d b{color:var(--ink)}
.hs-res{line-height:1.45}.hs-ap span{display:block;color:var(--soft)}
.hs-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.hs-acts .btn{flex:1 1 150px;min-height:44px}
.hs-msgs{display:grid;gap:6px;margin-top:8px}.hs-m{margin:0;padding:8px 10px;border-radius:12px;background:var(--sheet,var(--paper))}.hs-m b{display:block;font-size:.8rem;color:var(--soft)}
.hs-m.eleve{background:color-mix(in srgb,var(--sky,#1F78B8) 10%,var(--card))}
.hs-re{width:100%;margin:16px 0 30px;min-height:48px}
/* ---------- Contrôles : une carte par contrôle, deux étapes (énoncé, copie), l'état dit ce qui manque ---------- */
.ct-liste{display:grid;gap:10px}
.ct-card{border:1.5px solid color-mix(in srgb,var(--c) 30%,var(--line));background:var(--sheet,var(--paper));border-radius:18px;padding:12px;display:grid;gap:10px}
.ct-h{display:flex;align-items:center;gap:10px;border:0;background:none;padding:0;text-align:left;color:var(--ink);font:inherit;cursor:pointer;width:100%}
.ct-h .tx{flex:1;min-width:0;display:flex;flex-direction:column}.ct-h small{color:var(--soft);font-weight:700}.ct-h b{line-height:1.25;overflow-wrap:anywhere}
.ct-note{font-family:var(--display);font-size:1.4rem;font-weight:800;white-space:nowrap}.ct-note small{font-size:.8rem;color:var(--soft)}
.ct-etats{display:flex;flex-wrap:wrap;gap:6px}
.ct-et{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 10px;font-size:.8rem;font-weight:800}
.ct-et.warn{background:color-mix(in srgb,var(--warn-t) 14%,var(--card));color:var(--warn-t)}.ct-et.crit{background:color-mix(in srgb,var(--ko-t) 13%,var(--card));color:var(--ko-t)}
.ct-et.info{background:color-mix(in srgb,var(--info-t) 13%,var(--card));color:var(--info-t)}.ct-et.good{background:color-mix(in srgb,var(--ok-t) 14%,var(--card));color:var(--ok-t)}
.ct-steps{display:grid;gap:10px}
.ct-step{display:flex;gap:10px;align-items:flex-start}
.ct-num{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:800;border:2px solid var(--line);color:var(--soft)}
.ct-step.fait .ct-num{background:var(--ok-t);border-color:var(--ok-t);color:#fff}
.ct-sb{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.ct-sb small{color:var(--soft);line-height:1.35}
.ct-go{min-height:44px;align-self:flex-start}.ct-go.busy,.ct-plus.busy{opacity:.6;pointer-events:none}
.ct-plus{color:var(--sky,#1F78B8);font-weight:800;font-size:.88rem;cursor:pointer;min-height:32px;display:inline-flex;align-items:center}
.ct-av .ct-rev{margin:0}
.ct-opt summary{cursor:pointer;color:var(--soft);font-weight:700;font-size:.88rem;min-height:36px;display:flex;align-items:center}
.ct-opt .ct-steps{margin-top:6px}
/* Contrôles : filtre (matière, mois) replié dans un seul bouton « Filtrer » */

/* Défis / Mon groupe : deux tuiles côte à côte, bien visibles */
.cz-duo{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 18px}
.cz-duo-t{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:118px;text-align:left;border:2px solid color-mix(in srgb,var(--c) 45%,var(--line));background:color-mix(in srgb,var(--c) 12%,var(--card));color:var(--ink);border-radius:20px;padding:14px;font:inherit;cursor:pointer}
.cz-duo-t .i{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:var(--c);color:#fff;font-size:22px;margin-bottom:6px}
.cz-duo-t .tx{display:flex;flex-direction:column;gap:3px}
.cz-duo-t b{font-size:1.05rem;font-weight:900}
.cz-duo-t small{color:var(--soft);font-size:.82rem;line-height:1.25}
.cz-duo-t .gr-live-dot{position:absolute;top:12px;right:12px}
.cz-duo-t:active{transform:scale(.98)}

/* ---------- barre du bas : Devoirs · Contrôles · Ogrelo · Cours · Langues ; « Moi » = avatar rond en haut à droite ---------- */
.h-tab.mid[aria-current="page"]::before{display:none}
.h-tab.mid[aria-current="page"] .bub{border-color:color-mix(in srgb,var(--sky) 70%,var(--sheet))}
.h-tab.mid[aria-current="page"]{color:var(--sky)}
.h-moi{position:absolute;top:calc(8px + env(safe-area-inset-top,0px));right:12px;z-index:3;width:44px;height:44px;border-radius:50%;border:2px solid rgba(255,255,255,.95);padding:0;display:grid;place-items:center;overflow:hidden;background:#fff;color:#16304A;box-shadow:0 4px 10px rgba(0,0,0,.14);cursor:pointer}
.h-moi svg{width:46px;height:46px;margin-top:6px}
.h-moi .ini{font-family:var(--display);font-weight:900;font-size:1.15rem}
.h-moi[aria-current="page"]{border-color:var(--sky);box-shadow:0 0 0 3px color-mix(in srgb,var(--sky) 35%,transparent),0 4px 10px rgba(0,0,0,.14)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-moi{background:#1B2242;color:#fff;border-color:#2C3560}}
:root[data-theme="dark"] .h-moi{background:#1B2242;color:#fff;border-color:#2C3560}
.h-hello{max-width:calc(100% - 92px)!important}   /* le bonjour ne passe jamais sous l'avatar et la roue */

/* ---------- onglet Ogrelo : trois grandes cartes égales, un geste chacune ---------- */
.gt-dit{display:flex;gap:12px;align-items:flex-start;margin:2px 0 20px}
.gt-dit .f{flex:none;width:56px;height:56px}.gt-dit .f svg{width:100%;height:100%}
.gt-dit p{margin:0;background:var(--card);border:2px solid var(--line);border-radius:18px 18px 18px 4px;padding:12px 14px;line-height:1.45}
.gt-cartes{display:grid;grid-template-columns:1fr;grid-auto-rows:1fr;gap:14px;margin:0 0 18px}   /* trois cartes de même taille */
.gt-c{position:relative;display:flex;align-items:center;gap:14px;width:100%;min-height:96px;text-align:left;border:2px solid color-mix(in srgb,var(--c) 40%,var(--line));background:color-mix(in srgb,var(--c) 9%,var(--card));color:var(--ink);border-radius:22px;padding:16px;font:inherit;cursor:pointer}
.gt-c .i{flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:1.5rem;background:var(--c);color:#fff}
.gt-c .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.gt-c b{font-family:var(--display);font-size:1.12rem;line-height:1.2}
.gt-c small{color:var(--soft);line-height:1.35;overflow-wrap:anywhere}
.gt-c .go{flex:none;color:var(--soft)}
@media (max-width:360px){.gt-c{gap:12px;padding:14px 12px;min-height:84px}.gt-c .i{width:44px;height:44px;border-radius:14px;font-size:1.3rem}}
.gt-c .gr-live-dot{top:12px;right:12px}
.gt-c .abo-cad{top:10px;left:auto;right:10px;margin:0}
.gt-c:active{transform:scale(.985)}

/* ---------- « Défie tes parents ou tes amis sur ce chapitre » : petite action secondaire, une seule par écran ---------- */
.df-lien{display:flex;align-items:center;gap:10px;width:100%;margin:14px 0 6px;padding:12px 14px;border:1.5px dashed color-mix(in srgb,#8E44EC 45%,var(--line));border-radius:16px;background:transparent;color:var(--ink);font:inherit;font-weight:700;font-size:.95rem;text-align:left;cursor:pointer}
.df-lien>i:first-child{flex:none;color:#7A35D6;font-size:1.1rem}
.df-lien span{flex:1;min-width:0}
.df-lien .go{flex:none;color:var(--soft)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .df-lien>i:first-child{color:#C7A2FF}}
:root[data-theme="dark"] .df-lien>i:first-child{color:#C7A2FF}
.ex-bilan .df-lien{margin-top:12px}
.lg-defi{margin-top:6px}

/* ---------- onglet Langues : la page d'accueil de l'espace Langues, dans l'onglet ---------- */
.lg-inl{margin:0 0 18px}

/* Contrôles : calendrier (classes de Devoirs) ; rappel « À compléter » et jour vide */
.ct-rappel{margin:14px 0 22px}.ct-rappel>i:first-child{color:var(--t-warn)}
.ct-vide-p{margin:0;color:var(--soft);font-weight:600;line-height:1.45}
/* avatar Moi : anneau bien visible sur toutes les scènes */
.h-moi{border:3px solid #16304A;box-shadow:0 0 0 3px #fff,0 6px 14px rgba(0,0,0,.28)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-moi{border-color:#fff;box-shadow:0 0 0 3px #16304A,0 6px 14px rgba(0,0,0,.45)}}
:root[data-theme="dark"] .h-moi{border-color:#fff;box-shadow:0 0 0 3px #16304A,0 6px 14px rgba(0,0,0,.45)}
/* bonjour et avatar Moi : même relief que les tuiles (ombre pleine façon Duolingo, plus de double anneau) */
.h-hello{border:2px solid #D7DEE8!important;border-top:0!important;box-shadow:0 5px 0 #B9C4D3!important}
.h-moi{border:2px solid #D7DEE8!important;box-shadow:0 4px 0 #B9C4D3!important}
.h-moi:active{transform:translateY(3px);box-shadow:0 1px 0 #B9C4D3!important}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-hello,:root:not([data-theme="light"]) .h-moi{border-color:#2C3560!important;box-shadow:0 5px 0 #0E1330!important}}
:root[data-theme="dark"] .h-hello,:root[data-theme="dark"] .h-moi{border-color:#2C3560!important;box-shadow:0 5px 0 #0E1330!important}
/* bonjour et avatar Moi : fond vert Ogrelo, texte blanc, ombre pleine vert foncé */
.h-hello{background:#3BA34E!important;color:#fff!important;border-color:#2F8540!important;box-shadow:0 5px 0 #1F6A30!important;text-shadow:0 1px 0 rgba(0,0,0,.15)}
.h-moi{background:#3BA34E!important;color:#fff!important;border-color:#2F8540!important;box-shadow:0 4px 0 #1F6A30!important}
.h-moi:active{box-shadow:0 1px 0 #1F6A30!important}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .h-hello,:root:not([data-theme="light"]) .h-moi{background:#2F8540!important;color:#fff!important;border-color:#256B33!important;box-shadow:0 5px 0 #143D1C!important}}
:root[data-theme="dark"] .h-hello,:root[data-theme="dark"] .h-moi{background:#2F8540!important;color:#fff!important;border-color:#256B33!important;box-shadow:0 5px 0 #143D1C!important}
.h-moi{top:calc(2px + env(safe-area-inset-top,0px))!important}
.h-hello{font-size:1.02rem!important;padding:8px 14px 7px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:calc(100% - 84px)!important;line-height:1.15!important}@media (max-width:360px){.h-hello{font-size:.95rem!important}}
.demo-bar .demo-act{margin-left:auto!important;display:flex;gap:6px;align-items:center;flex:none}.demo-bar .demo-x{width:28px;height:28px}
/* matière : tout le programme visible ; vu en classe = vert coché, pas encore vu = gris clair mais ouvrable */
.cz-prog-l{display:flex;gap:8px;flex-wrap:wrap;margin:-4px 0 12px}
.cz-tag.vu{background:#E7F6DA;color:#2F7A00}
.cz-tag.avenir{background:var(--line);color:var(--soft)}
.cz-l.cz-vu .cz-li{background:#46A302!important;color:#fff!important}
.cz-l.cz-avenir{opacity:.78}
.cz-l.cz-avenir .tx b{font-weight:700}
/* programme de la classe : 3e état « exercices faits » (étoiles + score) */
.cz-tag.exo{background:#FFF3C4;color:#7A5200;gap:2px}
.cz-tag.exo .gi-etoile{color:#E0A100}.cz-tag.exo .gi-etoile.off{color:currentColor;opacity:.28}
.cz-l.cz-fait .cz-li{background:#F2B705!important;color:#fff!important}
/* chapitre : carte « En classe » (ce que la classe a fait, rangé sûrement), puis « Le programme de ta classe » */
.cz-classe{background:var(--card);border:2px solid var(--line);border-bottom-width:4px;border-radius:18px;padding:14px 14px 10px;margin:14px 0 6px;display:flex;flex-direction:column;gap:10px}
.cz-classe-h{display:flex;gap:10px;align-items:center}
.cz-classe-h .ic{flex:none;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:#46A302;color:#fff;font-size:1.1rem}
.cz-classe-h .tx{display:flex;flex-direction:column;min-width:0}.cz-classe-h b{font-size:1.08rem;font-weight:900;color:var(--ink)}.cz-classe-h small{color:var(--soft);font-weight:600;font-size:.85rem}
.cz-lecon{display:flex;align-items:center;gap:10px;width:100%;text-align:left;font:inherit;color:var(--ink);background:color-mix(in srgb,#1F78B8 10%,var(--card));border:2px solid color-mix(in srgb,#1F78B8 45%,var(--line));border-bottom-width:4px;border-radius:14px;padding:10px 12px;cursor:pointer}
.cz-lecon:active{transform:translateY(2px);border-bottom-width:2px}
.cz-lecon .ic{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#1F78B8;color:#fff}
.cz-lecon .tx{flex:1;min-width:0;display:flex;flex-direction:column}.cz-lecon b{font-weight:900}.cz-lecon small{color:var(--soft);font-weight:600;overflow-wrap:anywhere}
.cz-lecon .go{color:var(--soft)}
.cz-seances{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.cz-seances li{border-left:3px solid #46A302;padding:2px 0 2px 10px;display:flex;flex-direction:column;gap:1px}
.cz-seances small{color:var(--soft);font-weight:700;font-size:.8rem}.cz-seances b{font-weight:800;color:var(--ink);overflow-wrap:anywhere}
.cz-seances p{margin:2px 0 0;color:var(--soft);font-size:.88rem;line-height:1.35;overflow-wrap:anywhere}
.cz-classe .cz-pieces{margin:0;padding-top:2px}
.cz-dvs{display:flex;flex-direction:column;gap:6px;border-top:1.5px solid var(--line);padding-top:8px}
.cz-dv{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;background:none;border:0;padding:4px 0;font:inherit;color:var(--ink);cursor:pointer}
.cz-dv .ic{flex:none;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,#1F78B8 14%,var(--card));color:#1F78B8}
.cz-dv .ic.ctl{background:color-mix(in srgb,#C2389E 14%,var(--card));color:#9C2479}
.cz-dv .tx{flex:1;min-width:0;display:flex;flex-direction:column}.cz-dv b{font-weight:700;font-size:.93rem;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cz-dv small{color:var(--soft);font-size:.8rem;font-weight:600}.cz-dv .cz-tags{margin-top:3px}
.cz-progh{margin:16px 2px 14px}.cz-progh .rv-h3{margin:0 0 2px}.cz-progh>p{margin:0;color:var(--soft);font-size:.86rem;font-weight:600;line-height:1.35}
.cz-notions{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.cz-notions li{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--line);border-radius:999px;padding:4px 10px;font-size:.82rem;font-weight:700;color:var(--ink);background:var(--card)}
.cz-notions li.vue{border-color:#8BCB5A;background:color-mix(in srgb,#46A302 10%,var(--card))}
.cz-notions .pt,.cz-notions-l .pt{flex:none;width:8px;height:8px;border-radius:50%;background:#46A302;display:inline-block}
.cz-notions-l{margin:6px 0 0;color:var(--soft);font-size:.8rem;font-weight:700;display:flex;align-items:center;gap:6px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .cz-tag.vu{background:#1E3A12;color:#9BE06A}:root:not([data-theme="light"]) .cz-tag.exo{background:#3A2E08;color:#FFD866}:root:not([data-theme="light"]) .cz-dv .ic{color:#8DB6F0}:root:not([data-theme="light"]) .cz-dv .ic.ctl{color:#F49AD8}:root:not([data-theme="light"]) .cz-notions li.vue{border-color:#3F7A1E}}
:root[data-theme="dark"] .cz-tag.vu{background:#1E3A12;color:#9BE06A}:root[data-theme="dark"] .cz-tag.exo{background:#3A2E08;color:#FFD866}:root[data-theme="dark"] .cz-dv .ic{color:#8DB6F0}:root[data-theme="dark"] .cz-dv .ic.ctl{color:#F49AD8}:root[data-theme="dark"] .cz-notions li.vue{border-color:#3F7A1E}

/* avatar du bouton Moi (en haut à droite) : entier et centré dans la bulle */
.h-moi>svg,.h-moi>img,.h-moi .av-img,.h-moi picture{width:36px!important;height:36px!important;margin:0!important;display:block;object-fit:contain;flex:none}
.h-moi{place-items:center;padding:0!important}

/* Ogrelo · coups de pouce (devoir) et questions fréquentes (fiche) : pouces.js. Un pas à la fois, de l'air, palette calme (vert Ogrelo). */
.po{display:flex;flex-direction:column;gap:14px;margin:0 0 16px}
.po .btn{margin:0;display:flex;align-items:center;justify-content:center;gap:8px}
.po-say{margin:0}
.po-say .g-say-b p+p{margin-top:8px}
.po-k{font-family:var(--display);font-weight:800;color:var(--ogre-d)}
.po-dots{line-height:1}
.po-retour{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:6px 2px;color:var(--soft);font:inherit;font-weight:700;cursor:pointer}
.po-exo-t{margin:0;display:flex;align-items:center;gap:8px;font-weight:800;color:var(--ink)}
.po-exo-t i{color:var(--ogre-d)}
/* où on en est : indice 1 · indice 2 · méthode */
.po-etapes{list-style:none;margin:0;padding:0;display:flex;gap:8px}
.po-etapes li{flex:1;min-width:0;text-align:center;font-size:.8rem;font-weight:800;color:var(--soft);padding:6px 4px;border-radius:999px;border:2px solid var(--line);background:var(--card);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.po-etapes li.fait{border-color:color-mix(in srgb,var(--ogre) 45%,var(--line));color:var(--ogre-d)}
.po-etapes li.ici{border-color:var(--ogre);background:color-mix(in srgb,var(--ogre) 14%,var(--card));color:var(--ogre-d)}
.po-meth{margin:6px 0 0;padding-left:1.3em;display:flex;flex-direction:column;gap:8px}
.po-meth li{line-height:1.45}
.po-piege{border:2px solid var(--line);border-radius:18px;background:var(--card);padding:12px 14px}
.po-piege-t{margin:0 0 6px;display:flex;align-items:center;gap:8px;font-weight:800;color:var(--warn-t)}
.po-piege ul{margin:0;padding-left:1.2em;display:flex;flex-direction:column;gap:6px;line-height:1.45}
.po-exos{display:flex;flex-direction:column;border:2px solid var(--line);border-radius:20px;background:var(--card);padding:2px 14px}
/* les questions qu'on me pose souvent */
.po-faq{margin-top:6px;padding-top:16px;border-top:1px solid var(--line)}
.po-faq-t{margin:0 0 10px;display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:800;color:var(--soft)}
.po-faq-t i{color:var(--ogre-d)}
.po-faq-l{display:flex;flex-direction:column;gap:10px}
.po-q-b{width:100%;display:flex;align-items:center;gap:10px;justify-content:space-between;text-align:left;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:16px;padding:12px 14px;font:inherit;font-weight:700;cursor:pointer;line-height:1.35}
.po-q-b.on{border-color:var(--ogre)}
.po-fl{flex:none;color:var(--soft);transition:transform .2s}
.po-q-b.on .po-fl{transform:rotate(180deg)}
.po-q-r{padding:12px 0 2px}
.po-q-r .g-say-face .ogre{width:48px;height:48px}
/* dernière ligne : « Ce n'est pas ma question » → le chat */
.po-chat{display:flex;align-items:center;gap:12px;width:100%;border:0;border-top:1px solid var(--line);background:none;padding:14px 0 6px;text-align:left;color:var(--ink);font:inherit;cursor:pointer}
.po-chat-i{width:38px;height:38px;flex:none;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,#1F78B8 14%,transparent);color:#1F78B8;font-size:1.1rem}
.po-chat .tx{flex:1;min-width:0;display:flex;flex-direction:column}.po-chat b{font-weight:800}.po-chat small{color:var(--soft);font-size:.84rem}
.po-chat .go{color:var(--soft)}
.po-autre{align-self:center;border:0;background:none;color:var(--soft);font:inherit;font-weight:700;text-decoration:underline;padding:6px;cursor:pointer}
/* fiche : sous « J'ai une question » */
.po-fiche{margin-top:4px}
@media (prefers-reduced-motion: reduce){.po-fl{transition:none}}

/* === Groupes de révision (groupes.js) : mêmes briques que les défis (cartes.css), couleurs calmes, lisible en clair et en sombre === */
/* --gr / --gr2 : fonds avec texte blanc (contraste ≥ 4.5:1) ; --gr-a : traits, icônes et barres, plus clair en sombre */
:root{--gr:#2B8044;--gr-d:#1D5E31;--gr2:#1A7A88;--gr-a:#2F8A4A}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--gr-a:#6DBF59}}
:root[data-theme="dark"]{--gr-a:#6DBF59}
/* entrée dans Réviser */
.rv-groupes{position:relative;display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:2px solid color-mix(in srgb,var(--gr) 45%,var(--line));border-radius:22px;padding:14px 16px;margin:0 0 16px;background:color-mix(in srgb,var(--gr) 9%,var(--card));color:var(--ink);font:inherit;cursor:pointer;box-shadow:0 4px 0 color-mix(in srgb,var(--gr) 30%,var(--line))}
.rv-groupes .i{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--gr);color:#fff;font-size:1.4rem;flex:none}
.rv-groupes .tx{flex:1;min-width:0}.rv-groupes b{display:block;font-family:var(--display);font-size:1.08rem}.rv-groupes small{display:block;color:var(--soft);line-height:1.35;margin-top:2px}
.rv-groupes .go{color:var(--soft);flex:none}.rv-groupes:active{transform:translateY(3px);box-shadow:none}
.gr-live-dot{position:absolute;top:10px;right:12px;width:12px;height:12px;border-radius:50%;background:var(--gr);box-shadow:0 0 0 0 color-mix(in srgb,var(--gr) 60%,transparent);animation:grPouls 1.6s ease-out infinite}
@keyframes grPouls{to{box-shadow:0 0 0 10px transparent}}
/* fenêtre */
.gr .cm-corps{padding-bottom:96px}
.gr-hero .f svg{width:84px;height:84px}
.gr-aide{color:var(--soft);line-height:1.45;margin:6px 2px 14px;font-size:.94rem}.gr-aide.c{text-align:center}
.gr-demo{background:color-mix(in srgb,var(--sky,#2471AE) 10%,var(--card));border:2px solid color-mix(in srgb,var(--sky,#2471AE) 35%,var(--line));border-radius:16px;padding:12px 14px;margin:0 0 18px;line-height:1.45;color:var(--ink)}
.gr-demo-tag{display:inline-block;margin-left:8px;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--soft);border:1.5px solid var(--line);border-radius:999px;padding:1px 8px;vertical-align:2px}
.gr-etapes{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:12px}
.gr-etapes li{display:flex;align-items:center;gap:12px;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px 14px;line-height:1.4;color:var(--ink)}
.gr-etapes li i{flex:none;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--gr-a) 15%,var(--card));color:var(--gr-a);font-size:1.1rem}
.gr-gros{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:0;border-radius:22px;padding:16px;color:#fff;font:inherit;cursor:pointer;margin:0 0 22px;background:linear-gradient(135deg,var(--gr),var(--gr2));box-shadow:0 5px 0 var(--gr-d)}
.gr-gros .i{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.2);font-size:1.5rem;flex:none}
.gr-gros .tx{min-width:0}.gr-gros b{display:block;font-family:var(--display);font-size:1.15rem}.gr-gros small{opacity:.95;line-height:1.35;display:block}
.gr-gros:active{transform:translateY(3px);box-shadow:0 2px 0 var(--gr-d)}
.gr-rej{margin-top:6px}.gr-rej .df-code-in input{letter-spacing:.14em;font-size:1.25rem;text-transform:uppercase}
.gr-principal:disabled{opacity:.5}
/* mes groupes */
.gr-liste{display:grid;gap:14px;margin:0 0 22px}
.gr-carte{position:relative;display:grid;gap:10px;width:100%;text-align:left;font:inherit;color:var(--ink);background:var(--card);border:2px solid var(--line);border-radius:20px;padding:14px 44px 14px 16px;cursor:pointer;box-shadow:0 4px 0 var(--line)}
.gr-carte .go{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--soft)}
.gr-c-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}.gr-c-h b{font-family:var(--display);font-size:1.1rem}
.gr-live,.gr-ok{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;font-weight:800;border-radius:999px;padding:3px 10px}
.gr-live{background:color-mix(in srgb,var(--gr) 16%,var(--card));color:var(--ok-t)}.gr-live i{width:8px;height:8px;border-radius:50%;background:var(--gr-a);animation:grPouls 1.6s ease-out infinite}
.gr-ok{background:color-mix(in srgb,#E0A100 18%,var(--card));color:var(--warn-t)}
.gr-pile{display:flex;align-items:center;flex-wrap:wrap;gap:4px}.gr-pile .gr-av{margin-right:-10px;border:2px solid var(--card)}.gr-pile small{margin-left:16px;color:var(--soft);font-weight:700}
.gr-c-obj{display:grid;gap:6px;font-size:.9rem;color:var(--soft);font-weight:700}.gr-c-obj .l{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 10px}.gr-c-obj .l b{color:var(--ink)}
.gr-bar{display:block;height:8px;border-radius:8px;background:var(--line);overflow:hidden;min-width:40px}.gr-bar i{display:block;height:100%;border-radius:8px;background:var(--gr-a);transition:width .4s}
.gr-bar.gros{height:14px;border-radius:14px}.gr-bar.gros i{border-radius:14px}
/* créer */
.gr-noms{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin:0 0 20px}
.gr-noms button{border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:14px;padding:12px 10px;font:inherit;font-weight:700;line-height:1.25;cursor:pointer;min-height:52px}
.gr-noms button.on{border-color:var(--gr-a);background:color-mix(in srgb,var(--gr-a) 16%,var(--card));box-shadow:0 0 0 3px color-mix(in srgb,var(--gr-a) 25%,transparent)}
.gr-noms.petits{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))}
.gr-seg{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 14px}
.gr-seg button{border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:14px;padding:12px 8px;font:inherit;cursor:pointer}.gr-seg button.on{border-color:var(--gr-a);background:color-mix(in srgb,var(--gr-a) 16%,var(--card));box-shadow:0 0 0 3px color-mix(in srgb,var(--gr-a) 25%,transparent)}
/* un groupe */
.gr-tete{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:4px 0 18px}.gr-tete h2{font-family:var(--display);font-size:1.45rem;margin:0;color:var(--ink);overflow-wrap:anywhere}
.gr-tete .gr-pile{padding-right:10px}
.gr-nouveau{background:color-mix(in srgb,var(--gr) 10%,var(--card));border:2px solid color-mix(in srgb,var(--gr) 40%,var(--line));border-radius:16px;padding:12px 14px;line-height:1.45;margin:0 0 14px;color:var(--ink)}
.gr-invite{text-align:center;background:var(--card);border:2px dashed color-mix(in srgb,var(--gr) 50%,var(--line));border-radius:20px;padding:14px;margin:0 0 22px}
.gr-invite>small{display:block;color:var(--soft);font-weight:800}
.gr-code{display:block;margin:6px auto 12px;font-family:var(--display);font-size:clamp(1.5rem,8vw,2rem);letter-spacing:.12em;color:var(--ink);background:none;border:0;cursor:pointer;white-space:nowrap}
.gr-partage{margin:0 0 4px!important}
.gr-direct{display:grid;gap:6px;background:color-mix(in srgb,var(--gr) 10%,var(--card));border:2px solid var(--gr-a);border-radius:20px;padding:14px 16px;margin:0 0 22px}
.gr-direct b{font-family:var(--display);font-size:1.1rem;color:var(--ink)}.gr-direct small{color:var(--soft)}.gr-direct .btn{margin:8px 0 0}.gr-direct .gr-live{justify-self:start}
.gr-bloc{margin:0 0 26px}.gr-bloc .rv-h3{display:flex;align-items:center;gap:8px}
.rv-h3.ok i{color:var(--ok-t)}.rv-h3.ko i{color:var(--ko-t)}
.gr-obj-phrase{line-height:1.45;margin:0 0 12px;color:var(--ink)}
.gr-coll{display:grid;gap:8px;background:var(--card);border:2px solid var(--line);border-radius:18px;padding:14px;margin:0 0 14px;color:var(--ink)}
.gr-coll small{color:var(--soft);line-height:1.4}.gr-coll .gr-serie{color:var(--warn-t);font-weight:800}
.gr-badge{display:flex;align-items:center;gap:12px;background:color-mix(in srgb,#E0A100 14%,var(--card));border:2px solid color-mix(in srgb,#E0A100 50%,var(--line));border-radius:18px;padding:10px 14px;margin:0 0 14px;color:var(--ink)}
.gr-badge .m svg{width:52px;height:52px}.gr-badge span{flex:1;min-width:0}.gr-badge b{display:block;font-family:var(--display)}.gr-badge small{color:var(--soft)}.gr-badge>i{font-size:1.6rem;color:#C98F00;flex:none}
.gr-membres,.gr-mlist,.gr-hist,.gr-pts{list-style:none;padding:0;margin:0 0 10px;display:grid;gap:10px}
.gr-membres li{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(48px,30%) auto;align-items:center;gap:10px}
.gr-membres .nm,.gr-mlist .nm{font-weight:700;color:var(--ink);overflow-wrap:anywhere;min-width:0}.gr-membres small,.gr-mlist small{color:var(--soft);font-weight:600}
.gr-fait{font-weight:800;font-size:.85rem;color:var(--soft);min-width:34px;text-align:right}.gr-fait.ok{color:var(--ok-t);font-size:1.1rem}
.gr-mlist li{display:flex;align-items:center;gap:10px;background:var(--card);border:2px solid var(--line);border-radius:999px;padding:4px 6px 4px 4px}.gr-mlist .nm{flex:1}
.gr-tag{display:inline-block;font-size:.72rem!important;border:1.5px solid var(--line);border-radius:999px;padding:0 8px;margin-left:4px}
.gr-mlist .df-retire{flex:none}
.gr-defis{display:grid;gap:14px;margin:0 0 14px}
.gr-defi{background:var(--card);border:2px solid var(--line);border-radius:18px;padding:14px}
.gr-defi .h b{display:block;font-family:var(--display);color:var(--ink);overflow-wrap:anywhere}.gr-defi .h small{color:var(--soft)}
.gr-defi .btn{margin:12px 0 0}
.gr-qui{display:grid;gap:8px;margin-top:12px}
.gr-q{display:flex;align-items:center;gap:10px;font-size:.95rem;min-width:0}
.gr-q small{flex:1;min-width:0;font-size:1em;color:var(--ink);font-weight:700;overflow-wrap:anywhere;line-height:1.3}.gr-q b{flex:none;color:var(--soft);font-weight:700}
.gr-q.fait b{color:var(--ok-t);font-weight:800}
.gr-q .gr-av{width:28px;height:28px}
.gr-hist li{display:flex;align-items:center;gap:12px;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:10px 12px}
.gr-hist .d{flex:none;font-weight:800;color:var(--soft);font-size:.85rem;min-width:62px}.gr-hist .tx{min-width:0}.gr-hist b{display:block;color:var(--ink);overflow-wrap:anywhere}.gr-hist small{color:var(--soft)}
.gr-fin{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;margin:10px 0 0}
.gr-danger{color:var(--ko-t)!important}
.gr-danger-b{background:var(--ko-t)!important;border-color:var(--ko-t)!important;color:#fff!important}
.gr-conf p{line-height:1.5}
/* choix de la fiche */
.gr-srcs{display:grid;gap:10px;margin-top:14px}
.gr-src .i{background:var(--c)!important;color:#fff!important;box-shadow:0 3px 0 color-mix(in srgb,var(--c) 70%,#000)}
.gr-src .tx{min-width:0}.gr-src b{display:block;-webkit-line-clamp:unset;overflow:visible;overflow-wrap:anywhere}
/* séance en direct */
.gr-s-top{text-align:center;margin:0 0 14px}.gr-s-top small{display:block;color:var(--soft);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:.72rem}.gr-s-top b{font-family:var(--display);font-size:1.1rem;color:var(--ink);overflow-wrap:anywhere}
.gr-etape{text-align:center;margin:6px 0 18px}.gr-etape .f svg{width:84px;height:84px}.gr-etape h3{font-family:var(--display);font-size:1.35rem;margin:6px 0;color:var(--ink)}.gr-etape p{color:var(--soft);line-height:1.45;margin:0}
.gr-step{display:flex;justify-content:center;gap:10px;margin:0 0 14px}
.gr-step span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.9rem;border:2px solid var(--line);color:var(--soft);background:var(--card)}
.gr-step span.on{border-color:var(--gr);background:var(--gr);color:#fff}.gr-step span.ok{border-color:var(--gr-a);color:var(--gr-a)}
.gr-pres{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 6px}
.gr-p{position:relative;display:flex;align-items:center;gap:6px;background:var(--card);border:2px solid var(--line);border-radius:999px;padding:3px 10px 3px 3px;font-weight:700;max-width:100%}
.gr-p small{color:var(--ink);font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:17ch}
.gr-p.ok{border-color:color-mix(in srgb,var(--gr-a) 60%,var(--line))}.gr-p.absent{opacity:.45}
.gr-pk{color:var(--ok-t);font-size:.95rem}
.gr-pres-z{margin-top:18px}
.gr-rappel{list-style:none;counter-reset:r;padding:0;margin:0 0 20px;display:grid;gap:12px}
.gr-rappel li{counter-increment:r;position:relative;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px 14px 12px 50px;line-height:1.5;color:var(--ink);overflow-wrap:anywhere}
.gr-rappel li::before{content:counter(r);position:absolute;left:12px;top:12px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--gr) 16%,var(--card));color:var(--ok-t);font-weight:800;font-size:.9rem}
.gr-rappel small{display:block;color:var(--soft);font-weight:800;font-size:.78rem;margin-bottom:2px}
.gr-exo .exo-q,.gr-test .exo-q{font-family:var(--display);font-size:1.12rem;font-weight:800;color:var(--ink);overflow-wrap:anywhere}
.gr-exo .exo-trous{overflow-wrap:anywhere}.gr .exo-bank button.pris{opacity:.4}.gr-exo .exo-ch.two button{text-align:center;justify-content:center}
.gr-trous-rep{display:block;margin-top:8px;font-weight:600;line-height:1.6}.gr-trous-rep b{color:var(--ok-t);font-weight:800}.gr-exo .tr-in{width:8ch;max-width:40vw;margin:0 4px}
.gr-prop{background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px 14px;margin:0 0 14px;text-align:center}.gr-prop small{display:block;color:var(--soft);font-weight:800}.gr-prop b{font-size:1.1rem;color:var(--ink)}
.gr-envoye{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;background:color-mix(in srgb,var(--gr) 9%,var(--card));border:2px solid color-mix(in srgb,var(--gr) 35%,var(--line));border-radius:18px;padding:16px;margin:12px 0}
.gr-envoye .f svg{width:60px;height:60px}.gr-envoye b{font-family:var(--display);font-size:1.1rem;color:var(--ink)}.gr-envoye small{color:var(--soft);line-height:1.4}
.gr-compte{white-space:nowrap}
.gr-rev .exo-fb{margin:0 0 14px}.gr-rev .exo-face svg{width:46px;height:46px}.gr-rev .exo-q.petit{font-size:1rem;font-weight:700;color:var(--ink);background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px 14px;margin:0 0 12px;line-height:1.45;overflow-wrap:anywhere}
.gr-rev .exo-q small{color:var(--soft)}
.gr-expl{display:flex;gap:8px;align-items:flex-start;line-height:1.45}.gr-expl i{flex:none;color:#C98F00;margin-top:3px}
.gr-trouve{display:grid;gap:8px;margin:14px 0 18px;color:var(--ink)}.gr-trouve>small{color:var(--soft)}
.gr-tq{margin:0 0 22px}.gr-tq .exo-q{position:relative;padding-left:36px}.gr-num{position:absolute;left:0;top:1px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:color-mix(in srgb,var(--gr-a) 18%,var(--card));color:var(--ok-t);font-size:.85rem}
.gr-pts li{display:flex;gap:10px;align-items:flex-start;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:10px 12px;line-height:1.45;color:var(--ink);overflow-wrap:anywhere}
.gr-pts li>i{flex:none;margin-top:3px}.gr-pts.ok li>i{color:var(--ok-t)}.gr-pts.ko li{background:var(--ko-bg);border-color:color-mix(in srgb,var(--ko) 45%,var(--line))}.gr-pts.ko li>i{color:var(--ko-t)}
.gr-pts span{min-width:0}.gr-pts small{display:block;color:var(--ink);margin-top:4px}
.gr-perso{background:var(--card);border:2px solid var(--line);border-radius:18px;padding:14px 16px}.gr-perso .rv-h3{margin-top:0}.gr-perso p{margin:0 0 8px;color:var(--ink);line-height:1.45}.gr-perso .gr-aide{display:block;margin:12px 0 0}
.gr-corr{line-height:1.45;padding-top:8px;border-top:2px solid var(--line)}
.gr-defi-host{margin-top:6px}
.gr .exo .gr-principal,.gr .gr-test .gr-principal,.gr .exo .exo-valide,.gr .exo .exo-ok{margin-top:24px!important}.gr-pres-z{padding-top:4px}
.gr .df-av.gr-av{width:34px;height:34px}
@media (max-width:360px){.gr-membres li{grid-template-columns:auto minmax(0,1fr) auto}.gr-membres .gr-bar{grid-column:2/4;grid-row:2}.gr-noms{grid-template-columns:1fr 1fr}.gr-tete h2{font-size:1.25rem}}
/* Barre du haut collante : le titre, le bouton des réactions (séance) et la croix restent visibles quand on fait défiler */
.gr .cm-top{position:sticky;top:calc(-12px - env(safe-area-inset-top));z-index:83;background:var(--paper);margin:calc(-12px - env(safe-area-inset-top)) -16px 14px;padding:calc(12px + env(safe-area-inset-top)) 16px 10px}
.gr .cm-top>b{flex:1;min-width:0}
/* Séance de groupe : bouton rond des réactions flottant en bas à droite (cartes.css), menu vers le haut ; le contenu garde la place du bouton en bas */
.cm.gr.df-avec-reacs{padding-bottom:calc(100px + env(safe-area-inset-bottom))}
/* bulles des amis : en haut à droite, sous la barre du haut (elles ne passent pas sur les tuiles ni sur « Valider ») */
.gr .df-bulles{inset:calc(70px + env(safe-area-inset-top)) 16px auto auto;align-items:flex-end;max-width:calc(100% - 32px)}
.gr .df-bulle{left:auto!important;transform-origin:right center}
/* la bulle a un fond clair dans les deux thèmes : texte foncé, sinon il disparaît en sombre */
.gr .df-bulle b{color:#2B2A3A}.gr .df-bulle small{color:#5C5770}
.gr .df-bulle.sort{transform:translateX(30px) scale(.8)!important}
/* zones de toucher ≥ 44 px */
.gr .rv-back{min-height:44px}
.gr .linkbtn2{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 6px}
.gr .gr-mlist .df-retire{width:44px;height:44px;margin:-8px -4px -8px 0;background:radial-gradient(circle,var(--line) 0 13px,transparent 14px);font-size:.75rem}
.gr-mlist li{min-height:44px}
#grObj{margin-left:-6px}
.gr #grForce{display:flex;margin:12px auto 0}
.gr-pres-t{display:block;margin:0 0 8px;color:var(--soft);font-weight:800;font-size:.85rem}
.gr-salon .gr-pres{margin-bottom:22px}
/* défi du groupe (lecteur d'exercices) : espace avant « Suivant », boutons de fin alignés */
.gr .exo .exo-next{margin-top:14px!important}
.gr .exo-acts{align-items:center}.gr .exo-acts .btn{margin-top:0!important;margin-bottom:0!important}
/* Texte à trous en séance : la case s'élargit au mot placé (« dénominateur » n'est plus coupé) */
.gr-exo .tr-in{field-sizing:content;width:auto;min-width:8ch;max-width:100%}

/* « Mes classes » (élève) */
.rv-classes{--gr:#3B7BC8}
.mc-pastille{flex:none;min-width:26px;height:26px;padding:0 8px;border-radius:999px;background:#C9443A;color:#fff;font-weight:900;font-size:.85rem;display:grid;place-items:center}
html.mc-ouvert{overflow:hidden}
.mc-fond{position:fixed;inset:0;z-index:1100;background:color-mix(in srgb,#000 45%,transparent);display:flex;align-items:flex-end;justify-content:center}
.mc-feuille{width:100%;max-width:560px;max-height:92vh;overflow:auto;background:var(--bg,var(--card));border-radius:26px 26px 0 0;padding:18px 16px calc(22px + env(safe-area-inset-bottom))}
@media (min-width:600px){.mc-fond{align-items:center}.mc-feuille{border-radius:26px}}
.mc-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.mc-h h2{margin:0;display:flex;align-items:center;gap:8px;font-size:1.3rem}.mc-h h2 i{width:24px;height:24px;color:#3B7BC8}
.mc-x{width:42px;height:42px;border-radius:14px;border:2px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer}.mc-x i{width:20px;height:20px}
.mc-cl{margin-bottom:16px;padding:14px;border-radius:20px;background:var(--card);border:2px solid var(--line)}
.mc-cl-h{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}.mc-cl-h b{font-size:1.15rem}.mc-cl-h small{color:var(--soft)}
.mc-dv{display:grid;gap:8px}
.mc-d{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:12px;border-radius:16px;border:2px solid var(--line);border-bottom-width:4px;background:var(--card);color:var(--ink);font:inherit;cursor:pointer}
.mc-d-ic{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,#7B3FD1 14%,var(--card));color:#7B3FD1}
.mc-d-ic.fiche{background:color-mix(in srgb,#2F8540 14%,var(--card));color:#2F8540}.mc-d-ic i{width:20px;height:20px}
.mc-d.fait .mc-d-ic{background:var(--ogre);color:#fff}
.mc-d-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.mc-d-t small{color:var(--soft)}
.mc-d-s{flex:none;font-weight:900;font-size:.85rem;color:#C9443A}.mc-d.fait .mc-d-s{color:var(--ogre)}
.mc-quitter{margin-top:10px;border:0;background:none;color:var(--soft);font:inherit;font-size:.82rem;text-decoration:underline;cursor:pointer}
.mc-intro,.mc-aide{color:var(--soft);line-height:1.45}
.mc-rej{padding:16px;border-radius:20px;background:color-mix(in srgb,#3B7BC8 9%,var(--card));border:2px solid color-mix(in srgb,#3B7BC8 35%,var(--line))}
.mc-rej b{font-size:1.05rem}.mc-rej p{margin:6px 0 12px;color:var(--soft);line-height:1.4}
.mc-code{display:flex;gap:10px}
.mc-code input{flex:1;min-width:0;font:inherit;font-size:1.5rem;font-weight:900;letter-spacing:.14em;text-align:center;text-transform:uppercase;padding:10px;border-radius:14px;border:2px solid var(--line);background:var(--card);color:var(--ink)}
.mc-code .btn{margin:0;width:auto;padding:0 18px}
.mc-err{color:#C9443A;font-weight:700;min-height:1em;margin:8px 0 0}
.mc-ok{margin:0 0 12px;padding:10px 14px;border-radius:14px;background:color-mix(in srgb,var(--ogre) 14%,var(--card));color:var(--ink);font-weight:800}

/* devoirs et cours des professeurs Ogrelo, fondus dans l'appli */
.h-prof{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;font-weight:800;color:#3B7BC8;background:color-mix(in srgb,#3B7BC8 12%,var(--card));padding:2px 8px;border-radius:999px;white-space:nowrap}
.h-prof i{width:13px;height:13px}
.mc-qui{display:inline-flex;align-items:center;gap:5px;color:#3B7BC8;font-weight:800}.mc-qui i{width:15px;height:15px}
.mc-h>div{min-width:0}.mc-h h2{display:block;margin-top:4px}
.mc-consigne{white-space:pre-wrap;line-height:1.5;margin:0 0 12px;padding:12px 14px;border-radius:16px;background:var(--card);border:2px solid var(--line)}
.mc-docs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.mc-doc{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:10px 12px;border-radius:14px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-weight:700;cursor:pointer}
.mc-doc span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:230px}.mc-doc i{width:18px;height:18px;color:var(--ogre);flex:none}
.mc-acts{display:grid;gap:10px}.mc-acts .btn{margin:0;width:100%}
.mc-score{text-align:center;font-weight:800;color:var(--ogre)}
.mc-toast{max-width:340px}
.mc-moi{margin:16px 0;padding:16px;border-radius:22px;background:var(--card);border:2px solid var(--line)}
.mc-moi h3{margin:0 0 10px;display:flex;align-items:center;gap:8px;font-size:1.05rem}.mc-moi h3 i{width:20px;height:20px;color:#3B7BC8}
.mc-profs{display:grid;gap:8px;margin-bottom:12px}
.mc-prof{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,#3B7BC8 8%,var(--card))}
.mc-prof-t{flex:1;min-width:0;display:flex;flex-direction:column}.mc-prof-t small{color:var(--soft)}
.mc-deux{display:grid;gap:10px}@media (min-width:520px){.mc-deux{grid-template-columns:1fr 1fr}}
.mc-bloc{padding:12px;border-radius:16px;border:2px dashed var(--line)}
.mc-bloc .mc-code{margin-top:8px}.mc-bloc .mc-code input{font-size:1.2rem}
.mc-moncode{margin-top:6px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-weight:800;padding:8px 14px;border-radius:999px;cursor:pointer}
.mc-code-aff{display:block;margin-top:6px;font-size:1.6rem;letter-spacing:.14em;color:var(--ink)}
.mc-feuille,.mc-moi,.mc-bloc{box-sizing:border-box}
.mc-deux{grid-template-columns:minmax(0,1fr)}@media (min-width:560px){.mc-deux{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}.mc-bloc{min-width:0}.mc-code{min-width:0}.mc-code input{width:100%;min-width:0;box-sizing:border-box}.mc-code .btn{flex:none}

/* rappels la veille (rappels.js) */
.rp-carte{display:flex;gap:12px;align-items:flex-start;margin:12px 0;padding:14px;border-radius:20px;background:color-mix(in srgb,#E3A21A 12%,var(--card));border:2px solid color-mix(in srgb,#E3A21A 40%,var(--line))}
.rp-ic{flex:none;width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#E3A21A;color:#fff}.rp-ic.ok{background:var(--ogre)}.rp-ic i{width:22px;height:22px}
.rp-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.rp-tx small{color:var(--soft);line-height:1.4}
.rp-b{display:flex;gap:10px;align-items:center;margin-top:6px;flex-wrap:wrap}.rp-b .btn{margin:0;width:auto;padding:10px 16px}
.rp-non{border:0;background:none;color:var(--soft);font:inherit;font-weight:700;text-decoration:underline;cursor:pointer}
.rp-err{margin:4px 0 0;color:#C9443A;font-weight:700;font-size:.85rem;min-height:0}

/* PWA : installer, hors connexion */
.pw-inst{margin-top:14px;width:100%}.pw-inst i{width:18px;height:18px}
.pw-etapes{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.pw-etapes li{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:16px;background:var(--card);border:2px solid var(--line);line-height:1.45}
.pw-etapes .n{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--ogre);color:#fff;font-weight:900}
.pw-hors{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom));z-index:1200;display:flex;align-items:center;gap:8px;max-width:calc(100% - 32px);padding:10px 16px;border-radius:999px;background:#2B2A3A;color:#fff;font-weight:700;font-size:.88rem;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.pw-hors i{width:16px;height:16px;flex:none}

/* figures découpées dans les documents du professeur (fiches préparées par Ogrelo) */
.gimg{margin:4px 0 0}
.gimg-b{display:block;width:100%;min-height:140px;padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;cursor:zoom-in}
.gimg-b img{display:block;width:100%;height:auto}
.gimg-b img:not([src]){visibility:hidden}
.gimg.ko{display:none}
.gimg figcaption{margin-top:8px;text-align:center;font-size:.85rem;color:var(--soft);line-height:1.4}
.gimg-plein{position:fixed;inset:0;z-index:1000;background:rgba(10,10,20,.9);display:flex;align-items:center;justify-content:center;padding:max(64px,env(safe-area-inset-top)) 12px max(16px,env(safe-area-inset-bottom))}
.gimg-plein-in{max-width:100%;max-height:100%;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:12px}
.gimg-plein img{display:block;max-width:100%;height:auto;background:#fff;cursor:zoom-in}
.gimg-plein img.zoom{max-width:none;width:220%;cursor:zoom-out}

/* cours à distance : carte « Cours en direct » en haut de l'accueil */
/* cours en direct (accueil de l'élève) : grande carte rouge vif, tout en haut, collée en haut de l'écran quand on défile (on ne peut pas la rater, l'appli reste utilisable).
   Rouge #E0242F, texte blanc (contraste 4,7:1, AA), gros bouton blanc « Rejoindre le cours », point « en direct » qui pulse (sauf mouvement réduit). Même rendu en clair et en sombre. */
.vz-carte{position:relative;display:flex;flex-direction:column;gap:12px;margin:0 0 18px;padding:18px 16px 14px;border-radius:22px;
  background:#E0242F;color:#fff;border:0;box-shadow:0 5px 0 #A3141D,0 14px 30px rgba(150,16,26,.35)}
.vz-haut{display:flex;gap:14px;align-items:flex-start}
.vz-ic{flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.18);color:#fff}.vz-ic svg{width:28px;height:28px}
.vz-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.vz-tag{display:inline-flex;align-items:center;gap:8px;font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:.06em;font-size:.78rem}
.vz-point{position:relative;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 0 rgba(255,255,255,.7);animation:vzPoint 1.6s ease-out infinite}
@keyframes vzPoint{0%{box-shadow:0 0 0 0 rgba(255,255,255,.7)}70%{box-shadow:0 0 0 9px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
@media (prefers-reduced-motion:reduce){.vz-point{animation:none}}
.vz-titre{font-family:var(--display);font-size:1.4rem;line-height:1.15;color:#fff}
.vz-cours{font-weight:800;font-size:1.02rem;line-height:1.3;overflow-wrap:anywhere}
.vz-qui,.vz-quand{color:#fff;line-height:1.4;font-size:.92rem;font-weight:600}.vz-quand{display:inline-flex;align-items:center;gap:6px}.vz-quand i{width:15px;height:15px;background:#fff}
.vz-go{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px;width:100%;border-radius:16px;background:#fff;color:#B5141F!important;text-decoration:none;
  font:800 1.15rem/1.2 var(--display);box-shadow:0 4px 0 #A3141D;transition:transform .08s ease,box-shadow .08s ease}
.vz-go svg{width:24px;height:24px}
.vz-go:active{transform:translateY(3px);box-shadow:0 1px 0 #A3141D}
.vz-go:focus-visible{outline:3px solid #fff;outline-offset:3px}
.vz-aide{color:#fff;opacity:.95;line-height:1.4;font-size:.85rem}
@media (max-width:380px){.vz-carte{padding:16px 14px 12px}.vz-ic{width:44px;height:44px}.vz-titre{font-size:1.25rem}}
/* carte « Cours en direct » flottante sur toutes les pages de l'élève (#vzFlottant, mes-classes.js) ; réduite : bandeau rouge compact */
.vz-flottant{position:fixed;left:10px;right:10px;top:calc(env(safe-area-inset-top,0px) + 8px);z-index:70;max-width:560px;margin:0 auto;animation:vzArrive .35s cubic-bezier(.2,.8,.2,1)}
@keyframes vzArrive{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
.vz-flottant .vz-carte{margin:0}
.vz-reduire{position:absolute;top:10px;right:10px;width:40px;height:40px;border-radius:12px;border:0;background:rgba(255,255,255,.18);color:#fff;display:grid;place-items:center;cursor:pointer}
.vz-reduire svg{width:22px;height:22px}.vz-reduire:focus-visible,.vz-ouvrir:focus-visible{outline:3px solid #fff;outline-offset:2px}
.vz-flottant .vz-haut{padding-right:40px}
.vz-mini{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 14px;border-radius:18px;background:#E0242F;color:#fff;box-shadow:0 4px 0 #A3141D,0 10px 22px rgba(150,16,26,.3)}
.vz-ouvrir{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:1px;border:0;background:none;color:#fff;font:inherit;text-align:left;cursor:pointer;padding:2px 0}
.vz-ouvrir b{font:800 .78rem/1.2 var(--display);text-transform:uppercase;letter-spacing:.06em}.vz-ouvrir span{font-weight:700;font-size:.95rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vz-go-mini{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:14px;background:#fff;color:#B5141F!important;text-decoration:none;font:800 1rem/1 var(--display);box-shadow:0 3px 0 #A3141D}
.vz-go-mini svg{width:20px;height:20px}
@media (prefers-reduced-motion:reduce){.vz-flottant{animation:none}}
.pw-hors{position:static!important;transform:none!important;margin:6px auto;width:max-content;max-width:calc(100% - 24px)}

/* Ogrelo · abonnement : feuille contextuelle (bas d'écran sur téléphone, carte centrée sur grand écran), badges « Complet »,
   carte « Mon abonnement » (Moi), écrans de retour. Couleurs du thème (clair et sombre) via les variables de l'appli. */

/* ---------- carte « Mon abonnement » (Moi) ---------- */
.abo-c-tete{display:flex;gap:14px;align-items:center}
.abo-c-ogre{flex:none;width:56px;height:56px;border-radius:50%;background:color-mix(in srgb,var(--ogre) 14%,var(--card));display:grid;place-items:center;overflow:hidden}
.abo-c-ogre svg{width:46px;height:46px}
.abo-carte h3{margin:0}
.abo-c-etat{margin:4px 0 0;display:flex;flex-direction:column;gap:4px}
.abo-c-etat b{font-family:var(--display);font-size:1.05rem}
.abo-c-txt{margin:12px 0 0;color:var(--soft);font-size:.95rem;line-height:1.45}
.abo-c-liste{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:.94rem}
.abo-c-liste li{display:flex;gap:10px;align-items:flex-start}
.abo-c-liste i{flex:none;margin-top:2px;color:var(--ogre-d)}
.abo-c-annul{display:flex;gap:8px;align-items:flex-start;margin:14px 0 0;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--sun) 16%,var(--card));font-size:.92rem}
.abo-carte.ko .abo-c-etat b{color:var(--ko-t,var(--ko))}
.abo-c-btn{margin:18px 0 0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:1.02rem;padding:12px 14px}
.abo-c-btn+.abo-c-btn{margin-top:12px}
.abo-c-note{margin:10px 0 0;text-align:center;color:var(--soft);font-size:.86rem}
.abo-err{color:var(--ko-t,var(--ko));font-size:.92rem;margin:10px 0 0}
.abo-err:empty{display:none}

/* ---------- marques discrètes sur les points d'entrée réservés ---------- */
#hGrig{position:relative}
.abo-cad{position:absolute;top:-30px;left:50%;margin-left:14px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--sun);color:#3A2A00;border:2px solid var(--sheet,var(--card));font-size:.75rem;pointer-events:none}
.abo-badge{display:inline-flex;align-items:center;gap:4px;vertical-align:2px;margin-left:4px;padding:1px 8px 1px 6px;border-radius:999px;font-family:var(--body);font-size:.7rem;font-weight:800;letter-spacing:.02em;
  background:color-mix(in srgb,var(--sun) 22%,var(--card));color:var(--warn-t,#8A5A00);border:1px solid color-mix(in srgb,var(--sun) 45%,var(--line));white-space:nowrap}
.abo-badge i{font-size:.75rem}
.abo-cad-mini{display:inline-grid;place-items:center;width:20px;height:20px;margin-left:6px;border-radius:50%;background:var(--sun);color:#3A2A00;font-size:.65rem;vertical-align:1px}
.abo-teaser-t{display:flex!important;align-items:center;gap:6px;margin-top:4px;color:var(--warn-t,#8A5A00)!important;font-weight:700}

/* bandeau de l'aperçu (dev) */
.abo-apercu{position:fixed;z-index:950;left:50%;transform:translateX(-50%);top:calc(6px + env(safe-area-inset-top,0px));display:inline-flex;align-items:center;gap:6px;max-width:calc(100vw - 32px);
  padding:5px 12px;border-radius:999px;background:var(--ink);color:var(--paper,#fff);font-size:.78rem;font-weight:800;text-decoration:none;box-shadow:0 4px 12px rgba(0,0,0,.2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- la feuille ---------- */
html.abo-ouvert{overflow:hidden}
.abo-voile{position:fixed;inset:0;z-index:1000;background:rgba(20,18,30,.55);display:flex;align-items:flex-end;justify-content:center;padding:16px 0 0;animation:abo-fondu .2s ease-out}
.abo-feuille{position:relative;width:100%;max-width:480px;max-height:calc(100dvh - 16px);overflow:auto;background:var(--sheet,var(--card));color:var(--ink);border-radius:28px 28px 0 0;
  padding:24px 20px calc(24px + env(safe-area-inset-bottom,0px));box-shadow:0 -10px 30px rgba(0,0,0,.25);outline:none;overscroll-behavior:contain;animation:abo-monte .28s cubic-bezier(.2,.8,.2,1)}
@media (min-width:560px){.abo-voile{align-items:center;padding:16px}.abo-feuille{border-radius:28px;padding:28px 28px 26px;max-height:calc(100dvh - 32px)}}
@keyframes abo-monte{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes abo-fondu{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.abo-voile,.abo-feuille{animation:none}}
.abo-x{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:color-mix(in srgb,var(--ink) 8%,transparent);color:var(--ink);display:grid;place-items:center;z-index:1}
.abo-retour{position:absolute;top:14px;left:12px;border:0;background:none;color:var(--soft);font-weight:800;display:inline-flex;align-items:center;gap:6px;padding:10px 8px;min-height:44px}

/* héros : Ogrelo en grand, halo vert, pastille du geste */
.abo-heros{position:relative;width:128px;height:128px;margin:4px auto 10px}
.abo-halo{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--ogre) 30%,var(--card)) 0%,color-mix(in srgb,var(--ogre) 10%,var(--card)) 62%,transparent 72%)}
.abo-tete{position:absolute;inset:14px;display:block}
.abo-tete svg{width:100%;height:100%;display:block}
.abo-pastille{position:absolute;right:2px;bottom:6px;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:1.15rem;background:var(--ogre-d);color:#fff;border:3px solid var(--sheet,var(--card));box-shadow:0 3px 8px rgba(0,0,0,.15)}
.ctx-copie .abo-pastille,.ctx-langues .abo-pastille{background:var(--sky,#1F78B8)}
.ctx-groupes .abo-pastille{background:#2F8A4A}
.merci .abo-pastille{background:var(--sun);color:#3A2A00}

.abo-kicker{display:flex;justify-content:center;align-items:center;gap:6px;margin:0 0 6px;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ogre-d)}
.abo-feuille h2{text-align:center;font-size:1.38rem;line-height:1.25;margin:0 8px 10px;text-wrap:balance}
.abo-lead{text-align:center;color:var(--soft);margin:0 4px 20px;line-height:1.45}
.abo-sous{font-weight:800;margin:4px 0 10px}

.abo-av{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:12px}
.abo-av li{display:flex;align-items:center;gap:12px;line-height:1.35}
.abo-av .ic{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--ogre) 16%,var(--card));color:var(--ogre-d)}
.abo-av li:first-child{font-weight:800}

.abo-confiance{display:flex;gap:10px;align-items:flex-start;margin:0 0 18px;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--sky,#1F78B8) 9%,var(--card));font-size:.9rem;line-height:1.4}
.abo-confiance i{flex:none;margin-top:2px;color:var(--info-t,#2471AE)}

.abo-prix{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;padding:14px;border-radius:18px;border:2px solid color-mix(in srgb,var(--ogre) 45%,var(--line));background:color-mix(in srgb,var(--ogre) 8%,var(--card));margin:0 0 16px}
.abo-prix b{font-family:var(--display);font-size:1.35rem}
.abo-prix span{color:var(--soft);font-size:.92rem}

/* frise de l'essai : aujourd'hui → avant le 7e jour → jour 7 */
.abo-frise{list-style:none;margin:0 0 22px;padding:0 4px;display:flex;flex-direction:column}
.abo-frise li{position:relative;display:flex;gap:12px;padding:0 0 14px}
.abo-frise li:last-child{padding-bottom:0}
.abo-frise li:not(:last-child)::before{content:"";position:absolute;left:15px;top:32px;bottom:2px;width:2px;background:var(--line)}
.abo-frise .pt{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:.85rem;background:var(--card);border:2px solid var(--line);color:var(--soft)}
.abo-frise li.ok .pt{background:var(--ogre-d);border-color:var(--ogre-d);color:#fff}
.abo-frise .tx{display:flex;flex-direction:column;gap:2px;padding-top:4px}
.abo-frise .tx b{font-size:.96rem}
.abo-frise .tx small{color:var(--soft);font-size:.88rem;line-height:1.35}

.abo-go{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:0;font-size:1.08rem;padding:14px 16px}
.abo-go.charge{opacity:.7}
.abo-go[disabled]{opacity:.55}
.abo-plus-tard{display:block;margin:12px auto 0;border:0;background:none;color:var(--soft);font-weight:800;padding:12px 16px;min-height:44px}
.abo-gratuit{margin:18px 0 0;border:1.5px solid var(--line);border-radius:16px;padding:10px 14px}
.abo-gratuit summary{cursor:pointer;font-weight:800;color:var(--soft)}
.abo-gratuit ul{list-style:none;margin:10px 0 2px;padding:0;display:flex;flex-direction:column;gap:8px;font-size:.94rem}
.abo-gratuit li{display:flex;gap:8px;align-items:flex-start}.abo-gratuit li i{color:var(--ok);margin-top:3px}

/* étape 2 : un parent valide, ou le lien */
.abo-feuille:has(.abo-retour) .abo-heros{margin-top:30px}
.abo-parent{margin:0 0 6px}
.abo-adulte{display:flex;gap:10px;align-items:flex-start;margin:0 0 14px;font-size:.92rem;line-height:1.4}
.abo-adulte i{flex:none;margin-top:2px;color:var(--info-t,#2471AE)}
.abo-case{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:16px;margin:0 0 16px;background:color-mix(in srgb,var(--sky,#1F78B8) 10%,var(--card));border:2px solid color-mix(in srgb,var(--sky,#1F78B8) 30%,var(--line));cursor:pointer;line-height:1.4}
.abo-case input{flex:none;width:22px;height:22px;margin:1px 0 0;accent-color:var(--ogre-d)}
.abo-stripe{text-align:center;font-size:.82rem;color:var(--soft);margin:10px 0 0}
.abo-retract{font-size:.82rem;color:var(--soft);margin:14px 0 6px;line-height:1.4}
.abo-liens{font-size:.86rem;margin:0}.abo-liens a{color:var(--info-t,var(--sky))}
.abo-ou{display:flex;align-items:center;gap:12px;margin:20px 0 16px;color:var(--soft);font-size:.86rem;font-weight:800}
.abo-ou::before,.abo-ou::after{content:"";flex:1;height:1.5px;background:var(--line)}
.abo-lien p{display:flex;flex-direction:column;gap:4px;margin:0 0 12px;line-height:1.4}
.abo-lien p span{color:var(--soft);font-size:.92rem}
.abo-lien .btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:0}
.abo-ok{margin:10px 0 0;text-align:center;font-weight:700;color:var(--ok-t,#1B7A40);font-size:.92rem}
.abo-ok:empty{display:none}
.abo-lien-url{display:block;width:100%;margin:8px 0 0;padding:10px;border-radius:12px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-size:.82rem}

/* retour du paiement : quoi essayer en premier */
.abo-essayer{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:10px}
.abo-essayer li{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;border:1.5px solid var(--line);background:var(--card)}
.abo-essayer .n{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:.8rem;font-weight:800;background:var(--ogre-d);color:#fff}
.abo-essayer .ic{flex:none;color:var(--ogre-d)}
.abo-feuille>.btn:last-child{width:100%;margin:0}
.abo-roue{width:36px;height:36px;margin:6px auto 4px;border-radius:50%;border:4px solid var(--line);border-top-color:var(--ogre);animation:abo-tourne 1s linear infinite}
@keyframes abo-tourne{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.abo-roue{animation-duration:3s}}

/* sombre : verts plus clairs pour le texte et les icônes */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .abo-av .ic,:root:not([data-theme="light"]) .abo-kicker,:root:not([data-theme="light"]) .abo-c-liste i,:root:not([data-theme="light"]) .abo-essayer .ic{color:var(--ogre)}}
:root[data-theme="dark"] .abo-av .ic,:root[data-theme="dark"] .abo-kicker,:root[data-theme="dark"] .abo-c-liste i,:root[data-theme="dark"] .abo-essayer .ic{color:var(--ogre)}

/* petits écrans (320 px) */
@media (max-width:360px){.abo-feuille{padding-left:16px;padding-right:16px}.abo-heros{width:108px;height:108px}.abo-feuille h2{font-size:1.24rem;margin:0 4px 8px}.abo-pastille{width:36px;height:36px;font-size:1rem}}

/* bouton principal toujours visible en bas de la feuille (étape 1), « Plus tard » juste dessous, jamais caché */
.abo-pied{position:sticky;bottom:calc(-24px - env(safe-area-inset-bottom,0px));margin:18px -20px calc(-24px - env(safe-area-inset-bottom,0px));padding:14px 20px calc(14px + env(safe-area-inset-bottom,0px));
  background:var(--sheet,var(--card));border-top:1.5px solid var(--line);box-shadow:0 -8px 18px rgba(0,0,0,.06);z-index:2}
.abo-pied .abo-plus-tard{margin-top:4px}
@media (min-width:560px){.abo-pied{bottom:-26px;margin:18px -28px -26px;padding:14px 28px 12px}}
@media (max-width:360px){.abo-pied{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}}

/* ---------- quotas gratuits : ligne discrète dans le chat, indication sur la création de quiz du défi ---------- */
.abo-essai{margin:0;padding:8px 20px 6px;font-size:.86rem;line-height:1.4;color:var(--soft);text-align:center;text-wrap:balance}
.abo-essai i{display:inline-block;vertical-align:-3px;margin-right:6px;color:var(--ogre-d)}
.abo-defi{display:flex;align-items:center;gap:8px;margin:10px 0 0;font-size:.88rem;font-weight:700;line-height:1.35;color:var(--ogre-d)}
.abo-defi.fini{color:var(--soft);font-weight:600}
.abo-defi i{flex:none}
/* essai (GRATUIT_ESSAI) : écran de fin d'essai, choix de la matière, bloc de fin d'aperçu */
.abo-essai-fin .abo-lead{font-size:1.05rem;color:var(--ink,inherit);font-weight:600;text-wrap:balance}
.abo-garde{display:flex;gap:8px;align-items:flex-start;justify-content:center;margin:-8px 8px 18px;font-size:.88rem;line-height:1.4;color:var(--soft);text-align:left}
.abo-garde i{color:var(--ogre-d);flex:none;margin-top:2px}
.abo-choix .abo-lead{text-wrap:balance}
.abo-suite{position:relative;display:grid;grid-template-columns:56px 1fr;gap:6px 12px;align-items:center;margin:-34px 0 18px;padding:46px 16px 16px;border-radius:18px;
  background:linear-gradient(to bottom,transparent,var(--bg,#fff) 34px);text-align:left}
.abo-suite-tete{grid-row:span 2;width:56px;height:56px}
.abo-suite-tete svg{width:100%;height:100%}
.abo-suite p{margin:0;display:flex;flex-direction:column;gap:2px;font-size:.9rem;line-height:1.4;color:var(--soft)}
.abo-suite p b{color:var(--ink,inherit);font-size:.98rem}
.abo-suite .btn{grid-column:1/-1;margin-top:8px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .abo-garde i{color:var(--ogre)}}
:root[data-theme="dark"] .abo-garde i{color:var(--ogre)}
/* fin d'essai (A/B « blocage ») : progrès déjà acquis, ce que l'élève débloquerait, partage du lien en un geste ; page du parent : accroche, ce que l'enfant a fait, rassurance */
.abo-progres{margin:14px 0 12px;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--ogre) 12%,var(--card));text-align:left}
.abo-pr-t{margin:0;font-weight:800;display:flex;gap:8px;align-items:center}.abo-pr-t i{color:var(--ogre-d)}
.abo-pr-n{margin:4px 0 0;color:var(--soft);font-size:.92rem}
.abo-pr-m{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.abo-pr-m li{display:grid;grid-template-columns:minmax(0,7em) 1fr auto;gap:8px;align-items:center;font-size:.9rem}
.abo-pr-m b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.abo-pr-m small{color:var(--soft)}
.abo-pr-barre{height:8px;border-radius:99px;background:color-mix(in srgb,var(--ink) 10%,transparent);overflow:hidden}.abo-pr-barre span{display:block;height:100%;background:var(--ogre-d);border-radius:99px}
.abo-debloque{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px;text-align:left}
.abo-debloque li{display:flex;gap:10px;align-items:flex-start;font-size:.95rem}.abo-debloque i{flex:none;margin-top:2px;color:var(--ogre-d)}
.abo-partage{margin:16px 0 0;text-align:left}
.abo-pa-t{margin:0 0 8px;font-weight:800}
.abo-pa-case{display:flex;gap:8px;align-items:flex-start;margin:0 0 10px;font-size:.92rem}.abo-pa-case input{margin-top:3px;width:18px;height:18px;flex:none}
.abo-pa-btns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.abo-pa-btns .abo-pa{width:100%;min-height:44px;margin:0;justify-content:center}
.abo-pa-btns .abo-pa:first-child{grid-column:1/-1}
.abo-pa-qr{margin:12px auto 0;max-width:220px;text-align:center}.abo-pa-qr svg{width:100%;height:auto;border-radius:12px;display:block}.abo-pa-qr small{display:block;margin-top:6px;color:var(--soft)}
.of-accroche{margin:6px 0 0;text-align:left}.of-acc-t{margin:0;font-family:var(--display);font-size:1.2rem;font-weight:800}.of-acc-s{margin:4px 0 0;color:var(--soft)}
.of-fait{margin:12px 0 0;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--ogre) 12%,var(--card));text-align:left}
.of-fait p{margin:4px 0 0}.of-fait-t{font-weight:800;display:flex;gap:8px;align-items:center}.of-fait-t i{color:var(--ogre-d)}.of-fait ul{margin:6px 0 0;padding-left:20px}
.of-rassure{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:6px;text-align:left;font-size:.92rem}
.of-rassure li{display:flex;gap:8px;align-items:flex-start}.of-rassure i{flex:none;margin-top:2px;color:var(--ogre-d)}

/* Ogrelo · « Ogrelo complet » expliqué au parent (offre.js) : comparatif, écran pré-paiement. Couleurs du thème avec valeurs de secours
   (appli de l'élève et espace parent n'ont pas tout à fait les mêmes variables), clair et sombre. */
.of-bandeau{display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;padding:6px 12px;border-radius:999px;font-size:.85rem;font-weight:800;
  background:color-mix(in srgb,var(--sky,#1F78B8) 14%,var(--card,#fff));color:var(--sky-t,var(--ink,#22261F));border:1px solid color-mix(in srgb,var(--sky,#1F78B8) 35%,var(--line,#E4E2DA))}
.of-lead{color:var(--soft,#5D6559);margin:0 0 18px;line-height:1.5}
.of-comp{display:grid;grid-template-columns:1fr;gap:14px;margin:0 0 10px}
@media (min-width:720px){.of-comp{grid-template-columns:1fr 1fr}}
.of-col{border-radius:18px;padding:16px 16px 6px;border:1px solid var(--line,#E4E2DA);background:var(--card,#fff)}
.of-complet{border:2px solid color-mix(in srgb,var(--ogre,#5BA84A) 55%,var(--line,#E4E2DA));background:color-mix(in srgb,var(--ogre,#5BA84A) 6%,var(--card,#fff))}
.of-col h3{margin:0;font-size:1.08rem;display:flex;align-items:center;gap:8px}
.of-complet h3{color:var(--ogre-d,#3E7F31)}
.of-sous{margin:4px 0 12px;color:var(--soft,#5D6559);font-size:.9rem}
.of-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.of-col li{display:grid;grid-template-columns:22px 1fr;gap:10px;font-size:.94rem;line-height:1.4;padding-bottom:10px}
.of-col li i{margin-top:2px;color:var(--soft,#5D6559)}
.of-complet li i{color:var(--ogre-d,#3E7F31)}
.of-note{color:var(--soft,#5D6559);font-size:.84rem;margin:6px 0 18px}
.of-pre{margin:6px 0 16px}
.of-prix{margin:0 0 16px;font-size:1rem}.of-prix b{font-size:1.25rem}
.of-formules{border:0;margin:0 0 16px;padding:0;display:grid;gap:10px}
.of-formules legend{font-weight:800;margin:0 0 8px}
.of-formule{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:14px;border:2px solid var(--line,#E4E2DA);cursor:pointer}
.of-formule:has(input:checked){border-color:var(--ogre-d,#3E7F31)}
.of-formule input{width:20px;height:20px;accent-color:var(--ogre-d,#3E7F31)}
.of-formule span{display:flex;flex-direction:column}.of-formule small{color:var(--soft,#5D6559)}
.of-frise{list-style:none;margin:0 0 16px;padding:0 4px;display:flex;flex-direction:column}
.of-frise li{position:relative;display:flex;gap:12px;padding:0 0 16px}
.of-frise li:last-child{padding-bottom:0}
.of-frise li:not(:last-child)::before{content:"";position:absolute;left:15px;top:34px;bottom:4px;width:2px;background:var(--line,#E4E2DA)}
.of-frise .pt{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:.85rem;background:var(--card,#fff);border:2px solid var(--line,#E4E2DA);color:var(--soft,#5D6559)}
.of-frise li.ok .pt{background:var(--ogre-d,#3E7F31);border-color:var(--ogre-d,#3E7F31);color:#fff}
.of-frise .tx{display:flex;flex-direction:column;gap:2px;padding-top:5px}
.of-frise .tx b{font-size:.98rem}.of-frise .tx small{color:var(--soft,#5D6559);font-size:.9rem;line-height:1.4}
.of-direct{margin:0 0 16px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--sun,#F2B90F) 14%,var(--card,#fff))}
.of-garanties{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:.9rem;color:var(--soft,#5D6559)}
.of-garanties li{display:grid;grid-template-columns:20px 1fr;gap:10px}
.of-case{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:16px;margin:0 0 16px;font-weight:700;
  background:color-mix(in srgb,var(--sky,#1F78B8) 10%,var(--card,#fff));border:2px solid color-mix(in srgb,var(--sky,#1F78B8) 30%,var(--line,#E4E2DA))}
.of-case input{flex:none;width:22px;height:22px;margin:1px 0 0;accent-color:var(--ogre-d,#3E7F31)}
.of-go{width:100%}
.of-petit{color:var(--soft,#5D6559);font-size:.84rem;margin:12px 0 0;line-height:1.45}
.of-err{color:var(--ko,#C2412F);font-size:.92rem;margin:10px 0 0}.of-err:empty{display:none}
.of-rend{margin:18px 0 0;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--ogre,#5BA84A) 10%,var(--card,#fff));font-size:.9rem}
/* feuille neutre côté élève */
.of-eleve{text-align:center}.of-eleve .btn{width:100%;margin-top:12px}

/* « Brevet blanc » (brevet.js) : liste des sujets, sommaire, question par question, corrigé, bilan. Mobile d'abord (320-430 px), clair et sombre. */
.bv-tuile{background:linear-gradient(135deg,#2471AE,#2C8577);box-shadow:0 5px 0 #18557F}
.bv-tuile:active{box-shadow:0 2px 0 #18557F}
.bv .cm-in{max-width:620px}
.bv h3,.bv h4{font-family:var(--display);color:var(--ink)}
.bv-hero{display:flex;gap:14px;align-items:flex-start;margin:0 0 18px}
.bv-hero-i{flex:none;width:48px;height:48px;border-radius:16px;display:grid;place-items:center;font-size:1.4rem;color:#fff;background:linear-gradient(135deg,#2471AE,#2C8577)}
.bv-hero h3{font-size:1.2rem;margin:2px 0 4px}.bv-hero p{margin:0;color:var(--soft);line-height:1.45;font-size:.95rem}
.bv-eps{margin:0 0 18px}
.bv-liste,.bv-parties,.bv-revoir{display:flex;flex-direction:column;gap:12px;margin:0 0 18px}
.bv-sujet,.bv-partie,.bv-rev{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:16px;border:2px solid var(--line);border-radius:18px;background:var(--card);color:var(--ink);font:inherit;cursor:pointer}
.bv-sujet:active,.bv-partie:active,.bv-rev:active{transform:scale(.99)}
.bv-sujet-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.bv-sujet-tx b{font-family:var(--display);font-size:1.08rem;line-height:1.25}
.bv-sujet-tx small{color:var(--soft);font-size:.84rem;line-height:1.35}
.bv-sujet-tx em,.bv-partie-t em{align-self:flex-start;font-style:normal;font-size:.72rem;font-weight:800;color:var(--ink);background:color-mix(in srgb,var(--sky) 22%,var(--card));border-radius:999px;padding:2px 9px}
.bv-etat{align-self:flex-start;font-size:.78rem;font-weight:800;color:var(--soft);margin-top:2px}
.bv-etat.cours{color:var(--info-t)}.bv-etat.fini{color:var(--ok-t)}
.bv-partie.fait{border-color:color-mix(in srgb,var(--ok) 45%,var(--line))}
.bv-partie.fait .ex-pastille{background:color-mix(in srgb,var(--ok) 22%,var(--card))}
.bv-mention{display:flex;gap:10px;align-items:flex-start;margin:0 0 14px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--sky) 10%,var(--card));border:1px solid var(--line);font-size:.86rem;line-height:1.45;color:var(--ink)}
.bv-mention i{flex:none;margin-top:2px;color:var(--info-t)}.bv-mention a{color:var(--info-t);font-weight:800}
.bv-infos{display:flex;flex-wrap:wrap;gap:8px 16px;margin:0 0 12px;font-size:.9rem;font-weight:700;color:var(--ink)}
.bv-infos span{display:inline-flex;align-items:center;gap:6px}
.bv-note{margin:0 0 12px;font-size:.86rem;color:var(--soft);line-height:1.45}
.bv-chrono{display:inline-flex;align-items:center;gap:10px;margin:0 0 18px;padding:6px 6px 6px 14px;border-radius:999px;border:2px solid var(--line);background:var(--card);font-size:.9rem;color:var(--soft)}
.bv-chrono b{color:var(--ink);font-variant-numeric:tabular-nums}
.bv-chrono.on{border-color:color-mix(in srgb,var(--sky) 55%,var(--line))}
.bv-chrono.depasse b{color:var(--warn-t)}
.bv-chrono-b{width:36px;height:36px;border-radius:50%;border:0;display:grid;place-items:center;background:color-mix(in srgb,var(--sky) 18%,var(--card));color:var(--ink)}
.bv-acts{display:flex;flex-direction:column;gap:0;margin:6px 0 10px}
.bv-barre{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 6px}
.bv-barre .ex-retour{margin:0}.bv-barre .bv-chrono{margin:0}
.bv-partie-t{display:flex;flex-direction:column;gap:6px;margin:6px 0 14px}
.bv-partie-t b{font-family:var(--display);font-size:1.12rem;line-height:1.25}
.bv-partie-t small{font-size:.76rem;font-weight:800;color:var(--soft);text-transform:uppercase;letter-spacing:.03em}
.bv-bloc{font-size:.98rem;margin:8px 0 -2px;color:var(--ink)}.bv-bloc small{font-family:var(--body);font-weight:700;font-size:.82rem;color:var(--soft);margin-left:4px}
.bv-partie-t p{margin:0;color:var(--soft);font-size:.92rem;line-height:1.45}
/* documents */
.bv-docs{border:2px solid var(--line);border-radius:18px;background:var(--card);margin:0 0 16px;overflow:hidden}
.bv-docs-t{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;color:var(--ink);font:inherit;padding:14px 16px;text-align:left}
.bv-docs-t b{flex:1}
.bv-docs-l{display:flex;flex-direction:column;gap:18px;padding:0 16px 16px}
.bv-doc h4{font-size:1rem;margin:0 0 8px}
.bv-texte{margin:0;padding:0 0 0 2.4em;list-style:none;font-size:.97rem;line-height:1.6}
.bv-texte li{position:relative}
.bv-l{position:absolute;left:-2.4em;width:1.8em;text-align:right;font-size:.75rem;color:var(--soft);top:.25em}
.bv-texte li.vide{height:.7em}
.bv-src{margin:8px 0 0;font-size:.82rem;color:var(--soft);font-style:italic;line-height:1.4}
.bv-script{margin:0;padding:12px 14px;border-radius:12px;background:var(--paper);border:1px solid var(--line);font:.88rem/1.55 ui-monospace,Menlo,Consolas,monospace;color:var(--ink);white-space:pre-wrap;overflow-x:auto}
.bv-tbl{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px;border:1px solid var(--line)}
.bv-tbl table{border-collapse:collapse;min-width:100%;font-size:.88rem}
.bv-tbl th,.bv-tbl td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.bv-tbl th{background:var(--paper);font-weight:800}
.bv-tbl tr:last-child td{border-bottom:0}
.bv-img{display:block;max-width:100%;height:auto;border-radius:12px;border:1px solid var(--line);background:#fff}
.bv-ext p{margin:0 0 8px;line-height:1.45}.bv-ext .btn{display:inline-block;width:auto;padding:10px 16px;font-size:1rem;text-decoration:none;margin:4px 0 0}
/* une question */
.bv-q{background:var(--card);border:2px solid var(--line);border-radius:20px;padding:18px 16px;margin:0 0 16px}
.bv-q-t{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.bv-num{font-family:var(--display);font-weight:800;font-size:1.02rem;color:var(--ink)}
.bv-pts{font-size:.78rem;font-weight:800;color:var(--ink);background:color-mix(in srgb,var(--sun) 30%,var(--card));border-radius:999px;padding:2px 10px;white-space:nowrap}
.bv-pts.ok{background:color-mix(in srgb,var(--ok) 24%,var(--card))}.bv-pts.ko{background:color-mix(in srgb,var(--ko) 20%,var(--card))}
.bv-pos{margin-left:auto;font-size:.8rem;font-weight:800;color:var(--soft)}
.bv-enonce{font-size:1.02rem;line-height:1.55;margin:0 0 12px;white-space:pre-line}
.bv-choix{margin:0 0 14px;padding-left:1.6em;line-height:1.5}.bv-choix li{margin:4px 0}
.bv-brouillon{display:flex;flex-direction:column;gap:6px;margin:4px 0 14px;font-size:.86rem;font-weight:700;color:var(--soft)}
.bv-brouillon textarea{width:100%;border:2px solid var(--line);border-radius:14px;background:var(--paper);color:var(--ink);font:1rem/1.5 var(--body);padding:10px 12px;resize:vertical}
.bv-brouillon textarea:focus{outline:none;border-color:color-mix(in srgb,var(--sky) 60%,var(--line))}
.bv-q-acts{display:flex;flex-direction:column}
.bv-q-acts .btn,.bv-ia-form .btn,.bv-fiche{display:flex;align-items:center;justify-content:center;gap:8px;white-space:normal}
.bv-q .fig{margin:0 0 12px}
/* corrigé et auto-évaluation */
.bv-corrige{margin:6px 0 0;padding:16px 0 0;border-top:2px dashed var(--line)}
.bv-corrige h4{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:1.05rem;color:var(--ok-t)}
.bv-corrige.mini{border-top:0;padding-top:4px}
.bv-bonne{margin:0 0 10px;line-height:1.45}
.bv-etapes{margin:0 0 14px;padding-left:1.4em;line-height:1.55}.bv-etapes li{margin:0 0 6px}
.bv-methode,.bv-attendu{border-radius:14px;padding:12px 14px;margin:0 0 12px;line-height:1.45}
.bv-methode{background:color-mix(in srgb,var(--sun) 16%,var(--card))}
.bv-attendu{background:color-mix(in srgb,var(--sky) 12%,var(--card))}
.bv-methode b,.bv-attendu b{display:flex;align-items:center;gap:7px;font-size:.9rem;margin:0 0 4px}
.bv-methode p{margin:0}.bv-attendu ul{margin:0;padding-left:1.2em}.bv-attendu li{margin:2px 0}
.bv-auto{margin:16px 0 0}
.bv-auto>b{display:block;font-family:var(--display);font-size:1rem;margin:0 0 10px}
.bv-auto-b{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.bv-auto-b button{border:2px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);font-weight:800;font-size:.9rem;padding:12px 6px;line-height:1.25}
.bv-auto-b button.on.e-t{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 18%,var(--card))}
.bv-auto-b button.on.e-p{border-color:var(--sun);background:color-mix(in srgb,var(--sun) 22%,var(--card))}
.bv-auto-b button.on.e-r{border-color:var(--ko);background:color-mix(in srgb,var(--ko) 14%,var(--card))}
.bv-auto-pts{margin:10px 0 0;font-weight:800;font-size:.9rem;color:var(--ink)}
/* correction de la copie par Ogrelo */
.bv-ia-zone:empty{display:none}
.bv-ia-form,.bv-ia{margin:6px 0 14px;padding:16px;border-radius:16px;background:var(--paper);border:1px solid var(--line);line-height:1.45}
.bv-ia-form>b{display:block;font-family:var(--display);margin:0 0 4px}.bv-ia-form>p{margin:0 0 12px;font-size:.9rem;color:var(--soft)}
.bv-photo{cursor:pointer}
.bv-gratuit{display:flex;align-items:center;justify-content:center;gap:8px;margin:2px 0 12px;font-size:.86rem;font-weight:700;line-height:1.35;color:var(--ogre-d);text-align:center;text-wrap:balance}
.bv-gratuit.fini{color:var(--soft);font-weight:600}
.bv-gratuit i{flex:none}
.bv-ia-n{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:.88rem;font-weight:700;color:var(--ok-t)}
.bv-err{display:flex;gap:8px;align-items:flex-start;margin:0 0 10px;font-size:.88rem;color:var(--ko-t);font-weight:700}
.bv-ia.attente{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--soft)}
/* CORRECTION_LENTE : écran d'attente (Grignon qui corrige, étapes allumées l'une après l'autre sur le temps estimé) */
.bv-ia.bv-lent{align-items:flex-start;gap:14px;font-weight:400;color:inherit}
.bv-lent-ogre{position:relative;flex:0 0 64px;width:64px;height:64px;animation:bvLentOgre 2.4s ease-in-out infinite}
.bv-lent-ogre svg{width:100%;height:100%}
.bv-lent-crayon{position:absolute;right:-4px;bottom:6px;width:22px;height:6px;border-radius:3px;background:var(--accent,#f2a93b);transform-origin:left center;animation:bvLentCrayon .9s ease-in-out infinite alternate}
.bv-lent-tx{flex:1;min-width:0}.bv-lent-tx b{display:block;margin-bottom:6px}.bv-lent-tx small{color:var(--soft)}
.bv-lent-et{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:4px}
.bv-lent-et li{position:relative;padding-left:22px;color:var(--soft);animation:bvLentEtape var(--est) linear both;animation-delay:calc(var(--est) / 3 * var(--n) + var(--deja))}
.bv-lent-et li::before{content:"";position:absolute;left:2px;top:.45em;width:10px;height:10px;border-radius:50%;border:2px solid currentColor}
@keyframes bvLentEtape{0%{color:var(--ink,inherit);font-weight:700}33%{color:var(--ink,inherit);font-weight:700}34%,100%{color:var(--soft);font-weight:400}}
@keyframes bvLentOgre{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
@keyframes bvLentCrayon{from{transform:rotate(-18deg)}to{transform:rotate(12deg)}}
@media (prefers-reduced-motion:reduce){.bv-lent-ogre,.bv-lent-crayon,.bv-lent-et li{animation:none}}
.bv-ia.ko b{display:flex;gap:8px;align-items:center;color:var(--ko-t)}.bv-ia.ko p{margin:6px 0 0}
.bv-ia-note{display:flex;align-items:baseline;gap:6px;margin:0 0 6px}
.bv-ia-note b{font-family:var(--display);font-size:2rem;line-height:1;color:var(--ink)}.bv-ia-note span{font-weight:800;color:var(--soft)}
.bv-ia-bilan{margin:0 0 10px;font-weight:700}
.bv-ia-l{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:6px}
.bv-ia-l li{display:flex;gap:8px;align-items:flex-start;font-size:.92rem}
.bv-ia-l li i{flex:none;margin-top:3px}
.bv-ia-l.ok i{color:var(--ok-t)}.bv-ia-l.ko i{color:var(--warn-t)}
/* navigation */
.bv-nav{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 18px}
.bv-nav .btn{margin:0;display:flex;align-items:center;justify-content:center;gap:6px;font-size:.9rem;padding:13px 8px;white-space:normal}
.bv-nav .btn:disabled{visibility:hidden}
/* partie en quiz */
.bv-jeu{margin:0 0 18px}
.bv-quiz-fait{border-radius:18px;padding:16px;background:color-mix(in srgb,var(--ok) 12%,var(--card));margin:0 0 18px;line-height:1.45}
.bv-quiz-fait p{margin:0 0 12px;font-weight:700}.bv-quiz-fait .btn{margin:0;display:flex;align-items:center;justify-content:center;gap:8px}
.bv-corr-liste{margin:0 0 18px}.bv-corr-liste h4{margin:0 0 10px;font-size:1.05rem}
.bv-det{border:2px solid var(--line);border-radius:16px;background:var(--card);margin:0 0 10px;padding:0 14px}
.bv-det summary{display:flex;align-items:flex-start;gap:10px;padding:12px 0;cursor:pointer;list-style:none}
.bv-det summary::-webkit-details-marker{display:none}
.bv-det-q{flex:1;min-width:0;font-size:.92rem;line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.bv-det[open] .bv-det-q{display:block}
.bv-det[open]{padding-bottom:6px}
/* bilan */
.bv-bilan{border-radius:20px;padding:20px 18px;background:var(--card);border:2px solid var(--line);text-align:center;margin:4px 0 20px;line-height:1.45}
.bv-bilan.bon{background:color-mix(in srgb,var(--ok) 12%,var(--card));border-color:color-mix(in srgb,var(--ok) 40%,var(--line))}
.bv-bilan small{display:block;font-weight:800;color:var(--soft);text-transform:uppercase;letter-spacing:.04em;font-size:.74rem}
.bv-bilan-note{display:flex;justify-content:center;align-items:baseline;gap:8px;margin:6px 0 2px}
.bv-bilan-note b{font-family:var(--display);font-size:2.8rem;line-height:1}.bv-bilan-note span{font-weight:800;font-size:1.2rem;color:var(--soft)}
.bv-sur20{margin:0 0 8px;font-weight:700;color:var(--soft)}
.bv-bilan p{margin:6px 0 0}
.bv-h4{font-size:1.05rem;margin:0 0 10px}
.bv-parts{display:flex;flex-direction:column;gap:12px;margin:0 0 20px}
.bv-part{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;font-size:.92rem}
.bv-part b{white-space:nowrap}.bv-part .ex-barre{grid-column:1/-1;margin:0}
.bv-rev .ex-pastille{width:40px;height:40px}
@media (max-width:360px){.bv-q{padding:16px 12px}.bv-sujet,.bv-partie,.bv-rev{padding:14px 12px;gap:12px}.bv-auto-b button{font-size:.84rem;padding:11px 4px}.bv-texte{padding-left:2em}}
.bv-inter{margin:0 0 14px}.bv-inter .exo-ch{margin:0 0 12px}.bv-inter .btn{margin:0}.bv-inter .exo-in{margin:0 0 10px}
.bv-inter .exo-ch button b{margin-right:4px}
.bv-verdict{display:flex;align-items:center;gap:8px;margin:2px 0 0;font-weight:800}.bv-verdict.ok{color:var(--ok-t)}.bv-verdict.ko{color:var(--ko-t)}
.bv-tombe{margin:6px 0 18px}.bv-tombe .bv-h4{display:flex;align-items:center;gap:8px}.bv-tombe .moi-lead{margin:0 0 12px}
.bv-rev .ex-niv-tx b{font-family:var(--body);font-size:.93rem;font-weight:600;line-height:1.4}
.bv-rev .ex-niv-tx em{align-self:flex-start;font-style:normal;font-size:.7rem;font-weight:800;color:var(--ink);background:color-mix(in srgb,var(--sky) 22%,var(--card));border-radius:999px;padding:2px 9px;margin-bottom:3px}
.bv-carte{display:flex;align-items:center;gap:14px;width:100%;text-align:left;margin:16px 0 0;padding:16px;border:2px solid var(--line);border-radius:20px;background:var(--card);color:var(--ink);font:inherit;cursor:pointer;box-shadow:var(--shadow)}
.bv-carte:active{transform:scale(.99)}
.bv-carte-i{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:1.3rem;color:#fff;background:linear-gradient(135deg,#2471AE,#2C8577)}
.bv-carte-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.bv-carte-tx b{font-family:var(--display);font-size:1.1rem}.bv-carte-tx small{color:var(--soft);font-size:.84rem;line-height:1.35}
.bv-carte-ep{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.bv-carte-ep span{font-size:.78rem;font-weight:700;border-radius:999px;padding:3px 10px;background:var(--paper);color:var(--ink)}

/* « Tombé au brevet » dans la révision d'un contrôle (écran du devoir, app-home.js) */
.bv-ctl-h{display:flex;align-items:center;gap:10px;margin:0 0 8px}
.bv-ctl-i{flex:none;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#2471AE,#2C8577);font-size:1rem}
.d-box p.bv-ctl-lead{margin:0 0 16px;color:var(--soft);font-size:.92rem;line-height:1.45;white-space:normal}
.bv-ctl-l{display:flex;flex-direction:column;gap:14px}
.bv-ctl-q{border:2px solid var(--line);border-radius:16px;padding:14px;background:var(--paper)}
.bv-ctl-t{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:0 0 8px}
.bv-ctl-t em{font-style:normal;font-size:.74rem;font-weight:800;color:var(--ink);background:color-mix(in srgb,var(--sky) 22%,var(--card));border-radius:999px;padding:3px 10px;line-height:1.3}
.bv-ctl-ex{display:block;margin:0 0 6px;font-size:.78rem;font-weight:700;color:var(--soft);line-height:1.35}
.bv-ctl-q .bv-enonce{font-size:.98rem;margin:0 0 12px}
.bv-ctl-q .fig,.bv-ctl-q .bv-img{margin:0 0 12px}
.bv-ctl-q .bv-inter{margin:0}
.bv-ctl-q .exo-ch button{background:var(--card)}
.bv-ctl-q .bv-corrige{margin:12px 0 0;padding-top:12px}
.bv-ctl-q .bv-corrige.mini{padding-top:8px}
.d-box .bv-ctl-q p{white-space:normal}
.bv-ctl-acts{display:flex;flex-direction:column;gap:8px}
.bv-ctl-acts .btn{margin:0;display:flex;align-items:center;justify-content:center;gap:8px;white-space:normal;font-size:.98rem;padding:12px 10px}
.bv-ctl-q .bv-gratuit{margin:10px 0 0}
.bv-ctl-doc{display:flex;align-items:center;gap:8px;margin:10px auto 0;border:0;background:none;color:var(--info-t);font:inherit;font-size:.88rem;font-weight:700;padding:8px 4px;cursor:pointer}
.d-box p.bv-ctl-note{display:flex;gap:8px;align-items:flex-start;margin:14px 0 0;font-size:.8rem;color:var(--soft);line-height:1.4;white-space:normal}
.bv-ctl-note i{flex:none;margin-top:2px}
.bv-ctl-lien{display:block;margin:10px 0 0;padding:8px 0;border:0;background:none;color:var(--soft);font:inherit;font-size:.86rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.bv-ctl-choix{margin:16px 0 0;padding:14px;border-radius:16px;border:2px solid var(--line);background:var(--paper)}
.bv-ctl-choix>b{display:block;font-family:var(--display);font-size:1rem;margin:0 0 10px;color:var(--ink)}
.bv-ctl-choix [role=radiogroup]{display:flex;flex-direction:column;gap:8px;margin:0 0 14px}
.bv-ctl-choix [role=radio],.bv-ctl-plus{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:11px 12px;border:2px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font:inherit;font-size:.92rem;line-height:1.35;cursor:pointer}
.bv-ctl-choix [role=radio][aria-checked=true]{border-color:color-mix(in srgb,var(--sky) 70%,var(--line));background:color-mix(in srgb,var(--sky) 12%,var(--card))}
.bv-ctl-r{flex:none;width:18px;height:18px;border-radius:50%;border:2px solid var(--line);background:var(--card)}
[aria-checked=true]>.bv-ctl-r{border-color:var(--info-t);box-shadow:inset 0 0 0 4px var(--card);background:var(--info-t)}
.bv-ctl-plus{justify-content:center;border-style:dashed;color:var(--soft);font-weight:700}
@media (max-width:360px){.bv-ctl-q{padding:12px 10px}.bv-ctl-choix{padding:12px 10px}}

/* origine du corrigé (éléments de correction officiels / rédigé par Ogrelo) et images découpées dans le sujet officiel (agrandies au toucher) */
.bv-origine{display:flex;gap:8px;align-items:flex-start;margin:0 0 12px;padding:9px 12px;border-radius:12px;border:1px solid var(--line);background:var(--card);font-size:.84rem;line-height:1.45;color:var(--ink)}
.bv-origine i{flex:none;margin-top:2px;color:var(--soft)}.bv-origine b{font-weight:800}
.bv-origine a{display:inline-block;margin-left:6px;color:var(--info-t);font-weight:800;white-space:nowrap}
.bv-origine.off{background:color-mix(in srgb,var(--ok-t) 8%,var(--card));border-color:color-mix(in srgb,var(--ok-t) 35%,var(--line))}.bv-origine.off i{color:var(--ok-t)}
.bv-fig{margin:4px 0 0}.bv-fig .illus-c{cursor:zoom-in;background:#fff;border-radius:12px}.bv-fig .bv-img{border:0;border-radius:0;width:100%}
.illus-plein .bv-fig .illus-c{cursor:default}
.bv-leg{margin:8px 0 0;font-size:.86rem;color:var(--ink);line-height:1.4}

/* quiz d'une partie : le bouton Valider ne colle pas aux réponses */
.bv-jeu .exo-valide{margin-top:18px!important}
.bv-glob{display:flex;gap:8px;align-items:flex-start;line-height:1.45}.bv-glob i{flex:none;margin-top:2px}

/* liseuse des PDF officiels : plein écran au-dessus du module, pages empilées, toucher = zoom */
.bv-lis{position:fixed;inset:0;z-index:95;background:var(--paper);display:flex;flex-direction:column}
.bv-lis-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;border-bottom:1px solid var(--line);background:var(--paper)}
.bv-lis-top b{font-family:var(--display);font-size:1.05rem;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bv-lis-pages{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:12px 12px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:14px}
.bv-lis-p{margin:0;width:100%;max-width:820px}.bv-lis-p .illus-c{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.bv-lis-p img{display:block;width:100%;height:auto;border-radius:6px;background:#fff;box-shadow:0 1px 6px color-mix(in srgb,#000 18%,transparent)}
.bv-lis-p figcaption{text-align:center;font-size:.78rem;font-weight:700;color:var(--soft);margin-top:6px}
.bv-lis-load{color:var(--soft);font-weight:700;margin:40px 0}
/* « Version papier » : deux façons de faire un sujet officiel, le sujet sur feuille, l'envoi de la copie (pages ordonnées), la correction */
.bv-modes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 16px}
.bv-modes-t{grid-column:1/-1;margin:0;font-size:.86rem;font-weight:800;color:var(--soft)}
.bv-mode{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;padding:14px 12px;border:2px solid var(--line);border-radius:18px;background:var(--card);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.bv-mode:active{transform:scale(.99)}
.bv-mode.on{border-color:color-mix(in srgb,var(--sky) 65%,var(--line));background:color-mix(in srgb,var(--sky) 9%,var(--card))}
.bv-mode b{font-family:var(--display);font-size:1rem;line-height:1.2}
.bv-mode small{color:var(--soft);font-size:.8rem;line-height:1.35}
.bv-mode-i{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-size:1.15rem;color:var(--ink);background:color-mix(in srgb,var(--sky) 18%,var(--card))}
.bv-mode.on .bv-mode-i{color:#fff;background:linear-gradient(135deg,#2471AE,#2C8577)}
.bv-mode-e{font-size:.74rem;font-weight:800;color:var(--info-t)}.bv-mode-e.ok{color:var(--ok-t)}
.bv-pap{display:flex;flex-direction:column;gap:12px;margin:0 0 14px}
.bv-pap-e{display:flex;gap:12px;align-items:flex-start;padding:16px 14px;border:2px solid var(--line);border-radius:18px;background:var(--card)}
.bv-pap-e>div{flex:1;min-width:0}
.bv-pap-e b{display:block;font-family:var(--display);font-size:1.02rem;line-height:1.25;color:var(--ink)}
.bv-pap-e p{margin:4px 0 0;color:var(--soft);font-size:.9rem;line-height:1.45}
.bv-pap-e .btn{display:flex;align-items:center;justify-content:center;gap:8px;margin:12px 0 0;white-space:normal}
.bv-pap-e .bv-gratuit{margin:12px 0 0}
.bv-pap-n{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.9rem;color:var(--ink);background:color-mix(in srgb,var(--sun) 35%,var(--card))}
.bv-pap-acts{display:flex;flex-direction:column;gap:8px}
.bv-pap-dl{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;font-size:.88rem;font-weight:800;color:var(--info-t);text-decoration:none;padding:4px 0}
.bv-pap-att{margin:0 0 14px}
.bv-pap-res{margin:0 0 14px;border-color:color-mix(in srgb,var(--ok) 45%,var(--line))}
.bv-pap-res .ex-pastille{background:color-mix(in srgb,var(--ok) 22%,var(--card))}
.bv-pages{list-style:none;margin:0 0 14px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px}
.bv-page{position:relative;display:flex;flex-direction:column;gap:6px;padding:8px;border:2px solid var(--line);border-radius:16px;background:var(--card)}
.bv-page img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px;background:#fff}
.bv-page-n{font-size:.82rem;font-weight:800;color:var(--ink);text-align:center}
.bv-page-b{display:flex;justify-content:space-between;gap:6px}
.bv-page-b button{flex:1;min-height:40px;border:0;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--sky) 14%,var(--card));color:var(--ink);font-size:1rem;cursor:pointer}
.bv-page-b button:disabled{opacity:.35;cursor:default}
.bv-page-b button[data-rm]{background:color-mix(in srgb,var(--ko) 14%,var(--card));color:var(--ko-t)}
.bv-pap-add{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 14px}
.bv-cbilan{text-align:left;font-size:.95rem;line-height:1.5;margin:10px 0 8px!important}
.bv-ill{display:flex;gap:6px;justify-content:center;align-items:flex-start;color:var(--warn-t)}
.bv-exemple{background:color-mix(in srgb,var(--sun) 14%,var(--card))}
.bv-prio{align-items:flex-start}.bv-prio .ex-niv-tx small{display:block;margin-top:2px}
.bv-prio-n{font-weight:800;font-size:.95rem;color:var(--ink)}
.bv-prio-b{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-style:normal;font-size:.8rem;font-weight:800;color:var(--info-t)}
.bv-cq-t{margin:14px 0 8px;font-weight:800;font-size:.92rem;color:var(--ink)}
.bv-cq summary .bv-pts{flex:none}
.bv-cq-c{padding:0 0 10px}.bv-cq-c p{margin:0 0 8px;line-height:1.45;font-size:.92rem}
.bv-cq-c .btn{display:flex;align-items:center;justify-content:center;gap:8px;margin:4px 0 0;padding:10px 14px;font-size:.95rem}
@media (max-width:359px){.bv-modes{grid-template-columns:1fr}.bv-mode{flex-direction:row;flex-wrap:wrap;align-items:center}.bv-mode small{flex-basis:100%}.bv-pages{grid-template-columns:1fr 1fr}}
.bv-attente .bv-etat{color:var(--soft)}
.bv-attente{opacity:.92}
.bv-prio-err{color:var(--ink)}

/* aide par question, ressenti avant / après */
.bv-aide-b{margin-top:10px}
.bv-aide{margin:14px 0;padding:14px 16px;border-radius:14px;background:color-mix(in srgb,var(--ogre,#3E7F31) 9%,var(--card));border:1px solid var(--line)}
.bv-aide h4{margin:0 0 8px;display:flex;gap:8px;align-items:center}.bv-aide ul{margin:4px 0 10px;padding-left:20px;line-height:1.55}
.bv-aide-pieges b{color:var(--ko,#C2412F)}.bv-indice{margin:8px 0;padding:10px 12px;border-radius:10px;background:var(--card);line-height:1.5}
.bv-ress{padding:8px 0 4px}.bv-ress-l{display:flex;flex-direction:column;gap:10px;margin:16px 0 22px}
.bv-ress-l.grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.bv-ress-o{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-weight:700;text-align:left;cursor:pointer;min-height:48px}
.bv-ress-l.grille .bv-ress-o{flex-direction:column;justify-content:center;text-align:center}
.bv-ress-o.on{border-color:var(--ogre,#3E7F31);background:color-mix(in srgb,var(--ogre,#3E7F31) 16%,var(--card))}
.bv-visage,.bv-jauge{width:52px;height:52px;color:var(--ink);flex:none}
.bv-cmp{display:flex;gap:12px;align-items:center;margin:14px 0;padding:12px 14px;border-radius:14px;background:var(--card);border:1px solid var(--line)}
.bv-cmp .bv-visage,.bv-cmp .bv-jauge{width:40px;height:40px}.bv-cmp p{margin:0;line-height:1.5}

/* liseuse des documents du sujet (plein écran, zoom) — clair et sombre par les variables de l'appli */
.bv-zoom{display:block;width:100%;border:0;padding:0;margin:0;background:none;cursor:zoom-in;border-radius:12px}
.bv-zoom:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.bv-off-lien{align-self:flex-start;font-size:.8rem;color:var(--soft);text-decoration:underline;text-underline-offset:2px}
.bv-vis{position:fixed;inset:0;z-index:10000;display:flex;flex-direction:column;background:color-mix(in srgb,var(--paper) 97%,transparent);color:var(--ink);transition:opacity .15s}
.bv-vis-top,.bv-vis-bas{display:flex;align-items:center;gap:10px;padding:10px 12px;padding-top:max(10px,env(safe-area-inset-top))}
.bv-vis-bas{padding-bottom:max(10px,env(safe-area-inset-bottom))}
.bv-vis-t{flex:1;font-size:.95rem;line-height:1.3;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.bv-vis-n{font-size:.8rem;color:var(--soft);white-space:nowrap}
.bv-vis-src{flex:1;margin:0;font-size:.8rem;font-style:italic;color:var(--soft);text-align:center;line-height:1.35;max-height:4.2em;overflow:auto}
.bv-vis-b{flex:none;width:44px;height:44px;border-radius:999px;border:2px solid var(--line);background:var(--card);color:var(--ink);font-size:1.5rem;line-height:1;display:grid;place-items:center;cursor:pointer}
.bv-vis-b:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.bv-vis-b[hidden]{visibility:hidden;display:grid}
.bv-vis-scene{flex:1;min-height:0;overflow:hidden;display:grid;place-items:center;touch-action:none;cursor:zoom-in;user-select:none}
.bv-vis-scene.zoom{cursor:grab}
.bv-vis-img{max-width:100%;max-height:100%;object-fit:contain;background:#fff;border-radius:6px;transform-origin:center;will-change:transform;-webkit-user-drag:none}
@media (prefers-reduced-motion:reduce){.bv-vis{transition:none}}

/* Ogrelo · copie corrigée demandée à chaque nouvelle note (copies.js) : carte d'accueil, pastille Notes, feuille d'envoi, résultat.
   Couleurs : celles de l'appli (--ogre, --t-*), clair et sombre par les mêmes variables ; rouge réservé aux erreurs. */

/* pastille de l'onglet Notes */
.h-tab .cp-badge{position:absolute;top:-2px;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--t-crit);color:#fff;
  font-size:.7rem;font-weight:800;line-height:18px;text-align:center;box-shadow:0 0 0 2px var(--sheet)}

/* carte de l'accueil (sous le calendrier) */
#hCopies:empty{display:none}
#hCopies{margin:14px 0 4px;display:grid;gap:12px}
.cp-acc{display:block;width:100%;text-align:left;background:var(--sheet);border:2px solid color-mix(in srgb,var(--ogre) 55%,var(--line));border-radius:20px;padding:14px;color:var(--ink);font:inherit}
.cp-acc-h,.cp-acc.ok,.cp-acc.att{display:flex;gap:12px;align-items:center}
.cp-acc .f{flex:none;width:52px;height:52px}.cp-acc .f svg{width:52px;height:52px}
.cp-acc .tx{min-width:0;flex:1;display:flex;flex-direction:column;gap:3px}
.cp-acc .tx b{font-family:var(--display);font-size:1.05rem;line-height:1.25}
.cp-acc .tx small{color:var(--soft);line-height:1.35}
.cp-acc .cp-eye{display:flex;align-items:center;gap:6px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;font-size:.72rem;color:var(--ogre-d)}
.cp-acc .btn{margin:14px 0 0;display:flex;align-items:center;justify-content:center;gap:8px}
.cp-acc.ok{cursor:pointer;border-color:color-mix(in srgb,var(--t-good) 50%,var(--line));background:color-mix(in srgb,var(--t-good-bg) 55%,var(--sheet))}
.cp-acc.att{border-style:dashed}
.cp-acc .chev{flex:none;color:var(--soft)}
.cp-lien{display:block;margin:10px auto 0;border:0;background:none;color:var(--soft);font-weight:700;text-decoration:underline;text-underline-offset:3px;padding:8px;font:inherit;font-weight:700;cursor:pointer}

/* onglet Notes */
.cp-sec{margin:4px 0 0}.cp-h{display:flex;align-items:center;gap:8px;color:var(--ink)}
.cp-lead{margin:-2px 0 12px;color:var(--soft);line-height:1.45}
.cp-liste{margin-bottom:8px}
.cp-note{margin-top:12px}
.cp-ask,.cp-refaire{margin:0 0 10px;font-weight:700;line-height:1.4}
.cp-refaire{color:var(--t-warn);display:flex;gap:8px;align-items:flex-start}
.cp-note .btn,.n-card .cp-voir{margin:0;display:flex;align-items:center;justify-content:center;gap:8px}
.n-card .cp-voir{margin-top:12px;font-size:1rem}
.cp-etat{margin:12px 0 0;color:var(--t-info);font-weight:700;display:flex;gap:8px;align-items:center}

/* feuille (envoi et résultat) */
body.cp-ouvert{overflow:hidden}
.cp-voile{position:fixed;inset:0;z-index:90;background:rgba(10,14,12,.5);display:flex;align-items:flex-end;justify-content:center;opacity:0;transition:opacity .2s}
.cp-voile.on{opacity:1}
.cp-feuille{position:relative;width:100%;max-width:560px;max-height:92vh;overflow:auto;overscroll-behavior:contain;background:var(--sheet);color:var(--ink);
  border-radius:26px 26px 0 0;padding:22px 16px calc(26px + env(safe-area-inset-bottom,0px));box-shadow:0 -10px 30px rgba(0,0,0,.25);transform:translateY(24px);transition:transform .25s}
.cp-voile.on .cp-feuille{transform:none}
@media (min-width:640px){.cp-voile{align-items:center}.cp-feuille{border-radius:26px;padding:26px 24px}}
.cp-x{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:2px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer}
.cp-in{display:flex;flex-direction:column}
.cp-tete{display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;padding-right:48px}
.cp-tete .h-ico{width:48px;height:48px;font-size:1.4rem}
.cp-tete .tx{min-width:0;display:flex;flex-direction:column;gap:2px}.cp-tete .tx b{font-family:var(--display);font-size:1.1rem}.cp-tete .tx small{color:var(--soft)}
.cp-n{font-family:var(--display);font-weight:800;font-size:1.5rem;font-variant-numeric:tabular-nums}.cp-n small{font-size:.85rem;color:var(--soft)}
.cp-moy{margin:8px 0 0;color:var(--soft);font-size:.92rem}
.cp-h2{font-family:var(--display);font-size:1.3rem;margin:22px 0 12px;line-height:1.25}
.cp-conseils{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:10px}
.cp-conseils li{display:flex;gap:10px;align-items:center;line-height:1.35}
.cp-conseils .ic{flex:none;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--ogre) 16%,var(--sheet));color:var(--ogre-d);font-size:1.1rem}
.cp-pages{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:12px}
.cp-page{position:relative;margin:0;border:2px solid var(--line);border-radius:16px;overflow:hidden;background:var(--card)}
.cp-page img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}
.cp-page figcaption{padding:6px 8px;font-size:.85rem;font-weight:700;color:var(--soft)}
.cp-retire{position:absolute;top:6px;right:6px;width:36px;height:36px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;display:grid;place-items:center;cursor:pointer}
.cp-ajout{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:150px;border:2px dashed color-mix(in srgb,var(--ogre) 60%,var(--line));border-radius:16px;
  color:var(--ogre-d);font-weight:800;text-align:center;padding:12px;cursor:pointer;background:color-mix(in srgb,var(--ogre) 6%,var(--sheet))}
.cp-ajout i{font-size:1.6rem}
.cp-max{margin:10px 0 0;color:var(--soft);font-size:.88rem}
.cp-quota{margin:14px 0 0;padding:10px 12px;border-radius:14px;background:var(--t-mute-bg);color:var(--ink);display:flex;gap:8px;align-items:flex-start;line-height:1.4;font-size:.95rem}
.cp-quota i{color:var(--ogre-d);margin-top:2px}
.cp-msg{margin:14px 0 0;padding:10px 12px;border-radius:14px;background:var(--t-warn-bg);color:var(--ink);display:flex;gap:8px;line-height:1.4}
.cp-envoyer{margin:20px 0 0;display:flex;align-items:center;justify-content:center;gap:8px}
.cp-envoyer:disabled{opacity:.5;box-shadow:none}
.cp-vie{margin:16px 0 0;color:var(--soft);font-size:.88rem;display:flex;gap:8px;align-items:flex-start;line-height:1.4}
.cp-vie i{margin-top:2px}
.cp-sans{margin-top:14px}
.cp-merci,.cp-confirme{text-align:center;padding:10px 0}
.cp-merci .f{display:block;width:96px;height:96px;margin:0 auto}.cp-merci .f svg{width:96px;height:96px}
.cp-merci p,.cp-confirme p{color:var(--soft);line-height:1.5;margin:0 0 20px}
.cp-acts{display:grid;grid-template-columns:1fr 1fr;gap:10px}.cp-acts .btn{margin:0;font-size:1rem}
@media (max-width:360px){.cp-acts{grid-template-columns:1fr}}

/* résultat */
.cp-gain{display:flex;gap:12px;align-items:center;margin:20px 0 6px;padding:14px;border-radius:20px;background:color-mix(in srgb,var(--t-good-bg) 70%,var(--sheet));border:2px solid color-mix(in srgb,var(--t-good) 40%,var(--line))}
.cp-gain .f{flex:none;width:58px;height:58px}.cp-gain .f svg{width:58px;height:58px}
.cp-gain b{display:block;font-family:var(--display);font-size:1.2rem}.cp-gain small{display:block;color:var(--soft);line-height:1.4;margin-top:2px}
.cp-etoiles{display:inline-flex;align-items:center;gap:2px;margin-top:8px;font-weight:800;color:var(--t-warn)}
.cp-resume{margin:14px 0 4px;line-height:1.5}
.cp-forts{margin:12px 0 0}.cp-forts h4,.cp-chaps h4{margin:0 0 8px;font-family:var(--display);font-size:1rem;color:var(--soft)}
.cp-forts ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}.cp-forts li{display:flex;gap:8px;align-items:flex-start;line-height:1.4}.cp-forts li i{color:var(--t-good);margin-top:3px}
.cp-err{margin:18px 0 0;padding:14px;border-radius:20px;border:2px solid color-mix(in srgb,var(--t-crit) 30%,var(--line));background:var(--sheet)}
.cp-err-h{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.cp-type{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:var(--t-crit-bg);color:var(--t-crit);font-weight:800;font-size:.85rem}
.cp-q{color:var(--soft);font-weight:700;font-size:.9rem}
.cp-quoi{margin:0 0 10px;line-height:1.45;font-weight:700}
.cp-corr,.cp-conseil,.cp-methode{display:flex;gap:8px;align-items:flex-start;margin:0 0 10px;line-height:1.45}
.cp-corr i{color:var(--t-good);margin-top:3px}.cp-conseil i,.cp-methode i{color:var(--ogre-d);margin-top:3px}
.cp-exo{margin-top:14px;padding-top:14px;border-top:1.5px dashed var(--line)}
.cp-exo h5{margin:0 0 8px;font-size:.95rem;display:flex;gap:6px;align-items:center;color:var(--ogre-d)}
.cp-exo-q{margin:0 0 12px;line-height:1.45}
.cp-exo .exo-ch{margin:0 0 14px}
.cp-exo .btn{margin:0}
.cp-exo .btn:disabled{opacity:.5;box-shadow:none}
.cp-verdict{margin:0 0 6px;font-weight:800;display:flex;gap:6px;align-items:center}.cp-verdict.ok{color:var(--t-good)}.cp-verdict.ko{color:var(--t-crit)}
.cp-expl{margin:0;color:var(--soft);line-height:1.45}
.cp-chaps{margin:20px 0 0}.cp-chap{margin:0 0 10px}.cp-chap>span{display:flex;gap:8px;align-items:center;font-weight:700}
.cp-bv:empty{display:none}.cp-bv{margin-top:8px}
.cp-methode{margin-top:18px;padding:12px;border-radius:16px;background:var(--t-info-bg)}
.cp-complet{margin:20px 0 0;padding:14px;border-radius:18px;border:2px solid color-mix(in srgb,var(--ogre) 45%,var(--line))}
.cp-complet p{display:flex;gap:8px;align-items:flex-start;margin:0 0 12px;line-height:1.45}.cp-complet p i{color:var(--ogre-d);margin-top:3px}
.cp-complet .btn{margin:0;font-size:1rem}
.cp-fin{margin:22px 0 0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cp-acc .cp-eye,:root:not([data-theme="light"]) .cp-conseils .ic,:root:not([data-theme="light"]) .cp-ajout,:root:not([data-theme="light"]) .cp-exo h5{color:var(--ogre)}}
:root[data-theme="dark"] .cp-acc .cp-eye,:root[data-theme="dark"] .cp-conseils .ic,:root[data-theme="dark"] .cp-ajout,:root[data-theme="dark"] .cp-exo h5{color:var(--ogre)}
@media (prefers-reduced-motion:reduce){.cp-voile,.cp-feuille{transition:none}}

/* une note = un bloc qui suit l'état de sa copie (photographier → analyse → analysée → revue) */
.cp-st .cp-etat{margin:12px 0 10px;color:var(--ink)}
.cp-st .cp-etat i{color:var(--t-info)}
.cp-st .cp-etat.en-cours{color:var(--t-info);margin-bottom:0}
.cp-st .cp-etat.ok{color:var(--t-good)}.cp-st .cp-etat.ok i{color:var(--t-good)}
.cp-st .cp-etat.ko{color:var(--t-warn)}.cp-st .cp-etat.ko i{color:var(--t-warn)}
.cp-bs{display:grid;grid-template-columns:1fr 1fr;gap:10px}.cp-bs>.cp-b:only-child{grid-column:1/-1}
.cp-bs .cp-b{min-width:0;white-space:nowrap;margin:0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:.98rem;padding:11px 12px}
.cp-st .cp-lien{margin-top:4px}
/* pop-in « nouvelle note » */
.cp-pop{text-align:center;padding:4px 2px 2px}
.cp-pop .f{display:block;width:72px;height:72px;margin:0 auto 6px}.cp-pop .f svg{width:100%;height:100%}
.cp-pop .cp-h2{margin:4px 0 6px}
.cp-pop .cp-moy{margin:0 0 8px;color:var(--soft);font-weight:700}
.cp-pop-t{margin:6px 0 16px;color:var(--soft);line-height:1.45}
.cp-pop-l{list-style:none;margin:8px 0 6px;padding:0;display:flex;flex-direction:column;gap:8px;text-align:left}
.cp-pop-l li{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;background:color-mix(in srgb,var(--c,var(--ogre)) 9%,var(--sheet))}
.cp-pop-l .h-ico{width:34px;height:34px;border-radius:10px;font-size:1rem;display:grid;place-items:center;background:color-mix(in srgb,var(--c,var(--ogre)) 25%,var(--sheet))}
.cp-pop-l b{flex:1;min-width:0}
.cp-pop-l span:last-child{font-family:var(--display);font-weight:800}
.cp-pop .cp-acts .btn{display:flex;align-items:center;justify-content:center;gap:8px}
.cp-pop .cp-acts{grid-template-columns:1fr 1fr}.cp-pop .cp-acts .btn{font-size:.98rem;padding:12px 8px}

/* ---------- onglet Contrôles : « Mes notes et anciens contrôles » — un grand panneau à part, en bas de l'onglet ---------- */
.chx{--g1:var(--ogre,#5BA84A);--g2:var(--sky,#3C9DE0);margin:34px 0 26px;padding:18px 12px 16px;border-radius:28px;position:relative;overflow:hidden;
  background:radial-gradient(120% 70% at 100% 0%,color-mix(in srgb,var(--g2) 22%,transparent),transparent 60%),
    linear-gradient(160deg,color-mix(in srgb,var(--g1) 20%,var(--card)) 0%,color-mix(in srgb,var(--g1) 7%,var(--card)) 45%,color-mix(in srgb,var(--g2) 12%,var(--card)) 100%);
  border:1.5px solid color-mix(in srgb,var(--g1) 32%,var(--line));box-shadow:0 10px 28px -14px color-mix(in srgb,var(--g1) 55%,transparent)}
.chx::before{content:"";position:absolute;right:-40px;bottom:-60px;width:180px;height:180px;border-radius:50%;background:color-mix(in srgb,var(--g1) 10%,transparent);pointer-events:none}
.chx>*{position:relative}
.chx-tete{display:flex;align-items:center;gap:12px}
.chx-tete .f{flex:none;width:60px;height:60px;border-radius:50%;background:var(--card);border:3px solid color-mix(in srgb,var(--g1) 55%,var(--card));display:grid;place-items:center;overflow:hidden;box-shadow:0 4px 0 color-mix(in srgb,var(--g1) 30%,transparent)}
.chx-tete .f svg{width:52px;height:52px}
.chx-tete h2{margin:0;font-family:var(--display);font-size:1.3rem;line-height:1.2;color:var(--ink)}
.chx-tete p{margin:4px 0 0;color:var(--soft);line-height:1.4;font-size:.95rem}
.chx-kpi{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px}
.chx-kpi .k{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 11px;font-size:.82rem;font-weight:800;background:color-mix(in srgb,var(--card) 80%,transparent);color:var(--soft);border:1px solid var(--line)}
.chx-kpi .k.crit{color:var(--ko-t);border-color:color-mix(in srgb,var(--ko-t) 30%,var(--line))}.chx-kpi .k.good{color:var(--ok-t);border-color:color-mix(in srgb,var(--ok-t) 30%,var(--line))}
.chx-liste{display:grid;gap:10px;margin-top:12px}
.chx-l{background:var(--card);border:1.5px solid color-mix(in srgb,var(--c) 28%,var(--line));border-left:5px solid var(--c);border-radius:18px;padding:10px 10px 10px 11px;display:grid;gap:8px}
.chx-l.ouvert{box-shadow:0 8px 22px -12px color-mix(in srgb,var(--c) 60%,transparent)}
.chx-h{display:flex;align-items:center;gap:10px;border:0;background:none;padding:0;text-align:left;color:var(--ink);font:inherit;cursor:pointer;width:100%;min-height:44px}
.chx-h .h-ico{flex:none;width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 18%,var(--card))}
.chx-h .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.chx-h small{color:var(--soft);font-weight:700;font-size:.8rem}.chx-h b{line-height:1.25;overflow-wrap:break-word;hyphens:auto}
.chx-n{font-family:var(--display);font-size:1.35rem;font-weight:800;white-space:nowrap}.chx-n small{font-size:.78rem;color:var(--soft)}
.chx-chev{color:var(--soft);flex:none}
.chx-et{display:flex;flex-wrap:wrap;gap:6px;padding-left:44px}
.ct-et.mute{background:color-mix(in srgb,var(--soft) 12%,var(--card));color:var(--soft)}
.chx-cta{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;padding:7px 13px;min-height:36px;font:inherit;font-size:.86rem;font-weight:800;cursor:pointer;
  background:color-mix(in srgb,var(--ogre) 16%,var(--card));color:var(--ogre-d);border:1.5px solid color-mix(in srgb,var(--ogre) 45%,var(--line))}
.chx-cta:hover{background:color-mix(in srgb,var(--ogre) 26%,var(--card))}
.chx-cta.busy,.chx-go.busy{opacity:.6;pointer-events:none}
.chx-p{display:grid;gap:12px;padding-top:6px;border-top:1px dashed var(--line);margin-top:2px}
.chx-dit{display:flex;gap:10px;align-items:center}.chx-dit .f{flex:none;width:44px;height:44px}.chx-dit .f svg{width:44px;height:44px}
.chx-dit p{margin:0;background:color-mix(in srgb,var(--ogre) 10%,var(--card));border-radius:16px 16px 16px 4px;padding:10px 12px;line-height:1.4}
.chx-go{min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:0}
.chx-aide{margin:0;color:var(--soft);font-size:.86rem;display:flex;gap:6px;align-items:flex-start;line-height:1.35}
.chx-bilan{display:grid;gap:10px}
@media (min-width:640px){.chx-bilan{grid-template-columns:1fr 1fr}}
.chx-col{border-radius:14px;padding:10px 12px}.chx-col h4{margin:0 0 6px;font-size:.9rem;display:flex;align-items:center;gap:6px}
.chx-col ul{margin:0;padding-left:18px;display:grid;gap:4px;line-height:1.35;font-size:.92rem}
.chx-col.ok{background:color-mix(in srgb,var(--ok-t) 10%,var(--card))}.chx-col.ok h4{color:var(--ok-t)}
.chx-col.ko{background:color-mix(in srgb,var(--warn-t) 11%,var(--card))}.chx-col.ko h4{color:var(--warn-t)}
.chx-acts{display:grid;gap:8px;grid-template-columns:1fr}
@media (min-width:640px){.chx-acts{grid-template-columns:repeat(3,1fr)}}
.chx-a{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);background:var(--sheet,var(--paper));border-radius:14px;padding:10px 12px;min-height:52px;font:inherit;color:var(--ink);text-align:left;cursor:pointer}
.chx-a:hover{border-color:color-mix(in srgb,var(--ogre) 50%,var(--line))}
.chx-a .i{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--k);color:#fff}
.chx-a b{font-size:.95rem;line-height:1.25}
.chx .cp-lien{justify-self:start}
.chx-tout{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:12px;min-height:46px;border-radius:14px;border:1.5px solid color-mix(in srgb,var(--g1) 40%,var(--line));
  background:color-mix(in srgb,var(--card) 85%,transparent);color:var(--ink);font:inherit;font-weight:800;cursor:pointer}
.chx-vide{margin:14px 0 0;color:var(--soft)}
@media (min-width:900px){.chx{padding:26px 26px 22px}}
/* la suite des explications : fiche, flashcards, quiz */
.cp-suite{margin:18px 0 6px}.cp-suite h4{margin:0 0 10px;font-family:var(--display);font-size:1rem;color:var(--soft)}
.cp-suite-g{display:flex;gap:10px}
.cp-sa{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px;border:2px solid var(--line);border-radius:18px;background:var(--sheet);color:var(--ink);font:inherit;cursor:pointer;box-shadow:0 3px 0 var(--line)}
.cp-sa:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}
.cp-sa .i{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--k);color:#fff;font-size:1.25rem}
.cp-sa b{font-family:var(--display);font-size:.92rem;text-align:center}
.cp-f-t{margin:22px 0 2px;font-family:var(--display);font-size:1.35rem}.cp-f-s{margin:0;color:var(--soft)}
.cp-f-h{margin:20px 0 10px;font-family:var(--display);font-size:1rem;color:var(--soft)}
.cp-f-i{margin:0 0 12px;padding:14px;border:2px solid var(--line);border-radius:18px;background:var(--sheet)}.cp-f-i b{display:block;line-height:1.4}.cp-f-i p{margin:8px 0 0;line-height:1.45}
/* écran d'envoi : le bouton photo au centre */
.cp-pages{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.cp-ajout{margin-left:auto;margin-right:auto}
.cp-nom{margin:2px 0 14px;font-size:.8rem;color:var(--soft);text-align:center}.cp-max{text-align:center}

/* « Ce qu'Ogrelo sait de moi » + « Comment tu te sens ? » (memoire.js). Fonctionne dans l'appli élève (--paper, --card, --soft, --ogre…)
   et dans l'espace parent (--bg, --surface, --muted, --accent…) : chaque couleur a son repli. Clair / sombre par les variables des pages. */
.mem-fond{--m-bg:var(--paper,var(--bg,#FFF8E8));--m-card:var(--card,var(--surface,#fff));--m-ink:var(--ink,#2B2A3A);--m-soft:var(--soft,var(--muted,#6B6880));--m-line:var(--line,#EADFC6);--m-vert:var(--ogre-d,var(--accent,#3E7F31));--m-ko:var(--ko-t,var(--crit,#B8322A))}
.mem-parent,.mem-tuile{--m-bg:var(--paper,var(--bg,#FFF8E8));--m-card:var(--card,var(--surface,#fff));--m-ink:var(--ink,#2B2A3A);--m-soft:var(--soft,var(--muted,#6B6880));--m-line:var(--line,#EADFC6);--m-vert:var(--ogre-d,var(--accent,#3E7F31));--m-ko:var(--ko-t,var(--crit,#B8322A))}
body.mem-ouvert{overflow:hidden}
.mem-fond{position:fixed;inset:0;z-index:1200;color:var(--m-ink);font-family:var(--body,system-ui,sans-serif)}
.mem-fond *,.mem-parent *{box-sizing:border-box}
.mem-tete{display:inline-grid;place-items:center;width:56px;height:56px;flex:none}
.mem-tete .ogre{width:100%;height:100%}

/* tuile de l'onglet Moi */
.mem-tuile{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:2px solid var(--m-line);background:var(--m-card);color:var(--m-ink);border-radius:20px;padding:16px;margin:0 0 16px;font:inherit;cursor:pointer}
.mem-tuile .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mem-tuile b{font-family:var(--display);font-size:1.1rem;line-height:1.2}
.mem-tuile small{color:var(--m-soft);font-size:.9rem;line-height:1.35}
.mem-tuile .go{color:var(--m-soft)}
.mem-ic{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:12px;background:color-mix(in srgb,var(--m-vert) 14%,transparent);color:var(--m-vert);flex:none;font-size:1.05rem}
.mem-ic.g{width:46px;height:46px;border-radius:14px;font-size:1.35rem}

/* écran plein */
.mem-page{background:var(--m-bg);overflow-y:auto;-webkit-overflow-scrolling:touch}
.mem-in{max-width:620px;margin:0 auto;padding:12px 16px calc(40px + env(safe-area-inset-bottom,0px))}
.mem-h{display:flex;gap:12px;align-items:flex-start;position:sticky;top:0;z-index:2;background:var(--m-bg);padding:10px 0 14px}
.mem-h h2{font-family:var(--display);font-size:1.35rem;line-height:1.15;margin:4px 0 4px}
.mem-h p{margin:0;color:var(--m-soft);font-size:.95rem;line-height:1.4}
.mem-x{flex:none;width:44px;height:44px;border-radius:14px;border:2px solid var(--m-line);background:var(--m-card);color:var(--m-ink);display:grid;place-items:center;font-size:1.1rem;cursor:pointer}
.mem-charge{display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px 0;color:var(--m-soft)}
.mem-maj{display:flex;align-items:center;gap:8px;color:var(--m-soft);font-size:.88rem;margin:0 0 14px}

.mem-carte{background:var(--m-card);border:2px solid var(--m-line);border-radius:20px;padding:16px;margin:0 0 16px}
.mem-carte h3{display:flex;align-items:center;gap:10px;font-family:var(--display);font-size:1.08rem;line-height:1.2;margin:0 0 12px}
.mem-l{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.mem-l li{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--m-ink) 4%,transparent);line-height:1.45;transition:opacity .25s,transform .25s}
.mem-l li.parti{opacity:0;transform:translateX(16px)}
.mem-faux{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--m-line);background:var(--m-card);color:var(--m-soft);border-radius:999px;padding:6px 12px;font:inherit;font-size:.85rem;cursor:pointer;min-height:36px}
.mem-faux:hover,.mem-faux:focus-visible{color:var(--m-ko);border-color:var(--m-ko)}
.mem-sous{font-weight:700;margin:12px 0 8px;font-size:.95rem}
.mem-sous:first-of-type{margin-top:0}
.mem-sous2{color:var(--m-soft);margin:0 0 12px;font-size:.92rem;line-height:1.45}
.mem-vide{color:var(--m-soft);margin:0;line-height:1.45;font-size:.92rem}
.mem-note{color:var(--m-soft);font-size:.82rem;line-height:1.4;margin:10px 0 0}
.mem-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.mem-chips li{display:flex;flex-direction:column;padding:8px 12px;border-radius:12px;border:1.5px solid color-mix(in srgb,var(--m-vert) 40%,transparent);background:color-mix(in srgb,var(--m-vert) 8%,transparent);max-width:100%}
.mem-chips li.ko{border-color:color-mix(in srgb,var(--m-ko) 45%,transparent);background:color-mix(in srgb,var(--m-ko) 7%,transparent)}
.mem-chips b{font-size:.92rem;line-height:1.3}
.mem-chips small{color:var(--m-soft);font-size:.8rem}
.mem-up{display:flex;gap:14px;align-items:flex-start;border-color:color-mix(in srgb,var(--m-vert) 45%,var(--m-line))}
.mem-up p{margin:0 0 12px;line-height:1.45}
.mem-kick{display:flex;align-items:center;gap:6px;font-weight:800;color:var(--m-vert);font-size:.9rem;margin:4px 0 6px!important}
.mem-att{display:flex;gap:12px;align-items:center}
.mem-att p{margin:0;line-height:1.45}
.mem-hum{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:8px}
.mem-hum li{display:flex;align-items:center;gap:10px}
.mem-hum .mem-tete{width:36px;height:36px}
.mem-hum span{display:flex;flex-direction:column;line-height:1.3}
.mem-hum small{color:var(--m-soft);font-size:.82rem}
.mem-ligne{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0 4px;border-top:1px solid var(--m-line)}
.mem-sw{flex:none;width:52px;height:32px;border-radius:999px;border:0;background:color-mix(in srgb,var(--m-ink) 22%,transparent);position:relative;cursor:pointer;padding:0}
.mem-sw i{position:absolute;top:4px;left:4px;width:24px;height:24px;border-radius:50%;background:#fff;transition:left .2s}
.mem-sw[aria-checked="true"]{background:var(--m-vert)}
.mem-sw[aria-checked="true"] i{left:24px}
.mem-lien{display:inline-block;margin-top:10px;background:none;border:0;padding:6px 0;color:var(--m-vert);font:inherit;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.mem-pts{margin:0 0 6px;padding-left:20px;line-height:1.5;font-size:.92rem}
.mem-pts li{margin:0 0 4px}
.mem-raz{text-align:center;margin:26px 0 8px}
.mem-b{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 20px;border-radius:14px;border:0;background:var(--m-vert);color:#fff;font:inherit;font-weight:800;cursor:pointer}
.mem-b.sec{background:var(--m-card);color:var(--m-ink);border:2px solid var(--m-line)}
.mem-b.ko{background:transparent;color:var(--m-ko);border:2px solid color-mix(in srgb,var(--m-ko) 55%,transparent)}
.mem-conf .mem-b.ko{background:var(--m-ko);color:#fff;border:0}

/* boîtes : confirmation, aide */
.mem-conf{background:color-mix(in srgb,#000 50%,transparent);display:flex;align-items:center;justify-content:center;padding:16px}
.mem-boite{background:var(--m-card);border-radius:22px;padding:22px 18px;max-width:420px;width:100%;text-align:center;max-height:92vh;overflow:auto}
.mem-boite h2{font-family:var(--display);font-size:1.2rem;line-height:1.2;margin:10px 0 8px}
.mem-boite p{line-height:1.5;margin:0 0 16px}
.mem-2b{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.mem-2b .mem-b{flex:1 1 130px}
.mem-num{list-style:none;padding:0;margin:0 0 14px;display:flex;flex-direction:column;gap:10px;text-align:left}
.mem-num a{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:12px 14px;border-radius:14px;border:2px solid var(--m-line);color:var(--m-ink);text-decoration:none}
.mem-num span{font-weight:800;color:var(--m-vert);white-space:nowrap}
.mem-num small{grid-column:1/-1;color:var(--m-soft);font-size:.85rem}

/* feuille « Comment tu te sens ? » */
.mem-feuille{background:color-mix(in srgb,#000 40%,transparent);display:flex;align-items:flex-end;justify-content:center}
.mem-sheet{background:var(--m-card);width:100%;max-width:520px;border-radius:26px 26px 0 0;padding:22px 16px calc(18px + env(safe-area-inset-bottom,0px));text-align:center}
@media (min-width:600px){.mem-feuille{align-items:center}.mem-sheet{border-radius:26px}}
.mem-sheet h2{font-family:var(--display);font-size:1.3rem;margin:0 0 16px}
.mem-faces{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.mem-face{display:flex;flex-direction:column;align-items:center;gap:6px;border:2px solid transparent;background:none;border-radius:16px;padding:8px 2px;cursor:pointer;color:var(--m-ink);font:inherit;min-width:0}
.mem-face .mem-tete{width:48px;height:48px}
.mem-face small{font-size:.75rem;line-height:1.2;color:var(--m-soft)}
.mem-face:hover,.mem-face:focus-visible{border-color:var(--m-vert)}
.mem-en{display:flex;flex-direction:column;gap:10px}
.mem-enb{display:flex;align-items:center;gap:14px;border:2px solid var(--m-line);background:var(--m-card);color:var(--m-ink);border-radius:16px;padding:14px 16px;font:inherit;font-weight:700;cursor:pointer;min-height:52px}
.mem-enb:hover,.mem-enb:focus-visible{border-color:var(--m-vert)}
.mem-bat{display:inline-flex;gap:3px;align-items:flex-end}
.mem-bat i{width:7px;border-radius:3px;background:color-mix(in srgb,var(--m-ink) 18%,transparent)}
.mem-bat i:nth-child(1){height:10px}.mem-bat i:nth-child(2){height:15px}.mem-bat i:nth-child(3){height:20px}
.mem-bat i.on{background:var(--m-vert)}
.mem-passer{margin:18px auto 0;display:block;min-height:44px;padding:8px 22px;border-radius:999px;border:2px solid var(--m-line);background:transparent;color:var(--m-soft);font:inherit;font-weight:700;cursor:pointer}
.mem-sheet .mem-note{margin-top:12px}

.mem-toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:1300;width:max-content;max-width:min(92vw,440px);background:var(--ink,#2B2A3A);color:var(--paper,var(--bg,#fff));padding:12px 16px;border-radius:14px;line-height:1.4;font-size:.95rem;box-shadow:0 6px 20px rgba(0,0,0,.25);transition:opacity .4s}
.mem-toast.out{opacity:0}

/* espace parent */
.mem-parent .mem-carte{border-width:1px;border-radius:var(--r,18px)}
.mem-parent .mem-ic{background:var(--accent-soft,color-mix(in srgb,var(--m-vert) 14%,transparent))}
@media (prefers-reduced-motion:reduce){.mem-l li,.mem-sw i,.mem-toast{transition:none}}

/* Ogrelo · « Mieux me connaître » (depart.js) : plein écran, une question par écran, tuiles et pastilles « Duolingo »
   (contour franc, ombre pleine dessous, on appuie : ça descend). Couleurs de l'appli (--paper, --card, --ink, --line, --ogre…), clair et sombre. */
body.mmc-on{overflow:hidden}
.mmc{position:fixed;inset:0;z-index:1300;background:var(--paper,#FFF8E8);color:var(--ink,#2B2A3A);display:flex;justify-content:center;animation:dpIn .25s ease both}
.mmc.sort{animation:dpOut .22s ease both}
@keyframes dpIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes dpOut{to{opacity:0;transform:translateY(12px)}}
.mmc *{box-sizing:border-box}
.mmc-in{width:100%;max-width:560px;height:100%;display:flex;flex-direction:column;padding:calc(10px + env(safe-area-inset-top,0px)) 16px calc(12px + env(safe-area-inset-bottom,0px))}

/* en haut : croix (plus tard), barre de progression, « Passer » */
.mmc-haut{display:flex;align-items:center;gap:12px;min-height:52px;flex:none}
.mmc-x{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;border:2px solid var(--line);background:var(--card);color:var(--soft,var(--ink));box-shadow:0 3px 0 var(--duo-ombre,var(--line));cursor:pointer;font-size:1.05rem}
.mmc-x:active{transform:translateY(3px);box-shadow:none}
.mmc-prog{flex:1;height:16px;border-radius:999px;background:color-mix(in srgb,var(--ink) 9%,var(--line));overflow:hidden}
.mmc-prog i{display:block;height:100%;width:0;min-width:16px;border-radius:999px;background:var(--ogre,#58A13E);box-shadow:inset 0 -3px 0 rgba(0,0,0,.12),inset 0 3px 0 rgba(255,255,255,.3);transition:width .35s cubic-bezier(.2,1.2,.4,1)}
.mmc-passer{flex:none;min-height:44px;padding:0 6px;border:0;background:none;color:var(--soft,var(--ink));font:inherit;font-family:var(--display);font-weight:800;font-size:1rem;cursor:pointer;letter-spacing:.02em}
.mmc-passer:hover,.mmc-passer:focus-visible{color:var(--ink)}

/* le corps : défile si besoin, entre la barre du haut et le bouton du bas */
.mmc-corps{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px 2px 18px;animation:dpPas .3s ease both}
.mmc-corps.arr{animation-name:dpPasR}
@keyframes dpPas{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
@keyframes dpPasR{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}
.mmc-charge{display:grid;place-items:center;height:100%}.mmc-charge .ogre{width:90px;height:90px}
.mmc-dit{margin:4px 0 22px}
.mmc-dit .og-bulle p{font-size:1.18rem}
.mmc-l{font-family:var(--display);font-weight:800;font-size:1rem;margin:18px 0 10px;color:var(--ink)}
.mmc-l:first-of-type{margin-top:4px}

/* en bas : retour + Valider */
.mmc-bas{flex:none;display:flex;gap:12px;align-items:center;padding-top:10px}
.mmc-bas[hidden]{display:none}
.mmc-ret{flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;border:2px solid var(--line);background:var(--card);color:var(--ink);box-shadow:0 4px 0 var(--duo-ombre,var(--line));cursor:pointer}
.mmc-ret:active{transform:translateY(3px);box-shadow:none}
.mmc-valider{flex:1;margin:0!important;font-size:1.1rem}
.mmc-demo{text-align:center;color:var(--soft,var(--ink));font-size:.85rem;margin:8px 0 0}

/* coche ronde des tuiles choisies (une seule règle pour toutes) */
.mmc-coche{position:absolute;top:8px;right:8px;width:26px;height:26px;border-radius:50%;display:none;place-items:center;background:#fff;color:#2F8F2F;box-shadow:0 2px 0 rgba(0,0,0,.25)}
.mmc-coche svg{width:16px;height:16px;stroke-width:3}
[aria-checked="true"]>.mmc-coche,[aria-pressed="true"]>.mmc-coche{display:grid}

/* prénom */
.mmc-in-txt{width:100%;min-height:58px;font:inherit;font-family:var(--display);font-weight:800;font-size:1.3rem;padding:10px 16px;border-radius:16px!important}
.mmc-err{min-height:1.3em;margin:8px 2px 0;color:var(--ko,#C0392B);font-weight:700;font-size:.92rem}
.mmc-note{color:var(--soft,var(--ink));font-size:.86rem;line-height:1.4;margin:10px 2px 0}

/* classe : grosses tuiles 3D, du CM2 à la terminale */
.mmc-cls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mmc-cl{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-height:76px;padding:10px 14px;border:0;border-radius:20px;
  background:var(--c);color:#fff;font:inherit;text-align:left;cursor:pointer;box-shadow:0 5px 0 color-mix(in srgb,var(--c) 60%,#000);transition:transform .08s,box-shadow .08s}
.mmc-cl b{font-family:var(--display);font-weight:800;font-size:1.45rem;line-height:1.05}
.mmc-cl small{font-weight:700;font-size:.82rem;opacity:.95}
.mmc-cl:active{transform:translateY(4px);box-shadow:0 1px 0 color-mix(in srgb,var(--c) 60%,#000)}
.mmc-cl[aria-checked="true"]{outline:4px solid color-mix(in srgb,var(--c) 45%,#fff);outline-offset:2px}

/* avatar : 6 têtes prêtes, « Personnaliser » en option */
.mmc-avs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.mmc-avb{position:relative;aspect-ratio:1;border-radius:22px;border:2px solid var(--line);background:var(--card);display:grid;place-items:center;padding:10px;cursor:pointer;
  box-shadow:0 5px 0 var(--duo-ombre,var(--line));transition:transform .08s,box-shadow .08s}
.mmc-avb svg{width:100%;height:100%}
.mmc-avb:active{transform:translateY(4px);box-shadow:0 1px 0 var(--duo-ombre,var(--line))}
.mmc-avb[aria-checked="true"]{border-color:var(--ogre,#58A13E);background:color-mix(in srgb,var(--ogre,#58A13E) 16%,var(--card));box-shadow:0 5px 0 color-mix(in srgb,var(--ogre,#58A13E) 60%,#000)}
.mmc-avb .mmc-coche{background:var(--ogre,#58A13E);color:#fff}
.mmc-perso{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;margin:16px 0 0;border:0;background:none;color:color-mix(in srgb,var(--sky,#2D7FE0) 75%,var(--ink));font:inherit;font-family:var(--display);font-weight:800;font-size:1rem;cursor:pointer}
.mmc-perso svg{width:20px;height:20px}
.mmc-av .av-ed{padding:0}
.mmc-av .av-big{width:110px;height:110px;margin:0 auto 6px}
.mmc-av .av-ok{width:100%;margin-top:14px}

/* matières : grosses tuiles pleines à la couleur de la matière, J'aime / J'aime pas */
.mmc-mats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}
.mmc-mat{--tc:var(--c,#5B6577);display:flex;flex-direction:column;gap:10px;padding:12px 10px 10px;border-radius:22px;background:var(--tc);color:#fff;
  box-shadow:0 5px 0 color-mix(in srgb,var(--tc) 58%,#000);transition:box-shadow .15s}
.mmc-mat.aime{box-shadow:0 5px 0 color-mix(in srgb,var(--tc) 58%,#000),0 0 0 4px #43B53A}
.mmc-mat.pasaime{box-shadow:0 5px 0 color-mix(in srgb,var(--tc) 58%,#000),0 0 0 4px #F08A24}
.mmc-mh{display:flex;align-items:center;gap:8px;min-height:40px}
.mmc-mi{flex:none;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.22);color:#fff;font-size:1.1rem;box-shadow:inset 0 -3px 0 rgba(0,0,0,.15)}
.mmc-mh b{font-family:var(--display);font-weight:800;font-size:1rem;line-height:1.15;overflow-wrap:anywhere;text-shadow:0 1px 0 rgba(0,0,0,.2)}
.mmc-mb{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mmc-t{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:58px;padding:6px 2px;border-radius:15px;border:2px solid rgba(255,255,255,.55);
  background:rgba(255,255,255,.16);color:#fff;font:inherit;font-weight:800;font-size:.78rem;line-height:1.1;cursor:pointer;box-shadow:0 3px 0 rgba(0,0,0,.22);transition:transform .08s,box-shadow .08s,background-color .15s,color .15s}
.mmc-t svg{width:24px;height:24px}
.mmc-t:active{transform:translateY(3px);box-shadow:none}
.mmc-t[aria-pressed="true"]{background:#fff;border-color:#fff}
.mmc-t.oui[aria-pressed="true"]{color:#23801D}.mmc-t.oui[aria-pressed="true"] svg{fill:#C9F2C2}
.mmc-t.non[aria-pressed="true"]{color:#C4510B}.mmc-t.non[aria-pressed="true"] svg{fill:#FFE0C4}
.mmc-t[aria-pressed="true"]::after{content:"";position:absolute;top:-7px;right:-7px;width:20px;height:20px;border-radius:50%;border:2px solid #fff;
  background:currentColor url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/13px no-repeat}

/* confiance : 3 grosses tuiles colorées avec un visage */
.mmc-conf{margin:0 0 18px}
.mmc-conf>b{display:block;font-family:var(--display);font-weight:800;font-size:1.08rem;margin:0 0 10px}
.mmc-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mmc-face-t{--s:#3E9A35;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:112px;padding:10px 4px;border-radius:20px;
  border:2px solid color-mix(in srgb,var(--s) 45%,var(--line));background:color-mix(in srgb,var(--s) 12%,var(--card));color:var(--ink);font:inherit;font-weight:800;font-size:.9rem;line-height:1.15;text-align:center;cursor:pointer;
  box-shadow:0 5px 0 color-mix(in srgb,var(--s) 45%,var(--line));transition:transform .08s,box-shadow .08s,background-color .15s}
.mmc-face-t.c2{--s:#E3A008}.mmc-face-t.c3{--s:#E0663A}
.mmc-face{width:54px;height:54px;display:grid;place-items:center}.mmc-face svg{width:100%;height:100%}
.mmc-face-t:active{transform:translateY(4px);box-shadow:0 1px 0 color-mix(in srgb,var(--s) 45%,var(--line))}
.mmc-face-t[aria-checked="true"]{background:var(--s);border-color:var(--s);color:#fff;box-shadow:0 5px 0 color-mix(in srgb,var(--s) 58%,#000)}
.mmc-face-t[aria-checked="true"] .mmc-coche{color:var(--s)}

/* durée */
.mmc-tuile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:76px;padding:10px 6px;border-radius:18px;border:2px solid var(--line);background:var(--card);color:var(--ink);
  font:inherit;font-weight:700;cursor:pointer;box-shadow:0 4px 0 var(--duo-ombre,var(--line));transition:transform .08s,box-shadow .08s,background-color .15s,border-color .15s}
.mmc-tuile:active{transform:translateY(3px);box-shadow:0 1px 0 var(--duo-ombre,var(--line))}
.mmc-tuile[aria-checked="true"]{border-color:var(--ogre,#58A13E);background:var(--ogre,#58A13E);color:#fff;box-shadow:0 4px 0 color-mix(in srgb,var(--ogre,#58A13E) 60%,#000)}
.mmc-tuile[aria-checked="true"] span{color:#fff}
.mmc-min b{font-family:var(--display);font-size:1.6rem;line-height:1}.mmc-min span{font-size:.85rem;color:var(--soft,var(--ink))}

/* pastilles (plusieurs choix) */
.mmc-chips{display:flex;flex-wrap:wrap;gap:10px}
.mmc-chip{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:9px 14px;border-radius:999px;border:2px solid var(--line);background:var(--card);color:var(--ink);
  font:inherit;font-weight:700;font-size:.97rem;line-height:1.25;text-align:left;cursor:pointer;box-shadow:0 3px 0 var(--duo-ombre,var(--line));transition:transform .08s,box-shadow .08s,background-color .15s,border-color .15s}
.mmc-chip>i{color:var(--soft,var(--ink));font-size:1.05rem;flex:none}
.mmc-chip:active{transform:translateY(3px);box-shadow:none}
.mmc-chip .mmc-ok{display:none;width:20px;height:20px;border-radius:50%;background:var(--ogre,#58A13E);color:#fff;place-items:center;flex:none}
.mmc-chip .mmc-ok svg{width:13px;height:13px}
.mmc-chip[aria-pressed="true"]{border-color:var(--ogre,#58A13E);background:color-mix(in srgb,var(--ogre,#58A13E) 14%,var(--card));box-shadow:0 3px 0 color-mix(in srgb,var(--ogre,#58A13E) 55%,#000)}
.mmc-chip[aria-pressed="true"]>i{color:var(--ogre-d,var(--ogre))}
.mmc-chip[aria-pressed="true"] .mmc-ok{display:grid}

/* langues : tuiles au drapeau (comme l'accueil de Langues) */
.mmc-lgs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mmc-lg{--lg:#5B6577;position:relative;overflow:hidden;display:flex;align-items:flex-end;min-height:88px;padding:10px 12px;border:0;border-radius:20px;background:var(--lg);color:#fff;font:inherit;text-align:left;cursor:pointer;
  box-shadow:0 5px 0 color-mix(in srgb,var(--lg) 55%,#000);transition:transform .08s,box-shadow .08s}
.mmc-lg-fond{position:absolute;inset:0}.mmc-lg-fond svg{display:block;width:100%;height:100%}
.mmc-lg::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.62) 100%);z-index:1}
.mmc-lg-tx{position:relative;z-index:2;display:flex;flex-direction:column;gap:1px}
.mmc-lg b{font-family:var(--display);font-weight:800;font-size:1.08rem;line-height:1.1;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.mmc-lg small{font-size:.82rem;font-weight:700;opacity:.95;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.mmc-lg .mmc-coche{z-index:3;color:#2F8F2F}
.mmc-lg:active{transform:translateY(4px);box-shadow:0 1px 0 color-mix(in srgb,var(--lg) 55%,#000)}
.mmc-lg[aria-checked="true"],.mmc-lg[aria-pressed="true"]{outline:4px solid #43B53A;outline-offset:2px}
.mmc-lg.aucune{--lg:#8A8799;align-items:center;justify-content:center}.mmc-lg.aucune::before{display:none}
.mmc-lg.bientot{cursor:default;filter:grayscale(1);opacity:.55;box-shadow:0 3px 0 rgba(0,0,0,.2)}
.mmc-lg.bientot:active{transform:none}
.mmc-bientot{position:absolute;top:8px;right:8px;z-index:3;padding:3px 8px;border-radius:999px;background:#fff;color:#3D3B4F;font-weight:800;font-size:.72rem}

/* autorisations : tuiles 3D, l'état réel, jamais forcé */
.mmc-perms{display:flex;flex-direction:column;gap:14px}
.mmc-perm{display:flex;align-items:center;gap:12px;width:100%;min-height:84px;padding:12px 14px;border-radius:20px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:inherit;text-align:left;cursor:pointer;
  box-shadow:0 5px 0 var(--duo-ombre,var(--line));transition:transform .08s,box-shadow .08s,background-color .15s,border-color .15s}
.mmc-perm:active{transform:translateY(4px);box-shadow:0 1px 0 var(--duo-ombre,var(--line))}
.mmc-perm-i{flex:none;width:50px;height:50px;border-radius:16px;display:grid;place-items:center;background:#2D7FE0;color:#fff;box-shadow:inset 0 -4px 0 rgba(0,0,0,.18)}
.mmc-perm[data-perm="micro"] .mmc-perm-i{background:#E0457B}.mmc-perm[data-perm="photo"] .mmc-perm-i{background:#8455D8}
.mmc-perm-i svg{width:26px;height:26px}
.mmc-perm-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mmc-perm-tx b{font-family:var(--display);font-weight:800;font-size:1.02rem;line-height:1.2}
.mmc-perm-tx small{color:var(--soft,var(--ink));font-size:.86rem;line-height:1.3}
.mmc-perm-e{flex:none;display:inline-flex;align-items:center;gap:4px;padding:6px 10px;border-radius:999px;background:color-mix(in srgb,var(--sky,#2D7FE0) 14%,var(--card));color:color-mix(in srgb,var(--sky,#2D7FE0) 75%,var(--ink));font-weight:800;font-size:.8rem;white-space:nowrap}
.mmc-perm-e svg{width:15px;height:15px;stroke-width:3}
.mmc-perm[data-etat="ok"]{border-color:var(--ogre,#58A13E);background:color-mix(in srgb,var(--ogre,#58A13E) 10%,var(--card));cursor:default}
.mmc-perm[data-etat="ok"] .mmc-perm-e{background:var(--ogre,#58A13E);color:#fff}
.mmc-perm[data-etat="refus"] .mmc-perm-e,.mmc-perm[data-etat="na"] .mmc-perm-e,.mmc-perm[data-etat="demo"] .mmc-perm-e{background:color-mix(in srgb,var(--ink) 8%,var(--card));color:var(--soft,var(--ink))}
.mmc-perm.attend .mmc-perm-e{opacity:.6}

/* la fin */
.mmc-fin{display:flex;flex-direction:column;justify-content:center;min-height:100%}
.mmc-fin .og-dit>.f{width:96px;height:96px}

/* petit « pop » quand on choisit */
.mmc-pop{animation:dpPop .28s cubic-bezier(.2,1.6,.4,1)}
@keyframes dpPop{0%{transform:scale(1)}40%{transform:scale(1.1)}70%{transform:scale(.97)}100%{transform:scale(1)}}

/* onglet Moi : la tuile « Mieux me connaître » */
.mmc-ic{color:#E0457B!important;background:color-mix(in srgb,#E0457B 14%,transparent)!important}
.mmc-ic svg{width:24px;height:24px}

/* « Ce qu'Ogrelo sait de moi » : « Ce que tu m'as dit » */
.mem-dit .mmc-g{margin:0 0 12px}
.mem-dit .mmc-g>small{display:block;font-weight:800;font-size:.84rem;color:var(--m-soft);margin:0 0 6px;text-transform:uppercase;letter-spacing:.04em}
.mem-dit .mmc-g ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.mem-dit .mmc-g li{display:inline-flex;align-items:center;gap:6px;padding:6px 6px 6px 12px;border-radius:999px;border:2px solid var(--m-line);background:var(--m-card);font-size:.92rem;font-weight:700;line-height:1.25;transition:opacity .25s,transform .25s}
.mem-dit .mmc-g li.ro{padding-right:12px}
.mem-dit .mmc-g li.parti{opacity:0;transform:scale(.9)}
.mem-dit .mmc-g li button{width:30px;height:30px;border-radius:50%;border:0;background:color-mix(in srgb,var(--m-ink) 8%,transparent);color:var(--m-soft);display:grid;place-items:center;cursor:pointer;font-size:.8rem}
.mem-dit .mmc-g li button:hover,.mem-dit .mmc-g li button:focus-visible{background:color-mix(in srgb,var(--m-ko,#C0392B) 15%,transparent);color:var(--m-ko,#C0392B)}
.mem-dit .mmc-acts{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:6px}

@media (max-width:380px){.mmc-in{padding-left:12px;padding-right:12px}.mmc-mats{gap:12px 10px}.mmc-mat{padding:10px 8px 8px}.mmc-face-t{font-size:.84rem}}
@media (prefers-reduced-motion: reduce){.mmc,.mmc.sort,.mmc-corps,.mmc-pop{animation:none!important}.mmc-prog i{transition:none}
  .mmc-t,.mmc-tuile,.mmc-chip,.mmc-lg,.mmc-x,.mmc-ret,.mmc-cl,.mmc-avb,.mmc-face-t,.mmc-perm{transition:none}.mmc-t:active,.mmc-tuile:active,.mmc-chip:active,.mmc-lg:active,.mmc-x:active,.mmc-ret:active,.mmc-cl:active,.mmc-avb:active,.mmc-face-t:active,.mmc-perm:active{transform:none}}

/* fiche : « Écouter la leçon » en premier quand l'élève préfère écouter */
.listen-wrap.pref{margin:0 0 16px}
.listen-pref{display:flex;align-items:center;gap:8px;margin:0 0 8px;font-family:var(--display);font-weight:800;font-size:.95rem;color:color-mix(in srgb,var(--ogre,#58A13E) 70%,var(--ink))}
.listen-wrap.pref .listen{border-color:color-mix(in srgb,var(--ogre,#58A13E) 60%,var(--line))!important;box-shadow:0 4px 0 color-mix(in srgb,var(--ogre,#58A13E) 45%,var(--line))!important}

/* classes : 12 tuiles, 3 colonnes (CP → terminale) */
.mmc-cls{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mmc-cl{min-height:70px;padding:8px 10px;border-radius:18px}
.mmc-cl b{font-size:1.25rem}
.mmc-cl[data-classe="Tle"] b{font-size:1.02rem}
.mmc-cl small{font-size:.76rem}
.mmc-cl .mmc-coche{top:6px;right:6px;width:22px;height:22px}

/* « Ton programme » : chargement (cartes qui se mélangent, Ogrelo qui réfléchit) */
.mmc-charge-prog{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;min-height:100%;text-align:center;padding:20px 0}
.mmc-cartes{position:relative;width:150px;height:100px}
.mmc-cartes i{position:absolute;left:45px;top:10px;width:60px;height:80px;border-radius:12px;border:2px solid var(--line);background:var(--card);box-shadow:0 4px 0 var(--duo-ombre,var(--line));animation:mmcMelange 2.4s ease-in-out infinite}
.mmc-cartes i:nth-child(1){background:#2D7FE0;border-color:#2D7FE0;transform:translateX(-42px) rotate(-14deg)}.mmc-cartes i:nth-child(2){background:#E0663A;border-color:#E0663A;animation-delay:.3s;transform:translateX(-14px) rotate(-5deg)}
.mmc-cartes i:nth-child(3){background:#3E9A35;border-color:#3E9A35;animation-delay:.6s;transform:translateX(14px) rotate(5deg)}.mmc-cartes i:nth-child(4){background:#D99A0B;border-color:#D99A0B;animation-delay:.9s;transform:translateX(42px) rotate(14deg)}
@keyframes mmcMelange{0%,100%{transform:translateX(0) rotate(0)}25%{transform:translateX(-46px) rotate(-12deg)}50%{transform:translateX(0) rotate(0) translateY(-8px)}75%{transform:translateX(46px) rotate(12deg)}}
.mmc-pense .ogre{width:84px;height:84px}
.mmc-ligne{font-family:"Patrick Hand","Comic Sans MS",cursive;font-size:1.2rem;line-height:1.35;margin:0;min-height:3em;max-width:300px}
.mmc-ligne.vient{animation:dpPas .35s ease both}

/* titres, tuiles de chiffres, barres */
.mmc-prog-t{font-family:var(--display);font-weight:800;font-size:1.3rem;line-height:1.15;margin:4px 0 14px}
.mmc-corps .mmc-prog-t+.og-dit{margin-top:0}
.mmc-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 16px}
.mmc-stat{display:flex;flex-direction:column;gap:2px;padding:12px 12px 10px;border-radius:20px;background:var(--c);color:#fff;box-shadow:0 5px 0 color-mix(in srgb,var(--c) 58%,#000)}
.mmc-stat-i{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.22);font-size:1rem;margin-bottom:4px}
.mmc-stat b{font-family:var(--display);font-weight:800;font-size:1.75rem;line-height:1;text-shadow:0 2px 0 rgba(0,0,0,.18)}
.mmc-stat small{font-weight:700;font-size:.82rem;line-height:1.25;opacity:.95}
.mmc-carte{background:var(--card);border:2px solid var(--line);border-radius:20px;padding:14px;box-shadow:0 4px 0 var(--duo-ombre,var(--line));margin:0 0 16px}
.mmc-carte h3{font-family:var(--display);font-weight:800;font-size:1.05rem;margin:0 0 12px}
.mmc-barres{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.mmc-barres li{display:grid;grid-template-columns:minmax(0,7.2em) 1fr auto;gap:10px;align-items:center}
.mmc-barres .n{font-weight:700;font-size:.9rem;line-height:1.2;overflow-wrap:anywhere}
.mmc-barres .b{height:16px;border-radius:999px;background:color-mix(in srgb,var(--ink) 9%,var(--line));overflow:hidden}
.mmc-barres .b i{display:block;height:100%;border-radius:999px;background:var(--c);box-shadow:inset 0 -3px 0 rgba(0,0,0,.15),inset 0 3px 0 rgba(255,255,255,.25)}
.mmc-barres b{font-family:var(--display);font-size:.92rem;white-space:nowrap}

/* engagements « si → alors » */
.mmc-engs{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:12px}
.mmc-engs li{display:flex;flex-direction:column;gap:6px;padding:12px 14px;border-radius:18px;border:2px solid color-mix(in srgb,var(--ogre,#58A13E) 40%,var(--line));background:color-mix(in srgb,var(--ogre,#58A13E) 8%,var(--card));box-shadow:0 4px 0 color-mix(in srgb,var(--ogre,#58A13E) 35%,var(--line))}
.mmc-engs .si{align-self:flex-start;font-weight:800;font-size:.85rem;padding:3px 10px;border-radius:999px;background:var(--card);border:2px solid var(--line)}
.mmc-engs .fl{display:none}
.mmc-engs .alors{font-weight:700;line-height:1.4}

/* semaine type */
.mmc-sem{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.mmc-sem li{display:grid;grid-template-columns:3.2em 1fr auto;gap:10px;align-items:center;padding:10px 12px;border-radius:16px;background:var(--card);border:2px solid var(--line);border-left:7px solid var(--c);box-shadow:0 3px 0 var(--duo-ombre,var(--line))}
.mmc-sem .j{font-family:var(--display);font-weight:800;font-size:1rem}
.mmc-sem .q{display:flex;flex-direction:column;gap:1px;min-width:0}.mmc-sem .q b{font-size:.92rem;line-height:1.25}.mmc-sem .q small{color:var(--soft,var(--ink));font-size:.78rem;font-weight:700}
.mmc-sem .m{font-family:var(--display);font-weight:800;font-size:1.15rem;text-align:right;line-height:1}.mmc-sem .m small{display:block;font-size:.7rem;color:var(--soft,var(--ink))}
.mmc-sem li.repos{opacity:.6;box-shadow:none;border-left-color:var(--line)}

/* priorités et jalons */
.mmc-prios{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:12px}
.mmc-prios li{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:20px;background:var(--c);color:#fff;box-shadow:0 5px 0 color-mix(in srgb,var(--c) 58%,#000)}
.mmc-prios li.vide{--c:#8A8799}
.mmc-prios .r{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--c);font-family:var(--display);font-weight:800;font-size:1.2rem}
.mmc-prios b{font-family:var(--display);font-weight:800;font-size:1.1rem;line-height:1.2;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.mmc-prios p{margin:4px 0 0;font-weight:700;font-size:.92rem;line-height:1.4}
.mmc-cible{font-family:var(--body,inherit);font-size:.78rem;padding:2px 8px;border-radius:999px;background:rgba(255,255,255,.25)}
.mmc-jalons{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:10px}
.mmc-jalons li{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:16px;background:var(--card);border:2px solid var(--line)}
.mmc-jalons .ic{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--ogre,#58A13E);color:#fff}.mmc-jalons .ic svg{width:16px;height:16px;stroke-width:3}
.mmc-jalons b{font-size:.9rem}.mmc-jalons p{margin:2px 0 0;font-size:.92rem;line-height:1.4}
.mmc-partager{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;border-radius:16px;border:2px solid var(--line);background:var(--card);color:var(--ink);
  font:inherit;font-family:var(--display);font-weight:800;font-size:1rem;cursor:pointer;box-shadow:0 4px 0 var(--duo-ombre,var(--line))}
.mmc-partager:active{transform:translateY(3px);box-shadow:none}
.mmc-moi-prog{padding-bottom:20px}.mmc-refaire{display:block;margin:16px auto 0}
.mmc-ic-prog{color:#2D7FE0!important;background:color-mix(in srgb,#2D7FE0 14%,transparent)!important}
@media (prefers-reduced-motion: reduce){.mmc-cartes i,.mmc-ligne.vient{animation:none}}

/* « Ton profil » : archétype, constats prouvés, actions concrètes */
.mmc-sur{margin:2px 0 4px;font-family:var(--display);font-weight:800;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--ogre,#58A13E) 70%,var(--ink))}
.mmc-arch{margin:0 0 14px;font-family:var(--display);font-weight:800;font-size:1.65rem;line-height:1.1;color:var(--ink)}
.mmc-consts{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-direction:column;gap:12px}
.mmc-consts li{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:20px;background:var(--card);border:2px solid color-mix(in srgb,var(--c) 45%,var(--line));box-shadow:0 5px 0 color-mix(in srgb,var(--c) 45%,var(--line))}
.mmc-const-i{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--c);color:#fff;font-size:1.3rem;box-shadow:inset 0 -4px 0 rgba(0,0,0,.18)}
.mmc-consts b{display:block;font-family:var(--display);font-weight:800;font-size:1.08rem;line-height:1.2}
.mmc-preuve{display:inline-block;margin:6px 0 4px;padding:3px 10px;border-radius:999px;background:var(--c);color:#fff;font-weight:800;font-size:.85rem;line-height:1.3}
.mmc-consts p{margin:2px 0 0;font-size:.93rem;line-height:1.4}
.mmc-connecte{display:flex;gap:8px;align-items:flex-start;margin:0;padding:12px 14px;border-radius:16px;border:2px dashed color-mix(in srgb,var(--sky,#2D7FE0) 50%,var(--line));color:var(--ink);font-weight:700;font-size:.92rem;line-height:1.4}
.mmc-connecte i{color:var(--sky,#2D7FE0);margin-top:2px}
.mmc-actions{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-direction:column;gap:12px}
.mmc-actions li{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:20px;background:var(--ogre,#58A13E);color:#fff;box-shadow:0 5px 0 color-mix(in srgb,var(--ogre,#58A13E) 58%,#000)}
.mmc-actions .r{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--ogre-d,#3E7F31);font-family:var(--display);font-weight:800;font-size:1.15rem}
.mmc-quand{display:inline-block;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.24);font-family:var(--display);font-weight:800;font-size:.95rem}
.mmc-actions p{margin:6px 0 0;font-weight:700;font-size:1rem;line-height:1.4}
.mmc-vers-moi{display:flex;gap:8px;align-items:center}

/* lycée : voie (3 grosses tuiles), spécialités et options (pastilles), série technologique (tuiles) */
.mmc-voies{display:grid;grid-template-columns:1fr;gap:12px;margin:0 0 6px}
.mmc-voie{min-height:66px;padding:10px 46px 10px 16px}
.mmc-voie b{font-size:1.2rem}.mmc-voie small{font-size:.82rem;opacity:.95}
.mmc-voie .mmc-coche{top:50%;right:12px;margin-top:-13px}
.mmc-voie[aria-checked="true"]{outline:4px solid color-mix(in srgb,var(--c) 45%,#fff);outline-offset:2px}
.mmc-series{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mmc-serie{min-height:68px;align-items:flex-start;text-align:left;padding:10px 12px}
.mmc-serie b{font-family:var(--display);font-size:1.15rem;line-height:1}.mmc-serie span{font-size:.8rem;font-weight:700;color:var(--soft,var(--ink));line-height:1.2}
.mmc-serie[aria-checked="true"] span{color:#fff}
.mmc-4{grid-template-columns:repeat(4,minmax(0,1fr))}.mmc-llcer{min-height:52px}.mmc-llcer b{font-size:.9rem}

/* sans Pronote : « je ne vois que ce que tu m'envoies » */
.mmc-ph{display:flex;flex-direction:column;gap:12px;margin:0 0 14px}
.mmc-ph-t{display:flex;gap:12px;align-items:center;padding:14px;border-radius:20px;background:var(--c);color:#fff;box-shadow:0 5px 0 color-mix(in srgb,var(--c) 58%,#000)}
.mmc-ph-i{flex:none;width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:rgba(255,255,255,.22);font-size:1.4rem;box-shadow:inset 0 -3px 0 rgba(0,0,0,.15)}
.mmc-ph-t b{display:block;font-family:var(--display);font-weight:800;font-size:1.05rem;line-height:1.2}.mmc-ph-t small{display:block;font-weight:700;font-size:.85rem;opacity:.95;margin-top:2px;line-height:1.3}
.mmc-ph-parents{display:block;margin:0 0 14px;padding:12px 14px;border-radius:16px;background:color-mix(in srgb,var(--sun,#F5B800) 18%,var(--card));border:2px solid color-mix(in srgb,var(--sun,#F5B800) 55%,var(--line));font-size:.93rem;line-height:1.4}
.mmc-ph-parents i{margin-right:6px;vertical-align:-2px}
.mmc-compris{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:10px 14px;border-radius:18px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-weight:800;font-size:1rem;text-align:left;cursor:pointer;box-shadow:0 4px 0 var(--duo-ombre,var(--line))}
.mmc-case{flex:none;width:30px;height:30px;border-radius:9px;border:2px solid var(--line);display:grid;place-items:center;color:transparent}.mmc-case svg{width:18px;height:18px;stroke-width:3}
.mmc-compris[aria-pressed="true"]{border-color:var(--ogre,#58A13E);background:color-mix(in srgb,var(--ogre,#58A13E) 12%,var(--card));box-shadow:0 4px 0 color-mix(in srgb,var(--ogre,#58A13E) 55%,#000)}
.mmc-compris[aria-pressed="true"] .mmc-case{background:var(--ogre,#58A13E);border-color:var(--ogre,#58A13E);color:#fff}
/* onglet Devoirs : la carte « Envoie-moi tes devoirs » */
.pe-carte{margin:0 0 16px;padding:14px;border-radius:20px;background:var(--card);border:2px solid color-mix(in srgb,#2D7FE0 40%,var(--line));box-shadow:0 5px 0 color-mix(in srgb,#2D7FE0 35%,var(--line))}
.pe-carte.fort{border-color:#E8810C;box-shadow:0 5px 0 color-mix(in srgb,#E8810C 50%,var(--line));background:color-mix(in srgb,#E8810C 7%,var(--card))}
.pe-t{display:flex;gap:12px;align-items:flex-start}.pe-t b{display:block;font-family:var(--display);font-weight:800;font-size:1.05rem;line-height:1.2}.pe-t small{display:block;color:var(--soft,var(--ink));font-size:.88rem;line-height:1.35;margin-top:3px}
.pe-ic{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#2D7FE0;color:#fff;font-size:1.25rem;box-shadow:inset 0 -3px 0 rgba(0,0,0,.18)}.pe-carte.fort .pe-ic{background:#E8810C}
.pe-b{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.pe-go{margin:0!important;min-height:48px;font-size:.95rem;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}
.pe-msg{margin:8px 2px 0;font-weight:700;font-size:.9rem;min-height:1em}

/* photos facultatives (emploi du temps, agenda) */
.mmc-pp{display:flex;flex-direction:column;gap:12px;margin:0 0 12px}
.mmc-pp-t{display:flex;gap:12px;align-items:center;padding:14px;border-radius:20px;background:var(--c);color:#fff;cursor:pointer;box-shadow:0 5px 0 color-mix(in srgb,var(--c) 58%,#000)}
.mmc-pp-t b{display:block;font-family:var(--display);font-weight:800;font-size:1.05rem;line-height:1.2}.mmc-pp-t small{display:block;font-weight:700;font-size:.85rem;opacity:.95;margin-top:2px;line-height:1.3}
.mmc-pp-t:active{transform:translateY(4px);box-shadow:0 1px 0 color-mix(in srgb,var(--c) 58%,#000)}
.mmc-pp-t.fait{outline:4px solid #43B53A;outline-offset:2px}
.mmc-pp-etat{display:block;font-style:normal;font-weight:800;font-size:.85rem;margin-top:4px}
.mmc-in-mail{font-size:1.1rem}
.mmc-pe-moi h3{display:flex;gap:8px;align-items:center;font-family:var(--display);font-weight:800;font-size:1.05rem;margin:0 0 8px}
.mmc-pe-moi p{margin:0 0 8px;line-height:1.4}
/* Devoirs : emploi du temps */
.pe-edt{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:10px;min-height:44px;border-radius:14px;border:2px dashed color-mix(in srgb,#8455D8 50%,var(--line));background:none;color:var(--ink);font:inherit;font-weight:800;font-size:.92rem;cursor:pointer}
.pe-edt.fort{border-style:solid;border-color:#8455D8;background:color-mix(in srgb,#8455D8 12%,var(--card))}
.pe-edt-l{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:8px}
.pe-edt-l li{display:flex!important;flex-wrap:wrap;gap:6px;align-items:center;padding:10px;border-radius:14px;background:var(--m-card,var(--card));border:2px solid var(--line)}
.pe-edt-l li select[data-k="jour"]{flex:0 0 5.6em!important}.pe-edt-l li input{flex:1 1 0!important}.pe-edt-l li select[data-k="matiere"]{flex:1 0 calc(100% - 44px)!important;order:5}
.pe-edt-l select,.pe-edt-l input{width:auto!important;max-width:none!important;min-width:0;min-height:40px;border:2px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:inherit;font-size:.92rem;padding:4px 6px}
.pe-x{flex:0 0 32px;order:6;border:0;background:none;color:var(--soft,var(--ink));cursor:pointer}
.pe-refus{margin:12px 0 0}.pe-refus>.f{width:48px;height:48px}
/* langues : pas de bordure ; éteint (alpha moyen) → allumé (plein, lumineux) quand choisi */
.mmc-lg:not(.bientot):not(.aucune){opacity:.5;filter:saturate(.6);transition:opacity .2s,filter .2s,transform .08s,box-shadow .2s}
.mmc-lg[aria-checked="true"],.mmc-lg[aria-pressed="true"]{outline:none!important;opacity:1!important;filter:none!important;box-shadow:0 5px 0 color-mix(in srgb,var(--lg) 55%,#000),0 0 22px color-mix(in srgb,var(--lg) 70%,#fff)!important;transform:translateY(-2px)}
.mmc-lg.bientot{opacity:.3!important}
@media (prefers-reduced-motion:reduce){.mmc-lg{transition:none!important}}

/* « Mes documents » (documents.js) : liste, visionneuse, texte transcrit, choix « Utiliser la feuille déjà scannée ».
   S'appuie sur memoire.css (fenêtres, cartes, boutons, --m-*) ; clair / sombre par les variables de l'appli. */
.doc-reprise{--m-card:var(--card,#fff);--m-ink:var(--ink,#2B2A3A);--m-soft:var(--soft,#6B6880);--m-line:var(--line,#EADFC6);--m-vert:var(--ogre-d,#3E7F31)}
.doc-page .mem-h p{font-size:.92rem}
.doc-resume{display:flex;align-items:flex-start;gap:8px;color:var(--m-soft);font-size:.88rem;line-height:1.45;margin:0 0 16px}
.doc-resume i{flex:none;margin-top:2px}
.doc-mat h3{justify-content:space-between;margin-bottom:6px}
.doc-mat h3 small{font-family:var(--body,system-ui,sans-serif);font-weight:600;font-size:.82rem;color:var(--m-soft)}
.doc-dv{display:flex;align-items:center;gap:6px;color:var(--m-soft);font-size:.86rem;line-height:1.35;margin:12px 0 6px}
.doc-dv i{flex:none}
.doc-liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.doc-l{display:flex;align-items:center;gap:12px;padding:8px;border-radius:14px;background:color-mix(in srgb,var(--m-ink) 4%,transparent)}
.doc-mini{flex:none;width:52px;height:52px;border-radius:12px;overflow:hidden;display:grid;place-items:center;background:color-mix(in srgb,var(--m-ink) 8%,transparent);color:var(--m-soft);font-size:1.2rem}
.doc-mini img{width:100%;height:100%;object-fit:cover;display:block}
.doc-mini.txt{background:color-mix(in srgb,var(--m-vert) 13%,transparent);color:var(--m-vert)}
.doc-l .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.doc-l .tx b{font-size:.95rem;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word}
.doc-l .tx small{color:var(--m-soft);font-size:.8rem;line-height:1.3}
.doc-acts{flex:none;display:flex;align-items:center;gap:6px}
.doc-voir{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:6px 12px;border-radius:12px;border:2px solid var(--m-line);background:var(--m-card);color:var(--m-ink);font:inherit;font-weight:700;font-size:.88rem;cursor:pointer}
.doc-sup{width:40px;height:40px;border-radius:12px;border:2px solid transparent;background:transparent;color:var(--m-soft);display:grid;place-items:center;font-size:1.05rem;cursor:pointer}
.doc-sup:hover,.doc-sup:focus-visible{color:var(--m-ko);border-color:color-mix(in srgb,var(--m-ko) 40%,transparent)}
.doc-vide{display:flex;gap:14px;align-items:center}
.doc-vide p{margin:4px 0 0;color:var(--m-soft);line-height:1.45;font-size:.92rem}
.doc-plus{display:block;text-align:center}
@media (max-width:360px){.doc-l{gap:8px}.doc-mini{width:44px;height:44px}.doc-voir{width:40px;padding:0;justify-content:center}.doc-voir span{display:none}.doc-sup{width:36px}}

/* visionneuse plein écran (fond sombre dans les deux thèmes : la photo ressort) */
.doc-vue{background:#121214;color:#F4F2EC;display:flex;flex-direction:column}
.doc-vue-h{display:flex;align-items:center;gap:12px;padding:calc(10px + env(safe-area-inset-top,0px)) 16px 10px}
.doc-vue-h div{min-width:0;display:flex;flex-direction:column}
.doc-vue-h b{font-size:1rem;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc-vue-h small{color:#B9B6AE;font-size:.82rem}
.doc-vue-x{flex:none;width:44px;height:44px;border-radius:14px;border:0;background:rgba(255,255,255,.12);color:#fff;display:grid;place-items:center;font-size:1.1rem;cursor:pointer}
.doc-vue-img{flex:1;min-height:0;display:grid;place-items:center;padding:4px 8px;overflow:auto;-webkit-overflow-scrolling:touch}
.doc-vue-img img{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px;touch-action:pinch-zoom}
.doc-vue-img .mem-charge{color:#B9B6AE}
.doc-vue-b{padding:10px 16px calc(14px + env(safe-area-inset-bottom,0px));display:flex;justify-content:center}
.doc-vue-t{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:10px 18px;border-radius:14px;border:0;background:rgba(255,255,255,.14);color:#fff;font:inherit;font-weight:700;cursor:pointer}

/* texte transcrit : lisible, aéré */
.doc-note{display:flex;align-items:flex-start;gap:8px;color:var(--m-soft);font-size:.86rem;line-height:1.45;margin:0 0 14px}
.doc-note i{flex:none;margin-top:2px;color:var(--m-vert)}
.doc-article{font-size:1.02rem;line-height:1.65;padding:18px 18px 8px;overflow-wrap:anywhere}
.doc-article h3{font-family:var(--display);font-size:1.15rem;line-height:1.25;margin:0 0 12px}
.doc-article h4{font-size:1rem;margin:14px 0 8px}
.doc-article p{margin:0 0 12px}
.doc-article ul{margin:0 0 12px;padding-left:22px}
.doc-article li{margin:0 0 6px}
.doc-article .katex-display{overflow-x:auto;overflow-y:hidden}

/* « Utiliser la feuille déjà scannée (date) » / « Rescanner » */
.doc-reprise{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;padding:12px;margin:10px 0 0;border-radius:16px;border:2px solid color-mix(in srgb,var(--m-vert) 35%,var(--m-line));background:color-mix(in srgb,var(--m-vert) 7%,var(--m-card))}
.doc-reprise .tx{flex:1;min-width:150px;display:flex;flex-direction:column;gap:2px}
.doc-reprise .tx b{font-size:.95rem;line-height:1.3;color:var(--m-ink)}
.doc-reprise .tx small{color:var(--m-soft);font-size:.82rem}
.doc-reprise-b{flex:1 1 100%;display:flex;flex-direction:column;gap:8px}
.doc-reprise .btn{margin:0;width:100%;font-size:1rem;padding:12px 14px;display:flex;align-items:center;justify-content:center;gap:8px;text-align:center}
.doc-reprise .btn.alt{box-shadow:none;border-width:2px;font-size:.95rem;padding:10px 14px}
.doc-reprise .doc-mini{width:44px;height:44px}
.doc-reprise.busy{opacity:.6;pointer-events:none}

/* Réglages › Mes données › « Feuilles scannées (n) » : une ligne discrète */
.doc-rg{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:10px 12px;border-radius:14px;border:2px solid var(--line,#EADFC6);background:var(--card,#fff);color:var(--ink,#2B2A3A);font:inherit;text-align:left;cursor:pointer}
.doc-rg span{flex:1}.doc-rg b{color:var(--soft,#6B6880);font-weight:600}.doc-rg .go{color:var(--soft,#6B6880)}

/* exercice déjà fait : son historique d'abord */
.doc-hist{--m-card:var(--card,#fff);--m-ink:var(--ink,#2B2A3A);--m-soft:var(--soft,#6B6880);--m-line:var(--line,#EADFC6);--m-vert:var(--ogre-d,#3E7F31);
  border:2px solid color-mix(in srgb,var(--m-vert) 35%,var(--m-line));background:color-mix(in srgb,var(--m-vert) 6%,var(--m-card));border-radius:16px;padding:14px;margin:12px 0}
.doc-hist-h{display:flex;align-items:center;gap:12px}
.doc-hist-h .doc-mini{border:0;cursor:pointer;padding:0}
.doc-hist-h .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.doc-hist-h b{color:var(--m-vert);font-size:1rem;display:flex;align-items:center;gap:6px}
.doc-hist-h small{color:var(--m-soft);font-size:.86rem}
.doc-hist-et{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;line-height:1.4}
.doc-hist-et li{display:flex;gap:8px;align-items:flex-start}.doc-hist-et li i{flex:none;margin-top:2px}
.doc-hist-et li.ok i{color:var(--m-vert)}.doc-hist-et li.ko i{color:var(--ko-t,#B8322A)}
.doc-hist-p{margin:10px 0 0;line-height:1.45;color:var(--m-ink)}
.doc-hist-l{margin:12px 0 0;color:var(--m-soft);font-size:.88rem}
.doc-hist-l summary{cursor:pointer;min-height:32px;display:flex;align-items:center}
.doc-hist-l ul{list-style:none;margin:6px 0 0;padding:0}.doc-hist-l li{display:flex;justify-content:space-between;padding:4px 0;border-top:1px solid var(--m-line)}
.fe-hist-b{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.fe-hist-b .btn{margin:0;display:flex;align-items:center;justify-content:center;gap:8px}

/* « Vérifier mon travail » : la dernière vérification d'abord */
.doc-verif{border:2px solid color-mix(in srgb,var(--ogre-d,#3E7F31) 35%,var(--line,#EADFC6));background:color-mix(in srgb,var(--ogre-d,#3E7F31) 6%,var(--card,#fff));border-radius:16px;padding:12px 14px;margin:0 0 12px}
.doc-verif-t{margin:0;font-weight:800;color:var(--ogre-d,#3E7F31);display:flex;align-items:center;gap:6px}
.doc-verif-r{margin:6px 0 0;color:var(--soft,#6B6880);font-size:.92rem;line-height:1.4}
.doc-verif ul{margin:8px 0 0;padding-left:18px;line-height:1.45;font-size:.92rem}
.doc-verif .btn{margin:10px 0 0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:1rem;padding:11px 14px}
.doc-verif .btn.busy{opacity:.6;pointer-events:none}

/* Ogrelo · élèves sans ENT (sans-ent.js) : accueil, création du compte, code de reprise, Moi, carte de l'accueil. Couleurs : variables du thème (clair + sombre). */
.plat-se .plat-ic{color:var(--ogre-d)}
.se-reprendre{text-align:center;margin:14px 0 0}.se-reprendre .linkbtn2{display:inline-flex;align-items:center;gap:6px;font-weight:700}
.se-reprendre i,.se-retour i,.se-rassure i,.se-rep-warn i{width:16px;height:16px;flex:none}
.se-blk{display:flex;flex-direction:column;gap:4px}
.se-retour{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;margin:0 0 10px;font-weight:700}
.se-intro{margin:0 0 14px;color:var(--soft);line-height:1.45}
.se-choix{display:grid;gap:10px;margin:0 0 12px}
.se-c{display:flex;align-items:center;gap:14px;width:100%;padding:12px 14px;border:2px solid var(--line);border-radius:18px;background:var(--sheet);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.se-c:active{transform:scale(.98)}.se-c:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.se-c .plat-tx{flex:1}.se-c .plat-tx small{font-size:.8rem;font-weight:700;color:var(--soft)}
.se-fl{flex:none;width:18px;height:18px;color:var(--soft)}
.se-rassure{display:flex;gap:8px;align-items:flex-start;margin:10px 0 0;font-size:.85rem;color:var(--soft);line-height:1.4}
.se-ligne{display:flex;gap:8px;align-items:stretch}.se-ligne .exo-in{flex:1;min-width:0;margin:0}.se-ligne .btn{margin:0;width:auto;flex:none;padding:0 18px}
.se-code-in{font-family:var(--display);font-weight:900;font-size:1.25rem;letter-spacing:.14em;text-align:center;text-transform:uppercase}
.se-aide{margin:8px 0 4px;font-size:.85rem;color:var(--soft);line-height:1.4}.se-aide:empty{display:none}
.se-msg.ok{color:var(--ogre-d);font-weight:700}
.se-blk .exo-in{margin-bottom:12px}.se-blk .btn{margin:6px 0 0}.se-blk .r-err:empty{margin:0}
.se-cl{display:flex;align-items:center;gap:12px;padding:10px 12px;margin:0 0 14px;border-radius:14px;background:color-mix(in srgb,var(--ogre) 9%,var(--sheet));border:2px solid color-mix(in srgb,var(--ogre) 30%,var(--line))}
.se-cl .plat-tx{flex:1}.se-cl small{color:var(--soft);font-weight:700;font-size:.8rem}.se-ok{width:20px;height:20px;color:var(--ogre-d);flex:none}
.se-nivs{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:0 0 14px;border-radius:14px}
.se-nivs button{min-width:0;padding:10px 2px;border:2px solid var(--line);border-radius:12px;background:var(--sheet);color:var(--ink);font:inherit;font-weight:800;font-size:.9rem;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.se-nivs button[aria-checked="true"]{border-color:var(--ogre-d);background:color-mix(in srgb,var(--ogre) 16%,var(--sheet));color:var(--ink)}
.se-requis{border-color:#D9534F!important;box-shadow:0 0 0 3px color-mix(in srgb,#D9534F 25%,transparent)!important}
.se-rep-h{display:flex;gap:12px;align-items:center;margin:0 0 6px}.se-rep-h svg{width:60px;height:60px;flex:none}.se-rep-h b{display:block;font-family:var(--display);font-size:1.15rem}.se-rep-h small{display:block;color:var(--soft);line-height:1.4;margin-top:2px}
.se-rep-code{margin:12px 0 10px;text-align:center;font-family:var(--display);font-weight:900;font-size:clamp(1.35rem,7vw,1.8rem);letter-spacing:.08em;color:var(--ink);background:var(--paper);border:3px dashed var(--line);border-radius:16px;padding:10px 6px;user-select:all;overflow-wrap:anywhere}
.se-rep-code.petit{font-size:clamp(1.1rem,5.6vw,1.4rem);margin:8px 0}
.se-rep-warn{display:flex;gap:8px;align-items:flex-start;margin:0 0 12px;font-size:.85rem;font-weight:700;color:var(--t-warn,#8A5A00);line-height:1.4}
.se-deux{display:grid;grid-template-columns:1fr 1fr;gap:10px}.se-deux .btn{margin:0;width:auto;min-width:0;padding-left:6px;padding-right:6px;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}
.se-deux .btn i{width:16px;height:16px;flex:none}
/* Moi */
.se-moi h3{display:flex;align-items:center;gap:8px}.se-moi h3 i{width:20px;height:20px}
.se-bloc{padding:14px 0 4px;border-top:1px solid var(--line)}.se-bloc:first-of-type{border-top:0;padding-top:4px}.se-bloc>b{display:block;margin:0 0 2px}
.se-bloc .se-nivs{margin:10px 0 6px}.se-voir{margin:6px 0 0;display:inline-flex;align-items:center;gap:8px;width:auto}
/* accueil d'un compte sans ENT */
.se-home{display:flex;gap:12px;align-items:flex-start;margin:0 0 16px;padding:14px;border-radius:18px;background:color-mix(in srgb,var(--ogre) 8%,var(--sheet));border:2px solid color-mix(in srgb,var(--ogre) 22%,var(--line))}
.se-home-ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--ogre) 18%,var(--sheet));color:var(--ogre-d)}.se-home-ic i{width:20px;height:20px}
.se-home-t{flex:1;min-width:0}.se-home-t b{display:block;font-family:var(--display);font-size:1.05rem}.se-home-t small{display:block;color:var(--soft);line-height:1.4;margin:2px 0 10px}
.se-home-b{display:grid;grid-template-columns:1fr 1fr;gap:8px}.se-home-b .btn{margin:0;width:auto;min-width:0;padding:10px 4px;overflow:hidden;text-overflow:ellipsis;font-size:.88rem;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}.se-home-b .btn i{width:16px;height:16px;flex:none}
/* champ obligatoire oublié : fenêtre rouge en bas (même dessin que le mode classe) */
.t-demo.t-err{background:linear-gradient(135deg,#B83A30,#D9534F)!important;box-shadow:0 -10px 30px rgba(120,30,20,.3)!important}
.t-demo .t-ic{flex:none;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.2);display:grid;place-items:center}.t-demo .t-ic i{width:22px;height:22px}
@media (max-width:350px){.se-nivs{grid-template-columns:repeat(3,1fr)}.se-home{flex-direction:column}}
.se-suppr{text-align:center}.se-suppr .linkbtn2{display:inline-flex;align-items:center;gap:6px;color:var(--ko,#C2362C);font-weight:700}.se-suppr i{width:14px;height:14px}


@media (max-width:430px){.se-reprendre{margin:10px 0 0}.se-reprendre button{font-size:.9rem}}

.plat-ic.plat-ogre{padding:0;overflow:hidden;background:none}.plat-ic.plat-ogre img{width:100%;height:100%;object-fit:cover;border-radius:inherit}

/* ---------- écrans « Compte Ogrelo » (sans-ent.js) : même style que l'accueil (connexion.css, bulles.css, tuiles.css) ----------
   un écran par étape : flèche de retour 48 px + titre, Ogrelo qui parle, une action ; tuiles et boutons en relief ; clair + sombre, 320 px d'abord */
.se-vue{display:flex;flex-direction:column;gap:18px;animation:lxSlide .3s cubic-bezier(.2,1,.4,1) both}
.se-vue>*{margin:0}
.se-vue .lx-tete b{font-size:1.18rem}
/* Ogrelo + LA bulle : 84 px sur le 1er écran, 64 px ensuite (place pour le clavier) */
.se-vue .se-dit{margin:0 0 2px}
.se-vue .se-dit>.f{width:84px;height:84px;transform-origin:50% 90%;animation:lxPop .5s cubic-bezier(.2,1.5,.4,1) both,lxBob 3.6s ease-in-out .6s infinite}
.se-vue .se-dit.petit>.f{width:64px;height:64px}
.se-vue .se-dit .og-bulle p{font-size:1.12rem;line-height:1.38}
/* les deux grosses tuiles (lx-role de connexion.css) */
.se-tuiles{display:flex;flex-direction:column;gap:16px}
/* le code de la classe : 6 grosses cases (comme le code du Défi), 3 + 3 */
.se-cases{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 4px repeat(3,minmax(0,1fr));gap:7px;cursor:text;border-radius:16px}
.se-cases input{position:absolute;inset:0;width:100%;height:100%;opacity:0;border:0;padding:0;font-size:16px;color:transparent;caret-color:transparent;background:transparent;z-index:1}
.se-case{height:62px;border-radius:14px;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:1.7rem;color:var(--ink);text-transform:uppercase;
  background:var(--card);border:2px solid var(--line);box-shadow:0 4px 0 var(--duo-ombre,var(--line));transition:transform .08s ease,border-color .1s,box-shadow .1s}
.se-case:nth-of-type(4){grid-column:5}
.se-case.plein{border-color:color-mix(in srgb,var(--ogre) 60%,var(--line));box-shadow:0 4px 0 color-mix(in srgb,var(--ogre-d) 60%,var(--line));color:var(--ogre-d)}
.se-case.ici{border-color:var(--ogre-d);box-shadow:0 4px 0 var(--ogre-d);transform:translateY(-2px)}
.se-case.ici:empty::after{content:"";width:2px;height:26px;background:var(--ogre-d);animation:seCurseur 1s steps(1) infinite}
@keyframes seCurseur{50%{opacity:0}}
.se-cases,.se-cases:focus-within,.se-cases.se-requis{outline:none!important;box-shadow:none!important}.se-cases input:focus,.se-cases input:focus-visible{outline:none!important;box-shadow:none!important}.se-cases.se-requis .se-case{border-color:#D9534F}
/* champs en relief (prénom, initiale, code de reprise) */
.se-gros{display:block;width:100%;box-sizing:border-box;min-height:58px;margin:0;padding:12px 16px;font:inherit;font-family:var(--display);font-weight:800;font-size:1.3rem;
  border:2px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink);box-shadow:0 4px 0 var(--duo-ombre,var(--line))}
.se-gros:focus{outline:none;border-color:var(--ogre-d);box-shadow:0 4px 0 var(--ogre-d)}
.se-gros::placeholder{color:var(--soft);font-weight:700;opacity:.6}
.se-rep-in{text-align:center;letter-spacing:.08em;text-transform:uppercase;font-size:clamp(1.1rem,5.6vw,1.4rem)}
.se-vue .se-ini{display:flex;gap:12px;align-items:center;margin:0}
.se-vue .se-ini .se-ini-c{width:64px;flex:none;padding:10px 0;text-align:center;text-transform:uppercase}
.se-vue .se-ini label{display:block;font-weight:800;font-size:.95rem;line-height:1.3}
.se-vue .se-ini small{display:block;font-size:.82rem;color:var(--soft);line-height:1.35;margin-top:2px}
/* la classe : grosses pastilles en relief, la choisie en vert plein */
.se-vue .se-pills{--rc:#58A93F;--rd:#3D7F2B;display:flex;flex-wrap:wrap;gap:14px 12px;margin:0;border-radius:20px}
.se-vue .se-pills button{flex:1 1 calc(33.333% - 12px);min-width:0;min-height:66px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:8px 6px;
  border:2px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);font:inherit;cursor:pointer;white-space:normal;overflow:visible;
  box-shadow:0 5px 0 var(--duo-ombre,var(--line));transition:transform .08s ease,box-shadow .08s ease;animation:lxIn .4s cubic-bezier(.2,1.2,.4,1) both;animation-delay:calc(.05s + var(--d,0)*.05s);-webkit-tap-highlight-color:transparent}
.se-pills button b{font-family:var(--display);font-weight:800;font-size:1.5rem;line-height:1}
.se-pills button small{font-size:.78rem;font-weight:800;line-height:1.1;color:var(--soft)}
.se-vue .se-pills button[aria-checked="true"]{background:linear-gradient(160deg,color-mix(in srgb,var(--rc) 88%,#fff),var(--rc));border-color:var(--rd);color:#fff;box-shadow:0 5px 0 var(--rd)}
.se-pills button[aria-checked="true"] b{text-shadow:0 2px 0 rgba(0,0,0,.14)}
.se-pills button[aria-checked="true"] small{color:#fff;opacity:.92}
.se-vue .se-pills button:active{transform:translateY(4px);box-shadow:0 1px 0 var(--duo-ombre,var(--line))}
.se-vue .se-pills button:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .se-vue .se-pills{--rc:#4E9A37;--rd:#2F6A22}}
:root[data-theme="dark"] .se-vue .se-pills{--rc:#4E9A37;--rd:#2F6A22}
/* « Valider » : gros bouton en relief, grisé tant que ce n'est pas prêt (il reste cliquable : il dit ce qui manque) */
.se-vue .btn{margin:0;width:100%;display:flex;align-items:center;justify-content:center;gap:8px;min-height:56px;font-size:1.12rem}
.se-vue .btn i{width:20px;height:20px;flex:none}
.se-vue .se-go:not(.pret){background:color-mix(in srgb,var(--line) 70%,var(--card));border-color:transparent;color:color-mix(in srgb,var(--ink) 50%,transparent);box-shadow:0 5px 0 var(--duo-ombre,var(--line))}
.se-vue .se-aide{margin:-8px 0 0;text-align:center;font-weight:700}
.se-vue .se-cl{margin:0}
.se-vue .se-rep-code{margin:0}
.se-vue .se-rep-warn{margin:0}
.se-vue .se-deux .btn{font-size:1rem}
/* la phrase qui rassure, petite, en bas de la fenêtre */
.se-pied{display:inline-flex;align-items:flex-start;gap:6px;font-size:.82rem;line-height:1.4;text-align:left}
.se-pied i{width:14px;height:14px;flex:none;margin-top:2px}
@media (prefers-reduced-motion:reduce){.se-vue,.se-vue .se-dit>.f,.se-vue .se-pills button,.se-case.ici:empty::after{animation:none!important}.se-case,.se-vue .se-pills button{transition:none}}

/* niveau trouvé par le code de classe : pré-choisi, marqué « ta classe » */
.se-pills button[data-trouve] .se-trouve{display:block;margin-top:2px;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.se-vue .se-pills button{flex-basis:calc(33.333% - 12px)}
.se-bloc .se-nivs{grid-template-columns:repeat(4,1fr)}

/* Ogrelo · mode invité (invite-eleve.js) : plein écran, mobile d'abord, mêmes couleurs que l'accueil (variables de grignon.css / connexion.css) */
body.ie-on{overflow:hidden}
.ie{position:fixed;inset:0;z-index:60;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--paper,#fffaf0);color:var(--ink,#1f2421)}
.ie-in{max-width:560px;margin:0 auto;padding:max(16px,env(safe-area-inset-top)) 16px calc(28px + env(safe-area-inset-bottom))}
.ie-dit{margin:6px 0 14px}
.ie-h{font-family:var(--display,inherit);font-size:1.45rem;line-height:1.2;margin:8px 0 14px}
.ie-pills{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(84px,100%),1fr));gap:10px}
.ie-pills button{min-height:56px;border:3px solid var(--line,#e5dfcf);border-radius:16px;background:var(--card,#fff);color:var(--ink,#1f2421);font:inherit;font-family:var(--display,inherit);font-weight:800;font-size:1.15rem;box-shadow:0 4px 0 var(--line,#e5dfcf);animation:ieIn .35s calc(var(--d,0)*40ms) both}
.ie-pills button[aria-checked="true"]{border-color:var(--ogre-d,#3E7F31);background:color-mix(in srgb,var(--ogre,#5aa33f) 16%,var(--card,#fff))}
.ie-pills button:active,.ie-mat:active,.ie-c:active,.ie-offre:active{transform:translateY(2px)}
.ie-mats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ie-mat{display:flex;align-items:center;gap:10px;min-height:64px;padding:10px 12px;border:3px solid var(--line,#e5dfcf);border-left:8px solid var(--c);border-radius:16px;background:var(--card,#fff);color:var(--ink,#1f2421);font:inherit;text-align:left;box-shadow:0 4px 0 var(--line,#e5dfcf);animation:ieIn .35s calc(var(--d,0)*35ms) both}
.ie-mat b{font-size:clamp(.82rem,3.6vw,1rem);line-height:1.2;min-width:0;overflow-wrap:anywhere;word-break:normal;hyphens:auto}
.ie-em{font-size:1.4rem;flex:none}
.ie-titre{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--ink-2,#5e6660);margin:0 0 8px;font-size:.95rem}
.ie-titre span{color:var(--ogre-d,#3E7F31)}
.ie-prog{height:10px;border-radius:99px;background:var(--line,#e5dfcf);overflow:hidden;margin:4px 0 10px}
.ie-prog i{display:block;height:100%;background:var(--ogre,#5aa33f);border-radius:99px;transition:width .3s}
.ie-num{margin:0;color:var(--ink-2,#5e6660);font-weight:700;font-size:.9rem}
.ie-enonce{font-size:1.2rem;line-height:1.35;margin:6px 0 14px}
.ie-choix{display:grid;gap:10px}
.ie-c{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 12px;border:3px solid var(--line,#e5dfcf);border-radius:16px;background:var(--card,#fff);color:var(--ink,#1f2421);font:inherit;font-size:1.05rem;text-align:left}
.ie-c.ok{border-color:var(--ok,#2e9d4b);background:var(--ok-bg,#e8f6ec)}
.ie-c.ko{border-color:var(--ko,#d1453b);background:var(--ko-bg,#fdecea)}
.ie-l{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--line,#e5dfcf);font-weight:800}
.ie-expl{margin-top:12px}
.ie-expl p{padding:10px 12px;border-radius:14px;margin:0 0 12px;line-height:1.4}
.ie-bien{background:var(--ok-bg,#e8f6ec)}.ie-oups{background:var(--ko-bg,#fdecea)}
.ie-go{width:100%;min-height:52px;font-size:1.05rem}
.ie-score{text-align:center;margin:10px 0 0}
.ie-score b{font-family:var(--display,inherit);font-size:2.2rem;color:var(--ogre-d,#3E7F31)}
.ie-score small{font-size:1.1rem;color:var(--ink-2,#5e6660)}
.ie-offres{display:grid;gap:10px;margin:12px 0}
.ie-offre{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px;border:3px solid var(--ogre,#5aa33f);border-radius:18px;background:var(--card,#fff);color:var(--ink,#1f2421);font:inherit;text-align:left;box-shadow:0 4px 0 color-mix(in srgb,var(--ogre,#5aa33f) 40%,transparent)}
.ie-offre>span:nth-child(2){flex:1;display:flex;flex-direction:column}
.ie-offre small{color:var(--ink-2,#5e6660);font-size:.88rem}
.ie-oi{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:1.3rem;background:color-mix(in srgb,var(--ogre,#5aa33f) 18%,var(--card,#fff))}
.ie-actions,.ie-deux{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}
.ie-actions .btn,.ie-deux .btn{flex:1 1 150px;min-height:48px}
.ie-pronote{display:flex;gap:12px;padding:12px;margin:14px 0;border:2px dashed var(--line,#e5dfcf);border-radius:18px;background:var(--card,#fff)}
.ie-pronote small{display:block;color:var(--ink-2,#5e6660);margin-top:2px}
.ie-note,.ie-rassure{color:var(--ink-2,#5e6660);font-size:.9rem;line-height:1.4}
.ie-rassure{margin-top:18px}
.ie-rappel{font-size:.92rem;margin:10px 0}
.ie-deja{text-align:center;margin-top:10px}
.ie-err{color:var(--ko-t,#b3261e);min-height:1.2em;font-weight:700}
.ie-lab{display:block;font-weight:800;margin:6px 0}
.ie-chips{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 10px}
.ie-ask{display:flex;gap:8px;align-items:flex-end}
.ie-ask textarea{flex:1;min-width:0;border:3px solid var(--line,#e5dfcf);border-radius:14px;padding:10px 12px;font:inherit;background:var(--card,#fff);color:var(--ink,#1f2421);resize:vertical}
.ie-ask .btn{min-width:52px;min-height:52px}
.ie-points{display:inline-flex;gap:4px}.ie-points i{width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.4;animation:iePt 1s infinite}
.ie-points i:nth-child(2){animation-delay:.15s}.ie-points i:nth-child(3){animation-delay:.3s}
@keyframes iePt{50%{opacity:1}}
@keyframes ieIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ie *{animation:none!important;transition:none!important}}
/* entrée, diagnostic, fiche, « Garde tes progrès » */
.ie-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.ie-logo{font-family:var(--display,inherit);font-size:1.3rem;color:var(--ogre-d,#3E7F31)}
.ie-lg{display:flex;gap:4px}.ie-lg button{min-width:44px;min-height:36px;border:2px solid var(--line,#e5dfcf);border-radius:10px;background:var(--card,#fff);color:var(--ink,#1f2421);font:inherit;font-weight:800}
.ie-lg button.on{border-color:var(--ogre-d,#3E7F31)}
.ie-pills button.on{border-color:var(--ogre-d,#3E7F31);background:color-mix(in srgb,var(--ogre,#5aa33f) 16%,var(--card,#fff))}
.ie-sous{text-align:center;color:var(--ink-2,#5e6660);font-weight:700;margin:12px 0 0}
.ie-pied{margin-top:28px;text-align:center;font-size:.85rem;color:var(--ink-2,#5e6660);display:grid;gap:8px}
.ie-pied a{color:inherit}
.ie-ret{margin-bottom:4px}
.ie-mat.ie-charge{opacity:.6}
.ie-fiche{margin:12px 0;padding:12px;border:3px solid var(--line,#e5dfcf);border-radius:18px;background:var(--card,#fff)}
.ie-fiche-h{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.ie-fiche-h h2{font-size:1.1rem;margin:0}
.ie-ecoute[aria-pressed="true"]{border-color:var(--ogre-d,#3E7F31)}
.ie-blocs .blk{margin:10px 0}
.ie-blocs .tbl{overflow-x:auto}
.ie-garde{display:grid;gap:10px;margin:12px 0}
.ie-reco{border-width:3px;border-color:var(--ogre-d,#3E7F31);position:relative}
.ie-badge{font-style:normal;font-size:.75rem;font-weight:800;padding:3px 8px;border-radius:99px;background:var(--ogre-d,#3E7F31);color:#fff;flex:none}
.ie-plustard{text-align:center;margin:8px 0}
.ie-plustard .linkbtn2{min-height:44px;font-size:1rem}
.ie-attente{padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--ogre,#5aa33f) 12%,var(--card,#fff));font-size:.92rem}
.ie-lienbrut{word-break:break-all;font-size:.85rem;padding:8px;border:2px dashed var(--line,#e5dfcf);border-radius:12px}
.ie-acc{margin-top:8px}
.ie-feuille-fond{position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.35);display:flex;align-items:flex-end;justify-content:center}
.ie-feuille{position:relative;width:100%;max-width:560px;background:var(--paper,#fffaf0);color:var(--ink,#1f2421);border-radius:22px 22px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));animation:ieUp .25s both}
.ie-feuille h2{margin:0 0 4px;font-family:var(--display,inherit)}
.ie-fx{position:absolute;top:10px;right:10px;width:44px;height:44px;border:0;border-radius:50%;background:var(--card,#fff)}
.ie-liste{display:grid;gap:10px;margin-top:12px}
.ie-liste button{display:flex;flex-direction:column;align-items:flex-start;min-height:56px;padding:10px 14px;border:3px solid var(--line,#e5dfcf);border-radius:16px;background:var(--card,#fff);color:var(--ink,#1f2421);font:inherit;text-align:left}
.ie-liste small{color:var(--ink-2,#5e6660)}
@keyframes ieUp{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
.ie-ent-val{margin:0 0 10px}
.ie-ent-mention{font-size:.78rem;color:var(--ink-2,#5e6660);margin:14px 0 4px;text-align:center}
/* mode focus : aucune barre d'onglets ni bandeau tant que l'élève n'a pas joué (arrivées directes ?depart=) */
body.ie-focus .h-nav,body.ie-focus .h-nav-in,body.ie-focus #ogBandeau{display:none!important}
.ie-deja-haut{font-size:.95rem;min-height:44px}
.ie-decouvrir{text-align:center;margin:18px 0 0;font-size:.9rem;opacity:.85}
/* aucune tuile ne déborde, de 320 px à la tablette : colonnes qui peuvent rétrécir, texte sur 2 lignes au besoin, coupures (lang fr / en) */
.ie,.ie-in{overflow-x:hidden}
.ie-mat{min-width:0;text-align:left}
.ie-pills button{min-width:0;padding:0 4px;font-size:clamp(.95rem,4.2vw,1.15rem);overflow-wrap:anywhere;hyphens:auto}
.ie-offre,.ie-offre>span,.ie-liste button,.ie-c,.ie-c>span{min-width:0;overflow-wrap:anywhere;hyphens:auto}
.ie-actions .btn,.ie-deux .btn{min-width:0;white-space:normal}
.ie-toutes{grid-column:1/-1;min-height:48px;border:2px dashed var(--line,#e5dfcf);border-radius:16px;background:transparent;color:var(--ink,#1f2421);font:inherit;font-weight:700}
@media (max-width:340px){.ie-mat{flex-direction:column;align-items:flex-start;gap:4px;padding:8px 10px}}
@media (min-width:700px){.ie-mats{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* partie entre amis (partie-ami.js) */
.pa-partager{font-size:1.15rem;min-height:58px}
.pa-qr{display:grid;justify-items:center;gap:6px;margin:8px 0}.pa-qr svg{width:220px;height:220px}
.pa-joueurs{list-style:none;padding:0;margin:0 0 6px;display:grid;gap:6px}.pa-joueurs li{padding:8px 12px;border-radius:12px;background:var(--card,#fff);border:2px solid var(--line,#e5dfcf)}
.pa-joueurs li.moi,.pa-podium li.moi{border-color:var(--ogre-d,#3E7F31)}
.pa-temps{height:8px;border-radius:99px;background:var(--line,#e5dfcf);overflow:hidden;margin:6px 0}.pa-temps i{display:block;height:100%;background:#e8a317;width:100%}
.pa-rebours{display:grid;place-items:center;min-height:50vh}.pa-rebours b{font-size:5rem;font-family:var(--display,inherit);color:var(--ogre-d,#3E7F31)}
.pa-podium{list-style:none;padding:0;margin:10px 0;display:grid;gap:6px}.pa-podium li{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:var(--card,#fff);border:2px solid var(--line,#e5dfcf)}
.pa-podium li b{flex:1}.pa-rang{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--line,#e5dfcf);font-weight:800}
.pa-podium li:nth-child(1) .pa-rang{background:#f4c430}.pa-podium li:nth-child(2) .pa-rang{background:#c9ced6}.pa-podium li:nth-child(3) .pa-rang{background:#d9a066}
.pa-av{width:30px;height:30px;flex:none}.pa-av svg{width:30px;height:30px}
.pa-podium li.bot{background:color-mix(in srgb,var(--ogre,#5aa33f) 8%,var(--card,#fff))}
.pa-reac{margin:4px 0;font-size:.92rem}
.pa-local{margin:10px 0}.pa-local summary{font-weight:700;cursor:pointer;min-height:44px;display:flex;align-items:center}
/* plus de démo élève : l'élève passe par le mode invité (?profils reste ouvert, pour les présentations) */
#pDemo,#rDemo-eleve,.demo-z{display:none!important}
.pa-erreurs{margin:10px 0;padding:10px 12px;border-radius:14px;background:var(--card,#fff);border:2px solid var(--line,#e5dfcf)}
.pa-erreurs summary{font-weight:700;min-height:40px;display:flex;align-items:center;cursor:pointer}
.pa-erreurs ul{margin:6px 0 0;padding-left:18px;display:grid;gap:8px}.pa-erreurs li b{color:var(--ok-t,#1e7a34)}.pa-erreurs li small{display:block;color:var(--ink-2,#5e6660)}
.pa-cours{width:100%;margin:10px 0}
.fe-moi .fe-liste{list-style:none;padding:0;margin:6px 0;display:grid;gap:6px}.fe-moi .fe-liste li{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;align-items:center}
.fe-go{width:100%;min-height:52px;margin-top:8px}.fe-btns{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}.fe-btns .btn{flex:1 1 140px;min-height:48px;text-align:center}
.fe-code-t{font-weight:700;margin:12px 0 4px}.fe-code{font-size:clamp(2.2rem,12vw,3.4rem);font-weight:800;letter-spacing:.15em;text-align:center;margin:6px 0;font-family:var(--display,inherit)}
/* l'appli complète en invité : onglets atténués, bande « Un quiz / Garde tes progrès » */
body.ie-appli .h-nav{opacity:.78}
.ie-bande{position:fixed;left:8px;right:8px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:55;display:flex;gap:8px;padding:8px;border-radius:16px;background:var(--card,#fff);box-shadow:0 6px 18px rgba(0,0,0,.18)}
.ie-bande .btn{flex:1 1 0;min-width:0;min-height:44px;white-space:normal}

/* « Que veux-tu faire ? » (scénario Q) */
.ie-q .ie-offre{min-height:78px}
.ie-plus-tard{display:block;margin:14px auto 0;min-height:44px;font-weight:700}

/* bloc collant du mode invité : fermeture (×), pastille « Quiz ⌃ », marge basse pour ne jamais masquer la fiche */
.ie-bande{padding-right:52px}
.ie-bande[hidden],.ie-pastille[hidden]{display:none!important}
.ie-bx{position:absolute;top:50%;right:4px;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:12px;background:transparent;color:var(--ink-2,#555);font-size:1.6rem;line-height:1;cursor:pointer}
.ie-bx:focus-visible,.ie-pastille:focus-visible{outline:3px solid var(--ogre,#5aa33f);outline-offset:2px}
.ie-pastille{position:fixed;right:10px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:55;display:flex;align-items:center;gap:6px;min-height:44px;padding:4px 14px 4px 4px;border:2px solid var(--ogre,#5aa33f);border-radius:999px;background:var(--card,#fff);color:var(--ink,#1f2421);font:inherit;font-weight:800;font-size:.9rem;box-shadow:0 4px 12px rgba(0,0,0,.16);cursor:pointer}
.ie-pf{display:inline-flex;width:34px;height:34px}.ie-pf svg{width:100%;height:100%}
body.ie-appli{padding-bottom:calc(var(--ie-bande-h,140px) + env(safe-area-inset-bottom))}
body.ie-appli .ie-pad{padding-bottom:calc(var(--ie-bande-h,140px) + 76px + env(safe-area-inset-bottom))!important}

/* correctif : jamais pendant un quiz ; rien ne passe sous le bloc sur les fiches */
body.ie-quiz .ie-bande,body.ie-quiz .ie-pastille{display:none!important}
/* entrée : Pronote et École Directe, à égalité, visibles dès l'arrivée */
.ie-deja-ent{display:grid;grid-template-columns:auto 1fr 1fr;align-items:center;gap:8px;margin:0 0 10px;font-weight:800;font-size:.86rem}
.ie-deja-ent button{min-height:44px;margin:0;padding:4px 6px;border:2px solid var(--line,#e5dfcf);border-radius:14px;background:var(--card,#fff);color:var(--ink,#222);font:inherit;font-weight:800;box-shadow:0 3px 0 var(--line,#e5dfcf);cursor:pointer}
/* écrans de connexion : la bande « Un quiz / Garde tes progrès » ne couvre jamais Scanner, Importer ni les formulaires */
body:has(#pChoix,#pQrZone,#pEd,#ceMail,#seRep) .ie-bande,body:has(#pChoix,#pQrZone,#pEd,#ceMail,#seRep) .ie-pastille{display:none!important}
body.ie-appli:not(.ie-quiz){padding-bottom:calc(var(--ie-bande-h,150px) + env(safe-area-inset-bottom))}
body.ie-appli:not(.ie-quiz) .ie-pad{padding-bottom:calc(var(--ie-bande-h,150px) + env(safe-area-inset-bottom))!important}

/* « Viens réviser avec la famille Grignon » : l'illustration de la famille en tête de l'entrée */
.ie-famille{display:block;width:100%;max-height:200px;object-fit:cover;object-position:50% 40%;border-radius:20px;margin:4px 0 10px}
body.ie-focus .ie-famille{max-height:150px}
/* quiz en direct (30/10) : lancement, rebours, classement */
.pa-lancer{font-size:1.15rem;position:static;width:100%;margin:8px 0 0}.pa-lancer[hidden]{display:none}.pa-place-lancer{height:0}.pa-lancer:disabled{opacity:1;background:#c4cdbd;color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.pa-rebours{grid-auto-rows:min-content;align-content:center;gap:8px}.pa-rebours small{font-size:1.05rem;color:var(--muted,#6b6b6b)}
.pa-absent{opacity:.5}.pa-gain{font-weight:800;color:var(--ogre-d,#3E7F31)}.pa-recu{text-align:center;min-height:1.4em}
.pa-hote-note{margin:6px 0;padding:8px 12px;border-radius:12px;background:var(--line,#e5dfcf);font-weight:700;text-align:center}
#paDirectC .pa-podium{margin-top:6px}
/* quiz : croix, durée de question, salle des Grignons, podium entre deux questions */
.pa-x{flex:none;width:32px;height:32px;border:0;border-radius:50%;display:grid;place-items:center;background:#E8574F;color:#fff;cursor:pointer}.pa-x i{width:16px;height:16px;font-size:16px}
.pa-duree{flex:none;margin:18px 0}.pa-duree .h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 0 8px}.pa-duree span{font-weight:700}.pa-duree b{font-family:var(--display);font-size:1.25rem;color:var(--ogre-d,#3E7F31)}
.pa-duree input{display:block;box-sizing:border-box;width:100%;height:32px;margin:0;accent-color:var(--ogre-d,#3E7F31);cursor:pointer}
.pa-gr li{display:flex;align-items:center;gap:12px;opacity:.45;transition:opacity .3s}.pa-gr li.on{opacity:1;border-color:var(--ogre-d,#3E7F31)}.pa-gr li b{flex:1}.pa-gr li small{color:var(--soft)}.pa-gr li.on small{color:var(--ogre-d,#3E7F31);font-weight:800}
.pa-gr-t{flex:none;width:44px;height:44px;display:block;overflow:hidden;border-radius:50%}.pa-gr-t img,.pa-gr-t svg{width:100%;height:100%;display:block}
.pa-pod3{display:flex;align-items:flex-end;justify-content:center;gap:6px;margin:14px 0}.pa-pod3 .m{flex:1 1 0;min-width:0;text-align:center}.pa-pod3 b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pa-pod3 small{display:block;margin-bottom:6px;color:var(--soft)}
.pa-pod3 span{display:grid;place-items:center;border-radius:12px 12px 0 0;font-family:var(--display);font-size:1.5rem;font-weight:800;color:#1f2421}.pa-pod3 .m1 span{height:96px;background:#f4c430}.pa-pod3 .m2 span{height:70px;background:#c9ced6}.pa-pod3 .m3 span{height:52px;background:#d9a066}.pa-pod3 .moi b{color:var(--ogre-d,#3E7F31)}
/* Revoir mes erreurs : une carte par erreur, la question, la bonne réponse, l'explication lisible */
html body .pa-erreurs{padding:14px}.pa-erreurs summary{font-family:var(--display);font-size:1.05rem}
html body .pa-erreurs ul{list-style:none;margin:10px 0 0;padding:0;gap:10px}
.pa-erreurs li{padding:12px 14px;border-radius:14px;background:var(--paper,var(--sheet));border:1.5px solid var(--line,#e5dfcf)}
.pa-erreurs li p{margin:0;line-height:1.4}.pa-erreurs li .q{font-weight:700}
.pa-erreurs li .r{display:flex;gap:8px;align-items:center;margin-top:8px;font-weight:800;color:var(--t-good,#1e7a34)}.pa-erreurs li .r i{flex:none}
.pa-erreurs li .e{margin-top:6px;font-size:.92rem;color:var(--ink);opacity:.85}
.pa-erreurs .katex-display{display:inline-block;margin:0 4px;vertical-align:middle}.pa-erreurs .katex-display>.katex{display:inline-block}
#paSuiv{position:sticky;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:2}
/* la bulle de Grignon respire sous l en-tête */
html body #paZ .ie-top+.og-dit,html body #paZ .ie-top+#paGrDit{margin-top:28px}
.pa-bonne{margin:14px 0 8px;font-size:1.02rem}
.pa-pod3 b{white-space:normal;line-height:1.15;overflow-wrap:anywhere}
/* plus d'air sous l'en-tête du quiz */
html body #paZ .ie-top+*{margin-top:24px}
/* mode présentation : réglage au salon, écran large pour le vidéoprojecteur */
.pa-proj{display:flex;align-items:center;gap:12px;margin:0 0 14px;padding:12px 14px;border:2px solid var(--line,#e5dfcf);border-radius:16px;background:var(--card,#fff);cursor:pointer}.pa-proj input{flex:none;width:24px;height:24px;accent-color:var(--ogre-d,#3E7F31)}.pa-proj b{display:block}.pa-proj small{display:block;color:var(--soft)}
#paZ.pa-projette .ie-in{max-width:1100px}#paZ.pa-projette .qp-pts{display:none}
@media (min-width:800px){#paZ.pa-projette .qp-question h2{font-size:clamp(1.8rem,3.4vw,3.2rem);line-height:1.2}#paZ.pa-projette .qp-opt{font-size:clamp(1.2rem,2vw,1.8rem);min-height:84px}#paZ.pa-projette .ie-choix{display:grid;grid-template-columns:1fr 1fr;gap:14px}#paZ.pa-projette .pa-recu{font-size:1.5rem}}
#paZ.pa-projette #paDirectC .ie-note{color:var(--ink);opacity:.85}#paZ.pa-projette .pa-recu{color:var(--ink);font-weight:700}
.fg-img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
/* mascottes : rangée qui défile, portrait à côté du pseudo */


.pa-mf{display:block;width:100%;height:100%;object-fit:cover}.pa-mi{display:inline-block;flex:none;width:32px;height:32px;border-radius:50%;object-fit:cover;vertical-align:middle;overflow:hidden;background:var(--card,#fff)}.pa-mi img,.pa-mi svg{display:block;width:100%;height:100%;object-fit:cover}
.pa-pod3 .pa-mi{display:block;margin:0 auto 4px;width:40px;height:40px}.pa-podium li .pa-mi{margin-right:2px}
.pa-mi{width:50px;height:50px}.pa-pod3 .pa-mi{width:64px;height:64px}.pa-mf,.pa-mi{object-position:50% 12%}
/* mon Grignon : le bloc de l'écran du pseudo, puis la page de choix */
.pa-mbloc{display:flex;align-items:center;gap:14px;margin:12px 0 10px}.pa-mb-img{flex:none;width:92px;height:92px;border-radius:50%;overflow:hidden;border:3px solid var(--ogre-d,#3E7F31);background:color-mix(in srgb,var(--ogre,#6DBE58) 14%,var(--card,#fff))}.pa-mb-go{flex:1;min-height:52px;min-width:0}
.pa-grille{position:fixed;inset:0;z-index:9000;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--bg,var(--sheet,#fff));color:var(--ink,inherit);padding:calc(12px + env(safe-area-inset-top,0)) 16px calc(48px + env(safe-area-inset-bottom,0));box-sizing:border-box}
.pa-gt{display:flex;align-items:center;gap:10px;margin:0 0 14px}.pa-gt h2{margin:0;font-size:1.3rem;line-height:1.2}.pa-gret{flex:none;width:44px;height:44px;border:0;border-radius:50%;display:grid;place-items:center;background:var(--card,#fff);color:inherit;box-shadow:0 2px 0 var(--line,#e5dfd0);cursor:pointer}.pa-gmsg{margin:0 0 12px;font-weight:700}
.pa-gg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:480px;margin:0 auto}.pa-gc{position:relative;aspect-ratio:1;padding:0;border-radius:50%;overflow:hidden;border:3px solid var(--line,#e5dfd0);background:color-mix(in srgb,var(--ogre,#6DBE58) 14%,var(--card,#fff));cursor:pointer}.pa-gc.on{border-color:var(--ogre-d,#3E7F31);box-shadow:0 0 0 3px var(--ogre-d,#3E7F31)}
.pa-gl{display:none;position:absolute;inset:0;place-items:center;background:rgba(0,0,0,.28);color:#fff;font-size:1.5rem}.pa-gc.pris{cursor:not-allowed;box-shadow:none}.pa-gc.pris img{filter:grayscale(1);opacity:.5}.pa-gc.pris .pa-gl{display:grid}
.pa-og{position:relative;display:block;overflow:hidden;border-radius:50%}.pa-mi.pa-og{display:inline-block}.pa-og img,.pa-mi.pa-og img{position:absolute;display:block;max-width:none;height:auto;object-fit:fill}
.pa-og-bebe img,.pa-mi.pa-og-bebe img{width:195%;height:195%;left:-47.5%;top:-94.7%}.pa-og-apprenti img,.pa-mi.pa-og-apprenti img{width:155%;height:155%;left:-27.5%;top:-51.7%}
.pa-mbloc{flex-direction:column;gap:10px;margin:14px 0 12px;text-align:center}.pa-mb-img{width:148px;height:148px;border:5px solid #F5C33B;box-shadow:0 4px 0 rgba(0,0,0,.14);box-sizing:border-box}.pa-mb-nom{font-size:1.2rem;line-height:1.2}.pa-mb-go{flex:none;width:100%}
.pa-gc.on{border:5px solid #F5C33B;box-shadow:0 0 0 2px rgba(245,195,59,.35)}
.pa-illu{margin:0 -16px 12px;height:30dvh;min-height:190px;max-height:280px;overflow:hidden}.pa-illu img{width:100%;height:100%;object-fit:cover;object-position:50% 38%;display:block}
.pa-ps{display:block;width:100%;text-align:left;font-weight:700}.pa-ps span{display:block;margin:2px 0 4px}.pa-ps-i{width:100%;box-sizing:border-box;font-size:max(16px,1rem)}
.gr-pseudo .pa-mbloc,.rx .pa-mbloc{display:grid;grid-template-columns:112px 1fr;grid-template-rows:auto auto;gap:8px 14px;align-items:center;margin:0 0 16px}.rx .pa-mb-img{grid-row:1/3;grid-column:1;width:112px;height:112px}.rx .pa-ps{grid-column:2;grid-row:1;margin:0}.rx .pa-mb-go{grid-column:2;grid-row:2;min-height:44px;padding:6px 10px;font-size:.92rem;width:100%}
.pa-sans-nom{justify-content:flex-end}
.pa-mbloc{display:grid;grid-template-columns:116px 1fr;grid-template-rows:auto auto;gap:4px 14px;align-items:center;margin:0 0 16px}.rx .pa-mbloc{gap:4px 14px}.pa-mbloc .pa-mb-img{grid-column:1;grid-row:1;width:112px;height:112px;padding:0;background:none;cursor:pointer}.pa-mbloc .pa-mb-go,.rx .pa-mb-go{grid-column:1;grid-row:2;min-height:30px;width:100%;padding:0;border:0;background:none;box-shadow:none;color:var(--soft,#6b7280);font:inherit;font-size:.88rem;font-weight:800;text-align:center;cursor:pointer}.pa-mbloc .pa-ps,.rx .pa-ps{grid-column:2;grid-row:1/3;margin:0}

/* les langues du monde (partie-langue.js) */
.pa-img{display:block;width:min(132px,36vw);aspect-ratio:1;object-fit:contain;margin:8px auto 4px;border-radius:14px;background:#fff}
.pa-son{display:flex;gap:8px;justify-content:center;margin:8px 0 2px}
.pa-play{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 22px;border:0;border-radius:24px;background:var(--ogre-d,#3E7F31);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.pa-lent{width:48px;height:48px;border-radius:50%;border:2px solid var(--line,#dcdcdc);background:transparent;color:inherit;cursor:pointer}
.pa-play.pa-pulse{animation:pa-pulse 1s ease-in-out infinite}@keyframes pa-pulse{50%{transform:scale(1.07)}}
@media (prefers-reduced-motion:reduce){.pa-play.pa-pulse{animation:none;outline:3px solid #f4c430}}
.pa-lis{text-align:center;margin:6px 0}.pa-lis p{margin:0;font-weight:700;font-size:1.1rem}.pa-re{font-size:.8rem;opacity:.75}
.pa-doc{max-height:190px;overflow:auto;padding:10px 12px;margin:8px 0;border-radius:12px;background:color-mix(in srgb,var(--ink,#222) 6%,transparent);font-size:.92rem;text-align:start;font-weight:400}
.ie-choix.pa-imgs .qp-choix{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ie-choix.pa-imgs .qp-opt{position:relative;padding:6px;min-width:0;justify-content:center}
.ie-choix.pa-imgs .qp-opt .qp-l{position:absolute;top:6px;left:6px;z-index:1}
.ie-choix.pa-imgs .qp-opt>span:last-child{display:block;width:100%}
.ie-choix.pa-imgs img{display:block;width:100%;max-height:min(21dvh,150px);aspect-ratio:1;object-fit:contain;border-radius:10px;background:#fff}
.pa-seq{display:grid;gap:12px;margin-top:10px}
.pa-seq-r{min-height:52px;display:flex;flex-wrap:wrap;gap:6px;padding:8px;border-radius:12px;border:2px dashed var(--line,#cfcfcf)}
.pa-seq-d{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.pa-seq button[data-k],.pa-seq button[data-r]{min-height:44px;min-width:44px;padding:0 12px;border-radius:12px;border:2px solid var(--line,#cfcfcf);background:var(--card,#fff);color:inherit;font:inherit;font-weight:700;cursor:pointer}
.pa-oral{padding:4px 0}.pa-oral-note{text-align:center}.pa-pied{text-align:center;margin:10px 0 0}
.pa-mots .ok{color:var(--ogre-d,#3E7F31);font-weight:700}.pa-mots mark{background:#ffe0dc;color:#a12a1c;border-radius:4px;padding:0 2px}
.pa-prog{display:grid;gap:2px;justify-items:center;text-align:center;margin:10px 0;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--ogre-d,#3E7F31) 12%,transparent)}.pa-prog small{opacity:.8}
.pa-err-img{float:right;width:56px;height:56px;object-fit:contain;border-radius:8px;background:#fff;margin-left:8px}
.pa-err-son{float:right;width:40px;height:40px;border-radius:50%;border:0;background:var(--ogre-d,#3E7F31);color:#fff;margin-left:8px;cursor:pointer}
/* lire la fiche ou le cours en salle d'attente (partie-ami.js) : un lien discret, puis un écran de lecture seule */
.pa-lire-b{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 4px;margin:0 0 6px;border:0;background:none;color:var(--ogre-d,#3E7F31);font:inherit;font-weight:700;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.pa-lire{position:fixed;inset:0;z-index:65;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;background:var(--paper,#fffaf0);color:var(--ink,#1f2421)}
.pa-lire-h{position:sticky;top:0;z-index:1;padding:max(10px,env(safe-area-inset-top)) 16px 10px;background:var(--paper,#fffaf0);border-bottom:2px solid var(--line,#e5dfcf)}.pa-lire-h .btn{width:auto;min-height:44px;margin:0}
.pa-lire-c{max-width:560px;margin:0 auto;padding:6px 16px calc(28px + env(safe-area-inset-bottom));line-height:1.5;overflow-wrap:anywhere}.pa-lire-c h2{margin:14px 0 8px;font-size:1.25rem}.pa-lire-c h3{margin:0 0 6px;font-size:1.02rem}.pa-lire-c p{margin:0 0 10px}.pa-lire-c ul,.pa-lire-c ol{margin:0 0 6px;padding-left:20px}.pa-lire-c li{margin-bottom:4px}
.pa-lire-bl{margin:0 0 12px;padding:12px;border-radius:12px;background:var(--card,#fff);border:2px solid var(--line,#e5dfcf)}.pa-lire-bl.retiens{border-color:var(--ogre-d,#3E7F31)}.pa-lire-bl p:last-child{margin-bottom:0}.pa-lire-bl dt{font-weight:700}.pa-lire-bl dd{margin:0 0 8px}
.pa-lire-tb{overflow-x:auto}.pa-lire-tb table{border-collapse:collapse;width:100%}.pa-lire-tb th,.pa-lire-tb td{padding:6px 8px;border:1px solid var(--line,#e5dfcf);text-align:left;vertical-align:top}

/* Ogrelo · connexion par lien e-mail (compte-email.js) : s'appuie sur les styles du mode invité (invite-eleve.css) et des comptes sans ENT (sans-ent.css). */
.ce .ie-h{margin:10px 0 6px}
.ce-ou{display:flex;align-items:center;gap:10px;margin:18px 0 10px;color:var(--ink-2,#5e6660);font-weight:800;text-transform:uppercase;font-size:.8rem;letter-spacing:.06em}
.ce-ou::before,.ce-ou::after{content:"";flex:1;border-top:2px solid var(--line,#e5dfcf)}
.ce-sec .ie-offre{min-height:58px;border-color:var(--line,#e5dfcf);box-shadow:0 4px 0 var(--line,#e5dfcf)}
.ce-reprise .linkbtn2{font-size:.9rem;color:var(--ink-2,#5e6660)}
.ce-15{display:flex;align-items:flex-start;gap:10px;margin:12px 0 4px;padding:12px;border:2px solid var(--line,#e5dfcf);border-radius:16px;background:var(--card,#fff);font-weight:700;cursor:pointer;min-height:44px}
.ce-15 input{width:24px;height:24px;flex:0 0 auto;margin:0;accent-color:var(--ogre,#5aa33f)}
.ce-enveloppe{width:84px;height:84px;margin:6px auto 10px;border-radius:24px;display:grid;place-items:center;background:color-mix(in srgb,var(--ogre,#5aa33f) 16%,var(--card,#fff));border:3px solid var(--ogre,#5aa33f);box-shadow:0 5px 0 var(--ogre-d,#3E7F31);font-size:2.2rem;color:var(--ogre-d,#3E7F31);animation:ce-hop .6s ease-out}
@keyframes ce-hop{0%{transform:translateY(12px) scale(.9);opacity:0}70%{transform:translateY(-4px)}100%{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.ce-enveloppe{animation:none}}
.ce-conseils{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:8px}
.ce-conseils li{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:14px;background:var(--card,#fff);border:2px solid var(--line,#e5dfcf);line-height:1.35}
.ce-conseils i{color:var(--ogre-d,#3E7F31);margin-top:2px}
.ce .ie-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.ce .ie-actions .btn{flex:1 1 160px;min-height:48px}
/* rappel dans l'appli : discret (une ligne), puis plus visible ; jamais bloquant */
.ce-rappel{position:fixed;left:12px;right:12px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:40;max-width:536px;margin:0 auto;display:flex;align-items:center;gap:10px;padding:10px 40px 10px 14px;border-radius:18px;background:var(--card,#fff);color:var(--ink,#1f2421);border:2px solid var(--line,#e5dfcf);box-shadow:0 6px 18px rgba(0,0,0,.12);font-size:.95rem;animation:ce-hop .4s ease-out}
.ce-rappel .btn{min-height:40px;padding:6px 14px;flex:0 0 auto}
.ce-r-tx{flex:1;line-height:1.3}
.ce-r-tx small{display:block;color:var(--ink-2,#5e6660);margin-top:2px}
.ce-r-f{width:44px;height:44px;flex:0 0 auto}
.ce-r-f svg{width:100%;height:100%}
.ce-rappel.fort{border:3px solid var(--ogre,#5aa33f);box-shadow:0 5px 0 var(--ogre-d,#3E7F31),0 8px 22px rgba(0,0,0,.14)}
.ce-r-x{position:absolute;top:4px;right:4px;width:36px;height:36px;border:0;background:none;color:var(--ink-2,#5e6660);font-size:1.4rem;line-height:1;cursor:pointer;border-radius:50%}
@media (max-width:420px){.ce-rappel{flex-wrap:wrap}.ce-rappel .btn{width:100%}}
/* Profil : Mon compte, Sources de données */
.ce-moi h3{display:flex;align-items:center;gap:8px}
.ce-ligne{display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:space-between}
.ce-ligne p{margin:0;flex:1 1 220px;line-height:1.4}
.ce-ligne small{color:var(--ink-2,#5e6660)}
.ce-sans{color:var(--ko-t,#b3261e);font-weight:700}
.ce-src-t{margin-top:18px}
.ce-src{display:grid;gap:8px}
.ce-s{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;border-radius:16px;border:2px solid var(--line,#e5dfcf);background:var(--card,#fff)}
.ce-s.on{border-color:var(--ogre,#5aa33f)}
.ce-s-n{flex:1 1 160px;display:flex;flex-direction:column}
.ce-s-n small{color:var(--ink-2,#5e6660)}
.ce-s .btn{min-height:40px;padding:6px 14px}
.ce-s .linkbtn2{min-height:40px}

/* entrée sans étape : état de connexion et annonce dans la page (compte-email.js decor) */
.ce-etat{display:flex;align-items:center;gap:6px;margin:0 0 8px;font-size:.9rem;font-weight:600;color:var(--ogre-d,#3E7F31)}
.ce-etat.invite{color:var(--soft,#5e6660)}
.ie .ce-etat{margin:6px 0 2px}
.ce-liens{display:flex;flex-direction:column;gap:6px;align-items:center}
.ce-3{display:grid;grid-auto-rows:1fr}.ce-3 .ie-offre{min-height:68px}

/* écran unique de connexion : le champ e-mail reste visible sans défiler sur un téléphone */
html body .ce-illu{max-height:none;height:28dvh;min-height:210px;aspect-ratio:auto;object-fit:cover;object-position:58% 50%;margin-bottom:8px}
html body .ce-phrase{margin-bottom:8px}
.ce-3 .ie-offre{min-height:58px}
.ce-3+.ce-ou{margin:10px 0 6px}
#ceMailZ .ie-lab{margin-top:0}
#ceEtatCo:empty,#ceMailZ~.ie-err:empty{display:none}
#ceMailZ #ceGo{margin-top:12px}
.ce-sans-ent{margin:10px 0 0;text-align:center;font-size:.86rem;line-height:1.35;color:var(--soft,#6b7069)}
.ce-nl{margin-top:16px}.ce-np{margin-bottom:12px}
.ce-np button[aria-pressed="true"]{background:var(--ogre,#5BA84A);border-color:var(--ogre-d,#3E7F31);color:#fff}
/* image d entrée : bord à bord sur téléphone, sans arrondi */
html body .ce-illu{border-radius:0;border:0;box-shadow:none}
/* entrée : bandeau de couleur en haut, image collée au bandeau et aux bords, accroche sur un voile clair posé sur la photo */
html body .ce-tete{position:relative;z-index:2;height:56px;box-sizing:border-box;margin:-16px -16px -56px;padding:10px 16px;background:none}
html body .ce-tete .ie-logo{text-shadow:0 1px 4px rgba(0,0,0,.6)}
.ce-hero::before{content:"";position:absolute;left:0;right:0;top:0;height:76px;background:linear-gradient(rgba(0,0,0,.5),transparent);pointer-events:none}
html body .ce-tete .ie-logo{color:#fff}
html body .ce-tete .ce-lg{display:flex;gap:2px;padding:3px;border-radius:12px;background:rgba(0,0,0,.28);border:1.5px solid rgba(255,255,255,.35)}
html body .ce-tete .ce-lg button{min-width:36px;min-height:0;padding:7px 10px;border:0;border-radius:9px;background:none;color:#fff;opacity:.85;font-size:.8rem;line-height:1;font-weight:800}
html body .ce-tete .ce-lg button.on{background:#fff;color:var(--ogre-d,#3E7F31);opacity:1}
.ce-hero{position:relative;margin:0 -16px 12px;line-height:0}
.ie-in:has(.ce-hero){padding-top:16px}
.ie-in:has(.ce-hero){min-height:100dvh;box-sizing:border-box;display:flex;flex-direction:column}
.ie-in:has(.ce-hero)>.ce-legal{margin-top:auto;padding-top:20px;padding-bottom:env(safe-area-inset-bottom,0px)}
html body .ce-hero .ce-illu{display:block;width:100%;max-width:100%;margin:0;padding:0}
html body .ce-hero .ce-phrase{position:absolute;left:0;right:0;bottom:0;margin:0;padding:7px 12px;line-height:1.25;font-size:1rem;text-align:center;color:#fff;background:rgba(0,0,0,.45)}
.ce-soir{display:none!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ce-jour{display:none!important}:root:not([data-theme="light"]) .ce-soir{display:block!important}}
:root[data-theme="dark"] .ce-jour{display:none!important}:root[data-theme="dark"] .ce-soir{display:block!important}
.ie-oi.ce-logo{background:#fff;overflow:hidden}.ie-oi.ce-logo img{width:34px;height:34px;object-fit:contain;display:block}
.ce-auto{display:flex;align-items:center;gap:12px;margin:18px 0 6px;font-weight:700;cursor:pointer}.ce-auto input{flex:none;width:24px;height:24px;accent-color:var(--ogre-d,#3E7F31)}
/* écran « Ton compte » avant le scan : titre avec flèche retour, explication en bulle courte */
.ce-titre-p{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.ce-titre-p .ie-ret{position:static;margin:0}
.ce-titre-p h1{flex:1;min-width:0;margin:0;font-family:var(--display,inherit);font-size:1.4rem;line-height:1.2;color:var(--ink)}
.ce-bref .og-dit{margin:0 0 16px;gap:10px!important}
.ce-bref .og-dit>.f{width:44px;height:44px}
.ce-bref .og-bulle{flex:1;min-width:0;padding:10px 12px!important}
.ce-bref .og-bulle p{font-size:.95rem!important;line-height:1.3}

.rx{padding:0 14px 110px}.rx h2{font-size:1.15rem;margin:6px 0 12px}
.rx-mats{display:grid;gap:10px}.rx-mat{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:10px 14px;border-radius:16px;border:2px solid var(--line,#e5e0d6);background:var(--card,#fff);color:inherit;font:inherit;font-weight:700;text-align:left;cursor:pointer}
.rx-q{font-size:1.08rem;line-height:1.4;margin:6px 0 14px}.rx-ch{display:grid;gap:10px}.rx-c{min-height:52px;padding:10px 14px;border-radius:14px;border:2px solid var(--line,#e5e0d6);background:var(--card,#fff);color:inherit;font:inherit;text-align:left;cursor:pointer}
.rx-c.ok{border-color:var(--ogre,#5aa33f);background:color-mix(in srgb,var(--ogre,#5aa33f) 14%,var(--card,#fff))}.rx-c.ko{border-color:var(--ko,#c0392b)}
.rx-cor{margin:14px 0;line-height:1.4}.rx-sv{width:100%;min-height:52px}.rx-t{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0 0 8px;font-size:.9rem}.rx-sec{text-align:center;margin:18px 0 0}
.rx-h2{margin-top:18px}
.lv{list-style:none;margin:0;padding:0 14px;display:grid;gap:10px}.lv-l{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:12px;border-radius:16px;background:var(--card,#fff);border:2px solid var(--line,#e5e0d6)}
.lv-t{min-width:0;display:grid;gap:2px}.lv-t small{color:var(--soft,#5e6660)}.lv-t span{overflow-wrap:anywhere;font-size:.92rem}.lv-b{flex:0 0 auto;min-height:44px;max-width:44%;padding:6px 10px;font-size:.88rem;white-space:normal;text-align:center}
.lv-h{margin:18px 14px 8px}.lv-vide{padding:16px 14px;text-align:center}.lv-chat{text-align:center;margin:0 0 10px}
body.chat-masque .g-fab,body.chat-masque #fask,body.chat-masque #cGo,body.chat-masque #cAgain,body.chat-masque #rg,body.chat-masque #ieQ,body.chat-masque #gtChat,body.chat-masque #dvChat,body.chat-masque [data-cp-chat],body.chat-masque [data-chat]{display:none!important}
.pa-code-grand{margin:8px 0;text-align:center;font-size:2.4rem;font-weight:800;letter-spacing:.14em;overflow-wrap:anywhere}
body.nav3 #paGrignon,body.nav3 #paMaint,body.nav3 .pa-local{display:none!important}

/* /app : ni en-tête ni menu ; barre du bas à 3 onglets */
.ce-illu{display:block;width:100%;height:auto;border-radius:18px;margin:0 0 12px}.ce-phrase{font-size:1.15rem;margin:0 0 12px;text-align:center}.ce-legal{text-align:center;font-size:.85rem;margin:14px 0 4px}.ce-lg{display:flex;justify-content:flex-end;margin:0 0 8px}
body.nav3 .h-nav-in{grid-template-columns:repeat(4,1fr);align-items:end}
body.nav3 .h-tab{font-size:.9rem;padding:6px 0}body.nav3 .h-tab svg{width:32px;height:32px}
body.nav3 .h-tab.mid .bub{width:84px;height:84px;margin-top:-46px}body.nav3 .h-tab.mid .bub .ogre{width:68px;height:68px}
body.nav3.h-on .wrap{padding-bottom:150px}

body.gr-plein:not(:has(.gr-acc,.gr-etape)) .h-hero,body.gr-plein .h-tete{display:none!important}body.gr-plein .h-sheet{margin:0;border-radius:0;box-shadow:none}
.gr-modes{display:flex;flex-direction:column;gap:12px;padding:12px 14px 0;height:calc(100dvh - 118px)}
.gr-mode{position:relative;flex:1 1 0;min-height:0;padding:0;overflow:hidden;border:3px solid var(--line,#e5e0d6);border-radius:20px;background:var(--card,#fff);cursor:pointer}
.gr-mode img{width:100%;height:100%;object-fit:cover;display:block}.gr-mode b{position:absolute;left:10px;bottom:10px;padding:6px 14px;border-radius:12px;background:var(--card,#fff);color:var(--ink,#1f2421);font-size:1.1rem}
.gr-code{flex:0 0 auto;padding:2px 0 6px}
body.nav3 .h-nav{z-index:60}
.gr-modes{box-sizing:border-box;width:100%;min-width:0;height:calc(100dvh - 124px);padding:10px 12px 0}.gr-mode{width:100%;min-width:0}
.gr-code{align-self:center;max-width:100%;white-space:normal;font-size:.95rem;letter-spacing:0;text-align:center}
.gr-mode b{right:auto;max-width:calc(100% - 20px);box-sizing:border-box;text-align:left;font-size:1rem}
body.gr-plein .h-sheet{padding:0;max-width:100%;overflow-x:hidden}

.ce-tete{display:flex;align-items:center;justify-content:space-between;margin:0 0 8px}.ce-tete .ce-lg{margin:0}
.pn-t{font-size:1.05rem;line-height:1.4;margin:6px 0 10px}.pn-fait{width:100%;min-height:54px;margin:10px 0 6px}.pn-lien{text-align:center;font-size:.8rem;margin:4px 0}.pn-img{display:block;width:100%;height:auto;border-radius:12px;margin:8px 0}
#pQrZone .steps{display:none}#pQrZone .qr-btns{display:grid;gap:10px;grid-template-columns:1fr}#pQrZone .qr-btns .btn{width:100%;min-height:54px}.pn-att{text-align:center;font-weight:700;margin:12px 0}

/* Grignon : plein écran bord à bord, barre du bas dessous ; les images se remplacent dans public/img/famille/mode-{seul,amis,famille}.jpg */
body.gr-plein:not(:has(.gr-acc,.gr-etape)) .h-nav{display:none!important}
#dfZ{position:fixed;inset:0;z-index:70;height:100dvh;overflow-y:auto;background:var(--paper,#fff6e8);box-sizing:border-box;padding:env(safe-area-inset-top,0) 0 env(safe-area-inset-bottom,0)}
.gr-modes{height:100%;padding:6px 12px 12px;gap:10px}.gr-haut{flex:0 0 auto;margin:0;text-align:right;font-size:1.5rem;line-height:1}.gr-mode{background:color-mix(in srgb,var(--ogre,#5aa33f) 16%,var(--card,#fff))}
/* appli connectée : plus d'illustration en haut, le contenu commence directement */
body.nav3 .h-hero{position:static;height:0!important;min-height:0!important;padding:0;margin:0;background:none!important;overflow:visible}
body.nav3 .h-hero .scene{display:none!important}body.nav3 .h-hero *{visibility:hidden}
body.nav3 .h-moi,body.nav3 .h-moi *{visibility:visible}body.nav3 .h-moi{position:fixed;top:calc(8px + env(safe-area-inset-top,0));right:10px;left:auto;width:40px;height:40px;z-index:45}
body.nav3 .h-sheet{margin-top:0;border-radius:0;padding-top:env(safe-area-inset-top,0)}body.nav3 .h-tete{padding-right:58px}
/* Devoirs et Contrôles : seulement les devoirs, les contrôles, le calendrier et l alerte de reconnexion ; le reste est masqué, code conservé */
body.nav3 .h-sheet[data-tab="accueil"]>:not(.h-tete,.h-reco,.h-month,.h-week,#hJour,.lv-illu),body.nav3 .h-sheet[data-tab="notes"]>:not(.h-tete,.h-reco,.h-month,.h-week,#cJour,#cPasses,.lv-notes,.lv-illu){display:none!important}
body.nav3 #hJour>:not(.j-titre,.h-list,.j-vide,.j-rien,.lv-rien,.lv-ajout),body.nav3 #cJour>:not(.j-titre,.ct-liste,.j-vide,.j-rien,.lv-rien){display:none!important}
body.ie-on #dfZ{display:none}body.gr-plein:not(:has(.gr-acc,.gr-etape)) .h-moi{display:none!important}
body.nav3 .j-card h3,body.nav3 .ct-h .tx b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
.lv-notes{margin:0 0 12px}.lv-notes details{margin-top:8px}.lv-compte{padding:12px 16px;text-align:center}.lv-compte .btn{width:100%;margin:12px 0}

/* appli connectée : bord à bord ; barre de titre pleine largeur, collée en haut */
body.nav3{--lv-barre:#2E7DD7}
body.nav3 .wrap{padding-left:0!important;padding-right:0!important;padding-top:0!important;margin:0!important;max-width:none!important;width:100%!important}
body.nav3 .h-sheet{margin:0!important;padding:0 10px 150px!important;border:0!important;border-radius:0!important;box-shadow:none!important;width:100%!important;max-width:none!important;box-sizing:border-box;background:var(--paper,#fff6e8)!important}
body.nav3 .h-sheet::before,body.nav3 .h-sheet::after{display:none!important}
body.nav3 .h-tete{position:sticky;top:0;z-index:44;margin:0 -10px 24px!important;width:calc(100% + 20px)!important;max-width:none!important;box-sizing:border-box;border:0!important;border-radius:0!important;box-shadow:none!important;background:var(--lv-barre)!important;color:#fff!important;padding:calc(10px + env(safe-area-inset-top,0)) 66px 10px 12px!important;min-height:60px}
body.nav3 .h-tete *{color:#fff!important}body.nav3 .h-tete small,body.nav3 .h-tete p,body.nav3 .h-tete span:not(:first-child) small{display:none!important}
body.nav3 .h-moi{top:calc(8px + env(safe-area-inset-top,0))!important;right:12px!important;width:44px!important;height:44px!important;box-shadow:0 0 0 3px #fff!important;border-radius:50%}
body.nav3 .moi-modal{position:static!important;margin:0!important;border-radius:0!important;width:100%!important;max-width:none!important;box-shadow:none!important;padding:0!important}
.lv-barre{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;background:var(--lv-barre,#1d4d7a);color:#fff;padding:calc(10px + env(safe-area-inset-top,0)) 12px 10px 12px;min-height:60px;box-sizing:border-box;border-radius:0;margin:0}
.lv-barre b{color:#fff;font-size:1.15rem}.lv-barre .moi-x{position:static!important;width:44px;height:44px;border-radius:50%;background:#fff;color:#1d4d7a;display:grid;place-items:center;border:0}
body.nav3 .h-sheet[data-tab="moi"]{padding:0!important}
/* Jouer : le même rond de fermeture à chaque étape */
#grX{display:none}body.gr-plein #grX{display:grid;place-items:center;position:fixed;top:calc(10px + env(safe-area-inset-top,0));right:10px;z-index:90;width:48px;height:48px;border-radius:50%;border:3px solid #fff;background:#1f2421;color:#fff;font-size:1.3rem;box-shadow:0 3px 10px rgba(0,0,0,.35);cursor:pointer}body.ie-on #grX{display:none!important}
.gr-modes{padding-top:66px}#dfZ .rx{padding-top:66px}

body.lv-moi .h-moi{display:none!important}body.nav3:has(.demo-bar) .h-moi{top:calc(42px + env(safe-area-inset-top,0))!important}body:has(.demo-bar) .moi-fermer{top:calc(42px + env(safe-area-inset-top,0px))}
body.nav3 .moi-modal{position:fixed!important;inset:0!important;z-index:50;background:var(--paper,#fff6e8)!important;overflow-y:auto;padding-bottom:110px!important}
body.nav3 .moi-top.lv-barre{background:var(--lv-barre)!important;display:flex!important;position:sticky;top:0;width:100%;height:auto}
.lv-compte{background:none!important}
/* Jouer : 2 boutons par ligne, le 3e centré dessous, même taille */
.gr-modes{flex-direction:row!important;flex-wrap:wrap;justify-content:center;align-content:center;gap:12px;padding-left:10px;padding-right:10px}
.gr-mode{flex:0 0 calc(50% - 6px)!important;width:calc(50% - 6px)!important;aspect-ratio:1/1.1;height:auto}
.gr-mode b{font-size:1rem}
body.nav3{background:var(--paper,#fff6e8)!important;background-image:none!important}
.lv-barre{flex-direction:row-reverse}.lv-notes{padding-top:2px}.lv-notes .j-titre{margin-top:4px}

.ck-bar{position:fixed;left:0;right:0;bottom:0;z-index:95;background:var(--card,#fff);border-top:2px solid var(--line,#e5e0d6);padding:10px 12px calc(10px + env(safe-area-inset-bottom,0));box-shadow:0 -4px 14px rgba(0,0,0,.12)}.ck-bar p{margin:0 0 8px;font-size:.88rem;line-height:1.3}.ck-bar div{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ck-bar .btn{min-height:44px}
body.ck-on #ceZ .ie-in,body.ck-on #ieZ .ie-in,body.ck-on #paZ .ie-in{padding-bottom:150px}body:has(#paDirectQ,#paDirectC,#paSuiv,.qp-jeu,.qp-choix,.qp-opt,.qp-valider,.cm-carte,#ieSuite) .ck-bar{display:none}
body.nav3 .h-tete{width:100vw!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important}
.pn-dit{margin:0 0 8px}.pn-court .pr-pin{margin:6px 0}.ce-illu{max-height:34dvh;object-fit:cover}

/* Jouer : quatre grandes cartes illustrées, puis des choix en grosses tuiles */
.gr-modes{display:block!important;height:auto!important;padding:calc(62px + env(safe-area-inset-top,0)) 14px 18px!important}
.gr-titre{font-family:var(--display);font-size:1.5rem;text-align:center;margin:0 0 14px}
.gr-grille{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:560px;margin:0 auto}
.gr-grille .gr-mode{flex:none!important;width:100%!important;height:auto!important;aspect-ratio:1/1.12;border:0;border-radius:22px;box-shadow:0 5px 0 color-mix(in srgb,var(--ogre-d,#3E7F31) 55%,#000 45%);overflow:hidden}
.gr-grille .gr-mode:active{transform:translateY(3px);box-shadow:0 2px 0 color-mix(in srgb,var(--ogre-d,#3E7F31) 55%,#000 45%)}
.gr-grille .gr-mode b{left:0;right:0;bottom:0;max-width:none;width:100%;box-sizing:border-box;padding:10px 8px;border-radius:0;text-align:center;font-family:var(--display);font-size:1.02rem;line-height:1.15;color:#fff;background:rgba(0,0,0,.55)}
#dfZ .rx h2{font-family:var(--display);font-size:1.4rem;text-align:center;margin:0 0 16px}
#dfZ .rx-mats{display:grid;gap:12px;max-width:560px;margin:0 auto}
#dfZ .rx-mat{display:flex;align-items:center;gap:12px;width:100%;min-height:66px;padding:10px 14px;border:2px solid var(--line,#e5dfcf);border-radius:18px;background:var(--card,#fff);color:var(--ink,#1f2421);font:inherit;font-weight:800;text-align:left;box-shadow:0 4px 0 var(--line,#e5dfcf);cursor:pointer}
#dfZ .rx-mat:active{transform:translateY(2px);box-shadow:0 2px 0 var(--line,#e5dfcf)}
#dfZ .rx-mat .gr-l{flex:1;min-width:0}
.gr-ic{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;color:#fff;background:var(--c)}
.gr-ic i,.gr-ic svg{width:24px;height:24px}

/* Jouer : barre du haut, flèche retour et titre, la croix à droite */
.gr-barre{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;align-items:center;gap:8px;box-sizing:border-box;min-height:calc(60px + env(safe-area-inset-top,0));padding:calc(6px + env(safe-area-inset-top,0)) 12px 6px 12px;background:var(--ogre-d,#3E7F31);color:#fff}
.gr-barre h2{flex:1;min-width:0;margin:0!important;font-family:var(--display);font-size:1.15rem!important;line-height:1.15;text-align:left!important;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gr-bk{flex:none;width:44px;height:44px;border:0;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.18);color:#fff;cursor:pointer}
.gr-bk i{width:22px;height:22px}
body.gr-plein #grX{top:calc(6px + env(safe-area-inset-top,0));width:44px;height:44px;z-index:81;border:0;background:rgba(255,255,255,.18);color:#fff}
.gr-modes{padding-top:calc(74px + env(safe-area-inset-top,0))!important}
#dfZ .rx{padding-top:calc(74px + env(safe-area-inset-top,0))!important}
body:has(.gr-barre) #grX{display:none!important}
#dfZ .rx-mat.gr-c{background:color-mix(in srgb,var(--c) 13%,var(--card,#fff));border-color:color-mix(in srgb,var(--c) 55%,var(--line,#e5dfcf));box-shadow:0 5px 0 color-mix(in srgb,var(--c) 70%,#000)}
#dfZ .rx-mat.gr-c:active{box-shadow:0 2px 0 color-mix(in srgb,var(--c) 70%,#000)}
.gr-ic{background:var(--c,var(--ogre-d));box-shadow:inset 0 -3px 0 rgba(0,0,0,.18)}
[data-mode=amis] img{object-position:50% 50%}[data-mode=parents] img{object-position:50% 50%}
.gr-bt{flex:1;min-width:0;font-family:var(--display);font-size:1.2rem;color:#fff}
.gr-q{font-family:var(--display);font-size:1.4rem!important;text-align:center!important;margin:0 0 16px!important}
body.nav3[data-onglet="notes"]{--lv-barre:var(--ogre-d)}
.lv-barre .moi-x{color:var(--lv-barre,#1d4d7a)!important}
/* écran Jouer simplifié : le podium plein cadre comme le login (jour/nuit), la question sur un voile noir, puis trois choix */
.gr-acc{box-sizing:border-box;display:flex;flex-direction:column;width:100%;height:calc(100dvh - 124px);padding:58px 0 12px}
body.gr-plein .gr-acc{height:100dvh;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}
.gr-acc .gr-q:empty{display:none}
.gr-pod{position:relative;flex:0 0 auto;width:100%;aspect-ratio:900/887;max-height:calc(100dvh - 310px);overflow:hidden}.gr-pod img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;display:block}
.gr-soir{display:none!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .gr-jour{display:none!important}:root:not([data-theme="light"]) .gr-soir{display:block!important}}
:root[data-theme="dark"] .gr-jour{display:none!important}:root[data-theme="dark"] .gr-soir{display:block!important}
.gr-acc-q{position:absolute;left:0;right:0;bottom:0;margin:0;padding:9px 12px;font-family:var(--display);font-size:1.15rem;line-height:1.25;text-align:center;color:#fff;background:rgba(0,0,0,.45)}
.gr-liste{flex:1 1 0;min-height:0;display:flex;flex-direction:column;justify-content:space-evenly;gap:10px;padding:10px 16px 0}
.gr-btn{display:flex;align-items:center;gap:14px;min-height:64px;padding:8px 14px 8px 10px;border:2px solid color-mix(in srgb,var(--k) 55%,var(--line));border-radius:20px;background:color-mix(in srgb,var(--k) 12%,var(--sheet,var(--card,#fff)));color:var(--ink);cursor:pointer;box-shadow:0 4px 0 color-mix(in srgb,var(--k) 60%,#000);text-align:left}
.gr-btn:active{transform:translateY(3px);box-shadow:0 1px 0 color-mix(in srgb,var(--k) 60%,#000)}
.gr-btn .i{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--k);color:#fff}
.gr-btn .i.grignons{background:none}.gr-btn .i.grignons svg{width:46px;height:46px}
.gr-btn{gap:10px}.gr-btn b{flex:1;min-width:0;font-family:var(--display);font-size:clamp(.9rem,4.7vw,1.1rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gr-btn .fl{flex:none;color:var(--k)}
/* Moi : page simple, on en sort par les onglets */
body.nav3 .moi-page{padding-top:calc(16px + env(safe-area-inset-top,0px))!important}
html body .gr-barre{background:#1B2246!important}
html body .gr-bk{order:2;margin-left:auto;background:#E8574F;color:#fff}
.gr-coupe{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.18)}
html body .gr-bk{width:32px;height:32px;margin-right:2px}html body .gr-bk i{width:16px;height:16px;font-size:16px}
.gr-pseudo{display:block;margin:0 0 18px}.gr-pseudo span{display:block;margin:0 0 6px;font-weight:700}.gr-pseudo input{box-sizing:border-box;width:100%}
body.nav3 #cJour,body.nav3 #hJour{min-height:0!important}
/* réviser un contrôle (session-controle.js) ; écran d'envoi : styles cp- de l'envoi de copie */
.sc{min-height:100dvh;padding:calc(10px + env(safe-area-inset-top,0)) 16px 40px;background:var(--bg,var(--sheet,#fff));color:inherit;box-sizing:border-box}.sc h2{font-size:1.25rem;line-height:1.25;margin:8px 0 10px}
.sc-haut{display:flex;justify-content:flex-end;margin:0 0 6px}.sc-ogre{width:112px;margin:10px auto 6px}.sc-ogre svg{display:block;width:100%;height:auto}.sc-t{line-height:1.45;margin:0 0 12px}.sc-mat{font-size:.86rem;font-weight:700;opacity:.75;margin:0 0 2px}
.sc .cp-ajout.busy{opacity:.6;pointer-events:none}.sc-n{min-height:1.2em;text-align:center;margin:8px 0;font-weight:700}.sc-go{width:100%;min-height:52px;margin-top:8px;background:var(--ogre-d,#3E9B32)!important;color:#fff!important}.sc-go:disabled{opacity:.45}
.sc-l{display:flex;align-items:center;gap:10px}.sc-l i{color:var(--ogre-d,#3E9B32)}
.sc .cp-pages{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;justify-items:stretch}.sc .cp-page,.sc .cp-ajout{width:auto;min-width:0;margin:0}.sc .cp-page img{aspect-ratio:3/4;width:100%;object-fit:cover}.sc .cp-pages:has(.cp-page)~.sc-go{margin-top:12px}.sc .cp-pages:not(:has(.cp-page)){display:flex;justify-content:center}.sc .cp-pages:not(:has(.cp-page)) .cp-ajout{width:180px}.sc .cp-ajout span{font-size:.85rem;text-align:center}
/* Moi : plein écran, croix à droite, sans les onglets */
body.lv-moi .h-nav{display:none!important}
.moi-fermer{position:fixed;top:calc(12px + env(safe-area-inset-top,0px));right:14px;z-index:70;width:32px;height:32px;border:0;border-radius:50%;display:grid;place-items:center;background:#E8574F;color:#fff;cursor:pointer}.moi-fermer i{width:16px;height:16px;font-size:16px}
/* Devoirs et Contrôles : la liste suffit, plus de filtre de date */
body.nav3 .h-sheet[data-tab="accueil"] .h-month,body.nav3 .h-sheet[data-tab="accueil"] .h-week,body.nav3 .h-sheet[data-tab="notes"] .h-month,body.nav3 .h-sheet[data-tab="notes"] .h-week{display:none!important}
/* plus de barre de titre sur Devoirs et Contrôles : seul l avatar reste, en haut à droite */
body.nav3 .h-sheet[data-tab="accueil"]>.h-tete,body.nav3 .h-sheet[data-tab="notes"]>.h-tete{display:none!important}body.nav3 .h-sheet[data-tab="accueil"],body.nav3 .h-sheet[data-tab="notes"]{padding-top:calc(66px + env(safe-area-inset-top,0px))!important}
.sc-q{text-align:center}.sc-go2{display:block;width:100%;min-height:52px;margin-top:12px;text-align:center}
.sc-ctl{margin:0 0 14px;text-align:center;color:var(--soft);line-height:1.3}.sc-ctl b{display:block;font-family:var(--display);font-size:1.05rem;color:var(--ink,inherit)}
body.nav3 .h-sheet[data-tab="accueil"],body.nav3 .h-sheet[data-tab="notes"]{padding-top:0!important}.lv-illu{width:100vw;margin:0 calc(50% - 50vw) 18px;height:28dvh;min-height:210px;overflow:hidden}.lv-illu img{width:100%;height:100%;object-fit:cover;object-position:58% 50%;display:block}.lv-illu .gr-soir{display:none}
.lv-illu{position:relative}.lv-illu p{position:absolute;left:0;right:0;bottom:0;margin:0;padding:26px 12px 9px;text-align:center;font-family:var(--display);font-size:.98rem;font-weight:500;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.45);background:linear-gradient(to top,rgba(0,0,0,.42),rgba(0,0,0,0))}
.lv-nom{position:absolute;z-index:1;top:calc(14px + env(safe-area-inset-top,0px));left:16px;font-family:var(--display,inherit);font-size:1.3rem;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8),0 0 12px rgba(0,0,0,.5)}body:has(.demo-bar) .lv-nom{top:calc(46px + env(safe-area-inset-top,0px))}
.h-moi-av{display:flex;justify-content:center;align-items:center;width:100%;height:100%;border-radius:50%;overflow:hidden}.h-moi-l{display:none}body.nav3 .h-moi{overflow:visible!important}body.nav3 .h-moi-l{display:block;position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:6px;padding:2px 10px;border-radius:999px;background:#fff;color:#16304A!important;font-family:var(--display,inherit);font-size:.88rem;line-height:1.3;box-shadow:0 2px 6px rgba(0,0,0,.28)}body.nav3 .h-moi{width:52px!important;height:52px!important}
body.gr-plein:has(.gr-acc,.gr-etape) #grX,.gr-acc .gr-barre,.gr-etape .gr-barre{display:none!important}body.gr-plein .gr-acc{height:100dvh;padding:0 0 calc(92px + env(safe-area-inset-bottom,0px))}.gr-acc .gr-pod{max-height:calc(100dvh - 360px)}.gr-acc .gr-acc-q{padding:26px 12px 9px;font-size:1.05rem;font-weight:500;text-shadow:0 1px 3px rgba(0,0,0,.45);background:linear-gradient(to top,rgba(0,0,0,.42),rgba(0,0,0,0))}
body.gr-plein:has(.gr-acc,.gr-etape) #dfZ{z-index:40}
#dfZ .rx.gr-etape{position:relative;padding-top:calc(100px + env(safe-area-inset-top,0))!important}.gr-etape .lv-nom{color:var(--ogre-d,#3E7F31);text-shadow:none}
.rv-fl{flex:none;width:34px;height:44px;margin:0 -4px 0 -10px;padding:0;border:0;background:none;color:inherit;font-size:1.3rem;display:grid;place-items:center;cursor:pointer}
body.nav3 .rv-mhead{margin-top:calc(30px + env(safe-area-inset-top,0px))}
#dfZ .rx.gr-etape.gr-ill{padding-top:0!important}.gr-band{position:relative;height:28dvh;min-height:210px;margin:0 -14px 16px;overflow:hidden}.gr-band img{width:100%;height:100%;object-fit:cover;display:block}.gr-etape .gr-band .lv-nom{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8),0 0 12px rgba(0,0,0,.5)}.gr-fl{display:block;width:44px;height:30px;border-radius:6px;overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.12)}.gr-fl svg{display:block;width:100%!important;height:100%!important}.gr-ic:has(.gr-fl){background:none;box-shadow:none}
.gr-etape .gr-q{display:flex;align-items:center;text-align:left!important}.gr-etape .gr-q .rv-fl{margin:0 4px 0 -8px}
.sc-aut{display:block;font-size:.9rem;font-weight:600;opacity:.75;margin-top:2px}.sc-tx{width:100%;box-sizing:border-box;padding:12px;border-radius:14px;border:2px solid var(--line,#e5e0d6);background:var(--card,#fff);color:inherit;font:inherit;line-height:1.4;resize:vertical}.sc-pistes{margin:0 0 12px;padding-left:20px;line-height:1.4}
body:has(.demo-bar) .gr-band{margin-top:34px}
.lv-card{position:relative}
.gr-pim{display:flex;align-items:center}.gr-pim svg{width:30px!important;height:30px!important;flex:none}.gr-pim svg+svg{margin-left:-9px}.gr-ic:has(.gr-pim){order:2;width:auto;min-width:0;margin-left:auto;background:none;box-shadow:none}
.gr-sal{position:absolute;z-index:1;left:14px;top:14px;padding:7px 14px;border-radius:16px 16px 16px 4px;background:#fff;color:#16304A;font-family:var(--display,inherit);font-size:1.15rem;line-height:1.2;box-shadow:0 3px 10px rgba(0,0,0,.28)}
.rx-mat:has(.gr-pim) .gr-l{order:1}.rx-mat:has(.gr-pim) .gr-ic{order:2}.rx-mat:has(.gr-pim) .gi-droite{order:3;margin-left:6px}.gr-pim .off path{fill:rgba(40,50,70,.16);stroke:none;filter:drop-shadow(0 1px 0 rgba(255,255,255,.75))}.gr-pim .off path:first-child{fill:none;stroke:rgba(40,50,70,.22)}.gr-pim .off path:last-child{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .gr-pim .off path{fill:rgba(255,255,255,.14);filter:drop-shadow(0 -1px 0 rgba(0,0,0,.5))}:root:not([data-theme="light"]) .gr-pim .off path:first-child{fill:none;stroke:rgba(255,255,255,.2)}}
:root[data-theme="dark"] .gr-pim .off path{fill:rgba(255,255,255,.14);filter:drop-shadow(0 -1px 0 rgba(0,0,0,.5))}:root[data-theme="dark"] .gr-pim .off path:first-child{fill:none;stroke:rgba(255,255,255,.2)}
.rx-mat.busy{opacity:.55;transform:translateY(2px)}
.ce-sexe{display:flex;gap:10px;margin:14px 0 4px}.ce-sexe button{flex:1;min-height:48px;border-radius:14px;border:2px solid var(--line,#e5dfcf);background:var(--card,#fff);color:inherit;font:inherit;font-weight:800;cursor:pointer}.ce-sexe button[aria-pressed="true"]{border-color:var(--ogre-d,#3E7F31);background:color-mix(in srgb,var(--ogre-d,#3E7F31) 14%,var(--card,#fff))}
body.nav3 .h-sheet{padding-bottom:calc(140px + env(safe-area-inset-bottom,0px))!important}#dfZ .rx.gr-etape{padding-bottom:calc(150px + env(safe-area-inset-bottom,0px))}body.nav3 #app .moi-page,body.nav3 .rv-mhead~.cz-liste:last-child{margin-bottom:0}
.gr-temps .pa-duree{margin:6px 0 22px;padding:18px 16px 20px;border-radius:20px;background:var(--card,#fff);border:2px solid var(--line,#e5dfcf)}.gr-temps .pa-duree .h b{font-family:var(--display,inherit);font-size:1.5rem}.gr-temps .pa-duree input{width:100%;height:30px;accent-color:var(--ogre-d,#3E7F31)}.gr-temps #grGo{display:block;width:100%;min-height:56px}
body.gr-plein .gr-acc{height:auto;min-height:100dvh;padding-bottom:calc(150px + env(safe-area-inset-bottom,0px))}
.gr-code{margin:0 0 16px}.gr-code label{display:block;margin:0 0 6px;font-weight:800}.gr-code-l{display:flex;gap:10px;align-items:stretch}.gr-code-l input{flex:1;min-width:0;text-transform:uppercase;letter-spacing:.06em}.gr-code-l .btn{flex:none;margin:0;padding:0 18px;min-height:58px;width:auto}
#dfZ .rx.gr-etape:not(.gr-ill){padding-top:calc(22px + env(safe-area-inset-top,0px))!important}body:has(.demo-bar) #dfZ .rx.gr-etape:not(.gr-ill){padding-top:calc(50px + env(safe-area-inset-top,0px))!important}#dfZ .gr-etape:not(.gr-ill) .gr-q{padding-right:70px;min-height:60px}
.rx-mat.off{opacity:.5;filter:grayscale(.6)}.rx-mat.off .gi-droite{display:none}.rx-mat.off small{font-weight:600;color:var(--soft)}
.dg-liste{margin:0 0 14px;display:flex;flex-direction:column;gap:8px}.dg-liste p{margin:0;padding:10px 12px;border-radius:14px;background:var(--card,#fff);border:2px solid var(--line,#e5e0d6);line-height:1.4;overflow-wrap:anywhere}.dg-liste p.on{border-color:#3E9B32}.dg-liste b{display:block;font-size:.85rem;opacity:.75}.dg-cons{overflow-wrap:anywhere}.dg-in{display:block;width:100%;box-sizing:border-box;margin:0 0 12px}.dg-edit label{display:block;margin:0 0 10px}.dg-edit b{display:block;font-size:.85rem;margin-bottom:4px}.dg-lui{display:flex;gap:12px;align-items:flex-start;margin:0 0 16px}.dg-lui .sc-ogre{flex:0 0 72px;width:72px;margin:0}.dg-lui p{margin:4px 0 0;font-size:1.15rem;line-height:1.4;overflow-wrap:anywhere}.dg-hint{font-size:1.15rem;line-height:1.5;text-align:center;overflow-wrap:anywhere}.dg-pc{font-size:2.2rem;font-weight:800;text-align:center;margin:0 0 6px}

.gr-sinon{margin:0 0 10px;font-weight:800;text-align:center}
.rc-trou{letter-spacing:.08em;opacity:.55}.rc-liste p{font-size:1.02rem}.rc-rep{border-color:#D9631A!important}
/* sans barre du bas (BARRE_BAS, app-home.js) : ni barre ni place gardée pour elle, zone de sécurité de l'iPhone comprise ; flèche de retour sur tout ce qui n'est pas Réviser */
body.sans-barre .h-nav{display:none!important}
body.sans-barre.h-on .wrap,body.sans-barre .h-sheet,body.sans-barre #dfZ .rx.gr-etape,body.sans-barre .moi-modal,body.sans-barre #app .moi-page{padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))!important}
body.sans-barre.gr-plein .gr-acc{height:100dvh;min-height:100dvh;padding-top:0;padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))}
body.sans-barre .gr-acc .gr-barre{display:none}body.sans-barre .gr-pod{max-height:calc(100dvh - 210px)}
body.sans-barre .moi-fermer{display:none!important}
.ong-ret{position:fixed;top:calc(8px + env(safe-area-inset-top,0px));left:10px;z-index:55;width:44px;height:44px;border:0;border-radius:50%;display:grid;place-items:center;background:#1B2246;color:#fff;box-shadow:0 3px 8px rgba(0,0,0,.25);cursor:pointer}
body:has(.demo-bar) .ong-ret{top:calc(42px + env(safe-area-inset-top,0px))}
.moi-acces{margin:14px 12px}
#dfZ .rx-mat .gr-l small{display:block;margin-top:2px;font-size:.82rem;font-weight:600;line-height:1.25;color:var(--soft,#5a6168)}
.gr-err{margin:10px 0 0;text-align:center}
body.ri-on{background:var(--paper,#fff6e8)}
.ri-co{position:fixed;top:calc(8px + env(safe-area-inset-top,0px));right:12px;z-index:45;width:44px;height:44px;border:2px solid rgba(255,255,255,.95);border-radius:50%;display:grid;place-items:center;background:#1B2246;color:#fff;cursor:pointer;box-shadow:0 3px 8px rgba(0,0,0,.25)}
body.ie-on .ri-co{display:none}
body:has(.ong-ret) .lv-nom{margin-left:48px}body:has(.ong-ret) .moi-page .lv-id{margin-top:46px}
/* « Je n'ai pas compris » (pas-compris.js) */
.pc-go{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:6px;font-weight:700}
.pc .ie-go,.pc .rx-sv{margin-top:10px}.pc-q{padding:12px 14px;border-radius:14px;border:1.5px solid var(--line,#e5e0d6);background:var(--card,#fff)}.pc-q p{margin:0;line-height:1.4}.pc-q .q{font-weight:700}.pc-q .r{display:flex;gap:8px;align-items:center;margin-top:8px;font-weight:800;color:var(--t-good,#1e7a34)}.pc-q .r i{flex:none}
.pc-expl{margin:14px 0 0;font-size:1.05rem;line-height:1.45}.pc-ex{display:flex;gap:8px;margin:10px 0 0;line-height:1.4;font-size:.95rem}.pc-ex i{flex:none;margin-top:2px}.pc-pq{font-size:1.08rem;font-weight:700;line-height:1.4;margin:0 0 14px}.pc-ret{text-align:center;margin:14px 0 0}.pc-bi{margin:0 0 12px;line-height:1.4}
.gr-accueil .gr-barre{display:none!important}.gr-accueil .gr-band{margin-top:0}
/* c'est l'appli qui pilote : une action en grand, le reste en petit ; sans ENT, J'ai une photo en grand */
.gr-pilote{box-sizing:border-box;display:flex;align-items:center;gap:12px;width:calc(100% - 28px);min-height:104px;margin:14px;padding:14px 16px;border:0;border-radius:22px;background:#3E9B32;color:#fff;font:inherit;text-align:left;cursor:pointer;box-shadow:0 5px 0 #2B6E23}
.gr-pilote .f{flex:none;width:58px;height:58px}.gr-pilote .f svg{width:100%;height:100%}.gr-pilote b{display:block;font-family:var(--display);font-size:1.28rem;line-height:1.2}.gr-pilote small{display:block;margin-top:3px;opacity:.9}
#dfZ .rx-mats.gr-petits{gap:8px}#dfZ .gr-petits .rx-mat{min-height:46px;padding:5px 12px;box-shadow:none;font-weight:700}#dfZ .gr-petits .gr-l small{display:none}
#dfZ .gr-accueil .rx-mats:not(.gr-petits) .rx-mat:first-child{min-height:96px}
.moi-court{display:grid;gap:14px;max-width:440px;margin:0 auto;padding:calc(66px + env(safe-area-inset-top,0px)) 18px 20px}.moi-entb{width:100%}.moi-ent{display:grid;gap:8px}.moi-ent span{display:flex;gap:8px}.moi-ent .btn{flex:1}.moi-court .moi-legal{margin-top:26px;text-align:center;font-size:.82rem}
/* maquette validée le 31/10 : une action ou J'ai une photo en grand, le reste en petit */
.gr-accueil .gr-q:empty{display:none}
#dfZ .gr-accueil .rx-mats:not(.gr-petits) .rx-mat:not(:first-child){min-height:46px;padding:5px 12px;box-shadow:none;font-weight:700}
#dfZ .gr-deux .rx-mat{min-height:84px}
.gr-fiche{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;max-width:560px;margin:14px auto 0}
.gr-profil{margin:6px 16px 0;text-align:center;font-size:.82rem;color:var(--soft,#5a6168)}
.moi-t{margin:0;font-family:var(--display);font-size:1.5rem}
/* Moi, minimal et soigné */
.moi-court{display:block;max-width:440px;padding-top:calc(52px + env(safe-area-inset-top,0px))}
.moi-tete{display:flex;flex-direction:column;align-items:center;gap:10px;margin:0 0 22px}.moi-av{width:116px;height:116px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:var(--card,#2A2939);box-shadow:0 0 0 4px var(--ogre,#58A700)}.moi-av svg{width:100%;height:100%}
.moi-t{font-size:1.7rem;text-align:center;color:var(--ink)}
.moi-carte{border-radius:20px;background:var(--card,#2A2939);border:1px solid var(--line,#3D3B52);overflow:hidden;margin:0 0 14px}
.moi-l{box-sizing:border-box;display:flex;align-items:center;gap:12px;width:100%;min-height:62px;padding:12px 14px;border:0;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}.moi-l+.moi-l{border-top:1px solid var(--line,#3D3B52)}
.moi-l img{flex:none;width:34px;height:34px;border-radius:9px;object-fit:contain}.moi-l .tx{flex:1;min-width:0}.moi-l b{font-weight:800}.moi-l .gi-droite{opacity:.6}
.moi-ic{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--ogre,#58A700) 22%,transparent);color:var(--ink)}
.moi-ac{display:flex;gap:16px;margin-top:4px;font-size:.88rem}.moi-l input[type=checkbox]{flex:none;width:44px;height:26px;accent-color:var(--ogre,#58A700)}
.moi-court .moi-legal{margin-top:24px;line-height:1.9}
.moi-croix{position:fixed;top:calc(10px + env(safe-area-inset-top,0px));right:12px;z-index:56;width:44px;height:44px;border:0;border-radius:50%;display:grid;place-items:center;background:#C8321E;color:#fff;font-size:1.2rem;cursor:pointer}
body:has(.demo-bar) .moi-croix{top:calc(44px + env(safe-area-inset-top,0px))}.moi-cl{color:var(--soft,#B9B4CC);margin-top:-6px}.moi-neutre{color:var(--ink);padding:18px;box-sizing:border-box}
.pa-qr-grand{margin:10px auto 16px;max-width:160px}.pa-qr-grand svg{display:block;width:100%;height:auto;border-radius:16px;background:#fff}
.moi-tete-co{margin-top:calc(56px + env(safe-area-inset-top,0px))}.moi-tete-co .moi-av{width:96px;height:96px}
#dfZ .rx-mats.gr-classes{grid-template-columns:repeat(2,1fr)}#dfZ .gr-classes .rx-mat{min-height:84px;justify-content:center}#dfZ .gr-classes .gr-l{flex:none;font-family:var(--display);font-size:1.5rem}#dfZ .gr-classes .gi-droite{display:none}
#dfZ .gr-chap .gr-l{font-family:inherit;font-size:.95rem;flex:1;line-height:1.2;text-align:center}#dfZ .gr-chap .rx-mat:first-child{grid-column:1/-1;min-height:64px}.rx-sv.busy{opacity:.7}
:root[data-theme="dark"] .ie-logo,:root[data-theme="dark"] .lv-nom{color:#fff!important;font-size:1.4rem!important}
.pa-x{width:44px!important;height:44px!important;background:#C8321E!important;font-size:1.2rem}.pa-x i{width:20px!important;height:20px!important}
.gr-bar{display:block;height:5px;margin-top:7px;border-radius:3px;background:var(--line,#3D3B52);overflow:hidden}.gr-bar i{display:block;height:100%;width:0;background:var(--line,#3D3B52)}.gr-bar.bon i{background:var(--ogre,#58A700)}.gr-bar.moyen i{background:#E08A1E}
.gr-accueil .lv-nom{top:calc(8px + env(safe-area-inset-top,0px))}
#paGrDit{min-height:92px}   /* la bulle change de texte : le bouton ne bouge pas sous le doigt */
.pa-conf{z-index:120}.pa-conf-b{display:flex;gap:10px;margin-top:14px}.pa-conf-b .btn{flex:1}.ie-go.busy{opacity:.7}
body:not(:has(#dfZ)) #grX{display:none!important}
.gr-voie{margin:10px 16px 0;text-align:center;font-size:.85rem;color:var(--soft,#B9B4CC)}
:root[data-theme="dark"] .fg-bulle{background:var(--card,#2A2939)!important}:root[data-theme="dark"] .fg-bulle p{color:var(--ink)!important}
/* la promesse : page de scan, quiz, bilan */
.sc-promesse{margin:6px 0 14px;line-height:1.4;font-size:.95rem}.sc-promesse b{display:block;margin-bottom:4px}
.sc-h3{margin:22px 0 8px;font-size:1rem}.sc .sc-ctl-l{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}.sc-ctl-l>span:first-child{min-width:0}.sc-ctl-l b,.sc-ctl-l small{display:block}.sc-ctl-l small{opacity:.8;margin-top:2px}
.sc .sc-pt{width:auto;min-height:44px;padding:8px 14px;margin:0;flex:none}.sc-2b{display:flex;flex-direction:column;gap:6px;flex:none}
.sc-compte{margin:10px 0 0;text-align:center;font-weight:700;font-size:.78rem}.sc-prop{margin:0 0 12px}.sc-chip.on{border-color:var(--ogre-d,#3E9B32)}.sc-champ{display:block;margin:0 0 12px;font-weight:700}.sc-champ span{display:block;margin-bottom:4px}
.sc-parties{margin:8px 0 14px;padding-left:20px;line-height:1.5}.sc-l small{display:block;font-weight:500;opacity:.8}
#dfZ .gr-promesse .rx-mat:first-child{min-height:84px;background:#3E9B32;border-color:#3E9B32;color:#fff}#dfZ .gr-promesse .rx-mat:first-child small{color:#fff;opacity:.92}
.gr-bulle{display:flex;align-items:flex-end;gap:10px;margin:32px 6px 0}.gr-bulle svg{flex:0 0 46px;width:46px;height:46px}.gr-promesse-t{position:relative;flex:1;margin:0;padding:11px 14px;border-radius:18px 18px 18px 4px;background:rgba(127,127,127,.18);color:inherit;line-height:1.3;font-size:.92rem;font-weight:700}
.sc-champ:focus-within{outline:none!important}
/* création d'un contrôle : deux écrans, bulle de Grignon, date sur toute la zone, deux tuiles d'envoi */
.sc-tete{display:flex;align-items:center;gap:6px;min-height:48px;margin:0 0 16px -8px}.sc-tete h2{min-width:0;margin:0;font-family:var(--display);font-size:1.3rem;line-height:1.25}.sc-ret{flex:none;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;font-size:1.3rem;cursor:pointer;-webkit-tap-highlight-color:transparent}.sc-ret:active{background:rgba(127,127,127,.18)}
.sc-bulle.gr-bulle{margin:0 0 22px}.sc-bulle.gr-bulle svg{flex-basis:56px;width:56px;height:56px}
.sc-titre,.sc-dz{box-sizing:border-box;width:100%;border:2px solid var(--line,#e5dfcf);border-radius:16px;background:transparent;color:inherit}.sc-titre{display:block;min-height:60px;padding:10px 16px;font:inherit;font-size:1.05rem;font-weight:700}.sc-titre::placeholder{color:var(--soft);font-weight:500;opacity:1}.sc-titre:focus,.sc-dz:focus-within{outline:none;border-color:var(--ogre-d,#3E9B32)}
.sc-quand{margin:22px 0 8px}.sc-quand>span:first-child{font-family:var(--display);font-size:1.3rem;line-height:1.25;margin-bottom:12px}
.sc-champ .sc-dz{position:relative;display:flex;align-items:center;gap:14px;min-height:72px;padding:8px 14px;margin:0;cursor:pointer}.sc-dz span{margin:0}.sc-dz .ic,.sc-recap .ic{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:color-mix(in srgb,var(--ogre-d,#3E9B32) 16%,transparent);color:var(--ogre,#3E9B32);font-size:1.2rem}
.sc-dz-v{flex:1;min-width:0;font-size:1.1rem;font-weight:700}.sc-dz-v::first-letter{text-transform:uppercase}.sc-dz-v.vide{color:var(--soft);font-weight:500}
.sc-dz input{position:absolute;inset:0;box-sizing:border-box;width:100%;height:100%;min-width:0;margin:0;padding:0;border:0;opacity:0;font-size:16px;background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none}.sc-dz input::-webkit-calendar-picker-indicator{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;cursor:pointer}
.sc-env{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sc-tuile{--t:var(--ogre-d,#3E9B32);--ti:var(--ogre,#3E9B32);position:relative;overflow:hidden;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:164px;padding:16px 8px 14px;text-align:center;border:2px solid var(--line,#e5dfcf);border-bottom-width:5px;border-radius:20px;background:var(--card,#fff);cursor:pointer;-webkit-tap-highlight-color:transparent}.sc-tuile2{--t:#E08A2E;--ti:#E08A2E}.sc-tuile:active{transform:translateY(2px);border-bottom-width:3px}.sc-tuile:focus-within{outline:none;border-color:var(--t)}.sc-tuile .ic{display:grid;place-items:center;width:64px;height:64px;margin-bottom:6px;border-radius:50%;background:color-mix(in srgb,var(--t) 16%,transparent);color:var(--ti);font-size:1.7rem}.sc-tuile b{font-size:1.02rem;line-height:1.2}.sc-tuile small{color:var(--soft);font-size:.82rem}.sc-tuile input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.sc-pgs{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0 0;padding:0}.sc-pgs:empty{display:none}.sc-pgs li{position:relative;aspect-ratio:3/4;border:2px solid var(--line,#e5dfcf);border-radius:12px}.sc-pgs img{display:block;width:100%;height:100%;object-fit:cover;border-radius:10px}.sc-pgs .pdf{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:100%;padding:4px;box-sizing:border-box;font-size:.68rem;overflow:hidden}.sc-pgs .pdf>i{font-size:1.4rem;color:#E08A2E}.sc-pgs .pdf span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-pgs button{position:absolute;top:-8px;right:-6px;display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:var(--ink,#2B2A3A);color:var(--paper,#fff);font-size:.8rem;cursor:pointer}.sc-pgs button::after{content:'';position:absolute;inset:-8px}
.sc-recap{display:flex;align-items:center;gap:12px;box-sizing:border-box;width:100%;min-height:64px;margin:20px 0 0;padding:8px 14px 8px 8px;border:0;border-radius:16px;background:rgba(127,127,127,.12);color:inherit;font:inherit;text-align:left;cursor:pointer}.sc-recap .tx{flex:1;min-width:0}.sc-recap b,.sc-recap small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-recap small{opacity:.8;margin-top:1px;white-space:normal}.sc-recap small::first-letter{text-transform:uppercase}.sc-recap .mod{flex:none;font-size:.86rem;font-weight:700;text-decoration:underline}
/* accroche sur la photo de l'accueil : voile bas, blanc sur sombre dans les deux thèmes */
#dfZ .gr-accroche{position:absolute;z-index:3;left:0;right:0;bottom:0;margin:0;padding:30px 16px 10px;background:linear-gradient(to top,rgba(20,18,30,.82),rgba(20,18,30,.62) 62%,rgba(20,18,30,0));color:#fff;font-weight:700;font-size:.95rem;line-height:1.25;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.5);pointer-events:none}
@media (max-width:340px){.sc-bulle.gr-bulle{gap:8px}.sc-bulle.gr-bulle svg{flex-basis:42px;width:42px;height:42px}.sc-bulle .gr-promesse-t{padding:9px 10px;font-size:.82rem}}

/* action prioritaire de l accueil : Grignon parle dans une bulle, toute la bulle reste touchable */
#dfZ .gr-pilote{display:flex;align-items:flex-end;gap:10px;width:calc(100% - 28px);min-height:0;margin:14px;padding:0;background:none;border-radius:0;border:0;box-shadow:none;color:inherit;text-align:left}
#dfZ .gr-pilote .f{flex:0 0 46px;width:46px;height:46px;background:none;box-shadow:none}
#dfZ .gr-pilote .f svg{width:46px;height:46px}
#dfZ .gr-pilote>span:last-child{flex:1;padding:11px 14px;border-radius:18px 18px 18px 4px;background:rgba(127,127,127,.18);line-height:1.3}
#dfZ .gr-pilote b{font-family:inherit;font-size:.98rem;line-height:1.25}
#dfZ .gr-pilote small{display:block;margin-top:2px;opacity:.85}
.sc-sug{position:fixed;z-index:60;left:0;right:0;bottom:0;box-sizing:border-box;display:flex;gap:8px;padding:6px 12px;overflow-x:auto;background:var(--paper,#fff8e8);border-top:1px solid var(--line,#e5dfcf);scrollbar-width:none;-webkit-overflow-scrolling:touch}.sc-sug[hidden]{display:none}.sc-sug::-webkit-scrollbar{display:none}.sc-sug button{flex:none;min-height:44px;padding:0 14px;border:2px solid var(--line,#e5dfcf);border-radius:22px;background:var(--card,#fff);color:inherit;font:inherit;font-size:.95rem;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent}
/* ILLUS_ACCUEIL : hauteur tirée de la largeur (34dvh sur un téléphone de 390x844), place réservée avant l'image ; barre d'adresse mobile : aucun saut */
.gr-band.gr-band-illus{height:auto;aspect-ratio:390/287;min-height:34dvh;max-height:46dvh}.gr-band-illus img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:390/287;object-fit:cover;object-position:50% 0}
#dfZ .gr-band-illus .lv-nom{left:12px;font-size:.95rem!important}@media (max-width:360px){#dfZ .gr-band-illus .lv-nom{left:8px;top:calc(2px + env(safe-area-inset-top,0px));font-size:.8rem!important}}

/* accueil : plus d air au-dessus des boutons et entre eux */
#dfZ .gr-accueil .rx-mats{margin-top:26px;gap:18px}

/* accroche plus basse et voile plus léger : la famille reste visible */
#dfZ .gr-accroche{padding:16px 16px 5px;font-size:.9rem;line-height:1.2;background:linear-gradient(to top,rgba(20,18,30,.72),rgba(20,18,30,.42) 55%,rgba(20,18,30,0))}

/* accueil illustré : le nom reste bien visible */
#dfZ .gr-band-illus .lv-nom{font-size:1.25rem!important}

/* accroche : léger voile opaque derrière le texte */
#dfZ .gr-accroche{background:rgba(20,18,30,.68);padding:8px 16px 7px}
/* accueil, ordinateur (1000 px et plus) : image entière à gauche, tête de la mascotte puis boutons à droite, le tout centré ; dessous, pas de tête */
.gr-acc-tete{display:none}
@media (min-width:1000px){
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:1fr repeat(10,auto) 1fr;column-gap:48px;row-gap:0;align-items:center;max-width:1240px;margin:0 auto;padding:40px 48px!important;box-sizing:border-box;min-height:calc(100vh - 40px)}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil::before{content:"";grid-column:2;grid-row:1}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil::after{content:"";grid-column:2;grid-row:-2/-1}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil>:not(.gr-band){grid-column:2;width:100%;max-width:520px;justify-self:center;box-sizing:border-box}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil>.gr-band{grid-column:1;grid-row:1/-1;align-self:center;width:100%!important;max-width:none;height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:auto!important;margin:0!important;border-radius:24px;overflow:hidden}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil>.gr-band img{position:static!important;inset:auto;width:100%!important;height:auto!important;aspect-ratio:auto!important;object-fit:contain}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil>.gr-band .lv-nom{top:22px!important;left:24px!important}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil>.gr-acc-tete{display:flex;justify-content:center;margin:0 0 14px}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil>.gr-acc-tete svg{width:120px;height:120px}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil:has(>.gr-pilote,>.mp-tut)>.gr-acc-tete{display:none}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil>.rx-mats{margin:0!important}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil>.rx-mats.gr-promesse .rx-mat{min-height:72px}
body:not(:has(.bu-nav)) #dfZ .rx.gr-accueil>.rx-mats.gr-promesse .rx-mat:first-child{min-height:92px}
}
/* supprimer un contrôle : discret, confirmation dans la page */
.sc-2b.sc-2l{flex-direction:column;align-items:flex-end;gap:2px}.sc-sup{flex:none;min-height:44px;padding:0 8px;display:inline-flex;align-items:center;gap:6px;background:none;border:0;border-radius:12px;color:var(--t-crit,#C2362C);font:inherit;font-size:.9rem;font-weight:700;cursor:pointer}.sc-sup:hover{text-decoration:underline}.ct-av .sc-sup{margin:6px 0 0 auto}.sc-haut{align-items:center}.sc-haut .sc-sup{margin-right:auto}
.sc-conf h2{font-size:1.25rem;margin:0 0 10px}.sc-conf p{margin:0 0 16px;line-height:1.45;overflow-wrap:anywhere}.sc-conf-b{display:flex;gap:8px;flex-wrap:wrap}.sc-conf-b .btn{flex:1 1 130px;width:auto;margin:0;min-height:48px}.sc-conf-b .sc-sup-ok{background:#C2362C;color:#fff}
/* l'attente : barre et étapes */
.sc-bar{height:12px;margin:6px 0 14px;border-radius:999px;background:var(--line,#e5e0d6);overflow:hidden}.sc-bar i{display:block;height:100%;border-radius:999px;background:var(--t-good,#1F8A4C);transition:width .5s ease}.sc-etapes{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-direction:column;gap:8px}.sc-etapes li{display:flex;align-items:center;gap:8px;opacity:.55}.sc-etapes li.on{opacity:1;font-weight:700}.sc-etapes li.fait{opacity:.85;color:var(--t-good,#1F8A4C)}
@media (prefers-reduced-motion:reduce){.sc-bar i{transition:none}}
.sc-est{font-weight:700;margin:0 0 12px}.sc-astuce{min-height:2.9em}.dg-noms{display:grid;gap:8px;margin:0 0 14px}.dg-noms .sc-t{display:block;margin:0 0 2px;font-size:.86rem}.dg-liste p[data-k].on{border-color:var(--t-good,#1F8A4C)}
.dg-doute{padding:0 .2em;border-radius:6px;background:var(--ko-bg,#FDE7E4);color:var(--ko-t,#B3261E);font-weight:800}
/* dialogue : bulles, visage de chaque personnage, onde sur ce qu'on entend */
.dg-ligne{display:flex;align-items:flex-end;gap:8px;min-width:0}.dg-ligne.d{flex-direction:row-reverse}.dg-av{flex:none;width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--card,#fff);border:2px solid var(--line,#e5e0d6)}
.dg-liste .dg-ligne p{flex:0 1 auto;max-width:82%;min-width:0;border-radius:18px 18px 18px 4px}.dg-liste .dg-ligne.d p{border-radius:18px 18px 4px 18px}.dg-liste .dg-ligne p b{display:block;font-size:.82rem;color:var(--ogre-d,#3E7F31)}.dg-liste .dg-ligne.d p b{text-align:right}
.dg-lui{display:flex;align-items:flex-end;gap:10px;min-width:0}.dg-bulle{flex:1;min-width:0;padding:12px 14px;border-radius:18px 18px 18px 4px;background:var(--card,#fff);border:2px solid var(--line,#e5e0d6)}.dg-bulle p{margin:4px 0 0}
.dg-onde{display:none;align-items:center;gap:3px;height:22px;margin-top:6px}.dg-onde i{width:4px;height:100%;border-radius:4px;background:var(--ogre,#5BA84A);transform:scaleY(.25);animation:dgOnde 1s ease-in-out infinite}.dg-onde i:nth-child(2){animation-delay:.12s}.dg-onde i:nth-child(3){animation-delay:.24s}.dg-onde i:nth-child(4){animation-delay:.36s}.dg-onde i:nth-child(5){animation-delay:.24s}.dg-onde i:nth-child(6){animation-delay:.12s}
.dg-sonne .dg-liste p.on .dg-onde,.dg-sonne .dg-bulle .dg-onde{display:flex}@keyframes dgOnde{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}@media (prefers-reduced-motion:reduce){.dg-onde i{animation:none;transform:scaleY(.6)}}
/* contrôle partagé par lien */
.sc-sup.sc-pt2{color:var(--ogre-d,#3E7F31)}.sc-haut .sc-sup.sc-pt2{margin-right:auto}.sc-haut .sc-sup:has(+.sc-pt2){margin-right:0}.pt{position:fixed;inset:0;z-index:70;overflow:auto;background:var(--paper,#1e1e2c);color:var(--ink,inherit)}.pt-in{max-width:520px;margin:0 auto;padding:max(12px,env(safe-area-inset-top)) 16px 28px}.pt-cartes{display:grid;gap:8px}.pt-cartes details{padding:12px;border-radius:14px;background:var(--card,#fff);border:2px solid var(--line,#e5e0d6);margin:0}.pt-cartes summary{font-weight:700;cursor:pointer;overflow-wrap:anywhere}.pt-cartes p{margin:8px 0 0}
.sc-haut.pt-ret{justify-content:flex-start}.sc-haut.pt-ret .gr-bk{margin-left:0;margin-right:auto}
/* démo : scanner un vrai cours (demo-scan.js) */
.ds .ds-petit{font-size:.88rem;opacity:.8;margin:.4rem 0}.ds .ds-reste{font-weight:700;margin-top:1rem}
.ds .ds-photo{display:flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer}.ds .ds-photo input{display:none}
.ds-pages{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:1rem 0}.ds-pages figure{position:relative;margin:0;width:96px;height:128px;border-radius:12px;overflow:hidden;border:2px solid var(--line,#E4E2DA)}
.ds-pages img{width:100%;height:100%;object-fit:cover;display:block}.ds-moins{position:absolute;top:4px;right:4px;width:28px;height:28px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;display:grid;place-items:center;cursor:pointer}
.ds-barre{height:8px;border-radius:8px;background:var(--line,#E4E2DA);overflow:hidden;margin:1.2rem auto;max-width:280px}.ds-barre i{display:block;height:100%;width:30%;border-radius:8px;background:var(--ogre,#58A700);animation:ds-va 1.6s ease-in-out infinite}
@keyframes ds-va{0%{transform:translateX(-100%)}100%{transform:translateX(340%)}}
@media (prefers-reduced-motion:reduce){.ds-barre i{animation:none;width:60%}}
.ds .ds-h{margin:1.4rem 0 .4rem;font-size:1.05rem}
.ds-carte{display:block;width:100%;min-height:170px;margin:1rem 0;padding:1.4rem 1.2rem;border-radius:18px;border:2px solid var(--line,#E4E2DA);background:var(--card,#fff);color:var(--ink,inherit);font:inherit;font-size:1.1rem;line-height:1.45;cursor:pointer;text-align:center}
.ds-carte.vu{border-color:var(--ogre,#58A700)}
.ds-bulle{position:relative;margin:.6rem auto 1.4rem;max-width:420px;padding:1rem 1.2rem;border-radius:18px;background:var(--card,#fff);color:var(--ink,inherit);border:2px solid var(--line,#E4E2DA);text-align:left}
.ds-bulle:before{content:"";position:absolute;top:-10px;left:50%;margin-left:-9px;width:16px;height:16px;background:inherit;border-left:2px solid var(--line,#E4E2DA);border-top:2px solid var(--line,#E4E2DA);transform:rotate(45deg)}
.ds-bulle b{display:block;margin-bottom:.3rem}.ds-bulle p{margin:0}

/* « À jouer » (a-jouer.js) : la boucle du quiz en direct en tête de l'accueil */
.aj{margin:0 0 16px;display:flex;flex-direction:column;gap:10px}
.aj-ctl{background:var(--card,#fff);border:2px solid var(--brand,#5b3fd6);border-radius:18px;padding:14px 16px;box-shadow:0 4px 0 rgba(0,0,0,.06)}
.aj-ctl.aj-vide{border-style:dashed}
.aj-sur{margin:0;font-size:.85rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--brand,#5b3fd6)}
.aj-ctl h3{margin:4px 0 10px;font-size:1.08rem;line-height:1.3}
.aj-modes{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.aj-m{display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 4px;border-radius:12px;border:1.5px solid var(--line,#ddd);background:var(--bg2,#f6f4ff);font-weight:700;font-size:.85rem;color:inherit;cursor:pointer;min-height:44px}
.aj-m.prim{background:var(--brand,#5b3fd6);border-color:var(--brand,#5b3fd6);color:#fff}
.aj-m i{font-size:1.15rem}
.aj-lien{background:none;border:0;padding:6px 0;color:var(--brand,#5b3fd6);font-weight:700;cursor:pointer;text-align:left;min-height:32px}
.aj-retire{color:var(--t-mute,#888);font-weight:600;font-size:.85rem}
.aj-puis{margin:0;font-size:.9rem}
.aj-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.aj-b{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px;border-radius:14px;border:1.5px solid var(--line,#ddd);background:var(--card,#fff);color:inherit;cursor:pointer;text-align:left;min-width:0}
.aj-b[disabled]{opacity:.55;cursor:default}
.aj-b i{font-size:1.2rem;color:var(--brand,#5b3fd6)}
.aj-b b{font-size:.95rem}
.aj-b span{font-size:.75rem;color:var(--t-mute,#777);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.aj-liste{display:flex;flex-direction:column;gap:10px;margin-bottom:8px}
.aj-li{display:flex;flex-direction:column;gap:6px}
.aj-li span{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.aj-form label{display:flex;flex-direction:column;gap:4px;margin:0 0 10px;font-weight:700;font-size:.9rem}
.aj-form select,.aj-form input{font:inherit;padding:10px;border-radius:10px;border:1.5px solid var(--line,#ccc);background:var(--card,#fff);color:inherit}
@media (max-width:420px){.aj-row{grid-template-columns:repeat(2,1fr)}}

/* la famille Grignon (famille-grignon.js) : une réplique courte */
.fg-bulle{display:flex;align-items:center;gap:10px;margin:0;padding:8px 12px 8px 8px;border-radius:16px;background:var(--bg2,#f6f4ff);font-size:.92rem;line-height:1.35}
.fg-bulle p{margin:0}.fg-bulle b{display:block;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;color:var(--brand,#5b3fd6)}
.fg-p{flex:0 0 44px;width:44px;height:44px;display:inline-flex}.fg-p svg,.fg-p img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.pa .fg-bulle{margin:10px 0}

/* écran « Aujourd'hui » (aujourdhui.js) : une grosse proposition, tuiles en relief façon Duolingo, la famille Grignon */
.au{display:flex;flex-direction:column;gap:12px;margin:0 0 16px}
.au-sur{margin:0;font-size:.85rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--brand,#5b3fd6)}
.au-carte{display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:18px 16px;border-radius:22px;background:var(--card,#fff);border:2px solid var(--line,#e5e0d6);box-shadow:0 5px 0 var(--line,#e5e0d6)}
.au-carte h2{margin:0;font-size:1.3rem;line-height:1.25}
.au-ico{display:inline-flex;width:48px;height:48px;align-items:center;justify-content:center;border-radius:14px;background:var(--bg2,#f6f4ff);color:var(--brand,#5b3fd6);font-size:1.5rem}
.au-go{display:flex;align-items:center;justify-content:center;gap:8px;min-height:56px;padding:12px;border:0;border-radius:16px;background:var(--ogre,#58a700);color:#fff;font:inherit;font-weight:900;font-size:1.15rem;box-shadow:0 5px 0 #3f7c00;cursor:pointer}
.au-go:active,.au-b:not(body):active,.au-alt:active,.au-rc:active{transform:translateY(3px);box-shadow:none}
.au-2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.au-b:not(body){display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;padding:10px 8px;border:2px solid var(--line,#e5e0d6);border-radius:14px;background:var(--card,#fff);color:inherit;font:inherit;font-weight:800;font-size:.92rem;box-shadow:0 4px 0 var(--line,#e5e0d6);cursor:pointer}
.au-oui-non{grid-template-columns:1fr}
.au-autre{align-self:center;min-height:44px;padding:8px 18px;border:2px solid var(--line,#e5e0d6);border-radius:999px;background:transparent;color:inherit;font:inherit;font-weight:800;cursor:pointer}
.au-alts{display:flex;flex-direction:column;gap:8px}.au-alts[hidden]{display:none}
.au-alt{display:flex;align-items:center;gap:10px;min-height:56px;padding:10px 12px;border:2px solid var(--line,#e5e0d6);border-radius:16px;background:var(--card,#fff);color:inherit;font:inherit;text-align:left;box-shadow:0 4px 0 var(--line,#e5e0d6);cursor:pointer}
.au-alt i{font-size:1.3rem;color:var(--brand,#5b3fd6)}.au-alt span{display:flex;flex-direction:column}.au-alt small{color:var(--t-mute,#6b6b6b);font-size:.82rem}
.au-pronote,.au-agenda{margin:0;text-align:center;font-size:.9rem}
.au-pronote .linkbtn2,.au-agenda .linkbtn2{min-height:40px}
/* variante B : le reste de l'accueil (devoirs, contrôles, calendrier) passe derrière « Mon agenda » */
body.au-b:not(.au-agenda-ouvert) #hAJouer ~ *{display:none!important}
body.au-b:not(.au-agenda-ouvert) .h-tete[data-k="accueil"]{display:none}
.au-sur{font-size:1.5rem;text-transform:none;letter-spacing:0;color:inherit;font-family:var(--display,inherit)}

/* variante B : plein écran sans la barre du bas ; menu (avatar en haut à droite) ; « ← Aujourd'hui » */
body.au-b .h-nav{display:none!important}
body.au-b{padding-bottom:env(safe-area-inset-bottom)}
.au-retour{position:fixed;left:10px;top:calc(10px + env(safe-area-inset-top,0px));z-index:58;display:flex;align-items:center;gap:6px;min-height:44px;padding:6px 14px 6px 10px;border:2px solid var(--line,#e5e0d6);border-radius:999px;background:var(--card,#fff);color:var(--ink,#1f2421);font:inherit;font-weight:800;box-shadow:0 4px 0 var(--line,#e5e0d6);cursor:pointer}
.au-menu{position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.35);display:flex;justify-content:flex-end}
.au-menu-in{width:min(320px,86vw);height:100%;overflow:auto;background:var(--paper,#fff);padding:calc(14px + env(safe-area-inset-top,0px)) 14px 20px;display:flex;flex-direction:column;gap:8px;box-shadow:-8px 0 24px rgba(0,0,0,.18)}
.au-menu-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.au-menu-h b{font-size:1.2rem}
.au-menu-x{width:44px;height:44px;border:0;background:transparent;font-size:1.6rem;color:inherit;cursor:pointer}
.au-mi{display:flex;align-items:center;gap:12px;min-height:52px;padding:10px 14px;border:2px solid var(--line,#e5e0d6);border-radius:16px;background:var(--card,#fff);color:inherit;font:inherit;font-weight:800;text-align:left;box-shadow:0 4px 0 var(--line,#e5e0d6);cursor:pointer}
.au-mi i{font-size:1.3rem;color:var(--brand,#5b3fd6)}
/* l avatar sert de bouton menu en variante B : petit badge ☰ */
body.au-b .h-moi{overflow:visible!important}
body.au-b .h-moi::after{content:"☰";position:absolute;right:-6px;bottom:-6px;width:22px;height:22px;border-radius:50%;background:#fff;color:#1f2421;font-size:13px;line-height:22px;text-align:center;box-shadow:0 1px 4px rgba(0,0,0,.3)}
/* ===== refonte visuelle de la variante B (29/10) : illustration de la famille Grignon plein cadre, bulle, gros « Jouer », tuiles en relief, fond à bulles ===== */
body.au-b{background-color:var(--paper);background-image:radial-gradient(circle at 0% 0%,color-mix(in srgb,var(--ogre,#58a700) 14%,transparent) 0 170px,transparent 171px),radial-gradient(circle at 108% 36%,color-mix(in srgb,var(--sky,#1cb0f6) 14%,transparent) 0 150px,transparent 151px),radial-gradient(circle at -8% 102%,color-mix(in srgb,var(--sun,#ffc800) 16%,transparent) 0 190px,transparent 191px);background-attachment:fixed;background-repeat:no-repeat}
body.au-b .h-hero .scene{display:none!important}
body.au-b .h-hero{min-height:72px!important;height:auto!important;background:none!important}
.au2{gap:14px;max-width:560px;margin:0 auto 24px}
.au-hero{position:relative;margin:0 -4px;border-radius:26px;overflow:hidden;background:var(--card);box-shadow:0 6px 0 var(--line)}
.au-hero img{display:block;width:100%!important;height:min(62vw,280px)!important;max-height:280px;object-fit:cover;object-position:50% 42%}
.au-bulle{position:relative;display:flex;align-items:center;gap:10px;margin:-34px 12px 12px;padding:12px 14px;border-radius:20px;background:var(--card);border:2px solid var(--line);box-shadow:0 4px 0 var(--line)}
.au-bulle::before{content:"";position:absolute;top:-10px;left:34px;width:18px;height:18px;background:var(--card);border-left:2px solid var(--line);border-top:2px solid var(--line);transform:rotate(45deg)}
.au-bulle p{margin:0;font-size:1.02rem;line-height:1.35;color:var(--ink)}.au-bulle b{display:block;font-family:var(--display,inherit);font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ogre-d,#3f7c00)}
.au-bp{flex:0 0 46px;width:46px;height:46px;display:inline-flex}.au-bp svg,.au-bp img{width:100%;height:100%;border-radius:50%}
.au-prog{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;min-height:30px}
.au-pc{display:inline-flex;align-items:center;gap:4px;padding:4px 12px;border-radius:999px;background:var(--card);border:2px solid var(--line);font-weight:800;font-size:.85rem;color:var(--ink)}
.au-serie{border-color:color-mix(in srgb,var(--pumpkin,#ff9600) 60%,var(--line))}
.au2 .au-carte{gap:12px;padding:18px 16px 16px;border-radius:24px;background:var(--card);border:2px solid var(--line);box-shadow:0 6px 0 var(--line)}
.au-raison{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;font-weight:800;color:var(--ogre-d,#3f7c00)}
.au-raison i{font-size:1.2rem}.au-raison small{flex-basis:100%;font-weight:700;color:var(--soft,#777)}
.au2 .au-carte h2{font-family:var(--display,inherit);font-size:1.45rem;line-height:1.2;margin:0;color:var(--ink)}
.au2 .au-go{min-height:62px;font-family:var(--display,inherit);font-size:1.35rem;letter-spacing:.02em;border-radius:18px;background:var(--ogre,#58a700);box-shadow:0 6px 0 var(--ogre-d,#3f7c00)}
.au2 .au-b{min-height:52px;color:var(--ink);background:var(--card);font-size:.9rem;line-height:1.15}
.au-autre-l{align-self:center;min-height:44px;padding:6px 12px;border:0;background:none;color:var(--soft,#6b6b6b);font:inherit;font-weight:800;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.au-choix3{display:flex;flex-direction:column;gap:10px}
.au-c3{display:flex;align-items:center;gap:14px;min-height:70px;padding:12px 16px;border:2px solid var(--line);border-radius:20px;background:var(--card);color:var(--ink);font:inherit;text-align:left;box-shadow:0 5px 0 var(--line);cursor:pointer}
.au-c3 b{font-family:var(--display,inherit);font-size:1.08rem;line-height:1.2}.au-c3e{font-size:1.9rem;line-height:1}
.au-c3:first-child{background:var(--ogre,#58a700);border-color:var(--ogre-d,#3f7c00);box-shadow:0 5px 0 var(--ogre-d,#3f7c00);color:#fff}
.au-c3:active{transform:translateY(4px);box-shadow:none}
/* import de l'agenda (agenda-import.js) */
.ag .ie-in{display:flex;flex-direction:column;gap:12px}
.ag-fichier{cursor:pointer}
.ag-liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ag-liste li{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px;border:2px solid var(--line);border-radius:16px;background:var(--card)}
.ag-liste li label{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-weight:800}
.ag-liste small{grid-column:1/-1;color:var(--soft,#6b6b6b)}
.ag-liste input.ag-mat,.ag-liste input.ag-date,.ag-form input:not([type=radio]){min-width:0;font:inherit;padding:8px;border-radius:10px;border:2px solid var(--line);background:var(--paper);color:var(--ink)}
.ag-type{padding:2px 10px;border-radius:999px;font-size:.8rem}.ag-controle{background:color-mix(in srgb,var(--berry,#ff4b4b) 18%,transparent)}.ag-devoir{background:color-mix(in srgb,var(--sky,#1cb0f6) 18%,transparent)}
.ag-form{display:flex;flex-direction:column;gap:10px}.ag-form label{display:flex;flex-direction:column;gap:4px;font-weight:800}.ag-form .ag-radio{flex-direction:row;align-items:center;gap:8px}
.ag-attente{height:6px;border-radius:3px;background:linear-gradient(90deg,var(--ogre,#58a700) 30%,var(--line) 30%);animation:agA 1.2s linear infinite;background-size:200% 100%}
@keyframes agA{to{background-position:-200% 0}}
.au-mie{font-size:1.35rem;width:28px;text-align:center}

/* raccourcis de la home (29/10 soir) : langues et programme, toujours là, même sans cahier de texte ni contrôle */
.au-racc{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.au-rc{display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;padding:8px;border:2px solid var(--line,#e5e0d6);border-radius:14px;background:var(--card,#fff);color:var(--ink,inherit);font:inherit;font-weight:800;font-size:.92rem;box-shadow:0 4px 0 var(--line,#e5e0d6);cursor:pointer}

/* 30/10 (fondateur : « on reste clean ») : rien qui flotte par-dessus le contenu */
.au-menu-in{max-height:100%;overflow-y:auto;overscroll-behavior:contain}
.au-retour{position:static!important;margin:8px 0 8px 10px;width:max-content}
.g-fab,.ie-bande,.ie-pastille,.ce-rappel{display:none!important}

.ag .cp-h2{margin:6px 0 2px;text-align:center}.ag .cp-conseils{margin:0}.ag .cp-nom{margin:0}
.ag-src{display:flex;flex-direction:column;gap:12px}.ag-src .au-c3{min-height:60px}.ag-src .au-c3e{font-size:1.5rem}
.ag .cp-max{margin:2px 0 0}.ag-mainl{align-self:center;min-height:44px}.ag-fond{text-align:center;font-weight:800}
.ag-pop{position:relative}.ag-pop .btn{width:100%;margin:0;display:flex;align-items:center;justify-content:center;gap:8px}
.ag-popx{position:absolute;top:8px;right:8px;width:44px;height:44px;border:0;background:none;color:var(--soft);font-size:1.15rem;cursor:pointer;border-radius:50%}

/* Ogrelo · écran d'accueil / connexion (pronote-ui.js connectFlow('login') + sans-ent.js).
   Deux en-têtes au choix (ENTETE_DEFAUT dans pronote-ui.js, ou ?entete=a|b pour comparer) :
   - .l-v-b (par défaut) : la classe d'Ogrelo en image, comme l'Accueil, puis une feuille blanche arrondie qui remonte dessus ;
   - .l-v-a : bandeau vert (logo, nom, slogan, FR | EN, pastilles), tout dans le flux (rien en position absolue sur du texte).
   Accueil : Ogrelo en grand + bulle, deux grosses tuiles en relief (élève / prof), puis un écran par choix ; tuiles des applis sans logo de marque. Clair + sombre, 320 à 430 px d'abord.
   Android : Chrome agrandit le texte selon la taille de police du téléphone (iPhone non) ; tout doit pouvoir passer à la ligne sans se chevaucher. */

/* ---------- en-tête B : la classe d'Ogrelo (même image que l'Accueil) ---------- */
.l-v-b.l-head{position:relative;margin:-12px -16px 0;height:clamp(148px,42vw,200px);overflow:hidden;background:color-mix(in srgb,var(--sky) 22%,var(--paper))}
.l-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:64% 42%;display:block}
.l-sombre{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .l-clair{display:none}:root:not([data-theme="light"]) .l-sombre{display:block}}
:root[data-theme="dark"] .l-clair{display:none}:root[data-theme="dark"] .l-sombre{display:block}
@media (max-width:640px){.l-head{width:100vw;margin-left:calc(50% - 50vw)!important;margin-right:0!important}}
@media (min-width:641px){.l-head{border-radius:0 0 28px 28px}}
/* onglets blancs suspendus au haut de l'écran, comme « Bonsoir, Mike ! » */
.l-v-b .l-brand,.l-v-b .l-lg{position:absolute;top:env(safe-area-inset-top,0px);z-index:2;margin:0;background:var(--sheet);color:var(--ink);border-radius:0 0 14px 14px;box-shadow:0 4px 10px rgba(0,0,0,.14)}
.l-v-b .l-brand{left:12px;max-width:calc(100% - 130px);display:flex;align-items:center;gap:7px;padding:6px 14px 7px 8px}
.l-logo{width:30px;height:30px;flex:none;display:grid;place-items:center}
.l-logo svg{width:100%;height:100%}
.l-v-b .l-brand b{font-family:var(--display);font-weight:800;font-size:1.12rem;line-height:1}
.l-v-b .l-lg{right:12px;padding:5px}
.l-lg{display:flex;gap:2px;flex:none}
.l-lg button{border:0;background:none;color:var(--soft);font:inherit;font-weight:800;font-size:.8rem;line-height:1;border-radius:9px;padding:7px 10px;min-width:36px;cursor:pointer}
.l-lg button.on{background:var(--ogre-d);color:#fff}
.l-lg button:focus-visible{outline:3px solid var(--sky);outline-offset:1px}

/* ---------- en-tête A : bandeau vert, affiné ---------- */
.l-v-a.l-head{margin:-12px -16px 0;padding:calc(14px + env(safe-area-inset-top,0px)) 16px 14px;background:linear-gradient(160deg,var(--ogre),var(--ogre-d));color:#fff;border-radius:0 0 24px 24px;box-shadow:0 4px 0 color-mix(in srgb,var(--ogre-d) 35%,transparent)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .l-v-a.l-head{background:linear-gradient(160deg,#3E7F31,#2B5C22);box-shadow:none}}
:root[data-theme="dark"] .l-v-a.l-head{background:linear-gradient(160deg,#3E7F31,#2B5C22);box-shadow:none}
.l-a-top{display:flex;align-items:center;gap:10px}
.l-v-a .l-logo{width:42px;height:42px;background:#fff;border-radius:14px;padding:3px;box-sizing:border-box;box-shadow:0 2px 0 rgba(0,0,0,.12)}
.l-a-top>b{flex:1;min-width:0;font-family:var(--display);font-weight:800;font-size:1.45rem;line-height:1.05}
.l-v-a .l-slogan{font-family:var(--body);font-weight:700;font-size:.95rem;line-height:1.35;margin:10px 0 0;color:#fff;opacity:.92}
.l-v-a .l-lg{padding:3px;border-radius:12px;background:rgba(255,255,255,.16);border:1.5px solid rgba(255,255,255,.3)}
.l-v-a .l-lg button{color:#fff;opacity:.85;border-radius:9px}
.l-v-a .l-lg button.on{background:#fff;color:var(--ogre-d);opacity:1}
.l-v-a .l-lg button:focus-visible{outline-color:#fff}
.l-v-a .l-pts{margin:12px 0 0}
.l-v-a .l-pts li,.l-v-a .l-pts li.fort{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.14);color:#fff}
.l-v-a .l-pts li.fort{background:rgba(255,255,255,.24)}
.l-v-a .l-pts li i{color:#fff!important}

/* ---------- la feuille ---------- */
body:has(>#app>.l-sheet.l-v-b){background:var(--sheet)}
.l-sheet{position:relative;margin:-26px -16px -40px;background:var(--sheet);border-radius:28px 28px 0 0;padding:22px 16px calc(32px + env(safe-area-inset-bottom,0px));min-height:calc(100vh - 120px);box-shadow:0 -6px 20px rgba(0,0,0,.06)}
@media (min-width:641px){.l-sheet{border-radius:28px;min-height:0;margin-bottom:0}}
.l-sheet.l-v-a{margin:0 -16px;background:none;box-shadow:none;border-radius:0;min-height:0;padding-top:18px}
.l-v-b .l-slogan{font-family:var(--display);font-size:1.28rem;line-height:1.2;font-weight:800;margin:0 0 10px;color:var(--ink)}

/* ce qu'Ogrelo fait : petites étiquettes calmes, 2 lignes (texte à taille normale) */
.l-pts{list-style:none;display:flex;flex-wrap:wrap;gap:5px 4px;margin:0 0 16px;padding:0}
.l-pts li{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;border:1px solid var(--line);background:var(--sheet);color:var(--soft);border-radius:999px;font-weight:700;font-size:clamp(.64rem,2.8vw,.84rem);line-height:1.5;padding:2px clamp(6px,1.7vw,10px)}
@media (max-width:340px){.l-pts{gap:4px 3px}.l-pts li{gap:3px;padding:2px 5px}}
.l-pts li i{width:1.15em;height:1.15em;flex:none;color:var(--ogre-d)}
.l-pts li.fort{color:var(--ink);border-color:color-mix(in srgb,var(--ogre) 35%,var(--line));background:color-mix(in srgb,var(--ogre) 9%,var(--sheet))}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .l-pts li i{color:var(--ogre)}}
:root[data-theme="dark"] .l-pts li i{color:var(--ogre)}

/* ---------- cartes des connexions (fenêtre plein écran) : même dessin que les cartes de l'Accueil ---------- */
.l-sheet #pQrHelp,.l-sheet #pEd>.blk,.l-sheet #pSko>.blk,.l-sheet #pSansEnt>.blk{background:var(--card);border:2px solid var(--line);border-radius:22px;box-shadow:0 4px 0 var(--line);padding:18px 16px;margin:0 0 16px}
.r-pas-eleve #pEd,.r-pas-eleve #pChg,.r-pas-eleve #pQrZone,.r-pas-eleve .pr-rassure{display:none!important}

/* ---------- l'accueil : Ogrelo en grand, puis deux grosses tuiles en relief (style Duolingo, jetons de tuiles.css) ---------- */
.l-v-b .l-slogan{text-align:center;font-size:clamp(1.12rem,5.2vw,1.3rem);margin:2px auto 14px;max-width:24ch;text-wrap:balance}
/* Ogrelo accueille : grosse tête qui se balance doucement, LA bulle commune (bulles.css) */
.l-sheet .l-hero{display:flex;align-items:flex-end;gap:12px;margin:0 0 26px}
.l-sheet .l-hero .ogre{width:84px;height:84px;flex:none;transform-origin:50% 90%;animation:lxPop .5s cubic-bezier(.2,1.5,.4,1) both,lxBob 3.6s ease-in-out .6s infinite}
.l-sheet .l-hero .bubble{flex:1;min-width:0;max-width:none}
.l-sheet .l-hero .bubble p{font-size:1.12rem;line-height:1.35}
.l-sheet .l-hero .bubble .big{font-size:1.18rem}
@keyframes lxPop{from{opacity:0;transform:scale(.6) rotate(-8deg)}}
@keyframes lxBob{0%,100%{transform:none}50%{transform:translateY(-4px) rotate(-2deg)}}
@keyframes lxIn{from{opacity:0;transform:translateY(14px)}}
@keyframes lxSlide{from{opacity:0;transform:translateX(18px)}}

/* les deux choix : élève (vert plein, l'action principale) et prof (bleu-violet calme) */
.lx{margin:0 0 8px}
.lx-step{display:flex;flex-direction:column;gap:16px}
.lx-step[hidden]{display:none}
.r-pan{animation:lxSlide .3s cubic-bezier(.2,1,.4,1) both}
.lx-role{--rc:#58A93F;--rd:#3D7F2B;position:relative;display:flex;align-items:center;gap:14px;width:100%;min-height:96px;margin:0;padding:16px 16px 16px 14px;
  border:2px solid var(--rd);border-radius:22px;font:inherit;text-align:left;cursor:pointer;color:#fff;
  background:linear-gradient(160deg,color-mix(in srgb,var(--rc) 88%,#fff),var(--rc));box-shadow:0 6px 0 var(--rd);
  transition:transform .08s ease,box-shadow .08s ease;animation:lxIn .45s cubic-bezier(.2,1.2,.4,1) both;animation-delay:calc(.12s + var(--d,0)*.08s);-webkit-tap-highlight-color:transparent}
.lx-role:active{transform:translateY(5px);box-shadow:0 1px 0 var(--rd)}
.lx-role:focus-visible,.plat-c:focus-visible,.lx-back:focus-visible,.lx-demo:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.lx-ic{flex:none;width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.22);box-shadow:inset 0 -3px 0 rgba(0,0,0,.12)}
.lx-ic svg{width:34px;height:34px}
.lx-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.lx-tx b{font-family:var(--display);font-weight:800;font-size:1.32rem;line-height:1.1;text-shadow:0 2px 0 rgba(0,0,0,.14)}
.lx-tx small{font-weight:700;font-size:.9rem;line-height:1.3;opacity:.95}
.lx-fl{width:22px;height:22px;flex:none;opacity:.9}
.lx-prof{--rc:#6A6FE0;--rd:#4C50B8;color:var(--lxp-ink,#2E2F7A);background:var(--lxp-bg,#EEEFFF);border-color:var(--lxp-bd,#C9CBF6);box-shadow:0 6px 0 var(--lxp-bd,#C9CBF6)}
.lx-prof:active{box-shadow:0 1px 0 var(--lxp-bd,#C9CBF6)}
.lx-prof .lx-ic{background:var(--rc);color:#fff;box-shadow:inset 0 -3px 0 var(--rd)}
.lx-prof .lx-tx b{text-shadow:none}
.lx-prof .lx-tx small{color:var(--lxp-soft,#5A5C9C);opacity:1}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .lx-prof{--lxp-bg:#2B2C52;--lxp-bd:#45478A;--lxp-ink:#E9EAFF;--lxp-soft:#B9BBEE}
  :root:not([data-theme="light"]) .lx-eleve{--rc:#4E9A37;--rd:#2F6A22}}
:root[data-theme="dark"] .lx-prof{--lxp-bg:#2B2C52;--lxp-bd:#45478A;--lxp-ink:#E9EAFF;--lxp-soft:#B9BBEE}
:root[data-theme="dark"] .lx-eleve{--rc:#4E9A37;--rd:#2F6A22}

/* mode démo : un lien franc mais discret sous les deux choix */
.demo-z{text-align:center;margin:0;animation:lxIn .45s ease both;animation-delay:.36s}
.lx-demo{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 18px;border:0;border-radius:999px;background:none;font:inherit;font-weight:800;font-size:.98rem;color:var(--ogre-d);cursor:pointer}
.lx-demo i{width:18px;height:18px}
.lx-demo:active{background:color-mix(in srgb,var(--ogre) 12%,transparent)}
.r-demo-prof{margin-top:22px}
.lx-demo-c{border:2px solid var(--ogre);color:var(--ogre-d)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .lx-demo{color:var(--ogre)}}
:root[data-theme="dark"] .lx-demo{color:var(--ogre)}

/* un écran par choix : flèche de retour + titre */
.lx-tete{display:flex;align-items:center;gap:12px;margin:0}
.lx-tete b{font-family:var(--display);font-weight:800;font-size:1.2rem;line-height:1.2;min-width:0}
.lx-back{flex:none;width:48px;height:48px;border-radius:16px;display:grid;place-items:center;border:2px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;box-shadow:0 4px 0 var(--duo-ombre,var(--line));transition:transform .08s ease,box-shadow .08s ease}
.lx-back:active{transform:translateY(3px);box-shadow:0 1px 0 var(--duo-ombre,var(--line))}
.lx-back i{width:22px;height:22px}
.lx-aide{margin:-4px 0 0;color:var(--soft);font-weight:700;font-size:.95rem;line-height:1.45}

/* les applis du collège : une tuile par ligne, pastille de couleur (pas de logo de marque), flèche */
.plat-b{display:flex;flex-direction:column;gap:14px}
/* 1er écran : Pronote et École Directe directement visibles, côte à côte, sous « Je suis élève » */
.plat-b.lx-ent{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#pChoix .lx-ent .plat-c{min-height:64px;padding:8px;gap:8px}
#pChoix .lx-ent .plat-c::after{display:none}
.se-rep-ent+.lx-ent .plat-c{min-height:48px;justify-content:center}.se-rep-ent+.lx-ent .plat-tx{align-items:center}
#pChoix .lx-ent .plat-ic{width:34px;height:34px;border-radius:11px}#pChoix .lx-ent .plat-ic svg{width:20px;height:20px}
#pChoix .lx-ent .plat-tx b{font-size:.98rem}#pChoix .lx-ent .plat-tx small{display:none}
#pChoix .plat-c{--pc:var(--ogre);position:relative;display:flex;flex-direction:row;align-items:center;gap:14px;width:100%;min-height:76px;margin:0;padding:12px 16px 12px 12px;
  border:2px solid var(--line)!important;border-radius:20px;background:var(--card);color:var(--ink);font:inherit;text-align:left;cursor:pointer;
  box-shadow:0 5px 0 var(--duo-ombre,var(--line))!important;transition:transform .08s ease,box-shadow .08s ease,border-color .15s;
  animation:lxIn .4s cubic-bezier(.2,1.2,.4,1) both;animation-delay:calc(.08s + var(--d,0)*.07s);-webkit-tap-highlight-color:transparent}
#pChoix .plat-c:not(.plat-off)::after{content:"";flex:none;width:22px;height:22px;margin-left:auto;background:var(--soft);-webkit-mask:var(--gi-droite) center/contain no-repeat;mask:var(--gi-droite) center/contain no-repeat}
#pChoix .plat-c:not(.plat-off):active{transform:translateY(4px);box-shadow:0 1px 0 var(--duo-ombre,var(--line))!important}
#pChoix .plat-c:not(.plat-off):hover{border-color:color-mix(in srgb,var(--pc) 55%,var(--line))!important}
#pChoix .plat-c.deja{border-color:color-mix(in srgb,var(--pc) 70%,var(--line))!important}
#pChoix .plat-ic{width:52px;height:52px;flex:none;border-radius:16px;display:grid;place-items:center;background:var(--pc);color:#fff;box-shadow:inset 0 -3px 0 rgba(0,0,0,.18)}
#pChoix .plat-ic svg{width:30px;height:30px}
#pChoix .plat-se{--pc:#FFF1C9}
#pChoix .plat-ic.plat-ogre{background:#FFF1C9;overflow:hidden;padding:0}
.plat-tx{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.plat-tx b{font-family:var(--display);font-weight:800;font-size:1.12rem;line-height:1.2;color:var(--ink)}
.plat-tx small{font-size:.86rem;line-height:1.3;font-weight:700;color:var(--soft);text-align:left;margin:0}
.plat-ic{width:40px;height:40px;flex:none;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--ogre) 12%,var(--card));color:var(--ogre-d);font-size:1.2rem}
.plat-ic i{width:20px;height:20px}
.plat-ic.petit{width:34px;height:34px;border-radius:10px;font-size:1.05rem}.plat-ic.petit i{width:18px;height:18px}
#pChoix .plat-c.plat-off{border-style:dashed!important;background:color-mix(in srgb,var(--ink) 4%,var(--card));cursor:not-allowed;box-shadow:none!important;transform:none}
#pChoix .plat-c.plat-off .plat-ic{background:color-mix(in srgb,var(--ink) 10%,var(--card));color:var(--soft);box-shadow:none}
.plat-c.plat-off .plat-tx b{color:var(--soft)}
.plat-c.plat-off .r-ent-etat{margin-left:auto;align-self:center}
/* « Reprendre mon compte » : lien discret mais trouvable */
.l-sheet .se-reprendre{text-align:center;margin:0}
.l-sheet .se-reprendre .linkbtn2,.l-sheet .plat-chg .linkbtn2{display:inline-flex;align-items:center;gap:6px;min-height:48px;font-weight:800;font-size:.95rem;color:var(--ogre-d);text-decoration:none}
.l-sheet .se-reprendre i{width:16px;height:16px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .l-sheet .se-reprendre .linkbtn2,:root:not([data-theme="light"]) .l-sheet .plat-chg .linkbtn2{color:var(--ogre)}}
:root[data-theme="dark"] .l-sheet .se-reprendre .linkbtn2,:root[data-theme="dark"] .l-sheet .plat-chg .linkbtn2{color:var(--ogre)}

/* « Changer d'appli » : petite flèche de retour, en haut à gauche, comme les écrans Ogrelo */
.plat-chg{text-align:left;margin:0 0 12px}
.l-sheet .plat-chg .linkbtn2{padding:7px 14px 7px 9px;border-radius:999px;background:color-mix(in srgb,var(--ink) 5%,var(--sheet));color:var(--ink)}
.plat-chg i{width:16px;height:16px}

/* ---------- espace prof ---------- */
.r-ent{display:grid;grid-template-columns:auto 1fr;column-gap:10px;row-gap:3px;align-items:center;width:100%;min-height:52px;padding:9px 12px;border:2px dashed var(--line);border-radius:16px;background:color-mix(in srgb,var(--ink) 4%,var(--card));color:var(--soft);font:inherit;font-weight:800;text-align:left;cursor:not-allowed}
.r-ent-ic{grid-row:span 2;flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--ink) 8%,var(--card))}.r-ent-ic i{width:18px;height:18px}
.r-ent-t{min-width:0;line-height:1.25;align-self:end}
.r-ent-etat{justify-self:start;align-self:start;flex:none;font-size:.7rem;font-weight:800;padding:3px 8px;border-radius:999px;color:var(--t-warn,#8A5A00);background:var(--t-warn-bg,#FFF1D6);white-space:nowrap}
.r-ou{display:flex;align-items:center;gap:10px;margin:0;color:var(--soft);font-size:.8rem;font-weight:700}.r-ou::before,.r-ou::after{content:"";flex:1;height:1px;background:var(--line)}
.r-mail{display:block;width:100%;min-height:52px;box-sizing:border-box;font:inherit;font-size:1.05rem;padding:12px 16px;border:2px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink);margin:0}
.r-mail:focus{outline:none;border-color:#6A6FE0;box-shadow:0 0 0 3px color-mix(in srgb,#6A6FE0 25%,transparent)}
.r-err{min-height:1.1em;margin:-8px 0 0;color:var(--ko,#C2362C);font-weight:700;font-size:.85rem}.r-err:empty{display:none}
.r-go{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;margin:0;width:100%}
.r-go i{width:18px;height:18px}
#rPan-prof .r-go{background:#5B60D6;border-color:#5B60D6;color:#fff;box-shadow:0 5px 0 #3E42A8}
#rPan-prof .r-go:not(:disabled):active{transform:translateY(4px);box-shadow:0 1px 0 #3E42A8}
.r-mail:disabled,.r-go:disabled{opacity:.45;cursor:default;transform:none}

/* bas de page : la phrase qui rassure, puis les liens légaux, discrets */
.r-etape .l-hero{margin-bottom:20px}
@media (prefers-reduced-motion:reduce){.l-sheet .l-hero .ogre,.lx-role,.r-pan,.demo-z,#pChoix .plat-c{animation:none!important}.lx-role,.lx-back,#pChoix .plat-c{transition:none}}


/* ---------- Pronote choisi ---------- */
.l-sheet #pQrHelp .steps li::before,.l-modal .steps li::before{background:var(--ogre-d)}
.pr-pin{text-align:center;margin:10px 0}
.pr-pin span{display:inline-block;font-family:var(--display);font-weight:800;font-size:2.3rem;line-height:1.2;letter-spacing:.32em;padding:4px 6px 4px calc(6px + .32em);background:var(--paper);border:3px dashed var(--line);border-radius:16px;color:var(--ink)}
.l-sheet .qr-btns{margin:0 0 12px}
.l-sheet .qr-btns .btn i{width:20px;height:20px}
.l-sheet #pGo{margin:0 0 6px}
.l-sheet #pMsg:empty{display:none}

/* ---------- Ogrelo sans ENT ---------- */
.l-sheet .se-c{border:2px solid var(--line);border-radius:18px;background:var(--card);box-shadow:0 3px 0 var(--line);padding:12px}
.l-sheet .se-c:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}
.l-sheet .se-tete{margin:0 0 14px}
.l-sheet .se-choix{margin:0}
.l-sheet .se-tete b{font-family:var(--display);font-size:1.12rem}

/* ---------- bas de page ---------- */
.l-sheet .pr-rassure{margin:28px auto 0;max-width:34ch;font-size:.84rem;line-height:1.45;color:var(--soft);text-align:center}
.l-sheet .l-legal{margin:12px 0 0;font-size:.78rem;text-align:center;color:var(--soft)}
.l-sheet .l-legal a{color:var(--soft);text-decoration:none;display:inline-block;padding:6px 2px}
.l-sheet .l-legal a:hover{text-decoration:underline}

/* ---------- connexions en plein écran (Pronote, École Directe, Ogrelo, Reprendre mon compte) : même fenêtre que .cm ---------- */
body:has(#lModal:not([hidden])){overflow:hidden}
.l-modal{z-index:80;text-align:left}
.l-modal .cm-in{max-width:520px}
.l-modal .cm-top{position:sticky;top:0;z-index:2;margin:calc(-12px - env(safe-area-inset-top,0px)) -16px 14px;padding:calc(12px + env(safe-area-inset-top,0px)) 16px 10px;background:var(--paper)}
.l-modal .cm-top b{flex:1;min-width:0;line-height:1.2}
.l-modal .cm-x i{width:20px;height:20px}
.l-modal .cm-x:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.l-sheet .l-modal .pr-et .blk{background:var(--card);border:2px solid var(--line);border-radius:22px;box-shadow:0 4px 0 var(--line);padding:18px 16px;margin:0 0 6px}
.l-modal #pEd .ed-t{display:none}   /* le titre est déjà dans la barre du haut */
.l-modal #pEd>.blk,.l-modal #pSko>.blk,.l-modal #pSansEnt>.blk{margin-bottom:6px}
.l-modal .se-tete b{font-size:1.05rem}
/* Pronote : barre d'avancement, une étape par écran */
.pr-prog{margin:0 0 14px}.pr-prog .cm-n{margin:6px 0 0;text-align:left}
.pr-et .steps{margin:0}
.pr-et .tuto{margin:16px 0 0}
.pr-et .pr-pin{margin:16px 0 4px}
.pr-et .pr-pin span{font-size:clamp(2.2rem,12vw,2.8rem)}
.l-modal .qr-btns{margin:16px 0 0}
.l-modal .qr-btns .btn{display:flex;margin:0;width:100%;min-width:0}
.pr-nav{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin:18px 0 8px}
.pr-nav.seul{grid-template-columns:1fr}
.l-modal .pr-nav .btn{display:flex;align-items:center;justify-content:center;gap:8px;margin:0;width:100%;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:8px;padding-right:8px}
.l-modal .pr-nav .btn[hidden]{display:none}
.pr-nav .btn i{width:18px;height:18px;flex:none}
.l-modal #pMsg{text-align:center;line-height:1.45}
.l-m-pied{text-align:center;color:var(--soft);max-width:36ch;margin:16px auto 0;line-height:1.45}
/* élève qui revient : l'écran des applis s'ouvre directement, son appli est repérée (voir #pChoix .plat-c.deja) */
/* « Comment trouver mon QR code ? » : lien sous le tuto, puis les images en grand */
.pr-tuto-l{text-align:center;margin:12px 0 0}
.pr-tuto-l .linkbtn2{display:inline-flex;align-items:center;gap:6px;font-weight:800;color:var(--ogre-d);text-decoration:none}
.pr-tuto-l i{width:16px;height:16px}
.pr-tuto-l{display:flex;justify-content:center;align-items:center;gap:8px}.pr-tuto-l[hidden]{display:none}
/* mis en avant : pastille verte qui pulse + doigt qui pointe dessus (immobiles si l élève préfère moins d animations) */
.pr-tuto-l .linkbtn2{padding:10px 18px;border-radius:999px;background:color-mix(in srgb,var(--ogre) 16%,transparent);border:2px solid var(--ogre);white-space:nowrap;font-size:.95rem;animation:prPulse 1.8s ease-out infinite}
.pr-tuto-l .pr-doigt{width:36px;height:36px;min-width:36px;flex:none;animation:prDoigt .9s ease-in-out infinite alternate}
@keyframes prPulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--ogre) 55%,transparent)}70%,100%{box-shadow:0 0 0 13px transparent}}
@keyframes prDoigt{from{transform:translateX(-6px)}to{transform:translateX(1px)}}
@media (prefers-reduced-motion:reduce){.pr-tuto-l .linkbtn2,.pr-tuto-l .pr-doigt{animation:none}}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pr-tuto-l .linkbtn2{color:var(--ogre)}}
:root[data-theme="dark"] .pr-tuto-l .linkbtn2{color:var(--ogre)}
body:has(.l-tuto-grand){overflow:hidden}
.l-tuto-grand{z-index:90}
.l-tuto-grand .cm-in{max-width:900px;display:flex;flex-direction:column;min-height:100%}
.l-tuto-grand .cm-top b{flex:1;min-width:0;line-height:1.2;font-size:1.08rem;text-wrap:balance}
.tuto-vue.grand{aspect-ratio:auto;flex:1;min-height:0;display:grid;place-items:center;background:none;border:0;border-radius:0;touch-action:pan-y pinch-zoom}
.tuto-vue.grand>img,.tuto-vue.grand>.tuto-svg{background:#fff;border-radius:16px;border:1px solid var(--line);overflow:hidden}
.tuto-vue.grand>img,.tuto-vue.grand>.tuto-svg{width:100%;height:auto;max-height:calc(100dvh - 190px);object-fit:contain}
.tuto-vue.grand .tuto-svg svg{width:100%;height:auto;max-height:calc(100dvh - 190px)}
.l-tuto-grand .tuto-nav{margin-top:14px}
.l-tuto-grand .tg-n{display:flex;align-items:center;gap:6px}.l-tuto-grand .tg-n i{width:8px;height:8px;border-radius:50%;background:var(--line)}.l-tuto-grand .tg-n i.on{background:var(--ogre-d);width:20px;border-radius:6px}.l-tuto-grand .tg-n b{margin-left:6px;font-size:.85rem;color:var(--soft)}

/* Pronote : un seul écran, pas de barre d'étapes ni de Suivant / Retour, pas de carrousel dans la page (seulement en grand, via le lien) */
#pQrZone .pr-prog,#pQrZone #pEtPrev,#pQrZone #pEtNext,#pQrZone #pTuto{display:none!important}
#pQrZone .pr-et+.pr-et{margin-top:10px}
#pQrZone .pr-tuto-l{margin:14px 0 4px}
/* « Voir la vidéo (30 s) » : lien secondaire sous « Comment trouver mon QR code ? » (le bouton qui pulse reste le seul à attirer l'œil) */
.pr-video-l{display:flex;justify-content:center;margin:2px 0 0}
.pr-video-l .linkbtn2{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:6px 12px;font-weight:700;font-size:.92rem;color:var(--ogre-d);text-decoration:underline;text-underline-offset:3px}
.pr-video-l .pr-play{width:22px;height:22px;flex:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pr-video-l .linkbtn2{color:var(--ogre)}}
:root[data-theme="dark"] .pr-video-l .linkbtn2{color:var(--ogre)}
.l-video .cm-in{max-width:960px}
.l-video-z{flex:1;min-height:0;display:grid;place-items:center}
.l-video-z video{display:block;width:100%;height:auto;max-height:calc(100dvh - 170px);aspect-ratio:16/9;background:#000;border-radius:16px;object-fit:contain}
.l-video-z.v video{aspect-ratio:9/16;width:auto;max-width:100%}
.l-video-off{text-align:center;margin:12px 0 0;font-size:.9rem}
.l-video-off a{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--soft);font-weight:700}
.l-video-off i{width:16px;height:16px}
#pQrZone .pr-nav{display:block}#pQrZone .pr-nav #pGo{width:100%}

/* surligneur : « sur le site Pronote » dans l'aide du QR code ; fond clair + texte foncé, lisible en clair comme en sombre */
/* (html:root… : passe devant le surligneur commun de cartes.css et sa version sombre) */
html:root mark.hl{font-weight:800;border-radius:6px;padding:1px 5px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
html:root mark.hl.hl-site{background:#FFE14D;color:#2A2100}

/* le logo et le nom ramènent à la page de présentation (parents, curieux) */
.l-home{display:inline-flex;align-items:center;gap:inherit;color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;border-radius:12px}
.l-home:focus-visible{outline:2px solid #3E7F31;outline-offset:3px}

/* écran élève de la connexion : le mode démo bien visible, sous « Reprendre mon compte » */
.r-demo-eleve{margin:14px 0 4px}
.lx-demo.lx-demo-fort{width:100%;max-width:420px;min-height:54px;font-size:1.04rem;background:color-mix(in srgb,var(--ogre) 14%,transparent);border:2px solid var(--ogre);box-shadow:0 3px 0 color-mix(in srgb,var(--ogre-d) 45%,transparent)}
.lx-demo.lx-demo-fort:active{transform:translateY(2px);box-shadow:0 1px 0 color-mix(in srgb,var(--ogre-d) 45%,transparent)}

/* capture Pronote : version claire et sombre selon le thème, plus d air autour */
.pn-court .pn-dit{margin:16px 0 14px}.pn-court .pr-pin{margin:14px 0 18px}
.pn-court .pn-img{margin:0 0 18px;border-radius:14px;box-shadow:0 2px 10px rgba(0,0,0,.16)}
.pn-court .pn-sombre{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pn-court .pn-clair{display:none}:root:not([data-theme="light"]) .pn-court .pn-sombre{display:block}}
:root[data-theme="dark"] .pn-court .pn-clair{display:none}:root[data-theme="dark"] .pn-court .pn-sombre{display:block}
html.co-direct #pChoix,html.co-direct .l-head,html.co-direct .l-hero{visibility:hidden}

/* écran Scanner / Photo / Galerie : une bulle de Grignon, trois grandes cartes */
html body #pQrZone [data-et="3"] .blk{background:none!important;border:0!important;box-shadow:none!important;padding:0}
#pQrZone .qr-dit{margin:6px 0 18px}
#pQrZone .qr-cartes{display:grid;gap:14px;grid-template-columns:1fr}
#pQrZone .qr-carte{display:flex;align-items:center;gap:14px;width:100%;min-height:84px;padding:14px 16px;margin:0;text-align:left;border-radius:20px;cursor:pointer;white-space:normal}
.qr-i{flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center}
.qr-i svg,.qr-i i{width:28px;height:28px}
.qr-i.c-a{background:rgba(255,255,255,.22);color:#fff}
.qr-i.c-b{background:color-mix(in srgb,#2E7DD7 18%,transparent);color:#2E7DD7}
.qr-i.c-c{background:color-mix(in srgb,#8E44EC 16%,transparent);color:#8E44EC}
.qr-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.qr-tx b{font-family:var(--display);font-size:1.12rem;line-height:1.15}
.qr-tx small{font-size:.84rem;font-weight:600;line-height:1.25;opacity:.8}
.qr-fl{flex:none;width:20px;height:20px;opacity:.7}
.qr-retour{margin:2px 0 4px;text-align:left}.qr-retour .linkbtn2{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:800}.qr-retour i{width:18px;height:18px}
/* étape 3 Pronote : la flèche retour à gauche du titre */
.qr-tete{display:flex;align-items:center;gap:10px}.qr-tete .steps{flex:1;min-width:0;margin:0}.qr-fleche{flex:none;width:40px;height:40px;border:2px solid var(--line);border-radius:50%;display:grid;place-items:center;background:var(--card);color:var(--ink);cursor:pointer}.qr-fleche i{width:20px;height:20px}

#pChg{display:none!important}
#pQrZone #pGo:disabled{display:none}

/* Ogrelo · exercice « Prononciation » (prononc.js) : un écran par étape, mots en couleur (vert / orange / rouge), sons d'un mot. */
.pn-tete{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.pn-son{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.9rem;padding:5px 11px;border-radius:999px;background:var(--t-info-bg);color:var(--t-info)}
.pn-accent{display:inline-flex;border-radius:999px;background:var(--t-mute-bg);padding:2px}
.pn-accent button{border:0;background:none;font:inherit;font-size:.82rem;padding:5px 10px;border-radius:999px;color:var(--t-mute)}
.pn-accent button[aria-pressed="true"]{background:var(--sheet);color:var(--navink);font-weight:700;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.pn-bulle{background:color-mix(in srgb,var(--ogre) 14%,var(--sheet));border-radius:16px;padding:12px 14px;margin:0 0 16px;line-height:1.4}
.pn-texte{font-family:var(--display);font-size:1.6rem;line-height:1.35;text-align:center;margin:8px 0 18px;overflow-wrap:anywhere}
.pn-texte.phrase,.pn-texte.virelangue,.pn-texte.intonation{font-size:1.3rem}
.pn-fl{vertical-align:-.1em;color:var(--t-info)}.pn-fl.bas{transform:scaleY(-1)}.pn-fl.plat{transform:rotate(45deg)}
.pn-paire{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:4px 0 18px}
.pn-carte{display:flex;flex-direction:column;align-items:center;gap:4px;border:2px solid var(--t-mute-bg);background:var(--sheet);border-radius:16px;padding:14px 8px;font:inherit;color:var(--navink);min-width:0}
.pn-carte b{font-family:var(--display);font-size:1.35rem;overflow-wrap:anywhere}.pn-carte small{font-size:.75rem;color:var(--t-mute)}
.pn-carte.cible{border-color:var(--t-info);background:var(--t-info-bg)}
.pn-ecoute{display:flex;gap:10px;margin:0 0 14px}.pn-ecoute .btn{flex:1;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.pn-astuce{margin:0 0 16px;border-radius:14px;background:var(--t-warn-bg);padding:10px 14px}.pn-astuce summary{cursor:pointer;font-weight:700;color:var(--t-warn)}
.pn-astuce p{margin:8px 0 2px;line-height:1.45}
.pn-atoi{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:1.05rem}
.pn-micro{margin:18px auto 10px}.pn-retour{display:block;margin:8px auto 0}
.pn-msg{font-weight:700;font-size:1.05rem;margin:0 0 12px;line-height:1.4}
.pn-simple{font-size:.85rem;color:var(--t-mute);background:var(--t-mute-bg);border-radius:10px;padding:7px 10px;margin:0 0 12px}
/* plafond du jour d'exercices notés : message de Grignon, positif, jamais bloquant */
.pn-plafond{font-size:.92rem;font-weight:600;background:var(--t-mute-bg);border-radius:10px;padding:8px 12px;margin:0 0 12px}
.pn-mots{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:6px 0 12px}
.pn-mot{font:inherit;font-family:var(--display);font-size:1.3rem;border:0;border-radius:12px;padding:6px 10px;border-bottom:3px solid transparent}
.pn-mot.vert{background:var(--t-good-bg);color:var(--t-good)}.pn-mot.orange{background:var(--t-warn-bg);color:var(--t-warn)}.pn-mot.rouge{background:var(--t-crit-bg);color:var(--t-crit)}
.pn-mot.sel{border-bottom-color:currentColor;transform:translateY(-1px)}
.pn-detail{border-radius:16px;padding:12px 14px;margin:0 0 14px;background:var(--sheet);border:2px solid var(--t-mute-bg)}
.pn-detail.rouge{border-color:var(--t-crit-bg)}.pn-detail.orange{border-color:var(--t-warn-bg)}.pn-detail.vert{border-color:var(--t-good-bg)}
.pn-detail>b{font-family:var(--display);font-size:1.2rem}.pn-detail p{margin:10px 0 0;line-height:1.45}
.pn-phs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pn-ph{display:flex;flex-direction:column;align-items:center;min-width:44px;padding:5px 8px;border-radius:10px;font-size:.95rem}
.pn-ph small{font-size:.72rem;opacity:.85}.pn-ph em{font-size:.7rem;font-style:normal}
.pn-ph.vert{background:var(--t-good-bg);color:var(--t-good)}.pn-ph.orange{background:var(--t-warn-bg);color:var(--t-warn)}.pn-ph.rouge{background:var(--t-crit-bg);color:var(--t-crit)}
.pn-int{display:flex;align-items:center;gap:8px;border-radius:12px;padding:8px 12px;margin:0 0 12px}.pn-int.ok{background:var(--t-good-bg)}.pn-int.ko{background:var(--t-warn-bg)}
.pn-progres{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 10px;margin:4px 0 14px;font-size:.9rem}
.pn-progres .ex-barre{grid-column:1/-1;margin:0}.pn-progres .ex-barre i{background:var(--t-good)}
.pn-badge{display:flex;align-items:center;gap:10px;border-radius:14px;padding:10px 14px;margin:0 0 14px;background:var(--t-good-bg);color:var(--t-good)}
.pn-compare{display:flex;gap:10px;margin:4px 0 12px}.pn-compare .btn{flex:1;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.an-sons{border-radius:16px;padding:12px 14px;margin:14px 0 4px;background:var(--t-info-bg)}
.an-sons b{display:block;color:var(--t-info)}.an-sons small{display:block;margin:2px 0 8px;color:var(--t-mute)}
.an-sons ul{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-wrap:wrap;gap:6px}.an-sons li{background:var(--sheet);border-radius:999px;padding:4px 10px;font-size:.88rem}
.pn-ecoute .btn,.pn-compare .btn,.pn-acts .btn{min-height:0;padding:12px 8px;font-size:.95rem;white-space:nowrap}
/* résultat de prononciation (fondateur, 25/10/2026) : score global en grand, un rond de score par mot, un conseil court ; aucune phonétique */
.pn-global{display:flex;align-items:baseline;justify-content:center;gap:2px;margin:6px auto 4px;font-family:var(--display);line-height:1}
.pn-global b{font-size:3.2rem}.pn-global small{font-size:1.3rem;font-weight:800}
.pn-global.vert{color:var(--t-good,#1B7A40)}.pn-global.orange{color:var(--t-warn,#8A5A00)}.pn-global.rouge{color:var(--t-crit,#B8322A)}
.pn-mots2{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 10px;margin:10px 0 14px}
.pn-m2{display:flex;flex-direction:column;align-items:center;gap:6px}
.pn-m2 b{font-family:var(--display);font-size:1.25rem}
.pn-rond{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font:800 .95rem/1 var(--display);color:#fff;box-shadow:0 3px 0 rgba(0,0,0,.18)}
.pn-rond small{font-size:.6rem;margin-left:1px}
.pn-m2.vert .pn-rond{background:#26890C}.pn-m2.orange .pn-rond{background:#C77700}.pn-m2.rouge .pn-rond{background:#D0242F}
.pn-conseil{display:flex;gap:8px;align-items:flex-start;background:var(--sheet,var(--card));border:2px solid var(--line);border-radius:16px;padding:10px 12px;margin:0 0 14px;line-height:1.4}

/* Ogrelo · espace « Langues » (public/langues.js). Couleurs : jetons de l'appli (mode sombre compris).
   Identité : une teinte par langue (--lc, drapeau SVG), une couleur par niveau du CECRL (--nc, pastille).
   Les quiz reprennent l'allure du quiz des fiches (.qcard, .opts/.opt, .feedback, .prog : index.html) ; ici, seulement l'audio en plus. */
.cz-lg{--c:#2E7DD7;display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:2px solid color-mix(in srgb,var(--c) 40%,var(--line));background:color-mix(in srgb,var(--c) 9%,var(--card));color:var(--ink);border-radius:22px;padding:16px;margin:0 0 16px;font:inherit;cursor:pointer}
.cz-lg .i{flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:1.5rem;background:var(--c);color:#fff}
.cz-lg .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.cz-lg b{font-family:var(--display);font-size:1.15rem}
.cz-lg small{color:var(--soft);overflow-wrap:anywhere}
.cz-lg .go{color:var(--soft)}

/* ---------- cadre ---------- */
.lg{--lg-r:20px;--lg-ombre:0 4px 0 color-mix(in srgb,var(--ink) 10%,transparent)}
.lg .cm-top{gap:8px}
.lg .lg-t{flex:1;min-width:0;font-family:var(--display);font-size:1.1rem;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lg-ret{width:42px;height:42px;border-radius:50%;border:2px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer;flex:none;visibility:hidden}
.lg .cm-corps>*,.lg-inl>*{animation:lgIn .32s ease both}
.lg .cm-corps>*:nth-child(2),.lg-inl>*:nth-child(2){animation-delay:.04s}.lg .cm-corps>*:nth-child(3),.lg-inl>*:nth-child(3){animation-delay:.08s}
.lg .cm-corps>*:nth-child(4),.lg-inl>*:nth-child(4){animation-delay:.12s}.lg .cm-corps>*:nth-child(n+5),.lg-inl>*:nth-child(n+5){animation-delay:.16s}
@keyframes lgIn{from{opacity:0;transform:translateY(8px)}}
.lg button{-webkit-tap-highlight-color:transparent}
.lg-lang,.lg-l2,.lg-go,.lg-u,.lg-tu,.lg-etapes button,.lg-lien,.lg-choix button{transition:transform .12s ease,box-shadow .12s ease,border-color .15s}
.lg-lang:active,.lg-l2:active,.lg-go:active,.lg-tu:active,.lg-etapes button:active,.lg-lien:active,.lg-u:not(:disabled):active{transform:translateY(2px) scale(.99);box-shadow:none}

/* ---------- drapeaux, pastilles de niveau ---------- */
.lg-drap{flex:none;display:block;width:42px;height:30px;border-radius:9px;overflow:hidden;box-shadow:0 0 0 2px var(--card),0 0 0 3.5px color-mix(in srgb,var(--ink) 14%,transparent)}
.lg-drap svg{display:block;width:100%;height:100%}
.lg-drap.g{width:56px;height:40px;border-radius:12px}
.lg-badge{--nc:#1F5FA8;flex:none;display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:linear-gradient(150deg,color-mix(in srgb,var(--nc) 78%,#fff),var(--nc) 60%);color:#fff;font-family:var(--display);font-weight:800;font-size:1.25rem;letter-spacing:.02em;box-shadow:0 4px 0 color-mix(in srgb,var(--nc) 55%,#000 20%),inset 0 -3px 0 rgba(0,0,0,.12);text-shadow:0 1px 1px rgba(0,0,0,.2)}
.lg-badge.s{width:40px;height:40px;border-radius:12px;font-size:.95rem;box-shadow:0 3px 0 color-mix(in srgb,var(--nc) 55%,#000 20%)}
.lg-badge.xl{width:88px;height:88px;border-radius:26px;font-size:2rem;margin:4px auto 10px}

/* ---------- Ogrelo parle ---------- */
.lg-dit{display:flex;gap:10px;align-items:flex-end;margin:6px 0 26px}
.lg-dit .f{flex:none;width:58px;height:58px}
.lg-dit .f svg{width:100%;height:100%}
.lg-attente{margin:16px 0}

/* chargement */
.lg-charge{display:flex;flex-direction:column;align-items:center;gap:6px;padding:48px 16px;text-align:center;color:var(--soft)}
.lg-charge .f{width:84px;height:84px;animation:lgFlotte 2.4s ease-in-out infinite}.lg-charge .f svg{width:100%;height:100%}
.lg-charge p{margin:0;font-weight:700}
.lg-points{display:inline-flex;gap:6px;align-items:center;height:14px}
.lg-points i{width:9px;height:9px;border-radius:50%;background:var(--ogre);animation:g-wave 1.2s ease-in-out infinite}
.lg-points i:nth-child(2){animation-delay:.15s}.lg-points i:nth-child(3){animation-delay:.3s}
@keyframes lgFlotte{50%{transform:translateY(-6px)}}

/* titres, aides */
.lg-h{font-family:var(--display);font-size:1.08rem;margin:30px 0 12px;display:flex;align-items:center;gap:10px}
.lg-h::after{content:"";flex:1;height:2px;border-radius:2px;background:var(--line)}
.lg-aide{color:var(--soft);font-size:.95rem;line-height:1.45;margin:6px 0 12px}
.lg-aide.c{text-align:center}
.lg-bientot{color:var(--soft);font-size:.9rem;margin-top:22px;display:flex;gap:8px;align-items:center;justify-content:center;text-align:center}
.lg .ic,.lg-inl .ic{flex:none;display:grid;place-items:center;border-radius:14px}

/* ---------- choix de la langue : tuiles colorées, ombre pleine dessous (on appuie : la tuile descend) ---------- */
.lg-grille{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px;margin:0 0 8px}
.lg-tuile{--tc:#2563C9;--tt:#fff;--td:color-mix(in srgb,var(--tc) 62%,#000);position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:10px;width:100%;min-height:146px;text-align:left;border:0;border-radius:22px;padding:14px;margin:0 0 5px;font:inherit;color:var(--tt);cursor:pointer;overflow:hidden;
  background:linear-gradient(165deg,color-mix(in srgb,var(--tc) 80%,#fff),var(--tc) 58%);box-shadow:0 5px 0 var(--td);transition:transform .08s ease,box-shadow .08s ease}
.lg-tuile::after{content:"";position:absolute;right:-26px;top:-26px;width:90px;height:90px;border-radius:50%;background:rgba(255,255,255,.14);pointer-events:none}
button.lg-tuile:active{transform:translateY(4px);box-shadow:0 1px 0 var(--td)}
.lg-tuile .lg-drap.g{width:54px;height:38px;border-radius:11px;box-shadow:0 0 0 3px rgba(255,255,255,.92),0 3px 0 3px var(--td)}
.lg-tuile .tx{display:flex;flex-direction:column;gap:1px;min-width:0}
.lg-tuile b{font-family:var(--display);font-weight:800;font-size:1.18rem;line-height:1.15}
.lg-tuile .n{font-weight:700;font-size:.88rem;opacity:.9}
.lg-tuile small{font-size:.8rem;line-height:1.3;font-weight:700;opacity:.92;margin-top:3px}
.lg-tuile.cour{outline:3px solid var(--sun);outline-offset:3px}
.lg-t-niv{margin-top:auto;display:flex;align-items:center;gap:8px;width:100%}
.lg-t-niv .lg-badge.s{width:34px;height:34px;font-size:.8rem;border-radius:10px;background:#fff;color:var(--td);text-shadow:none;box-shadow:0 3px 0 var(--td)}
.lg-t-barre{flex:1;height:10px;border-radius:99px;background:rgba(0,0,0,.2);overflow:hidden}
.lg-t-barre i{display:block;height:100%;border-radius:99px;background:#fff}
/* rien de prêt : grisée, cadenas, ne s'ouvre pas */
.lg-tuile.verrou{cursor:default;filter:grayscale(.9);opacity:.6;box-shadow:0 5px 0 var(--td)}
.lg-tuile.verrou::after{display:none}
.lg-t-lock{position:absolute;right:12px;top:12px;z-index:1;font-size:1rem;opacity:.9}
.lg-lang .go,.lg-l2 .go,.lg-go .go,.lg-lien .go{color:var(--soft);flex:none}

/* boutons « deux lignes » (départ, ensemble) */
.lg-l2{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:var(--lg-r,20px);padding:14px 16px;margin:0 0 12px;font:inherit;cursor:pointer;box-shadow:var(--lg-ombre)}
.lg-l2:not(.ic){flex-direction:column;align-items:flex-start;gap:4px}
.lg-l2 .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.lg-l2 b{font-family:var(--display);font-size:1.05rem}
.lg-l2 small{color:var(--soft)}
.lg-l2 .ic{width:46px;height:46px;background:color-mix(in srgb,var(--c,#2E7DD7) 16%,var(--card));color:var(--c,#2E7DD7);font-size:1.3rem}

/* ---------- ma langue ---------- */
.lg-hero{display:block;--lc:#2563C9;--nc:#1F5FA8;--ld:color-mix(in srgb,var(--lc) 62%,#000);position:relative;border-radius:24px;padding:18px 18px 16px;margin:4px 0 18px;color:#fff;overflow:hidden;
  background:linear-gradient(165deg,color-mix(in srgb,var(--lc) 80%,#fff),var(--lc) 60%);box-shadow:0 6px 0 var(--ld)}
.lg-hero::after{content:"";position:absolute;right:-40px;top:-40px;width:140px;height:140px;border-radius:50%;background:rgba(255,255,255,.12)}
.lg-hero-h{position:relative;z-index:1;display:flex;align-items:center;gap:14px}
.lg-hero-h .tx{flex:1;min-width:0;display:flex;flex-direction:column}
.lg-hero-h small{font-weight:800;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;opacity:.9}
.lg-hero-h b{font-family:var(--display);font-size:1.22rem;line-height:1.2;text-shadow:0 1px 0 rgba(0,0,0,.18)}
.lg-hero .lg-drap.g{box-shadow:0 0 0 3px rgba(255,255,255,.9),0 3px 0 3px var(--ld)}
.lg-hero .lg-badge{background:#fff;color:var(--lc);text-shadow:none;box-shadow:0 4px 0 var(--ld)}
.lg-hero-d{position:relative;z-index:1;margin:14px 0 12px;line-height:1.45;font-size:.95rem;opacity:.95}
.lg-hero-p{position:relative;z-index:1;font-size:.82rem;font-weight:800;opacity:.92}
.lg-hero .lg-barre{position:relative;z-index:1;background:rgba(0,0,0,.22)}
.lg-hero .lg-barre i{background:#fff}
.lg-barre{height:12px;border-radius:99px;background:color-mix(in srgb,var(--ink) 8%,var(--line));overflow:hidden;margin:0 0 6px}
.lg-barre i{display:block;height:100%;background:linear-gradient(90deg,var(--ogre),var(--sun));border-radius:99px;animation:lgBarre .9s cubic-bezier(.2,.8,.2,1) both;transform-origin:left}
@keyframes lgBarre{from{transform:scaleX(0)}}
.lg-jour{display:flex;gap:16px;align-items:center;border:2px solid var(--line);background:var(--card);border-radius:22px;padding:16px;box-shadow:var(--lg-ombre)}
.lg-jour.ok{border-color:color-mix(in srgb,var(--ok) 45%,var(--line));background:color-mix(in srgb,var(--ok) 6%,var(--card))}
.lg-jour .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.lg-jour b{font-family:var(--display);font-size:1.02rem;line-height:1.25}
.lg-jour small{color:var(--soft);font-size:.85rem}
.lg-anneau{flex:none;width:80px;height:80px;border-radius:50%;display:grid;place-items:center;align-content:center;background:conic-gradient(var(--ogre) calc(var(--p)*1%),color-mix(in srgb,var(--ink) 8%,var(--line)) 0);position:relative}
.lg-anneau::before{content:"";position:absolute;inset:9px;border-radius:50%;background:var(--card)}
.lg-anneau b,.lg-anneau small{position:relative;line-height:1.05;text-align:center}
.lg-anneau b{font-family:var(--display);font-size:1.45rem}
.lg-anneau small{font-size:.68rem;color:var(--soft)}
.lg-sem{display:flex;gap:6px}
.lg-sem i{position:relative;width:20px;height:20px;border-radius:50%;border:2px solid var(--line);background:var(--card)}
.lg-sem i.mi{background:color-mix(in srgb,var(--ogre) 30%,var(--card));border-color:var(--ogre)}
.lg-sem i.ok{background:var(--ogre);border-color:var(--ogre)}
.lg-sem i.ok::after{content:"";position:absolute;inset:3px;background:#fff;-webkit-mask:var(--gi-check) center/contain no-repeat;mask:var(--gi-check) center/contain no-repeat}
.lg-go{--c:#2B8A3E;display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:0;color:#fff;border-radius:24px;padding:18px 16px;margin:18px 0 20px;font:inherit;cursor:pointer;
  background:linear-gradient(135deg,#3F9A4C,#2B7A3A);box-shadow:0 6px 0 #1F5C2B,0 12px 22px rgba(43,122,58,.25)}
.lg-go .i{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#2B7A3A;font-size:1.3rem;box-shadow:0 0 0 6px rgba(255,255,255,.2);animation:lgPouls 2.2s ease-in-out infinite}
.lg-go .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.lg-go small{color:rgba(255,255,255,.85);font-weight:700;font-size:.82rem;letter-spacing:.02em}
.lg-go b{font-family:var(--display);font-size:1.12rem;line-height:1.25}
.lg-go .go{color:#fff}
.lg-go:active{box-shadow:0 2px 0 #1F5C2B}
@keyframes lgPouls{50%{box-shadow:0 0 0 11px rgba(255,255,255,0)}}
.lg-tuiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:6px 0 4px}
.lg-tu{--cd:color-mix(in srgb,var(--c) 62%,#000);position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;border:0;background:linear-gradient(165deg,color-mix(in srgb,var(--c) 80%,#fff),var(--c) 60%);color:#fff;border-radius:22px;padding:14px;margin-bottom:5px;font:inherit;cursor:pointer;min-height:124px;box-shadow:0 5px 0 var(--cd);overflow:hidden}
.lg-tu:active{transform:translateY(4px)!important;box-shadow:0 1px 0 var(--cd)!important}
.lg-tu .ic{width:42px;height:42px;border-radius:14px;background:rgba(255,255,255,.95);color:var(--c);font-size:1.2rem;margin-bottom:2px;box-shadow:0 3px 0 var(--cd)}
.lg-tu b{font-family:var(--display);font-size:1.05rem;line-height:1.2;text-shadow:0 1px 0 rgba(0,0,0,.15)}
.lg-tu small{color:#fff;opacity:.9;font-size:.82rem;line-height:1.35}

/* dépliants : je sais dire, parcours */
.lg-pli{border:2px solid var(--line);background:var(--card);border-radius:20px;margin:12px 0;overflow:hidden}
.lg-pli summary{display:flex;align-items:center;gap:12px;padding:14px;cursor:pointer;list-style:none}
.lg-pli summary::-webkit-details-marker{display:none}
.lg-pli summary .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.lg-pli summary b{flex:1;font-family:var(--display);font-size:1rem;line-height:1.25}
.lg-pli summary small{color:var(--soft);font-size:.82rem}
.lg-pli summary>.gi-bas{transition:transform .2s;color:var(--soft)}
.lg-pli[open] summary>.gi-bas{transform:rotate(180deg)}
.lg-pli-js .ic{width:34px;height:34px;border-radius:11px;background:var(--ok-bg);color:var(--ok-t)}
.lg-js{list-style:none;margin:0;padding:0 16px 14px}
.lg-js li{padding:7px 0;display:flex;gap:10px;align-items:baseline;line-height:1.4}
.lg-js .gi-check{color:var(--ok-t);flex:none}
.lg-niv{--nc:#1F5FA8}
.lg-niv.cour{border-color:color-mix(in srgb,var(--nc) 45%,var(--line));box-shadow:0 4px 0 color-mix(in srgb,var(--nc) 22%,var(--line))}
/* les unités : un chemin, chaque étape reliée à la suivante */
.lg-us{position:relative;padding:2px 12px 10px}
.lg-u{position:relative;display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:0;background:none;color:var(--ink);border-radius:14px;padding:9px 8px;margin:0;font:inherit;cursor:pointer}
.lg-u:not(:last-child)::after{content:"";position:absolute;left:24px;top:44px;bottom:-9px;width:3px;border-radius:3px;background:var(--line)}
.lg-u.fait:not(:last-child)::after{background:color-mix(in srgb,var(--ok) 60%,var(--line))}
.lg-u .k{position:relative;z-index:1;flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--card);border:2.5px solid var(--line);font-family:var(--display);font-weight:800;font-size:.85rem;color:var(--soft)}
.lg-u:not(:disabled) .k{border-color:color-mix(in srgb,var(--nc) 55%,var(--line));color:var(--ink)}
.lg-u.fait .k{background:var(--ok);border-color:var(--ok);color:#fff}
.lg-u.cour{background:color-mix(in srgb,var(--nc) 9%,var(--card));box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--nc) 40%,transparent)}
.lg-u.cour .k{background:var(--nc);border-color:var(--nc);color:#fff;box-shadow:0 0 0 4px color-mix(in srgb,var(--nc) 22%,transparent)}
.lg-u .tx{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.35;font-size:.95rem}
.lg-u small{color:var(--soft);font-size:.78rem}
.lg-u .sc{flex:none;font-weight:800;color:var(--ok-t);font-size:.82rem}
.lg-u i.sc{color:var(--nc);font-size:1rem}
.lg-u:disabled{cursor:default}.lg-u:disabled .tx{color:var(--soft)}
.lg-bas{display:flex;flex-direction:column;margin:26px 0 8px;border:2px solid var(--line);border-radius:20px;background:var(--card);overflow:hidden}
.lg-lien{display:flex;align-items:center;gap:12px;width:100%;border:0;border-top:1px solid var(--line);background:none;color:var(--ink);font:inherit;font-weight:700;padding:15px 16px;cursor:pointer;text-align:left}
.lg-lien:first-child{border-top:0}
.lg-lien>i:first-child{color:var(--soft);font-size:1.1rem}
.lg-lien span{flex:1}

/* ---------- test de niveau ---------- */
.lg-intro{--lc:#2E7DD7;text-align:center;margin:4px 0 18px;padding:18px 16px 16px;border-radius:26px;background:radial-gradient(120% 100% at 50% 0%,color-mix(in srgb,var(--lc) 16%,var(--card)),var(--card) 70%);border:2px solid color-mix(in srgb,var(--lc) 25%,var(--line))}
.lg-intro .lg-drap{margin:0 auto 10px}
.lg-intro h2{font-family:var(--display);font-size:1.45rem;margin:4px 0 6px;line-height:1.2}
.lg-intro p{margin:6px 0 0;line-height:1.45}
.lg-intro-h{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:8px}
.lg-intro-h .lg-drap{margin:0}
.lg-intro-h small{font-weight:800;color:var(--soft);font-size:.8rem;letter-spacing:.06em}
.lg-intro .lg-badge:not(.s){margin:0}
.lg-intro-dep,.lg-intro-test{padding-bottom:14px}
.lg-paliers{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 6px;margin-top:10px;color:var(--soft)}
.lg-paliers .lg-badge.s{width:34px;height:34px;font-size:.8rem;border-radius:10px}
.lg-qbar{gap:10px}
.lg-qbar .lg-badge.s{width:38px;height:38px;font-size:.85rem}
.lg-qbar .sg-btn,.lg-qbar>button:last-child{flex:none}
.lg-qcard{text-align:left}
.lg-qcard .tag{display:inline-flex;align-items:center;gap:6px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;font-size:.74rem;color:color-mix(in srgb,var(--sky) 80%,var(--ink))}
.lg-qcard h2{font-size:1.18rem;line-height:1.3;margin:6px 0 2px}
.lg-trans{margin:14px 0 0;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--sky) 10%,var(--card));line-height:1.45;font-weight:700;display:flex;gap:8px;align-items:baseline}
.lg-trans i{flex:none;color:var(--sky)}
.lg-res{--nc:#1F5FA8}
.lg-res p{color:var(--soft);margin:0;line-height:1.45}

/* ---------- lecteur audio (boutons d'écoute) ---------- */
.lg-ecout{display:flex;gap:12px;align-items:center;margin:14px 0 4px}
.lg-play{position:relative;flex:none;width:60px;height:60px;border-radius:50%;border:0;background:linear-gradient(150deg,#4A8FE0,#1F5FA8);color:#fff;display:grid;place-items:center;font-size:1.35rem;cursor:pointer;
  box-shadow:0 4px 0 #17497F,0 8px 16px rgba(31,95,168,.25);transition:transform .1s}
.lg-play:active{transform:translateY(3px);box-shadow:0 1px 0 #17497F}
.lg-play::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:3px solid #4A8FE0;opacity:0}
.lg-play.joue::after{animation:lgOnde 1.1s ease-out infinite}
@keyframes lgOnde{0%{opacity:.7;transform:scale(.92)}100%{opacity:0;transform:scale(1.35)}}
.lg-play.s{width:42px;height:42px;font-size:1rem;box-shadow:0 3px 0 #17497F}
.lg-play.s.alt{background:linear-gradient(150deg,#B57BE8,#7B3FD1);box-shadow:0 3px 0 #5A2BA0}
.lg-play.s.alt::after{border-color:#B57BE8}
.lg-lent{display:inline-flex;gap:8px;align-items:center;height:46px;padding:0 18px;border-radius:999px;border:2px solid color-mix(in srgb,#1F5FA8 35%,var(--line));background:var(--card);color:var(--ink);font:inherit;font-weight:800;font-size:.95rem;cursor:pointer;box-shadow:0 3px 0 color-mix(in srgb,#1F5FA8 22%,var(--line))}
.lg-lent i{color:#2E7DD7}
.lg-lent.joue{border-color:#2E7DD7;background:color-mix(in srgb,#2E7DD7 10%,var(--card))}
.lg .lg-ecout .btn.lg-lent{width:auto;margin:0}

/* ---------- une unité ---------- */
.lg-jsd{list-style:none;padding:0;margin:0 0 20px;display:grid;gap:10px}
.lg-jsd li{display:flex;gap:12px;align-items:center;padding:10px 12px;border:2px solid var(--line);border-radius:18px;background:var(--card);box-shadow:var(--lg-ombre)}
.lg-jsd li span{display:flex;flex-direction:column;min-width:0}
.lg-jsd b{font-family:var(--display);font-size:1.02rem;line-height:1.25;overflow-wrap:anywhere}
.lg-jsd small{color:var(--soft);font-size:.85rem}
.lg-etapes{list-style:none;padding:0;margin:0 0 26px;display:grid;grid-template-columns:1fr 1fr;gap:10px;counter-reset:e}
.lg-etapes button{display:flex;gap:10px;align-items:center;width:100%;min-height:56px;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:16px;padding:8px 10px;font:inherit;font-weight:700;font-size:.95rem;cursor:pointer;text-align:left;box-shadow:var(--lg-ombre)}
.lg-etapes .ic{width:34px;height:34px;border-radius:11px;background:color-mix(in srgb,var(--sky) 14%,var(--card));color:var(--sky)}
.lg-etapes .fait{border-color:color-mix(in srgb,var(--ok) 45%,var(--line))}
.lg-etapes .fait .ic{background:var(--ok);color:#fff}
.lg-etapes .cour{border-color:var(--sky);box-shadow:0 4px 0 color-mix(in srgb,var(--sky) 35%,var(--line))}
.lg-etapes .cour .ic{background:var(--sky);color:#fff}
.lg-etapes .lk{margin-left:auto;color:var(--soft)}
/* en-tête d'une étape : 6 segments + consigne */
.lg-pas{display:flex;gap:6px;margin:2px 0 16px}
.lg-pas i{flex:1;height:10px;border-radius:99px;background:color-mix(in srgb,var(--ink) 8%,var(--line))}
.lg-pas i.f{background:var(--ogre)}
.lg-pas i.c{background:linear-gradient(90deg,var(--ogre),var(--sun));box-shadow:0 0 0 3px color-mix(in srgb,var(--sun) 25%,transparent)}
.lg-cons{font-family:var(--display);font-size:1.12rem;line-height:1.3;margin:4px 0 16px;display:flex;gap:10px;align-items:center}
.lg-cons-e .ic{width:40px;height:40px;border-radius:13px;background:color-mix(in srgb,var(--sky) 14%,var(--card));color:var(--sky);font-size:1.15rem}
.lg-mini{display:flex;align-items:center;justify-content:flex-end;gap:10px;color:var(--soft);font-size:.85rem;font-weight:700;margin:0 0 10px}
.lg-mini-p{flex:1;display:flex;gap:4px}.lg-mini-p i{flex:1;max-width:28px;height:6px;border-radius:9px;background:var(--line)}.lg-mini-p i.f{background:var(--ogre)}.lg-mini-p i.c{background:var(--sun)}
.lg-sens{color:var(--soft);font-size:.92rem;margin:12px 0 0;text-align:center}
.lg-suite{margin-top:18px}
.lg-bravo{font-family:var(--display);color:var(--ok-t);display:flex;gap:8px;align-items:center;justify-content:center;font-size:1.1rem}

/* parler : la phrase dans une carte, le gros micro */
.lg-carte{background:var(--card);border:3px solid var(--ink);border-radius:24px;padding:18px;margin:0 0 6px;box-shadow:var(--shadow);text-align:center}
.lg-carte .lg-ecout{justify-content:center;margin:12px 0 0}
.lg-carte.q{border-width:2px;border-color:color-mix(in srgb,var(--sky) 40%,var(--line));background:color-mix(in srgb,var(--sky) 6%,var(--card))}
.lg-phrase{font-family:var(--display);font-size:1.38rem;line-height:1.35;margin:0;overflow-wrap:anywhere}
.lg-cat-texte{font-size:1.1rem;line-height:1.5;margin:10px 0;text-align:start;overflow-wrap:anywhere}
.lg-trou{display:inline-block;min-width:3.2em;border-bottom:3px solid currentColor;margin:0 .15em}
.lg-q{font-size:1.15rem;font-weight:700;line-height:1.4;margin:0;overflow-wrap:anywhere}
.lg-mic-z{display:grid;place-items:center;margin:26px 0 6px}
.lg-mic{position:relative;display:grid;place-items:center;width:92px;height:92px;border-radius:50%;border:0;background:linear-gradient(150deg,#E05BB8,#B0287F);color:#fff;font-size:2.1rem;cursor:pointer;box-shadow:0 6px 0 #861F61,0 14px 26px rgba(176,40,127,.3);transition:transform .1s}
.lg-mic:active{transform:translateY(4px);box-shadow:0 2px 0 #861F61}
.lg-mic::before{content:"";position:absolute;inset:-10px;border-radius:50%;border:3px dashed color-mix(in srgb,#C2389E 35%,transparent)}
.lg-mic.rec{background:linear-gradient(150deg,#F0645A,#B8322A);box-shadow:0 6px 0 #8A241E}
.lg-mic.rec::before{border:4px solid #F0645A;animation:lgOnde 1.2s ease-out infinite}
.lg-mic.stt{background:var(--soft);box-shadow:0 6px 0 color-mix(in srgb,var(--soft) 60%,#000);cursor:wait}
.lg-mic.stt::before{border-style:solid;border-color:var(--soft) transparent;animation:lgTourne 1s linear infinite}
@keyframes lgTourne{to{transform:rotate(1turn)}}
.lg-dit-moi{color:var(--soft);margin:18px 0 6px;text-align:center}
.lg-dit-moi span{color:var(--ink);font-weight:700}
.lg-mots{font-size:1.15rem;line-height:1.9;margin:0 0 10px;text-align:center}
.lg-mots span,.lg-mots mark{display:inline-block;padding:0 7px;border-radius:9px;margin:2px 0}
.lg-mots .ok{color:var(--ok-t);background:var(--ok-bg)}
.lg-mots mark{background:var(--ko-bg);color:var(--ko-t);text-decoration:underline wavy color-mix(in srgb,var(--ko) 60%,transparent);text-underline-offset:4px}
.lg-note{margin:12px 0 16px}
.feedback.lg-note.mid{background:var(--t-warn-bg,#FFF3D6);border-color:var(--t-warn,#E8A317)}
.feedback.lg-note .ogre{width:56px;height:56px}
.lg-duo{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.lg .lg-duo .btn{margin:0 0 10px}

/* sons (version libre) */
.lg-son{display:flex;gap:12px;align-items:flex-start;border:2px solid var(--line);background:var(--card);border-radius:18px;padding:14px;margin:0 0 12px}
.lg-son .ic{width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,#C2389E 14%,var(--card));color:#C2389E}
.lg-son b{font-family:var(--display)}
.lg-son p{margin:4px 0 0;color:var(--soft);line-height:1.4}
.lg-paires{display:grid;gap:10px;margin:16px 0 22px}
.lg-paire{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:10px 12px;border-radius:18px;background:color-mix(in srgb,var(--sky) 5%,var(--card));border:2px solid var(--line)}
.lg-paire .m{display:flex;gap:10px;align-items:center;min-width:0}
.lg-paire b{font-family:var(--display);font-size:1.05rem}
.lg-paire .vs{color:var(--soft);font-weight:800;padding:0 4px}

/* mission (jeu de rôle) */
.lg-mis{position:relative;border:2px solid color-mix(in srgb,#E07A1F 40%,var(--line));background:linear-gradient(160deg,color-mix(in srgb,#E07A1F 12%,var(--card)),var(--card));border-radius:22px;padding:16px 16px 14px 70px;margin:0 0 16px;min-height:74px}
.lg-mis .ic{position:absolute;left:14px;top:16px;width:42px;height:42px;border-radius:14px;background:#E07A1F;color:#fff;font-size:1.2rem}
.lg-mis b{font-family:var(--display);font-size:1.05rem}
.lg-mis p{margin:6px 0 0;line-height:1.45}
.lg-mis .lg-obj{margin:10px 0 0}
.lg-obj{list-style:none;padding:0;margin:0 0 14px;display:grid;gap:6px}
.lg-obj li{display:flex;gap:10px;align-items:baseline;padding:2px 0;color:var(--soft);line-height:1.4}
.lg-obj li i{flex:none}
.lg-obj li.ok{color:var(--ok-t);font-weight:700}
.lg-chat{display:flex;flex-direction:column;gap:12px;max-height:52vh;overflow-y:auto;padding:6px 2px 10px;scroll-behavior:smooth}
.lg-chat .me{position:relative;align-self:flex-end;max-width:82%;background:linear-gradient(150deg,#3A86D6,#2471AE);color:#fff;border-radius:20px 20px 6px 20px;padding:11px 14px;margin:0 6px 0 0;line-height:1.4;box-shadow:0 4px 12px rgba(36,113,174,.22);animation:bIn .3s ease both;transform-origin:100% 100%}
.lg-chat .me::after{content:"";position:absolute;right:-7px;bottom:0;width:14px;height:14px;background:#2471AE;clip-path:polygon(0 0,0 100%,100% 100%)}
.lg-chat .lui{display:flex;gap:8px;align-items:flex-end;max-width:94%}
.lg-chat .lui .f{flex:none;width:38px;height:38px}.lg-chat .lui .f svg{width:100%;height:100%}
.lg-chat .lui p{margin:0;line-height:1.42}
.lg-chat .lui p.tw{font-family:"Patrick Hand","Comic Sans MS",cursive;font-size:1.12rem}
.lg-chat .lui details{margin-top:6px;color:var(--soft);font-size:.88rem}.lg-chat .lui summary{cursor:pointer;font-weight:700}
.lg-chat .aide{margin-top:8px!important;padding-top:8px;border-top:1px dashed var(--line);color:var(--soft);font-size:.92rem}
.lg-chat .lg-tape{padding:12px 16px}
.lg-chat .corr{align-self:flex-end;max-width:85%;background:color-mix(in srgb,var(--sun) 12%,var(--card));border:2px dashed color-mix(in srgb,var(--sun) 60%,var(--line));border-radius:16px;padding:9px 13px;margin:0 6px 0 0;display:flex;flex-direction:column;gap:2px;line-height:1.4}
.lg-chat .corr small{color:var(--soft)}
.lg-chat .err{align-self:center;color:var(--soft);margin:0;font-size:.92rem;text-align:center}

/* fin d'unité */
.lg-fin{--nc:#1F5FA8;display:flex;flex-direction:column;align-items:center;gap:12px;margin:6px 0 20px;padding:20px 16px;border-radius:26px;background:radial-gradient(100% 100% at 50% 0%,color-mix(in srgb,var(--sun) 22%,var(--card)),var(--card) 70%);border:2px solid color-mix(in srgb,var(--sun) 40%,var(--line))}
.lg-fin-ic{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;font-size:2.2rem;color:#fff;background:linear-gradient(150deg,#FFC83D,#E8961A);box-shadow:0 5px 0 #B87410;animation:pop .5s ease both}
.lg-fin:not(.ok) .lg-fin-ic{background:linear-gradient(150deg,#8FB8E8,#2E7DD7);box-shadow:0 5px 0 #1F5FA8}
.lg-fin-e{display:flex;gap:8px}
.lg-fin-e i{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:var(--line);color:var(--soft);font-size:.95rem}
.lg-fin-e i.f{background:var(--ok);color:#fff}

/* ---------- accent ---------- */
.lg-semaine{display:flex;gap:12px;align-items:center;border:2px solid color-mix(in srgb,#C2389E 30%,var(--line));background:linear-gradient(160deg,color-mix(in srgb,#C2389E 9%,var(--card)),var(--card));border-radius:22px;padding:16px;margin:0 0 14px}
.lg-semaine .ic,.lg-sonl .ic{width:42px;height:42px;border-radius:14px;background:#C2389E;color:#fff;font-size:1.2rem}
.lg-semaine .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.lg-semaine b{font-family:var(--display)}
.lg-semaine small{color:var(--soft);line-height:1.4}
.lg-tend,.lg-sonl .lg-courbe{color:#2E7DD7}
.lg-courbe{width:110px;height:40px;flex:none}
.lg-sonl{display:flex;gap:12px;align-items:center;border:2px solid var(--line);background:var(--card);border-radius:18px;padding:12px 14px;margin:0 0 10px}
.lg-sonl .ic{background:color-mix(in srgb,#2E7DD7 14%,var(--card));color:#2E7DD7;width:38px;height:38px;border-radius:12px}
.lg-sonl.m{border-color:color-mix(in srgb,var(--ok) 45%,var(--line))}
.lg-sonl.m .ic{background:var(--ok);color:#fff}
.lg-sonl .tx{flex:1;min-width:0}
.lg-sonl b{font-family:var(--display)}
.lg-sonl small{color:var(--soft);display:block;font-size:.82rem}
.lg-sonl p{margin:4px 0 0;font-size:.9rem;color:var(--soft);line-height:1.4}
.lg-m{flex:none;color:var(--ok-t);font-weight:800;font-size:.85rem;display:flex;gap:4px;align-items:center}

/* ---------- me situer, réglages ---------- */
.lg-dix{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;justify-items:center;margin:10px auto 16px;max-width:280px}
.lg-dix i{width:40px;height:40px;border-radius:50%;background:var(--line);animation:pop .4s ease both;animation-delay:calc(var(--i)*60ms)}
.lg-dix i.ok{background:linear-gradient(150deg,#6DBE58,#3E7F31);box-shadow:0 3px 0 #2E5F25}
.lg-choix{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:8px}
.lg-choix button{min-height:46px;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:10px 16px;font:inherit;font-weight:700;cursor:pointer;box-shadow:var(--lg-ombre)}
.lg-choix button.sel{border-color:var(--ogre);background:color-mix(in srgb,var(--ogre) 14%,var(--card));color:var(--ink)}
.lg-choix button.sel i{color:var(--ogre-d)}
.lg-choix button:disabled{opacity:.55;cursor:default;box-shadow:none}
.lg-demo-note{margin:10px 0 0;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,var(--c,#2E7DD7) 10%,var(--card));color:var(--ink);font-weight:700;line-height:1.35}

/* exercices de l'unité (Exo) dans l'espace Langues */
.lg .exo-ch button{overflow-wrap:anywhere}
/* Valider : toujours bien séparé des options (quiz audio, test de niveau) */
button.btn[data-v]{display:block;width:100%;margin-top:26px}
.lg .opts{margin-bottom:0}
/* après la réponse : options, bloc Bravo / Oups et Continuer bien aérés (quiz audio, toutes langues) */
.lg .opts+.feedback{margin-top:22px}
.lg .feedback+button.btn[data-n],.lg .opts+button.btn[data-n]{display:block;width:100%;margin-top:20px}

@media (max-width:340px){.lg-tuiles,.lg-etapes{grid-template-columns:1fr}.lg-tu{min-height:0}.lg-drap.g{width:46px;height:33px}.lg-dix{gap:8px}.lg-dix i{width:34px;height:34px}}
@media (prefers-reduced-motion:reduce){.lg .cm-corps>*,.lg-inl>*,.lg-dit p,.lg-chat .me,.lg-chat .lui>div,.lg-barre i,.lg-dix i,.lg-fin-ic{animation:none}
  .lg-go .i,.lg-charge .f,.lg-points i,.lg-play.joue::after,.lg-mic.rec::before,.lg-mic.stt::before{animation:none}}
/* départ : le drapeau et le nom de la langue dans la bulle d'Ogrelo */
.lg-dit-drap .lg-dd{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:center}
.lg-dit-drap .lg-dd>svg,.lg-dit-drap .lg-dd>img,.lg-dit-drap .lg-dd>span:first-child{grid-row:1;width:44px;height:44px;border-radius:12px;overflow:hidden;box-shadow:0 3px 0 rgba(0,0,0,.18)}
.lg-dit-drap .lg-dd-n{font-family:var(--display);font-size:1.25rem;color:var(--lc)}
.lg-dit-drap .lg-dd p{grid-column:1/-1;margin:6px 0 0}
/* blocs de niveau A0…C2 : tuiles à ombre pleine, couleur du niveau */
.lg-niv{border:2px solid color-mix(in srgb,var(--nc) 55%,#fff)!important;border-radius:20px!important;box-shadow:0 5px 0 color-mix(in srgb,var(--nc) 75%,#000)!important;margin:0 0 16px!important;overflow:hidden;background:var(--sheet)}
.lg-niv>summary{background:linear-gradient(180deg,color-mix(in srgb,var(--nc) 92%,#fff),var(--nc));color:#fff;padding:14px 16px!important;font-weight:800}
.lg-niv>summary small{color:rgba(255,255,255,.88)!important}
.lg-niv>summary b{color:#fff}
.lg-niv>summary:active{transform:translateY(3px)}
.lg-niv.cour{box-shadow:0 5px 0 color-mix(in srgb,var(--nc) 75%,#000),0 0 0 4px color-mix(in srgb,var(--nc) 30%,transparent)!important}
.lg-niv.bloque{filter:grayscale(.85);opacity:.6}
.lg-niv.bloque>summary{pointer-events:none}
.lg-niv .lg-us{padding:12px}
/* départ : tuile « A0 · Niveau débutant » façon Duolingo (bleu, ombre pleine) */
.lg-l2[data-n="A0"]{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:0;border-radius:24px;padding:16px 18px;margin:0 0 20px;font:inherit;cursor:pointer;color:#fff;
  background:linear-gradient(180deg,#3CC1FA,#1CB0F6);box-shadow:0 6px 0 #1288C4;transition:transform .08s,box-shadow .08s}
.lg-l2[data-n="A0"]:active{transform:translateY(4px);box-shadow:0 2px 0 #1288C4}
.lg-l2[data-n="A0"] .tx{flex:1;display:flex;flex-direction:column;gap:2px}
.lg-l2[data-n="A0"] .tx b{font-family:var(--display);font-size:1.7rem;line-height:1;color:#fff;letter-spacing:.02em}
.lg-l2[data-n="A0"] .tx small{color:rgba(255,255,255,.92)!important;font-weight:800;font-size:.95rem}
.lg-l2[data-n="A0"]>i{color:#fff;font-size:1.2rem;background:rgba(255,255,255,.22);width:40px;height:40px;border-radius:50%;display:grid;place-items:center}
/* difficulté : petits piments rouges sur pastille blanche */
.lg-diff{display:inline-flex;gap:1px;vertical-align:middle;margin-left:6px;background:rgba(255,255,255,.92);border-radius:999px;padding:2px 6px;color:#E0251B}
.lg-diff svg{width:14px;height:14px}
.lg-niv>summary b,.lg-l2[data-n="A0"] .tx b{display:flex;align-items:center;flex-wrap:wrap;gap:4px}
.lg-niv>summary{text-shadow:0 1px 0 rgba(0,0,0,.18)}
.lg-l2[data-n="A0"]{background:linear-gradient(180deg,#5BC21A,#46A302)!important;box-shadow:0 6px 0 #2F7A00!important}
.lg-l2[data-n="A0"]:active{box-shadow:0 2px 0 #2F7A00!important}
/* départ : test de niveau en bleu (le vert reste au niveau A0) */
.lg-intro-dep~.lg-go,.lg-dit-drap~.lg-go{background:linear-gradient(180deg,#3CC1FA,#1CB0F6)!important;box-shadow:0 6px 0 #1288C4!important}
.lg-dit-drap~.lg-go .i{color:#1288C4!important}
.lg-l2[data-n="A0"]>i{color:#fff!important;opacity:1!important}
.lg-diff svg.off path{fill:#CBD1D9}.lg-diff svg{width:12px;height:12px}
/* en-tête de ma langue : le drapeau derrière le niveau (A0…) */
.lg-hero-fb{position:relative;flex:none;width:78px;height:56px;border-radius:14px;overflow:hidden;box-shadow:0 4px 0 rgba(0,0,0,.25);border:2px solid rgba(255,255,255,.9)}
.lg-hero-fb>svg,.lg-hero-fb>span,.lg-hero-fb>img{position:absolute;inset:0;width:100%!important;height:100%!important;border-radius:0!important;box-shadow:none!important}
.lg-hero-fb b{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--display);font-size:1.5rem;color:#fff;background:rgba(0,0,0,.28);text-shadow:0 2px 0 rgba(0,0,0,.35)}
.lg-hero-h .tx b{font-size:1.5rem}
.lg-back{display:inline-flex;align-items:center;gap:8px;border:2px solid var(--line);background:var(--card,#fff);color:var(--ink);font:inherit;font-weight:800;border-radius:999px;padding:8px 16px 8px 12px;margin:0 0 16px;cursor:pointer;box-shadow:0 3px 0 var(--line)}
.lg-back:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}
/* en-tête de ma langue : le drapeau en grand, en fond de la tuile */
.lg-hero{position:relative;overflow:hidden}
.lg-hero>*{position:relative;z-index:1}
.lg-hero>.lg-hero-drap{position:absolute;z-index:0;top:-10%;right:-12%;width:75%;height:120%;opacity:.22;transform:rotate(-8deg);pointer-events:none}
.lg-hero>.lg-hero-drap>*{width:100%!important;height:100%!important;border-radius:0!important;box-shadow:none!important}
.lg-hero>.lg-hero-drap svg{width:100%;height:100%}
.lg-intro-h small:empty{display:none}
/* en-tête de ma langue : le drapeau couvre toute la tuile, voile sombre pour lire le texte ; niveau en blanc, couleur de la langue */
.lg-hero>.lg-hero-drap{inset:0!important;top:0!important;right:0!important;width:100%!important;height:100%!important;opacity:1!important;transform:none!important}
.lg-hero>.lg-hero-drap::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,16,40,.35),rgba(10,16,40,.72))}
.lg-hero>.lg-hero-drap>*,.lg-hero>.lg-hero-drap svg{position:absolute;inset:0;width:100%!important;height:100%!important;display:block}
.lg-hero{background:var(--lc)!important}
.lg-hero .lg-hero-h .tx b,.lg-hero .lg-hero-d,.lg-hero small{text-shadow:0 2px 6px rgba(0,0,0,.45)}
.lg-hero .lg-hero-h .lg-badge{background:#fff!important;color:var(--lc)!important;border:0!important;box-shadow:0 4px 0 color-mix(in srgb,var(--lc) 60%,#000)!important;font-weight:900}
.lg-hero .lg-hero-h .lg-badge{background:rgba(255,255,255,.14)!important;color:#fff!important;border:2px solid rgba(255,255,255,.85)!important;box-shadow:none!important;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);text-shadow:0 2px 4px rgba(0,0,0,.4)}
/* tuiles des langues : le drapeau en fond plein, voile sombre en bas pour lire le nom */
.lg-tuile{overflow:hidden;color:#fff!important}
.lg-tuile>*{position:relative;z-index:1}
.lg-tuile>.lg-t-fond{position:absolute;inset:0;z-index:0}
.lg-tuile>.lg-t-fond>*,.lg-tuile>.lg-t-fond svg{position:absolute!important;inset:0;width:100%!important;height:100%!important;border-radius:0!important;box-shadow:none!important;display:block}
.lg-tuile>.lg-t-fond::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,16,40,.05) 15%,rgba(10,16,40,.72))}
.lg-tuile{justify-content:flex-end}
.lg-tuile b,.lg-tuile .n,.lg-tuile small{color:#fff!important;text-shadow:0 2px 6px rgba(0,0,0,.55)}
.lg-tuile .lg-badge{background:rgba(255,255,255,.14)!important;color:#fff!important;border:2px solid rgba(255,255,255,.85)!important;box-shadow:none!important;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.lg-t-lock{z-index:2!important}
/* parcours : activité de chaque unité (icône) et légende, dans le niveau déplié */
.lg-legende{display:flex;flex-wrap:wrap;gap:6px 12px;margin:2px 4px 10px;color:var(--soft);font-size:.8rem;font-weight:700}
.lg-legende>span{display:inline-flex;align-items:center;gap:6px}
.lg-act{flex:none;width:26px;height:26px;border-radius:9px;display:grid;place-items:center;font-size:.85rem;color:var(--nc,#1F5FA8);background:color-mix(in srgb,var(--nc,#1F5FA8) 12%,var(--card))}
.lg-niv.bloque .lg-act{background:var(--line);color:var(--soft)}
@media (max-width:380px){.lg-act{width:24px;height:24px}.lg-niv .lg-u{gap:8px}.lg-niv .lg-u .tx{font-size:.9rem}}
.lg-cons-w{background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px 14px}
/* parcours : chemin façon Duolingo — fait = vert coché, « Tu es ici » = gros point qui pulse, la suite = gris */
.lg-us{position:relative}
.lg-us .lg-u{position:relative}
.lg-u .k{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--line);color:#fff;flex:none;box-shadow:0 3px 0 rgba(0,0,0,.12)}
.lg-u.fait .k{background:#46A302;box-shadow:0 3px 0 #2F7A00}
.lg-u.fait .tx{opacity:.8}
.lg-u.cour{border:3px solid var(--nc,#46A302)!important;border-radius:18px;background:color-mix(in srgb,var(--nc,#46A302) 10%,var(--card,#fff))!important}
.lg-u.cour .k{width:44px;height:44px;background:var(--nc,#46A302);box-shadow:0 4px 0 color-mix(in srgb,var(--nc,#46A302) 65%,#000);animation:lgIci 1.8s ease-in-out infinite}
.lg-ici{display:inline-block;background:var(--nc,#46A302);color:#fff!important;font-weight:900;font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:2px 9px;margin:0 0 4px}
@keyframes lgIci{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@media (prefers-reduced-motion:reduce){.lg-u.cour .k{animation:none}}
.lg-niv.acquis>summary{background:linear-gradient(180deg,#5BC21A,#46A302)!important}
.lg-ok{width:30px;height:30px;border-radius:50%;background:#fff;color:#46A302;display:grid;place-items:center;flex:none}
.lg-niv>summary{display:flex!important;align-items:center;gap:14px;list-style:none}.lg-niv>summary::-webkit-details-marker{display:none}.lg-niv>summary>.lg-badge{flex:none}.lg-niv>summary>.tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;text-align:left}.lg-niv>summary>i,.lg-niv>summary>.lg-ok{flex:none;margin-left:auto}
.lg-diff{background:none!important;padding:0!important;color:#FF3B2F;filter:drop-shadow(0 1px 0 rgba(0,0,0,.25))}.lg-diff svg.off path{fill:rgba(255,255,255,.45)!important}.lg-l2 .lg-diff svg.off path,.lg-u .lg-diff svg.off path{fill:#CBD1D9!important}
/* étapes numérotées : 1, 2, 3… ; faites = vert + petite coche ; en cours = couleur du niveau ; la suite = grise et fermée */
.lg-u .k{position:relative}
.lg-u .k b{font-family:var(--display);font-weight:900;font-size:1rem;color:#fff}
.lg-u:not(.fait):not(.cour) .k{background:#E3E7EE}
.lg-u:not(.fait):not(.cour) .k b{color:#8A93A3}
.lg-k-ok{position:absolute;right:-4px;bottom:-4px;width:18px;height:18px;border-radius:50%;background:#fff;color:#46A302;font-size:.7rem;display:grid;place-items:center;box-shadow:0 1px 0 rgba(0,0,0,.2)}
.lg-u.apres{opacity:.55}
.lg-u.cour .k b{font-size:1.15rem}
.lg-valide{display:inline-flex;align-items:center;gap:4px;background:#E7F6DA;color:#2F7A00!important;font-weight:900;font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:2px 9px;margin:0 0 4px;width:max-content}
.lg-niv>summary{position:relative}.lg-niv.bloque>summary>i.gi-cadenas{position:absolute;left:34px;top:8px;width:20px;height:20px;border-radius:50%;background:#fff;color:#5B6475;font-size:.62rem;display:grid;place-items:center;margin:0!important;box-shadow:0 1px 0 rgba(0,0,0,.2)}.lg-niv.bloque>summary>.tx{flex:1 1 100%}
.lg-bw{position:relative;flex:none;display:inline-block}.lg-bw-c{position:absolute;right:-5px;top:-5px;width:16px;height:16px;border-radius:50%;background:#fff;color:#5B6475;font-size:.5rem;display:grid;place-items:center;box-shadow:0 1px 0 rgba(0,0,0,.25)}

/* ---------- imagier (exercices en images de exo.js, écran « Imagier » de langues.js, défi) ----------
   Même allure que le quiz des fiches (.qcard, .opts / .opt, lettres A B C D) ; les 4 réponses deviennent des tuiles d'images 2 × 2. */
.xi-grille{grid-template-columns:1fr 1fr}
.opt.xi{position:relative;flex-direction:column;align-items:stretch;gap:6px;padding:8px;text-align:center;min-height:0}
.opt.xi .l{position:absolute;top:8px;left:8px;width:30px;height:30px;border-radius:10px;font-size:.9rem;z-index:1}
.opt.xi small{font-weight:700;font-size:.92rem;line-height:1.2}
.xi-img{display:block;width:100%;aspect-ratio:1;border-radius:12px;background:#fff;overflow:hidden}
.xi-img img{display:block;width:100%;height:100%;object-fit:contain;-webkit-user-drag:none;user-select:none}
.xi-img.charge,.xi-img.vide{background:linear-gradient(100deg,var(--line) 30%,var(--card) 50%,var(--line) 70%);background-size:300% 100%;animation:xi-sc 1.3s linear infinite}
.xi-img.charge img{opacity:0}
.xi-img.vide{animation:none;opacity:.6}
@keyframes xi-sc{to{background-position:-150% 0}}
@media (prefers-reduced-motion:reduce){.xi-img.charge{animation:none}.xi-mm.faux{animation:none}}
.xi-grande{max-width:220px;margin:12px auto 0}
.xi-ecout{display:flex;align-items:center;gap:14px;margin-top:12px}
.xi-ecout b{font-size:1.15rem}
.xi-play{width:56px;height:56px;flex:none;border-radius:50%;border:0;background:var(--sky);color:#fff;font-size:1.4rem;display:grid;place-items:center;box-shadow:var(--shadow);cursor:pointer}
.xi-play:active{transform:translateY(2px);box-shadow:none}
.xi-memo-i{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.xi-memo-m{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}
.xi-mc,.xi-mm{border:3px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);cursor:pointer}
.xi-mc{padding:4px}
.xi-mm{padding:10px 8px;font:inherit;font-weight:700;min-height:48px}
.xi-mc.sel,.xi-mm.sel{border-color:var(--sky);box-shadow:0 0 0 3px color-mix(in srgb,var(--sky) 25%,transparent)}
.xi-mc.ok,.xi-mm.ok{border-color:var(--ok);background:var(--ok-bg)}
.xi-mc.ok{opacity:.75}
.xi-mm.faux{border-color:var(--ko);animation:xi-non .35s}
@keyframes xi-non{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
/* écran « Imagier » : un thème = 4 images d'aperçu */
.lg-img-niv{margin:6px 0 14px;display:flex;flex-wrap:wrap;gap:8px}
.lg-img-niv button{display:inline-flex;align-items:center;gap:8px}
.lg-img-ths{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:12px;margin-bottom:18px}
.lg-img-th{display:flex;flex-direction:column;gap:6px;text-align:left;border:3px solid var(--line);border-radius:18px;background:var(--card);color:var(--ink);padding:10px;box-shadow:var(--shadow);font:inherit;cursor:pointer}
.lg-img-th b{font-size:.98rem;line-height:1.2}
.lg-img-th small{color:var(--soft);font-size:.82rem}
.lg-img-th.attente{box-shadow:none;cursor:default}
.lg-img-th.attente b{color:var(--soft)}
.lg-img-ap{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.lg-img-ap .xi-img{border-radius:8px}
/* défi : réponses en images */
.df-c .xi-img{width:min(28vw,120px);margin:0 auto}
.df-choix.xi-df{grid-template-columns:1fr 1fr}
.xi-grille{margin-bottom:28px!important}.xi-grille~.btn,.xi-grille+.btn,.xi-grille~.exo-ok2,.xi-grille~.exo-valide{margin-top:28px!important}.exo-ok2,.exo-valide{margin-top:28px!important}
.xi-voir{border:2px dashed var(--line);background:none;color:var(--soft);border-radius:999px;padding:6px 12px;font:inherit;font-size:.88rem;cursor:pointer}
.xi-sous{font-size:1.15rem}
.xi-memory{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}
.xi-mcard{aspect-ratio:1;border:3px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);padding:4px;display:grid;place-items:center;font:inherit;font-weight:700;font-size:.85rem;line-height:1.15;cursor:pointer;overflow:hidden}
.xi-mcard .xi-img{border-radius:8px}
.xi-mcard.ok{border-color:var(--ok);background:var(--ok-bg)}
.xi-dos{display:grid;place-items:center;width:70%;opacity:.85}
.xi-dos svg{width:100%;height:auto}
p.xi-sous.c{text-align:center;margin:8px 0 0}
.xi-grille+.btn.exo-ok2,.opts+.btn.exo-ok2,.opts+.xi-grande+.btn.exo-ok2{margin-top:26px}
/* en-têtes des exercices en images : petits et légers (allure du quiz des Cours) ; la question « Où est … ? » reste en grand */
.xi-carte .tag{display:inline-block;font-size:.85rem;font-weight:800;text-transform:uppercase;letter-spacing:.02em;padding:3px 10px;border-radius:999px;background:color-mix(in srgb,var(--sky) 14%,var(--card));color:var(--ink)}
.xi-carte h2{font-size:.95rem;font-weight:400;font-family:inherit;line-height:1.35;margin-top:8px}
.xi-carte h2.xi-q{font-size:1.3rem;font-weight:800;font-family:var(--display)}
/* phrase à trous, série éclair */
.xi-phrase{font-size:1.25rem;font-weight:700;text-align:center;margin:12px 0 0;line-height:1.6}
.xi-trou{display:inline-block;min-width:5.5em;border-bottom:3px dashed var(--line);margin:0 .25em;padding:0 .2em;color:var(--sky)}
.xi-trou.pris{border-bottom-style:solid;border-color:var(--sky)}
.xi-chrono{height:8px;border-radius:99px;background:var(--line);overflow:hidden;margin-top:10px}
.xi-chrono i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--ok),var(--sun));transform-origin:left;animation:xi-temps linear forwards}
@keyframes xi-temps{to{transform:scaleX(0)}}
@media (prefers-reduced-motion:reduce){.xi-chrono i{animation-timing-function:steps(6)}}
.xi-eclair-ch{grid-template-columns:1fr 1fr}
.xi-eclair-bilan{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:14px}
.xi-eclair-bilan span{display:flex;flex-direction:column;gap:2px;border:3px solid var(--line);border-radius:12px;padding:3px;text-align:center}
.xi-eclair-bilan span.ok{border-color:var(--ok)}.xi-eclair-bilan span.ko{border-color:var(--ko)}
.xi-eclair-bilan small{font-size:.75rem;font-weight:700}

/* ---------- feuille : moments ponctuels (mission, fin d'unité, point accent, me situer) par-dessus l'écran ---------- */
body.lg-feuille-ouverte{overflow:hidden}
.lg-feuille{position:fixed;inset:0;z-index:90;display:flex;flex-direction:column;justify-content:flex-end;background:color-mix(in srgb,#000 45%,transparent);padding-top:calc(10px + env(safe-area-inset-top,0px));animation:lgFondu .18s ease-out}
.lg-feuille-in{display:flex;flex-direction:column;width:100%;height:100%;max-width:560px;margin:0 auto;background:var(--paper);color:var(--ink);border-radius:24px 24px 0 0;overflow:hidden;box-shadow:0 -6px 30px rgba(0,0,0,.18);animation:lgMonte .26s cubic-bezier(.2,.8,.2,1)}
.lg-feuille-top{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px 10px;position:relative}
.lg-feuille-top::before{content:"";position:absolute;left:50%;top:6px;width:40px;height:5px;margin-left:-20px;border-radius:9px;background:color-mix(in srgb,var(--ink) 16%,transparent)}
.lg-feuille-top b{font-family:var(--display);font-size:1.15rem;line-height:1.25}
.lg-feuille-corps{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:4px 16px 16px}
.lg-feuille-bas{flex:none;padding:10px 16px calc(12px + env(safe-area-inset-bottom,0px));border-top:2px solid var(--line);background:var(--paper)}
.lg-feuille-bas:empty{display:none}
.lg-feuille .btn{display:block;width:100%;margin:0 0 10px}
.lg-feuille-bas .btn:last-child{margin-bottom:0}
@media (min-width:600px){.lg-feuille{justify-content:center;padding:24px 16px}.lg-feuille-in{height:auto;max-height:min(860px,92vh);border-radius:26px;box-shadow:0 20px 60px rgba(0,0,0,.3)}.lg-feuille-top::before{display:none}}
@keyframes lgFondu{from{opacity:0}to{opacity:1}}
@keyframes lgMonte{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.lg-feuille,.lg-feuille-in{animation:none}}

/* mission : la scène, « Ton objectif » (objectif → phrase modèle), les actions */
.lg-scene{display:flex;gap:12px;align-items:flex-start;border:2px solid color-mix(in srgb,#E07A1F 40%,var(--line));background:linear-gradient(160deg,color-mix(in srgb,#E07A1F 12%,var(--card)),var(--card));border-radius:20px;padding:14px;margin:4px 0 14px}
.lg-scene .ic{flex:none;width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#E07A1F;color:#fff;font-size:1.2rem}
.lg-scene small{display:block;font-weight:800;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;color:color-mix(in srgb,#E07A1F 75%,var(--ink))}
.lg-scene p{margin:3px 0 0;font-family:var(--display);font-size:1.12rem;line-height:1.3}
.lg-feuille .lg-dit{margin:4px 0 16px}
.lg-buts{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:10px}
.lg-buts li{display:flex;gap:12px;align-items:center;padding:12px;border:2px solid var(--line);border-radius:18px;background:var(--card);box-shadow:var(--lg-ombre);transition:border-color .2s,background .2s}
.lg-buts .coche{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:2.5px solid var(--line);color:var(--soft);font-size:.9rem}
.lg-buts li.ok{border-color:color-mix(in srgb,var(--ok) 55%,var(--line));background:color-mix(in srgb,var(--ok) 8%,var(--card))}
.lg-buts li.ok .coche{background:var(--ok);border-color:var(--ok);color:#fff;animation:lgPop .35s ease}
.lg-buts .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.lg-buts .but{font-weight:700;line-height:1.35}
.lg-buts .mod{display:flex;gap:6px;align-items:baseline;color:var(--sky,#2E7DD7)}
.lg-buts .mod i{font-size:.75rem;flex:none}
.lg-buts .mod b{font-family:var(--display);font-size:1.08rem;color:var(--ink);overflow-wrap:anywhere}
.lg-buts small{color:var(--soft);font-size:.85rem}
.lg-buts .lg-play{flex:none}
@keyframes lgPop{0%{transform:scale(.6)}60%{transform:scale(1.15)}100%{transform:none}}
.lg-go-mis{margin:4px 0 12px}
.lg-teaser{display:flex;gap:10px;align-items:center;width:100%;text-align:left;border:2px dashed var(--line);background:transparent;color:var(--soft);border-radius:16px;padding:12px 14px;margin:4px 0 8px;font:inherit;font-weight:700;font-size:.92rem;cursor:pointer}
.lg-teaser i{flex:none;color:#C99A00}
.lg-mis-n{display:flex;gap:6px;align-items:center;font-weight:800;color:var(--soft);font-size:.92rem}
.lg-but-1{font-family:var(--display);font-size:1.15rem;line-height:1.3;margin:0 0 10px}
/* jouer avec quelqu'un de ma famille : les phrases en grand */
.lg-grandes{display:grid;gap:12px;margin:0 0 8px}
.lg-grande{display:flex;flex-direction:column;gap:6px;padding:16px;border:2px solid var(--line);border-radius:20px;background:var(--card);box-shadow:var(--lg-ombre)}
.lg-grande small{color:var(--soft);font-weight:700;font-size:.85rem}
.lg-grande b{font-family:var(--display);font-size:1.6rem;line-height:1.2;overflow-wrap:anywhere}
.lg-grande .sens{color:var(--soft)}
.lg-grande .act{display:flex;gap:10px;align-items:center;margin-top:6px}
.lg-dit-ok{display:inline-flex;gap:8px;align-items:center;height:46px;padding:0 18px;border-radius:999px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-weight:800;cursor:pointer;box-shadow:0 3px 0 var(--line)}
.lg-grande.ok{border-color:color-mix(in srgb,var(--ok) 55%,var(--line));background:color-mix(in srgb,var(--ok) 8%,var(--card))}
.lg-grande.ok .lg-dit-ok{background:var(--ok);border-color:var(--ok);color:#fff;box-shadow:0 3px 0 color-mix(in srgb,var(--ok) 60%,#000)}
.lg-feuille .lg-chat{max-height:none}
.lg-l2.lg-l2-row{flex-direction:row;align-items:center;gap:14px}
/* intro dunité : même tuile que len-tête de la langue (drapeau en fond, voile sombre, texte blanc) */
.lg-intro-u{position:relative;overflow:hidden;border-radius:22px;padding:18px 16px!important;color:#fff;background:var(--lc);box-shadow:0 5px 0 color-mix(in srgb,var(--lc) 60%,#000);margin-bottom:18px}
.lg-intro-u>*{position:relative;z-index:1}
.lg-intro-u>.lg-hero-drap{position:absolute;inset:0;z-index:0}
.lg-intro-u>.lg-hero-drap svg,.lg-intro-u>.lg-hero-drap>*{position:absolute;inset:0;width:100%!important;height:100%!important;border-radius:0!important;box-shadow:none!important}
.lg-intro-u>.lg-hero-drap::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,16,40,.45),rgba(10,16,40,.78))}
.lg-intro-u h2,.lg-intro-u p,.lg-intro-u b{color:#fff!important;text-shadow:0 2px 6px rgba(0,0,0,.45)}
.lg-intro-u .lg-badge{background:rgba(255,255,255,.14)!important;color:#fff!important;border:2px solid rgba(255,255,255,.85)!important;box-shadow:none!important}
/* parler : plus d air au-dessus de la phrase à dire */
.lg-mic-z+.lg-aide{margin-top:14px}
.lg-aide.c+*{margin-top:26px!important}
/* imagier : plus de rectangle blanc derrière les dessins (fondateur, 25/10/2026) — les dessins ont un fond blanc opaque :
   en clair, fusion avec le fond (multiply) ; en sombre, un médaillon clair aux coins doux */
.xi-img:not(.charge):not(.vide){background:transparent}
.xi-img img{mix-blend-mode:multiply}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .xi-img:not(.charge):not(.vide){background:#F3EEE2;border-radius:18px}}
:root[data-theme="dark"] .xi-img:not(.charge):not(.vide){background:#F3EEE2;border-radius:18px}
/* écran d unité (fondateur, 25/10/2026) : plus de drapeau en fond ; le contenu de l unité mis en avant (cartes nettes, relief) */
.lg-intro-u .lg-hero-drap{display:none!important}
.lg-intro-u{background:linear-gradient(135deg,#3E8F3A,#2F7A3C)!important;color:#fff!important;padding:14px 16px!important;min-height:0!important;box-shadow:0 4px 0 #245C2C!important;border:0!important}
.lg-intro-u h2,.lg-intro-u p,.lg-intro-u .lg-intro-h{color:#fff!important}
.lg-jsd li{box-shadow:0 4px 0 var(--line)!important}
.lg-jsd b{font-weight:800}
.lg-etapes button{font-weight:800!important;box-shadow:0 4px 0 var(--line);min-height:60px}
.lg-etapes .ic{width:38px;height:38px;border-radius:12px;background:var(--sky)!important;color:#fff!important}

/* aide à la lecture des débutants (pinyin, kana + rōmaji, translittération de l'arabe) : sous le texte, discrète, toujours de gauche à droite */
.lg-lec{display:block;font-size:.78em;font-weight:500;line-height:1.35;opacity:.78;margin-top:2px;letter-spacing:.01em;unicode-bidi:isolate;text-align:inherit}
[dir="rtl"]>.lg-lec{text-align:right}
[lang="ar"]{font-family:"Noto Naskh Arabic","Geeza Pro","Segoe UI",Tahoma,sans-serif;line-height:1.7}
/* piments de difficulté : même rouge que la landing (#E0242F), légère ombre ; non cochés gris clair */
.lg-diff{color:#E0242F!important;filter:drop-shadow(0 1px 0 rgba(90,10,15,.35))}
.lg-diff svg.off path,.lg-u .lg-diff svg.off path{fill:#CDD3CA!important}

/* ressenti après un atelier (bien / pas bien, un mot facultatif) */
.lg-ress{margin:.6rem 0 .9rem;padding:.7rem .8rem;border-radius:14px;background:var(--card);border:1px solid var(--line)}
.lg-ress-q{margin:0 0 .5rem;font-weight:700}
.lg-ress-b{display:flex;gap:.5rem;flex-wrap:wrap}
.lg-ress-o{display:flex;align-items:center;gap:.4rem;padding:.5rem .8rem;border-radius:999px;border:2px solid var(--line);background:transparent;color:var(--ink);font:inherit;cursor:pointer}
.lg-ress-o.on{border-color:var(--nc,#1F5FA8);background:color-mix(in srgb,var(--nc,#1F5FA8) 12%,var(--card))}
.lg-ress-m{display:block;margin:.6rem 0 .4rem}.lg-ress-m span{display:block;font-size:.9rem;margin-bottom:.25rem}
.lg-ress-m textarea{width:100%;box-sizing:border-box;border-radius:10px;border:1px solid var(--line);padding:.45rem;font:inherit;resize:vertical;background:transparent;color:inherit}
.lg-a-finir{color:#B45309}
.lg-micro-avant{display:flex;gap:.4rem;align-items:flex-start}

/* Ogrelo · parcours « Écriture » des Langues (public/ecriture.js) : tableau des signes, leçons, révision. Clair et sombre (variables
   de l'appli), 375 px et plus. Polices du système pour le japonais, le chinois et l'arabe (aucune police téléchargée). */
.ecr [lang="ja"],.ecr-sig:lang(ja),.lg-tu .ecr-gl:lang(ja){font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","Noto Sans JP","Noto Sans CJK JP",sans-serif}
.ecr [lang="zh"]{font-family:"PingFang SC","Hiragino Sans GB","Noto Sans SC","Noto Sans CJK SC","Microsoft YaHei",sans-serif}
.ecr [lang="ar"]{font-family:"Geeza Pro","Noto Naskh Arabic","Noto Sans Arabic","Segoe UI","Arial",sans-serif;font-feature-settings:normal;letter-spacing:0!important}
.ecr [lang="ru"]{font-family:var(--body,system-ui),system-ui,sans-serif}
.ecr-sig{display:inline-block;line-height:1.15;color:var(--ink);font-weight:500}
.ecr-sig.xl{font-size:4.2rem;line-height:1.1}
.ecr-sig.xl:lang(ar){font-size:4.6rem;line-height:1.35}
.ecr-go .ecr-apercu{font-size:1.5rem;letter-spacing:.12em;font-weight:600}
.ecr-go .ecr-apercu:lang(ar){letter-spacing:0;font-size:1.7rem}
.ecr-rev{margin:0 0 18px}
/* onglets d'écriture (hiragana / katakana…) */
.ecr-ong{display:flex;gap:8px;margin:6px 0 12px;padding:4px;border-radius:16px;background:var(--line)}
.ecr-ong button{flex:1;border:0;border-radius:12px;padding:10px 6px;font:inherit;font-weight:800;color:var(--soft);background:transparent;cursor:pointer;min-height:44px}
.ecr-ong button[aria-selected="true"]{background:var(--card);color:var(--ink);box-shadow:0 2px 0 color-mix(in srgb,var(--line) 70%,#000)}
.ecr-aide{margin:4px 2px 12px;color:var(--soft);font-size:.86rem;font-weight:700}
/* le tableau : une ligne = une leçon */
.ecr-g{margin:0 0 18px}
.ecr-gt b{color:var(--ink);font-weight:800}
.ecr-gt{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:30px;margin:0 2px 6px;color:var(--soft);font-size:.8rem;font-weight:700}
.ecr-gb{flex:none;border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:5px 12px;font:inherit;font-size:.8rem;font-weight:800;cursor:pointer;min-height:34px}
.ecr-cases{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.ecr-c{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:78px;padding:8px 2px 10px;border:2px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink);font:inherit;cursor:pointer;box-shadow:0 3px 0 var(--line);transition:transform .1s,box-shadow .1s}
.ecr-c:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}
.ecr-c.sel{border-color:var(--ogre);box-shadow:0 3px 0 color-mix(in srgb,var(--ogre) 60%,#000)}
.ecr-c .ecr-sig{font-size:1.75rem}
.ecr-c .ecr-sig:lang(ar){font-size:1.9rem}
.ecr-c small{font-size:.74rem;font-weight:800;color:var(--soft);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ecr-g:not(.vu) .ecr-c{opacity:.78}
/* maîtrise d'un signe : 4 petits traits (vert de Grignon), gris tant que le signe n'est pas vu */
.ecr-m{display:flex;gap:2px;margin-top:3px}
.ecr-m i{width:7px;height:4px;border-radius:2px;background:var(--line)}
.ecr-m.n1 i:nth-child(-n+1),.ecr-m.n2 i:nth-child(-n+2),.ecr-m.n3 i:nth-child(-n+3),.ecr-m.n4 i{background:var(--ogre)}
.ecr-legende{display:flex;flex-wrap:wrap;gap:8px 14px;margin:4px 2px 18px;color:var(--soft);font-size:.76rem;font-weight:700}
.ecr-legende span{display:inline-flex;align-items:center;gap:6px}.ecr-legende .ecr-m{margin:0}
/* fiche d'un signe (tableau et leçon) */
.ecr-detail{position:sticky;bottom:calc(8px + env(safe-area-inset-bottom));margin-top:10px;padding:14px;border:2px solid var(--line);border-radius:20px;background:var(--card);box-shadow:0 6px 18px rgba(0,0,0,.12)}
.ecr-fiche{display:flex;align-items:center;gap:16px}
.ecr-fiche .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ecr-fiche .tx b{font-family:var(--display);font-size:1.7rem!important;color:var(--ink)}
.ecr-fiche .tx small{color:var(--soft);font-weight:700}
.ecr-fiche .ecr-sig.xl{min-width:1.2em;text-align:center}
.ecr-mn{display:flex;gap:8px;align-items:flex-start;margin:12px 0 0;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--ogre) 10%,var(--card));color:var(--ink);font-size:.95rem;line-height:1.4}
.ecr-mn i{flex:none;margin-top:2px;color:var(--ogre)}
.ecr-formes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0 0}
.ecr-formes span{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px;border:2px solid var(--line);border-radius:12px}
.ecr-formes b{font-size:2rem;line-height:1.4;font-weight:500;color:var(--ink)}
.ecr-formes small{font-size:.72rem;font-weight:800;color:var(--soft)}
.ecr-ex{margin:10px 0 0;color:var(--soft);font-weight:700}.ecr-ex b{color:var(--ink);font-size:1.3rem;font-weight:500}
/* leçon */
.ecr-bar{margin:0 0 14px}
.ecr-intro{padding:20px 18px}
.ecr-q .ecr-enonce{display:flex;justify-content:center;align-items:center;min-height:96px;margin:14px 0 4px}
.ecr-lec{font-family:var(--display);font-weight:800;color:var(--ink);font-size:1.15rem;margin:8px 0 2px}
.ecr-lec.xl{font-size:2.6rem}
.ecr-mot{font-size:2.6rem;line-height:1.35;margin:0;color:var(--ink);text-align:center;word-break:keep-all}
.ecr-mot:lang(ar){font-size:2.8rem;line-height:1.6}
.ecr-ph{font-size:1.9rem;line-height:1.5;margin:4px 0 12px;color:var(--ink)}
.ecr-ph:lang(ar){font-size:2.1rem;line-height:1.8}
.ecr-phr{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.ecr-sens{color:var(--soft);font-weight:700;margin:4px 0 0}
.ecr-q~.opts .opt span{font-size:1.15rem;font-weight:800}
.opts .opt.ecr-os span{font-size:2rem;line-height:1.3;font-weight:500}
.opts .opt.ecr-os span:lang(ar){font-size:2.2rem;line-height:1.5}
.opts.ecr-damier{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.opts.ecr-damier .opt{justify-content:center;text-align:center;margin:0}
.ecr-xp{display:flex;align-items:center;justify-content:center;gap:6px;font-family:var(--display);font-weight:800;color:var(--ogre);font-size:1.2rem;margin:-8px 0 20px}
/* proposition avant la 1re unité, carte dans « ma langue » */
.ecr-prop{margin:0 0 26px;text-align:center;font-size:2.4rem;line-height:1.5;letter-spacing:.15em;color:var(--ink)}
.ecr-prop[lang="ar"]{letter-spacing:0;font-family:"Geeza Pro","Noto Naskh Arabic","Noto Sans Arabic",sans-serif}
.lg-ecr{--c:#7B3FD1;display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:2px solid color-mix(in srgb,var(--c) 35%,var(--line));background:color-mix(in srgb,var(--c) 7%,var(--card));color:var(--ink);border-radius:22px;padding:14px;margin:0 0 18px;font:inherit;cursor:pointer;box-shadow:0 4px 0 color-mix(in srgb,var(--c) 30%,var(--line))}
.lg-ecr:active{transform:translateY(3px);box-shadow:0 1px 0 color-mix(in srgb,var(--c) 30%,var(--line))}
.lg-ecr .gl{flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--c);color:#fff;font-size:1.6rem;font-weight:600;box-shadow:0 3px 0 color-mix(in srgb,var(--c) 60%,#000)}
.lg-ecr .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.lg-ecr .tx b{font-family:var(--display);font-size:1.05rem;line-height:1.25}
.lg-ecr .tx small{color:var(--soft);font-weight:700;font-size:.82rem}
.lg-ecr .ecr-m{margin:4px 0 0}
@media (max-width:360px){.ecr-cases{gap:6px}.ecr-c{min-height:70px}.ecr-c .ecr-sig{font-size:1.5rem}.ecr-sig.xl{font-size:3.4rem}.ecr-mot{font-size:2.1rem}}
@media (prefers-reduced-motion:reduce){.ecr-c,.lg-ecr{transition:none}}

/* « Signaler une erreur » (signaler.js) : drapeau discret + feuille du bas */
.sig-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:36px;min-height:36px;padding:0 8px;margin:-8px -6px -8px 4px;border:0;border-radius:999px;background:none;
  color:var(--soft,#8a8a8a);font:inherit;font-size:.82rem;font-weight:700;letter-spacing:0;text-transform:none;cursor:pointer;opacity:.75;vertical-align:middle;-webkit-tap-highlight-color:transparent}
.sig-btn i{width:1.05em;height:1.05em}
.sig-btn:hover,.sig-btn:focus-visible{opacity:1;background:color-mix(in srgb,var(--ink,#222) 7%,transparent)}
.sig-btn.fait{color:var(--ogre-d,#3E7F31);opacity:1}
.sig-txt{margin:0;padding:0 12px;min-height:40px}
.sig-pied{display:flex;justify-content:center;margin:22px 0 4px}
.exo-top .sig-btn{margin-left:2px}
.exo-top-d{display:inline-flex;align-items:center;gap:2px}

html.sig-ouvert{overflow:hidden}
.sig-voile{position:fixed;inset:0;z-index:1100;background:rgba(20,18,30,.55);display:flex;align-items:flex-end;justify-content:center;padding:16px 0 0;animation:sig-fondu .2s ease-out}
.sig-feuille{position:relative;width:100%;max-width:480px;max-height:calc(100dvh - 16px);overflow:auto;background:var(--sheet,var(--card,#fff));color:var(--ink,#1f2421);border-radius:28px 28px 0 0;
  padding:26px 20px calc(26px + env(safe-area-inset-bottom,0px));box-shadow:0 -10px 30px rgba(0,0,0,.25);outline:none;overscroll-behavior:contain;animation:sig-monte .28s cubic-bezier(.2,.8,.2,1)}
@media (min-width:560px){.sig-voile{align-items:center;padding:16px}.sig-feuille{border-radius:28px;padding:30px 28px 28px}}
@keyframes sig-monte{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes sig-fondu{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.sig-voile,.sig-feuille{animation:none}}
.sig-x{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:color-mix(in srgb,var(--ink,#222) 8%,transparent);color:var(--ink,#222);display:grid;place-items:center}
.sig-tete{display:flex;align-items:center;gap:14px;margin:0 48px 22px 0}
.sig-tete h2{margin:0 0 4px;font-size:1.2rem;line-height:1.25}
.sig-tete p{margin:0;color:var(--soft,#666);font-size:.95rem;line-height:1.4}
.sig-face{flex:none;width:58px;height:58px;display:block}
.sig-face svg{width:100%;height:100%;display:block}
.sig-face.grand{width:96px;height:96px;margin:4px auto 12px}
.sig-raisons{display:flex;flex-direction:column;gap:10px}
.sig-puce{display:flex;align-items:center;gap:10px;width:100%;min-height:50px;padding:12px 16px;border:2px solid var(--line,#ddd);border-radius:16px;background:var(--card,#fff);color:var(--ink,#222);
  font:inherit;font-weight:700;font-size:1rem;text-align:left;cursor:pointer}
.sig-puce.on{border-color:var(--ogre,#56a443);background:color-mix(in srgb,var(--ogre,#56a443) 12%,var(--card,#fff))}
.sig-puce i{color:var(--ogre-d,#3E7F31)}
.sig-mot{display:block;margin-top:26px}
.sig-mot>span{display:block;font-weight:700;font-size:.92rem;margin-bottom:8px;color:var(--soft,#666)}
.sig-mot textarea{display:block;width:100%;box-sizing:border-box;border:2px solid var(--line,#ddd);border-radius:14px;padding:10px 12px;font:inherit;font-size:1rem;background:var(--card,#fff);color:var(--ink,#222);resize:none}
.sig-mot textarea:focus{outline:none;border-color:var(--ogre,#56a443)}
.sig-compte{display:block;text-align:right;color:var(--soft,#888);font-size:.78rem;margin-top:4px}
.sig-valider{display:block;width:100%;margin-top:26px}
.sig-valider:disabled{opacity:.5}
.sig-merci{text-align:center;padding:8px 4px 0}
.sig-merci h2{margin:0 0 8px;font-size:1.3rem}
.sig-merci p{margin:0 auto;max-width:34ch;color:var(--soft,#666);line-height:1.45}
.sig-merci .btn{margin-top:28px;width:100%}
.df-sig{display:flex;justify-content:flex-end;margin-top:10px}
.lg-pas .sig-btn,.lg-mini .sig-btn,.qbar .sig-btn{opacity:1;color:var(--soft,#777)}
/* drapeau bien visible : petite pastille orange « Une erreur ? » */
.sig-btn{opacity:1!important;color:#C46F00!important;background:#FFF3E0!important;border:2px solid #FFB74D!important;box-shadow:0 2px 0 #FFB74D;min-height:30px!important;padding:0 10px!important;margin:0 0 0 8px!important;font:inherit;font-weight:800;font-size:.78rem}
.sig-btn i{width:14px!important;height:14px!important}
.sig-btn:active{transform:translateY(2px);box-shadow:none}
.sig-btn.fait{color:#2F7A00!important;background:#E7F6DA!important;border-color:#8BC34A!important;box-shadow:0 2px 0 #8BC34A}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .sig-btn{background:#3A2A10!important;color:#FFB74D!important}}
:root[data-theme="dark"] .sig-btn{background:#3A2A10!important;color:#FFB74D!important}
/* drapeau seul, jaune bien visible (sans texte), rond */
.sig-btn:not(.sig-txt){width:32px!important;min-width:32px!important;height:32px!important;min-height:32px!important;padding:0!important;border-radius:50%!important;background:#FFD43B!important;border:2px solid #E0A800!important;color:#5A4300!important;box-shadow:0 2px 0 #C99400!important}
.sig-btn:not(.sig-txt) i{width:15px!important;height:15px!important}
.sig-btn.fait:not(.sig-txt){background:#8BC34A!important;border-color:#5E9A1F!important;color:#fff!important;box-shadow:0 2px 0 #4F8A12!important}

/* Contrôle de qualité des photos (photo.js) : feuille du bas d'Ogrelo, vignettes des photos refusées */
html.pq-ouvert{overflow:hidden}
label.pq-mesure{opacity:.6;pointer-events:none}
.pq-voile{position:fixed;inset:0;z-index:1150;background:rgba(20,18,30,.55);display:flex;align-items:flex-end;justify-content:center;padding:16px 0 0;animation:pq-fondu .2s ease-out}
.pq-feuille{position:relative;width:100%;max-width:480px;max-height:calc(100dvh - 16px);overflow:auto;background:var(--sheet,var(--card,#fff));color:var(--ink,#1f2421);border-radius:28px 28px 0 0;
  padding:26px 20px calc(24px + env(safe-area-inset-bottom,0px));box-shadow:0 -10px 30px rgba(0,0,0,.25);outline:none;overscroll-behavior:contain;animation:pq-monte .28s cubic-bezier(.2,.8,.2,1)}
@media (min-width:560px){.pq-voile{align-items:center;padding:16px}.pq-feuille{border-radius:28px;padding:30px 28px 26px}}
@keyframes pq-monte{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes pq-fondu{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.pq-voile,.pq-feuille{animation:none}}
.pq-x{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:color-mix(in srgb,var(--ink,#222) 8%,transparent);color:var(--ink,#222);display:grid;place-items:center}
.pq-tete{display:flex;align-items:flex-start;gap:14px;margin:0 48px 20px 0}
.pq-face{flex:none;width:62px;height:62px;display:block}
.pq-face svg{width:100%;height:100%;display:block}
.pq-bulle{position:relative;margin:4px 0 0;padding:12px 14px;background:var(--card,#fff);border:2px solid var(--line,#ddd);border-radius:18px 18px 18px 4px;font-size:1.02rem;line-height:1.45}
.pq-minis{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,104px));justify-content:center;gap:12px;margin:0 0 22px}
.pq-minis.seule{grid-template-columns:minmax(0,150px)}
.pq-minis figure{margin:0;display:flex;flex-direction:column;gap:6px;align-items:center}
.pq-minis img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:12px;border:2px solid var(--line,#ddd);background:var(--line,#eee)}
.pq-minis figcaption{font-size:.85rem;font-weight:700;color:var(--ko-t,#B8322A);text-align:center}
.pq-feuille .btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:0 0 10px}
.pq-feuille .btn i{width:1.1em;height:1.1em}
.pq-forcer{display:block;margin:6px auto 0;min-height:44px;padding:0 14px;border:0;background:none;color:var(--soft,#6b6b6b);font:inherit;font-size:.92rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.pq-forcer:focus-visible,.pq-x:focus-visible{outline:3px solid var(--ogre,#56a443);outline-offset:2px}

/* Ogrelo · inviter ses camarades (inviter.js) et tenues de mon ogre (tenues.js). Violet du défi : #8E44EC. Clair + sombre, 360 px. */
:root{--dfv:#8E44EC;--dfv-d:#6A28C4;--dfv-bg:#F4ECFE}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--dfv-bg:#2C2240}}
:root[data-theme="dark"]{--dfv-bg:#2C2240}

/* ---------- feuille de partage ---------- */
.ivt-fond{position:fixed;inset:0;z-index:450;display:flex;align-items:flex-end;justify-content:center;background:rgba(30,26,44,0);transition:background .25s}
.ivt-fond.on{background:rgba(30,26,44,.55)}
.ivt-feuille{width:min(100%,520px);max-height:92vh;overflow:auto;background:var(--card);color:var(--ink);border-radius:26px 26px 0 0;padding:10px 18px calc(18px + env(safe-area-inset-bottom,0px));
  box-shadow:0 -10px 40px rgba(0,0,0,.25);transform:translateY(100%);transition:transform .35s cubic-bezier(.2,1.1,.4,1);display:grid;gap:12px}
.ivt-fond.on .ivt-feuille{transform:none}
.ivt-poignee{justify-self:center;width:44px;height:5px;border-radius:9px;background:var(--line)}
.ivt-feuille .og-dit{margin:6px 0 0}
.ivt-msg{background:var(--dfv-bg);border:2px solid color-mix(in srgb,var(--dfv) 35%,var(--line));border-radius:18px;padding:12px 14px}
.ivt-msg p{margin:0 0 6px;line-height:1.4}.ivt-msg small{color:var(--soft);word-break:break-all;display:flex;gap:6px;align-items:flex-start}
.ivt-go{width:100%;margin:0!important;background:var(--dfv)!important;border-color:var(--dfv)!important;color:#fff!important;box-shadow:0 5px 0 var(--dfv-d)!important;display:flex;align-items:center;justify-content:center;gap:8px}
.ivt-rangee{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ivt-b{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 4px;border-radius:16px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-weight:700;font-size:.85rem;text-decoration:none;cursor:pointer;box-shadow:0 4px 0 var(--line)}
.ivt-b:active{transform:translateY(3px);box-shadow:0 1px 0 var(--line)}
.ivt-b svg{width:28px;height:28px}.ivt-b i{font-size:1.6rem;color:var(--dfv)}
.ivt-prive{margin:0;text-align:center;color:var(--soft);font-size:.82rem}.ivt-x{justify-self:center}
.ivt-toast{position:fixed;left:50%;top:calc(14px + env(safe-area-inset-top,0px));transform:translateX(-50%);z-index:500;display:flex;align-items:center;gap:10px;max-width:calc(100% - 32px);
  background:var(--ink);color:var(--card);border-radius:16px;padding:10px 16px;box-shadow:0 8px 24px rgba(0,0,0,.25);transition:opacity .4s}
.ivt-toast .ic{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--dfv);color:#fff;flex:none}.ivt-toast.out{opacity:0}

/* ---------- fin de quiz : carte « Défie tes camarades » ---------- */
.ivt-carte{margin:16px 0;padding:16px;border-radius:22px;background:var(--dfv-bg);border:2px solid color-mix(in srgb,var(--dfv) 40%,var(--line));box-shadow:0 5px 0 color-mix(in srgb,var(--dfv) 45%,var(--line));text-align:center;display:grid;gap:8px;justify-items:center}
.ivt-carte b{font-family:var(--display);font-size:1.15rem}.ivt-carte p{margin:0;color:var(--soft);line-height:1.4}
.ivt-l{display:flex;align-items:center;gap:10px}.ivt-f{width:54px;height:54px;border-radius:50%;background:var(--card);display:grid;place-items:center;border:2px solid color-mix(in srgb,var(--dfv) 40%,var(--line))}
.ivt-f svg{width:46px;height:46px}.ivt-f.d i{font-size:1.6rem;color:var(--dfv)}
.ivt-vs{font-family:var(--display);font-weight:800;background:#F5B800;color:#5A2A00;border-radius:10px;padding:1px 8px;transform:rotate(-8deg);box-shadow:0 3px 0 #C98F00}
.ivt-carte .ivt-go{max-width:340px}.ivt-tard{font-size:.9rem}
.ivt-k{display:inline-flex;gap:6px;align-items:center;background:#F5B800;color:#5A2A00;font-weight:800;border-radius:999px;padding:3px 12px;font-size:.82rem}
.ivt-carte.ivt-top{background:linear-gradient(160deg,#7B3FD1 0%,#9C3CC0 55%,#C2389E 100%);border:0;box-shadow:0 6px 0 #4E1F96;color:#fff}
.ivt-carte.ivt-top p{color:#fff;opacity:.92}.ivt-carte.ivt-top .ivt-go{background:#fff!important;color:var(--dfv)!important;border-color:#fff!important;box-shadow:0 5px 0 rgba(0,0,0,.2)!important}
.ivt-carte.ivt-top .ivt-tard{color:#fff!important;opacity:.85}.ivt-carte.ivt-top .ivt-f{border-color:rgba(255,255,255,.6);background:rgba(255,255,255,.18)}
.ivt-carte.ivt-top .ivt-f.d i{color:#fff}

/* ---------- contrôle : bandeau « Révise ce contrôle avec ta classe » ---------- */
.ivt-ctl{position:relative;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:10px;margin:10px 0 2px;padding:12px 38px 10px 12px;border-radius:18px;background:var(--dfv-bg);border:2px solid color-mix(in srgb,var(--dfv) 35%,var(--line))}
.ivt-ctl-i{width:38px;height:38px;border-radius:12px;background:var(--dfv);color:#fff;display:grid;place-items:center}
.ivt-ctl .tx b{display:block;font-size:.95rem}.ivt-ctl .tx small{color:var(--soft);font-size:.8rem;line-height:1.3;display:block}
.ivt-ctl-go{grid-column:1/-1;border:0;border-radius:12px;background:var(--dfv);color:#fff;font:inherit;font-weight:800;padding:8px 12px;box-shadow:0 3px 0 var(--dfv-d);cursor:pointer}
.ivt-ctl-x{position:absolute;top:6px;right:6px;border:0;background:none;color:var(--soft);padding:6px;cursor:pointer}
.ivt-ctl-prof{grid-column:1/-1;justify-self:start;font-size:.85rem;display:inline-flex;gap:6px;align-items:center}

/* ---------- grande feuille (fin de « Mieux me connaître », arrivée, bienvenue, fin d'un invité) ---------- */
.ivt-prop .ivt-duo{font-size:2.2rem;color:#fff}

/* ---------- Moi : inviter mes camarades + paliers + mon prof ---------- */
.ivt-moi>*,.ivt-feuille>*,.ivt-carte>*{min-width:0}
.ivt-moi{margin:18px 0;padding:16px;border-radius:22px;background:var(--card);border:2px solid color-mix(in srgb,var(--dfv) 40%,var(--line));box-shadow:0 5px 0 color-mix(in srgb,var(--dfv) 45%,var(--line));display:grid;gap:12px}
.ivt-moi-h{display:flex;gap:12px;align-items:center}.ivt-moi-h b{font-family:var(--display);font-size:1.15rem;display:block}.ivt-moi-h small{color:var(--soft);line-height:1.35;display:block}
.ivt-moi-i{width:46px;height:46px;flex:none;border-radius:15px;background:var(--dfv);color:#fff;display:grid;place-items:center;font-size:1.4rem;box-shadow:0 3px 0 var(--dfv-d)}
.ivt-moi-l{display:flex;gap:8px;align-items:center;background:var(--dfv-bg);border-radius:14px;padding:8px 8px 8px 12px}
.ivt-moi-l code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.85rem;color:var(--ink)}
.ivt-moi-cp{border:0;border-radius:10px;background:var(--card);color:var(--dfv);padding:8px;cursor:pointer;flex:none}
.ivt-pal p{margin:0 0 26px;line-height:1.4}
.ivt-pal-b{position:relative;height:12px;border-radius:9px;background:var(--line);margin:0 22px 30px}
.ivt-pal-b>i{position:absolute;inset:0 auto 0 0;border-radius:9px;background:linear-gradient(90deg,#B07BF5,var(--dfv))}
.ivt-pal-j{position:absolute;top:-8px;transform:translateX(-50%);display:grid;justify-items:center;gap:2px}
.ivt-pal-j b{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--card);border:2px solid var(--line);font-size:.8rem}
.ivt-pal-j.ok b{background:var(--dfv);border-color:var(--dfv);color:#fff}.ivt-pal-j small{font-size:.7rem;color:var(--soft);white-space:nowrap}
.ivt-pal-note{color:var(--soft);font-size:.78rem;display:block}
.ivt-prof{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:10px 12px;border-radius:16px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:inherit;cursor:pointer;box-shadow:0 4px 0 var(--line)}
.ivt-prof .i{width:38px;height:38px;border-radius:12px;background:#2E7DD7;color:#fff;display:grid;place-items:center;flex:none}
.ivt-prof .tx{flex:1}.ivt-prof .tx b{display:block}.ivt-prof .tx small{color:var(--soft);font-size:.82rem}

/* ---------- écran de connexion : « <prénom> t'a invité » ---------- */
.ivt-accueil{display:flex;gap:10px;align-items:center;margin:0 0 14px;padding:10px 14px;border-radius:16px;background:var(--dfv-bg);border:2px solid color-mix(in srgb,var(--dfv) 35%,var(--line))}
.ivt-accueil p{margin:0;line-height:1.35}.ivt-ic{width:34px;height:34px;flex:none;border-radius:50%;background:var(--dfv);color:#fff;display:grid;place-items:center}

/* ---------- tenues : galerie ---------- */
.ten-moi{margin:18px 0;padding:16px;border-radius:22px;background:var(--card);border:2px solid var(--line);box-shadow:0 5px 0 var(--line)}
.ten-charge{display:grid;place-items:center;min-height:80px}
.ten-h{display:flex;gap:12px;align-items:center}.ten-h b{font-family:var(--display);font-size:1.2rem;display:block}.ten-h small{color:var(--soft);display:block;line-height:1.35}
.ten-moi-av{width:70px;height:70px;flex:none;border-radius:50%;background:var(--dfv-bg);display:grid;place-items:center;border:3px solid var(--dfv)}.ten-moi-av svg{width:62px;height:62px}
.ten-h4{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:18px 0 10px;font-size:1rem}.ten-h4 small{margin-left:auto;font-weight:600;color:var(--soft);font-size:.8rem}
.ten-evo{display:flex;align-items:stretch;gap:4px;overflow-x:auto;padding:2px 2px 8px;scroll-snap-type:x mandatory}
.ten-evo{align-items:flex-start}.ten-evo .ten-c{flex:0 0 96px;scroll-snap-align:start;padding:8px 6px 10px}.ten-evo .ten-av{width:64px;height:64px}.ten-evo .ten-av svg{width:60px;height:60px}.ten-evo .ten-c b{font-size:.82rem}.ten-fl{align-self:center;color:var(--soft);flex:none}
.ten-grille{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.ten-c{position:relative;display:grid;justify-items:center;align-content:start;gap:3px;padding:10px 8px 12px;border-radius:18px;border:2px solid var(--line);background:var(--card);color:var(--ink);font:inherit;text-align:center;cursor:pointer;box-shadow:0 4px 0 var(--line)}
.ten-c:active{transform:translateY(3px);box-shadow:0 1px 0 var(--line)}
.ten-c b{font-size:.9rem;line-height:1.2}.ten-c small{font-size:.75rem;line-height:1.25;color:var(--soft)}
.ten-c.ok{border-color:color-mix(in srgb,var(--dfv) 45%,var(--line));box-shadow:0 4px 0 color-mix(in srgb,var(--dfv) 45%,var(--line))}
.ten-c.porte{background:var(--dfv-bg);border-color:var(--dfv)}.ten-c.porte .ten-et{color:var(--dfv);font-weight:800}
.ten-av{position:relative;width:78px;height:78px;display:grid;place-items:center}.ten-av svg{width:74px;height:74px}
.ten-c.ferme .ten-av svg{filter:grayscale(1) brightness(1.05) contrast(.85);opacity:.5}
.ten-cad{position:absolute;right:2px;bottom:2px;width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--card);display:grid;place-items:center;font-size:.85rem}
.ten-new{position:absolute;top:-4px;right:-10px;background:#F5B800;color:#5A2A00;border-radius:999px;padding:1px 7px;font-size:.68rem;font-weight:800}
.ten-ex{color:var(--dfv)!important;font-weight:700;display:flex;gap:4px;align-items:center}
.ten-bar{width:80%;height:6px;border-radius:6px;background:var(--line);overflow:hidden;margin-top:3px}.ten-bar i{display:block;height:100%;background:var(--dfv);border-radius:6px}
.ten-p{font-weight:700}.ten-note{margin:14px 0 0;color:var(--soft);font-size:.82rem;line-height:1.4}

/* ---------- tenues : la fête du déblocage ---------- */
.ten-fete{position:fixed;inset:0;z-index:460;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(30,26,44,0);transition:background .3s}
.ten-fete.on{background:rgba(30,26,44,.65)}
.ten-fete-in{position:relative;overflow:hidden;width:min(100%,420px);max-height:94vh;overflow-y:auto;border-radius:28px;padding:22px 18px 18px;text-align:center;color:#fff;
  background:linear-gradient(160deg,#7B3FD1 0%,#9C3CC0 55%,#C2389E 100%);box-shadow:0 20px 50px rgba(78,31,150,.5);transform:scale(.7);opacity:0;transition:transform .45s cubic-bezier(.2,1.4,.4,1),opacity .3s;display:grid;gap:10px;justify-items:center}
.ten-fete.on .ten-fete-in{transform:none;opacity:1}
.ten-rayons{position:absolute;top:30px;left:50%;width:360px;height:360px;margin-left:-180px;background:repeating-conic-gradient(rgba(255,255,255,.16) 0 12deg,transparent 12deg 30deg);border-radius:50%;animation:tenTourne 14s linear infinite;pointer-events:none}
@keyframes tenTourne{to{transform:rotate(360deg)}}
.ten-fete-av{position:relative;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.18);border:4px solid rgba(255,255,255,.7);display:grid;place-items:center;animation:tenSaut .7s ease .4s 2}
.ten-fete-av svg{width:132px;height:132px}
@keyframes tenSaut{40%{transform:translateY(-14px) scale(1.04)}}
.ten-fete-in h3{position:relative;font-family:var(--display);font-size:1.6rem;margin:0}.ten-fete-ex{position:relative;margin:0;background:#F5B800;color:#5A2A00;border-radius:999px;padding:3px 12px;font-weight:800;display:inline-flex;gap:6px;align-items:center}
.ten-fete-in .og-dit{position:relative;margin:4px 0;text-align:left;color:var(--ink)}
.ten-fete-in .btn{position:relative;width:100%;margin:0}.ten-porter{background:#fff!important;color:var(--dfv)!important;border-color:#fff!important;box-shadow:0 5px 0 rgba(0,0,0,.2)!important}
.ten-montrer{background:rgba(255,255,255,.14)!important;color:#fff!important;border:2px solid rgba(255,255,255,.7)!important;box-shadow:none!important}
.ten-tard{position:relative;color:#fff!important;opacity:.85}
@media (prefers-reduced-motion: reduce){.ten-rayons,.ten-fete-av{animation:none}.ten-fete-in,.ivt-feuille{transition:none}}

/* ---------- montrer, pas expliquer : vignettes des récompenses, gros bouton 3D ---------- */
.ivt-titre{margin:4px 0 0;text-align:center;font-family:var(--display);font-size:1.5rem;line-height:1.15}
.ivt-vig{display:flex;justify-content:center;gap:8px;flex-wrap:nowrap;padding:4px 2px 2px}
.ivt-v{flex:1 1 0;min-width:0;max-width:80px;display:grid;justify-items:center;gap:4px;border:0;background:none;padding:0;font:inherit;color:inherit;cursor:pointer}
.ivt-vf{position:relative;width:100%;max-width:70px;aspect-ratio:1;height:auto;border-radius:20px;display:grid;place-items:center;background:var(--dfv-bg);border:2px solid color-mix(in srgb,var(--dfv) 35%,var(--line));box-shadow:0 4px 0 color-mix(in srgb,var(--dfv) 40%,var(--line))}
.ivt-vf svg{width:84%;height:84%;filter:grayscale(1) brightness(1.05) contrast(.85);opacity:.55}
.ivt-vl{position:absolute;right:-6px;bottom:-6px;width:24px;height:24px;border-radius:50%;background:var(--ink);color:var(--card);display:grid;place-items:center;font-size:.75rem}
.ivt-vt{position:absolute;left:-6px;top:-6px;width:24px;height:24px;border-radius:50%;background:#F5B800;color:#5A2A00;display:grid;place-items:center;font-size:.75rem}
.ivt-vf.palier{background:linear-gradient(160deg,#FFD23F,#F29A0E);border-color:#C98F00;box-shadow:0 4px 0 #B85F00;color:#5A2A00;align-content:center;gap:0}
.ivt-vf.palier b{font-family:var(--display);font-size:1.25rem;line-height:1}.ivt-vf.palier small{font-weight:800;font-size:.68rem}
.ivt-vp{font-weight:800;font-size:.8rem;color:var(--dfv)}
.ivt-3d{font-family:var(--display);font-size:1.2rem!important;padding:16px!important;border-radius:18px!important;box-shadow:0 6px 0 var(--dfv-d)!important}
.ivt-3d:active{transform:translateY(5px);box-shadow:0 1px 0 var(--dfv-d)!important}
.ivt-carte b#ivtC{font-size:1.25rem}.ivt-carte .ivt-vigz{width:100%}
.ivt-carte.ivt-top .ivt-vp,.ivt-vig-blanc .ivt-vp{color:#fff}
.ivt-carte.ivt-top .ivt-vf:not(.palier),.ivt-vig-blanc .ivt-vf:not(.palier){background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.55);box-shadow:0 4px 0 rgba(0,0,0,.18)}
.ivt-vig-blanc{margin:4px 0 16px}
.ivt-photo{cursor:pointer;display:flex}.ivt-prog{justify-self:center;font-size:.9rem;display:inline-flex;gap:6px;align-items:center;text-align:center}

/* ---------- avatar : toutes les étapes et tenues visibles, insigne à côté du prénom ---------- */
.av-vit{margin:8px 0 4px;min-width:0;max-width:100%}.av-ed>*,.mmc-av>*{min-width:0}.av-ed{min-width:0;max-width:100%}.av-vit .av-l{margin-bottom:6px}
.av-vit-l{max-width:100%;display:flex;gap:8px;overflow-x:auto;padding:4px 2px 8px;scroll-snap-type:x proximity}
.av-vit-b{position:relative;flex:0 0 58px;height:58px;border-radius:16px;border:2px solid var(--line);background:var(--card);padding:2px;cursor:pointer;scroll-snap-align:start}
.av-vit-b svg{width:50px;height:50px}.av-vit-b.on{border-color:var(--dfv);background:var(--dfv-bg);box-shadow:0 3px 0 var(--dfv-d)}
.av-vit-b.ferme svg{filter:grayscale(1) brightness(1.05) contrast(.85);opacity:.5}.av-vit-b.vu{border-color:var(--ink)}
.av-vit-cad{position:absolute;right:-4px;bottom:-4px;width:20px;height:20px;border-radius:50%;background:var(--ink);color:var(--card);display:grid;place-items:center;font-size:.65rem}
.av-vit-sep{flex:0 0 2px;align-self:stretch;margin:6px 2px;background:var(--line);border-radius:2px}
.av-vit-tag{min-height:1.3em;margin:0;font-size:.85rem;color:var(--soft);line-height:1.3}
.av-rang{display:inline-flex;align-items:center;gap:1px;margin-left:4px;padding:1px 5px;border-radius:999px;background:var(--dfv);color:#fff;font-size:.68rem;font-weight:800;vertical-align:2px;line-height:1.3}
.av-rang i{font-size:.75rem}.av-rang.var{background:#F5B800;color:#5A2A00}.av-rang.s1{background:#5BA84A}.av-rang.s2{background:#2E7DD7}.av-rang.s3{background:var(--dfv)}.av-rang.s4{background:linear-gradient(135deg,#F5B800,#E07B00);color:#3A2400}span.av-rang svg{width:14px!important;height:10px!important;margin-right:2px}
.ivt-grandit{margin:2px 0 14px}.ivt-grandit .ivt-v{max-width:62px}

/* étincelles de l'ogre légendaire (immobiles si mouvement réduit) */
.av-etin{transform-box:fill-box;transform-origin:center;animation:avEtin 1.8s ease-in-out infinite}
@keyframes avEtin{0%,100%{opacity:.2;transform:scale(.5)}50%{opacity:1;transform:scale(1.15)}}
@media (prefers-reduced-motion: reduce){.av-etin{animation:none;opacity:.9}}

/* ---------- personnalisation : garçon / fille, looks (verrouillés = grisés + cadenas), aperçu en grand et à 40 px ---------- */
.av-apercu{display:flex;align-items:flex-end;justify-content:center;gap:14px}
.av-mini{display:grid;justify-items:center;gap:2px;color:var(--soft)}.av-mini svg{width:40px!important;height:40px!important}.av-mini small{font-size:.7rem}
.av-genre{display:flex;gap:8px;justify-content:center;margin:10px 0 4px}
.av-genre button{border:2px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:8px 18px;font:inherit;font-weight:800;cursor:pointer;box-shadow:0 3px 0 var(--line)}
.av-genre button.on{border-color:var(--dfv);background:var(--dfv-bg);color:var(--dfv);box-shadow:0 3px 0 var(--dfv-d)}
.av-looks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-width:100%}
.av-look{position:relative;aspect-ratio:1;border-radius:16px;border:2px solid var(--line);background:var(--card);padding:3px;cursor:pointer;box-shadow:0 3px 0 var(--line)}
.av-look svg{width:100%;height:100%}.av-look.on{border-color:var(--dfv);background:var(--dfv-bg);box-shadow:0 3px 0 var(--dfv-d)}
.av-look.ferme svg{filter:grayscale(1) brightness(1.05) contrast(.85);opacity:.5}
.ogre-art image{image-rendering:auto}
.ten-av img{width:74px;height:74px;object-fit:contain}.ten-c.ferme .ten-av img{filter:grayscale(1) brightness(1.05) contrast(.85);opacity:.5}.ten-fete-av img{width:132px;height:132px;object-fit:contain}
/* look pas encore dessiné pour ce corps (étape + genre) : « Bientôt », grisé, ni achat ni port */
.av-look.bientot{border-style:dashed;box-shadow:none;background:color-mix(in srgb,var(--line) 30%,var(--card))}
.av-look.bientot svg{filter:grayscale(1);opacity:.4}
.av-bientot{position:absolute;left:50%;bottom:4px;transform:translateX(-50%);padding:1px 7px;border-radius:999px;background:var(--ink,#22261F);color:var(--paper,#fff);font-size:.62rem;font-weight:800;white-space:nowrap}
/* Croissance entre amis (25/10) : camarades invités dans Moi, récompense de bienvenue, carte de score, défi : départ automatique, rejoindre vite, famille */
.ivt-amis{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 4px}
.ivt-ami{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--dfv-bg);color:var(--ink);font-weight:700;font-size:.9rem}
.ivt-ami i{color:var(--soft)}.ivt-ami.ok i{color:#2F8540}
.ivt-route{margin:4px 0 8px;color:var(--soft);font-size:.9rem;line-height:1.4}
.ivt-bonus{display:flex;align-items:center;justify-content:center;gap:8px;margin:10px auto 4px;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.16);color:#fff;font-size:.98rem;line-height:1.4;max-width:340px;text-align:left}
.ivt-bonus .ivt-croc{flex:none;width:28px;height:28px;display:inline-flex}.ivt-bonus .ivt-croc svg{width:100%;height:100%}
.ivt-carte-img{display:block;width:100%;max-width:min(240px,32vh);margin:6px auto 14px;border-radius:18px;box-shadow:0 8px 24px rgba(40,10,90,.25)}
.ivt-feuille a.ivt-go{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}
.ivt-feuille .ivt-b.cp{margin:10px auto 0;display:flex}
.df-auto{display:flex;flex-direction:column;align-items:center;gap:6px;margin:0 0 14px;padding:12px 14px;border-radius:16px;background:var(--dfv-bg);border:2px solid var(--dfv);text-align:center}
.df-auto b{font-family:var(--display);font-size:1.1rem;color:var(--dfv-d)}
:root[data-theme="dark"] .df-auto b{color:#E2CCFF}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .df-auto b{color:#E2CCFF}}
.df-vite{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:6px 0 4px}
.df-vite-aide{margin:2px 0 14px}
.df-fam .i{background:#FFF2D9;color:#C27A00}
:root[data-theme="dark"] .df-fam .i{background:#3A2E14;color:#FFC75A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .df-fam .i{background:#3A2E14;color:#FFC75A}}