/* No desktop layout changes. No added motion, including with reduced motion. */
.mobile-menu-trigger { display: none; }
.mobile-navigation:not([open]) { display: none; }
.hero-mobile-label { display: none; }
.about-links { display: flex; padding: 10px 0; font: 700 14px/1.5 Mono, monospace; }
.about-links a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-underline-offset: 5px; }
@media (max-width: 700px) {
  .site-paper.mobile-navigation-ready > header > nav { display: none; }
  .mobile-navigation-ready .mobile-menu-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-left: auto;
    min-height: 48px;
    padding: 8px 12px;
    border: 2px solid #101010;
    background: transparent;
    color: #101010;
    font: 800 14px/1 ui-monospace, monospace;
    text-transform: uppercase;
    cursor: pointer;
  }
  .mobile-menu-bars { display: grid; gap: 5px; width: 23px; }
  .mobile-menu-bars i { display: block; height: 2px; background: currentColor; }
  .reference-intro .hero-desktop-label { display: none; }
  .reference-intro .hero-mobile-label { display: inline; }
  .mobile-navigation-ready .reference-intro .intro-actions { display: flex; flex-wrap: wrap; gap: 12px; }
  .mobile-navigation-ready .reference-intro .intro-actions > a { min-height: 48px; padding: 12px 16px; gap: 10px; }
  .mobile-navigation-ready .reference-intro .intro-actions > .intro-vibe { background: #ff56d8; color: #101010; }
  .mobile-navigation-ready .reference-intro .intro-quick-links { display: none; }
  .mobile-navigation-ready .trio-kicker > a { display: none; }
  .mobile-navigation-ready .trio-kicker > span { max-width: none; }
  .mobile-navigation-open { overflow: hidden; }
  .mobile-navigation {
    position: fixed;
    inset: 0 0 0 auto;
    box-sizing: border-box;
    margin: 0;
    width: min(88vw, 360px);
    max-width: none;
    height: 100%;
    height: 100dvh;
    max-height: none;
    padding: max(22px, env(safe-area-inset-top)) 22px max(24px, env(safe-area-inset-bottom));
    border: 0;
    border-left: 5px solid #ff4fa6;
    background: #101010;
    background-image: radial-gradient(#ffffff17 .7px, transparent 1px);
    background-size: 5px 7px;
    color: #fff;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .mobile-navigation::backdrop { background: #0009; }
  .mobile-navigation-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 28px; }
  .mobile-navigation-top h2 { margin: 0; font: 800 30px/1 MadhouseBlock, Impact, sans-serif; text-transform: uppercase; color: #ffea00; }
  .mobile-menu-close { display: grid; place-items: center; width: 48px; min-height: 48px; padding: 0; border: 2px solid #fff; background: transparent; color: #fff; font: 400 34px/1 Arial, sans-serif; cursor: pointer; }
  .mobile-primary-links { display: grid; gap: 3px; }
  .mobile-primary-links a { display: flex; align-items: center; justify-content: space-between; min-height: 56px; padding: 6px 0; color: #fff; text-decoration: none; font: 800 37px/1.05 MadhouseBlock, Impact, sans-serif; text-transform: uppercase; border-bottom: 1px solid #ffffff50; }
  .mobile-primary-links a[aria-current="page"] { color: #ffea00; }
  .mobile-primary-links a::after { content: '↗'; font: 400 25px/1 Arial, sans-serif; color: #ff4fa6; }
  .mobile-utility-group { margin-top: 30px; }
  .mobile-utility-group > p { margin: 0 0 8px; color: #ffea00; font: 700 12px/1.4 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .08em; }
  .mobile-utility-links { display: grid; }
  .mobile-utility-links a { display: flex; align-items: center; min-height: 48px; padding: 5px 0; color: #fff; font: 700 17px/1.35 ui-monospace, monospace; text-decoration: none; }
  .mobile-navigation a:hover { color: #ff4fa6; }
  .mobile-menu-trigger:focus-visible,
  .mobile-navigation :focus-visible { outline: 3px solid #497cff; outline-offset: 4px; }
}