/* Route changes keep the document, background, navigation and glass rails alive. */
@view-transition { navigation:none; }
html { overflow-y:scroll; scrollbar-gutter:stable; }
html.route-positioning { scroll-behavior:auto!important; }
.site-header { top:calc(16px + var(--admin-offset)); }
@media(min-width:960px) { .site-sidebar { top:calc(120px + var(--admin-offset)); } }
@media(min-width:1200px) { .activity-sidebar { top:calc(120px + var(--admin-offset)); } }
@media(max-width:959px) { .site-header { top:calc(12px + var(--admin-offset)); } }
.top-nav.has-persistent-lens,.category-nav.has-persistent-lens { position:relative; isolation:isolate; }
.has-persistent-lens>a { z-index:1; isolation:auto; }
.has-persistent-lens>.liquid-lens { inset:auto; z-index:0; transform-origin:center; transition:opacity .15s; }
.top-nav a.is-active:after { display:none; }
.reading-progress[hidden] { display:none; }
.route-progress { position:absolute; left:23px; right:23px; bottom:0; height:2px; border-radius:99px; background:linear-gradient(90deg,transparent,var(--red) 38%,var(--cyan) 65%,transparent); opacity:0; pointer-events:none; transform:scaleX(.35); transform-origin:left; }
html[data-route-loading] .route-progress { opacity:1; animation:route-wait 1.4s ease-in-out infinite alternate; }
@keyframes route-wait { from { transform:translateX(0) scaleX(.25); } to { transform:translateX(62%) scaleX(.38); } }
.route-announcement { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.route-notice { position:fixed; z-index:180; left:50%; bottom:24px; transform:translateX(-50%); display:flex; align-items:center; gap:14px; width:max-content; max-width:calc(100vw - 32px); padding:13px 18px; border:1px solid var(--glass-edge); border-radius:16px; box-shadow:var(--glass-shadow); background:var(--surface); color:var(--text); font-size:13px; }
.route-notice[hidden] { display:none; }
.route-notice button { padding:6px; border:0; background:none; color:var(--cyan); font:inherit; white-space:nowrap; }
.site-main:focus:not(:focus-visible) { outline:none; }
@media(max-width:600px) { .route-notice { flex-wrap:wrap; gap:7px 12px; } }
@media(prefers-reduced-motion:reduce) { .has-persistent-lens>.liquid-lens { transition:none; } html[data-route-loading] .route-progress { animation:none; transform:scaleX(.5); } }
@media print { .route-notice,.route-progress,.route-announcement { display:none!important; } }