@view-transition{navigation:auto}
.version-toggle{box-sizing:border-box;width:190px;height:42px;opacity:1;visibility:visible;transition:opacity .2s,visibility .2s;position:fixed;top:24px;right:24px;z-index:101;display:grid;grid-template-columns:1fr 1fr;gap:3px;margin:0;padding:3px;border:1px solid #dbe4e330;background:#101518d9;border-radius:4px;font:10px/1 Plex,monospace;letter-spacing:.08em;view-transition-name:version-toggle}
.version-toggle a,.version-toggle span{box-sizing:border-box;display:flex;justify-content:center;align-items:center;min-height:34px;padding:0 12px;color:#a1aaac;text-decoration:none}
.version-toggle [aria-current=page]{background:#dbe4e325;color:#eee;border-radius:2px}
.version-toggle a:hover{background:#dbe4e310;color:white}
.version-toggle a:focus-visible{outline:1px solid white;outline-offset:1px}
.masthead{padding-right:180px}
::view-transition-old(root){animation:version-out .3s ease both}
::view-transition-new(root){animation:version-in .4s ease both}
@keyframes version-out{to{opacity:0}}
@keyframes version-in{from{opacity:0}to{opacity:1}}
@media(max-width:600px){.version-toggle{top:18px;right:14px}.masthead{padding-right:155px}header>span{max-width:55%}}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}}

#entry .entry-top{flex-direction:column;align-items:flex-start;gap:18px;padding-right:145px}
#entry-label{font-size:10px;letter-spacing:.08em}

/* Keep project actions clear throughout extraction, playback and return. */
body:has(dialog[open]) .version-toggle,
body.object-previewing .version-toggle,
body.case-busy:not(.case-paging) .version-toggle{opacity:0;visibility:hidden;pointer-events:none}

@media(prefers-reduced-motion:reduce){.version-toggle{transition:none}}

@media(max-width:600px){
 .version-toggle{width:160px;height:36px;font-size:9px;letter-spacing:.03em}
 .version-toggle a,.version-toggle span{min-height:28px;padding:0 6px}
}
