@font-face{font-family:Nunito;src:url(../fontes/nunito.ttf) format("truetype");font-weight:200 1000;font-style:normal;font-display:swap}:root{font-family:Nunito,ui-rounded,system-ui,sans-serif;color:#193b4b;background:#fffcf4;font-synthesis:none;-webkit-font-smoothing:antialiased;--ink:#193b4b;--muted:#52656b;--line:#dbe4df;--paper:#fff;--green:#235f4b;--green-dark:#174536;--lime:#d8ef82;--coral:#f28b6d;--panel:#f4f8ed;--brio-yellow:#ffd45b}*{box-sizing:border-box}body{margin:0}#app{min-height:100vh;display:flex;flex-direction:column}main{flex:1;width:min(1120px,calc(100% - 48px));margin:0 auto;padding:20px 0 64px}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.15;letter-spacing:-.035em;font-weight:900}h1{font-size:clamp(32px,4.2vw,52px);margin-bottom:16px}h2{font-size:30px;margin-bottom:14px}h3{font-size:26px;margin-bottom:12px}p{line-height:1.6}a{color:var(--green)}button,input{font:inherit;color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #1565bf;outline-offset:5px}button:disabled{opacity:.5;cursor:default}[hidden]{display:none!important}.barre{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px max(24px,calc((100vw - 1120px)/2));background:#fff;border-bottom:1px solid #e4e9df}.marque{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none}.marque img{width:42px;height:50px}.marque strong{display:block;font-size:19px;font-weight:950;letter-spacing:-.035em}.marque small{display:block;font-size:12px;color:var(--muted)}.barre nav{display:flex;gap:8px}.barre nav a{text-decoration:none;color:var(--ink);padding:10px 20px;border-radius:24px;font-weight:850;background:#fff4c6}.barre nav a:last-child{background:#ffe5d9}.barre nav a:hover{box-shadow:inset 0 0 0 2px currentColor}.fil{width:min(1120px,calc(100% - 48px));margin:22px auto 0;font-size:14px;line-height:1.7;color:var(--muted)}.fil:empty{display:none}.fil a{text-decoration:none;font-weight:800}.pied{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px max(24px,calc((100vw - 1120px)/2));border-top:1px solid var(--line);font-size:14px;color:var(--muted)}.pied small{font-size:12px}.heros{display:grid;grid-template-columns:minmax(0,1fr) 620px;align-items:center;gap:40px;padding:36px 0 8px}.heros-texte{display:grid;gap:16px;justify-items:start}.surtitre{display:block;font-size:12px;letter-spacing:.15em;text-transform:uppercase;font-weight:950;color:var(--green);margin-bottom:10px}.heros h1{font-size:clamp(34px,4.3vw,54px);margin:0;text-wrap:balance}.sous-titre{font-size:19px;line-height:1.55;color:var(--muted);margin:0;max-width:46ch}.sans-inscription{font-size:13px;color:var(--muted)}.bouton.grand{font-size:18px;padding:16px 28px;border-radius:14px}.scene-vivante{position:absolute;inset:0;overflow:hidden}.scene-vivante:empty{display:none}.scene-vivante svg{display:block;width:100%;height:100%}.heros-scene{position:relative;inset:auto;width:620px;height:480px;border-radius:12px;background:#dcecf3;box-shadow:0 12px 32px -16px #193b4b40;touch-action:pan-y}.heros-scene:empty{display:block;background:#dcecf3 url(../illustrations/bienvenue.svg) center bottom / cover no-repeat}.brio-robot{display:grid;grid-template-columns:360px minmax(0,1fr);gap:44px;align-items:center;margin:56px 0 12px;padding:36px 40px;background:#fff;border:1px solid #e8ece2;border-radius:12px}.brio-cadre{position:relative}.brio-seul{position:relative;inset:auto;width:360px;height:360px;border-radius:12px;background:#fff4bd}.vivant .bulle-scene .fill-bulle{fill:#fff}.vivant .bulle-scene .bulle{stroke:var(--ink);stroke-width:2.2;stroke-linejoin:round}.vivant .bulle-scene .texte{fill:var(--ink);font-weight:800;font-family:inherit}.vivant.interactif *{pointer-events:none}.vivant.interactif .personnage,.vivant.interactif .personnage *{pointer-events:auto;cursor:pointer}.vivant.interactif .personnage .zone-toucher{pointer-events:all;fill:none;stroke:none}.vivant.interactif .personnage:hover{filter:drop-shadow(0 0 6px #ffd54a) drop-shadow(0 0 2px #ffd54a)}.brio-robot{position:relative}.brio-texte p{font-size:17px;max-width:56ch;margin-bottom:12px}.fait-quoi{display:flex;flex-wrap:wrap;gap:10px 18px;list-style:none;padding:0;margin:18px 0 0;font-weight:850;font-size:15px}.fait-quoi li{display:flex;align-items:center;gap:8px;background:var(--panel);padding:8px 14px 8px 10px;border-radius:10px}.fait-quoi .icone{width:26px;height:26px;color:var(--green)}.sequences .titre-section{display:flex;flex-wrap:wrap;align-items:end;gap:16px 28px}.sequences .titre-section h2{margin-right:auto}.niveaux{display:flex;justify-content:center;gap:8px}.niveaux button{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:2px solid #fff;background:#ffd45b;font-size:14px;font-weight:950;box-shadow:0 3px #193b4b20;transition:transform .18s cubic-bezier(.2,1.4,.4,1)}.niveaux button:hover{transform:scale(1.08)}.niveaux button:first-child{width:auto;padding:0 15px;border-radius:24px;background:#fff}.niveaux button:nth-child(3){background:#f7b397}.niveaux button:nth-child(4){background:#d8ef82}.niveaux button:nth-child(5){background:#bce4f0}.niveaux button:nth-child(6){background:#d8cff2}.niveaux button[aria-pressed=true]{border-color:var(--green);box-shadow:0 0 0 3px #ffffffb0}.titre-section{margin:44px 0 22px}.titre-section h2{margin-bottom:0}.parcours{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:12px}.carte{color:inherit;text-decoration:none;transition:transform .22s cubic-bezier(.2,1.2,.4,1),box-shadow .22s}.carte:hover{transform:translateY(-5px) scale(1.012);box-shadow:0 14px 28px -10px #193b4b30}.porte{display:flex;position:relative;overflow:hidden;align-items:center;gap:22px;min-height:192px;border-radius:12px;padding:24px;box-shadow:0 6px #193b4b10;border:2px solid #e9b644}.parcours-maths{background:#ffdf72}.parcours-francais{background:#ffb99b;border-color:#e79b7d}.dessin-porte{display:block;flex:none;width:86px;height:96px;transform:rotate(-7deg);transition:transform .3s cubic-bezier(.2,1.4,.4,1)}.porte:hover .dessin-porte,.porte:focus-visible .dessin-porte{transform:rotate(4deg) scale(1.12)}.porte-perso{position:absolute;right:58px;bottom:0;width:120px;height:150px;pointer-events:none}.porte>div{padding-right:170px}.porte-perso svg{display:block;width:100%;height:100%;overflow:visible}.porte-perso:empty{display:none}.porte:hover .porte-perso,.porte:focus-visible .porte-perso{bottom:14px}.porte-perso{transition:bottom .35s cubic-bezier(.2,1.4,.4,1)}.dessin-porte svg{width:100%;height:100%}.porte h2{font-size:32px;margin-bottom:8px}.porte p{font-size:15px;line-height:1.45;max-width:28ch;margin:0 0 12px}.compte{font-size:13px;font-weight:850}.fleche{margin-left:auto;align-self:flex-end;display:grid;place-items:center;flex:none;width:34px;height:34px;background:#fff9;border-radius:50%;font-size:24px}.grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.sequence{overflow:hidden;border:1px solid #e2e6d9;border-radius:12px;background:#fff;box-shadow:0 6px #193b4b08}.vignette{position:relative;height:185px;overflow:hidden;background:#d6edf0}.vignette>img{width:100%;height:100%;object-fit:cover;object-position:50% 58%}.vignette .scene-vivante{z-index:1}.etiquette{display:inline-block;background:var(--lime);color:var(--green-dark);padding:5px 12px;border-radius:16px;font-size:13px;font-weight:900;margin-bottom:12px}.carte-corps .etiquette{display:inline-block;margin-bottom:10px;background:#eef4f0}.carte-corps{padding:23px 25px 24px}.carte-corps p{color:var(--muted);font-size:16px;min-height:52px;margin-bottom:20px}.avancement{font-size:14px;font-weight:800}.jouer{float:right;display:flex;gap:22px;align-items:center;background:var(--green);color:#fff;border-radius:24px;padding:9px 20px;font-weight:900;margin-top:-8px}.entete-parcours{display:flex;align-items:center;gap:30px;padding:32px;border-radius:26px;margin-bottom:30px}.entete-parcours h1{margin-bottom:8px}.entete-parcours p{margin-bottom:0}.entete-sequence{display:grid;grid-template-columns:270px 1fr;align-items:center;gap:36px}.entete-sequence>img{width:270px;height:225px;object-fit:cover;border-radius:28px;transform:rotate(-2deg);border:6px solid white;box-shadow:0 5px 18px #193b4b15}.entete-sequence h1{margin-bottom:10px}.accroche{font-size:18px;line-height:1.55;max-width:64ch}.progression{font-size:14px;font-weight:850;margin-bottom:0;color:var(--green)}.actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:28px 0}.bouton{display:inline-block;border:1px solid #d9e3d9;padding:13px 20px;background:#fff;border-radius:22px;font-weight:850;text-decoration:none;cursor:pointer}.bouton{transition:transform .18s cubic-bezier(.2,1.4,.4,1),box-shadow .18s,background .18s}.bouton:hover{background:#eef5df;transform:translateY(-2px) scale(1.03)}.bouton:active{transform:translateY(1px) scale(.98)}.bouton.principal{color:#fff;background:var(--green);border-color:var(--green);box-shadow:0 4px 0 var(--green-dark)}.bouton.principal:hover{background:var(--green-dark);box-shadow:0 6px 0 var(--green-dark),0 12px 20px -8px #17453660}.bouton.principal:active{box-shadow:0 2px 0 var(--green-dark)}.carte-chemin{position:relative;overflow:hidden;padding:28px 40px 18px;border-radius:32px;background:#f0f5dd;border:2px solid #e0e8c9}.carte-chemin>.surtitre{text-align:center}.etapes{position:relative;max-width:740px;margin:24px auto;padding:0;list-style:none;display:grid;gap:30px}.etapes:before{content:"";position:absolute;left:25%;top:0;bottom:0;width:42%;border:5px dashed #b4c685;border-left:0;border-radius:0 100% 100% 0;transform:rotate(12deg)}.etape{position:relative;width:75%}.etape:nth-child(2n){justify-self:end}.etape a{position:relative;display:flex;align-items:center;gap:16px;background:#fff;padding:18px 24px 18px 16px;border:2px solid #dee5cc;border-radius:24px;color:inherit;text-decoration:none;box-shadow:0 5px #193b4b08}.etape a:hover{border-color:var(--green)}.numero{position:relative;display:grid;place-items:center;flex:none;width:54px;height:54px;background:var(--brio-yellow);border-radius:50%;font-size:24px;font-weight:950}.numero .victoire{position:absolute;inset:-6px}.numero .victoire svg{display:block;width:100%;height:100%;overflow:visible}.numero:has(.victoire:not(:empty)){background:var(--lime)}.chemin-brio{position:absolute;left:14px;width:74px;height:96px;top:var(--depart,0);transform:translateY(-50%);z-index:1;pointer-events:none}.chemin-brio svg{display:block;width:100%;height:100%;overflow:visible}.chemin-brio:empty{display:none}.chemin-brio.en-route{top:var(--arrivee,var(--depart));transition:top 2.2s cubic-bezier(.45,.05,.55,.95)}.chemin-brio[data-marche=non]{transition:none}.numero b{position:absolute;right:-3px;bottom:-3px;background:var(--green);color:#fff;border-radius:50%;width:24px;height:24px;font-size:16px;text-align:center}.etape .icone{width:36px;height:36px;color:var(--green);flex:none}.icone svg{width:100%;height:100%}.etape .texte{display:grid;gap:5px}.etape strong{font-size:18px}.etape small{font-size:13px;color:var(--muted)}.etape.vue a{background:#fafff2}.etape.courante a{border-color:var(--green)}.etape.courante .numero{animation:appel 2.6s ease-in-out infinite}@keyframes appel{50%{box-shadow:0 0 0 8px #ffd45b44}}.arrivee{text-align:center;color:var(--green);font-weight:800;font-size:14px}.etape-page h1{font-size:clamp(30px,4vw,44px)}.scene{border:2px solid #ccdfd7;border-radius:28px;overflow:hidden;background:#f0f8f4;margin:24px 0}.amorce{position:relative;display:grid;justify-items:center;text-align:center;padding:32px 24px;gap:18px;background:radial-gradient(ellipse at center,#fff 30%,#e3f2e9)}.amorce-brio{width:150px;height:150px}.amorce-brio svg{display:block;width:100%;height:100%;overflow:visible}.amorce.charge{position:absolute;inset:0;z-index:2}.pastille-son{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;font-size:20px;padding:16px 28px;box-shadow:0 8px 24px #193b4b33}.bouton.compte{animation:pulse 1s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.04)}}.scene{position:relative}.scene:not(.monte) iframe{visibility:hidden;height:min(78vh,760px)}.amorce p{font-size:19px;max-width:43ch;margin:0}.amorce small{font-size:13px;color:var(--muted)}.scene iframe{width:100%;height:min(78vh,760px);display:block;border:0;background:#fff}.suite{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px}.a-venir{display:flex;align-items:center;gap:28px;border:2px dashed #e9be63;background:#fff5cf;padding:32px;border-radius:26px;margin:24px 0}.a-venir p{margin:0}.exercice{border:2px solid var(--line);background:#fff;border-radius:28px;padding:30px;margin:24px 0}.consigne{font-size:20px;font-weight:800}.items{list-style:none;padding:0;margin:0;display:grid;gap:16px}.item{padding:20px;border:2px solid #e4eadd;border-radius:20px;background:#f8faef}.item[data-verdict=juste]{border-color:var(--green);background:#eef8e6}.item[data-verdict=faux]{border-color:#e4a689;background:#fff2ed}.enonce{font-size:23px;font-weight:900;margin-bottom:12px}.choix,.saisie{display:flex;flex-wrap:wrap;gap:10px;align-items:end}.saisie label{display:grid;gap:5px;font-weight:750}.saisie input{width:8em;max-width:100%;border:2px solid #b4c6bc;border-radius:12px;padding:10px;font-size:20px;background:#fff}.verdict{margin:12px 0 0;font-weight:850}.verdict:empty{display:none}.verdict details{font-weight:500;margin-top:10px}.bilan{padding:18px;background:var(--lime);border-radius:18px;margin:20px 0 0;font-weight:900;font-size:22px}.vide{text-align:center;padding:26px;border-radius:24px;background:#f0f5dd}@media(max-width:1000px){.heros{grid-template-columns:1fr;gap:24px}.heros-scene{width:100%;height:auto;aspect-ratio:31/24;max-height:480px}.brio-robot{grid-template-columns:1fr;gap:28px;padding:28px}.brio-cadre{width:360px;margin:0 auto}}@media(max-width:800px){.porte{gap:14px;padding:20px}.dessin-porte{width:65px}.fleche{display:none}.entete-sequence{grid-template-columns:210px 1fr;gap:24px}.entete-sequence>img{width:210px}}@media(max-width:600px){main{width:calc(100% - 32px);padding:16px 0 40px}.barre{padding:12px 16px;gap:12px;flex-wrap:wrap}.marque strong{font-size:18px}.marque small{font-size:12px}.barre nav{width:100%}.barre nav a{flex:1;text-align:center;padding:8px 16px;font-size:14px}.fil{width:calc(100% - 32px);font-size:13px;margin-top:16px}.heros{padding-top:20px}.heros h1{font-size:34px;line-height:1.15}.sous-titre{font-size:16px}.surtitre{font-size:11px;letter-spacing:.12em}.heros-scene{aspect-ratio:1}.brio-robot{margin-top:36px;padding:22px 18px}.brio-cadre{width:100%}.brio-seul{width:100%;height:auto;aspect-ratio:1}.niveaux{gap:5px;flex-wrap:wrap}.niveaux button{width:40px;height:40px;font-size:12px}.niveaux button:first-child{padding:0 10px}h2{font-size:26px}h3{font-size:24px}.parcours,.grille{grid-template-columns:1fr;gap:18px}.parcours{margin-bottom:32px}.porte{min-height:165px;padding:20px;gap:18px;border-radius:24px}.porte h2{font-size:28px}.porte p{font-size:14px}.dessin-porte{width:76px}.porte-perso{right:10px;width:84px;height:105px}.porte>div{padding-right:92px}.vignette{height:165px}.carte-corps{padding:22px}.carte-corps p{min-height:0}.carte-corps{padding-bottom:28px}.entete-parcours{padding:22px;gap:18px}.entete-parcours .dessin-porte{width:55px}.entete-parcours .surtitre{display:none}.entete-parcours h1{font-size:32px}.entete-parcours p{font-size:15px}.entete-sequence{display:flex;flex-direction:column;align-items:stretch;gap:20px}.entete-sequence>img{width:100%;height:150px;transform:none;border:0}.entete-sequence h1{font-size:34px}.accroche{font-size:16px;margin-bottom:12px}.actions{justify-content:stretch}.actions .bouton{text-align:center;width:100%}.carte-chemin{padding:23px 12px 12px;border-radius:24px}.etapes{gap:26px}.etape{width:96%}.etape:nth-child(odd){justify-self:start}.etape a{padding:14px 12px;gap:10px;border-radius:20px}.numero{width:42px;height:42px;font-size:21px}.numero img{height:40px}.etape .icone{width:28px;height:28px}.etape strong{font-size:16px}.etape small{font-size:12px}.scene{border-radius:24px}.amorce{padding:26px 18px}.amorce p{font-size:17px}.amorce img{height:135px}.scene iframe{height:78vh}.suite .bouton{width:100%;text-align:center;font-size:14px}.exercice,.item{padding:16px}.enonce{font-size:21px}.bouton{padding:12px 16px}.a-venir{padding:22px;gap:18px}.a-venir img{width:65px}.pied{padding:24px 16px;flex-direction:column;text-align:center;gap:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}::view-transition-old(root){animation:sortie .22s ease-in both}::view-transition-new(root){animation:entree .32s cubic-bezier(.2,.9,.3,1) both}@keyframes sortie{to{opacity:0;transform:translateY(-14px)}}@keyframes entree{0%{opacity:0;transform:translateY(22px)}}main.apparait{animation:entree .32s cubic-bezier(.2,.9,.3,1) both}@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root),main.apparait{animation:none}.carte,.bouton,.dessin-porte,.porte-perso,.chemin-brio.en-route{transition:none}.etape.courante .numero{animation:none}}
