/* Home Live reference: image cards only; selectors stay inside this placement. */
.home-live { overflow: hidden; background: var(--admin-raised,#161920); border: 1px solid rgba(var(--admin-neutral-rgb,255,255,255),.06); border-radius: 16px; padding: clamp(12px,1.6vw,18px); }
.home-live__heading { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.home-live__icon { width: 30px; height: 30px; border-radius: 8px; border: 2px solid #de1722; display: grid; place-items: center; color: #de1722; }
.site-page .home-live .home-live__heading h2 { margin: 0; font: 700 clamp(22px,2.4vw,28px)/1.1 'Space Grotesk',sans-serif; letter-spacing: -.03em; }
.home-live__rail { cursor: grab; user-select: none; display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px)/5); gap: 12px; width: 100%; max-width: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; }
.home-live__rail::-webkit-scrollbar { display: none; }
.site-page .home-live__card { scroll-snap-align: start; display: flex; flex-direction: column; gap: 10px; min-width: 0; color: #f4f5f7; text-decoration: none; }
.home-live__thumbnail { display: block; position: relative; aspect-ratio: 9/16; border-radius: 10px; overflow: hidden; background: #0e1014; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.home-live__snapshot { display: block; width: 100%; height: 100%; object-fit: cover; }
.home-live__badge { position: absolute; top: 8px; left: 8px; display: inline-flex; align-items: center; gap: 5px; padding: 3px 7px 3px 6px; border-radius: 6px; background: #de1722; color: #fff; font: 700 10px ui-monospace,Menlo,monospace; letter-spacing: .1em; text-transform: uppercase; }
.home-live__badge > span { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: home-live-pulse 1.4s ease-out infinite; }
.home-live__shade { position: absolute; left: 0; right: 0; bottom: 0; height: 40%; background: linear-gradient(180deg,rgba(14,16,20,0),rgba(14,16,20,.75)); pointer-events: none; }
.home-live__profile { position: absolute; left: 10px; right: 10px; bottom: 10px; display: flex; align-items: center; gap: 8px; min-width: 0; }
.home-live__avatar { flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px #de1722; background: #161920; }
.home-live__copy { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.home-live__username { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; font: 600 12px/1.2 Manrope,sans-serif; text-shadow: 0 1px 2px rgba(0,0,0,.6); }
.home-live__watching { display: flex; align-items: center; gap: 4px; color: rgba(255,255,255,.85); font: 500 10.5px/1.2 ui-monospace,Menlo,monospace; letter-spacing: .02em; text-shadow: 0 1px 2px rgba(0,0,0,.6); }
.home-live__watching svg { flex-shrink: 0; }
.home-live__pagination { margin-top: 12px; }
@keyframes home-live-pulse { 0% { box-shadow: 0 0 0 0 rgba(255,255,255,.7); } 70%,100% { box-shadow: 0 0 0 5px rgba(255,255,255,0); } }
@media (min-width: 1200px) {
  .home-content .home-live__rail { grid-auto-columns: calc((100% - 60px)/6); }
}
@media (max-width: 899px) {
  .home-live { max-width: none; margin: 0 calc(-1 * clamp(12px,3vw,28px)); padding: 14px 0; border-left-width: 0; border-right-width: 0; border-radius: 0; }
  .watch-content .home-live { margin-inline: 0; }
  .home-live__heading { padding: 0 clamp(12px,3vw,28px); }
  .home-live__rail { grid-auto-columns: calc((100% - 16px)/2.4); gap: 8px; padding: 0 clamp(12px,3vw,28px); scroll-padding-inline: clamp(12px,3vw,28px); }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .home-content .home-live__rail { grid-auto-columns: calc((100% - 36px)/4); gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-live__badge > span { animation: none; }
  .home-live__rail { scroll-behavior: auto; }
}