/* Connected navigation: the shell stays anchored while the workspace changes. */
.lab-header{view-transition-name:studio-header}
.sidebar{view-transition-name:studio-navigation}
::view-transition-group(studio-header),::view-transition-group(studio-navigation){animation-duration:360ms;animation-timing-function:cubic-bezier(.2,.75,.2,1)}
::view-transition-old(studio-header),::view-transition-new(studio-header),::view-transition-old(studio-navigation),::view-transition-new(studio-navigation){animation:none;mix-blend-mode:normal}
::view-transition-old(root){animation:studio-route-out 180ms ease both}
::view-transition-new(root){animation:studio-route-in 430ms cubic-bezier(.16,.75,.22,1) both;mix-blend-mode:normal}
html[data-route-direction="back"]::view-transition-new(root){animation-name:studio-route-back}
@keyframes studio-route-out{to{opacity:0;filter:blur(2px);transform:translateY(-5px)}}
@keyframes studio-route-in{from{opacity:.3;clip-path:polygon(0 0,5% 0,0 100%,0 100%);transform:translateY(10px)}to{opacity:1;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);transform:translateY(0)}}
@keyframes studio-route-back{from{opacity:.3;clip-path:polygon(95% 0,100% 0,100% 100%,100% 100%);transform:translateY(-8px)}to{opacity:1;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);transform:translateY(0)}}
.lab-header:after{content:"";position:absolute;bottom:-1px;left:0;height:2px;width:100%;pointer-events:none;background:linear-gradient(90deg,transparent,#aaa9ff,#65e0d8,transparent);transform:scaleX(0);transform-origin:left;opacity:0}
.studio-navigating .lab-header:after{animation:studio-route-signal 650ms ease both}
@keyframes studio-route-signal{0%{opacity:0;transform:scaleX(.04)}30%{opacity:1}100%{opacity:.8;transform:scaleX(1)}}
.lab-tabs a{position:relative;transition:background .25s,color .25s,box-shadow .25s}
.lab-tabs a[aria-current="location"]{box-shadow:inset 0 1px #c9d4ff2e,0 0 22px #9a98f514}
.lab-tabs a[aria-current="location"]:after{content:"";position:absolute;left:20%;right:20%;bottom:0;height:2px;background:linear-gradient(90deg,transparent,#b1b3ff,#7fdcd8,transparent);border-radius:4px}
.studio-section-signal:not([hidden]){position:fixed;right:26px;bottom:26px;z-index:95;pointer-events:none;display:flex;align-items:center;gap:11px;max-width:calc(100vw - 32px);padding:14px 18px;border:1px solid #aaaaf25c;border-radius:14px;background:linear-gradient(120deg,#232947f5,#152c3df5);box-shadow:0 10px 35px #02061066,0 0 25px #9a8ce418;backdrop-filter:blur(15px)}
.studio-section-signal i{width:6px;height:6px;background:#86dfd9;transform:rotate(45deg);box-shadow:0 0 12px #86dfd999}
.studio-section-signal small{font:9px var(--f-mono);letter-spacing:1px;color:#94a6cc}
.studio-section-signal span{font-size:13px;color:#d7e2fc}
html[data-page-transition="fallback"] .lab:not([data-studio-motion="quiet"]) .workspace-main{animation:studio-fallback-arrive 320ms ease-out both}
@keyframes studio-fallback-arrive{from{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:700px){.studio-section-signal:not([hidden]){right:16px;bottom:18px;padding:12px 14px}.studio-section-signal small{display:none}}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}.lab-header:after{animation:none!important}.lab-tabs a{transition:none}.studio-section-signal{display:none!important}html[data-page-transition="fallback"] .workspace-main{animation:none!important}}
html:has(body[data-studio-motion="quiet"])::view-transition-group(*),html:has(body[data-studio-motion="quiet"])::view-transition-old(*),html:has(body[data-studio-motion="quiet"])::view-transition-new(*){animation:none!important}
@media print{.studio-section-signal{display:none!important}}