/* Thème repris de la présentation de référence (IA & Web Dev) */
:root{--ink:#14213a;--muted:#718096;--paper:#f6f7fb;--panel:#fff;--line:#e4e8f0;--blue:#425df5;--teal:#00a98f;--coral:#ff765f;--gold:#e8a91d;--nav:#101b32;--radius:22px;--shadow:0 22px 65px #1c2a4310}
    *{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--paper);color:var(--ink);font-family:Inter,'Segoe UI',Arial,sans-serif;overflow-x:hidden;overflow-y:auto}button{font:inherit;color:inherit} .app{min-height:100vh;display:grid;grid-template-columns:260px 1fr}
    aside{background:var(--nav);color:#fff;padding:27px 18px 18px;display:flex;flex-direction:column;min-height:100vh;position:sticky;top:0;align-self:start}.brand{display:flex;gap:12px;align-items:center;padding:0 10px 26px}.brand-mark{height:39px;width:39px;border-radius:13px;background:linear-gradient(145deg,#7590ff,#425df5);display:grid;place-items:center;font-weight:800;font-size:18px;box-shadow:0 7px 24px #425df555}.brand small{display:block;color:#9dabc5;font-size:10px;letter-spacing:.13em;text-transform:uppercase;margin-top:3px}.brand strong{font:700 15px Manrope,sans-serif;letter-spacing:-.02em}.nav-label{font-size:10px;text-transform:uppercase;letter-spacing:.14em;color:#7888a5;padding:5px 12px 10px}.nav-list{overflow:auto;scrollbar-width:thin;scrollbar-color:#384560 transparent}.nav-item{width:100%;border:0;background:none;color:#b0bad0;text-align:left;padding:11px 12px;border-radius:11px;display:flex;gap:11px;align-items:center;cursor:pointer;font-size:12px;margin:2px 0;transition:.18s}.nav-item:hover{background:#ffffff10;color:white}.nav-item.active{background:#263455;color:#fff}.nav-item .dot{height:8px;width:8px;border-radius:50%;background:var(--tone,#7788ac)}.nav-item.active .dot{box-shadow:0 0 0 4px color-mix(in srgb,var(--tone) 20%,transparent)}.nav-item .num{margin-left:auto;color:#8593ad;font:11px 'DM Mono',monospace}.side-bottom{margin-top:auto;padding:16px 10px 0;color:#8795af;font-size:11px;line-height:1.6}.side-bottom .tag{display:inline-flex;padding:5px 8px;border:1px solid #33415d;border-radius:7px;margin-bottom:8px;color:#bdc7dc;font-size:10px}
    main{min-width:0;min-height:100vh;display:flex;flex-direction:column}.topbar{height:67px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 38px;gap:20px;background:#ffffffba}.crumb{font-size:12px;color:var(--muted)}.crumb b{color:var(--ink);font-weight:600}.top-right{margin-left:auto;display:flex;align-items:center;gap:15px}.day-pill{background:#edf0ff;color:var(--blue);font-size:10px;font-weight:700;padding:7px 11px;border-radius:99px}.counter{font:11px 'DM Mono',monospace;color:var(--muted)}.progress{height:3px;background:#e9ecf3;position:relative}.progress i{height:100%;display:block;background:linear-gradient(90deg,var(--blue),#6b7dff);transition:width .3s;width:0}
    .stage{flex:1;min-height:calc(100vh - 138px);display:block;padding:32px 42px;overflow:visible}.slide{width:min(1080px,100%);min-height:0;height:auto;max-height:none;margin:0 auto;display:flex;flex-direction:column;animation:arrive .32s ease both}@keyframes arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.eyebrow{display:flex;align-items:center;gap:9px;color:var(--blue);font:500 10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;margin-bottom:17px}.eyebrow:before{content:'';width:19px;height:2px;background:currentColor}.slide h1{font:700 clamp(31px,4.2vw,53px)/1.08 Manrope,sans-serif;letter-spacing:-.045em;margin:0 0 18px;max-width:850px}.lead{color:#59677e;font-size:17px;line-height:1.65;max-width:780px;margin:0 0 30px}.grid{display:grid;gap:14px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:var(--shadow)}.card .icon{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:#eef0ff;color:var(--blue);font-size:16px;margin-bottom:13px}.card h3{font:700 15px Manrope,sans-serif;margin:0 0 8px;letter-spacing:-.02em}.card p,.card li{font-size:13px;line-height:1.62;color:#627087;margin:0}.card ul{padding-left:17px;margin:8px 0 0}.card li+li{margin-top:5px}.card.accent{border-top:3px solid var(--tone,var(--blue))}.card.accent .icon{background:color-mix(in srgb,var(--tone,var(--blue)) 12%,white);color:var(--tone,var(--blue))}.kicker{font:10px 'DM Mono',monospace;color:var(--muted);text-transform:uppercase;letter-spacing:.09em;margin-bottom:8px}.callout{border-left:3px solid var(--teal);padding:13px 17px;background:#e9f8f5;border-radius:0 12px 12px 0;color:#356b61;font-size:13px;line-height:1.6;margin-top:18px}.callout.warn{border-color:var(--coral);background:#fff1ee;color:#8b5046}.callout.blue{border-color:var(--blue);background:#eef0ff;color:#4957a5}.flow{display:flex;align-items:stretch;gap:8px;margin:8px 0 14px}.flow-step{flex:1;background:#fff;border:1px solid var(--line);padding:13px 14px;border-radius:13px;min-width:0}.flow-step b{display:block;font:700 13px Manrope;margin-bottom:5px}.flow-step small{display:block;color:var(--muted);font-size:11px;line-height:1.45}.arrow{align-self:center;color:#a8b2c4;font-size:19px}.mono{font-family:'DM Mono',monospace;font-size:11px;background:#17223a;color:#dce5ff;border-radius:13px;padding:15px 18px;line-height:1.7;white-space:pre-wrap;overflow:auto}.prompt-box{background:#17223a;color:#dce5ff;border-radius:15px;padding:17px 20px;font:12px/1.7 'DM Mono',monospace}.prompt-box em{font-style:normal;color:#80e3d1}.exercise{background:#fff;border:1px solid var(--line);border-radius:17px;padding:20px;display:flex;gap:15px;box-shadow:var(--shadow)}.exercise-n{width:34px;height:34px;flex:none;display:grid;place-items:center;background:#e9f8f5;color:#008e79;border-radius:11px;font:500 12px 'DM Mono',monospace}.exercise h3{font:700 15px Manrope;margin:0 0 7px}.exercise p{font-size:13px;line-height:1.58;color:#627087;margin:0}.exercise .meta{font:10px 'DM Mono',monospace;color:#8994a8;margin-top:10px}.checklist{display:grid;gap:9px}.check{display:flex;gap:11px;align-items:flex-start;background:#fff;border:1px solid var(--line);padding:12px 15px;border-radius:12px;font-size:13px;line-height:1.5;color:#526079}.check i{font-style:normal;color:var(--teal);font-size:14px}.quiz{background:white;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow);max-width:800px}.quiz h3{font:700 18px/1.4 Manrope;margin:0 0 18px}.options{display:grid;gap:9px}.option{background:#fff;border:1px solid #e2e7ef;border-radius:11px;padding:12px 14px;text-align:left;font-size:13px;cursor:pointer;transition:.15s}.option:hover:not(:disabled){border-color:#8997ff;background:#f7f8ff}.option.correct{border-color:#21b49a;background:#eaf9f5;color:#176b5b}.option.wrong{border-color:#fa8b79;background:#fff1ee;color:#994b3d}.feedback{min-height:24px;margin-top:13px;font-size:12px;line-height:1.5;color:#5c6980}.quiz-score{font:11px 'DM Mono',monospace;color:var(--muted);margin-left:auto}.quiz-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}.quiz-label{font:10px 'DM Mono',monospace;color:var(--blue);text-transform:uppercase;letter-spacing:.08em}.footer{height:68px;border-top:1px solid var(--line);display:flex;align-items:center;padding:0 38px;gap:10px;background:#fff}.nav-btn{border:1px solid var(--line);background:white;border-radius:11px;height:38px;padding:0 15px;cursor:pointer;font-size:12px;transition:.15s}.nav-btn:hover{border-color:#aab4c7;background:#fafbfe}.nav-btn.primary{background:var(--nav);color:white;border-color:var(--nav);padding:0 19px}.nav-btn:disabled{opacity:.35;cursor:default}.foot-hint{font:10px 'DM Mono',monospace;color:#98a2b4;margin-left:auto}.mobile-title{display:none}
    .exercise-label{font:10px 'DM Mono',monospace;color:var(--blue);letter-spacing:.1em;text-transform:uppercase;margin:-8px 0 12px}.exercise-meta{font:10px 'DM Mono',monospace}.bank-quiz{max-width:860px}.bank-progress{height:5px;border-radius:5px;background:#edf0f6;overflow:hidden;margin:-2px 0 20px}.bank-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),#8490ff);transition:width .25s}.bank-panel h3{font:700 19px/1.45 Manrope,sans-serif;margin:0 0 17px}.bank-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:15px}.bank-result{text-align:center;padding:22px 10px}.result-mark{width:54px;height:54px;margin:0 auto 13px;border-radius:18px;background:#e9f8f5;color:#15927c;display:grid;place-items:center;font-size:25px}.bank-result h3{margin-bottom:8px}.bank-result p{color:var(--muted);font-size:13px;margin:0 0 18px}
    @media(max-width:900px){.app{grid-template-columns:210px 1fr}.stage{padding:25px}.topbar{padding:0 25px}.footer{padding:0 25px}.grid.four{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){body{overflow-x:hidden;overflow-y:auto}.app{min-height:100dvh;grid-template-columns:1fr;grid-template-rows:auto auto}aside{position:static;min-height:62px}main{min-height:auto}aside{padding:10px 12px;flex-direction:row;align-items:center;min-height:62px}.brand{padding:0;flex:none}.brand-mark{height:34px;width:34px}.brand strong{font-size:13px}.brand small,.side-bottom,.nav-label{display:none}.nav-list{display:flex;overflow-x:auto;margin-left:10px}.nav-item{width:auto;white-space:nowrap;padding:9px 10px;font-size:10px}.nav-item .num{display:none}.nav-item .dot{height:6px;width:6px}.topbar{height:51px;padding:0 16px}.crumb{font-size:10px}.day-pill{font-size:9px}.stage{min-height:calc(100dvh - 123px);padding:24px 17px;align-items:start}.slide{min-height:0;max-height:none}.slide h1{font-size:34px}.lead{font-size:15px;margin-bottom:22px}.grid.two,.grid.three,.grid.four{grid-template-columns:1fr}.card{padding:17px}.flow{flex-direction:column}.arrow{transform:rotate(90deg);align-self:center}.footer{height:60px;padding:0 15px}.foot-hint{display:none}.nav-btn{height:36px;padding:0 11px;font-size:11px}.nav-btn.primary{padding:0 14px}}
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@keyframes content-enter{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
  @keyframes question-enter{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}
  .slide>*{animation:content-enter .38s cubic-bezier(.2,.7,.25,1) both}
  .slide>*:nth-child(2){animation-delay:.035s}.slide>*:nth-child(3){animation-delay:.07s}.slide>*:nth-child(4){animation-delay:.105s}.slide>*:nth-child(5){animation-delay:.14s}
  .card,.exercise,.flow-step{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
  .card:hover,.exercise:hover,.flow-step:hover{transform:translateY(-2px);box-shadow:0 16px 36px #1c2a4318}
  .nav-btn,.option,.exercise-toggle{transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease}
  .nav-btn:hover:not(:disabled),.option:hover:not(:disabled){transform:translateY(-1px)}
  .option.correct{animation:content-enter .25s ease both}.option.wrong{animation:content-enter .25s ease both}
  .exercise-label{display:flex;justify-content:space-between;align-items:center;gap:10px}
  .exercise-progressline{font:10px 'DM Mono',monospace;color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin:-6px 0 7px;display:flex;justify-content:space-between}
  .exercise-progress{height:5px;border-radius:6px;background:#e9edf3;overflow:hidden;margin-bottom:14px}
  .exercise-progress i{height:100%;display:block;width:0;background:linear-gradient(90deg,var(--teal),#52cfb6);transition:width .3s ease}
  .exercise-toggle{border:0;padding:0;cursor:pointer}.exercise-toggle:hover{transform:scale(1.06)}
  .exercise-toggle[aria-pressed="true"]{background:#dcf7ef;color:#087d68;box-shadow:inset 0 0 0 2px #70cbb6}
  .exercise.complete{border-color:#a9ddd1;background:linear-gradient(115deg,#f7fffc,#fff)}
  .bank-panel h3.question-in{animation:question-enter .24s ease both}
  .bank-feedback-in{animation:content-enter .22s ease both}
  .bank-progress i{transition:width .35s cubic-bezier(.2,.7,.25,1)}
  @media(prefers-reduced-motion:reduce){.slide>*{animation:none}.card,.exercise,.flow-step,.nav-btn,.option,.exercise-toggle,.bank-progress i{transition:none}}