/* ポッドキャストページ（発注者指示 2026-09-22、2026-10-03 に作り替え）
   ------------------------------------------------------------------
   番組「高島宗一郎のもちのロン」を、この頁のラジオで聴けるようにした。
     ・配信先（.pc-follow）………… 小さなしるしのリンク集（チャンネル登録・フォロー）。
                                   発注者指示で、見出しのすぐ下（いちばん上）
     ・昔懐かしのラジオ（.radio）… 押すと最新回が流れる。形は css/radio.css、
                                   動きは js/radio.js（2026-10-04 に、ほかの頁の小窓と
                                   いっしょに css/radio.css へ分けた）
     ・番組表（.guide）………………… 新聞のラジオ欄のつもり。押すとその回へ

   配信先のしるしは simple-icons（CC0）の現行の形。Amazon Music だけは
   simple-icons に収録が無いので、音符と笑顔の矢印で描いた近似（公式の
   画像をもらえたら差し替える）。色と角の丸みは site.css の紺と金にそろえる。 */

/* ── 番組表（新聞のラジオ欄）──────────────────────────────────────── */

.guide {
  margin-top: 22px;
  padding: 12px 14px 4px;
  border-radius: 6px;
  color: #2a1a0c;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, 0) 40%),
    #f1e7cf;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .35);
}
.guide__h {
  margin: 0;
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding-bottom: 7px;
  border-bottom: 3px double #2a1a0c;
  font: 800 17px/1.2 'Shippori Mincho', 'Noto Sans JP', serif;
  letter-spacing: .12em;
}
.guide__h small { font: 700 11px/1 'Noto Sans JP', sans-serif; letter-spacing: .06em; color: #6b5536; }
.guide__list { list-style: none; margin: 0; padding: 0; }
.guide__item + .guide__item { border-top: 1px dashed rgba(42, 26, 12, .35); }
.guide__btn {
  width: 100%;
  min-height: 48px;
  display: grid;
  grid-template-columns: 50px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 9px 2px;
  border: 0;
  background: none;
  color: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.guide__btn:active { background: rgba(42, 26, 12, .07); }
.guide__btn:focus-visible { outline: 2px solid #7a3d12; outline-offset: 1px; }
.guide__date { font: 800 13px/1.3 'Noto Sans JP', sans-serif; font-variant-numeric: tabular-nums; }
.guide__date small { display: block; font-size: 10.5px; font-weight: 700; color: #6b5536; }
.guide__title {
  font: 700 13.5px/1.45 'Noto Sans JP', sans-serif;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  overflow-wrap: anywhere;
}
.guide__side { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; font: 700 11px/1.2 'Noto Sans JP', sans-serif; color: #6b5536; white-space: nowrap; }
.guide__tag { font-weight: 900; font-size: 10px; letter-spacing: .06em; padding: 3px 6px 2px; border-radius: 4px; }
.guide__tag--new { color: #ffffff; background: #1d4fd0; }
.guide__tag--air { color: #ffffff; background: #d9302a; }   /* ラジオの ON AIR と同じ赤（白い字で 4.77） */
.guide__tag--done { color: #2d6a3a; background: rgba(45, 106, 58, .12); }
.guide__item.is-on .guide__title { color: #a3200f; }

/* ── 配信先（小さなしるしのリンク集）────────────────────────────────── */

.pc-follow { margin-top: 12px; }
/* ひと言と「フォローする」（YouTube のチャンネル登録の確認が開く）を横に並べる */
.pc-follow__head { display: flex; align-items: center; gap: 10px; }
.pc-follow__btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 36px;
  padding: 0 14px 0 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .02em;
  white-space: nowrap;
  text-decoration: none;
  color: #ffffff;
  background: linear-gradient(180deg, #ff2d2d, #d90000);
  box-shadow: 0 6px 16px rgba(217, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .3);
  -webkit-tap-highlight-color: transparent;
}
.pc-follow__btn:hover { color: #ffffff; filter: brightness(1.06); }
.pc-follow__btn:active { transform: translateY(1px); }
.pc-follow__btn svg { display: block; }
.pc-follow__lead {
  flex: 1;
  min-width: 0;
  margin: 0;
  color: #e6edf9;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
}
.pc-follow__row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 4px;
  margin-top: 6px;
}
.pc {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-height: 44px;
  padding: 4px 0 2px;
  border-radius: 12px;
  text-decoration: none;
  color: #c8d4e8;
  -webkit-tap-highlight-color: transparent;
}
.pc:hover { color: #ffffff; }
.pc:active { background: rgba(255, 255, 255, .06); }
.pc__ic {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #ffffff;
  background: rgba(255, 255, 255, .07);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2);
  transition: background .18s ease;
}
.pc__ic svg { width: 20px; height: 20px; display: block; fill: currentColor; }
.pc__ic--note svg { width: 18px; height: 18px; }
@media (hover: hover) {
  .pc:hover .pc__ic { background: rgba(255, 255, 255, .14); }
}
.pc__name {
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  letter-spacing: .01em;
}

/* 金色モード（神）：地が深い金になるので、文字とリンクの色を金の側へ */
html.tb-gold .pc-follow__lead { color: #fbf1d2; }
html.tb-gold .pc { color: #f2df9e; }
html.tb-gold .pc__ic { background: rgba(255, 240, 200, .1); box-shadow: inset 0 0 0 1px rgba(242, 223, 158, .4); color: #fff6dc; }