.fable{--n-fond:#f7f3ec;--n-carte:#ffffff;--n-encre:#1d2230;--n-doux:#4a5163;--n-rouge:#a61e28;--n-rouge-fonce:#82161e;--n-vert:#1f6b45;--n-vert-clair:#d9efe2;--n-or:#c9971c;--n-gris:#c9ccd3;--n-bord:#ddd6c9;--n-focus:#1d4ed8;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:20px;line-height:1.45;color:var(--n-encre);background:var(--n-fond);min-height:100vh}body:has(.fable){background:#f7f3ec}.fable :focus-visible{outline:4px solid var(--n-focus);outline-offset:3px;border-radius:8px}.fable h1{font-size:40px;margin:0 0 16px;line-height:1.15}.fable h2{font-size:32px;margin:0 0 16px;line-height:1.2}.fable h3{font-size:24px}.fable h3,.fable p{margin:0 0 12px}.fable .sr{overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.fable .cache,.fable .sr{position:absolute;width:1px;height:1px}.fable .cache{opacity:0;pointer-events:none}.fable .discret{color:var(--n-doux)}.fable .grand-texte{font-size:28px}.fable .sur-titre{font-size:22px;color:var(--n-doux);font-weight:600}.fable .bouton,.fable .bouton-discret,.fable .bouton-principal,.fable .bouton-vert{font:inherit;font-weight:600;border-radius:14px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;text-align:center}.fable .bouton{min-height:56px;padding:10px 20px;background:var(--n-carte);color:var(--n-encre);border:2px solid var(--n-encre)}.fable .bouton:hover:not(:disabled){background:#eef0f4}.fable .bouton-principal{min-height:72px;padding:14px 32px;font-size:24px;background:var(--n-rouge);color:#fff;border:0;box-shadow:0 4px 0 var(--n-rouge-fonce)}.fable .bouton-principal:hover:not(:disabled){background:var(--n-rouge-fonce)}.fable .bouton-vert,.fable .bouton.bouton-vert{background:var(--n-vert);color:#fff;border:2px solid var(--n-vert)}.fable .bouton-vert:hover:not(:disabled){background:#17573a}.fable .bouton-discret{min-height:48px;padding:8px 16px;background:transparent;color:var(--n-doux);border:2px dashed var(--n-gris);font-weight:500}.fable .occupe,.fable button:disabled{opacity:.55;cursor:not-allowed}.fable .rangee-actions{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin:20px 0}.fable .champ{display:flex;flex-direction:column;gap:8px;margin:0 0 20px}.fable .champ label,.fable .etiquette{font-weight:700;font-size:22px}.fable .champ input,.fable .champ textarea,.fable .saisie{font:inherit;font-size:24px;padding:14px 16px;border-radius:12px;border:2px solid var(--n-encre);background:#fff;color:var(--n-encre);width:100%}.fable textarea.saisie-geante{font-size:34px;min-height:160px;line-height:1.35}.fable .aide{font-size:18px;color:var(--n-doux)}.fable .contenu{max-width:1400px;margin:0 auto;padding:24px 28px 80px}.fable .carte{background:var(--n-carte);border:1px solid var(--n-bord);border-radius:18px;padding:28px;margin-bottom:24px}.fable .centre{max-width:720px;margin:48px auto}.fable .message-info{background:#fff6dc;border-left:6px solid var(--n-or)}.fable .message-erreur,.fable .message-info{padding:12px 16px;border-radius:8px;margin:12px 0}.fable .message-erreur{background:#fde8e8;border-left:6px solid var(--n-rouge)}.fable .message-ok{background:var(--n-vert-clair);border-left:6px solid var(--n-vert);padding:12px 16px;border-radius:8px;margin:12px 0}.fable .entete{background:var(--n-carte);border-bottom:4px solid var(--n-rouge);padding:12px 28px 0;position:-webkit-sticky;position:sticky;top:0;z-index:20}.fable .entete-ligne{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;max-width:1400px;margin:0 auto}.fable .marque{display:flex;gap:14px;align-items:center}.fable .marque-logo{font-size:40px}.fable .marque-classe{font-size:26px;font-weight:800;margin:0}.fable .marque-ecole{font-size:18px;color:var(--n-doux);margin:0}.fable .entete-droite{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.fable .temoin{font-size:18px;color:var(--n-vert);font-weight:600}.fable .temoin.attente{color:var(--n-doux)}.fable .bandeau-reseau{position:fixed;top:0;left:0;right:0;z-index:50;background:#fff3c4;color:#3b2f00;text-align:center;padding:12px;font-weight:700;border-bottom:3px solid var(--n-or)}.fable .barre-etapes{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:stretch;max-width:1400px;margin:10px auto 0;padding-bottom:10px}.fable .barre-etapes ol{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;flex:1 1 auto}.fable .barre-etapes li{flex:1 1 auto}.fable .barre-etapes .etape{height:100%}.fable .etape{display:flex;align-items:center;gap:10px;min-height:56px;padding:6px 14px;border-radius:12px;border:2px solid var(--n-bord);background:#fff;color:var(--n-encre);text-decoration:none;font-weight:700;white-space:nowrap}.fable .etape.faite{border-color:var(--n-vert)}.fable .etape.active{background:var(--n-encre);color:#fff;border-color:var(--n-encre)}.fable .etape-num{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--n-fond);color:var(--n-encre);font-size:18px}.fable .etape.faite .etape-num{background:var(--n-vert);color:#fff}.fable .etape.tableau{flex:0 0 auto}@media (max-width:1440px){.fable .entete{padding-left:20px;padding-right:20px}.fable .etape{gap:8px;padding:6px 10px;font-size:18px}.fable .etape-num{width:28px;height:28px;font-size:16px}}.fable .scanner{display:flex;flex-direction:column;gap:16px}.fable .choix-mode{display:grid;grid-template-columns:1fr 1fr;grid-gap:12px;gap:12px}.fable .choix-mode-btn{min-height:80px;font:inherit;font-size:28px;font-weight:800;border-radius:16px;border:3px solid var(--n-encre);background:#fff;color:var(--n-encre);cursor:pointer}.fable .choix-mode-btn.actif{background:var(--n-vert);border-color:var(--n-vert);color:#fff}.fable .bouton-photo{width:100%;min-height:96px;font-size:28px;position:relative}.fable .scanner-etat{min-height:32px}.fable .bac-titre{display:flex;gap:12px;align-items:center}.fable .compteur{display:inline-grid;place-items:center;min-width:44px;height:44px;padding:0 10px;border-radius:22px;background:var(--n-rouge);color:#fff;font-size:22px}.fable .bac-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-gap:20px;gap:20px}.fable .carte-dessin{background:#fff;border:2px solid var(--n-bord);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:10px}.fable .carte-dessin-image{aspect-ratio:1;display:grid;place-items:center;background:#fbfaf7;border-radius:10px;overflow:hidden}.fable .carte-dessin.decor .carte-dessin-image{aspect-ratio:16/9}.fable .carte-dessin-image img{width:100%;height:100%;object-fit:contain}.fable .carte-dessin.decor .carte-dessin-image img{object-fit:cover}.fable .carte-dessin-actions{display:grid;grid-template-columns:1fr;grid-gap:8px;gap:8px}.fable .attente{display:flex;gap:10px;align-items:center;color:var(--n-doux)}.fable .page-canvas{width:100%;height:auto;display:block;border-radius:12px;background:#eef;aspect-ratio:16/9}.fable .page-grande{box-shadow:0 8px 28px rgba(0,0,0,.15)}.fable .vignette{display:flex;flex-direction:column;gap:6px;padding:8px;border:3px solid transparent;border-radius:14px;background:#fff;font:inherit;color:inherit;position:relative;text-align:left}.fable button.vignette{cursor:pointer}.fable .vignette.active{border-color:var(--n-rouge)}.fable .vignette-numero{position:absolute;top:12px;left:12px;z-index:2;background:var(--n-encre);color:#fff;border-radius:10px;min-width:36px;height:36px;display:grid;place-items:center;font-weight:800}.fable .vignette-image img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;display:block}.fable .voyants{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;font-size:16px}.fable .voyants li{display:inline-flex;align-items:center;gap:4px}.fable .voyant-point{width:16px;height:16px;border-radius:50%;background:var(--n-gris);border:2px solid #9aa0ab}.fable .voyants .plein .voyant-point{background:#2fa46a;border-color:var(--n-vert)}.fable .voyants .vide .voyant-libelle{color:var(--n-doux)}.fable .bouton-micro{min-width:120px;min-height:120px;border-radius:50%;border:4px solid var(--n-rouge);background:#fff;color:var(--n-rouge);font:inherit;font-weight:800;display:inline-flex;flex-direction:column;align-items:center;justify-content:center}.fable .lecteur{background:#000;border-radius:16px;overflow:hidden}.fable .lecteur-ecran{aspect-ratio:16/9;display:grid;place-items:center;background:#111}.fable .lecteur-ecran img{width:100%;height:100%;object-fit:contain}.fable .lecteur-titre{color:#fff;text-align:center;font-size:48px;font-weight:800;padding:24px;display:flex;flex-direction:column;gap:24px;align-items:center}.fable .lecteur-commandes{display:flex;gap:12px;justify-content:center;padding:14px;background:#1d2230;flex-wrap:wrap}.fable .lecteur:-webkit-full-screen{border-radius:0;display:flex;flex-direction:column;justify-content:center}.fable .lecteur:fullscreen{border-radius:0;display:flex;flex-direction:column;justify-content:center}@media (max-width:900px){.fable{font-size:20px}.fable .contenu{padding:16px}.fable .etape{white-space:normal}}.fable .entete-simple{margin-bottom:8px}.fable .liste-choix{list-style:none;padding:0;margin:0 0 24px;display:grid;grid-gap:12px;gap:12px;grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}.fable .choix-ligne{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;min-height:80px;padding:16px 20px;border-radius:14px;border:2px solid var(--n-bord);background:#fff;color:var(--n-encre);font:inherit;text-decoration:none;text-align:left;cursor:pointer}.fable .choix-ligne:hover{border-color:var(--n-encre)}.fable .choix-titre{font-size:24px;font-weight:800}.fable .choix-sous-titre{display:block;font-size:18px;font-weight:500;color:inherit;opacity:.8}.fable .choix-mode-btn .choix-sous-titre{margin-top:4px}.fable table.tableau-admin{width:100%;border-collapse:collapse;font-size:18px}.fable .tableau-admin td,.fable .tableau-admin th{text-align:left;padding:8px;border-bottom:1px solid var(--n-bord);vertical-align:top}.fable .deux-colonnes{display:grid;grid-template-columns:2fr 1fr;grid-gap:24px;gap:24px;align-items:start}@media (max-width:900px){.fable .deux-colonnes{grid-template-columns:1fr}}.fable .galerie-plein-ecran{position:fixed;inset:0;z-index:40;background:var(--n-fond);overflow:auto;padding:24px 32px}.fable .galerie-entete{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}.fable .grille-options{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:20px;gap:20px;margin:20px 0}.fable .grille-options.quatre{grid-template-columns:repeat(4,1fr)}@media (max-width:900px){.fable .grille-options,.fable .grille-options.quatre{grid-template-columns:1fr 1fr}}.fable .carte-option{display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px;border-radius:18px;border:3px solid var(--n-bord);background:#fff;font:inherit;color:inherit;text-align:center}.fable button.carte-option{cursor:pointer}.fable .carte-option img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:12px}.fable .carte-option.jouee{border-color:var(--n-vert)}.fable .carte-option.en-tete{border-color:var(--n-rouge);box-shadow:0 0 0 4px #f7d4d6}.fable .carte-option-libelle{font-size:26px;font-weight:800;line-height:1.2}.fable .compteur-vote{display:flex;align-items:center;gap:16px}.fable .compteur-vote .bouton{min-width:72px;min-height:72px;font-size:36px}.fable .compteur-vote-n{font-size:56px;font-weight:900;min-width:72px;text-align:center}.fable .jouer-option{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}.fable .jouer-option img{width:min(70vw,900px);max-height:55vh;object-fit:contain;border-radius:20px}.fable .jouer-libelle{font-size:clamp(48px,6vw,88px);line-height:1.1}.fable .jouer-emoji{font-size:120px}.fable .rangee-actions.centree{justify-content:center}.fable .chrono{font-size:32px;min-width:200px;min-height:72px}.fable .chrono.fini{background:#fff3c4}.fable .ecran-pages{display:grid;grid-template-columns:300px 1fr;grid-gap:24px;gap:24px;align-items:start}@media (max-width:1000px){.fable .ecran-pages{grid-template-columns:1fr}}.fable .colonne-pages{display:flex;flex-direction:column;gap:12px;position:-webkit-sticky;position:sticky;top:180px;max-height:calc(100vh - 200px);overflow-y:auto}.fable .liste-pages{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.fable .liste-pages li{display:grid;grid-template-columns:1fr auto;grid-gap:6px;gap:6px;align-items:center}.fable .fleches{display:flex;flex-direction:column;gap:6px}.fable .fleches .bouton{min-width:56px;min-height:56px;font-size:26px;padding:0}.fable .editeur-entete{display:flex;align-items:center;gap:20px;flex-wrap:wrap;justify-content:space-between;margin-bottom:12px}.fable .editeur-entete h1{margin:0}.fable .etape-page{margin-top:20px}.fable .rangee-choix{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0 16px}.fable .choix-image{border:4px solid var(--n-bord);border-radius:14px;background:#fff;padding:4px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;font:inherit;font-size:18px}.fable .choix-image img{display:block;border-radius:10px}.fable .choix-image.decor img{width:220px;aspect-ratio:16/9;object-fit:cover}.fable .choix-image.heros img{width:130px;height:130px;object-fit:contain}.fable .choix-image.choisi{border-color:var(--n-vert);box-shadow:0 0 0 4px var(--n-vert-clair)}.fable .choix-image.choisi:after{content:"✓ sur la page";color:var(--n-vert);font-weight:800}.fable .choix-image.decor.choisi:after{content:"✓ décor choisi"}.fable .phrase-geante{position:fixed;inset:0;z-index:45;background:var(--n-fond);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;padding:5vw;cursor:pointer}.fable .phrase-geante p{font-size:clamp(48px,7vw,110px);font-weight:900;line-height:1.15;text-align:center;margin:0}.fable .sous-nav{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}.fable .centre-jeu{display:grid;place-items:center;min-height:50vh}.fable .bouton-geant{font-size:40px;min-height:140px;padding:24px 48px}.fable .grille-jeu{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));grid-gap:16px;gap:16px;margin-bottom:24px;min-height:60px}.fable .frise{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));grid-gap:12px;gap:12px}.fable .case{border:4px dashed var(--n-gris);border-radius:16px;padding:6px;min-height:160px;position:relative;display:flex;align-items:stretch}.fable .case.juste{border:6px solid #2fa46a;background:var(--n-vert-clair)}.fable .case.fausse{border:6px solid #e07b00;background:#fff1dc}.fable .case-num{position:absolute;top:-14px;left:-10px;z-index:3;background:var(--n-rouge);color:#fff;border-radius:50%;width:40px;height:40px;display:grid;place-items:center;font-weight:800}.fable .case-page{border:0;padding:0;background:none;width:100%;cursor:pointer}.fable .case-vide{flex:1 1}