/* A timed explanatory diagram, not a page-loading indicator. */
html.caldrift-opening-active{overflow:hidden}
body[data-project=caldrift][data-page=app]:has(#lab-opening.animated-opening:not([hidden]))>.topbar{display:flex}
.opening-mobile-assets,.opening-mobile-recovery{display:none}
#lab-opening.animated-opening{position:fixed;inset:0;z-index:1500;width:100%;height:100svh;min-height:0;margin:0;overflow:auto;background:#f4f5f2;padding:5.5rem 3vw 5rem;display:flex;align-items:center;justify-content:center;isolation:isolate;opacity:1;will-change:opacity}
#lab-opening.animated-opening[hidden]{display:none!important}
#lab-opening.animated-opening .intro-top{position:absolute;top:1.5rem;left:3vw;right:3vw;font:500 .8rem/1.4 Consolas,monospace;letter-spacing:.03em;align-items:center}
.opening-controls{display:flex;align-items:center;gap:1.25rem}.opening-controls button{border:0;border-bottom:1px solid #a3adb2;background:transparent;padding:.45rem .15rem;border-radius:0;font-size:.875rem;font-weight:500;color:#263642}.opening-controls button:hover{color:#d74d28;border-color:#d74d28}
.opening-stage{width:min(940px,100%);flex-shrink:0}.opening-chapter{display:flex;align-items:center;justify-content:space-between;gap:1rem;color:#465863;font:500 .75rem/1.5 Consolas,monospace;letter-spacing:.07em;margin-bottom:.5rem}.opening-mode{color:#78858a;font-size:.75rem}
#lab-opening.animated-opening .structure-diagram{width:100%;height:auto;max-height:49svh;min-height:0;overflow:visible;display:block}
.opening-basket text{fill:#334550;font:13px Consolas,monospace;letter-spacing:.07em}.opening-basket path{fill:none;stroke:#899ba3;stroke-width:.8}
#opening-recovery text{fill:#273e48;font:13px Consolas,monospace;letter-spacing:.06em}#opening-recovery .alternative-label{fill:#8b9698;font-size:12px}#opening-deflection text{font:18px Georgia,serif}
#lab-opening.animated-opening .intro-copy{text-align:center;margin:0;min-height:142px}.animated-opening #opening-title{font-size:clamp(3rem,5.5vw,5.6rem);font-weight:500;letter-spacing:-.075em;line-height:1;margin:.7rem 0 1rem;opacity:0;transform:translateY(10px)}#opening-title span{color:#d74d28}
#lab-opening.animated-opening .intro-copy p{font-size:1rem;line-height:1.5;color:#627078;margin:0;min-height:1.5em;max-width:none}.animated-opening .intro-copy .primary{display:none;margin:1rem auto 0}
.opening-bottom{position:absolute;bottom:1.8rem;left:max(3vw,calc((100vw - 940px)/2));right:max(3vw,calc((100vw - 940px)/2));font:500 .75rem/1.4 Consolas,monospace}.opening-progress{height:2px;background:#dce1e1;overflow:hidden}.opening-progress>span{display:block;transform:scaleX(0);transform-origin:left;width:100%;height:100%;background:#d74d28}.opening-timeline{display:flex;justify-content:space-between;gap:.8rem;margin-top:.9rem;color:#8d989c}.opening-timeline .active{color:#c14c2b}.opening-timeline .past{color:#364b56}
.animated-opening[data-mode=reduced] .intro-copy .primary{display:inline-block}.animated-opening[data-mode=reduced] #opening-title{opacity:1;transform:none}.animated-opening[data-mode=reduced] .opening-bottom{display:none}.animated-opening[data-mode=reduced] #opening-pause{display:none}
@media(max-height:700px) and (min-width:701px){#lab-opening.animated-opening{padding-top:4.5rem;padding-bottom:4rem}.animated-opening #opening-title{font-size:3.5rem}.opening-stage{width:min(790px,100%)}#lab-opening.animated-opening .intro-copy{min-height:110px}.opening-chapter{margin-bottom:0}#lab-opening.animated-opening .structure-diagram{max-height:45svh}}
@media(max-width:700px){#lab-opening.animated-opening{padding:6.5rem 1.2rem 5.5rem}.opening-stage{width:100%}.opening-mode{display:none}#lab-opening.animated-opening .intro-top{left:1.2rem;right:1.2rem;top:1.2rem}.opening-controls{gap:.75rem}.opening-controls button{font-size:.8rem}.opening-chapter{font-size:.75rem;margin:0 0 1rem}.opening-basket text{font-size:18px;letter-spacing:0}#opening-recovery text{font-size:18px;letter-spacing:0}#opening-recovery .alternative-label{font-size:17px}#lab-opening.animated-opening .structure-diagram{width:100%;max-height:none}.animated-opening #opening-title{font-size:4.4rem;margin:2rem 0 1.3rem}#lab-opening.animated-opening .intro-copy p{font-size:.9rem;max-width:24rem;margin:auto}.opening-timeline{font-family:'Segoe UI',sans-serif;font-size:.75rem;gap:.8rem;line-height:1.3}.opening-timeline span{max-width:7.5rem}.opening-timeline span:last-child{text-align:right}.opening-bottom{left:1.2rem;right:1.2rem;bottom:1.6rem}}
@media(max-width:380px){.opening-controls{gap:.5rem}.opening-controls button{font-size:.75rem}.animated-opening #opening-title{font-size:3.8rem}.opening-basket text{font-size:20px}#opening-recovery text{font-size:19px}}
@media(max-height:520px){#lab-opening.animated-opening{justify-content:flex-start;padding-top:5rem}.opening-bottom{position:static;width:100%;margin-top:1.5rem}.opening-stage{width:min(670px,100%)}#lab-opening.animated-opening .structure-diagram{max-height:44svh}#lab-opening.animated-opening .intro-copy{min-height:0}.animated-opening #opening-title{font-size:2.5rem;margin:.5rem 0}.opening-chapter{display:none}}
@media(prefers-reduced-motion:reduce){#lab-opening.animated-opening{will-change:auto}.animated-opening #opening-title{transform:none}}
@media print{#lab-opening.animated-opening{display:none!important}}
@media(max-width:700px){.opening-mobile-assets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.35rem;font-size:.75rem;text-align:center;margin:1.5rem 5% -.8rem}.opening-mobile-assets span{border-bottom:2px solid #263642;padding-bottom:.5rem}.opening-mobile-assets span:nth-child(2){border-color:#e86034}.opening-mobile-assets span:nth-child(3){border-color:#edb368}.opening-mobile-assets span:nth-child(4){border-color:#92a9b3}.opening-basket text,#opening-recovery text{display:none}.opening-mobile-recovery{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;text-align:center;font-size:.875rem;margin:-1rem 5% 0}.opening-mobile-recovery small{font-size:.75rem}.opening-mobile-recovery span:first-child{color:#b64323}.opening-mobile-recovery span:last-child{color:#263642}}
