/* ── 応援日記 リデザイン v2 ─────────────────── */
/* 「ここに行く」＝現在地からの経路検索。🔔と同じく行の右側に並ぶ小ボタン */
/* v7.37.0: 参戦予定の登録ボタン（応援日記の予定行から直接） */
.hd-att-btn {
  flex-shrink: 0;
  font-family: var(--hd-font);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid rgba(194,48,107,.35);
  background: rgba(194,48,107,.07);
  color: #c2306b;
  cursor: pointer;
  white-space: nowrap;
  transition: all .15s;
}
.hd-att-btn:hover { background: rgba(194,48,107,.16); border-color: #c2306b; }
.hd-att-btn.is-on { background: #c2306b; border-color: #c2306b; color: #fff; }
.hd-att-btn[disabled] { opacity: .5; cursor: default; }
.hd-att-btn:focus-visible { outline: 2px solid var(--hd-accent-sky); outline-offset: 2px; }
@media (max-width: 599px) { .hd-att-btn { padding: 6px 10px; } }

.hd-go-btn{
  flex-shrink:0;align-self:flex-start;
  display:inline-block;padding:2px 7px;border-radius:6px;
  font-size:11px;line-height:1.35;text-decoration:none;white-space:nowrap;
  color:#2f7f9e;border:1.5px solid rgba(47,127,158,.35);background:rgba(47,127,158,.08);
}
.hd-go-btn:hover,.hd-go-btn:focus{color:#ffffff;background:#2f7f9e;border-color:#2f7f9e}
.hd-go-btn:focus-visible{outline:2px solid #e08a00;outline-offset:2px}
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&display=swap');

/* ── v7.27.0: 白 + 日向坂ブルーのライトテーマ ──────────────────
   黒背景が見づらいという声を受けて全面的に置き換え。
   地は白、面も白、奥行きは影と淡い空色の面で作る（黒は一切使わない）。
   文字色は黒ではなく濃紺（#0e2c40 / #163449）＝白地でも眼が痛くならず、
   青系の色相で全体が一本の色に揃う。
   種別カラーは白地で読める濃さに落としてある（元のダーク用の明るい色は
   白地だと 2:1 前後しか出ず、ドットも文字も飛んでしまう）。 */
:root {
  /* 面と地 */
  --hd-bg:       #f2f8fc;   /* 全体の地＝ごく淡い空色 */
  --hd-surface:  #ffffff;   /* カード・グリッドの面＝白 */
  --hd-surface2: #eaf4fa;   /* 入力欄・沈める面 */
  --hd-border:   #dbeaf3;   /* 通常の罫線 */
  --hd-border2:  #b7d8ea;   /* 強めの罫線・非活性の枠 */
  --hd-shadow:   0 2px 10px rgba(17,74,110,.07);
  --hd-shadow-h: 0 6px 22px rgba(10,120,172,.16);
  /* 文字（黒ではなく濃紺で揃える） */
  --hd-ink:      #0e2c40;   /* 見出し・日付 */
  --hd-text:     #163449;   /* 本文 */
  --hd-text2:    #55788f;   /* 補助 */
  --hd-text3:    #64839a;   /* 最小の注記 */
  /* 日向坂ブルー */
  --hd-accent:   #0a78ac;   /* 主役。白抜き文字を載せても白地に置いても 4.5:1 */
  --hd-accent2:  #37a7d8;   /* グラデーションの明るい側 */
  --hd-accent-sky: #4BAED8; /* 従来のひなたブルー。装飾の面にだけ残す */
  /* 種別カラー */
  --hd-gold:     #96690a;
  --hd-pink:     #c2306b;
  --hd-pink2:    #a34a76;
  --hd-green:    #17864a;
  --hd-radius:   14px;
  /* v7.40.0: 可読性の底上げ。'Noto Sans JP' は読み込んでいないので、Windowsでは
     sans-serif → 游ゴシック（線が細く小さい字が潰れる）に落ちていた。
     各OSで線の太い日本語フォントを先に指名し、無ければ従来どおりに落とす。 */
  --hd-font: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "BIZ UDPGothic",
             "Noto Sans JP", Meiryo, "Segoe UI", system-ui, sans-serif;
}

.hintv-diary-wrap {
  font-family: var(--hd-font);
  /* 小さい字が多い画面なので、なめらかに・行間広めに・少しだけ字間を空ける */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.7;
  letter-spacing: .012em;
  max-width: 540px;
  background: var(--hd-bg);
  color: var(--hd-text);
  border-radius: 16px;
  padding: 0;
  /* v7.42.2: hidden はスクロールできない「スクロール容器」を作ってしまい、
     この中に置いた position:sticky が全部無効化されていた（角丸のはみ出しを
     切るためだけの指定だったので clip で足りる。clip は容器を作らない）。 */
  overflow: clip;
}

/* ── ヘッダー ── */
.hintv-diary-header {
  padding: 16px 16px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.hintv-diary-title {
  font-size: 1.15rem;
  font-weight: 900;
  color: var(--hd-ink);
  letter-spacing: .02em;
}

/* ── 月タブ（横スクロール） ── */
.hintv-diary-tabs {
  display: flex;
  gap: 6px;
  padding: 0 16px 12px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.hintv-diary-tabs::-webkit-scrollbar { display: none; }
.hintv-diary-tab {
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 700;
  font-family: var(--hd-font);
  padding: 6px 14px;
  border-radius: 20px;
  border: 1.5px solid var(--hd-border2);
  background: var(--hd-surface);
  color: var(--hd-text2);
  cursor: pointer;
  transition: all .18s;
  white-space: nowrap;
}
.hintv-diary-tab:hover { border-color: var(--hd-accent); color: var(--hd-accent); }
.hintv-diary-tab.active {
  background: var(--hd-accent);
  color: #fff;
  border-color: var(--hd-accent);
  box-shadow: 0 2px 12px rgba(10,120,172,.35);
}

/* ── タイムライン（左線スタイル） ── */
.hintv-diary-timeline { padding: 0 16px; }

/* ── カード ── */
.hintv-diary-card {
  position: relative;
  background: var(--hd-surface);
  border-radius: var(--hd-radius);
  margin-bottom: 6px;
  overflow: hidden;
  border: 1px solid var(--hd-border);
  box-shadow: var(--hd-shadow);
  transition: border-color .18s, box-shadow .18s;
  animation: hd-fadein .3s ease both;
}
@keyframes hd-fadein { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
.hintv-diary-card:hover { border-color: var(--hd-accent); box-shadow: var(--hd-shadow-h); }

/* 日付ヘッダー行 */
.hintv-diary-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px 14px 8px;
  border-bottom: 1px solid var(--hd-border);
}
.hintv-diary-date-badge {
  flex-shrink: 0;
}
.hintv-diary-date-label {
  font-size: 15px;
  font-weight: 900;
  color: var(--hd-ink);
  letter-spacing: .01em;
}
.hintv-diary-head-info { flex: 1; min-width: 0; }
.hintv-diary-streak {
  font-size: 12px;
  font-weight: 700;
  color: var(--hd-gold);
  display: flex;
  align-items: center;
  gap: 4px;
}
.hintv-diary-role { font-size: 10px; color: var(--hd-text2); margin-top: 2px; }

/* ミッションチップ */
.hintv-diary-missions { display: flex; flex-wrap: wrap; gap: 4px; padding: 8px 14px 4px; }
.hintv-diary-mission-tag {
  font-size: 10px;
  background: rgba(10,120,172,.10);
  color: var(--hd-text2);
  padding: 3px 8px;
  border-radius: 20px;
  border: 1px solid var(--hd-border2);
}
.hintv-diary-mission-tag.watch { background: rgba(10,120,172,.12); color: var(--hd-accent); border-color: rgba(10,120,172,.25); }
.hintv-diary-mission-tag.extra { background: rgba(194,48,107,.12); color: var(--hd-pink); border-color: rgba(194,48,107,.25); }

/* 画像グリッド */
.hintv-diary-images {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
  margin: 6px 0 0;
}
.hintv-diary-images img:first-child:nth-last-child(1) {
  grid-column: 1 / -1;
  height: 180px;
}
.hintv-diary-image {
  width: 100%;
  height: 120px;
  object-fit: cover;
  cursor: pointer;
  display: block;
  transition: opacity .15s;
}
.hintv-diary-image:hover { opacity: .9; }

/* 視聴サムネグリッド：2行×3列 */
.hintv-diary-likes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  padding: 2px 0 2px;
}
.hintv-diary-watched-label {
  font-size: .68rem;
  color: var(--hd-text3);
  padding: 6px 14px 2px;
}
.hintv-diary-like-thumb {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 3px;
  background: #dcebf4;
  display: block;
  transition: opacity .15s;
}
.hintv-diary-like-thumb:hover { opacity: .8; }

/* メモ */
.hintv-diary-memo {
  font-size: 13px;
  color: var(--hd-text);
  padding: 10px 14px 6px;
  line-height: 1.7;
  white-space: pre-wrap;
  word-break: break-all;
}

/* タグ */
.hintv-diary-tags { display: flex; flex-wrap: wrap; gap: 5px; padding: 4px 14px 8px; }
.hintv-diary-tag {
  font-size: 11px;
  color: var(--hd-accent);
  background: rgba(10,120,172,.1);
  padding: 2px 8px;
  border-radius: 20px;
}

/* フッター */
.hintv-diary-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-top: 1px solid var(--hd-border);
}
.hintv-diary-pub { font-size: 10px; color: var(--hd-text3); }
.hintv-diary-edit {
  font-size: 11px;
  color: var(--hd-accent);
  cursor: pointer;
  margin-left: auto;
  background: none;
  border: none;
  padding: 4px 8px;
  border-radius: 6px;
  font-family: var(--hd-font);
  transition: background .15s;
}
.hintv-diary-edit:hover { background: rgba(10,120,172,.12); }

/* スケジュールブロック */
.hintv-diary-schedule {
  margin: 8px 14px 4px;
  padding: 8px 10px;
  background: rgba(194,48,107,.04);
  border: 1px solid rgba(194,48,107,.1);
  border-radius: 10px;
}
/* v7.30.0: チェックイン履歴の1件削除ボタン */
.hd-ci-del {
  flex-shrink: 0;
  background: none;
  border: 1px solid rgba(194,48,107,.30);
  border-radius: 6px;
  color: #c2306b;
  font-size: 11px;
  line-height: 1;
  padding: 3px 6px;
  cursor: pointer;
  opacity: .55;
  transition: opacity .15s, background .15s;
}
.hd-ci-del:hover { opacity: 1; background: rgba(194,48,107,.10); }
.hd-ci-del:focus-visible { outline: 2px solid var(--hd-accent-sky); outline-offset: 2px; opacity: 1; }
.hd-ci-del[disabled] { cursor: default; opacity: .4; }
@media (max-width: 599px) { .hd-ci-del { padding: 5px 8px; } }

.hintv-diary-schedule-title {
  font-size: .68rem;
  font-weight: 700;
  color: var(--hd-pink2);
  margin-bottom: 5px;
  letter-spacing: .04em;
}

/* スケジュールのみカード */
.hintv-diary-card--schedule-only {
  background: rgba(194,48,107,.03);
  border-color: rgba(194,48,107,.12);
}
.hintv-diary-card--schedule-only .hintv-diary-card-head {
  border-bottom: none;
  padding-bottom: 4px;
}
.hintv-diary-card--schedule-only .hintv-diary-schedule {
  margin: 0 14px 10px;
}

/* ── カレンダー ── */
.hintv-diary-cal { padding: 0 0 16px; }

/* ヘッダー：年月 + 件数 */
.hintv-cal-header { padding: 16px 16px 10px; }
.hintv-cal-year-month { font-size: 22px; font-weight: 900; color: var(--hd-ink); letter-spacing: -.01em; }
.hintv-cal-count { font-size: 11px; color: var(--hd-text2); margin-top: 2px; }

/* 月ナビ */
.hintv-diary-cal-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px 12px;
}
.hintv-diary-cal-title { display: none; }
.hintv-diary-cal-btn {
  background: var(--hd-surface2);
  border: 1px solid var(--hd-border2);
  color: var(--hd-text2);
  width: 32px; height: 32px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 16px;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.hintv-diary-cal-btn:hover { border-color: var(--hd-accent); color: var(--hd-accent); }
.hintv-cal-nav-label { flex: 1; text-align: center; font-size: 13px; font-weight: 700; color: var(--hd-text2); }

/* v7.29.0: 「今日」ボタン。月送りの矢印と並べて、現在地へ一発で戻す */
.hintv-cal-today-btn {
  flex-shrink: 0;
  font-family: var(--hd-font);
  font-size: 12px;
  font-weight: 700;
  padding: 7px 14px;
  border-radius: 20px;
  border: 1.5px solid var(--hd-accent);
  background: rgba(10,120,172,.08);
  color: var(--hd-accent);
  cursor: pointer;
  transition: all .15s;
  margin-right: 8px;
  white-space: nowrap;
}
.hintv-cal-today-btn:hover { background: var(--hd-accent); color: #fff; }
.hintv-cal-today-btn:focus-visible { outline: 2px solid var(--hd-accent-sky); outline-offset: 2px; }
/* すでに今日を見ているときは控えめに（押せる状態は保つ） */
.hintv-cal-today-btn.is-here {
  border-color: var(--hd-border2);
  background: transparent;
  color: var(--hd-text3);
}
.hintv-cal-today-btn.is-here:hover { border-color: var(--hd-accent); background: transparent; color: var(--hd-accent); }
@media (max-width: 599px) { .hintv-cal-today-btn { padding: 9px 14px; } }

/* v7.124.0: メンバー絞り込み（月ナビの「👤」セレクト）。
   チップと同じ見た目に寄せる。選択中はアクセント色で「絞っている」ことを明示。 */
.hintv-cal-member-sel {
  flex-shrink: 1; min-width: 0; max-width: 9.5em;
  font-family: var(--hd-font);
  font-size: 12px; font-weight: 700;
  padding: 6px 22px 6px 10px;
  border-radius: 20px;
  border: 1.5px solid var(--hd-border2);
  background: var(--hd-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235b6b7c' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 8px center;
  color: var(--hd-text2);
  cursor: pointer;
  margin-right: 8px;
  -webkit-appearance: none; appearance: none;
  text-overflow: ellipsis; white-space: nowrap; overflow: hidden;
  line-height: 1.4;
}
.hintv-cal-member-sel:hover { border-color: var(--hd-accent); color: var(--hd-accent); }
.hintv-cal-member-sel:focus-visible { outline: 2px solid var(--hd-accent-sky); outline-offset: 2px; }
.hintv-cal-member-sel.is-active {
  border-color: var(--hd-accent);
  background-color: rgba(10,120,172,.10);
  color: var(--hd-accent);
}
@media (max-width: 599px) { .hintv-cal-member-sel { max-width: 8.5em; padding: 8px 20px 8px 9px; } }

/* 種別フィルターチップ */
.hintv-cal-filters {
  display: flex;
  gap: 6px;
  padding: 0 16px 14px;
  overflow-x: auto;
  scrollbar-width: none;
}
.hintv-cal-filters::-webkit-scrollbar { display: none; }
.hintv-cal-filter-chip {
  flex-shrink: 0;
  display: flex; align-items: center; gap: 5px;
  font-size: 12px; font-weight: 700;
  font-family: var(--hd-font);
  padding: 7px 14px;
  border-radius: 20px;
  border: 1.5px solid var(--hd-border2);
  background: var(--hd-surface);
  color: var(--hd-text2);
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
}
.hintv-cal-filter-chip.active-all   { background: var(--hd-accent); color: #fff; border-color: var(--hd-accent); box-shadow: 0 2px 10px rgba(10,120,172,.3); }
.hintv-cal-filter-chip.active-bday    { background: rgba(176,125,8,.15);  color: var(--hd-gold);  border-color: rgba(176,125,8,.4); }
.hintv-cal-filter-chip.active-event   { background: rgba(194,48,107,.15);  color: var(--hd-pink);  border-color: rgba(194,48,107,.4); }
.hintv-cal-filter-chip.active-tv      { background: rgba(26,110,216,.15);  color: #1a6ed8;  border-color: rgba(26,110,216,.4); }
.hintv-cal-filter-chip.active-radio   { background: rgba(181,112,10,.15);  color: #a06308;  border-color: rgba(181,112,10,.4); }
.hintv-cal-filter-chip.active-stream  { background: rgba(30,158,87,.15); color: #17864a;  border-color: rgba(30,158,87,.4); }
.hintv-cal-filter-chip.active-release { background: rgba(139,63,212,.15); color: #8b3fd4;  border-color: rgba(139,63,212,.4); }
.hintv-cal-filter-chip.active-magazine{ background: rgba(107,119,133,.15); color: #6b7785;     border-color: rgba(107,119,133,.4); }
.hintv-cal-filter-chip.active-ticket  { background: rgba(194,82,31,.15); color: #c2521f;  border-color: rgba(194,82,31,.4); }
.hintv-cal-filter-chip.active-meet    { background: rgba(47,127,158,.15); color: #2f7f9e;  border-color: rgba(47,127,158,.4); }
.hintv-cal-filter-chip.active-other   { background: rgba(105,116,127,.15); color: #69747f;     border-color: rgba(105,116,127,.4); }
.hintv-cal-filter-dot { width: 7px; height: 7px; border-radius: 50%; }

/* グリッド本体 */
.hintv-cal-grid-wrap {
  background: var(--hd-surface);
  border-radius: 16px;
  margin: 0 16px;
  padding: 12px 8px 8px;
  border: 1px solid var(--hd-border);
  box-shadow: var(--hd-shadow);
}
.hintv-diary-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
}
.hintv-diary-cal-weekday {
  font-size: 10px;
  color: var(--hd-text3);
  text-align: center;
  padding: 0 0 8px;
  font-weight: 700;
  letter-spacing: .04em;
}
.hintv-diary-cal-day {
  aspect-ratio: 1;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 500;
  color: var(--hd-text2);
  cursor: default;
  position: relative;
  transition: all .15s;
  gap: 2px;
}
.hintv-diary-cal-day.empty { background: transparent; }
.hintv-diary-cal-day.has-record { color: var(--hd-ink); font-weight: 700; cursor: pointer; }
.hintv-diary-cal-day.has-record:hover { background: rgba(10,120,172,.1); }
.hintv-diary-cal-day.has-schedule { cursor: pointer; }
.hintv-diary-cal-day.today {
  /* 今日＝カレンダー唯一の塗り。濃い日向坂ブルーの円に、
     従来のひなたブルーを薄いリングとして重ねて浮かせる。 */
  background: var(--hd-accent) !important;
  color: #fff !important;
  font-weight: 900;
  box-shadow: 0 0 0 4px rgba(75,174,216,.28), 0 4px 12px rgba(10,120,172,.30);
}
.hintv-diary-cal-day.today .cal-streak { color: #ffe9a8; }
.hintv-diary-cal-day.selected:not(.today) { background: rgba(10,120,172,.15); color: var(--hd-accent); font-weight: 700; }
.hintv-diary-cal-day .cal-day-num { font-size: 13px; line-height: 1; }
.hintv-diary-cal-day .cal-streak { font-size: 7px; color: var(--hd-gold); font-weight: 900; line-height: 1; }

/* カラードット */
.cal-dots { display: flex; gap: 2px; justify-content: center; flex-wrap: wrap; }
.cal-dot { width: 5px; height: 5px; border-radius: 50%; }
/* 今日のセルだけドットが青の面に乗る。白い縁で抜くと色が潰れるので、
   ドット列そのものを白いピルに載せて種別の色をそのまま保つ。 */
.hintv-diary-cal-day.today .cal-dots {
  background: #fff;
  border-radius: 999px;
  padding: 2px 4px;
  box-shadow: 0 1px 3px rgba(10,60,90,.25);
}
.cal-dot.birthday { background: var(--hd-gold); }
.cal-dot.event    { background: var(--hd-pink); }
.cal-dot.diary    { background: var(--hd-accent); }
.cal-dot.tv       { background: #1a6ed8; }
.cal-dot.radio    { background: #a06308; }
.cal-dot.stream   { background: #17864a; }
.cal-dot.release  { background: #8b3fd4; }
.cal-dot.magazine { background: #6b7785; }
.cal-dot.ticket   { background: #c2521f; }
.cal-dot.meet     { background: #2f7f9e; }
.cal-dot.other    { background: #69747f; }
.hintv-diary-cal-day.filtered-out { opacity: .25; }
.hintv-diary-cal-day.filtered-out .cal-dots { display: none; }

/* 曜日ヘッダー：日曜=赤 / 土曜=青 */
.hintv-diary-cal-weekday.sun { color: #d63a4a; }
.hintv-diary-cal-weekday.sat { color: #1a6ed8; }

/* 日付セル：日曜・祝日=赤 / 土曜=青（today/selected時は上書きされる） */
.hintv-diary-cal-day.sun,
.hintv-diary-cal-day.holiday { color: #d63a4a; }
.hintv-diary-cal-day.sat { color: #1a6ed8; }
.hintv-diary-cal-day.has-record.sun,
.hintv-diary-cal-day.has-record.holiday { color: #c0424f; }
.hintv-diary-cal-day.has-record.sat { color: #1f6fb0; }

/* 祝日名ラベル（詳細パネル用） */
.hintv-cal-holiday-name {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  color: #d63a4a;
  background: rgba(214,58,74,.12);
  border: 1px solid rgba(214,58,74,.3);
  padding: 2px 8px;
  border-radius: 20px;
  margin-left: 8px;
  vertical-align: middle;
}

/* ── 選択日の予定パネル ── */
.hintv-cal-day-panel { padding: 20px 16px 0; animation: hd-fadein .2s ease; }
.hintv-cal-day-panel-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px;
}
.hintv-cal-day-panel-title { font-size: 16px; font-weight: 900; color: var(--hd-ink); }
.hintv-cal-day-panel-badge {
  font-size: 11px; font-weight: 700;
  background: rgba(10,120,172,.15);
  color: var(--hd-accent);
  padding: 3px 10px; border-radius: 20px;
  border: 1px solid rgba(10,120,172,.3);
}

/* 予定カード */
.hintv-cal-event-card {
  background: var(--hd-surface);
  border: 1px solid var(--hd-border);
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 8px;
  border-left: 4px solid var(--hd-border2);
  transition: border-color .15s;
  text-decoration: none;
  display: block;
  color: inherit;
}
.hintv-cal-event-card:hover { border-left-color: var(--hd-accent); }
.hintv-cal-event-card.type-birthday { border-left-color: var(--hd-gold); }
.hintv-cal-event-card.type-event    { border-left-color: var(--hd-pink); }
.hintv-cal-event-card.type-diary    { border-left-color: var(--hd-accent); }
.hintv-cal-event-meta {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 6px;
}
.hintv-cal-event-type-badge {
  font-size: 9px; font-weight: 700; letter-spacing: .06em;
  padding: 2px 8px; border-radius: 20px;
  text-transform: uppercase;
}
.hintv-cal-event-type-badge.birthday { background: rgba(176,125,8,.15); color: var(--hd-gold); }
.hintv-cal-event-type-badge.event    { background: rgba(194,48,107,.15); color: var(--hd-pink); }
.hintv-cal-event-type-badge.diary    { background: rgba(10,120,172,.12); color: var(--hd-accent); }
.hintv-cal-event-time { font-size: 11px; color: var(--hd-text2); display: flex; align-items: center; gap: 3px; }
.hintv-cal-event-title { font-size: 14px; font-weight: 700; color: var(--hd-ink); line-height: 1.4; margin-bottom: 4px; }
.hintv-cal-event-sub { font-size: 11px; color: var(--hd-text2); display: flex; align-items: center; gap: 4px; }

/* ── モーダル ── */
/* ══ v7.32.0: 編集モーダル ═══════════════════════════════════
   カレンダー側を白＋日向坂ブルーに作り替えたあと、ここだけ元の寸法
   （14pxの見出し・詰まった余白・下からせり上がるだけのシート）で
   取り残されていた。本体と同じ流儀に揃える＝見出しと保存ボタンは固定、
   中身はカードに分けてスクロール、広い画面では中央のダイアログにする。 */
.hintv-diary-modal-bg {
  position: fixed;
  inset: 0;
  background: rgba(12,52,80,.45);
  backdrop-filter: blur(4px);
  z-index: 9999;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.hintv-diary-modal {
  display: flex;
  flex-direction: column;
  background: var(--hd-bg);
  border-radius: 20px 20px 0 0;
  width: 100%;
  max-width: 560px;
  max-height: 92vh;
  overflow: hidden;             /* スクロールは body 側が持つ */
  border-top: 1px solid var(--hd-border2);
  box-shadow: 0 -8px 40px rgba(12,52,80,.22);
}
/* 固定ヘッダー */
.hintv-diary-modal-title {
  flex-shrink: 0;
  font-size: 17px;
  font-weight: 900;
  color: var(--hd-ink);
  padding: 16px 18px;
  background: var(--hd-surface);
  border-bottom: 1px solid var(--hd-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
/* スクロールする中身 */
.hintv-diary-modal-body {
  flex: 1;
  overflow-y: auto;
  padding: 14px 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  -webkit-overflow-scrolling: touch;
}
/* 項目のカード */
.hd-mo-field {
  background: var(--hd-surface);
  border: 1px solid var(--hd-border);
  border-radius: 14px;
  box-shadow: var(--hd-shadow);
  padding: 14px 16px 16px;
}
.hd-mo-hint { font-size: 11.5px; color: var(--hd-text3); margin-top: 6px; line-height: 1.5; }
.hd-mo-danger { border-color: rgba(192,57,43,.28); }
.hd-mo-dellist:not(:empty) { margin-top: 10px; }
.hd-mo-delall {
  width: 100%;
  margin-top: 12px;
  padding: 12px;
  border: 1.5px solid #c0392b;
  border-radius: 10px;
  background: transparent;
  color: #c0392b;
  font-family: var(--hd-font);
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
  transition: background .18s;
}
.hd-mo-delall:hover { background: rgba(192,57,43,.10); }
/* 固定フッター */
.hintv-diary-modal-foot {
  flex-shrink: 0;
  padding: 12px 16px calc(14px + env(safe-area-inset-bottom, 0px));
  background: var(--hd-surface);
  border-top: 1px solid var(--hd-border);
}
/* 広い画面：下からのシートではなく中央のダイアログに */
@media (min-width: 700px) {
  .hintv-diary-modal-bg { align-items: center; padding: 24px; }
  .hintv-diary-modal {
    max-width: 680px;
    max-height: min(88vh, 900px);
    border-radius: 18px;
    border-top: none;
    box-shadow: 0 24px 64px rgba(12,52,80,.30);
  }
  .hintv-diary-modal-title { font-size: 19px; padding: 18px 22px; }
  .hintv-diary-modal-body  { padding: 16px 20px 20px; gap: 14px; }
  .hintv-diary-modal-foot  { padding: 14px 20px 18px; }
  .hintv-diary-textarea    { min-height: 140px; }
}
.hintv-diary-modal-close {
  flex-shrink: 0;
  background: var(--hd-surface2);
  border: 1px solid var(--hd-border2);
  color: var(--hd-text2);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .15s;
}
.hintv-diary-modal-close:hover { border-color: var(--hd-accent); color: var(--hd-accent); }
.hintv-diary-modal-label { font-size: 12.5px; color: var(--hd-text2); margin: 0 0 8px; font-weight: 700; letter-spacing: .04em; }
.hintv-diary-textarea {
  width: 100%;
  min-height: 100px;
  background: var(--hd-surface2);
  border: 1.5px solid var(--hd-border2);
  border-radius: 12px;
  color: var(--hd-text);
  font-size: 15px;
  font-family: var(--hd-font);
  padding: 13px 15px;
  resize: vertical;
  box-sizing: border-box;
  line-height: 1.7;
  transition: border-color .15s, box-shadow .15s;
}
.hintv-diary-textarea:focus { outline: none; border-color: var(--hd-accent); box-shadow: 0 0 0 3px rgba(10,120,172,.15); }
.hintv-diary-tag-input {
  width: 100%;
  background: var(--hd-surface2);
  border: 1.5px solid var(--hd-border2);
  border-radius: 10px;
  color: var(--hd-text);
  font-size: 14px;
  font-family: var(--hd-font);
  padding: 11px 14px;
  box-sizing: border-box;
  transition: border-color .15s;
}
.hintv-diary-tag-input:focus { outline: none; border-color: var(--hd-accent); }
.hintv-diary-emoji-picker { display: flex; flex-wrap: wrap; gap: 6px; }
.hintv-diary-emoji {
  font-size: 22px; line-height: 1; cursor: pointer;
  width: 42px; height: 42px;
  display: flex; align-items: center; justify-content: center;
  background: var(--hd-surface2);
  border: 1px solid var(--hd-border);
  border-radius: 10px;
  transition: transform .12s, border-color .12s, background .12s;
}
.hintv-diary-emoji:hover { background: #fff; border-color: var(--hd-accent); transform: translateY(-2px); }
.hintv-diary-emoji:focus-visible { outline: 2px solid var(--hd-accent-sky); outline-offset: 2px; }
.hintv-diary-upload-area {
  border: 1.5px dashed var(--hd-border2);
  border-radius: 12px;
  padding: 22px 16px;
  text-align: center;
  cursor: pointer;
  color: var(--hd-text2);
  background: var(--hd-surface2);
  transition: all .2s;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.hd-mo-upload-main { font-size: 14px; font-weight: 700; color: var(--hd-text); }
.hd-mo-upload-sub  { font-size: 11.5px; color: var(--hd-text3); }
.hintv-diary-upload-area:hover .hd-mo-upload-main { color: var(--hd-accent); }
.hintv-diary-upload-area:hover { border-color: var(--hd-accent); color: var(--hd-accent); background: rgba(10,120,172,.05); }
.hintv-diary-upload-area.hintv-uploading { border-color: var(--hd-pink); border-style: solid; animation: hintv-upload-pulse 1.2s ease-in-out infinite; pointer-events: none; }
@keyframes hintv-upload-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(194,48,107,.3); } 50% { box-shadow: 0 0 0 6px rgba(194,48,107,0); } }
.hintv-diary-preview-images { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.hintv-diary-preview-img { position: relative; }
.hintv-diary-preview-img img { width: 84px; height: 84px; object-fit: cover; border-radius: 10px; border: 1px solid var(--hd-border); }
.hintv-diary-preview-img .del { position: absolute; top: -4px; right: -4px; background: #c00; color: #fff; border: none; border-radius: 999px; width: 16px; height: 16px; font-size: 10px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.hintv-diary-pub-toggle { display: flex; align-items: center; gap: 8px; margin: 14px 0; }
.hintv-diary-pub-toggle label { font-size: 12px; color: var(--hd-text2); }
.hintv-diary-save-btn {
  width: 100%;
  padding: 14px;
  background: linear-gradient(135deg, var(--hd-accent), var(--hd-accent2));
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 900;
  font-family: var(--hd-font);
  cursor: pointer;
  transition: all .2s;
  box-shadow: 0 4px 14px rgba(10,120,172,.3);
}
.hintv-diary-save-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(10,120,172,.45); }

/* その他 */
.hintv-diary-load-more {
  width: 100%;
  padding: 11px;
  background: transparent;
  color: var(--hd-text2);
  border: 1px solid var(--hd-border2);
  border-radius: 10px;
  font-size: 12px;
  font-family: var(--hd-font);
  cursor: pointer;
  margin: 4px 0 16px;
  transition: all .15s;
}
.hintv-diary-load-more:hover { border-color: var(--hd-accent); color: var(--hd-accent); }
.hintv-diary-empty { text-align: center; color: var(--hd-text3); font-size: 13px; padding: 40px 0; }

/* ══ v7.28.0: スケジューラーとしての使い勝手 ══════════════════════
   ①表示切替タブ（カレンダー / 今後の予定）
   ②画面幅に応じたサイズ調整（スマホ＝1カラムで指に優しく、
     PC＝カレンダーの右に選択日パネルを置いて横幅を使い切る）  */

/* ── 表示切替タブ ── */
.hintv-cal-viewtabs {
  /* v7.41.0: タブが4つになりスマホで詰まっていたので、折り返さず横スクロールさせる。
     はみ出しが分かるよう右端に余白を残す。 */
  display: flex;
  gap: 6px;
  padding: 0 16px 12px;
  overflow-x: auto;
  flex-wrap: nowrap;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.hintv-cal-viewtabs::-webkit-scrollbar { display: none; }
.hintv-cal-viewtab {
  flex: 0 0 auto;
  font-family: var(--hd-font);
  font-size: 13px;
  font-weight: 700;
  padding: 9px 12px;
  border-radius: 10px;
  border: 1.5px solid var(--hd-border2);
  background: var(--hd-surface);
  color: var(--hd-text2);
  cursor: pointer;
  transition: all .18s;
  white-space: nowrap;
}
.hintv-cal-viewtab:hover { border-color: var(--hd-accent); color: var(--hd-accent); }
.hintv-cal-viewtab.is-active {
  background: var(--hd-accent);
  border-color: var(--hd-accent);
  color: #fff;
  box-shadow: 0 2px 10px rgba(10,120,172,.28);
}
.hintv-cal-viewtab:focus-visible { outline: 2px solid var(--hd-accent-sky); outline-offset: 2px; }

/* ── 今後の予定 ── */
.hintv-up { padding: 0 16px 8px; }
.hintv-up-day {
  background: var(--hd-surface);
  overflow: hidden;
  border: 1px solid var(--hd-border);
  border-radius: var(--hd-radius);
  box-shadow: var(--hd-shadow);
  margin-bottom: 8px;
  overflow: hidden;
  animation: hd-fadein .25s ease both;
}
.hintv-up-day-head {
  /* v7.40.0: 日付の帯を面で区切って、どこからどこまでが同じ日か一目で分かるように */
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 12px 16px 10px;
  background: rgba(10,120,172,.05);
  border-bottom: 1px solid var(--hd-border);
  cursor: pointer;
}
.hintv-up-day-head:hover { background: rgba(10,120,172,.10); }
.hintv-up-date { font-size: 17px; font-weight: 900; color: var(--hd-ink); letter-spacing: .01em; }
.hintv-up-date.sun, .hintv-up-date.holiday { color: #d63a4a; }
.hintv-up-date.sat { color: #1a6ed8; }
/* 「今日」「明日」など、日付との距離を言葉で出す */
.hintv-up-rel {
  font-size: 10px; font-weight: 700; letter-spacing: .04em;
  padding: 2px 8px; border-radius: 20px;
  background: rgba(10,120,172,.10); color: var(--hd-accent);
  border: 1px solid rgba(10,120,172,.25);
}
.hintv-up-rel.is-today { background: var(--hd-accent); color: #fff; border-color: var(--hd-accent); }
.hintv-up-count { margin-left: auto; font-size: 11px; color: var(--hd-text2); }
.hintv-up-list { list-style: none; margin: 0; padding: 6px 16px 12px; font-size: .78rem; color: #2d4a5e; }
/* 行の間にゆとりを持たせ、最後の行の罫線は消す（帯の底と二重にならないように） */
.hintv-up-list > li { padding-top: 9px !important; padding-bottom: 9px !important; }
.hintv-up-list > li:last-child { border-bottom: none !important; }
.hintv-up-more {
  width: 100%; padding: 11px;
  background: var(--hd-surface); color: var(--hd-accent);
  border: 1.5px solid var(--hd-border2); border-radius: 10px;
  font-size: 12px; font-weight: 700; font-family: var(--hd-font);
  cursor: pointer; margin: 4px 0 16px; transition: all .15s;
}
.hintv-up-more:hover { border-color: var(--hd-accent); box-shadow: var(--hd-shadow-h); }
.hintv-up-empty { text-align: center; color: var(--hd-text3); font-size: 13px; padding: 32px 0; }

/* ── v7.41.0: 予定ビュー（月別） ─────────────────────────────
   スマホでは「タブ → ‹ 〇月 › → 予定」の縦並び。月ナビは画面上部に貼り付けて、
   どの日を見ていても月を変えられるようにする。ミニカレンダーとフィルターは
   同じ情報を二重に出すことになるので、この幅では隠す。 */
.hintv-up-head { display: flex; align-items: baseline; gap: 10px; padding: 2px 2px 10px; }
.hintv-up-head-title { font-size: 16px; font-weight: 900; color: var(--hd-ink); }
.hintv-up-head-sub   { font-size: 12px; color: var(--hd-text2); }
.hintv-up-day.is-past  { opacity: .62; }
.hintv-up-day.is-today { border-color: var(--hd-accent); box-shadow: 0 0 0 2px rgba(75,174,216,.25), var(--hd-shadow); }
/* ミニカレンダーで選んだ日を一瞬わかるように */
.hintv-up-day.is-picked { border-color: var(--hd-accent); box-shadow: 0 0 0 3px rgba(10,120,172,.20), var(--hd-shadow); }

/* v7.42.2: 予定ビューでは中央の月リストと「選んだ日の応援日記」パネルは出さない。
   DOM順では #hintv-cal-detail が予定一覧より前にあるので、ここで隠しておかないと
   狭い画面で予定リストの先頭に「今日の日記」が挟まって出てしまう
   （以前はこの指定が 960px 以上のブロックの中にしか無かった）。 */
#hintv-diary-calendar.view-upcoming .hintv-ml,
#hintv-diary-calendar.view-upcoming #hintv-cal-detail { display: none !important; }

/* v7.42.2: 〜959px（スマホ〜小さめのタブレット）。
   ミニカレンダーとフィルターは月ナビと同じ情報になるので隠し、
   「タブ」と「‹ 〇月 今日 ›」の2段だけを画面の上に貼り付ける。
   ※しきい値は 1199px から 959px へ引き下げた。テーマのコンテンツ幅が
     約1100px なので、PCで全画面にしても常にこちらの枝に落ちてしまい、
     「左が丸ごと空いて右の細い列に予定が押し込まれる」崩れ方をしていた。 */
@container hdwrap (max-width: 959px) {
  #hintv-diary-calendar.view-upcoming .hintv-cal-grid-wrap,
  #hintv-diary-calendar.view-upcoming .hintv-cal-filters { display: none !important; }
  /* .hintv-cal-main は月ナビ1個ぶんの高さしか無く、その中では sticky が粘れない。
     予定ビューのときだけ display:contents で中身を .hintv-cal-body 直下へ昇格させる。 */
  #hintv-diary-calendar.view-upcoming .hintv-cal-main { display: contents; }
  #hintv-diary-calendar.view-upcoming .hintv-cal-viewtabs {
    position: sticky;
    top: 0;
    z-index: 7;
    background: var(--hd-bg);
    margin: 0;
    padding-block: 8px;
  }
  #hintv-diary-calendar.view-upcoming .hintv-diary-cal-nav {
    position: sticky;
    /* 上の段（タブ）の高さは JS が実測して変数に入れる */
    top: var(--hd-up-tabs-h, 52px);
    z-index: 6;
    background: var(--hd-bg);
    padding-block: 8px;
    margin: 0;
    box-shadow: 0 2px 8px rgba(17,74,110,.06);
  }
}

/* ── v7.39.0: 参戦予定ビュー（スマホ幅のタブ） ────────────────────
   上＝いまの参戦予定／下＝これから登録できるイベント。
   広い画面では同じ情報が「今後の予定」の右カラムに出るのでタブごと隠す。 */
.hintv-at { padding: 0 16px 8px; }
.hintv-at-sec { margin-bottom: 18px; }
.hintv-at-head {
  display: flex; align-items: baseline; gap: 8px;
  font-size: 14px; font-weight: 900; color: var(--hd-ink);
  padding: 2px 2px 8px;
}
.hintv-at-head span { margin-left: auto; font-size: 11px; font-weight: 700; color: var(--hd-text2); }
/* v7.171.0: 参戦予定一覧を画像にする（件数の右）。色はスキン（カスタムパス）の --hd-accent に従う */
.hintv-at-export {
  flex: 0 0 auto; align-self: center;
  font: inherit; font-size: 11.5px; font-weight: 800; line-height: 1;
  color: var(--hd-accent); background: var(--hd-surface, #fff);
  border: 1px solid var(--hd-accent); border-radius: 999px;
  padding: 6px 11px; cursor: pointer; white-space: nowrap;
}
.hintv-at-export:hover { background: var(--hd-accent); color: #fff; }
.hintv-at-empty { font-size: 12.5px; color: var(--hd-text2); line-height: 1.6; padding: 14px 2px; }
.hintv-at-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.hintv-at-item {
  display: flex; align-items: center; gap: 10px;
  background: var(--hd-surface);
  border: 1px solid var(--hd-border);
  border-radius: 12px;
  box-shadow: var(--hd-shadow);
  padding: 10px 12px;
}
.hintv-at-item.is-soon  { border-color: rgba(10,120,172,.35); }
.hintv-at-item.is-today { border-color: var(--hd-accent); background: rgba(10,120,172,.08); }
.hintv-at-days {
  flex: 0 0 auto; min-width: 52px; text-align: center;
  font-size: 13px; font-weight: 900; color: var(--hd-accent);
  font-variant-numeric: tabular-nums; line-height: 1.2;
}
.hintv-at-days.is-plain { color: var(--hd-text2); font-weight: 700; }
.hintv-at-body  { flex: 1; min-width: 0; }
.hintv-at-title { font-size: 13px; font-weight: 700; color: var(--hd-text); line-height: 1.45;
                  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hintv-at-date  { font-size: 11px; color: var(--hd-text2); margin-top: 2px; }
.hintv-at-item .hd-att-btn { flex: 0 0 auto; }

/* ── v7.44.0: 参戦予定タブのジャンル絞り込み ──────────────────────
   「いまの参戦予定」と「追加できるイベント」の両方に同じ絞り込みを効かせる。
   チップの見た目はカレンダーの種別フィルター（.hintv-cal-filter-chip）を
   そのまま使い回すので、ここでは並びと補助パーツだけ定義する。 */
.hintv-at-filters {
  display: flex; align-items: center; gap: 6px;
  padding: 0 2px 12px;
  overflow-x: auto; scrollbar-width: none;
}
.hintv-at-filters::-webkit-scrollbar { display: none; }
.hintv-at-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.hintv-at-chip-n { font-size: 10.5px; font-weight: 800; opacity: .72; font-variant-numeric: tabular-nums; }

/* ── v7.36.0: 今後の予定 ＋ 参戦予定カウントダウン ────────────────
   一覧は1列固定なので広い画面では右が丸ごと余っていた。そこに
   「自分が次に行くイベント」までの残り日数を添える。 */
.hintv-upwrap { display: grid; gap: 16px; padding: 0 16px; align-items: start; }
/* v7.40.0: 「今後の予定」は2週間の一覧だけ。参戦予定は専用タブへ集約したので出さない。 */
.hintv-upwrap .hintv-cd { display: none !important; }
.hintv-upwrap .hintv-up { padding: 0; max-width: none; }
.hintv-cd {
  background: var(--hd-surface);
  border: 1px solid var(--hd-border);
  border-radius: var(--hd-radius);
  box-shadow: var(--hd-shadow);
  padding: 14px 16px 16px;
  margin-bottom: 16px;
}
.hintv-cd:empty { display: none; }   /* 未ログイン・ohisama-friends 無しでは枠ごと消す */
.hintv-cd-head  { font-size: 14px; font-weight: 900; color: var(--hd-ink); margin-bottom: 10px; }
.hintv-cd-empty { font-size: 12px; color: var(--hd-text2); line-height: 1.6; }
.hintv-cd-list  { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.hintv-cd-item  {
  display: flex; align-items: center; gap: 12px;
  background: rgba(10,120,172,.06);
  border: 1px solid var(--hd-border);
  border-radius: 10px;
  padding: 9px 11px;
}
.hintv-cd-item.is-soon  { border-color: rgba(10,120,172,.35); background: rgba(10,120,172,.10); }
.hintv-cd-item.is-today { border-color: var(--hd-accent); background: rgba(10,120,172,.16); }
.hintv-cd-days {
  flex: 0 0 auto; min-width: 46px; text-align: center;
  display: flex; flex-direction: column; align-items: center; line-height: 1.05;
}
.hintv-cd-days b    { font-size: 21px; font-weight: 900; color: var(--hd-accent); font-variant-numeric: tabular-nums; }
.hintv-cd-days span { font-size: 10px; font-weight: 700; color: var(--hd-text2); }
.hintv-cd-item.is-today .hintv-cd-days b { font-size: 17px; }
.hintv-cd-body  { min-width: 0; flex: 1; }
.hintv-cd-title { font-size: 12.5px; font-weight: 700; color: var(--hd-text); line-height: 1.4;
                  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hintv-cd-date  { font-size: 11px; color: var(--hd-text2); margin-top: 2px; }
.hintv-up-loading { text-align: center; color: var(--hd-text2); font-size: 13px; padding: 32px 0; }

/* ── 画面幅ごとのサイズ調整 ──────────────────────────────
   従来は max-width:540px 固定で、スマホでは日付セルが小さく、
   PCでは画面の大半が余っていた。 */
/* v7.35.2: レイアウトの分岐をビューポート幅ではなく「この要素の実幅」で決める。
   ページのコンテンツ幅がビューポートより狭いテーマだと、ウィンドウが広いだけで
   3カラムに切り替わり、実際には収まらず列が潰れて崩れていた（幅指定に vw を
   使っていたのも同じ理由で悪さをしていた）。コンテナクエリに寄せて解決する。 */
.hintv-diary-wrap {
  width: 100%;
  max-width: 100%;
  margin-inline: auto;
  box-sizing: border-box;
  container-type: inline-size;
  container-name: hdwrap;
}
.hintv-cal-body > * { min-width: 0; }            /* 中身の最小幅で列が押し広がるのを防ぐ */
.hintv-cal-nav-label { white-space: nowrap; }    /* 「2026年8月」が3行に折れるのを防ぐ */
.hintv-cal-body { display: block; }
/* v7.31.0: 左レールの中身は並び替えたいので flex 列にしておく。
   狭い画面＝月ナビ→フィルター→カレンダー（従来の並び）、
   1200px以上の左レール＝月ナビ→カレンダー→フィルター（ハロプロ式）。 */
.hintv-cal-main { display: flex; flex-direction: column; }
.hintv-cal-main .hintv-diary-cal-nav { order: 0; }
.hintv-cal-main .hintv-cal-filters   { order: 1; }
.hintv-cal-main .hintv-cal-grid-wrap { order: 2; }

/* スマホ：文字と当たり判定を少し大きく。横幅は目一杯使う */
@media (max-width: 599px) {
  .hintv-diary-wrap { border-radius: 12px; }
  .hintv-diary-cal-grid { gap: 3px; }
  .hintv-diary-cal-day { font-size: 14px; }
  .hintv-diary-cal-day .cal-day-num { font-size: 14px; }
  .cal-dot { width: 6px; height: 6px; }
  .hintv-diary-cal-btn { width: 40px; height: 40px; font-size: 18px; }
  .hintv-cal-filter-chip { padding: 9px 14px; }
  .hintv-cal-viewtab { padding: 11px 12px; }
  .hd-bell-btn { min-width: 30px; min-height: 30px; }
}

/* タブレット以上：本体を広げる */
@container hdwrap (min-width: 600px) {
  .hintv-diary-cal-day { font-size: 14px; }
}

/* ── v7.31.0: 今月の公式予定を流す中央カラム ─────────────────
   月グリッドは「その日に何かあるか」しか分からない。日をタップして
   初めて中身が出る構造だと、月ぜんぶを見渡すのに何度もタップがいる。
   広い画面では予定そのものを1本の流れで置き、日付は左のレールで示す。 */
.hintv-ml { display: none; }              /* 3カラムになるまでは出さない */
.hintv-ml-day { display: flex; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--hd-border); }
.hintv-ml-day:last-of-type { border-bottom: none; }
.hintv-ml-day.is-selected { background: rgba(10,120,172,.05); border-radius: 10px; padding-inline: 8px; }
/* 左端の日付レール */
.hintv-ml-rail {
  flex-shrink: 0;
  width: 46px;
  text-align: center;
  cursor: pointer;
  border-radius: 10px;
  padding: 4px 0;
  align-self: flex-start;
  transition: background .15s;
}
.hintv-ml-rail:hover { background: rgba(10,120,172,.10); }
.hintv-ml-dnum { font-size: 17px; font-weight: 900; color: var(--hd-ink); line-height: 1.1; }
.hintv-ml-wday { font-size: 10px; font-weight: 700; letter-spacing: .06em; color: var(--hd-text2); }
.hintv-ml-day.is-sun  .hintv-ml-dnum, .hintv-ml-day.is-sun  .hintv-ml-wday,
.hintv-ml-day.is-holi .hintv-ml-dnum, .hintv-ml-day.is-holi .hintv-ml-wday { color: #d63a4a; }
.hintv-ml-day.is-sat  .hintv-ml-dnum, .hintv-ml-day.is-sat  .hintv-ml-wday { color: #1a6ed8; }
.hintv-ml-day.is-today .hintv-ml-rail { background: var(--hd-accent); }
.hintv-ml-day.is-today .hintv-ml-dnum, .hintv-ml-day.is-today .hintv-ml-wday { color: #fff; }
.hintv-ml-rows { flex: 1; min-width: 0; list-style: none; margin: 0; padding: 0; font-size: .73rem; color: #2d4a5e; }
/* v7.31.1: 予定行のリスト。従来は <ul style="font-size:.73rem"> のインライン指定で
   画面幅に応じた拡大ができなかったので、クラスに逃がした。行の中の時刻・場所・
   バッジも rem から em に変えてあるので、ここを変えれば行ごと拡縮する。 */
.hd-sched-list { list-style: none; margin: 0; padding: 0; font-size: .73rem; color: #2d4a5e; }
/* v7.42.2: 予定1行の見た目をインライン style からクラスへ全面移設。
   v7.34.2 で入れた .hd-sched-main{min-width:11em} は、タイトルの div 自身が
   JS から style="flex:1;min-width:0" を直接吐かれていたため一度も効いていなかった
   （インライン指定はスタイルシートに勝つ）。結果、幅が足りない画面では
   タイトルが 0 幅まで潰れて1文字ずつ縦一列になっていた。
   ＝JS がインラインで吐く値は CSS では直せない、という前提でクラスへ寄せる。 */
.hd-sched-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 3px 6px;
  padding: 5px 0;
  border-bottom: 1px solid rgba(10,120,172,.10);
}
.hd-sched-link {
  display: flex; align-items: flex-start; gap: 4px;
  flex: 1 1 auto; min-width: 0;
  color: inherit; text-decoration: none;
}
.hd-sched-icon { flex: 0 0 auto; }
.hd-sched-time { flex: 0 0 auto; font-size: .93em; color: #2f7f9e; font-variant-numeric: tabular-nums; }
.hd-sched-main { flex: 1 1 auto; min-width: 8em; }
/* break-all は語の途中でも無条件に割るので「ひなたフェス2026」まで割れていた。
   anywhere なら入りきらないときだけ割る。 */
.hd-sched-title { line-height: 1.4; overflow-wrap: anywhere; }
.hd-sched-place { font-size: .89em; color: #2f7f9e; margin-top: 1px; overflow-wrap: anywhere; }
/* v7.124.1: 出演メンバーのチップ（アー写＋名前）。タイトルに埋もれた名前を前に出す */
.hd-sched-mem { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 3px; }
.hd-sched-mem-chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: .95em; font-weight: 700; color: var(--hd-accent, #0a78ac);
  background: rgba(10,120,172,.08); border: 1px solid rgba(10,120,172,.22);
  border-radius: 999px; padding: 1px 8px 1px 2px; line-height: 1.5; white-space: nowrap;
}
.hd-sched-mem-ph {
  width: 1.45em; height: 1.45em; border-radius: 50%; object-fit: cover; object-position: top;
  background: #dfe9f1; flex: 0 0 auto;
}
.hd-sched-mem-ph.is-blank { display: inline-flex; align-items: center; justify-content: center; font-size: .8em; }
.hd-sched-mem-more { font-size: .85em; color: var(--hd-text3, #6b7785); align-self: center; }
.hd-sched-type  { font-size: .82em; padding: 1px 5px; border-radius: 3px; white-space: nowrap; }
/* 種別バッジ・＋参戦・ここに行く・🔔 をひとつの塊にまとめて右端へ */
.hd-sched-acts {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: 4px; margin-left: auto; flex: 0 0 auto;
}
.hd-sched-personal { display: flex; gap: 4px; flex-wrap: wrap; flex: 0 0 100%; margin-top: 3px; }
@media (max-width: 599px) {
  /* スマホでは操作系を丸ごと2段目へ落とし、1段目はアイコン＋時刻＋タイトルが独占する */
  .hd-sched-acts { flex: 0 0 100%; justify-content: flex-end; margin-top: 2px; }
  .hd-sched-main { min-width: 6em; }
}
.hintv-ml-head { display: flex; align-items: baseline; gap: 8px; padding: 2px 0 8px; }
.hintv-ml-title { font-size: 14px; font-weight: 900; color: var(--hd-ink); }
.hintv-ml-sub { font-size: 11px; color: var(--hd-text2); }
.hintv-ml-empty { text-align: center; color: var(--hd-text3); font-size: 13px; padding: 40px 0; }
.hintv-ml-holi { font-size: 10px; color: #d63a4a; }

/* ── v7.35.0: 「日記」ビュー（応援の記録を月カレンダーで） ──────────
   中央カラムを公式予定リストと入れ替える。左レール（月ナビ・ミニカレンダー）と
   右カラム（選んだ日の応援日記）はそのまま共用する。 */
.hintv-dm { display: none; }
#hintv-diary-calendar.view-diary .hintv-ml { display: none !important; }
#hintv-diary-calendar.view-diary .hintv-dm {
  display: block;
  background: var(--hd-surface);
  border: 1px solid var(--hd-border);
  border-radius: var(--hd-radius);
  box-shadow: var(--hd-shadow);
  padding: 14px 16px 16px;
}
/* 種別フィルターは公式予定用なので日記ビューでは出さない */
#hintv-diary-calendar.view-diary .hintv-cal-filters { display: none !important; }
/* v7.35.1: 中央に月別の情報が全部出るので、左のミニカレンダーは幅に関係なく不要。
   ただし月の切り替え（‹ ›）と「今日」は要るので、月ナビだけは残す。 */
#hintv-diary-calendar.view-diary .hintv-cal-grid-wrap { display: none !important; }

/* 月まとめ */
.hintv-dm-stats {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 4px 0 14px;
}
.hintv-dm-stat {
  /* v7.37.0: カレンダーのセルと同じ高さに揃える（--hd-dm-cell-h）。
     以前は中身なりの高さで、まとめの帯だけが背高になっていた。 */
  flex: 1 1 88px;
  min-height: var(--hd-dm-cell-h, 62px);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: rgba(10,120,172,.06);
  border: 1px solid var(--hd-border);
  border-radius: 10px;
  padding: 6px;
  text-align: center;
  line-height: 1.25;
  box-sizing: border-box;
}
.hintv-dm-stat b    { display: block; font-size: 19px; font-weight: 900; color: var(--hd-ink); }
.hintv-dm-stat span { font-size: 10.5px; color: var(--hd-text2); white-space: nowrap; }

/* 月グリッド */
.hintv-dm-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.hintv-dm-wd {
  text-align: center; font-size: 10px; font-weight: 700;
  letter-spacing: .06em; color: var(--hd-text2); padding-bottom: 4px;
}
.hintv-dm-wd.sun { color: #d63a4a; }
.hintv-dm-wd.sat { color: #1a6ed8; }
.hintv-dm-grid, .hintv-dm-stats { --hd-dm-cell-h: 62px; }
.hintv-dm-cell {
  min-height: var(--hd-dm-cell-h);
  border: 1px solid var(--hd-border);
  border-radius: 8px;
  padding: 4px 4px 3px;
  background: var(--hd-surface);
  cursor: pointer;
  transition: border-color .15s, background .15s;
  overflow: hidden;
}
.hintv-dm-cell.is-empty { border: none; background: transparent; cursor: default; }
.hintv-dm-cell:not(.is-empty):hover { border-color: var(--hd-accent); background: rgba(10,120,172,.05); }
/* 記録のある日だけ面を持たせる＝続いている手応えが一目で分かる */
.hintv-dm-cell.has-record { background: rgba(10,120,172,.07); border-color: rgba(10,120,172,.28); }
.hintv-dm-cell.is-future  { opacity: .45; }
.hintv-dm-cell.is-today   { border-color: var(--hd-accent); box-shadow: 0 0 0 2px rgba(75,174,216,.30); }
.hintv-dm-cell.is-selected{ background: rgba(10,120,172,.16); border-color: var(--hd-accent); }
.hintv-dm-num { font-size: 13px; font-weight: 700; color: var(--hd-text2); line-height: 1.1; }
.hintv-dm-cell.has-record .hintv-dm-num { color: var(--hd-ink); font-weight: 900; }
.hintv-dm-cell.is-sun  .hintv-dm-num,
.hintv-dm-cell.is-holi .hintv-dm-num { color: #d63a4a; }
.hintv-dm-cell.is-sat  .hintv-dm-num { color: #1a6ed8; }
.hintv-dm-marks { display: flex; flex-wrap: wrap; gap: 2px; margin-top: 3px; }
.hintv-dm-marks span {
  font-size: 9.5px; font-weight: 700; line-height: 1.35;
  padding: 0 3px; border-radius: 4px;
  background: #fff; border: 1px solid var(--hd-border);
  color: var(--hd-text2); white-space: nowrap;
}
.hintv-dm-streak { color: #a06308 !important; border-color: rgba(160,99,8,.35) !important; }

@container hdwrap (min-width: 1200px) {
  /* v7.35.1: ミニカレンダーが消えるぶん左レールは月ナビだけになるので、
     3カラムをやめて「上に月ナビ／下に日記グリッド」＋右に選択日パネルの2カラムへ。
     日記グリッドが中央カラムの幅ではなく左＋中央ぶんを使えるようになる。 */
  #hintv-diary-calendar.view-diary .hintv-cal-body {
    grid-template-columns: minmax(0, 1fr) 340px;
    grid-template-rows: auto 1fr;
  }
  #hintv-diary-calendar.view-diary .hintv-diary-cal-nav {
    grid-column: 1; grid-row: 1;
    max-width: 440px; margin: 0 auto 4px 0;
  }
  #hintv-diary-calendar.view-diary .hintv-dm { grid-column: 1; grid-row: 2 / -1; }
  /* v7.37.1: 右カラムの天面を日記グリッドの天面に合わせる。
     1行目は月ナビだけの行なので、右も2行目から始めれば両カードの上端が揃う
     （カレンダービューは左右とも1行目始まりで元から揃っている）。 */
  #hintv-diary-calendar.view-diary #hintv-cal-detail { grid-column: 2; grid-row: 2 / -1; }
  .hintv-dm-grid, .hintv-dm-stats { --hd-dm-cell-h: 84px; }
  .hintv-dm-cell { padding: 6px 6px 5px; }
  .hintv-dm-num  { font-size: 15px; }
  .hintv-dm-marks span { font-size: 11px; padding: 1px 5px; }
  .hintv-dm-wd   { font-size: 11px; }
  .hintv-dm-stat b { font-size: 22px; }
  .hintv-dm-stat span { font-size: 11.5px; }
}
@media (max-width: 599px) {
  .hintv-dm-grid, .hintv-dm-stats { --hd-dm-cell-h: 54px; }
  .hintv-dm-cell { padding: 3px 2px; }
  .hintv-dm-marks span { font-size: 9px; padding: 0 2px; }
}

/* PC：カレンダーの右に選択日パネルを並べ、月をめくらず読めるようにする */
@container hdwrap (min-width: 960px) {
  .hintv-cal-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 400px);
    grid-template-rows: auto auto auto 1fr;
    gap: 16px;
    align-items: start;
    padding: 0 16px;
  }
  .hintv-cal-grid-wrap { margin: 0; }
  /* v7.35.2: ここは2カラム宣言。以前は detail を3列目に置いていたため
     暗黙の3列目ができ、コンテナが 960〜1199px のときレイアウトが崩れていた。
     中央の公式予定リスト(.hintv-ml)はこの幅では非表示なので左列に畳む。 */
  .hintv-cal-body .hintv-cal-main   { display: contents; }
  .hintv-cal-body .hintv-diary-cal-nav { grid-column: 1; grid-row: 1; max-width: 440px; margin: 0 0 4px; padding-inline: 0; }
  .hintv-cal-body .hintv-cal-grid-wrap { grid-column: 1; grid-row: 2; }
  .hintv-cal-body .hintv-cal-filters   { grid-column: 1; grid-row: 3; padding-inline: 0; }
  .hintv-cal-body .hintv-upwrap     { grid-column: 1 / -1; grid-row: 2 / -1; }
  #hintv-diary-calendar.view-upcoming .hintv-ml,
  #hintv-diary-calendar.view-upcoming #hintv-cal-detail { display: none !important; }
  .hintv-cal-body .hintv-ml         { grid-column: 1; grid-row: 2 / -1; }
  .hintv-cal-body .hintv-dm         { grid-column: 1; grid-row: 2 / -1; }
  .hintv-cal-body #hintv-cal-detail { grid-column: 2; grid-row: 2 / -1; position: sticky; top: 16px; }
  .hintv-cal-body .hintv-cal-day-panel { padding: 0 0 16px; }
  .hintv-diary-cal-day { font-size: 15px; }
  .hintv-diary-cal-day .cal-day-num { font-size: 15px; }
  .cal-dot { width: 6px; height: 6px; }
  .hintv-diary-cal-weekday { font-size: 11px; }
  .hintv-cal-main .hintv-diary-cal-nav,
  .hintv-cal-main .hintv-cal-filters { padding-inline: 0; }
  /* 表示切替タブと月ナビは横いっぱいに伸ばさない（矢印が両端に飛ぶのを防ぐ） */
  .hintv-cal-viewtabs { max-width: 440px; }
  /* v7.40.0: 参戦予定タブはPCでも出す。左＝追加できるイベント／右＝いまの参戦予定。
     追加候補のほうが件数が多く目を通す対象なので広い左に置き、
     すでに決まっている予定は右で追従（sticky）させる。 */
  #hintv-cal-attend {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
    gap: 20px;
    align-items: start;
  }
  /* DOM順は「いまの参戦予定」が先（スマホで上に出したい）なので、
     行を明示しないと候補が2行目へ回されて左上が空く。 */
  /* v7.44.0: 絞り込みチップは2列にまたがる独立行。セクションは2行目へ下げる。 */
  .hintv-at-filters   { grid-column: 1 / -1; grid-row: 1; padding-bottom: 2px; }
  .hintv-at-sec--cand { grid-column: 1; grid-row: 2; margin-bottom: 0; }
  .hintv-at-sec--mine { grid-column: 2; grid-row: 2; margin-bottom: 0; position: sticky; top: 16px; }

  /* ── v7.42.2: 予定ビューのPCレイアウト ──────────────────────
     旧：左列が minmax(0,1fr) の大きな列なのに、ミニカレンダーは
     「1199px以下は隠す」指定に引っかかって中身が無く、予定一覧は
     右の 320〜400px に押し込まれていた＝画面比率によっては
     「左半分が真っ白／予定が細い」形に崩れる。
     新：左＝ミニカレンダー208px固定／右＝予定一覧、の2カラムに明示する。
     さらに月ナビ・カレンダー・フィルターは静止させ、予定一覧だけが
     内側でスクロールする（sticky ではなく内側スクロール方式）。 */
  #hintv-diary-calendar.view-upcoming .hintv-cal-body {
    grid-template-columns: 208px minmax(0, 1fr);
    grid-template-rows: auto auto auto 1fr;
    max-height: calc(100vh - 24px);
  }
  #hintv-diary-calendar.view-upcoming .hintv-upwrap {
    grid-column: 2;
    grid-row: 1 / -1;
    align-self: stretch;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0 4px 0 0;
  }
  /* ミニカレンダーは「月の中を移動するための操作盤」なので半分の大きさで足りる */
  #hintv-diary-calendar.view-upcoming .hintv-diary-cal-nav { max-width: none; }
  #hintv-diary-calendar.view-upcoming .hintv-diary-cal-grid { gap: 2px; }
  #hintv-diary-calendar.view-upcoming .hintv-diary-cal-day { font-size: 11px; }
  #hintv-diary-calendar.view-upcoming .hintv-diary-cal-day .cal-day-num { font-size: 11px; }
  #hintv-diary-calendar.view-upcoming .hintv-diary-cal-weekday { font-size: 9px; padding-bottom: 4px; }
  #hintv-diary-calendar.view-upcoming .cal-dot { width: 3px; height: 3px; }
  #hintv-diary-calendar.view-upcoming .cal-streak { display: none; }
  #hintv-diary-calendar.view-upcoming .hintv-diary-cal-btn { width: 26px; height: 26px; font-size: 15px; }
  #hintv-diary-calendar.view-upcoming .hintv-cal-nav-label { font-size: 12px; }
  #hintv-diary-calendar.view-upcoming .hintv-cal-today-btn { font-size: 11px; padding: 3px 8px; }
  #hintv-diary-calendar.view-upcoming .hintv-cal-member-sel { font-size: 11px; padding: 4px 18px 4px 8px; margin-right: 6px; }
  #hintv-diary-calendar.view-upcoming .hintv-cal-filter-chip { font-size: 11px; padding: 5px 8px; }
  .hintv-diary-cal-nav { max-width: 440px; }
  /* 今後の予定は1列のまま幅だけ抑える。
     時系列のリストを段組みにすると、どちらの列を先に読むのかが曖昧になり、
     「次に何があるか」を追う目的に反するため、あえて段組みにしない。 */
  .hintv-up { max-width: 900px; }
  .hintv-upwrap { grid-template-columns: minmax(0, 1fr); }
  .hintv-upwrap .hintv-up { max-width: none; }
  .hintv-cd { position: sticky; top: 16px; }
  .hintv-cd-head { font-size: 15px; }
  .hintv-cd-title { font-size: 13.5px; }
}

/* ワイド：左レール（操作盤）／中央（今月の公式予定）／右（選んだ日の応援日記）
   v7.32.0: 幅の上限をほぼ外して画面いっぱいまで使う。中央の一覧は横に伸びるほど
   タイトルの折り返しが減って読みやすくなるので、余らせる理由がない。 */
@container hdwrap (min-width: 1200px) {
  .hintv-cal-body {
    /* v7.35.2: vw をやめてコンテナ基準の固定幅に。伸びたぶんは中央（予定一覧）へ */
    grid-template-columns: 264px minmax(0, 1fr) 340px;
    /* v7.38.0: 1行目=月ナビ / 2行目=ミニカレンダー / 3行目=フィルター / 4行目=余白。
       中央と右は2行目から最後まで伸ばす。余りは4行目が吸うので
       フィルターがカレンダーから引き離されない。 */
    grid-template-rows: auto auto auto 1fr;
    gap: 18px;
    padding-inline: 16px;
  }
  /* v7.38.0: カレンダービューも日記ビューと同じ「月ナビは上の独立行」に揃える。
     .hintv-cal-main を display:contents にして中身（月ナビ／ミニカレンダー／フィルター）を
     そのまま body のグリッド項目に昇格させ、1行目＝月ナビ、2行目から3カラム、という形にする。
     これで左のミニカレンダー・中央の予定一覧・右の選択日パネルの天面が揃う。 */
  .hintv-cal-body .hintv-cal-main   { display: contents; }
  .hintv-cal-body .hintv-diary-cal-nav {
    grid-column: 1; grid-row: 1;
    max-width: 440px; margin: 0 0 4px; padding-inline: 0;
  }
  .hintv-cal-body .hintv-cal-grid-wrap { grid-column: 1; grid-row: 2; position: sticky; top: 16px; }
  .hintv-cal-body .hintv-cal-filters   { grid-column: 1; grid-row: 3; padding-inline: 0; }
  .hintv-cal-body .hintv-upwrap     { grid-column: 2 / -1; grid-row: 2 / -1; }
  .hintv-cal-body .hintv-ml         { grid-column: 2; grid-row: 2 / -1; }
  .hintv-cal-body .hintv-dm         { grid-column: 2; grid-row: 2 / -1; }
  .hintv-cal-body #hintv-cal-detail { grid-column: 3; grid-row: 2 / -1; }
  /* 日記ビューは月ナビだけの左レール＝2カラム（下の .view-diary 側で上書き） */
  /* 左レールは縦に積み、スクロールしても付いてくる */
  .hintv-cal-main {
    gap: 10px;
    position: sticky;
    top: 16px;
  }
  .hintv-cal-main .hintv-cal-grid-wrap { order: 1; }
  .hintv-cal-main .hintv-cal-filters {
    order: 2;                     /* ミニカレンダーの下へ */
    flex-wrap: wrap;              /* 296px幅なので横スクロールでなく折り返す */
    overflow: visible;
    gap: 6px;
    padding: 0;
  }
  .hintv-cal-main .hintv-cal-filter-chip { flex-shrink: 1; padding: 7px 12px; font-size: 12.5px; }
  .hintv-cal-main .hintv-diary-cal-nav { max-width: none; margin: 0; }
  .hintv-cal-main .hintv-diary-cal-day { font-size: 14px; }
  .hintv-cal-main .hintv-diary-cal-day .cal-day-num { font-size: 14px; }
  .hintv-cal-main .hintv-diary-cal-weekday { font-size: 11px; }
  .hintv-cal-main .cal-dot { width: 5px; height: 5px; }
  .hintv-cal-main .cal-streak { display: none; }   /* 幅が足りないので省く */

  /* 中央：今月ぶんの予定を一本の流れで */
  .hintv-ml {
    display: block;
    background: var(--hd-surface);
    border: 1px solid var(--hd-border);
    border-radius: var(--hd-radius);
    box-shadow: var(--hd-shadow);
    padding: 14px 16px;
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    position: sticky;
    top: 16px;
  }
  .hintv-cal-body #hintv-cal-detail { max-height: calc(100vh - 32px); overflow-y: auto; }
  /* 3カラムでは月グリッドは操作盤なので、日付セルの主役は中央リスト側 */
  .hintv-diary-cal-grid { gap: 1px; }

  /* ── 文字サイズ。もともとスマホ基準（本文11.7px相当）で組んであるため、
        1360px幅で使うと全体が小さすぎる。中央リストと右カラムを読める大きさへ上げる ── */
  .hd-sched-list, .hintv-ml-rows { font-size: 15.5px; line-height: 1.55; }
  .hintv-ml-rows > li { padding: 9px 0; }
  .hintv-ml-dnum  { font-size: 21px; }
  .hintv-ml-wday  { font-size: 12px; }
  .hintv-ml-rail  { width: 58px; }
  .hintv-ml-title { font-size: 19px; }
  .hintv-ml-sub   { font-size: 13px; }
  .hintv-ml       { padding: 18px 24px; }
  .hintv-ml-day   { gap: 16px; padding: 12px 0; }
  .hintv-cal-viewtab { font-size: 15px; padding: 11px 14px; }
  .hintv-cal-nav-label { font-size: 16px; }
  .hintv-cal-year-month { font-size: 30px; }
  .hintv-cal-count { font-size: 14px; }
  .hintv-diary-title { font-size: 22px; }
  /* 右カラム＝応援日記 */
  .hintv-cal-body #hintv-cal-detail .hintv-diary-date-label   { font-size: 19px; }
  .hintv-cal-body #hintv-cal-detail .hintv-diary-streak       { font-size: 14px; }
  .hintv-cal-body #hintv-cal-detail .hintv-diary-role         { font-size: 12px; }
  .hintv-cal-body #hintv-cal-detail .hintv-diary-mission-tag  { font-size: 12px; }
  .hintv-cal-body #hintv-cal-detail .hintv-diary-memo         { font-size: 15.5px; }
  .hintv-cal-body #hintv-cal-detail .hintv-diary-tag          { font-size: 13px; }
  .hintv-cal-body #hintv-cal-detail .hintv-diary-edit         { font-size: 13px; }
  .hintv-cal-body #hintv-cal-detail .hintv-diary-pub          { font-size: 12px; }
  .hintv-cal-body .hintv-diary-schedule-title { font-size: 14px; }
  .hd-bell-btn { font-size: 1.25rem; }
  .hd-go-btn   { font-size: 13px; }
}

/* v7.124.1: 700〜1199px（テーマの器が約1100pxのPCはここに落ちる）でも予定行が
   スマホ基準の .73rem（≒11.7px）／.78rem のままで小さすぎた。中間の大きさへ上げる。
   1200px以上は下の 15.5px が上書きする。 */
@container hdwrap (min-width: 700px) {
  .hd-sched-list, .hintv-ml-rows, .hintv-up-list { font-size: 14px; line-height: 1.55; }
}
@container hdwrap (min-width: 960px) {
  .hd-sched-list, .hintv-ml-rows, .hintv-up-list { font-size: 14.5px; }
}
@container hdwrap (min-width: 1200px) {
  .hintv-up-list { font-size: 15.5px; }
}

/* 特大ディスプレイ：左右のカラムに余裕を持たせ、本文をもう一段上げる */
@container hdwrap (min-width: 1700px) {
  .hintv-cal-body {
    grid-template-columns: 340px minmax(0, 1fr) 440px;
    gap: 22px;
    padding-inline: 24px;
  }
  #hintv-diary-calendar.view-diary .hintv-cal-body {
    grid-template-columns: minmax(0, 1fr) 440px;
  }
  .hd-sched-list, .hintv-ml-rows { font-size: 16.5px; }
  .hintv-ml-dnum { font-size: 23px; }
  .hintv-ml-title { font-size: 21px; }
  .hintv-cal-main .hintv-diary-cal-day { font-size: 15px; }
  .hintv-cal-main .hintv-diary-cal-day .cal-day-num { font-size: 15px; }
  .hintv-cal-main .cal-dot { width: 6px; height: 6px; }
  .hintv-cal-body #hintv-cal-detail .hintv-diary-memo { font-size: 16.5px; }
}

/* 入力の取りこぼしを防ぐ：狙う対象は最低 32px 角 */
.hd-bell-btn, .hd-go-btn { min-height: 26px; }

/* ── v7.45.0: 未ログイン閲覧モードの導線 ── */
.hintv-guest-cta {
  margin: 12px 16px 0;
  padding: 12px 14px;
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  background: linear-gradient(135deg, #eaf6fd 0%, #f6fbff 100%);
  border: 1px solid var(--hd-border2);
  border-radius: 12px;
}
.hintv-guest-cta-txt { flex: 1 1 240px; min-width: 0; font-size: 12.5px; line-height: 1.75; color: var(--hd-text); }
.hintv-guest-cta-txt strong { color: var(--hd-accent); }
.hintv-guest-cta-btn {
  flex: 0 0 auto;
  display: inline-block; padding: 10px 18px; border-radius: 999px;
  background: var(--hd-accent); color: #fff !important;
  font-size: 13.5px; font-weight: 700; text-decoration: none;
  box-shadow: 0 3px 10px rgba(10,120,172,.28);
}
.hintv-guest-cta-btn:hover { background: #085f89; }
/* ゲスト時のSSRブロック（JSが起動したら除去される。no-JS環境・クローラ用） */
#hintv-ssr-upcoming { padding: 16px; }
#hintv-ssr-upcoming h2 { font-size: 17px; color: var(--hd-ink); margin: 0 0 10px; }
#hintv-ssr-upcoming h3 { font-size: 14px; color: var(--hd-ink); margin: 14px 0 4px; }
#hintv-ssr-upcoming ul { margin: 0; padding-left: 1.2em; }
#hintv-ssr-upcoming li { font-size: 13px; line-height: 1.8; color: var(--hd-text); }

@media (prefers-reduced-motion: reduce) {
  .hintv-diary-card, .hintv-up-day, .hintv-cal-day-panel { animation: none; }
  .hintv-cal-viewtab, .hintv-diary-cal-day, .hintv-diary-tab { transition: none; }
}

/* ══ v7.61.0: チケット販売タイムライン（参戦予定タブ）══════════════
   PC＝横に流れるタイムライン／スマホ＝縦。
   横は390pxだと4点が必ず潰れる（v7.41.3で1文字幅になったのと同じ話）ので、
   コンテナ幅で切り替える。 */
.hintv-at-sec--tk { grid-column: 1 / -1; }
.hintv-tk-card {
  border: 1px solid var(--hd-line, #e0e8f0);
  border-radius: 12px;
  background: #fff;
  margin-bottom: 8px;
  overflow: hidden;
}
.hintv-tk-head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  width: 100%; padding: 10px 12px;
  background: none; border: 0; cursor: pointer; text-align: left;
  font-family: inherit; font-size: .92rem;
}
.hintv-tk-head:hover { background: #f6fafd; }
.hintv-tk-caret { color: #8aa0b4; font-size: .8rem; }
/* タイトルに最低幅を持たせておくと、入りきらないときにバッジと「次:」が
   自然に2段目へ回る。flex-basis:100% で明示的に落とすとバッジが
   横いっぱいに伸びてしまうのでこの形にする。
   最低幅が無いとタイトルが数文字幅まで潰れる（v7.41.3と同じ失敗）。 */
.hintv-tk-name  { font-weight: 700; overflow-wrap: anywhere; flex: 1 1 auto; min-width: 12em; }
.hintv-tk-badge {
  font-size: .7rem; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  background: #12b886; color: #fff; white-space: nowrap;
}
.hintv-tk-next { font-size: .74rem; color: #5b6b7c; white-space: nowrap; }
.hintv-tk-body { padding: 0 12px 12px; }

.hintv-tk-stage { border-top: 1px dashed var(--hd-line, #e0e8f0); padding: 10px 0 4px; }
.hintv-tk-stage-head {
  display: flex; align-items: center; gap: 8px;
  font-size: .82rem; font-weight: 700; margin-bottom: 8px; overflow-wrap: anywhere;
}
.hintv-tk-state {
  font-size: .68rem; font-weight: 700; padding: 1px 7px; border-radius: 999px;
  background: #eef2f6; color: #6b7785; white-space: nowrap;
}
.hintv-tk-stage.is-open   .hintv-tk-state { background: #12b88622; color: #0d8a66; }
.hintv-tk-stage.is-closed .hintv-tk-state { background: #eef2f6;   color: #97a4b0; }
.hintv-tk-stage.is-closed { opacity: .62; }

/* 既定（スマホ）＝縦のタイムライン */
.hintv-tk-tl { list-style: none; margin: 0; padding: 0 0 0 6px; }
.hintv-tk-pt {
  position: relative; display: flex; align-items: baseline; gap: 8px;
  padding: 3px 0 3px 16px; font-size: .8rem;
}
.hintv-tk-pt::before {
  content: ''; position: absolute; left: 4px; top: 0; bottom: 0; width: 2px;
  background: var(--hd-line, #e0e8f0);
}
.hintv-tk-pt:first-child::before { top: 50%; }
.hintv-tk-pt:last-child::before  { bottom: 50%; }
.hintv-tk-dot {
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 10px; height: 10px; border-radius: 50%;
  background: #fff; border: 2px solid var(--hd-line, #cdd9e4);
}
.hintv-tk-pt.is-done .hintv-tk-dot { background: #12b886; border-color: #12b886; }
.hintv-tk-pl { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.hintv-tk-pd { color: #5b6b7c; white-space: nowrap; font-variant-numeric: tabular-nums; }
.hintv-tk-pt.is-todo .hintv-tk-pl { font-weight: 700; }

/* PC＝横に流れるタイムライン */
@container hdwrap (min-width: 700px) {
  .hintv-tk-sv { min-width: 0; }
  .hintv-tk-tl {
    display: flex; padding: 4px 0 0;
  }
  .hintv-tk-pt {
    flex: 1 1 0; min-width: 0;
    display: block; padding: 18px 8px 4px 0; text-align: left;
  }
  .hintv-tk-pt::before {
    left: 0; right: 0; top: 5px; bottom: auto; width: auto; height: 2px;
  }
  .hintv-tk-pt:first-child::before { left: 5px; top: 5px; }
  .hintv-tk-pt:last-child::before  { right: calc(100% - 6px); }
  .hintv-tk-dot { left: 0; top: 0; transform: none; }
  .hintv-tk-pl { display: block; font-size: .74rem; }
  .hintv-tk-pd { display: block; font-size: .76rem; white-space: normal; }
}

.hintv-tk-shows { border-top: 1px dashed var(--hd-line, #e0e8f0); padding-top: 10px; margin-top: 8px; }
.hintv-tk-sub   { font-size: .74rem; font-weight: 700; color: #6b7785; margin-bottom: 4px; }
.hintv-tk-show  { display: flex; gap: 8px; font-size: .8rem; padding: 2px 0; }
.hintv-tk-sd    { white-space: nowrap; font-variant-numeric: tabular-nums; color: #5b6b7c; }
/* 会場名にも最低幅を。無いとトレード期限のチップに押されて
   「愛知 クロコくんホール(日本ガイシホール)」が数文字幅まで潰れる。 */
.hintv-tk-sv    { flex: 1 1 auto; min-width: 10em; overflow-wrap: anywhere; }
.hintv-tk-link  { display: inline-block; margin-top: 10px; font-size: .8rem; }

/* v7.62.0: 公演ごとのチケトレ期限（公演前日で閉まる） */
.hintv-tk-show { flex-wrap: wrap; align-items: baseline; }
.hintv-tk-trade {
  font-size: .72rem; color: #0d8a66; white-space: nowrap;
  background: #12b8861a; border-radius: 999px; padding: 1px 8px;
}
.hintv-tk-trade.is-past { color: #97a4b0; background: #eef2f6; }

/* v7.100.0: 会場を持たない配信ぶん（リピート配信など）。
   チケトレの対象外なので期限チップは出さず、配信だと分かる印だけ置く。 */
.hintv-tk-stream {
  font-size: .72rem; color: #5b6b7c; white-space: nowrap;
  background: #eef2f6; border-radius: 999px; padding: 1px 8px;
}
.hintv-tk-stream.is-unknown { color: #97a4b0; background: transparent; padding: 0; }

/* v7.63.0: チケトレ受付中はチップをリンクに */
a.hintv-tk-trade.is-live { text-decoration: none; font-weight: 700; }
a.hintv-tk-trade.is-live:hover { background: #12b88633; }

/* v7.64.0: 一般販売（完売次第終了）は日付で閉まらないので別色にする */
.hintv-tk-stage.is-soldout .hintv-tk-state { background: #f59f0022; color: #b26a00; }
.hintv-tk-stage.is-soldout { opacity: 1; }
/* チケットタブは全幅で使う */
#hintv-cal-ticket { padding: 4px 12px 12px; }

/* v7.66.0: タブが5つ（カレンダー/予定/参戦予定/チケット/日記）になり、
   PCでも右端が切れて「日記」に到達できなくなった。
   v7.41.0 でスマホ向けに nowrap＋横スクロールにしたが、スクロールバーを
   隠しているためマウスでは動かせない。幅がある画面では折り返す。 */
@container hdwrap (min-width: 700px) {
  .hintv-cal-viewtabs { flex-wrap: wrap; overflow-x: visible; row-gap: 8px; }
}

/* ══ v7.68.0: 受付中ゲージ ══════════════════════════════════════
   「あっ、いま売ってる」が一目で分かるように。
   抽選先行＝経過ぶんを塗る／一般販売＝完売次第終了なので塗らずに流す。 */
.hintv-tk-gaugerow {
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 10px; flex-wrap: wrap;
}
.hintv-tk-gauge {
  flex: 1 1 auto; min-width: 8em; height: 8px;
  background: #e3ebf2; border-radius: 100px; overflow: hidden; position: relative;
}
.hintv-tk-gfill {
  display: block; height: 100%; border-radius: 100px;
  background: linear-gradient(90deg, #12b886, #0d8a66);
  animation: hintv-tk-grow .8s cubic-bezier(.22,.9,.3,1) both;
}
@keyframes hintv-tk-grow { from { width: 0; } }

/* 完売次第終了＝進捗の概念が無いので、流れるだけのバー */
.hintv-tk-gauge.is-indet { background: #fdf0d8; }
.hintv-tk-gflow {
  position: absolute; top: 0; bottom: 0; width: 40%;
  border-radius: 100px;
  background: linear-gradient(90deg, rgba(245,159,0,0), #f59f00, rgba(245,159,0,0));
  animation: hintv-tk-flow 1.8s linear infinite;
}
@keyframes hintv-tk-flow { from { left: -40%; } to { left: 100%; } }

.hintv-tk-remain { font-size: .74rem; font-weight: 700; color: #0d8a66; white-space: nowrap; }
.hintv-tk-gauge.is-indet ~ .hintv-tk-remain { color: #b26a00; }

/* 受付中のツアーはバッジをゆっくり呼吸させる（気づかせるためで、急かさない速さ） */
.hintv-tk-badge.is-live { animation: hintv-tk-breathe 2.4s ease-in-out infinite; }
@keyframes hintv-tk-breathe { 50% { box-shadow: 0 0 0 5px rgba(18,184,134,.18); } }

@media (prefers-reduced-motion: reduce) {
  .hintv-tk-gfill, .hintv-tk-gflow, .hintv-tk-badge.is-live { animation: none; }
  .hintv-tk-gflow { left: 30%; }
}

/* v7.69.0: 公式トレードは締切が公演ごとに散っているので、段階としては別扱い */
.hintv-tk-stage.is-trading .hintv-tk-state { background: #12b88622; color: #0d8a66; }
.hintv-tk-stage.is-trading { opacity: 1; }
.hintv-tk-remain.is-trade { color: #5b6b7c; font-weight: 600; white-space: normal; }

/* v7.123.0: 開催中止と払戻し。
   「受付中」の緑・「完売次第終了」のオレンジと混ざらないよう、払戻しは赤系（急ぎの手続き）、
   中止はグレー（もう動かない）で分ける。 */
.hintv-tk-cancel {
  display: inline-block; margin-right: 6px; padding: 1px 7px; border-radius: 999px;
  font-size: .7rem; font-weight: 700; line-height: 1.5; vertical-align: middle;
  color: #fff; background: #8a94a0;
}
.hintv-tk-head.is-cancelled .hintv-tk-name { color: #5b6b7c; }
.hintv-tk-badge.is-refund { background: #d6455a; color: #fff; animation: hintv-tk-breathe-rf 2.4s ease-in-out infinite; }
@keyframes hintv-tk-breathe-rf { 50% { box-shadow: 0 0 0 5px rgba(214,69,90,.18); } }

.hintv-tk-stage.is-cancelled { opacity: .55; }
.hintv-tk-stage.is-cancelled .hintv-tk-state { background: #eef2f6; color: #97a4b0; }
.hintv-tk-stage.is-cancelled .hintv-tk-pt.is-done .hintv-tk-dot { background: #c3ccd5; border-color: #c3ccd5; }

.hintv-tk-stage.is-kind-refund { border-top: 2px solid #f1c5cc; }
.hintv-tk-stage.is-refund_before .hintv-tk-state { background: #fbe9ec; color: #b8324a; }
.hintv-tk-stage.is-refund        .hintv-tk-state { background: #d6455a; color: #fff; }
.hintv-tk-stage.is-refund_closed .hintv-tk-state { background: #eef2f6; color: #97a4b0; }
.hintv-tk-stage.is-refund_closed { opacity: .62; }
.hintv-tk-stage.is-refund .hintv-tk-pt.is-done .hintv-tk-dot { background: #d6455a; border-color: #d6455a; }
.hintv-tk-gauge.is-refund { background: #fbe9ec; }
.hintv-tk-gauge.is-refund .hintv-tk-gfill { background: #d6455a; }
.hintv-tk-remain.is-refund { color: #b8324a; }

.hintv-tk-rfnote { font-size: .76rem; color: #5b6b7c; margin: 4px 0 2px; }
.hintv-tk-rflinks { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.hintv-tk-rflinks li { margin: 0; }
.hintv-tk-rflinks a {
  display: inline-block; font-size: .76rem; font-weight: 700; text-decoration: none;
  padding: 4px 10px; border-radius: 999px; border: 1px solid #f1c5cc; color: #b8324a; background: #fff;
}
.hintv-tk-rflinks a:hover { background: #fbe9ec; }
.hintv-tk-rfguide { margin-top: 8px; }

.hintv-tk-show.is-cancelled .hintv-tk-sd,
.hintv-tk-show.is-cancelled .hintv-tk-sv { color: #97a4b0; text-decoration: line-through; }
.hintv-tk-trade.is-cancel { color: #fff; background: #8a94a0; }

@media (prefers-reduced-motion: reduce) {
  .hintv-tk-badge.is-refund { animation: none; }
}
