@charset "UTF-8";

/* 冠番組 放送回一覧・公式 YouTube 動画一覧（乃木坂工事中・そこ曲がり櫻坂・日向坂で会いましょう）
   旧 sakamichi-history.css から、この機能のルールを元の順番のまま移したもの（2026-09 Phase 7-1） */

/* =========================================================
   冠番組 放送回一覧
   ========================================================= */
.saka-variety-archive {
  --variety-archive-accent: var(--sakamichi-nogi-chip);
  --variety-archive-accent-rgb: var(--sakamichi-nogi-chip-rgb);
  --variety-archive-soft-bg: var(--sakamichi-nogi-bg);
  --variety-archive-link: var(--sakamichi-nogi-secondary);
}
.saka-variety-archive.theme-sakura {
  --variety-archive-accent: var(--sakamichi-sakura-chip);
  --variety-archive-accent-rgb: var(--sakamichi-sakura-chip-rgb, 179, 77, 107);
  --variety-archive-soft-bg: rgba(var(--sakamichi-sakura-chip-rgb, 179, 77, 107), 0.08);
  --variety-archive-link: var(--sakamichi-sakura-link);
}
.saka-variety-archive.theme-hinata {
  --variety-archive-accent: var(--sakamichi-hinata-chip);
  --variety-archive-accent-rgb: var(--sakamichi-hinata-chip-rgb);
  --variety-archive-soft-bg: rgba(var(--sakamichi-hinata-chip-rgb), 0.08);
  --variety-archive-link: var(--sakamichi-hinata-primary);
}
.variety-archive-stats {
  background: var(--sakamichi-warning-bg);
  border-color: var(--sakamichi-warning-border);
}
.variety-archive-stats p {
  color: var(--sakamichi-warning-text);
}
.variety-archive-stats strong {
  color: #664d03;
}
.variety-member-maintenance-note {
  margin-top: 5px !important;
  font-size: 0.78em !important;
  line-height: 1.4;
  opacity: 0.72;
}
.variety-archive-youtube-index-link {
  margin: -10px 0 12px;
  font-size: 0.8rem;
  line-height: 1.45;
  text-align: right;
}
.variety-archive-youtube-index-link a {
  color: var(--variety-archive-link);
  font-weight: 700;
  text-decoration: none;
}
.variety-archive-youtube-index-link a:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.variety-archive-controls {
  display: grid;
  grid-template-columns: minmax(210px, 1.15fr) minmax(190px, 1fr);
  gap: 12px 18px;
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid var(--sakamichi-hairline);
  border-radius: 2px;
  background: var(--sakamichi-paper);
}
.variety-archive-search,
.variety-archive-control-block {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
}
.variety-archive-control-block--sort {
  position: relative;
  padding-right: 116px;
}
.variety-archive-control-label {
  color: var(--sakamichi-ink-2);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.25;
}
.variety-archive-search-input {
  width: 100%;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--sakamichi-hairline-strong);
  border-radius: 2px;
  background: var(--sakamichi-paper-2);
  color: var(--sakamichi-ink-strong);
  font-size: 0.9rem;
}
.variety-archive-search-input:focus {
  border-color: var(--variety-archive-accent);
  outline: 2px solid rgba(var(--variety-archive-accent-rgb), 0.18);
  outline-offset: 1px;
}
.variety-archive-button-group,
.variety-archive-check-group {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.variety-archive-filter-button,
.variety-archive-sort-button,
.variety-archive-reset {
  appearance: none;
  min-height: 30px;
  padding: 4px 10px;
  border: 1px solid var(--sakamichi-hairline-strong);
  border-radius: 2px;
  background: var(--sakamichi-paper-2);
  color: var(--sakamichi-ink-2);
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
}
.variety-archive-filter-button:hover,
.variety-archive-sort-button:hover,
.variety-archive-reset:hover {
  border-color: var(--variety-archive-accent);
  color: var(--variety-archive-link);
}
.variety-archive-filter-button.is-active,
.variety-archive-sort-button.is-active {
  border-color: var(--variety-archive-accent);
  background: var(--variety-archive-soft-bg);
  color: var(--variety-archive-link);
}
.variety-archive-check-option {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 4px 9px;
  border: 1px solid var(--sakamichi-hairline);
  border-radius: 2px;
  background: var(--sakamichi-paper-2);
  color: var(--sakamichi-ink-2);
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 700;
}
.variety-archive-check-option input {
  width: 15px;
  height: 15px;
  margin: 0;
  accent-color: var(--variety-archive-accent);
}
.variety-archive-reset {
  position: absolute;
  right: 0;
  bottom: 0;
  background: var(--sakamichi-paper);
}
.saka-variety-archive .variety-archive-member-section:hover {
  border-color: var(--variety-archive-accent);
}
.saka-variety-archive .variety-archive-member-toggle:hover {
  color: var(--variety-archive-link);
}
.saka-variety-archive .variety-archive-member-body {
  border-top-color: rgba(var(--variety-archive-accent-rgb), 0.28);
}
.saka-variety-archive .variety-archive-member-section .member-grid {
  gap: 16px;
  margin-bottom: 0;
}
.saka-variety-archive .variety-archive-member-section .member-group__title {
  margin-bottom: 10px;
  padding-bottom: 4px;
  border-bottom-color: rgba(var(--variety-archive-accent-rgb), 0.25);
  color: var(--variety-archive-link);
  font-size: 0.88rem;
}
.saka-variety-archive .variety-archive-member-section .member-card {
  min-height: 28px;
  padding: 4px 8px;
  font-size: 0.75rem;
}
.saka-variety-archive .variety-archive-member-section .member-card:hover {
  border-color: var(--variety-archive-accent);
}
.saka-variety-archive .variety-archive-member-section .member-card--selected {
  border-color: var(--variety-archive-accent);
  background: var(--variety-archive-accent);
  color: #fff;
}
.variety-archive-table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.variety-archive-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--sakamichi-hairline);
  border-radius: 2px;
  background: var(--sakamichi-paper);
  table-layout: fixed;
  font-size: 0.84rem;
}
.variety-archive-col-episode {
  width: 180px;
}
.variety-archive-col-date {
  width: 105px;
}
.variety-archive-table th {
  padding: 7px 9px;
  border-right: 1px solid rgba(255, 255, 255, 0.25);
  background: var(--variety-archive-accent);
  color: #fff;
  font-weight: 700;
  text-align: left;
}
.variety-archive-table th:last-child {
  border-right: 0;
}
.variety-archive-row td {
  padding: 7px 9px;
  border-top: 1px solid var(--sakamichi-hairline);
  border-right: 1px solid var(--sakamichi-hairline);
  background: var(--sakamichi-paper);
  color: var(--sakamichi-ink-strong);
  line-height: 1.45;
  vertical-align: middle;
}
.variety-archive-row:first-child td {
  border-top: 0;
}
.variety-archive-row td:last-child {
  border-right: 0;
}
.variety-archive-row--stripe td {
  background: rgba(var(--variety-archive-accent-rgb), 0.035);
}
.variety-archive-row--legacy,
.variety-archive-detail-row--legacy {
  --variety-archive-accent: var(--sakamichi-keyaki-chip);
  --variety-archive-accent-rgb: var(--sakamichi-keyaki-chip-rgb, 60, 130, 52);
  --variety-archive-soft-bg: var(--sakamichi-keyaki-bg, var(--sakamichi-paper-2));
  --variety-archive-link: #1e6b28;
}
.variety-archive-row--legacy td {
  background: var(--sakamichi-paper);
}
.variety-archive-row--legacy.variety-archive-row--stripe td {
  background: rgba(var(--sakamichi-keyaki-chip-rgb, 60, 130, 52), 0.055);
}
.variety-archive-episode-cell {
  font-variant-numeric: tabular-nums;
}
.variety-archive-episode-cell__inner {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  min-width: 0;
}
.variety-archive-row-toggle {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  padding: 0;
  border: 1px solid var(--sakamichi-hairline-strong);
  border-radius: 2px;
  background: var(--sakamichi-paper-2);
  color: var(--variety-archive-link);
  cursor: pointer;
}
.variety-archive-row-toggle:hover,
.variety-archive-row-toggle:focus-visible {
  border-color: var(--variety-archive-accent);
  outline: none;
}
.variety-archive-row-toggle__icon {
  font-size: 0.68rem;
  transition: transform 0.16s ease;
}
.variety-archive-row-toggle[aria-expanded="true"] .variety-archive-row-toggle__icon {
  transform: rotate(90deg);
}
.variety-archive-episode {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 1px;
}
.variety-archive-episode strong {
  font-size: 0.92rem;
}
.variety-archive-program-label {
  color: var(--sakamichi-ink-3);
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1.25;
  white-space: nowrap;
}
.variety-archive-program-label__short,
.variety-archive-episode-date {
  display: none;
}
.variety-archive-date-cell {
  color: var(--sakamichi-ink-2);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.variety-archive-title-cell {
  overflow-wrap: anywhere;
}
.variety-archive-title-toggle {
  appearance: none;
  display: block;
  width: 100%;
  margin: 0;
  padding: 1px 0;
  border: 0;
  background: transparent;
  color: var(--variety-archive-link);
  cursor: pointer;
  font: inherit;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.45;
  text-align: left;
}
.variety-archive-title-toggle:hover .variety-archive-title-text {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
.variety-archive-title-toggle:focus-visible {
  border-radius: 2px;
  outline: 2px solid rgba(var(--variety-archive-accent-rgb), 0.5);
  outline-offset: 2px;
}
.variety-archive-title-line {
  display: block;
}
.variety-archive-title-note {
  color: var(--sakamichi-ink-3);
  font-size: 0.72rem;
  font-weight: 400;
}
.variety-archive-title-separator {
  display: none;
}
.variety-archive-title-line + .variety-archive-title-line {
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px dashed rgba(var(--variety-archive-accent-rgb), 0.22);
}
.variety-archive-detail-row[hidden],
.variety-archive-row[hidden] {
  display: none;
}
.variety-archive-detail-row td {
  padding: 0;
  border-top: 0;
  background: var(--sakamichi-paper-2);
}
.variety-archive-detail-row--legacy td {
  background: rgba(var(--sakamichi-keyaki-chip-rgb, 60, 130, 52), 0.055);
}
.variety-archive-detail {
  padding: 12px 14px 14px 43px;
  border-top: 1px dashed rgba(var(--variety-archive-accent-rgb), 0.26);
  border-bottom: 1px solid var(--sakamichi-hairline);
}
.variety-archive-detail__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 18px;
  margin: 0;
}
.variety-archive-detail__item {
  min-width: 0;
}
.variety-archive-detail__item dt {
  margin: 0 0 4px;
  color: var(--sakamichi-ink-3);
  font-size: 0.72rem;
  font-weight: 800;
}
.variety-archive-detail__item dd {
  margin: 0;
  color: var(--sakamichi-ink-strong);
  font-size: 0.8rem;
  line-height: 1.55;
}
.variety-archive-detail__item--companion {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  grid-column: 1 / -1;
  gap: 4px 12px;
  padding-top: 10px;
  border-top: 1px dashed rgba(var(--variety-archive-accent-rgb), 0.26);
}
.variety-archive-detail__item--companion dt,
.variety-archive-detail__item--companion dd {
  flex: 0 0 auto;
  max-width: 100%;
}
.variety-archive-detail__item--companion dt {
  margin-bottom: 0;
}
.variety-archive-companion {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.variety-archive-companion__title {
  color: var(--sakamichi-ink-strong);
  font-weight: 700;
}
a.variety-archive-companion__title {
  color: var(--variety-archive-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
a.variety-archive-companion__title:hover {
  color: var(--variety-archive-accent);
}
.variety-archive-formation-list {
  display: flex;
  max-width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}
.variety-archive-formation {
  width: fit-content;
  max-width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(var(--variety-archive-accent-rgb), 0.16);
  border-radius: 2px;
  background: rgba(var(--variety-archive-accent-rgb), 0.055);
}
.variety-archive-formation--singers {
  width: 100%;
}
.variety-archive-formation--singers .variety-archive-formation__grid,
.variety-archive-formation--singers .variety-archive-formation-card,
.variety-archive-formation--singers .variety-archive-formation-stage,
.variety-archive-formation--singers .variety-archive-formation-stage__inner,
.variety-archive-formation--singers .variety-archive-formation-row__members {
  width: 100%;
  max-width: 100%;
}
.variety-archive-formation--singers .variety-archive-formation-stage {
  overflow-x: visible;
}
.variety-archive-formation--singers .variety-archive-formation-stage__inner {
  width: 100%;
}
.variety-archive-formation--singers .variety-archive-formation-row__members {
  min-width: 0;
  flex-wrap: wrap;
}
.variety-archive-formation__release {
  display: block;
  width: 100%;
  margin-bottom: 6px;
  color: var(--variety-archive-link);
  font-size: 0.8rem;
  font-weight: 800;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
}
a.variety-archive-formation__release:hover {
  text-decoration: underline;
}
.variety-archive-formation__grid {
  display: flex;
  max-width: 100%;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 10px 14px;
}
.variety-archive-formation-card {
  width: max-content;
  max-width: 100%;
  min-width: 0;
}
.variety-archive-formation-card__header {
  display: flex;
  max-width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  margin: 0 4px 4px;
  text-align: center;
}
.variety-archive-formation-card__heading {
  color: var(--variety-archive-link);
  font-size: 0.68rem;
  font-weight: 800;
  white-space: nowrap;
}
.variety-archive-formation-card__tracks {
  min-width: 0;
  color: var(--sakamichi-ink-2);
  font-size: 0.68rem;
  font-weight: 600;
  overflow-wrap: anywhere;
  text-align: center;
}
.variety-archive-formation-card__tracks a {
  color: var(--variety-archive-link);
  text-decoration: none;
}
.variety-archive-formation-card__tracks a:hover {
  text-decoration: underline;
}
.variety-archive-formation-card__separator {
  color: var(--sakamichi-ink-3);
}
.variety-archive-formation-stage {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.variety-archive-formation-stage__inner {
  display: flex;
  width: max-content;
  flex-direction: column;
  gap: 4px;
}
.variety-archive-formation-row {
  width: 100%;
}
.variety-archive-formation-row__members {
  display: flex;
  justify-content: center;
  gap: 3px;
  min-width: max-content;
}
.variety-archive-formation-member {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.1em;
  min-height: 21px;
  padding: 1px 4px;
  border: 1px solid var(--sakamichi-hairline);
  border-radius: 2px;
  background: var(--sakamichi-paper-2);
  color: var(--sakamichi-ink-2);
  font-size: 0.65rem;
  font-weight: 700;
  line-height: 1.15;
  text-decoration: none;
  white-space: nowrap;
}
a.variety-archive-formation-member:hover {
  border-color: var(--variety-archive-accent);
  color: var(--variety-archive-link);
}
.variety-archive-formation-member--center {
  border-color: var(--variety-archive-accent);
  background: var(--variety-archive-accent);
  color: #fff;
}
a.variety-archive-formation-member--center:hover {
  color: #fff;
  filter: brightness(0.92);
}
.variety-archive-formation-card__empty {
  margin: 0;
  padding: 12px;
  color: var(--sakamichi-ink-3);
  font-size: 0.74rem;
  text-align: center;
}
.variety-archive-member-list,
.variety-archive-detail-links {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.variety-archive-member-chip {
  appearance: none;
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 3px 7px;
  border: 1px solid var(--sakamichi-hairline);
  border-radius: 2px;
  background: var(--sakamichi-paper);
  color: var(--sakamichi-ink-2);
  font-size: 0.74rem;
  line-height: 1.2;
  white-space: nowrap;
}
button.variety-archive-member-chip {
  cursor: pointer;
}
button.variety-archive-member-chip:hover {
  border-color: var(--variety-archive-accent);
  color: var(--variety-archive-link);
}
.variety-archive-member-chip--static {
  background: transparent;
}
.variety-archive-soft-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.variety-archive-soft-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 3px 7px;
}
.variety-archive-soft-title {
  font-weight: 700;
}
a.variety-archive-soft-title {
  color: var(--variety-archive-link);
  text-decoration: none;
}
a.variety-archive-soft-title:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.variety-archive-soft-meta {
  color: var(--sakamichi-ink-3);
  font-size: 0.9em;
}
.variety-archive-related-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.variety-archive-youtube-link,
.variety-archive-lemino-link {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 9px;
  border: 1px solid #d84c4c;
  border-radius: 2px;
  background: #fff;
  color: #b42323;
  font-size: 0.76rem;
  font-weight: 700;
  text-decoration: none;
}
.variety-archive-youtube-link:hover {
  background: #fff4f4;
  color: #971b1b;
  text-decoration: none;
}
.variety-archive-lemino-link {
  border-color: var(--variety-archive-link);
  color: var(--variety-archive-link);
}
.variety-archive-lemino-link:hover {
  background: rgba(var(--variety-archive-accent-rgb), 0.08);
  color: var(--variety-archive-accent);
  text-decoration: none;
}
.variety-archive-detail__empty,
.variety-archive-no-results {
  margin: 0;
  padding: 18px 12px;
  color: var(--sakamichi-ink-3);
  font-size: 0.86rem;
  text-align: center;
}
/* =========================================================
   乃木坂工事中 公式YouTube動画一覧
   ========================================================= */
.saka-koujichuu-youtube {
  --variety-archive-accent: var(--sakamichi-nogi-chip);
  --variety-archive-accent-rgb: var(--sakamichi-nogi-chip-rgb);
  --variety-archive-soft-bg: var(--sakamichi-nogi-bg);
  --variety-archive-link: var(--sakamichi-nogi-secondary);
}
.saka-koujichuu-youtube.theme-sakura {
  --variety-archive-accent: var(--sakamichi-sakura-chip);
  --variety-archive-accent-rgb: var(--sakamichi-sakura-chip-rgb, 179, 77, 107);
  --variety-archive-soft-bg: var(--sakamichi-sakura-bg);
  --variety-archive-link: var(--sakamichi-sakura-link);
}
.saka-koujichuu-youtube.theme-hinata {
  --variety-archive-accent: var(--sakamichi-hinata-chip);
  --variety-archive-accent-rgb: var(--sakamichi-hinata-chip-rgb);
  --variety-archive-soft-bg: var(--sakamichi-hinata-bg);
  --variety-archive-link: var(--sakamichi-hinata-secondary);
}
.koujichuu-youtube-stats {
  background: var(--sakamichi-warning-bg);
  border-color: var(--sakamichi-warning-border);
}
.koujichuu-youtube-stats p {
  color: var(--sakamichi-warning-text);
}
.koujichuu-youtube-stats strong {
  color: #664d03;
}
.koujichuu-youtube-controls {
  grid-template-columns: minmax(220px, 1.3fr) minmax(190px, 0.85fr) minmax(250px, 1fr);
}
.koujichuu-youtube-controls .variety-archive-search-input {
  flex: 0 1 auto;
}
.saka-koujichuu-youtube .variety-archive-member-section:hover {
  border-color: var(--variety-archive-accent);
}
.saka-koujichuu-youtube .variety-archive-member-toggle:hover {
  color: var(--variety-archive-link);
}
.saka-koujichuu-youtube .variety-archive-member-body {
  border-top-color: rgba(var(--variety-archive-accent-rgb), 0.28);
}
.saka-koujichuu-youtube .variety-archive-member-section .member-grid {
  gap: 16px;
  margin-bottom: 0;
}
.saka-koujichuu-youtube .variety-archive-member-section .member-group__title {
  margin-bottom: 10px;
  padding-bottom: 4px;
  border-bottom-color: rgba(var(--variety-archive-accent-rgb), 0.25);
  color: var(--variety-archive-link);
  font-size: 0.88rem;
}
.saka-koujichuu-youtube .variety-archive-member-section .member-card {
  min-height: 28px;
  padding: 4px 8px;
  font-size: 0.75rem;
}
.saka-koujichuu-youtube .variety-archive-member-section .member-card:hover {
  border-color: var(--variety-archive-accent);
}
.saka-koujichuu-youtube .variety-archive-member-section .member-card--selected {
  border-color: var(--variety-archive-accent);
  background: var(--variety-archive-accent);
  color: #fff;
}
.koujichuu-youtube-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.koujichuu-youtube-card {
  display: grid;
  grid-template-columns: clamp(300px, 27vw, 340px) minmax(0, 1fr);
  grid-template-areas:
    "thumb body"
    "thumb people"
    "companion companion";
  column-gap: 14px;
  row-gap: 0;
  padding: 12px;
  border: 1px solid var(--sakamichi-hairline);
  border-radius: 2px;
  background: var(--sakamichi-paper);
}
.koujichuu-youtube-card[hidden] {
  display: none;
}
.koujichuu-youtube-card__thumb {
  grid-area: thumb;
  display: block;
  align-self: start;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid var(--sakamichi-hairline);
  border-radius: 2px;
  background: var(--sakamichi-paper-2);
}
.koujichuu-youtube-card__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.18s ease;
}
.koujichuu-youtube-card__thumb > span {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  color: var(--variety-archive-link);
  font-size: 0.78rem;
  font-weight: 800;
}
.koujichuu-youtube-card__thumb.is-ended,
.koujichuu-youtube-card__companion-thumb.is-ended {
  border-color: rgba(95, 95, 95, 0.32);
  background: rgba(95, 95, 95, 0.06);
  color: var(--sakamichi-ink-3);
  cursor: default;
}
.koujichuu-youtube-card__thumb.is-ended > span {
  color: inherit;
}
.koujichuu-youtube-card__thumb:hover img {
  transform: scale(1.025);
}
.koujichuu-youtube-card__body {
  grid-area: body;
  min-width: 0;
}
.koujichuu-youtube-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 3px 12px;
  margin-bottom: 5px;
  color: var(--sakamichi-ink-3);
  font-size: 0.75rem;
  line-height: 1.35;
}
.koujichuu-youtube-card__meta strong {
  color: var(--variety-archive-link);
  font-size: 0.82rem;
}
.koujichuu-youtube-card__meta time {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.koujichuu-youtube-card__title {
  margin: 0 0 10px;
  color: var(--sakamichi-ink-strong);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.koujichuu-youtube-card__title a {
  color: inherit;
  text-decoration: none;
}
.koujichuu-youtube-card__title a:hover {
  color: var(--variety-archive-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.koujichuu-youtube-card__title-line {
  display: block;
}
.koujichuu-youtube-card__title-note {
  color: var(--sakamichi-ink-3);
  font-size: 0.7rem;
  font-weight: 400;
}
.koujichuu-youtube-card__title-separator {
  display: none;
}
.koujichuu-youtube-card__title-line + .koujichuu-youtube-card__title-line {
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px dashed rgba(var(--variety-archive-accent-rgb), 0.22);
}
.koujichuu-youtube-card__people {
  grid-area: people;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.koujichuu-youtube-card__detail-toggle {
  display: none;
}
.koujichuu-youtube-card__people-row {
  display: grid;
  grid-template-columns: 6.5em minmax(0, 1fr);
  align-items: start;
  gap: 7px;
  min-width: 0;
}
.koujichuu-youtube-card__people-label {
  color: var(--sakamichi-ink-3);
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1.8;
}
.koujichuu-youtube-card__member-list {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 4px 8px;
  color: var(--sakamichi-ink-2);
  font-size: 0.73rem;
  line-height: 1.65;
}
.koujichuu-youtube-card__member-list a {
  color: var(--variety-archive-link);
  text-decoration: none;
}
.koujichuu-youtube-card__member-list a:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.koujichuu-youtube-card__member-list--graduation a,
.koujichuu-youtube-card__member-list--graduation span {
  font-weight: 700;
}
.koujichuu-youtube-card__companion {
  grid-area: companion;
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  margin-top: 11px;
  padding: 10px 10px 10px 24px;
  border-top: 1px dashed rgba(var(--variety-archive-accent-rgb), 0.28);
  background: rgba(var(--variety-archive-accent-rgb), 0.035);
}
.koujichuu-youtube-card__companion-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid var(--sakamichi-hairline);
  border-radius: 2px;
  background: var(--sakamichi-paper-2);
  color: var(--variety-archive-link);
  font-size: 0.68rem;
  font-weight: 800;
  text-decoration: none;
}
.koujichuu-youtube-card__companion-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.18s ease;
}
.koujichuu-youtube-card__companion-thumb:hover img {
  transform: scale(1.025);
}
.koujichuu-youtube-card__companion-body {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}
.koujichuu-youtube-card__companion-program {
  color: var(--sakamichi-ink-3);
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1.4;
}
.koujichuu-youtube-card__companion-title {
  color: var(--variety-archive-link);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.45;
  overflow-wrap: anywhere;
  text-decoration: none;
}
.koujichuu-youtube-card__companion-title:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.koujichuu-youtube-card__companion-title.is-ended {
  color: var(--sakamichi-ink-2);
}
.koujichuu-youtube-empty {
  margin: 0;
  padding: 20px 12px;
  color: var(--sakamichi-ink-3);
  font-size: 0.86rem;
  text-align: center;
}
.music-video-history-image-source-note.koujichuu-youtube-image-source-note {
  margin: 0 0 12px;
  font-size: 0.68rem;
}
@media (min-width: 769px) {
  .variety-archive-title-line {
    display: inline-block;
    white-space: nowrap;
  }
  .variety-archive-title-line:not(:last-child) {
    margin-right: 0.35em;
  }
  .variety-archive-title-line + .variety-archive-title-line {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }
  .variety-archive-title-separator {
    display: inline;
  }
}
@media (min-width: 1280px) {
  .koujichuu-youtube-card__title-line {
    display: inline-block;
    white-space: nowrap;
  }
  .koujichuu-youtube-card__title-line:not(:last-child) {
    margin-right: 0.35em;
  }
  .koujichuu-youtube-card__title-line + .koujichuu-youtube-card__title-line {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }
  .koujichuu-youtube-card__title-separator {
    display: inline;
  }
}
@media (max-width: 768px) {
  .variety-archive-title-note,
  .koujichuu-youtube-card__title-note {
    display: block;
  }
  .variety-archive-controls {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 12px;
  }
  .variety-archive-control-block--sort {
    padding-right: 0;
  }
  .variety-archive-reset {
    position: static;
    align-self: flex-start;
    margin-top: 2px;
  }
  .saka-variety-archive .variety-archive-member-section .member-group__list {
    gap: 6px;
  }
  .variety-archive-table {
    display: block;
    width: 100%;
    font-size: 0.77rem;
  }
  .variety-archive-table colgroup {
    display: none;
  }
  .variety-archive-table thead,
  .variety-archive-table tbody {
    display: block;
    width: 100%;
  }
  .variety-archive-table thead tr,
  .variety-archive-row {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    width: 100%;
  }
  .variety-archive-col-episode {
    width: 112px;
  }
  .variety-archive-col-date,
  .variety-archive-date-heading,
  .variety-archive-date-cell {
    display: none;
  }
  .variety-archive-detail-row:not([hidden]) {
    display: block;
    width: 100%;
  }
  .variety-archive-detail-row td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  .variety-archive-table th,
  .variety-archive-row td {
    padding: 6px;
  }
  .variety-archive-episode-cell__inner {
    grid-template-columns: 23px minmax(0, 1fr);
    gap: 5px;
  }
  .variety-archive-row-toggle {
    width: 23px;
    height: 23px;
    flex-basis: 23px;
  }
  .variety-archive-program-label {
    font-size: 0.64rem;
  }
  .variety-archive-program-label__full {
    display: none;
  }
  .variety-archive-program-label__short,
  .variety-archive-episode-date {
    display: block;
  }
  .variety-archive-episode-date {
    color: var(--sakamichi-ink-3);
    font-size: 0.64rem;
    line-height: 1.25;
    white-space: nowrap;
  }
  .variety-archive-title-toggle {
    font-size: 0.78rem;
  }
  .variety-archive-detail {
    padding: 10px;
  }
  .variety-archive-detail__list {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .koujichuu-youtube-controls {
    grid-template-columns: 1fr;
  }
  .saka-koujichuu-youtube .variety-archive-member-section .member-group__list {
    gap: 6px;
  }
  .koujichuu-youtube-card {
    grid-template-columns: minmax(140px, 34%) minmax(0, 1fr);
    column-gap: 12px;
  }
}
@media (max-width: 600px) {
  .koujichuu-youtube-card {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "body"
      "thumb"
      "companion"
      "toggle"
      "people";
    gap: 9px;
  }
  .koujichuu-youtube-card__thumb {
    width: 100%;
  }
  .koujichuu-youtube-card__companion {
    grid-template-columns: 96px minmax(0, 1fr);
    margin-top: 0;
    padding: 9px 8px 9px 14px;
  }
  .koujichuu-youtube-card__title {
    margin-bottom: 0;
  }
  .koujichuu-youtube-card__detail-toggle {
    appearance: none;
    grid-area: toggle;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    width: 100%;
    margin: 0;
    padding: 6px 1px 0;
    border: 0;
    border-top: 1px dashed rgba(var(--variety-archive-accent-rgb), 0.24);
    border-radius: 0;
    background: transparent;
    color: var(--variety-archive-link);
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: left;
  }
  .koujichuu-youtube-card__detail-toggle:focus-visible {
    outline: 2px solid rgba(var(--variety-archive-accent-rgb), 0.45);
    outline-offset: 2px;
  }
  .koujichuu-youtube-card__detail-icon {
    display: inline-block;
    font-size: 0.68rem;
    transition: transform 0.16s ease;
  }
  .koujichuu-youtube-card.is-detail-open .koujichuu-youtube-card__detail-icon {
    transform: rotate(90deg);
  }
  .koujichuu-youtube-card__people {
    display: none;
  }
  .koujichuu-youtube-card.is-detail-open .koujichuu-youtube-card__people {
    display: flex;
  }
}
@media (max-width: 420px) {
  .variety-archive-table thead tr,
  .variety-archive-row {
    grid-template-columns: 104px minmax(0, 1fr);
  }
  .variety-archive-col-episode {
    width: 104px;
  }
  .variety-archive-table th,
  .variety-archive-row td {
    padding: 5px;
  }
  .variety-archive-episode-cell__inner {
    align-items: flex-start;
  }
  .variety-archive-youtube-index-link {
    margin-top: -7px;
    font-size: 0.74rem;
  }
  .koujichuu-youtube-card {
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
    padding: 9px;
  }
  .koujichuu-youtube-card__meta {
    align-items: flex-start;
    flex-direction: column;
    gap: 1px;
  }
  .koujichuu-youtube-card__title {
    margin-bottom: 8px;
    font-size: 0.86rem;
    line-height: 1.42;
  }
  .koujichuu-youtube-card__people-row {
    grid-template-columns: 1fr;
    gap: 1px;
  }
  .koujichuu-youtube-card__people-label {
    line-height: 1.4;
  }
  .koujichuu-youtube-card__member-list {
    gap: 2px 6px;
    font-size: 0.69rem;
    line-height: 1.5;
  }
}
/* モバイルの文字の下限 - 小さいラベルやバッジが em・rem の掛け算で --saka-fs-min を割らないようにする */
@media (max-width: 768px) {
  .variety-archive-episode-date {
      font-size: max(0.64rem, var(--saka-fs-min));
    }
  .variety-archive-program-label__short {
      font-size: max(1em, var(--saka-fs-min));
    }
}
