/* Shared by the public landing and signed-in home; uses the existing theme. */
body .stream-promo {
    container-type: inline-size; min-width: 0; margin: 20px 0;
    border: 1px solid var(--club-border); border-radius: 18px;
    background: linear-gradient(115deg, var(--club-accent-soft), transparent 65%), var(--club-surface);
    color: var(--club-ink);
}
.stream-promo-inner {
    display: grid; grid-template-columns: minmax(180px, 280px) minmax(0, 1fr);
    grid-template-areas: 'preview heading' 'preview actions' 'preview help';
    align-items: center; gap: 12px 22px; padding: 18px;
}
body .stream-promo-preview {
    grid-area: preview; position: relative; overflow: hidden; border-radius: 12px;
    border: 1px solid var(--club-border); aspect-ratio: 9 / 5; background: #142126;
}
.stream-promo-preview a { display: block; width: 100%; height: 100%; }
.stream-promo-preview img { display: block; width: 100%; height: 100%; object-fit: contain; }
body .stream-promo-play {
    position: absolute; right: 7px; bottom: 7px; display: grid; place-items: center;
    width: 30px; height: 30px; padding: 0; border: 1px solid #9caeab80; border-radius: 50%;
    color: #fff4d9; background: #0b1a1de8; font-size: 11px; cursor: pointer;
}
.stream-promo-play[hidden] { display: none; }
.stream-promo-heading { grid-area: heading; min-width: 0; }
body .stream-promo-kicker { color: var(--club-accent); font-size: 10px; line-height: 1.3; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
body .stream-promo-heading h2 { margin: 4px 0 5px; color: var(--club-ink); font: 600 clamp(24px, 3.2cqi, 32px)/1.12 'Cormorant Garamond', Georgia, serif; text-wrap: balance; }
body .stream-promo-heading p { margin: 0; color: var(--club-muted); font-size: 13px; line-height: 1.45; }
.stream-promo-actions { grid-area: actions; display: flex; align-items: center; flex-wrap: wrap; gap: 9px; min-width: 0; }
body .stream-promo-languages { display: inline-flex; flex: 0 0 auto; gap: 3px; margin: 0; padding: 3px; border: 1px solid var(--club-border); border-radius: 10px; }
.stream-promo-languages label { position: relative; margin: 0; cursor: pointer; }
.stream-promo-languages input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.stream-promo-languages span { display: grid; place-items: center; min-width: 38px; min-height: 34px; padding: 5px 8px; border-radius: 7px; color: var(--club-muted); font: 650 12px/1.2 'Manrope', sans-serif; }
.stream-promo-languages input:checked + span { background: var(--club-accent-soft); color: var(--club-accent); }
.stream-promo-languages input:focus-visible + span { outline: 2px solid var(--club-accent); outline-offset: 1px; }
body .stream-promo-copy {
    display: inline-flex; justify-content: center; align-items: center; gap: 8px; max-width: 100%;
    min-height: 42px; min-width: 180px; padding: 9px 14px; border: 1px solid var(--club-accent);
    border-radius: 10px; background: var(--club-accent); color: #101719;
    font: 700 13px/1.35 'Manrope', sans-serif; cursor: pointer;
}
body .stream-promo-copy > span { color: inherit; }
.stream-promo-copy:disabled { opacity: .65; cursor: default; }
.stream-promo-copy:focus-visible, .stream-promo-play:focus-visible, .stream-promo-preview a:focus-visible { outline: 2px solid var(--club-accent); outline-offset: 3px; }
.stream-promo-help { grid-area: help; min-width: 0; }
body .stream-promo-help p { margin: 0; color: var(--club-muted); font-size: 11px; line-height: 1.5; }
.stream-promo-help strong { color: var(--club-ink); font-weight: 600; white-space: nowrap; }
.stream-promo-help [data-stream-status]:not(.stream-promo-sr) { display: block; margin-top: 5px; color: var(--club-muted); font-size: 12px; }
body .stream-promo-url { width: 100%; margin-top: 8px; padding: 8px; color: var(--club-ink); background: var(--club-bg); border: 1px solid var(--club-border); border-radius: 8px; font-size: 13px; }
.stream-promo-sr { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@container (max-width: 580px) {
    .stream-promo-inner { grid-template-columns: 130px minmax(0, 1fr); grid-template-areas: 'preview heading' 'actions actions' 'help help'; gap: 12px 14px; padding: 15px; }
    body .stream-promo-heading h2 { font-size: 24px; }
    body .stream-promo-heading p { font-size: 12px; }
}
@container (max-width: 340px) {
    .stream-promo-inner { grid-template-columns: 96px minmax(0, 1fr); gap: 10px; padding: 12px; }
    body .stream-promo-heading h2 { font-size: 22px; }
    .stream-promo-copy { flex: 1 1 150px; }
    .stream-promo-languages { flex: 0 0 auto; }
}
