/* style.css の後に読み込まれる上書き用スタイル */

/* ===== Tailwind preflight の中和（FIX の destyle 基準へ戻す） =====
   globals.css（管理画面用 Tailwind）の preflight が公開ページにも効いてしまい、
   FIX 静的サイトとの computed style 差を生むため、FIX の既定値へ揃える。
   - antialiased: グリフの太さが FIX と変わるため auto へ
   - img/svg: preflight の display:block / vertical-align:middle を destyle 既定へ */
html {
  tab-size: 8;
}

body {
  -webkit-font-smoothing: auto;
}

img {
  display: inline;
}

svg {
  vertical-align: baseline;
}

/* TOP の地図エリアボタンに明確なホバー状態を付与 */
.p-kv__area {
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

.p-kv__area:hover,
.p-kv__area:focus-visible {
  background-color: #bc002d;
  color: #fff;
  border-color: #bc002d;
  box-shadow: 0 6px 16px rgba(188, 0, 45, 0.28);
  transform: translateY(-1px);
}

.p-kv__area:hover::after,
.p-kv__area:focus-visible::after {
  color: #fff;
}

.p-kv__area:focus-visible {
  outline: 2px solid #185fa5;
  outline-offset: 3px;
}

/* スポット検索（ジャンルタグ）のホバーをより目立たせる */
.p-spot__tags .p-spot__tag {
  cursor: pointer;
}

.p-spot__tags .p-spot__tag:hover,
.p-spot__tags .p-spot__tag:focus-visible {
  background-color: #bc002d;
  color: #fff;
  border-color: #bc002d;
}

/* GSAPはJS側のfrom()で初期状態を設定する。CSSで先にopacity:0へ隠さないため、
   CSS/JSチャンクが遅延・失敗してもヒーローや主要カードが空白にならない。 */

/* Cookie 同意モーダル (画面下部固定) */
.c-cookie-consent {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 200;
  background: rgba(26, 26, 24, 0.96);
  color: #fff;
  box-shadow: 0 -6px 18px rgba(0, 0, 0, 0.18);
}

.c-cookie-consent__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 18px 24px;
  display: flex;
  align-items: center;
  gap: 24px;
}

.c-cookie-consent__body {
  flex: 1;
  min-width: 0;
}

.c-cookie-consent__title {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 4px;
}

.c-cookie-consent__text {
  font-size: 12px;
  line-height: 1.6;
  color: #d9d4c5;
}

.c-cookie-consent__text a {
  color: #f4cf5c;
  text-decoration: underline;
}

.c-cookie-consent__actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}

.c-cookie-consent__btn {
  padding: 10px 18px;
  border-radius: 999px;
  font-size: 13px;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.c-cookie-consent__btn--ghost {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.5);
}

.c-cookie-consent__btn--ghost:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: #fff;
}

.c-cookie-consent__btn--primary {
  background: #bc002d;
  color: #fff;
  border: 1px solid #bc002d;
}

.c-cookie-consent__btn--primary:hover {
  background: #98001e;
  border-color: #98001e;
}

@media (max-width: 640px) {
  .c-cookie-consent__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding: 14px 16px;
  }
  .c-cookie-consent__actions {
    justify-content: flex-end;
  }
}

/* おすすめ名所カード / スポットカードもクリック可能なので pointer に揃える */
.p-recommend-card,
.p-spot-card {
  cursor: pointer;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.p-recommend-card:hover,
.p-spot-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

/* ===== 名所カードのフレームカラー（/points-role の「フレームカラー」凡例と対応） =====
   凡例（p-points-role__frame-card--{mod}）で説明しているだけで実カードに未適用だったため、
   同じ6段階のptしきい値・配色を名所カード本体の枠線として反映する。 */
.p-spot-card--frame-natural,
.p-spot-card--frame-blue,
.p-spot-card--frame-green,
.p-spot-card--frame-gold,
.p-spot-card--frame-coral,
.p-spot-card--frame-rainbow {
  /* ランクごとの色が一目で分かるよう太めにする（2px → 4px） */
  border-width: 4px;
  border-style: solid;
}

.p-spot-card--frame-natural {
  border-color: #d3cfc6;
}

.p-spot-card--frame-blue {
  border-color: #82b0e0;
}

.p-spot-card--frame-green {
  border-color: #8fc856;
}

.p-spot-card--frame-gold {
  border-color: #d4a820;
}

.p-spot-card--frame-coral {
  border-color: #d85a30;
}

.p-spot-card--frame-rainbow {
  border-color: transparent;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, #f0997b 0%, #e8ce7a 25%, #c0dd97 50%, #b5d4f4 75%, #e3beff 100%)
      border-box;
}

/* ===== プロフィール画像（アバター） ===== */
/* アバター枠（円形・固定サイズ）にフィットさせる共通画像スタイル */
.p-account-settings__avatar-img,
.p-mypage-side__avatar-img,
.p-mypage-table__avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  display: block;
}

/* スポット詳細の口コミ・ギャラリーポップアップの投稿者アバター:
   プロフィール画像設定時は頭文字の代わりに画像を表示 */
.p-spot-review-avatar,
.p-gallery-popup__avatar {
  overflow: hidden;
}

.p-spot-review-avatar__img,
.p-gallery-popup__avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  display: block;
}

.p-pref-gallery__empty {
  margin-top: 20px;
  padding: 32px 16px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  background: #fff;
  color: #73726c;
  font-size: 14px;
  text-align: center;
}

/* ランキングテーブルのユーザーバッジ: プロフィール画像設定時は頭文字の代わりに画像を表示 */
.c-table--users__badge {
  overflow: hidden;
}

.c-table--users__badge-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  display: block;
}

/* ヘッダーのアカウントボタン: プロフィール画像設定時は頭文字の代わりに画像を表示 */
.l-header__avatar {
  overflow: hidden;
  padding: 0;
}

.l-header__avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  display: block;
}

/* アバタートリミングモーダル */
.p-avatar-crop__overlay {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(20, 18, 14, 0.6);
}

