.mobile-menu-toggle,
.mobile-menu-backdrop,
.mobile-menu-panel{display:none}

@media (max-width:1024px){
  html.mobile-menu-open,
  body.mobile-menu-open{overflow:hidden}

  .nav .nav-links,
  .nav .nav-cta,
  .nav .back,
  body>header .back{display:none!important}

  .mobile-menu-toggle{
    display:grid;
    width:48px;
    height:48px;
    min-width:48px;
    padding:0;
    margin-left:auto;
    border:1px solid rgba(255,255,255,.34);
    background:transparent;
    color:#fff;
    place-content:center;
    gap:5px;
    position:relative;
    z-index:102;
    grid-column:3;
  }
  body>header .mobile-menu-toggle{
    border-color:rgba(20,22,26,.26);
    color:#14161a;
  }
  .mobile-menu-toggle span{
    display:block;
    width:20px;
    height:1px;
    background:currentColor;
    transition:transform .25s ease,opacity .2s ease;
  }
  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

  .mobile-menu-backdrop{
    display:block;
    position:fixed;
    inset:var(--mobile-menu-top,82px) 0 0;
    z-index:98;
    border:0;
    background:rgba(8,19,24,.48);
    backdrop-filter:blur(3px);
    opacity:0;
    visibility:hidden;
    transition:opacity .25s ease,visibility .25s ease;
  }
  .mobile-menu-panel{
    display:flex;
    flex-direction:column;
    position:fixed;
    top:var(--mobile-menu-top,82px);
    right:0;
    bottom:0;
    z-index:99;
    width:min(100%,430px);
    padding:24px 22px max(28px,env(safe-area-inset-bottom));
    overflow-y:auto;
    overscroll-behavior:contain;
    background:#142f3a;
    color:#fff;
    transform:translateX(102%);
    visibility:hidden;
    transition:transform .3s cubic-bezier(.2,.8,.2,1),visibility .3s ease;
  }
  .mobile-menu-open .mobile-menu-backdrop{opacity:1;visibility:visible}
  .mobile-menu-open .mobile-menu-panel{transform:none;visibility:visible}

  .mobile-menu-kicker{
    margin-bottom:15px;
    font:400 10px/1.4 "JetBrains Mono",ui-monospace,monospace;
    letter-spacing:.22em;
    color:#a6cfda;
    text-transform:uppercase;
  }
  .mobile-menu-list{border-top:1px solid rgba(255,255,255,.16)}
  .mobile-menu-link{
    min-height:58px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:18px;
    border-bottom:1px solid rgba(255,255,255,.16);
    color:#fff;
    text-decoration:none;
  }
  .mobile-menu-link strong{
    display:block;
    font:400 17px/1.45 "Noto Serif JP",serif;
    letter-spacing:.02em;
  }
  .mobile-menu-link small{
    display:block;
    margin-top:2px;
    font:400 9px/1.4 "JetBrains Mono",ui-monospace,monospace;
    letter-spacing:.16em;
    color:rgba(255,255,255,.5);
    text-transform:uppercase;
  }
  .mobile-menu-link::after{
    content:"\2192";
    color:#a6cfda;
    font-size:19px;
    font-weight:300;
  }
  .mobile-menu-link[aria-current="page"] strong{color:#a6cfda}
  .mobile-menu-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:22px;
  }
  .mobile-menu-actions a{
    min-height:54px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:12px;
    border:1px solid rgba(166,207,218,.62);
    color:#fff;
    font:500 12px/1.4 "Noto Sans JP",sans-serif;
    letter-spacing:.04em;
    text-align:center;
  }
  .mobile-menu-actions .primary{background:#a6cfda;color:#142f3a;border-color:#a6cfda}
  .mobile-menu-direct{
    margin-top:auto;
    padding-top:24px;
    font:400 9px/1.7 "JetBrains Mono",ui-monospace,monospace;
    letter-spacing:.12em;
    color:rgba(255,255,255,.5);
    text-transform:uppercase;
  }
  .mobile-menu-toggle:focus-visible,
  .mobile-menu-panel a:focus-visible{
    outline:2px solid #a6cfda;
    outline-offset:3px;
  }
}

@media (max-width:430px){
  .mobile-menu-panel{width:100%;padding-inline:18px}
  .mobile-menu-actions{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){
  .mobile-menu-toggle span,
  .mobile-menu-backdrop,
  .mobile-menu-panel{transition:none!important}
}