/* Logo-triggered dropdown, shared by all pages. Native details supports touch
   and keyboard even if JavaScript is unavailable. */
/* Lift the containing stack too: the CRT layers sit at z-index 90 and 91. */
.field-header:has(.site-navigation[open]) { z-index:120; }
.site-navigation {
  position:relative;
  justify-self:start;
  flex-shrink:0;
  z-index:120;
  color:#fff;
}
.site-navigation summary {
  display:inline-flex;
  min-height:44px;
  align-items:center;
  cursor:pointer;
  list-style:none;
  user-select:none;
  touch-action:manipulation;
}
.site-navigation summary::-webkit-details-marker { display:none; }
.site-navigation summary:focus-visible,.site-navigation nav a:focus-visible { outline:2px solid #9aff69; outline-offset:3px; }
.site-navigation nav {
  position:absolute;
  top:100%;
  left:0;
  display:flex;
  flex-direction:column;
  width:max-content;
  max-width:calc(100vw - 64px);
  max-height:calc(100dvh - 160px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:4px 6px 6px 0;
  background:transparent;
  border:0;
  font:400 22px/1.2 'VT323','Courier New',monospace;
  text-transform:uppercase;
  letter-spacing:.04em;
  text-shadow:0 1px 4px #000,0 0 12px #000;
}
.site-navigation:not([open]) nav { display:none; }
.site-navigation[open] nav { animation:navigation-reveal .4s cubic-bezier(.22,1,.36,1) both; }
.site-navigation nav a { display:flex; align-items:center; min-height:44px; padding:10px 0; color:#fff; text-decoration:none; transition:color .2s ease; }
.site-navigation nav a:hover,.site-navigation nav a:focus-visible,.site-navigation nav a[aria-current=page] { color:#9aff69; background:transparent; text-decoration:none; }
@keyframes navigation-reveal {
  from { opacity:0; clip-path:inset(0 0 100% 0); transform:translateY(-6px); }
  to { opacity:1; clip-path:inset(0 0 0 0); transform:translateY(0); }
}
.site-navigation[open] :is(.field-logo,.brand) { letter-spacing:-.04em; }
.site-navigation[open] :is(.field-logo-reveal,.brand-reveal) { max-width:3em; opacity:1; }
.site-navigation[open] :is(.field-logo-ending,.brand-ending) { max-width:1em; }
.site-navigation[open] :is(.field-logo-dot,.brand-dot) { max-width:0; opacity:0; }
@media(max-width:700px), (pointer:coarse) and (max-height:500px) {
  .field-header>.site-navigation { grid-row:2; grid-column:1; }
  .site-navigation nav { max-width:calc(100vw - 32px); font-size:20px; }
}
@media(pointer:coarse) and (max-height:500px) and (orientation:landscape) {
  .field-header>.site-navigation { grid-row:1; }
  .site-navigation nav { max-height:calc(100dvh - 90px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)); }
}
/* Touch browsers can retain :hover after a tap; the menu state wins. */
@media(hover:none), (pointer:coarse) {
  .site-navigation:not([open]) :is(.field-logo,.brand) { letter-spacing:-.12em; }
  .site-navigation:not([open]) :is(.field-logo-reveal,.brand-reveal) { max-width:0; opacity:0; }
  .site-navigation:not([open]) :is(.field-logo-dot,.brand-dot) { max-width:.4em; opacity:1; }
}
@media(prefers-reduced-motion:reduce) {
  .site-navigation[open] nav { animation:none; }
  .site-navigation nav a { transition:none; }
}
@media print { .site-navigation { display:none; } }
