/* Grande - transparent navigation bar. The bar has no background; whatever scrolls under it is blurred a little at the very top
   and less and less further down, in three steps, so it fades away instead of ending in a visible edge. */
:root{--nav-h:70px}
@media(max-width:860px){:root{--nav-h:66px}}
.nav,.nav:not(.docnav){background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-bottom:0!important}
html:has(header.nav)::before,html:has(header.nav)::after,body:has(header.nav)::before{content:"";position:fixed;top:0;left:0;right:0;z-index:19;pointer-events:none}
/* strongest, shortest */
html:has(header.nav)::before{height:calc(var(--nav-h) + 10px);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:rgba(15,15,15,.62);
  -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 35%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0,#000 35%,transparent 100%)}
/* middle */
html:has(header.nav)::after{height:calc(var(--nav-h) + 38px);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 25%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0,#000 25%,transparent 100%)}
/* lightest, longest */
body:has(header.nav)::before{height:calc(var(--nav-h) + 70px);-webkit-backdrop-filter:blur(2.5px);backdrop-filter:blur(2.5px);
  -webkit-mask-image:linear-gradient(to bottom,#000 0,transparent 100%);mask-image:linear-gradient(to bottom,#000 0,transparent 100%)}
html.has-notice:has(header.nav)::before,html.has-notice:has(header.nav)::after,html.has-notice body:has(header.nav)::before{top:var(--nbh,0px)}
html.has-notice body .nav::before,html.has-notice body .nav::after{display:none!important}
/* the links: light grey, and just the text turns white on hover (no dark box) */
.links>a,.dd>button{color:#c4c4c4;text-shadow:0 1px 12px rgba(0,0,0,.6);transition:color .2s ease}
.links>a:hover,.dd>button:hover,.dd.open>button,.links>a:focus-visible,.dd>button:focus-visible{background:transparent;color:#fff}