.p-avatar-crop__panel {
  width: 100%;
  max-width: 420px;
  padding: 20px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.p-avatar-crop__title {
  margin: 0 0 16px;
  font-size: 16px;
  font-weight: 600;
  color: #1a1a18;
}

.p-avatar-crop__stage {
  position: relative;
  width: 100%;
  height: 280px;
  margin-bottom: 16px;
  background: #1a1a18;
  border-radius: 8px;
  overflow: hidden;
}

.p-avatar-crop__controls {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.p-avatar-crop__zoom-label {
  flex-shrink: 0;
  font-size: 13px;
  color: #73726c;
}

.p-avatar-crop__zoom {
  flex: 1;
  accent-color: #5a9e2e;
}

.p-avatar-crop__error {
  margin: 0 0 12px;
  font-size: 13px;
  color: #98001e;
}

.p-avatar-crop__actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

/* キャンセル（非プライマリ）は枠線付きのアウトラインボタンにする。
   ベースの .p-account-settings__btn は border が透明のため、モーダル内では明示する。 */
.p-avatar-crop__actions .p-account-settings__btn:not(.p-account-settings__btn--primary) {
  border-color: rgba(0, 0, 0, 0.25);
  background: #fff;
  color: #73726c;
}

/* スポット検索ページ: 並び順ドロップダウンと「すべて／検索結果」ヘッダが詰まって見える問題を修正。
   prefecture 詳細由来のベージュ帯を外し、ヘッダとの間に余白を確保する。 */
/* ===== 名所検索フォーム：名所名キーワード欄（トップ「名所を探す」） =====
   style.css の p-search__form は「都道府県 / ジャンル / ボタン」の3列前提で
   nth-child による区切り線・余白を持つため、キーワード欄を先頭に足した場合の
   4列レイアウトと区切り位置をここで上書きする。 */
.p-search__form .p-search__input {
  box-sizing: border-box;
  width: 100%;
  min-height: 37px;
  padding: 8px 13px 9px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  background: #fff;
  color: #1a1a18;
  font-size: 13px;
  font-weight: 400;
  line-height: 20.8px;
  appearance: none;
  -webkit-appearance: none;
}

.p-search__form .p-search__input::placeholder {
  color: #73726c;
}

.p-search__form .p-search__input:focus-visible {
  outline: 2px solid #185fa5;
  outline-offset: 1px;
}

@media (min-width: 769px) {
  .p-search__form--with-keyword {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr) auto;
  }

  .p-search__form--with-keyword .p-search__field:nth-child(2) {
    padding-right: 14px;
    border-right: 1px solid rgba(0, 0, 0, 0.08);
  }

  .p-search__form--with-keyword .p-search__field:nth-child(3) {
    padding-left: 14px;
  }
}

@media (max-width: 768px) {
  .p-search__form .p-search__input {
    height: 37px;
    padding: 11px 12px;
    border-color: #d4d4d4;
    border-radius: 6px;
    color: #222;
    line-height: 15px;
  }

  .p-search__form--with-keyword .p-search__field:nth-child(2) {
    margin-bottom: 13px;
  }

  .p-search__form--with-keyword .p-search__field:nth-child(3) {
    margin-bottom: 25px;
  }
}

.p-search-page .p-pref-sort-bar {
  background: transparent;
  padding-top: 8px;
  padding-bottom: 16px;
}

/* 名所カード一覧の画像はカード幅を変えず、画像の高さだけを16:9へ揃える。 */
.p-spot-card__img,
.p-search-page .p-spot-card__img,
.p-recommend__grid .p-spot-card__img {
  aspect-ratio: 16 / 9;
  height: auto;
}

/* ===== 訪問地: 空状態 / 読み込み中の配置 =====
   .p-visited__columns は Grid（≥1101px）で .p-visited__primary は display:contents のため、
   grid-area 未指定の子要素は grid-template-areas "title ." の右上空セル（統計列の上）へ
   自動配置されてしまう。読み込み中・空状態をメインカラム（1列目）へ明示配置して回り込みを防ぐ。
   ≤1100px では .p-visited__columns が display:block のため grid-column は無視され影響しない。 */
.p-visited__placeholder {
  grid-column: 1;
}

p.p-visited__placeholder {
  padding: 32px 0;
  text-align: center;
  color: #73726c;
}

.p-visited__genre-warning {
  grid-column: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  margin-bottom: 16px;
  padding: 12px 16px;
  border: 1px solid rgba(163, 45, 45, 0.25);
  border-radius: 8px;
  background: #fcebeb;
  color: #7a2020;
  font-size: 13px;
}

.p-visited__genre-warning button {
  text-decoration: underline;
  font-weight: 500;
}

.p-visited__genre-warning button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.p-visited__genre-toggle:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

/* ===== マイページ共通: 空状態カード =====
   p-mypage-empty / __text は style.css に定義が無いアプリ独自クラス。
   訪問地・投稿済み・TOP など各 mypage ページの空状態を意図したカードとして表示する。 */
.p-mypage-empty {
  padding: 40px 24px;
  text-align: center;
  background: #fff;
  border: 1px solid rgba(47, 58, 67, 0.12);
  border-radius: 12px;
}

.p-mypage-empty__text {
  margin: 0;
  font-size: 14px;
  line-height: 1.9;
  color: #73726c;
}

/* ===== 訪問地・投稿済み共通: フィルタのネイティブ select/date をセルに合わせる =====
   FIX のグリッドは .c-select-v4--filter / .c-date-picker / .p-visited__filters-genre の
   ラッパーをセルに配置する。中のネイティブ要素を 100% 幅・31px 高に揃え、FIX の見た目に合わせる。 */
.p-visited__filters .c-select-v4--filter > select.p-visited__select {
  width: 100%;
  height: 31px;
}

.p-visited__filters .c-date-picker > input.p-visited__select--date {
  width: 100%;
  height: 31px;
}

.p-visited__filters-genre > select.p-visited__select {
  width: 100%;
  height: 31px;
}

/* ===== ヘッダー アカウントメニュー =====
   ログイン時のアバター押下で「マイページ / ログアウト」を開く。
   ハンバーガー/ドロワーは PC(>=1025px) で display:none のため、
   全画面幅でログアウト導線を確保する目的でアバターをトグル化している。 */
.l-header__account {
  position: relative;
  display: inline-flex;
}

.l-header__account .l-header__avatar {
  cursor: pointer;
  padding: 0;
}

.l-header__account-scrim {
  position: fixed;
  inset: 0;
  z-index: 140;
  border: 0;
  padding: 0;
  background: transparent;
  cursor: default;
}

.l-header__account-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 160;
  display: flex;
  flex-direction: column;
  min-width: 168px;
  padding: 6px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.l-header__account-item {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 10px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #1a1a18;
  font-size: 13px;
  line-height: 1.4;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.l-header__account-item:hover {
  background: #f5f4f0;
}

.l-header__account-item--logout {
  color: #b83228;
}

/* ===== 世界遺産への挑戦（#world-heritage-challenge）— 納品物 tabifuda-site の差分を移植 ===== */
/* セレクタは全て #world-heritage-challenge スコープのため既存スタイルに影響しない。 */
#pt-system,#frame-color,#challenge-ranks,#mitsudai,#category-collection,#world-heritage-challenge,#genre-count{scroll-margin-top:72px}
#world-heritage-challenge{gap:56px;overflow-x:visible}
#world-heritage-challenge .p-points-role__wh-block .p-points-role__section-head{gap:4px;min-height:71px;padding-bottom:10px;box-sizing:border-box}
#world-heritage-challenge .p-points-role__wh-block .p-points-role__section-title{font-size:2rem;line-height:1.6}
#world-heritage-challenge .p-points-role__wh-block .p-points-role__section-sub{font-size:1.2rem;line-height:1.6}
#world-heritage-challenge .p-points-role__wh-list-head-cell:nth-child(3),#world-heritage-challenge .p-points-role__wh-list-count{text-align:center}
#world-heritage-challenge .p-points-role__wh-list-head-cell:last-child,#world-heritage-challenge .p-points-role__wh-list-pt{text-align:right}
@media(min-width: 1025px){#world-heritage-challenge{width:100vw;max-width:none;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}#world-heritage-challenge>.p-points-role__wh-block{width:min(1120px,100% - 3.2rem);max-width:1120px;margin-inline:auto;box-sizing:border-box}}
.p-points-role__yaku-table,.p-points-role__mitsudai-table,.p-points-role__wh-list{width:100%;border-collapse:separate;border-spacing:0}
.p-points-role__yaku-table th,.p-points-role__yaku-table td,.p-points-role__mitsudai-table th,.p-points-role__mitsudai-table td,.p-points-role__wh-list th,.p-points-role__wh-list td{font-weight:inherit;text-align:inherit;vertical-align:top}
.p-points-role__yaku-table th:not(.p-points-role__yaku-rank),.p-points-role__yaku-table td:not(.p-points-role__yaku-rank),.p-points-role__mitsudai-table th:not(.p-points-role__yaku-rank),.p-points-role__mitsudai-table td:not(.p-points-role__yaku-rank),.p-points-role__wh-list th:not(.p-points-role__yaku-rank),.p-points-role__wh-list td:not(.p-points-role__yaku-rank){display:block;padding:0;border:none;background:rgba(0,0,0,0)}
.p-points-role__wh-hero{position:relative;min-height:318px;width:100%;overflow:hidden;background:#fff}
.p-points-role__wh-hero-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.p-points-role__wh-hero-bg picture{display:block;width:100%;height:100%}
.p-points-role__wh-hero-bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.p-points-role__wh-hero-overlay{position:absolute;inset:0;z-index:1;background:hsla(0,0%,100%,.9)}
.p-points-role__wh-hero-inner{position:relative;z-index:2;display:flex;flex-direction:column;gap:0;width:min(1120px,100% - 3.2rem);max-width:1120px;min-height:318px;margin-inline:auto;padding:42px 0;box-sizing:border-box}
.p-points-role__wh-eyebrow{display:flex;align-items:center;gap:7px;margin:0 0 9px;padding-left:0;font-family:"Shippori Mincho",serif;font-size:1.4rem;font-weight:700;line-height:1.2571428571;letter-spacing:.0942857143em;color:#bc002d}
.p-points-role__wh-eyebrow::before{content:"";display:block;width:18px;height:1.5px;background:#bc002d;flex-shrink:0}
.p-points-role__wh-hero-title{margin:0 0 10px;font-size:3rem;font-weight:500;line-height:1.6;color:#1a1a18}
.p-points-role__wh-hero-desc{max-width:700px;margin:0 0 11px;font-size:1.4rem;line-height:1.85;color:#73726c}
.p-points-role__wh-hero-stats{display:flex;flex-wrap:wrap;gap:20px;margin:0;padding-top:11px}
.p-points-role__wh-hstat{display:flex;flex-direction:column;gap:2px;padding:11px 21px;background:rgba(130,119,100,.95);border:1px solid rgba(0,0,0,.08);border-radius:8px}
.p-points-role__wh-hstat-num{margin:0;font-size:2.2rem;font-weight:500;line-height:1.6;color:#fff;text-align:center}
.p-points-role__wh-hstat-lbl{margin:0;font-size:1rem;line-height:1.6;color:#fff;text-align:center;white-space:nowrap}
.p-points-role__wh-block{display:flex;flex-direction:column;gap:22px}
.p-points-role__wh-challenge-grid{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:16px}
.p-points-role__wh-ch-card{display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px}
.p-points-role__wh-ch-head{display:flex;align-items:center;gap:10px;padding:14px 18px 15px;border-bottom:1px solid rgba(0,0,0,.08)}
.p-points-role__wh-ch-num{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:28px;height:28px;font-size:1.3rem;font-weight:500;line-height:1.6;color:#fff;background:#bc002d;border-radius:14px}
.p-points-role__wh-ch-title{margin:0;font-size:1.4rem;font-weight:500;line-height:1.6;color:#1a1a18}
.p-points-role__wh-ch-rank{margin-left:auto;padding:3px 11px;font-size:1rem;font-weight:500;line-height:1.6;color:#73726c;background:#f5f4f0;border:1px solid rgba(0,0,0,.15);border-radius:10px;white-space:nowrap}
.p-points-role__wh-ch-card--goko .p-points-role__wh-ch-head .p-points-role__yaku-rank{margin-left:auto}
.p-points-role__wh-ch-body{display:flex;flex-direction:column;gap:8px;padding:15px 18px 16px}
.p-points-role__wh-ch-cond{margin:0;font-size:1.3rem;font-weight:500;line-height:1.6;color:#1a1a18}
.p-points-role__wh-ch-cond strong{font-weight:700;color:#bc002d}
.p-points-role__wh-ch-note{margin:0;font-size:1.2rem;line-height:1.7;color:#73726c}
.p-points-role__wh-ch-ex{margin:0;padding:9px 10px 8px;font-size:1.1rem;line-height:1.6;color:#a8a79f;background:#f5f4f0;border-radius:4px}
.p-points-role__wh-ch-ex strong{font-weight:700;color:inherit}
.p-points-role__wh-rule-list{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:16px}
.p-points-role__wh-rule-item{display:flex;align-items:center;gap:31px;padding:21px 29px;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:8px}
.p-points-role__wh-rule-item--warn{grid-column:1/-1;align-items:flex-start;padding:21px 31px;background:#ffecf1;border-color:#bc002d}
.p-points-role__wh-rule-icon{flex-shrink:0;display:block;width:65px;height:65px}
.p-points-role__wh-rule-icon img{display:block;width:100%;height:100%}
.p-points-role__wh-rule-text{min-width:0}
.p-points-role__wh-rule-title{margin:0 0 0;font-size:1.3rem;font-weight:500;line-height:1.75;color:#1a1a18}
.p-points-role__wh-rule-body{margin:0;font-size:1.3rem;font-weight:400;line-height:1.75;color:#73726c}
.p-points-role__wh-rule-warn{margin:0;font-size:1.3rem;line-height:1.75}
.p-points-role__wh-rule-warn-label{font-weight:500;color:#bc002d}
.p-points-role__wh-rule-warn-body{font-weight:400;color:#73726c}
.p-points-role__wh-type{display:inline-flex;align-items:center;justify-content:center;padding:1px 8px;font-size:.9rem;font-weight:500;line-height:1.6;border-radius:3px;white-space:nowrap}
.p-points-role__wh-type--culture{color:#fff;background:#7a540f;border:1px solid #7a540f}
.p-points-role__wh-type--nature{color:#fff;background:#849f5e;border:1px solid #849f5e}
.p-points-role__wh-type--mixed{color:#fff;background:#849f5e;border:1px solid #849f5e}
.p-points-role__wh-list-wrap{overflow-x:auto}
.p-points-role__wh-list{border:1px solid rgba(0,0,0,.08);border-radius:14px;overflow:hidden;font-size:1.2rem;line-height:1.6;width:100%;background:#fff}
.p-points-role__wh-list-head,.p-points-role__wh-list-row{display:grid;grid-template-columns:100px minmax(0, 1fr) 72px 100px 100px;align-items:center;gap:10px;padding:11px 18px 12px}
.p-points-role__wh-list-head{min-height:37px;background:#f5f4f0;border-bottom:1px solid rgba(0,0,0,.08);font-size:1.1rem;font-weight:500;line-height:1.6;color:#a8a79f;box-sizing:border-box}
.p-points-role__wh-list-row{min-height:45px;border-bottom:1px solid rgba(0,0,0,.08);background:#fff;box-sizing:border-box}
.p-points-role__wh-list-row:nth-child(odd){background:rgba(0,0,0,.02)}
.p-points-role__wh-list-row:last-child{border-bottom:none}
.p-points-role__wh-list-name{font-size:1.2rem;font-weight:500;line-height:1.6;color:#1a1a18}
.p-points-role__wh-list-count{font-size:1.4rem;font-weight:500;line-height:1.6;color:#0c447c;text-align:center}
.p-points-role__wh-list-pt{font-size:1.2rem;font-weight:500;line-height:1.6;color:#633806;text-align:right;white-space:nowrap}
.p-points-role__wh-rank-wrap{overflow:hidden;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px 14px 0 0}
.p-points-role__wh-rank-head{display:grid;grid-template-columns:120px 90px 90px minmax(0, 1fr);align-items:start;gap:12px;min-height:37px;padding:9px 18px 10px;background:#f5f4f0;border-bottom:1px solid rgba(0,0,0,.08);font-size:1.1rem;font-weight:500;line-height:1.6;color:#a8a79f;box-sizing:border-box}
.p-points-role__wh-rank-head .p-points-role__wh-rank-head-bar{display:block;width:100%;min-height:1px;visibility:hidden}
.p-points-role__wh-rank-row{display:grid;grid-template-columns:120px 90px 90px minmax(0, 1fr);align-items:center;gap:12px;min-height:80px;padding:10px 18px 10px 21px;border-bottom:1px solid rgba(0,0,0,0);border-left:3px solid rgba(0,0,0,0);box-sizing:border-box}
.p-points-role__wh-rank-row:first-of-type{min-height:80px;padding-left:18px}
.p-points-role__wh-rank-row--shiko{border-left-color:#bc002d;border-bottom-color:#bc002d}
.p-points-role__wh-rank-row--ameshiko{min-height:85px;padding-top:12px;padding-bottom:13px;border-left-color:#c8102e;border-bottom-color:#c8102e}
.p-points-role__wh-rank-row--sanko{min-height:85px;padding-top:10px;padding-bottom:11px;border-left-color:#185fa5;border-bottom-color:#185fa5}
.p-points-role__wh-rank-row--inoshikacho{min-height:85px;padding-top:10px;padding-bottom:11px;border-left-color:#27500a;border-bottom-color:#27500a}
.p-points-role__wh-rank-row--akatan{min-height:85px;padding-top:10px;padding-bottom:11px;border-left-color:rgba(0,0,0,.26);border-bottom-color:rgba(0,0,0,.26)}
.p-points-role__wh-rank-bar{display:block;width:82px;height:30px}
.p-points-role__wh-rank-bar img{display:block;width:100%;height:100%;object-fit:contain;object-position:left center}
.p-points-role__wh-rank-row--sanko .p-points-role__wh-rank-bar{width:60px}
.p-points-role__wh-rank-row--inoshikacho .p-points-role__wh-rank-bar,.p-points-role__wh-rank-row--akatan .p-points-role__wh-rank-bar{width:61px}
.p-points-role__wh-rank-pt{font-size:1.14rem;font-weight:500;line-height:1.6842105263;color:#633806}
.p-points-role__wh-rank-desc{margin:0;font-size:1.2rem;line-height:1.6;color:#73726c}
.p-points-role__wh-acc-list{display:flex;flex-direction:column;gap:8px}
.p-points-role__wh-acc{overflow:hidden;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:8px}
.p-points-role__wh-acc[open] .p-points-role__wh-acc-toggle::before{transform:rotate(180deg)}
.p-points-role__wh-acc-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px;cursor:pointer;list-style:none;box-sizing:border-box}
.p-points-role__wh-acc-head::-webkit-details-marker{display:none}
.p-points-role__wh-acc-head-l{display:flex;flex:1 1 auto;align-items:center;gap:20px;min-width:0}
.p-points-role__wh-acc-head-r{display:flex;flex-shrink:0;align-items:center;gap:20px}
.p-points-role__wh-acc-name{font-size:1.3rem;font-weight:500;line-height:1.6;color:#1a1a18}
.p-points-role__wh-acc-count{font-size:1.1rem;font-weight:400;line-height:1.6;color:#a8a79f;white-space:nowrap}
.p-points-role__wh-acc-pt{font-size:1.16rem;font-weight:500;line-height:1.6551724138;color:#633806;white-space:nowrap}
.p-points-role__wh-acc-toggle{display:flex;align-items:center;justify-content:center;width:14px;height:14px}
.p-points-role__wh-acc-toggle::before{content:"";display:block;width:10px;height:6px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23a8a79f' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:contain;transition:transform .2s ease}
.p-points-role__wh-acc-panel{border-top:1px solid rgba(0,0,0,.08)}
.p-points-role__wh-asset-table{width:100%;table-layout:fixed;border-collapse:collapse;font-size:1.2rem;line-height:1.6}
.p-points-role__wh-asset-head{background:#f5f4f0}
.p-points-role__wh-asset-th{padding:8px 14px 9px;border-bottom:1px solid rgba(0,0,0,.08);font-size:1rem;font-weight:500;line-height:normal;color:#a8a79f;text-align:left;vertical-align:top}
.p-points-role__wh-asset-th--no{width:78px;text-align:center}
.p-points-role__wh-asset-th--pref,.p-points-role__wh-asset-th--city{width:150px}
.p-points-role__wh-asset-row{background:#fff}
.p-points-role__wh-asset-row--alt{background:rgba(0,0,0,.01)}
.p-points-role__wh-asset-row td{padding:8.5px 14px 9px;border-bottom:1px solid rgba(0,0,0,.08);vertical-align:top}
.p-points-role__wh-asset-row:last-child td{border-bottom:none}
.p-points-role__wh-asset-no{width:76px;padding-top:10px;padding-bottom:10px;font-size:1.1rem;color:#a8a79f;text-align:center}
.p-points-role__wh-asset-pref,.p-points-role__wh-asset-city{width:150px;font-size:1.2rem;color:#73726c}
.p-points-role__wh-asset-name{font-size:1.2rem;color:#1a1a18}
.p-points-role__section-head--special-rule{gap:4px;padding-bottom:0;border-bottom:1px solid #bc002d}
.p-points-role__wh-special-list{display:flex;flex-direction:column;gap:10px}
.p-points-role__wh-special-item{padding:15px 19px;background:#ffecf1;border:1px solid #bc002d;border-radius:8px}
.p-points-role__wh-special-title{margin:0 0 0;font-size:1.3rem;font-weight:500;line-height:1.75;color:#bc002d}
.p-points-role__wh-special-body{margin:0;font-size:1.3rem;font-weight:400;line-height:1.75;color:#73726c}
@media(max-width: 1024px){#world-heritage-challenge{gap:40px;width:auto;max-width:none;margin-left:0;margin-right:0}#world-heritage-challenge>.p-points-role__wh-block{width:auto;max-width:none;margin-inline:0}#world-heritage-challenge .p-points-role__wh-hero{min-height:0}#world-heritage-challenge .p-points-role__wh-hero-overlay{background:hsla(0,0%,100%,.9)}#world-heritage-challenge .p-points-role__wh-hero-inner{min-height:0;width:100%;max-width:none;margin-inline:0;padding:24px 0 20px}#world-heritage-challenge .p-points-role__wh-eyebrow{margin-bottom:8px;line-height:1.1428571429;letter-spacing:.0857142857em}#world-heritage-challenge .p-points-role__wh-eyebrow::before{width:14px}#world-heritage-challenge .p-points-role__wh-hero-title{margin-bottom:8px;font-size:2.2rem;line-height:1.35}#world-heritage-challenge .p-points-role__wh-hero-desc{max-width:none;margin-bottom:8px;font-size:1.3rem;line-height:1.8}#world-heritage-challenge .p-points-role__wh-hero-stats{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:8px;padding-top:8px}#world-heritage-challenge .p-points-role__wh-hstat{padding:11px 13px}#world-heritage-challenge .p-points-role__wh-hstat-num{font-size:2rem;line-height:1.6}#world-heritage-challenge .p-points-role__wh-hstat-lbl{font-size:1rem;line-height:1.6;white-space:normal}#world-heritage-challenge .p-points-role__wh-block{gap:14px}#world-heritage-challenge .p-points-role__wh-block .p-points-role__section-head{min-height:0;gap:5px;padding-bottom:0}#world-heritage-challenge .p-points-role__wh-block .p-points-role__section-title{font-size:1.7rem;line-height:1.4}#world-heritage-challenge .p-points-role__wh-block .p-points-role__section-sub{font-size:1.1rem;line-height:1.65}#world-heritage-challenge .p-points-role__wh-challenge-grid{display:flex;flex-direction:column;gap:10px}#world-heritage-challenge .p-points-role__wh-ch-card{border-color:rgba(0,0,0,.08);border-radius:14px}#world-heritage-challenge .p-points-role__wh-ch-head{padding:12px 15px 13px}#world-heritage-challenge .p-points-role__wh-ch-num{width:26px;height:26px;font-size:1.2rem;line-height:1.6;border-radius:13px}#world-heritage-challenge .p-points-role__wh-ch-rank,#world-heritage-challenge .p-points-role__wh-ch-head .p-points-role__yaku-rank{padding:4px 10px}#world-heritage-challenge .p-points-role__wh-ch-body{gap:7px;padding:13px 15px}#world-heritage-challenge .p-points-role__wh-ch-cond{font-size:1.3rem;line-height:1.65}#world-heritage-challenge .p-points-role__wh-ch-cond strong{color:#bc002d}#world-heritage-challenge .p-points-role__wh-ch-note{font-size:1.2rem;line-height:1.7}#world-heritage-challenge .p-points-role__wh-ch-ex{padding:7px 10px}#world-heritage-challenge .p-points-role__wh-rule-list{display:flex;flex-direction:column;gap:8px}#world-heritage-challenge .p-points-role__wh-rule-item{gap:28px;padding:21px;border-color:rgba(0,0,0,.08);border-radius:8px}#world-heritage-challenge .p-points-role__wh-rule-item--warn{padding:12px 15px 13px}#world-heritage-challenge .p-points-role__wh-rule-icon{width:65px;height:65px}#world-heritage-challenge .p-points-role__wh-rule-title{font-size:1.2rem;font-weight:500;line-height:1.5}#world-heritage-challenge .p-points-role__wh-rule-body{font-size:1.2rem;line-height:1.5}#world-heritage-challenge .p-points-role__wh-rule-warn{font-size:1.2rem;line-height:1.8}#world-heritage-challenge .p-points-role__wh-list{border-radius:14px}#world-heritage-challenge .p-points-role__wh-list-head,#world-heritage-challenge .p-points-role__wh-list-row{grid-template-columns:52px minmax(0, 1fr) 32px 56px;column-gap:6px;row-gap:6px}#world-heritage-challenge .p-points-role__wh-list-head{min-height:33px;padding:8px 12px 9px;font-size:1rem;line-height:1.6}#world-heritage-challenge .p-points-role__wh-list-head .p-points-role__wh-list-head-cell:nth-child(1){grid-column:1}#world-heritage-challenge .p-points-role__wh-list-head .p-points-role__wh-list-head-cell:nth-child(2){grid-column:2}#world-heritage-challenge .p-points-role__wh-list-head .p-points-role__wh-list-head-cell:nth-child(3){grid-column:3;text-align:center}#world-heritage-challenge .p-points-role__wh-list-head .p-points-role__wh-list-head-cell:nth-child(4){display:none}#world-heritage-challenge .p-points-role__wh-list-head .p-points-role__wh-list-head-cell:nth-child(5){grid-column:4;text-align:right}#world-heritage-challenge .p-points-role__wh-list-row{align-items:center;min-height:0;padding:10px 12px 11px}#world-heritage-challenge .p-points-role__wh-list-row .p-points-role__wh-list-type{grid-column:1}#world-heritage-challenge .p-points-role__wh-list-row .p-points-role__wh-list-name{grid-column:2;font-size:1.1rem;line-height:1.4;white-space:normal}#world-heritage-challenge .p-points-role__wh-list-row .p-points-role__wh-list-count{grid-column:3;font-size:1.2rem;line-height:1.6}#world-heritage-challenge .p-points-role__wh-list-row .p-points-role__wh-list-rank{display:none}#world-heritage-challenge .p-points-role__wh-list-row .p-points-role__wh-list-pt{display:block;grid-column:4;font-size:1.05rem;line-height:1.6761904762}#world-heritage-challenge .p-points-role__wh-list .p-points-role__wh-type{padding:1px 7px}#world-heritage-challenge .p-points-role__wh-acc-list{gap:6px}#world-heritage-challenge .p-points-role__wh-acc{border-radius:8px}#world-heritage-challenge .p-points-role__wh-acc-head{flex-direction:column;align-items:stretch;gap:14px;padding:18px 14px 11px}#world-heritage-challenge .p-points-role__wh-acc-head-l{flex-direction:row;gap:8px;padding-bottom:15px;border-bottom:1px solid rgba(0,0,0,.08)}#world-heritage-challenge .p-points-role__wh-acc-name{font-size:1.3rem;line-height:1.4}#world-heritage-challenge .p-points-role__wh-acc-head-r{flex-wrap:nowrap;gap:0;align-items:center;width:100%}#world-heritage-challenge .p-points-role__wh-acc-head-r .p-points-role__yaku-rank{flex-shrink:0;padding:4px 10px}#world-heritage-challenge .p-points-role__wh-acc-count{flex-shrink:0;margin-left:64px;font-size:1.1rem;line-height:1.6}#world-heritage-challenge .p-points-role__wh-acc-pt{flex-shrink:0;margin-left:64px;font-size:1.05rem;line-height:1.6761904762}#world-heritage-challenge .p-points-role__wh-acc-toggle{flex-shrink:0;width:27px;height:27px;margin-left:auto}#world-heritage-challenge .p-points-role__wh-acc-toggle::before{width:27px;height:27px;background-image:url("../images/about/wh-acc-toggle.svg");transform:rotate(0deg)}#world-heritage-challenge .p-points-role__wh-acc[open] .p-points-role__wh-acc-toggle::before{transform:rotate(180deg)}#world-heritage-challenge .p-points-role__wh-acc-panel{overflow-x:visible;padding-top:1px}#world-heritage-challenge .p-points-role__wh-asset-table{display:block;min-width:0;font-size:1.2rem;line-height:1.45}#world-heritage-challenge .p-points-role__wh-asset-table thead,#world-heritage-challenge .p-points-role__wh-asset-table tbody{display:block}#world-heritage-challenge .p-points-role__wh-asset-table thead tr,#world-heritage-challenge .p-points-role__wh-asset-table tbody tr{width:100%}#world-heritage-challenge .p-points-role__wh-asset-head{display:flex;align-items:stretch;min-height:31px}#world-heritage-challenge .p-points-role__wh-asset-th{padding:0;font-size:.9rem;line-height:normal;border-bottom:1px solid rgba(0,0,0,.08)}#world-heritage-challenge .p-points-role__wh-asset-th--no{width:57px;flex-shrink:0;padding:7px 10px 13px;text-align:center}#world-heritage-challenge .p-points-role__wh-asset-th--pref,#world-heritage-challenge .p-points-role__wh-asset-th--city{display:none}#world-heritage-challenge .p-points-role__wh-asset-th--name{flex:1 1 0;min-width:0;padding:9px 10px 11px 15px}#world-heritage-challenge .p-points-role__wh-asset-row{display:grid;grid-template-columns:57px minmax(0, 1fr);grid-template-rows:auto auto;grid-template-areas:"num name" "num area";row-gap:0;align-items:stretch;padding:10px 0 12px;border-bottom:1px solid rgba(0,0,0,.08);box-sizing:border-box}#world-heritage-challenge .p-points-role__wh-asset-row td{display:block;padding:0;border:none}#world-heritage-challenge .p-points-role__wh-asset-row td.p-points-role__wh-asset-pref{display:none}#world-heritage-challenge .p-points-role__wh-asset-row td.p-points-role__wh-asset-no{padding:0 10px}#world-heritage-challenge .p-points-role__wh-asset-row td.p-points-role__wh-asset-name{padding:0 10px 0 15px;font-size:1.2rem;font-weight:400;line-height:1.3333333333;color:#1a1a18}#world-heritage-challenge .p-points-role__wh-asset-row td.p-points-role__wh-asset-city{padding:0 10px 0 15px;font-size:1rem;line-height:1.2;color:#a8a79f}#world-heritage-challenge .p-points-role__wh-asset-row td.p-points-role__wh-asset-city::before{content:attr(data-pref) "・"}#world-heritage-challenge .p-points-role__wh-asset-row:last-child{border-bottom:none}#world-heritage-challenge .p-points-role__wh-asset-no{grid-area:num;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;box-sizing:border-box;min-height:100%;font-size:1rem;line-height:1;text-align:center;color:#a8a79f}#world-heritage-challenge .p-points-role__wh-asset-name{grid-area:name;width:auto;max-width:none;box-sizing:border-box}#world-heritage-challenge .p-points-role__wh-asset-city{grid-area:area;box-sizing:border-box}#world-heritage-challenge .p-points-role__section-head--special-rule{gap:5px;padding-bottom:0;border-bottom:none}#world-heritage-challenge .p-points-role__wh-special-list{gap:8px}#world-heritage-challenge .p-points-role__wh-special-item{padding:13px 15px}#world-heritage-challenge .p-points-role__wh-special-title,#world-heritage-challenge .p-points-role__wh-special-body{font-size:1.2rem;line-height:1.8}}
@media(max-width: 768px){#world-heritage-challenge .p-points-role__wh-rank-wrap{border-radius:14px}#world-heritage-challenge .p-points-role__wh-rank-head{display:none}#world-heritage-challenge .p-points-role__wh-rank-row{display:grid;grid-template-columns:auto auto 1fr;grid-template-rows:auto auto auto;gap:10px;align-items:center;min-height:0;padding:12px 14px 13px;border-left:none;border-bottom:1px solid rgba(0,0,0,.08)}#world-heritage-challenge .p-points-role__wh-rank-row:first-of-type{padding:12px 14px}#world-heritage-challenge .p-points-role__wh-rank-row:last-child{border-bottom:none}#world-heritage-challenge .p-points-role__wh-rank-row--shiko,#world-heritage-challenge .p-points-role__wh-rank-row--ameshiko,#world-heritage-challenge .p-points-role__wh-rank-row--sanko,#world-heritage-challenge .p-points-role__wh-rank-row--inoshikacho,#world-heritage-challenge .p-points-role__wh-rank-row--akatan{min-height:0;padding:12px 14px 13px;border-left:none;border-bottom-color:rgba(0,0,0,.08)}#world-heritage-challenge .p-points-role__wh-rank-bar{grid-column:1/-1;grid-row:1;width:152px;height:54px}#world-heritage-challenge .p-points-role__wh-rank-row--sanko .p-points-role__wh-rank-bar{width:112px}#world-heritage-challenge .p-points-role__wh-rank-row--inoshikacho .p-points-role__wh-rank-bar{width:117px}#world-heritage-challenge .p-points-role__wh-rank-row--akatan .p-points-role__wh-rank-bar{width:115px}#world-heritage-challenge .p-points-role__wh-rank-pill{grid-column:1;grid-row:2}#world-heritage-challenge .p-points-role__wh-rank-pill .p-points-role__yaku-rank{padding:4px 10px}#world-heritage-challenge .p-points-role__wh-rank-pt{grid-column:2;grid-row:2;font-size:1.14rem;line-height:1.6842105263}#world-heritage-challenge .p-points-role__wh-rank-desc{grid-column:1/-1;grid-row:3;font-size:1.2rem;line-height:1.65}}
@media(min-width: 769px)and (max-width: 1024px){.p-points-role__cat-grid,.p-points-role__wh-challenge-grid{grid-template-columns:1fr}}

/* ===== BUG #8: 期間フィルタの年セレクト / 日付入力が狭すぎて値が切れる =====
   FIX の style.css では年セレクトのラッパー（.c-select-v4--filter）が 65〜92px、
   日付ピッカーのラッパー（.c-date-picker）が 100px 固定のため、
   "2026" が "20" に、"2026/06/20" が途中で切れて見える。
   ラッパーに十分な min-width を与えてクリッピングを解消する（固定の巨大幅ではなく
   min-width 中心にして既存グリッド/モバイルを壊さない）。
   対象: 投稿済み/訪問地（.p-visited__filters …）と ポイント履歴（.p-point-history__filters …）。 */

/* --- 投稿済み/訪問地: 年セレクト（.c-select-v4--filter ラッパー） --- */
.p-visited__filters > .c-select-v4--filter {
  width: auto;
  min-width: 76px;
  max-width: none;
}

/* --- 投稿済み/訪問地: 日付ピッカー（.c-date-picker ラッパーと開始/終了の各日付） --- */
.p-visited__filters .c-date-picker,
.p-visited__filters .p-visited__filters-dates .c-date-picker,
.p-visited__filters .p-visited__filters-dates .c-date-picker:first-of-type,
.p-visited__filters .p-visited__filters-dates .c-date-picker:last-of-type {
  width: auto;
  min-width: 122px;
  max-width: none;
}

/* --- 投稿済み/訪問地: 中の date input が省略されないように --- */
.p-visited__filters .js-date-picker-trigger.p-visited__select--date,
.p-visited__filters .c-date-picker > input.p-visited__select--date {
  min-width: 122px;
  overflow: visible;
  text-overflow: clip;
}

/* --- ポイント履歴: 年セレクト（.c-select-v4--point-year ラッパー） --- */
.p-point-history__filters > .c-select-v4--filter.c-select-v4--point-year {
  width: auto;
  min-width: 76px;
  max-width: none;
}

/* --- ポイント履歴: 日付ピッカー（.c-date-picker ラッパー） --- */
.p-point-history__filters > .c-date-picker,
.p-point-history__filters .c-date-picker,
.p-point-history__filters-dates .c-date-picker {
  width: auto;
  min-width: 122px;
  max-width: none;
}

/* --- ポイント履歴: 中の date input が省略されないように --- */
.p-point-history__filters .js-date-picker-trigger.p-point-history__select--date {
  min-width: 122px;
  overflow: visible;
  text-overflow: clip;
}

/* ===== BUG #16: 挑戦役チップ（.p-points-role__yaku-tag）が密着 / フォントサイズ不揃い =====
   FIX のコンテナ gap は 4〜5px と狭く、隣接チップがほぼ密着して見える。
   また button 版チップ（.p-points-role__yaku-tag[type=button]）は font:inherit を持つため
   span 版チップと font-size / line-height / font-family が揃わずバラつく。
   コンテナの gap を広げ、span/button 双方のチップでフォントを統一する。
   対象: 挑戦役テーブルの .p-points-role__yaku-tags（コンテナ）と
         .p-points-role__yaku-tag（span / button のチップ）。 */

/* --- コンテナ: チップ同士が密着しないよう余白を確保（flex-wrap + gap） --- */
.p-points-role__yaku-tags,
#challenge-ranks .p-points-role__yaku-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* --- チップ: span / button で font-size・line-height・font-family を統一 --- */
.p-points-role__yaku-tags .p-points-role__yaku-tag,
.p-points-role__yaku-tags button.p-points-role__yaku-tag,
.p-points-role__yaku-tags .p-points-role__yaku-tag[type="button"],
#challenge-ranks .p-points-role__yaku-tags .p-points-role__yaku-tag {
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.7;
  margin: 0;
}

/* ===== お知らせ（news）モジュール =====
   FIX 静的サイト（tabifuda-news-update）の src/scss/object/project/news/* を
   コンパイルした成果物。style.css 本体の再ビルドを待たずに公開ページへ反映するため、
   ここ（overrides.css）に取り込む。次回 style.css を再生成する際は本ブロックを削除して
   本体側へ統合すること。Figma: 2137:9023 / 9144 / 9176 / 9306。
   変数解決値: bg-cream #f8f5ef / text #1a1a18 / text-secondary #73726c /
   text-sub #a8a79f / accent #bc002d / white #fff。breakpoint: tb 769–1024px, sp ≤768px。 */
.p-news-page,.l-main--news{background-color:#f8f5ef}
.l-main--news{min-height:0}
.p-news{padding:60px 0 80px}
.p-news__inner{max-width:860px;padding-left:20px;padding-right:20px}
.p-news__head{display:flex;flex-direction:column;gap:8px;margin-bottom:40px}
.p-news__title-row{display:flex;align-items:center;gap:8px;min-height:29px;padding-left:2px}
.p-news__icon{display:block;flex-shrink:0;width:27px;height:20px;object-fit:contain}
.p-news__title{margin:0;color:#1a1a18;font-size:24px;font-weight:700;line-height:normal;letter-spacing:.48px}
.p-news__lead{margin:0;padding-left:37px;color:#73726c;font-size:14px;font-weight:400;line-height:22.4px}
.p-news__list{border-top:1px solid rgba(0,0,0,.15);background-color:#fff}
.p-news__foot{display:flex;flex-direction:column;align-items:flex-start;gap:24px;margin-top:40px}
.p-news__back{color:#73726c;font-size:13px;line-height:normal;text-decoration:none;transition:color .2s ease}
.p-news__back:hover{color:#1a1a18}
.p-news__pagination{align-self:center;width:100%;display:flex;justify-content:center}
.p-news-item{position:relative;display:block;padding:22px 68px 22px 30px;border-bottom:1px solid rgba(0,0,0,.15);color:inherit;text-decoration:none;transition:background-color .2s ease}
.p-news-item:hover{background-color:rgba(0,0,0,.02)}
.p-news-item__body{display:flex;flex-direction:column;gap:5px;min-width:0}
.p-news-item__title{margin:0;color:#1a1a18;font-size:15px;font-weight:500;line-height:24px}
.p-news-item__desc{margin:0;color:#73726c;font-size:13px;font-weight:400;line-height:20.8px}
.p-news-item__date{display:block;margin-top:1px;padding-top:3px;color:#8a9199;font-size:12px;font-weight:400;line-height:normal;letter-spacing:.24px}
.p-news-item__arrow{position:absolute;top:50%;right:30px;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid #a8a79f;border-radius:14px;color:#a8a79f;font-size:14px;line-height:1;transform:translateY(-50%);transition:border-color .2s ease,color .2s ease}
.p-news-item:hover .p-news-item__arrow{border-color:#73726c;color:#73726c}
@media(min-width: 769px)and (max-width: 1024px){.p-news{padding-top:48px;padding-bottom:64px}}
@media(max-width: 768px){.p-news{padding:32px 0 48px}.p-news__inner{max-width:none;padding-left:0;padding-right:0}.p-news__head{gap:6px;margin-bottom:23px;padding-inline:20px}.p-news__title-row{min-height:26px;padding-left:0}.p-news__icon{width:20px;height:15px}.p-news__title{font-size:20px;line-height:26px;letter-spacing:.4px}.p-news__lead{padding-left:0;font-size:12px;line-height:19.2px}.p-news__list{margin-inline:20px 23px}.p-news__foot{align-items:center;gap:16px;margin-top:32px;padding-inline:20px}.p-news__back{order:2;align-self:center;font-size:13px}.p-news__pagination{order:1;align-self:center}.p-news__pagination .c-pagination{gap:6px}.p-news__pagination .c-pagination__item:not(:has(.c-pagination__link)):not(:has(.c-pagination__ellipsis)),.p-news__pagination .c-pagination__link,.p-news__pagination .c-pagination__prev,.p-news__pagination .c-pagination__next{width:34px;height:34px;font-size:12px}.p-news__pagination .c-pagination__item:has(.c-pagination__ellipsis){width:34px;height:34px}.p-news__pagination .c-pagination__ellipsis{min-width:34px;min-height:34px;font-size:12px}.p-news__pagination .c-pagination__prev,.p-news__pagination .c-pagination__next,.p-news__pagination .c-pagination__link.is-prev,.p-news__pagination .c-pagination__link.is-next{font-size:10px}.p-news-item{padding:20px 52px 21px 20px;border-bottom-color:rgba(0,0,0,.1)}.p-news-item__body{gap:5px}.p-news-item__title{font-size:14px;line-height:22.4px}.p-news-item__desc{font-size:12px;line-height:19.8px}.p-news-item__date{margin-top:0;padding-top:1px;font-size:11px;letter-spacing:.22px}.p-news-item__arrow{right:16px;width:26px;height:26px;border-radius:13px;font-size:12px}}
.p-news-detail-page,.l-main--news-detail{background-color:#f8f5ef}
.l-main--news-detail{min-height:0}
.p-news-detail{padding:60px 0 80px}
.p-news-detail__inner{max-width:860px;padding-left:20px;padding-right:20px}
.p-news-article{background-color:#fff}
.p-news-article__head{display:flex;flex-direction:column;gap:15px;padding:30px 50px 27px;border-bottom:1px solid #e0dbd3}
.p-news-article__title{margin:0;color:#1a1a18;font-size:20px;font-weight:700;line-height:32px;letter-spacing:.2px}
.p-news-article__date{color:#8a9199;font-size:12px;font-weight:400;line-height:normal;letter-spacing:.24px}
.p-news-article__body{display:flex;flex-direction:column;gap:20px;padding:36px 50px 40px;color:#1a1a18;font-size:14px;font-weight:400;line-height:26.6px}
.p-news-article__body p{margin:0;font-size:inherit;font-weight:inherit;line-height:inherit;color:inherit}
.p-news-article__heading{margin:0;color:#1a1a18}
.p-news-article__heading--primary{padding-left:10px;border-left:5px solid #bc002d;font-size:18px;font-weight:700;line-height:26.6px}
.p-news-article__heading--secondary{padding-bottom:0;border-bottom:1px solid #bc002d;font-size:14px;font-weight:500;line-height:26.6px}
.p-news-article__heading--tertiary{font-size:14px;font-weight:700;line-height:26.6px;color:#73726c}
.p-news-article__figure{margin:0}
.p-news-article__figure-placeholder{width:100%;aspect-ratio:760/435;max-height:435px;background-color:#b8b8b8}
.p-news-article__foot{padding:12px 30px 30px;border-top:1px solid #e0dbd3}
.p-news-article__back{display:inline-flex;color:#73726c;font-size:13px;line-height:normal;text-decoration:none;transition:color .2s ease}
.p-news-article__back:hover{color:#1a1a18}
@media(min-width: 769px)and (max-width: 1024px){.p-news-detail{padding-top:48px;padding-bottom:64px}}
@media(max-width: 768px){.p-news-detail{padding:20px 0 60px}.p-news-detail__inner{max-width:none;padding-left:16px;padding-right:16px}.p-news-article{border-radius:4px}.p-news-article__head{gap:10px;padding:23px 20px 21px}.p-news-article__title{font-size:16px;line-height:27.2px;letter-spacing:.16px}.p-news-article__date{font-size:11px;letter-spacing:.22px}.p-news-article__body{gap:17px;padding:23px 20px 28px;font-size:13px;line-height:24.7px}.p-news-article__heading--primary{padding-left:10px;border-left-width:5px;font-size:16px;line-height:26.6px}.p-news-article__heading--secondary{padding-top:5px;font-size:14px;font-weight:500;line-height:26.6px}.p-news-article__heading--tertiary{font-size:14px;font-weight:700;line-height:26.6px}.p-news-article__figure-placeholder{aspect-ratio:auto;height:177px;max-height:none}.p-news-article__foot{padding:16px 20px}.p-news-article__back{font-size:12px}}

/* スポット検索結果の読み込み中表示。CSP に従いコンポーネント内の <style> から移動。 */
.p-spot-card--skeleton {
  pointer-events: none;
}

.p-spot-card__skeleton-block {
  background: linear-gradient(90deg, #eee 25%, #f5f5f5 37%, #eee 63%);
  background-size: 400% 100%;
  animation: spotSkeletonShimmer 1.4s ease infinite;
}

.p-spot-card__skeleton-body {
  padding: 12px;
}

.p-spot-card__skeleton-title {
  height: 16px;
  margin-bottom: 8px;
  border-radius: 4px;
}

.p-spot-card__skeleton-meta {
  width: 60%;
  height: 12px;
  border-radius: 4px;
}

@keyframes spotSkeletonShimmer {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: 0 0;
  }
}

/* ── SP 地方ページ KV: 県ボタン内テキストの上下余白を均等化 ── */
/* align-items:flex-start + 非対称な上下 padding のため、テキストが箱内でやや下寄りに見える。
   flex を縦中央寄せにし、上下 padding を均等値に揃える。 */
@media (max-width: 1024px) {
  [class*="p-area-kv--"] .p-area-kv__btn {
    align-items: center;
    padding-top: calc(6.5 / 390 * 100vw);
    padding-bottom: calc(6.5 / 390 * 100vw);
  }
}

/* ── SP 挑戦役ランク「五光」等のピルの枠が消える/崩れる ── */
/* height:26px 固定に対し padding(4px×2)+border(1px×2)+line-height(1.6×11px=17.6px)の
   必要高さが 27.6px と height を上回り、枠がクリップされて見える。
   固定 height をやめ min-height にすることで内容に応じて伸縮させる。 */
@media (max-width: 1024px) {
  .p-about-challenge__pill {
    height: auto;
    min-height: 26px;
  }
}

/* ── 挑戦役ランク: 説明文が折り返さず、カードの高さも列ごとに揃わない問題を修正
   （tabifuda-update-20260805 の src/scss/object/project/about/_challenge.scss /
   _challenge-compact.scss 相当を移植） ──
   従来は .p-about-challenge__desc に white-space:nowrap が残っており、SPでは
   同じ行のペアの高さが説明文の長さでバラつく問題を -webkit-line-clamp:2 による
   2行丸め（省略）で応急処置していた。Figma更新でカード自体に height:100% を与え、
   同じ行内のカードを grid の stretch で高さを揃える設計に変わったため、
   説明文は省略せず折り返して全文表示する方針に統一する。 */
.p-about-challenge__card {
  height: 100%;
}

.p-about-challenge__row {
  align-items: stretch;
}

@media (min-width: 1025px) {
  .p-about-challenge__foot {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    align-content: start;
    padding: 12px 15px 14px;
  }

  .p-about-challenge__desc {
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}

@media (max-width: 1024px) {
  .p-about-challenge__desc {
    line-height: 14px;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}

/* ── aboutページ ユーザーランク: 静的サイトとの表示一致 ── */
/* style.css が width:100%/height:100%/overflow:visible に変わっているが、
   オリジナル静的サイトは固定 59×89px/max-width:none で描画していた。
   固定サイズに揃えて全ランクの札サイズを統一する。 */
.p-about-ranks__card-img {
  overflow: hidden;
}
.p-about-ranks__card-img img,
.p-about-ranks__hanafuda {
  width: 59px;
  height: 89px;
  max-width: none;
  max-height: none;
  object-fit: contain;
  object-position: center bottom;
}
.p-about-ranks__item:nth-child(4) .p-about-ranks__card-img img,
.p-about-ranks__item:nth-child(4) .p-about-ranks__hanafuda {
  width: 57px;
}
.p-about-ranks__item:last-child .p-about-ranks__card-img img,
.p-about-ranks__item:last-child .p-about-ranks__hanafuda {
  width: 55px;
}

/* ── ランキングテーブル 住所列の溢れ防止 ── */
.c-table--spots__location {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 0;
}

/* ── SP 世界遺産への挑戦: 背景画像を画面幅いっぱいに広げる ── */
/* .p-points-role__wh-hero 自体は width:100% だが、親の .p-points-role__card が
   SP で padding-inline を持つため、その内側幅の 100% にしかならず余白ができる。
   ビューポート幅いっぱいに背景がブリードするよう、親の padding 分を打ち消す。
   ただし全幅ブリード後は .wh-hero-inner の横パディングが 0 のため、
   見出し・統計カードが画面端に密着する。カード本体と同じ 18px を復元する。 */
@media (max-width: 1024px) {
  #world-heritage-challenge .p-points-role__wh-hero {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }

  #world-heritage-challenge .p-points-role__wh-hero-inner {
    padding-left: 18px;
    padding-right: 18px;
    box-sizing: border-box;
  }
}

/* ── SP ログイン: 入力欄フォーカス時の自動ズームが遷移後も残る ── */
/* .p-login-form__input / .p-auth-form__input の font-size が 16px 未満のため、
   iOS Safari がフォーカス時に自動ズームする。SPA遷移後もズーム状態が解除されず、
   直後に開くマイページまで拡大されたまま表示されてしまう。
   16px 以上にすることで自動ズーム自体を発生させない。 */
.p-login-form__input,
.p-auth-form__input {
  font-size: 16px;
}

/* ── マイページ追従エリア: button のログアウトだけ文字が大きくなる ── */
/* 他の項目は a 要素、ログアウトだけ button 要素のため、ブラウザ既定の
   button フォント指定が残る環境がある。通常リンクと同じ値を明示する。 */
.p-mypage-side__link--logout {
  font-family: inherit;
  font-size: 13px;
  line-height: 20.8px;
  font-weight: 400;
}

@media (max-width: 1024px) {
  .p-mypage-side__link--logout {
    font-size: 10px;
    line-height: 13px;
  }
}

/* ── SP Galaxy等の狭幅端末: ハンバーガーメニューの「ログイン/ログアウト」行が
   はみ出してズレる ── */
/* .l-header__drawer-actions は左右 padding(47px/39px) + ボタン2つ(各145px固定) + gap(14px) で
   合計ちょうど 390px（iPhone基準の設計幅）になる決め打ちレイアウト。
   Galaxy系（360px前後）など 390px 未満の実機幅では横にはみ出し、ボタンがズレて見える。
   ボタン幅を可変にして、狭い画面でも折り返さず縮小して収まるようにする。 */
@media (max-width: 389px) {
  .l-header__drawer-actions {
    padding-left: 24px;
    padding-right: 24px;
  }

  .l-header__drawer-actions .l-header__btn {
    width: auto;
    min-width: 0;
    flex: 1 1 0;
  }
}

/* ── SP フッター: 縦ロゴとキャッチコピーのバランス調整 ── */
/* SP(max-width:768px)は縦ロゴが PC と同じ 64×138px のまま残り、
   隣のキャッチコピー(11px・最大220px)に対して縦ロゴが大きすぎてバランスが悪い。
   タブレット breakpoint と同様に縮小し、サブロゴの位置も比率を保って追従させる。 */
@media (max-width: 768px) {
  .l-footer__brand-logo {
    width: 46px;
    height: 99px;
  }

  .l-footer__brand-main {
    width: 46px;
    height: 99px;
  }

  .l-footer__brand-sub {
    left: 10px;
    top: 37px;
    width: 25px;
    height: 25px;
  }
}

/* ===== 訪問地マップ: 一部訪問の地方を控えめな色で表示 =====
   制覇（is-on）は元の赤色そのまま、一部訪問（is-partial）は
   透明度を下げ＋セピア・色相回転で琥珀色にして段階を区別する。
   未訪問: 非表示 / 一部訪問: 琥珀色（薄い） / 全制覇: 赤（元色） */
.p-visited-map__region-layer.is-partial {
  opacity: 1;
  visibility: visible;
}

.p-visited-map__region-layer.is-partial img {
  opacity: 0.45;
  filter: sepia(0.6) saturate(1.2) hue-rotate(-10deg);
}

/* ── TOP: 日本地図が表示されるアニメーションを最速化 ── */
/* 元は bg-logo(0.9s遅延+1.2s) → map/area(1.9s遅延+1.2s) → ticker(2.4s〜) の順で
   最大 3秒近くかけて段階的に表示していた。リロード直後に最速で見せたいので、
   delay をほぼ 0 にし、duration も短縮する（完全に瞬時ではなく、ごく短いフェードは残す）。 */
.p-kv__visual--japan .p-kv__bg-logo {
  animation-delay: 0s;
  animation-duration: 0.3s;
}

.p-kv__visual--japan .p-kv__map::before {
  animation-delay: 0.05s;
  animation-duration: 0.3s;
}

.p-kv__visual--japan .p-kv__area {
  animation-delay: 0.05s;
  animation-duration: 0.3s;
}

.p-kv__visual--japan .p-kv__ticker-inner > .p-kv__campaign-label,
.p-kv__visual--japan .p-kv__ticker-inner > .p-kv__ticker-label {
  animation-delay: 0.1s;
}

.p-kv__visual--japan .p-kv__ticker-inner > p,
.p-kv__visual--japan .p-kv__ticker-inner > .p-kv__ticker-text {
  animation-delay: 0.15s;
}

.p-kv__visual--japan .p-kv__ticker-inner > a,
.p-kv__visual--japan .p-kv__ticker-inner > .p-kv__ticker-action {
  animation-delay: 0.2s;
}

/* 地方ページのランキング空・エラー状態をSPの4列グリッド全幅で表示する。 */
.c-table--ranking-state {
  text-align: center;
}

@media (max-width: 1024px) {
  .c-table--ranking-sp tbody tr > td.c-table--ranking-state {
    grid-column: 1 / -1;
    width: 100%;
    padding: 16px;
    text-align: center;
  }
}

/* ===== 名所詳細サイドバー「この名所が関わる挑戦役」（Figma 961:25424） =====
   納品物 tabifuda-update-20260720 の src/scss/object/project/spot-detail/_sidebar.scss を移植。
   本体 style.css を再生成した際は、このブロックを削除すること（重複防止）。
   解決済み変数値：white #fff / text #1a1a18 / text-secondary #73726c /
   text-sub #a8a79f / link #185fa5 / pt #633806 */
.p-spot-sidebar-yaku {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.p-spot-sidebar-yaku__lead {
  margin: 0;
  padding: 0 2px;
  font-size: 10.5px;
  font-weight: 400;
  line-height: 16.27px;
  color: #a8a79f;
}

.p-spot-sidebar-yaku__lead strong {
  font-weight: 700;
  color: #1a1a18;
}

.p-spot-sidebar-yaku__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.p-spot-sidebar-yaku__more {
  display: block;
  margin-top: 1px;
  font-size: 11px;
  font-weight: 400;
  line-height: 17.6px;
  color: #185fa5;
  text-align: center;
  text-decoration: none;
}

.p-spot-sidebar-yaku__more:hover {
  text-decoration: underline;
}

.p-spot-sidebar-yaku-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  box-sizing: border-box;
  padding: 15px;
  background-color: #fff;
  border: 1px solid #e8e8e8;
  border-radius: 10px;
}

.p-spot-sidebar-yaku-card__visual {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 54px;
}

.p-spot-sidebar-yaku-card__visual picture,
.p-spot-sidebar-yaku-card__visual img {
  display: block;
  max-width: 100%;
  max-height: 54px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.p-spot-sidebar-yaku-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
}

.p-spot-sidebar-yaku-card__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 4px 16px 5px;
  font-size: 12px;
  font-weight: 500;
  line-height: 20.4px;
  border-radius: 99px;
  white-space: nowrap;
}

.p-spot-sidebar-yaku-card__pill--tsukimi {
  color: #2a3c7a;
  background: #f0f4ff;
  border: 1px solid #a0b0e0;
}

.p-spot-sidebar-yaku-card__pill--hanami {
  color: #9c2c5c;
  background: #fbe9f0;
  border: 1px solid #f0a5c4;
}

.p-spot-sidebar-yaku-card__pill--aotan {
  color: #2d5a9e;
  background: #eef4ff;
  border: 1px solid #b0c8f0;
}

.p-spot-sidebar-yaku-card__pill--akatan {
  color: #73726c;
  background: #f5f4f0;
  border: 1px solid #dcdbd9;
}

.p-spot-sidebar-yaku-card__pill--inoshikacho {
  color: #335a17;
  background: #eaf3de;
  border: 1px solid #cbe3a9;
}

.p-spot-sidebar-yaku-card__pill--sanko {
  color: #0c447c;
  background: #e6f1fb;
  border: 1px solid #c7dff7;
}

.p-spot-sidebar-yaku-card__pill--ameshiko,
.p-spot-sidebar-yaku-card__pill--shiko {
  color: #a32d2d;
  background: #fcebeb;
  border: 1px solid #f7c1c1;
}

.p-spot-sidebar-yaku-card__pill--goko {
  color: #7a5800;
  background: #fdf8e8;
  border: 1px solid #ebd48b;
}

.p-spot-sidebar-yaku-card__pt {
  flex-shrink: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 23.8px;
  color: #633806;
  white-space: nowrap;
  text-align: right;
}

.p-spot-sidebar-yaku-card__desc {
  margin: 0;
  width: 100%;
  padding-top: 10px;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  font-size: 11px;
  font-weight: 400;
  line-height: 17px;
  color: #a8a79f;
}

/* ===== 名所詳細サイドバー「基本情報」— 達成条件・付与pt内訳（tabifuda-update-20260805 の
   src/scss/object/project/spot-detail/_sidebar.scss 相当を移植）。
   「ボーナスpt」（到達・時期・体力の自動小計、独立加算ではない）は付与pt内訳とは別の
   独立した行（.p-spot-sidebar-table__row--bonus）として表示する。 ===== */
.p-spot-sidebar-table__row--location th,
.p-spot-sidebar-table__row--condition th,
.p-spot-sidebar-table__row--pt th {
  padding-top: 10px;
}

.p-spot-sidebar-table__condition {
  margin: 0;
  font-size: 12px;
  line-height: 16px;
  color: #1a1a18;
}

.p-spot-sidebar-table__condition strong {
  font-weight: 700;
}

.p-spot-sidebar-pt-lines {
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 100%;
  max-width: 185px;
}

.p-spot-sidebar-pt-line {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  white-space: nowrap;
}

.p-spot-sidebar-pt-line__label {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  min-width: 0;
}

.p-spot-sidebar-pt-line__name {
  font-size: 12px;
  font-weight: 400;
  line-height: 19.2px;
  color: #73726c;
}

.p-spot-sidebar-pt-line__note {
  font-size: 10px;
  font-weight: 400;
  line-height: 16px;
  color: #a8a79f;
}

.p-spot-sidebar-pt-line__value {
  flex-shrink: 0;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 20px;
  color: #633806;
  text-align: right;
}

.p-spot-sidebar-pt-line--total {
  margin-top: 1px;
  padding-top: 7px;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  align-items: baseline;
}

.p-spot-sidebar-pt-line--total .p-spot-sidebar-pt-line__name,
.p-spot-sidebar-pt-line--total .p-spot-sidebar-pt-line__value {
  font-size: 12.5px;
  font-weight: 500;
  color: #633806;
}

@media (max-width: 768px) {
  .p-spot-sidebar-table__row--condition,
  .p-spot-sidebar-table__row--pt {
    align-items: start;
  }
}

/* ===== 名所詳細サイドバー「基本情報」— 公式URL行（tabifuda-dist-upload-20260728 移植）。
   「未登録」時の空行（.p-spot-sidebar-table__row--official-url-empty /
   .p-spot-sidebar-url-line）は既存 style.css に定義済みのため追加不要。 ===== */
.p-spot-sidebar-table__link--external {
  white-space: nowrap;
}

.p-spot-sidebar-table__row--bonus th,
.p-spot-sidebar-table__row--bonus td,
.p-spot-sidebar-table__row--official-url th,
.p-spot-sidebar-table__row--official-url td {
  vertical-align: middle;
  padding-top: 8px;
  padding-bottom: 8px;
}

/* ── SP ハンバーガーメニュー: 通知ベルと「×」が右寄せにならない ── */
/* .l-header__drawer-notice { margin-left: auto } は .l-header__drawer-head の直接の
   フレックスアイテムに効くことを想定しているが、NotificationBell コンポーネントが
   ボタンを position:relative の div でラップするため、実際のフレックスアイテムは
   そのラッパー div になり margin-left:auto が効かない。ラッパー側に付与し直す。 */
.l-header__drawer-notice-wrap {
  margin-left: auto;
}

/* ===== ptシステム「三大スポット組み合わせ役」— 代表スポット（例）を名所詳細へのリンクにする ===== */
.p-points-role__mitsudai-spot-link {
  color: #185fa5;
  text-decoration: none;
}

.p-points-role__mitsudai-spot-link:hover,
.p-points-role__mitsudai-spot-link:focus-visible {
  text-decoration: underline;
}

/* ===== 名所詳細ヒーロー: 自動切替を停止・再開できる操作 ===== */
.p-spot-hero__autoplay {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 9999px;
  background: rgba(0, 0, 0, 0.58);
  color: #fff;
  font-size: 12px;
  line-height: 1;
}

.p-spot-hero__autoplay:hover,
.p-spot-hero__autoplay:focus-visible {
  background: rgba(0, 0, 0, 0.78);
}

.p-spot-hero__autoplay:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
}

@media (max-width: 768px) {
  .p-spot-hero__autoplay {
    right: 10px;
    bottom: 10px;
    width: 40px;
    height: 40px;
  }
}

/* マイページ サイドバー: ポイント残高取得中のスケルトン表示。
   AuthContextの古いスナップショット値を一瞬表示しないよう、確定するまでは
   この一時表示に切り替える（.p-spot-card__skeleton-block のシマーを流用）。 */
.p-mypage-side__card-skeleton {
  position: absolute;
  inset: 0;
  border-radius: 8px;
  background: linear-gradient(90deg, #eee 25%, #f5f5f5 37%, #eee 63%);
  background-size: 400% 100%;
  animation: spotSkeletonShimmer 1.4s ease infinite;
}

.p-mypage-rank-badge--skeleton {
  display: inline-block;
  width: 64px;
  height: 1em;
  border-radius: 4px;
  background: linear-gradient(90deg, #eee 25%, #f5f5f5 37%, #eee 63%);
  background-size: 400% 100%;
  animation: spotSkeletonShimmer 1.4s ease infinite;
}

/* マイページ「個人情報・設定」LINE連携カード。
   注意: .p-account-settings__field は入力欄専用（41px固定高・枠線付き）のため、
   このカードのラッパーには絶対に使わない（誤用すると入力欄風の窮屈な箱に潰れる）。 */
.p-account-settings__line-field {
  margin: 0;
}

.p-account-settings__line-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  font-size: 13px;
  line-height: 20.8px;
  color: #1a1a18;
}

.p-account-settings__line-status-text {
  flex: 1 1 260px;
  min-width: 0;
  margin: 0;
  color: #55544e;
}

.p-account-settings__line-status-text--linked {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #1a7a3c;
  font-weight: 500;
}

.p-account-settings__line-status-text--linked::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2fb35a;
  flex-shrink: 0;
}

.p-account-settings__line-link-btn,
.p-account-settings__line-unlink-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  flex-shrink: 0;
  min-width: 190px;
  height: 41px;
  padding: 0 22px;
  border-radius: 8px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
  white-space: nowrap;
}

.p-account-settings__line-link-btn {
  border: 1px solid #06c755;
  background: #06c755;
  color: #fff;
}

.p-account-settings__line-link-btn:hover:not(:disabled) {
  background: #05b34c;
}

.p-account-settings__line-unlink-btn {
  border: 1px solid rgba(0, 0, 0, 0.15);
  background: #fff;
  color: #55544e;
}

.p-account-settings__line-unlink-btn:hover:not(:disabled) {
  border-color: #bc002d;
  color: #bc002d;
}

.p-account-settings__line-link-btn:disabled,
.p-account-settings__line-unlink-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

@media (max-width: 768px) {
  .p-account-settings__line-status {
    flex-direction: column;
    align-items: flex-start;
  }

  .p-account-settings__line-status-text {
    flex-basis: auto;
  }

  .p-account-settings__line-link-btn,
  .p-account-settings__line-unlink-btn {
    width: 100%;
  }
}

/* 名所カードの市区町村区タグ（都道府県＋市区町村区＋ジャンルの3バッジ表示用） */
.c-spot-tag--city {
  background: #9aa4b7;
}