/* Shared floating navigation, adapted from the IDWelly glass rail. */
body:has(.glass-nav){--header-height:100px;scroll-padding-top:100px}
.site-header:has(.glass-nav){position:fixed;z-index:30;top:24px;left:0;width:100%;background:transparent;pointer-events:none}
.site-header:has(.glass-nav) .header-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px;min-height:52px;max-width:none;padding-inline:32px;pointer-events:none}
.header-brand,.glass-nav,.header-subscribe{pointer-events:auto}
.header-brand{position:relative;justify-self:start;width:238px;height:52px;min-width:44px}
.header-brand .header-logo{position:absolute;inset:0;width:238px;height:52px;transition:opacity .2s}
.header-brand .logo-on-light{opacity:0}
.header-brand .header-symbol{display:none;width:44px;height:44px}
.on-light .header-brand .logo-on-dark{opacity:0}
.on-light .header-brand .logo-on-light{opacity:1}
.site-header .glass-nav,.js .site-header .glass-nav:not(.is-open){position:relative;display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;gap:2px;height:52px;width:auto;padding:3px;border:1px solid #ffffff4d;border-radius:32px;background:#22221fef;box-shadow:inset 0 1px 1px #ffffff36,inset 0 -1px 1px #0005,0 6px 24px #0002;isolation:isolate;touch-action:pan-y;user-select:none}
@supports (backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px)){
 .site-header .glass-nav,.js .site-header .glass-nav:not(.is-open){background:rgb(30 29 26 / .34);backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6)}
 .on-light.site-header .glass-nav,.js .on-light.site-header .glass-nav:not(.is-open){background:rgb(246 242 233 / .42);border-color:#fff9}
 .on-light .glass-nav .nav-link:not([aria-current]){color:var(--ink)}
}
.glass-nav .nav-link{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-height:44px;padding:9px 20px;color:var(--paper);font-size:12px;font-weight:500;border-radius:28px;text-decoration:none;line-height:1.5;transition:color .18s}
.glass-nav .nav-link::after{display:none}
.glass-nav .nav-link:hover{background:#ffffff12}
.glass-nav .nav-link:focus-visible{outline:2px solid var(--orange);outline-offset:5px}
.glass-nav .nav-link[aria-current]{color:var(--ink);font-weight:600}
.nav-slider{position:absolute;left:0;top:3px;bottom:3px;width:0;border-radius:28px;background:var(--orange);border:1px solid #ffffff26;box-shadow:inset 0 1px 2px #ffffff55,0 2px 8px #0002;pointer-events:none;overflow:hidden;opacity:0;transition:background-color .18s,box-shadow .18s}
.glass-nav.is-ready .nav-slider{opacity:1}
.nav-visual{display:flex;align-items:center;justify-content:center;pointer-events:none}
.nav-icon{display:none;width:21px;height:21px;flex-shrink:0}
.nav-slider.is-moving,.nav-slider.is-dragging{z-index:2;background:rgb(255 92 53 / calc(1 - .55 * var(--lens-energy,0)));border-color:#ffc7b6a0;box-shadow:inset 1px 0 2px #fff9,inset -1px 0 2px #fff6,inset 0 1px 1px #fff5,0 3px 8px #0003;will-change:transform,width}
.nav-lens-content{position:absolute;top:-1px;left:-1px;height:calc(100% + 2px);opacity:0;pointer-events:none}
.has-lens .nav-slider.is-moving .nav-lens-content,.has-lens .nav-slider.is-dragging .nav-lens-content{opacity:1}
.nav-lens-item{position:absolute;top:0;height:100%;display:flex;align-items:center;justify-content:center;color:var(--ink);font-size:12px;font-weight:600;white-space:nowrap}
.nav-lens-item .nav-label{transform:scale(calc(1 + .045 * var(--lens-energy,0)))}
.nav-lens-item .nav-icon{transform:scale(calc(1 + .14 * var(--lens-energy,0)))}
.header-subscribe{display:flex;align-items:center;justify-content:center;gap:10px;justify-self:end;min-height:48px;padding:10px 18px;border-radius:30px;background:var(--paper);color:var(--ink);text-decoration:none;font-size:12px;font-weight:600;border:1px solid #fff2;transition:background .2s}
.header-subscribe:hover{background:var(--orange)}
.header-subscribe svg{width:21px;height:21px}
.on-light .header-subscribe{background:var(--ink);color:var(--paper)}
.on-light .header-subscribe:hover{background:var(--orange);color:var(--ink)}
.library-page .library-intro{padding-top:160px}
.library-page .film-card{scroll-margin-top:110px}
@media(max-width:1000px){.header-brand{width:44px;height:44px}.header-brand .header-logo{display:none}.header-brand .header-symbol{display:block}.site-header:has(.glass-nav) .header-inner{padding-inline:24px}.header-subscribe{min-height:44px;padding:10px 14px}.header-subscribe span{display:none}.glass-nav .nav-link{padding-inline:18px}}
@media(max-width:600px){.site-header:has(.glass-nav){top:12px}.site-header:has(.glass-nav) .header-inner{padding-inline:12px;gap:8px}.glass-nav .nav-link{width:44px;padding:10px;min-height:44px}.glass-nav .nav-icon{display:block}.glass-nav .nav-label{display:none}.header-subscribe{width:44px;height:44px;padding:10px}.header-brand{width:44px}.library-page .library-intro{padding-top:116px}}
@media(prefers-reduced-motion:reduce){.nav-slider,.header-logo,.header-subscribe,.nav-link{transition:none!important}}
.glass-nav:not(.is-ready) .nav-link[aria-current]{background:var(--orange)}
