/* 全ページ共通のヘッダー（2026-09-20 人間「ロゴとメニューはレイアウトとして全ページ共通に」）。
   ページごとの色に頼らないよう、必要な値はこの中で閉じている。組み立ては assets/site-header.js。 */
.yh{ --yh-ink:#241f2e; --yh-ink2:#4e4759; --yh-muted:#8a8494; --yh-pink:#e2386c;
  --yh-glass:rgba(255,255,255,.55); --yh-glass-hi:rgba(255,255,255,.8); --yh-line:rgba(255,255,255,.7);
  --yh-blur:saturate(180%) blur(18px); --yh-shadow:0 8px 24px rgba(60,40,90,.10), inset 0 1px 0 rgba(255,255,255,.85);
  --yh-font:"M PLUS Rounded 1c","Hiragino Maru Gothic ProN","Hiragino Maru Gothic Pro","Yu Gothic","YuGothic",-apple-system,"Segoe UI",sans-serif;
  width:100%; max-width:920px; margin:0 auto; padding:14px 18px 0; display:flex; align-items:center; gap:11px; font-family:var(--yh-font); }
.yh *{ box-sizing:border-box; }
.yh .yh-menu{ position:relative; flex:none; }
.yh .yh-menu > button{ display:grid; place-items:center; width:36px; height:36px; font-size:15px; line-height:1; color:var(--yh-ink2); cursor:pointer;
  background:var(--yh-glass); -webkit-backdrop-filter:var(--yh-blur); backdrop-filter:var(--yh-blur); border:1px solid var(--yh-line); border-radius:12px; box-shadow:var(--yh-shadow); transition:background .15s, transform .12s; }
.yh .yh-menu > button:hover{ background:var(--yh-glass-hi); }
.yh .yh-menu > button[aria-expanded="true"]{ background:var(--yh-glass-hi); transform:scale(.94); }
.yh .yh-menu nav{ position:absolute; left:0; top:calc(100% + 8px); width:230px; z-index:60; display:grid; gap:2px; padding:8px; border-radius:18px;
  background:var(--yh-glass-hi); -webkit-backdrop-filter:var(--yh-blur); backdrop-filter:var(--yh-blur); border:1px solid var(--yh-line); box-shadow:var(--yh-shadow);
  animation:yh-pop .2s cubic-bezier(.2,.8,.2,1); }
@keyframes yh-pop{ from{ transform:translateY(6px) scale(.98); opacity:0; } }
.yh .yh-menu nav[hidden]{ display:none; }
.yh .yh-menu a{ display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--yh-ink); font-size:13px; font-weight:800; border-radius:12px; padding:9px 10px; transition:background .12s; }
.yh .yh-menu a:hover{ background:rgba(255,255,255,.75); }
.yh .yh-menu a[aria-current]{ background:rgba(255,92,138,.13); }
.yh .yh-menu a i{ font-style:normal; font-size:15px; width:20px; text-align:center; flex:none; }
.yh .yh-menu a small{ display:block; font-size:11px; font-weight:700; color:var(--yh-muted); margin-top:1px; }
.yh .yh-menu hr{ border:0; border-top:1px solid var(--yh-line); margin:5px 8px; }
.yh .yh-logo{ flex:none; font-family:"Dela Gothic One","M PLUS Rounded 1c","Hiragino Maru Gothic ProN",sans-serif; font-size:20px; letter-spacing:.02em; text-decoration:none; color:var(--yh-ink); }
.yh .yh-logo b{ color:#ff5c8a; }
.yh .yh-logo span{ font-size:12px; color:var(--yh-muted); font-family:var(--yh-font); font-weight:800; margin-left:5px; }
  background:var(--yh-glass); -webkit-backdrop-filter:var(--yh-blur); backdrop-filter:var(--yh-blur); border:1px solid var(--yh-line); border-radius:999px; padding:6px 14px; box-shadow:var(--yh-shadow); transition:background .15s; }
.yh .yh-extra{ margin-left:auto; }
.yh .yh-wait{ margin-left:auto; display:inline-flex; align-items:center; gap:8px; text-decoration:none; font-size:12.5px; font-weight:800; color:var(--yh-ink);
  background:var(--yh-glass); -webkit-backdrop-filter:var(--yh-blur); backdrop-filter:var(--yh-blur); border:1px solid var(--yh-line); border-radius:999px; padding:7px 14px; box-shadow:var(--yh-shadow); transition:background .15s; white-space:nowrap; }
.yh .yh-wait:hover{ background:var(--yh-glass-hi); }
.yh .yh-wait i{ font-style:normal; color:var(--yh-pink); }
.yh .yh-wait + .yh-extra{ margin-left:10px; }
@media (max-width:980px){
  .yh{ flex-wrap:wrap; padding-top:12px; }
}