/* Mobile navigation. Everything here is inside the media query, so desktop is untouched.
   Matches phones in portrait (narrow) and landscape (short + touch). */
.bar{display:none}
@media (max-width:48rem),(max-height:30rem) and (orientation:landscape) and (pointer:coarse){
 .has-bar .top,.has-bar footer.foot{display:none}
 .has-bar body{padding-bottom:calc(3.75rem + env(safe-area-inset-bottom,0px))}
 .has-bar .hero{padding-top:var(--s5)}.has-bar .ev-page,.has-bar .art-page{padding-top:var(--s4)}
 .bar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--footer);border-top:1px solid var(--rule);padding-bottom:env(safe-area-inset-bottom,0px)}
 .bar ul{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0;padding:0;list-style:none}
 .bar a,.bar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;width:100%;min-height:3.5rem;padding:.4rem .2rem;background:none;border:0;border-radius:0;color:var(--muted);font:800 .72rem/1 var(--display);text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
 .bar [aria-current]{color:var(--accent);box-shadow:inset 0 2px 0 var(--accent)}
 .bar :focus-visible{outline-offset:-4px}
 .bi{width:1.5rem;height:1.5rem}.bi.logo{width:2.2rem}
 .more[open]{display:flex;flex-direction:column;position:fixed;inset:auto 0 0 0;width:100%;max-width:none;max-height:calc(100dvh - env(safe-area-inset-top,0px) - .75rem);margin:0;padding:0;border:0;border-top:1px solid var(--rule);background:var(--base);color:var(--text);overflow:hidden}
 .more::backdrop{background:rgba(0,0,0,.6)}
 .more-head{display:flex;align-items:center;justify-content:space-between;padding:.25rem .5rem .25rem 1.25rem;border-bottom:1px solid var(--rule)}
 .more-head h2{margin:0;font:800 1.1rem/1 var(--display)}
 .more-x{display:grid;place-items:center;width:3rem;height:3rem;background:none;border:0;color:var(--text);cursor:pointer}
 .more-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-bottom:env(safe-area-inset-bottom,0px)}
 .more-nav{margin:0;padding:0 1.25rem;list-style:none}
 .more-nav a{display:flex;align-items:center;min-height:3.5rem;border-bottom:1px solid var(--rule);color:var(--text);text-decoration:none;font:800 1.25rem/1 var(--display)}
 .more-nav a[aria-current]{color:var(--accent)}
 .more-foot{background:none;padding:var(--s3) 1.25rem var(--s4)}
 html:has(dialog[open]){overflow:hidden}
}