:root{--sb-ink:#183b3a;--sb-paper:#fbf7ee;--sb-gold:#d8a94f;--sb-rust:#7e3e2f;--sb-blue:#25465d;--sb-shadow:0 16px 42px rgba(24,59,58,.14)}
*{box-sizing:border-box}.sb-shell{width:min(1180px,calc(100% - 2rem));margin:0 auto;padding:1rem 0 4rem;color:#182b2a}.sb-hero{padding:clamp(2rem,6vw,5rem);border-radius:30px;background:linear-gradient(135deg,var(--sb-ink),#315f54);color:#fff;box-shadow:var(--sb-shadow);margin:1rem 0 2rem}.sb-kicker{text-transform:uppercase;letter-spacing:.14em;font-weight:800;color:#f3d99d}.sb-hero h1{font-size:clamp(2.25rem,6vw,5.5rem);line-height:.96;margin:.4rem 0 1rem}.sb-hero a{color:#fff}.sb-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:1rem;margin:1.25rem 0 2.5rem}.sb-card,.grammar-card,.sb-note,.voyageur-stop{background:#fff;border:1px solid #d7cdbb;border-radius:22px;padding:1.25rem;box-shadow:0 8px 25px rgba(24,59,58,.08)}.sb-card{display:block;text-decoration:none;color:inherit}.sb-card:hover{transform:translateY(-3px);box-shadow:var(--sb-shadow)}.sb-card small{display:block;color:var(--sb-rust);font-weight:850;text-transform:uppercase;letter-spacing:.08em}.sb-card strong{display:block;font-size:1.16rem;margin-top:.35rem}.sb-note{border-left:7px solid var(--sb-gold)}.sb-analytic-figure{margin:2rem 0;padding:1rem;background:var(--sb-paper);border-radius:26px;border:1px solid #d7cdbb}.sb-analytic-figure img,.sb-diagram{display:block;width:100%;height:auto;border-radius:20px}.sb-analytic-figure figcaption{margin:.8rem .5rem .2rem;color:#4c504d;font-size:.94rem}.grammar-analysis{border-left:4px solid var(--sb-gold);padding:.2rem 0 .2rem 1rem;margin:.6rem 0 1.4rem}.grammar-citation{font-family:Georgia,serif;color:var(--sb-rust)}
.animation-shell{min-height:100vh;background:radial-gradient(circle at 10% 5%,#f5e1ad 0,transparent 28%),linear-gradient(160deg,#fbf7ee,#eaf0e8);padding:1rem}.animation-app{width:min(1120px,100%);margin:auto}.animation-header{padding:1.4rem 0}.animation-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:1.2rem;align-items:start}.animation-visual,.animation-panel{background:#fff;border:1px solid #d7cdbb;border-radius:26px;padding:1rem;box-shadow:var(--sb-shadow)}.animation-step{min-height:360px}.js .animation-step[hidden]{display:none}.step-label{color:var(--sb-rust);font-weight:850;text-transform:uppercase;letter-spacing:.1em}.trace{padding:.9rem 1rem;border-left:5px solid var(--sb-gold);background:#fbf5e8}.question{font-weight:750;color:var(--sb-blue)}.animation-controls{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}.animation-controls button,.game-button{appearance:none;border:2px solid var(--sb-ink);background:#fff;color:var(--sb-ink);border-radius:999px;min-height:46px;padding:.65rem 1rem;font:inherit;font-weight:800;cursor:pointer}.animation-controls button:hover,.animation-controls button:focus-visible,.game-button:hover,.game-button:focus-visible{background:var(--sb-ink);color:#fff;outline:3px solid var(--sb-gold);outline-offset:2px}.step-status{font-weight:800;margin:.8rem 0}.progress{height:10px;background:#e5ded0;border-radius:999px;overflow:hidden}.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--sb-rust),var(--sb-gold));transition:width .35s ease}.sb-diagram [data-layer]{opacity:.28;transition:opacity .35s ease,filter .35s ease}.sb-diagram [data-layer].is-active{opacity:1;filter:drop-shadow(0 0 8px rgba(216,169,79,.55))}.game-grid{display:grid;gap:1rem}.game-card{background:#fff;border:1px solid #d7cdbb;border-radius:20px;padding:1rem}.game-answer[hidden]{display:none}.bank details{background:#fff;border:1px solid #d7cdbb;border-radius:18px;padding:1rem;margin:.7rem 0}.bank summary{cursor:pointer;font-weight:800}.voyageur-map{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.voyageur-stop h2{margin-top:0}.route-badge{display:inline-block;background:var(--sb-ink);color:#fff;border-radius:999px;padding:.35rem .7rem;font-weight:800}.private-boundary{border:2px dashed var(--sb-rust);background:#fff8f1;padding:1rem;border-radius:18px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:800px){.animation-layout{grid-template-columns:1fr}.animation-step{min-height:0}.voyageur-map{grid-template-columns:1fr}.sb-shell{width:min(100% - 1rem,1180px)}.sb-hero{border-radius:20px}.animation-controls button{flex:1 1 42%}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}.sb-card:hover{transform:none}}

/* SB-CORRECTIF-VISUEL */
.sb-visual-deepening,.sb-transversal-visual{margin:2.25rem 0;padding:1.15rem;border-radius:26px;background:linear-gradient(145deg,#f8f2e5,#edf2ec);border:1px solid #d7cdbb}
.sb-visual-heading{font-size:clamp(1.35rem,2.5vw,2rem);margin:.15rem 0 1rem;color:#183b3a}
.sb-visual-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.sb-deep-figure{margin:0;padding:.85rem;background:#fff;border:1px solid #d7cdbb;border-radius:22px;box-shadow:0 8px 24px rgba(24,59,58,.08)}
.sb-deep-figure img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;border-radius:16px;background:#183b3a}
.sb-deep-figure figcaption{margin:.75rem .25rem .15rem;color:#424b48;line-height:1.5}
@media(max-width:760px){.sb-visual-pair{grid-template-columns:1fr}.sb-visual-deepening,.sb-transversal-visual{padding:.7rem}.sb-deep-figure{padding:.55rem}}
@media(prefers-reduced-motion:reduce){.sb-deep-figure,.sb-deep-figure img{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* SB-ETATS-SEMANTIQUES */
.semantic-state{opacity:1}.js .semantic-state{opacity:0;transition:opacity .28s ease,filter .28s ease}.js .semantic-state.is-active{opacity:1;filter:drop-shadow(0 0 5px rgba(216,169,79,.35))}
.semantic-caption{min-height:3rem;margin:.7rem 0 0;padding:.65rem .8rem;border-left:5px solid #d8a94f;background:#f7f0df;color:#183b3a;font-weight:800}
.semantic-static-key{margin-top:.7rem;background:#fff;border:1px solid #d7cdbb;border-radius:14px;padding:.65rem}.semantic-static-key summary{cursor:pointer;font-weight:800}.semantic-static-key ol{columns:2;column-gap:2rem;padding-left:1.4rem}.semantic-static-key li{break-inside:avoid;margin:.35rem 0}
@media(max-width:800px){.semantic-static-key ol{columns:1}.sb-semantic-diagram{min-height:280px}}
@media(prefers-reduced-motion:reduce){.semantic-state{transition:none!important}.semantic-caption{scroll-behavior:auto!important}}

/* SB-CONTINUITE-PAGES-MAJEURES */
.sb-continuity-figure{margin:1rem 0 1.35rem;padding:.72rem;background:#f7f0df;border:1px solid #d7cdbb;border-radius:18px;box-shadow:0 8px 22px rgba(16,45,44,.08)}
.sb-continuity-figure img{display:block;width:100%;height:auto;max-height:310px;object-fit:contain;border-radius:13px;background:#102d2c}
.sb-continuity-figure figcaption{margin:.7rem .2rem .1rem;color:#183b3a;font-size:.94rem;line-height:1.48}
@media(max-width:800px){.sb-continuity-figure{margin:.85rem 0 1.15rem;padding:.48rem}.sb-continuity-figure img{max-height:none}.sb-continuity-figure figcaption{font-size:.9rem}}
@media(prefers-reduced-motion:reduce){.sb-continuity-figure{scroll-behavior:auto}}

/* SB-CHOREGRAPHIE-SONORE */
[data-sound][aria-pressed="true"]{background:#183b3a;color:#f7f0df;border-color:#d8a94f;box-shadow:0 0 0 3px rgba(216,169,79,.24)}
.semantic-state.is-current{transform-box:fill-box;transform-origin:center}
.semantic-state.is-current[data-motion="enracinement"]{animation:sb-root 1.15s ease-out both}
.semantic-state.is-current[data-motion="transmission"],.semantic-state.is-current[data-motion="tressage"]{animation:sb-thread 1.35s ease-in-out both}
.semantic-state.is-current[data-motion="respiration"]{animation:sb-breathe 1.8s ease-in-out both}
.semantic-state.is-current[data-motion="resserrement"]{animation:sb-tighten .72s ease-out both}
.semantic-state.is-current[data-motion="seuil"],.semantic-state.is-current[data-motion="interiorite-monde"]{animation:sb-threshold 1.05s ease-out both}
.semantic-state.is-current[data-motion="rupture"]{animation:sb-break .58s steps(3,end) both}
.semantic-state.is-current[data-motion="reprise"],.semantic-state.is-current[data-motion="retour-transforme"]{animation:sb-return 1.55s cubic-bezier(.2,.7,.2,1) both}
.semantic-state.is-current[data-motion="resistance"],.semantic-state.is-current[data-motion="filiation-nouee"]{animation:sb-hold 1.4s ease-out both}
.semantic-state.is-current>path[stroke-dasharray]{animation:sb-draw 1.5s linear both}
@keyframes sb-root{0%{opacity:0;transform:translateY(18px) scale(.94)}100%{opacity:1;transform:none}}
@keyframes sb-thread{0%{opacity:0;transform:translateX(-14px) rotate(-1deg)}55%{transform:translateX(5px) rotate(.5deg)}100%{opacity:1;transform:none}}
@keyframes sb-breathe{0%{opacity:.15;transform:scale(.93)}65%{opacity:1;transform:scale(1.025)}100%{transform:scale(1)}}
@keyframes sb-tighten{0%{opacity:0;transform:scaleX(1.18)}100%{opacity:1;transform:scaleX(1)}}
@keyframes sb-threshold{0%{opacity:0;transform:translateX(-22px)}100%{opacity:1;transform:none}}
@keyframes sb-break{0%{opacity:0;transform:translateX(-8px)}45%{opacity:.75;transform:translateX(7px)}100%{opacity:1;transform:none}}
@keyframes sb-return{0%{opacity:0;transform:translateY(13px) scale(.92)}60%{opacity:1;transform:translateY(-3px) scale(1.03)}100%{transform:none}}
@keyframes sb-hold{0%{opacity:0;transform:scale(.9)}70%{opacity:1;transform:scale(1.02)}100%{transform:none}}
@keyframes sb-draw{from{stroke-dashoffset:75}to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.semantic-state.is-current,.semantic-state.is-current>path{animation:none!important;transform:none!important}.semantic-state{opacity:1!important}}
/* SB-MOBILE-GRID-CORRECTIF */
@media(max-width:800px){.layout{grid-template-columns:minmax(0,1fr)!important}.content,.toc,.fil-enrichi,.pilot-section,.nr-corps{min-width:0!important;width:auto!important;max-width:100%!important}.content,.toc{overflow-wrap:anywhere}.sb-continuity-figure{max-width:100%;box-sizing:border-box}}
