:root{color-scheme:dark;--ink:#f6f4e5;--green:#96f77c;--stage:0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#040b08;color:var(--ink);font-family:var(--font-text);font-weight:var(--text-weight)}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a,[tabindex],summary{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,[tabindex]:focus-visible,summary:focus-visible{outline:2px solid #c1ff8b;outline-offset:6px}button{border:0}.slash{padding:0 8px}.motion{background:transparent;border:1px solid #557060;border-radius:3px;min-height:44px;padding:0 12px;font:10px var(--font-mono);letter-spacing:1px}.skip{position:fixed;top:10px;left:10px;z-index:30;padding:12px;background:#ddffc8;color:#092112;transform:translateY(-150%)}.skip:focus{transform:none}.scene{position:relative;overflow:hidden}.routing{height:100vh;min-height:820px;max-height:1150px;background:linear-gradient(#00130a22,#00100933),url('assets/memory-forest.png') center/cover}.routing:after,.life-sticky:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 52% 55%,transparent 40%,#01080555);z-index:0}h1{position:absolute;z-index:2;left:4%;top:9.5%;margin:0;font-size:clamp(65px,6.65vw,113px);font-family:var(--font-display);font-weight:var(--display-weight);line-height:.91;letter-spacing:var(--display-track)}.tasks{position:absolute;z-index:3;right:4%;top:11%;display:flex;border:1px solid #758875;border-radius:8px;overflow:hidden;background:#06110dbb}.tasks button{min-height:54px;padding:0 20px;background:transparent;border-right:1px solid #566c5c;font-size:14px;color:#bac8bf}.tasks button:last-child{border:0}.tasks button span{margin-right:10px;font-size:20px}.tasks button[aria-pressed=true]{color:#d5ffab;background:linear-gradient(115deg,#639f423d,#182d1644);box-shadow:inset 0 0 20px #84ff5130}.routing-art,.life-art{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible}.wires{fill:none;stroke:#9dbab2;stroke-opacity:.65;stroke-width:1}.branch{transition:stroke .6s,filter .6s}.branch.active,.lit-edge{stroke:#b4ff8b;stroke-opacity:1;stroke-width:1.3;fill:none;filter:drop-shadow(0 0 5px #8cff50)}.branch.active{stroke-dasharray:600;animation:route-flow 7s linear infinite}.plate-face{fill:url(#glass);stroke:#88aaa0;stroke-width:.7}.plate-side{fill:#091710bb;stroke:#526f61;stroke-width:.6}.file.active .plate-face{stroke:#b4ff8b;filter:drop-shadow(0 0 5px #8cff5044)}.art-hot{cursor:pointer;color:#c1d7cd;outline:none}.art-hot:hover,.art-hot:focus-visible{filter:drop-shadow(0 0 9px #bbff9899)}.art-hot:focus-visible .plate-face,.art-hot:focus-visible>path{stroke:#f5ffd9;stroke-width:2}.root-title{font-size:27px;font-weight:800;fill:#f6f4e9}.root-tag{font:12px var(--font-mono);letter-spacing:2px;fill:#d8ffa9}.file-title{font-size:18px;font-weight:700;fill:#c5d7d3}.file.active .file-title{fill:#f4f5e6}.art-small{font:11px var(--font-mono);fill:#a0bdb7}.spaced{letter-spacing:3px}.task-label{font-size:18px;font-weight:700;fill:#f7f5e9}.pulse-orb{animation:orb 4s ease-in-out infinite;transform-origin:710px 496px}.routing-bottom{position:absolute;z-index:2;bottom:4%;left:4%;right:4%;display:flex;align-items:center;justify-content:space-between}.micro{font:10px/1.7 var(--font-mono);letter-spacing:2px;color:#a7bdb3}.routing-bottom>div{text-align:center}.routing-bottom p{font-size:24px;margin:0 0 14px;letter-spacing:-.7px}.route-note{font:10px var(--font-mono);color:#bdd799;letter-spacing:1px}.routing-bottom>a{display:grid;place-items:center;width:44px;height:44px;border:1px solid #68816c;border-radius:50%;font-size:22px}.detail{position:absolute;z-index:5;border:1px solid #91eb8a;background:linear-gradient(125deg,#0c201aeF,#030b08f5);box-shadow:0 14px 60px #0007;border-radius:7px;padding:21px 22px;color:#dae5d9}.detail[hidden]{display:none}.detail small{font:8px var(--font-mono);letter-spacing:1.5px;color:#91b29e}.detail h3{font-size:23px;letter-spacing:-.6px;line-height:1.1;margin:12px 0}.detail p{font-size:15px;line-height:1.5;margin:0}.close{position:absolute;right:4px;top:0;background:transparent;font-size:25px;width:44px;height:44px;color:#b4dca7}.route-detail{left:43%;top:25%;width:320px}.route-detail h3{padding-right:20px}.lifecycle{height:240vh;min-height:1700px;position:relative;background:#040c08}.life-sticky{position:sticky;top:0;height:100vh;min-height:780px;max-height:1200px;background:radial-gradient(ellipse at 46% 56%,#10261966,transparent 50%),linear-gradient(135deg,#020b07,#060e09 60%,#020705)}h2{font-family:var(--font-display);font-weight:var(--display-weight);letter-spacing:var(--display-track)}.life-sticky h2{position:absolute;z-index:2;left:4%;top:6%;font-size:clamp(60px,6.65vw,106px);line-height:.91;margin:0}.life-sticky h2 span{color:#47d263}.life-detail{left:calc(10% + var(--stage)*22%);top:26%;width:270px;transition:left .7s cubic-bezier(.2,.8,.2,1);padding:17px 20px}.life-detail h3{font-size:22px}.life-detail p{font-size:14px}.life-detail details{margin-top:10px}.life-detail summary{font-size:14px;color:#7ff38a;list-style:none;cursor:pointer;min-height:26px}.life-detail .example{font:11px/1.5 var(--font-mono);padding-top:12px}.life-detail:has(details[open]){top:22%;max-height:60%;overflow:auto}.stage-art{opacity:.68;transition:opacity .8s,filter .8s}.stage-art.selected{opacity:1;filter:drop-shadow(0 0 7px #90ff7138)}.white{fill:#f0f5e9}.filament{stroke:#8aff93;stroke-width:2;fill:none;stroke-dasharray:1650;animation:filament 9s ease-in-out infinite}.filament-halo{stroke:#7fff8d;stroke-width:9;fill:none;filter:url(#life-glow);opacity:.3}.stage-controls{position:absolute;top:66%;left:2%;right:2%;z-index:3;display:grid;grid-template-columns:repeat(4,1fr)}.stage-controls button{display:flex;align-items:center;flex-direction:column;background:transparent;min-height:138px;padding:0}.hotspot{display:grid;place-items:center;border:1px solid #d0dfcf;width:29px;height:29px;border-radius:50%;font-size:23px;line-height:1;background:#06110ecc;transition:transform .3s,box-shadow .3s}.stage-controls button:hover .hotspot,.stage-controls button[aria-pressed=true] .hotspot{border-color:#88fc91;color:#9dffa1;box-shadow:0 0 24px #75ff6866;transform:scale(1.2)}.stem{height:43px;width:1px;background:#778779;display:block;margin:1px 0 10px}.stage-controls small{font:16px var(--font-mono);color:#b3beb7}.stage-controls strong{font-size:24px;letter-spacing:-.6px;font-weight:500;margin-top:3px}.stage-controls button[aria-pressed=true] small{color:#6bfb87}.stage-controls button[aria-pressed=true] .stem{background:#79f18a}.progress{position:absolute;bottom:12%;left:42%;width:16%;display:flex;justify-content:space-between;z-index:2}.progress:before{content:'';position:absolute;top:6px;height:1px;background:#647b68;width:100%}.progress i{position:relative;width:13px;height:13px;border:1px solid #819087;border-radius:50%;background:#04100a}.progress i.active{background:#53e878;border-color:#53e878}.life-caption{position:absolute;bottom:6.5%;width:100%;text-align:center}.illustrative{position:absolute;right:4%;bottom:6.5%;font-size:8px}.further{padding:110px 6% 100px;display:grid;grid-template-columns:1fr 1fr;gap:9%;background:linear-gradient(#07110b,#030906);border-top:1px solid #1b3324}.further h2{font-size:48px;line-height:1.04;max-width:300px}.accordions>details{border-bottom:1px solid #304137;padding:17px 0}.accordions summary{list-style:none;cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:space-between;font-size:17px}.accordions summary span{font-size:24px;color:#92ba91}.accordions p{font-size:14px;line-height:1.7;color:#b7c8bc;max-width:520px}.accordions details[open] summary span{transform:rotate(45deg)}footer{padding:30px 6%;display:flex;gap:30px;border-top:1px solid #24362a;font:11px var(--font-mono);color:#b6c8b9}footer>a:first-child{flex:1}.paused *,.offscreen *{animation-play-state:paused!important}@keyframes route-flow{0%{stroke-dashoffset:80}100%{stroke-dashoffset:-1120}}@keyframes orb{50%{opacity:.7;transform:scale(.85)}}@keyframes filament{0%,100%{stroke-dashoffset:0;opacity:.75}50%{stroke-dashoffset:70;opacity:1}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
@media(max-width:1000px){header{gap:15px}.tasks{top:27%;right:4%}.tasks button{padding:0 12px;font-size:12px}.routing-art{top:10%;height:85%}.routing-bottom p{font-size:19px}.life-detail{width:240px;left:calc(4% + var(--stage)*23%)}.illustrative{display:none}}
@media(max-width:600px){header{height:76px;padding:0 6%;gap:8px}.slash{padding:0 3px}.motion{font-size:8px;padding:0 7px;letter-spacing:0}.routing{height:1060px;min-height:0;max-height:none;background-position:center}.routing h1{top:105px;left:6%;font-size:52px;line-height:.98}.tasks{left:6%;right:6%;top:238px}.tasks button{padding:0 7px;flex:1;min-height:49px;font-size:10px;white-space:nowrap}.tasks button span{font-size:14px;margin-right:3px}.routing-art{inset:auto;left:0;top:315px;height:610px;width:100%;overflow:hidden}.routing-art{view-transition-name:none}.routing-bottom{bottom:30px;left:6%;right:6%;gap:10px}.routing-bottom .micro{display:none}.routing-bottom p{font-size:16px;letter-spacing:-.5px;text-align:left;margin-bottom:8px}.route-note{font-size:8px;letter-spacing:0}.routing-bottom>div{text-align:left}.route-detail{position:absolute;left:6%;right:6%;top:295px;width:auto}.lifecycle{height:2000px;min-height:0}.life-sticky{height:900px;min-height:0;max-height:none}.life-sticky h2{left:6%;top:35px;font-size:49px}.life-art{top:165px;left:-70%;width:240%;height:460px}.stage-art{opacity:.22}.stage-art.selected{opacity:1}.life-detail{top:540px;left:6%!important;right:6%;width:auto;transition:none;min-height:172px}.life-detail:has(details[open]){top:550px;max-height:245px}.stage-controls{top:448px;left:4%;right:4%;gap:5px}.stage-controls button{min-height:90px}.stage-controls strong{font-size:17px;margin-top:5px}.stage-controls small{font-size:11px}.stem{height:14px;margin-bottom:5px}.hotspot{width:26px;height:26px}.progress{bottom:85px;left:34%;width:32%}.life-caption{bottom:40px;font-size:9px}.further{display:block;padding:65px 6%}.further h2{font-size:39px;max-width:none;margin:20px 0 35px}.accordions summary{font-size:15px}.accordions p{font-size:13px}footer{padding:26px 6%;flex-wrap:wrap;gap:24px;font-size:10px}footer>a:first-child{flex-basis:100%}}
@media(max-width:600px){.routing-art>.art-small,.routing-art>path:not(:first-child){display:none}.life-art{top:155px;left:0;width:100%;height:320px}.stage-art{opacity:.7}.stage-art.selected{opacity:1}.routing-art .art-small{font-size:13px}.file-title{font-size:19px}.life-detail{top:550px}.stage-controls{top:452px}}
.branch.active{stroke-dasharray:none;animation:line-breathe 5s ease-in-out infinite}.filament{stroke-dasharray:none;animation:line-breathe 6s ease-in-out infinite}@keyframes line-breathe{50%{opacity:.55;filter:drop-shadow(0 0 9px #8aff80)}}@media(min-width:1001px){.life-detail{left:min(76%,calc(20% + var(--stage)*24%));width:270px}.life-detail:before{content:'';position:absolute;left:-28px;top:50px;width:27px;height:70px;border-top:1px solid #8af68c;border-left:1px solid #8af68c;border-radius:7px 0 0 0}.life-detail:after{content:'';position:absolute;left:-32px;top:116px;width:9px;height:9px;border-radius:50%;background:#7ffa83;box-shadow:0 0 12px #86ff86}}.mobile-wires{display:none;fill:none;stroke:#658779;stroke-width:.7}@media(max-width:600px){.mobile-wires{display:block}}
/* Review repairs: generous hit areas and bounded detail panels. */
footer a{min-height:44px;display:inline-flex;align-items:center}.life-detail summary{min-height:44px;display:flex;align-items:center}.life-detail{max-width:calc(100% - 32px)}@media(min-width:601px){.life-detail{left:clamp(16px,calc(20% + var(--stage)*24%),calc(100% - 286px))}}.motion:disabled{cursor:default;opacity:.8}

html[data-smooth-scroll],html[data-smooth-scroll] [data-scroll-layer],html[data-smooth-scroll] [data-scroll-spacer]{overflow-anchor:none}
.accordions ul{padding-left:20px;color:#b7c8bc;font-size:14px;line-height:1.7;margin-top:0}.accordions li+li{margin-top:6px}

/* Clear the fixed header while the lifecycle scene is pinned. */
.life-sticky h2{top:max(6%,104px)}
@media(max-width:600px){.life-sticky h2{top:90px}}
