/* ナビ共通の CSS（全ページがこの 1 本を読む）。ナビの HTML の元は partials/nav.html（node scripts/build_nav.mjs で全ページへ書き出す）。
   右側は「チケット」「Windows版」「Mac版」「ハンバーガー」の 4 つに固定（全ページ同じ形）。
   そのほかのリンクはハンバーガーの中。スマホでは 1 行に収める（折り返さない・ボタンを隠さない）。
   ★ 各ページの <style> の「後ろ」で読む（</head> の直前）＝ページ側の `nav { … }` 等に対して、従来どおり後勝ちにするため。
   ★ ここを直すと全ページのナビが変わる。ページ固有の調整は各ページの <style> に書かない（足すなら理由つきで）。 */
.nav-menu summary { list-style: none; }
.nav-menu summary::-webkit-details-marker { display: none; }
.nav-menu[open] summary span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav-menu[open] summary span:nth-child(2) { opacity: 0; }
.nav-menu[open] summary span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
.nav-menu summary span { transition: transform 0.2s ease, opacity 0.2s ease; }
.nav-menu > div { max-height: calc(100vh - 96px); overflow-y: auto; }
.nav-menu > div a:hover { background: color-mix(in srgb, #68b7a1 12%, transparent); }
.nav-menu > div a + a { border-top: 1px solid color-mix(in srgb, #2b2a26 10%, transparent); }
@media (max-width: 720px) {
  nav[data-screen-label="ナビ"] { gap: 16px !important; padding-left: 20px !important; padding-right: 20px !important; }
  nav[data-screen-label="ナビ"] > .nav-right { flex-wrap: nowrap !important; gap: 8px !important; }
  nav[data-screen-label="ナビ"] a { white-space: nowrap; font-size: 12px !important; }
  nav[data-screen-label="ナビ"] .nav-ticket { letter-spacing: 0.04em !important; }
  nav[data-screen-label="ナビ"] .nav-btn { padding: 7px 9px !important; letter-spacing: 0.02em !important; }
  .nav-menu summary { width: 34px !important; padding: 0 6px !important; }
}