.al-reset,.al-reset *{transition:none!important}
.al-js .al-step,.al-js .al-g-src0,.al-js .al-g-src1,.al-js .al-g-src2,.al-js .al-g-proc,.al-js .al-g-ana,.al-js .al-st3{opacity:0;transform:translateY(14px);transition:opacity .4s ease,transform .4s ease}
.al-play .al-step,.al-play .al-g-src0,.al-play .al-g-src1,.al-play .al-g-src2,.al-play .al-g-proc,.al-play .al-g-ana,.al-play .al-st3{opacity:1;transform:none;transition:opacity .7s ease,transform .7s ease}
.al-play .al-step1,.al-play .al-g-src0{transition-delay:0s}
.al-play .al-g-src1{transition-delay:.6s}
.al-play .al-g-src2{transition-delay:1.2s}
.al-play .al-step2,.al-play .al-g-proc{transition-delay:2.4s}
.al-js .al-g-lin{transform-box:fill-box;transform-origin:50% 0;transform:scaleY(0);transition:transform .3s,opacity .3s}
.al-play .al-g-lin{transform:scaleY(1);opacity:0;transition:transform .8s ease 3.2s,opacity .5s ease 9.9s}
.al-play .al-g-ana{transition-delay:4.2s}
.al-sp-ex{opacity:0;transition:opacity .3s}
.al-play .al-sp-ex{opacity:1;transition:opacity .7s ease 5.8s}
.al-sp-el{transform-box:view-box;transform-origin:540px 388px;transition:transform .3s}
.al-play .al-sp-el{transition:transform 3.2s cubic-bezier(.45,0,.25,1) 6.6s}
.al-sp-el0{transform:rotate(-24deg)} .al-play .al-sp-el0{transform:rotate(-140deg)}
.al-sp-el1{transform:rotate(-8deg)} .al-play .al-sp-el1{transform:rotate(-55deg)}
.al-sp-el2{transform:rotate(8deg)} .al-play .al-sp-el2{transform:rotate(55deg)}
.al-sp-el3{transform:rotate(24deg)} .al-play .al-sp-el3{transform:rotate(140deg)}
.al-sp-arc{stroke:#C4C9CD;stroke-dasharray:60 300;stroke-dashoffset:-240;transition:all .3s}
.al-play .al-sp-arc{stroke:#61D5FD;stroke-dasharray:280 80;stroke-dashoffset:-130;transition:stroke-dasharray 3.2s cubic-bezier(.45,0,.25,1) 6.6s,stroke-dashoffset 3.2s cubic-bezier(.45,0,.25,1) 6.6s,stroke 3.2s ease 6.6s}
.al-js .al-g-lout{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0);transition:transform .3s}
.al-play .al-g-lout{transform:scaleY(1);transition:transform .9s ease 9.9s}
.al-sp-t1{transition:opacity .3s}
.al-play .al-sp-t1{opacity:0;transition:opacity .5s ease 9.9s}
.al-sp-t2{opacity:0;transition:opacity .3s}
.al-play .al-sp-t2{opacity:1;transition:opacity .8s ease 10.6s}
.al-play .al-step3,.al-play .al-st3{transition-delay:11.1s}
.al-scrolly:not(.al-js) .al-sp-el0{transform:rotate(-140deg)}.al-scrolly:not(.al-js) .al-sp-el1{transform:rotate(-55deg)}.al-scrolly:not(.al-js) .al-sp-el2{transform:rotate(55deg)}.al-scrolly:not(.al-js) .al-sp-el3{transform:rotate(140deg)}
.al-scrolly:not(.al-js) .al-sp-arc{stroke:#61D5FD;stroke-dasharray:280 80;stroke-dashoffset:-130}.al-scrolly:not(.al-js) .al-sp-ex,.al-scrolly:not(.al-js) .al-sp-t2{opacity:1}.al-scrolly:not(.al-js) .al-sp-t1,.al-scrolly:not(.al-js) .al-g-lin{opacity:0}
@media (prefers-reduced-motion: reduce){.al-flow{animation:none}.al-scrolly *{transition-duration:.01s!important;transition-delay:0s!important}}

/* diagram scale — fit title → link on ~13″ laptop viewports */
.al-diagram{margin:14px 0 0}
.al-diagram-inner{
  width:100%;
  transform:scale(.78);
  transform-origin:top center;
  margin-bottom:calc((.78 - 1) * 42.7%); /* 512/1200 ≈ 42.7% — reclaim unused scaled space */
}
@media (max-height:820px){
  .al-diagram-inner{transform:scale(.68);margin-bottom:calc((.68 - 1) * 42.7%)}
}
@media (min-height:1000px){
  .al-diagram-inner{transform:scale(.88);margin-bottom:calc((.88 - 1) * 42.7%)}
}

/* SVG labels — bump readability after diagram scale-down */
.al-diagram-inner svg text[font-size="12"]{font-size:16px}
.al-diagram-inner svg text[font-size="13"]{font-size:17px}
.al-diagram-inner svg text[font-size="14"]{font-size:18px}

/* progress + replay */
.al-progress-row{display:flex;align-items:center;gap:14px;margin-top:10px}
.al-progress{flex:1 1 auto;height:2px;background:#2A2D31;border-radius:1px;overflow:hidden}
.al-progress>i{display:block;height:100%;width:0;background:#61D5FD;opacity:.65;border-radius:1px;transform-origin:left center}
.al-js .al-progress>i{width:0;transition:none}
.al-play .al-progress>i{width:100%;transition:width 12.5s linear}
.al-scrolly:not(.al-js) .al-progress>i{width:100%}
.al-replay{flex:0 0 auto;margin:0;padding:6px 12px;border:1px solid #4A4F55;border-radius:999px;background:transparent;color:#C4C9CD;font:500 13px Archivo,system-ui,sans-serif;cursor:pointer}
.al-replay:hover{color:#F8FAFA;border-color:#8A9096}
.al-replay:focus-visible{outline:1px solid #C9CDD0;outline-offset:2px}
@media (prefers-reduced-motion: reduce){.al-play .al-progress>i{transition:none;width:100%}}