/* Week-row art is a square block, matching the original tracker.
   Not a 16:9 banner. Loaded after site.css. Cards stay 16:9. */

/* Dark UI on Mac/OLED: grayscale AA, not subpixel. Thin, not fuzzy. */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.week-row {
  display: flex !important;
  gap: 12px;
  align-items: stretch;
  flex-direction: row !important;
}
.week-row-body { min-width: 0; flex: 1; }
.week-row > .card-media {
  width: 96px !important;
  max-width: 96px !important;
  flex: 0 0 96px !important;
  margin: 0 !important;
  align-self: stretch !important;
}
.week-row > .card-media .art-wide {
  width: 96px !important;
  height: 96px !important;
  max-height: 96px !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 8px;
}
.week-row > .card-media .art-img {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: cover;
}
.week-row > .card-media .art-play {
  right: 6px;
  bottom: 6px;
  width: 24px;
  height: 18px;
}
.week-row > .card-media[data-kind="none"] .art-ph {
  justify-content: center;
  padding: 8px;
  gap: 4px;
}
.week-row > .card-media[data-kind="none"] .art-ph-kicker { display: none; }
.week-row > .card-media[data-kind="none"] .art-ph-title {
  font-size: 0.68rem;
  -webkit-line-clamp: 3;
}
.week-row > .card-media[data-kind="none"] .art-ph-studio { font-size: 0.58rem; }

@media (max-width: 560px) {
  .week-row { flex-direction: row !important; }
  .week-row > .card-media { width: 96px !important; max-width: 96px !important; }
  .week-row > .card-media .art-wide { width: 96px !important; height: 96px !important; }
}

/* Local clock: gold, not purple. */
.tz-local { color: var(--gold); }

/* Next Up for Your Favorite GL Pairs — never "couples". */
.pair-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
}
.pair-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
  border-left: 3px solid var(--gold);
}
.pair-name {
  font-family: var(--font-display);
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--gold);
}
.pair-actors {
  font-size: 0.66rem;
  color: var(--text-dim);
  margin-top: 2px;
  margin-bottom: 8px;
}
.pair-next {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pair-next li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  line-height: 1.45;
  color: var(--text);
}
.pair-next a {
  color: var(--paper);
  text-decoration: none;
  font-weight: 600;
}
.pair-next a:hover { color: var(--gold); }
.pair-flag {
  display: inline-block;
  font-family: var(--font-display);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 1px 7px;
  border-radius: 10px;
  margin-right: 4px;
  vertical-align: middle;
}
.pair-flag.is-airing { background: rgba(74, 222, 128, 0.15); color: var(--green); border: 1px solid rgba(74, 222, 128, 0.3); }
.pair-flag.is-soon { background: rgba(251, 191, 36, 0.12); color: var(--amber); border: 1px solid rgba(251, 191, 36, 0.3); }
.pair-flag.is-announced { background: rgba(192, 132, 252, 0.12); color: var(--accent); border: 1px solid rgba(192, 132, 252, 0.3); }

/* Platforms and the trailer/teaser sit on one chip row, same size.
   A red YouTube platform pill next to a red Trailer button is the same
   fact twice — hide the platform pill when the video control is there. */
.show-card,
.compact-card {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  column-gap: 6px;
}
.show-card > *:not(.platform-row):not(.yt-btn),
.compact-card > *:not(.platform-row):not(.yt-btn) {
  flex: 1 1 100%;
}
.show-card > .platform-row,
.compact-card > .platform-row {
  flex: 1 1 auto;
  width: auto;
  margin-top: 8px;
  align-items: center;
}
.show-card > .yt-btn,
.compact-card > .yt-btn {
  flex: 0 0 auto;
  width: auto;
  margin-top: 8px;
  min-height: 0;
  padding: 2px 8px;
  font-size: 0.63rem;
  line-height: 1.3;
  border-radius: 4px;
}
.show-card:has(.yt-btn) .plat.p-yt,
.compact-card:has(.yt-btn) .plat.p-yt {
  display: none;
}

/* Compact wrapped cards: tighter stack, source line after the chips. */
.compact-card { gap: 0; }
.compact-card > .cc-title { margin-top: 0; }
.compact-card > .cc-meta { margin-top: 4px; margin-bottom: 2px; }
.compact-card > .ep-track { margin-top: 6px; }
.compact-card > .show-facts { order: 20; margin-top: 6px; }
.compact-card > .platform-row { order: 15; }
.compact-card > .yt-btn { order: 16; }

.show-card > .platform-row { order: 10; }
.show-card > .yt-btn { order: 11; }
.show-card > .tag-row { order: 12; flex: 1 1 100%; }
.show-card > .src-line,
.show-card > .conflict { order: 20; }