html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 88px; }
[hidden] { display: none !important; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid #2B4560; outline-offset: 2px; }

/* スマホではヘッダーを低くする（2段に収める） */
@media (max-width: 640px) {
  html { scroll-padding-top: 112px; }
  header > div { padding: 6px 16px !important; }
  header nav { width: 100%; flex-wrap: nowrap !important; justify-content: space-between; gap: 0 8px !important; font-size: 13px !important; }
  header nav a { padding: 8px 0 !important; white-space: nowrap; }
  header nav a:last-child { padding: 8px 12px !important; }
}

/* 画像の拡大表示 */
.viewer { position: fixed; inset: 0; z-index: 100; background: rgba(16,15,14,.94); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 64px 16px 24px; box-sizing: border-box; overflow: hidden; touch-action: none; overscroll-behavior: contain; cursor: zoom-out; color: #fff; text-align: center; font-family: 'Noto Sans JP', sans-serif; }
.viewer-close { position: absolute; top: 12px; right: 12px; z-index: 2; width: 48px; height: 48px; border: 0; background: transparent; color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.viewer-img { display: block; position: relative; z-index: 1; max-width: min(1400px, 100%); max-height: 66vh; object-fit: contain; transform-origin: center; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; cursor: zoom-in; }
.viewer-title { margin: 0; font-family: 'Shippori Mincho', serif; font-weight: 600; }
.viewer-scope { margin: 0; font-size: 14px; color: #CFCBC3; }
.viewer-hint { margin: 0; font-size: 12px; color: #A9A397; }
.viewer-thumbs { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.viewer-thumb { padding: 0; width: 72px; height: 54px; background: #2A2A28; cursor: pointer; border: 2px solid transparent; }
.viewer-thumb[aria-current="true"] { border-color: #fff; }
.viewer-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }