/* VIP Radio: a studio look in the station's navy and gold. Works with the IG Publishers theme (and on its own). */
.vr, .vr-bar {
  --vr-navy: #002758;
  --vr-deep: #00163A;
  --vr-ink: #000C20;
  --vr-gold: #D09D30;
  --vr-gold-2: #E9BC55;
  --vr-cream: #FBF6EA;
  --vr-onair: #FF3B3B;
  --vr-accent: var(--vr-gold);
  --vr-line: rgba(255, 255, 255, .14);
  --vr-display: var(--font-display, "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif);
  overflow-x: clip;
}
.vr [hidden], .vr-bar [hidden] { display: none !important; }
.vr-i { width: 1.15em; height: 1.15em; flex: none; display: inline-block; vertical-align: -.2em; }
.vr .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Buttons ---------- */
.vr-btn { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 48px; padding: .7rem 1.25rem; border-radius: 999px; border: 2px solid transparent; font: 700 1rem/1.1 var(--vr-display); text-decoration: none; cursor: pointer; transition: transform .15s, background .15s, color .15s, border-color .15s; }
.vr-btn:hover { transform: translateY(-2px); text-decoration: none; }
.vr-btn:focus-visible, .vr-play:focus-visible, .vr-chips button:focus-visible { outline: 3px solid var(--vr-gold-2); outline-offset: 3px; }
.vr-btn--gold { background: var(--vr-gold); color: var(--vr-ink); }
.vr-btn--gold:hover { background: var(--vr-gold-2); color: var(--vr-ink); }
.vr-btn--red { background: var(--vr-onair); color: #fff; }
.vr-btn--red:hover { background: #E02828; color: #fff; }
.vr-btn--line { border-color: rgba(255, 255, 255, .55); color: #fff; background: transparent; }
.vr-btn--line:hover { border-color: #fff; background: rgba(255, 255, 255, .08); color: #fff; }
.vr-btn--line-dark { border-color: var(--vr-navy); color: var(--vr-navy); background: transparent; }
.vr-btn--line-dark:hover { background: var(--vr-navy); color: #fff; }
.vr-btn--navy { background: var(--vr-navy); color: #fff; }
.vr-btn--navy:hover { background: var(--vr-deep); color: #fff; }
.vr-btn--outline-navy { border-color: var(--vr-navy); color: var(--vr-navy); }
.vr-btn--outline-navy:hover { background: rgba(0, 39, 88, .08); color: var(--vr-navy); }
.vr-btn .vr-i { width: 1.3em; height: 1.3em; }
.vr-btn.vr-play .vr-i:nth-of-type(2), .vr-play .vr-i:nth-of-type(2) { display: none; }
.vr-play.is-playing .vr-i:first-of-type { display: none; }
.vr-play.is-playing .vr-i:nth-of-type(2) { display: inline-block; }
.vr-btn.vr-play.is-playing span::after { content: " (playing)"; font-weight: 500; opacity: .8; }

/* ---------- Kicker, lamps, labels ---------- */
.vr-kicker { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; margin: 0 0 1rem; font: 700 .8rem/1.2 var(--vr-display); letter-spacing: .16em; text-transform: uppercase; color: var(--vr-gold-2); }
.vr-kicker a { color: inherit; text-decoration: none; }
.vr-kicker a:hover { text-decoration: underline; }
.vr-kicker--dark { color: #8A6512; }
.vr-onair { display: inline-flex; align-items: center; gap: .5rem; padding: .4rem .75rem .4rem .6rem; border-radius: 6px; background: rgba(255, 59, 59, .14); border: 1px solid rgba(255, 59, 59, .55); color: #FFD2D2; }
.vr-onair--demand { background: rgba(208, 157, 48, .14); border-color: rgba(208, 157, 48, .55); color: var(--vr-gold-2); }
.vr-lamp { width: .7rem; height: .7rem; border-radius: 50%; background: var(--vr-onair); box-shadow: 0 0 0 3px rgba(255, 59, 59, .25), 0 0 14px 2px rgba(255, 59, 59, .8); animation: vr-pulse 1.6s ease-in-out infinite; flex: none; }
.vr-lamp--gold { background: var(--vr-gold-2); box-shadow: 0 0 0 3px rgba(233, 188, 85, .22), 0 0 14px 2px rgba(233, 188, 85, .7); }
.vr-lamp--small { width: .55rem; height: .55rem; }
@keyframes vr-pulse { 50% { opacity: .45; } }

/* Equaliser bars */
.vr-eq { display: inline-flex; align-items: flex-end; gap: 2px; height: 14px; width: 18px; }
.vr-eq i { flex: 1; background: currentColor; height: 30%; border-radius: 1px; }
.vr-eq--on i, .vr-row.is-playing .vr-eq i { animation: vr-eq .9s ease-in-out infinite alternate; }
.vr-eq i:nth-child(2) { animation-delay: -.3s !important; }
.vr-eq i:nth-child(3) { animation-delay: -.6s !important; }
.vr-eq i:nth-child(4) { animation-delay: -.15s !important; }
@keyframes vr-eq { 0% { height: 20%; } 50% { height: 100%; } 100% { height: 45%; } }

/* ---------- Hero (studio) ---------- */
.vr-hero { position: relative; isolation: isolate; color: #fff; background:
  radial-gradient(1200px 520px at 85% -10%, rgba(208, 157, 48, .28), transparent 60%),
  radial-gradient(900px 600px at -10% 120%, rgba(0, 80, 170, .45), transparent 60%),
  linear-gradient(160deg, var(--vr-navy) 0%, var(--vr-deep) 55%, var(--vr-ink) 100%);
  padding: clamp(1.25rem, 3vw, 2rem) 0 0; }
.vr-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5; background-image:
  repeating-linear-gradient(90deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 28px),
  repeating-linear-gradient(0deg, rgba(255, 255, 255, .03) 0 1px, transparent 1px 28px);
  -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%); mask-image: linear-gradient(180deg, #000, transparent 85%); }
.vr-hero__glow { position: absolute; right: -8%; top: 10%; width: 46vw; max-width: 640px; aspect-ratio: 1; z-index: -1; border-radius: 50%;
  background: repeating-radial-gradient(circle, rgba(233, 188, 85, .16) 0 2px, transparent 2px 26px); -webkit-mask-image: radial-gradient(circle, #000 30%, transparent 70%); mask-image: radial-gradient(circle, #000 30%, transparent 70%); }
.vr-hero__in { position: relative; }
.vr-hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; padding: clamp(1.5rem, 4vw, 3rem) 0 clamp(3rem, 6vw, 4.5rem); }
.vr-hero__logo { margin: 0 0 1.25rem; line-height: 0; }
.vr-plate { display: inline-block; background: var(--vr-cream); border-radius: 18px; padding: clamp(.9rem, 2vw, 1.35rem) clamp(1.1rem, 2.5vw, 1.75rem); box-shadow: 0 0 0 1px rgba(255, 255, 255, .5) inset, 0 -5px 0 var(--vr-gold) inset, 0 30px 60px -28px rgba(0, 0, 0, .9); }
.vr-plate img { display: block; width: clamp(200px, 30vw, 360px); height: auto; }
.vr-hero__tagline { font: 800 clamp(1.6rem, 3.3vw, 2.6rem)/1.08 var(--vr-display); margin: 0 0 .9rem; letter-spacing: -.01em; max-width: 22ch; }
.vr-hero__intro { font-size: clamp(1rem, .95rem + .3vw, 1.15rem); color: rgba(255, 255, 255, .82); max-width: 52ch; margin: 0 0 1.6rem; }
.vr-hero__actions { display: flex; flex-wrap: wrap; gap: .75rem; }

/* Frequency dial */
.vr-dial { position: relative; height: 54px; border-top: 1px solid var(--vr-line); background: linear-gradient(180deg, rgba(0, 0, 0, .25), rgba(0, 0, 0, .45)); overflow: hidden; }
.vr-dial__scale { display: flex; justify-content: space-between; align-items: flex-end; height: 100%; max-width: var(--wrap, 1200px); margin: 0 auto; padding: 0 1.25rem 8px;
  background-image: repeating-linear-gradient(90deg, rgba(255, 255, 255, .28) 0 1px, transparent 1px 12px); background-size: 100% 12px; background-repeat: repeat-x; background-position: 0 6px; }
.vr-dial__scale span { position: relative; font: 600 .7rem/1 var(--vr-display); color: rgba(255, 255, 255, .55); width: 2.2em; text-align: center; letter-spacing: .04em; }
.vr-dial__scale span.is-major::before { content: ""; position: absolute; left: 50%; bottom: 100%; margin-bottom: 4px; width: 2px; height: 16px; background: rgba(255, 255, 255, .55); }
.vr-dial__needle { position: absolute; top: 0; bottom: 0; left: 62%; width: 3px; background: var(--vr-gold-2); box-shadow: 0 0 12px 2px rgba(233, 188, 85, .8); animation: vr-tune 9s ease-in-out infinite alternate; }
@keyframes vr-tune { 0% { left: 58%; } 40% { left: 63%; } 100% { left: 61%; } }

/* Breadcrumb */
.vr-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem .5rem; font: 600 .85rem/1.4 var(--vr-display); color: rgba(255, 255, 255, .7); }
.vr-crumbs li + li::before { content: "›"; margin-right: .5rem; color: var(--vr-gold); }
.vr-crumbs a { color: rgba(255, 255, 255, .85); text-decoration: none; }
.vr-crumbs a:hover { color: #fff; text-decoration: underline; }

/* "Latest episode" console */
.vr-now { position: relative; background: linear-gradient(180deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .03)); border: 1px solid var(--vr-line); border-radius: 22px; padding: clamp(1.1rem, 2.5vw, 1.6rem); box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .9); backdrop-filter: blur(6px); }
.vr-now::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; border-radius: 22px 0 0 22px; background: var(--vr-gold); }
.vr-now__top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; font: 700 .78rem/1 var(--vr-display); letter-spacing: .14em; text-transform: uppercase; color: var(--vr-gold-2); }
.vr-now__label { display: inline-flex; gap: .55rem; align-items: center; }
.vr-now__date { color: rgba(255, 255, 255, .65); letter-spacing: .06em; }
.vr-now__main { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 1rem; align-items: center; margin-bottom: 1.1rem; }
.vr-now__show { margin: 0 0 .25rem; font: 700 .9rem/1.2 var(--vr-display); color: var(--vr-gold-2); }
.vr-now__title { margin: 0; font: 800 clamp(1.15rem, 1rem + .7vw, 1.45rem)/1.2 var(--vr-display); }
.vr-now__title a { color: #fff; text-decoration: none; }
.vr-now__title a:hover { text-decoration: underline; }
.vr-now__guests { margin: .3rem 0 0; color: rgba(255, 255, 255, .75); font-size: .95rem; }
.vr-now > .vr-btn { margin-top: .5rem; }

/* Covers */
.vr-cover { display: block; position: relative; aspect-ratio: 1; border-radius: 14px; overflow: hidden; background: var(--vr-navy); box-shadow: 0 18px 40px -22px rgba(0, 0, 0, .8); }
.vr-cover img, .vr-cover svg { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- The deck (main audio player) ---------- */
.vr-deck { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem; align-items: center; padding: .85rem 1rem .85rem .85rem; border-radius: 16px; background: rgba(0, 0, 0, .35); border: 1px solid var(--vr-line); }
.vr-deck__play { width: 64px; height: 64px; border-radius: 50%; border: 0; display: grid; place-items: center; background: var(--vr-gold); color: var(--vr-ink); cursor: pointer; box-shadow: 0 0 0 6px rgba(208, 157, 48, .2); transition: transform .15s, background .15s; }
.vr-deck__play:hover { transform: scale(1.05); background: var(--vr-gold-2); }
.vr-deck__play .vr-i { width: 30px; height: 30px; }
.vr-deck__body { position: relative; min-width: 0; }
.vr-deck__wave { position: relative; display: flex; align-items: center; gap: 2px; height: 44px; overflow: hidden; }
.vr-deck__wave i { flex: 1; height: var(--h); min-height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .28); }
.vr-deck.is-playing .vr-deck__wave i { animation: vr-wave 1.2s ease-in-out infinite alternate; }
.vr-deck.is-playing .vr-deck__wave i:nth-child(3n) { animation-delay: -.4s; }
.vr-deck.is-playing .vr-deck__wave i:nth-child(3n+1) { animation-delay: -.8s; }
@keyframes vr-wave { to { transform: scaleY(.55); } }
.vr-deck__fill { position: absolute; inset: 0 auto 0 0; width: 0; background: linear-gradient(90deg, rgba(208, 157, 48, .0), rgba(208, 157, 48, .25)); border-right: 2px solid var(--vr-gold-2); pointer-events: none; }
.vr-deck__seek { position: absolute; left: 0; right: 0; top: 0; height: 44px; width: 100%; margin: 0; opacity: 0; cursor: pointer; }
.vr-deck__seek:focus-visible { opacity: .6; }
.vr-deck__time { display: flex; justify-content: space-between; margin: .35rem 0 0; font: 600 .82rem/1 var(--vr-display); color: rgba(255, 255, 255, .7); font-variant-numeric: tabular-nums; }
.vr-deck--file { display: block; text-align: left; }
.vr-deck--file p { margin: 0 0 .75rem; color: rgba(255, 255, 255, .8); }

/* Click-to-load frames */
.vr-frame { border-radius: 16px; overflow: hidden; background: var(--vr-ink); }
.vr-frame__stage { position: relative; aspect-ratio: 16 / 9; }
.vr-frame--audio .vr-frame__stage { aspect-ratio: auto; min-height: 200px; }
.vr-frame.is-loaded.vr-frame--audio .vr-frame__stage { min-height: 0; }
.vr-frame__stage iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.vr-frame--audio.is-loaded .vr-frame__stage iframe { position: static; height: 232px; display: block; }
.vr-frame__cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .45; }
.vr-frame__overlay { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: .35rem; padding: 1rem; text-align: center; color: #fff; background: radial-gradient(circle at center, rgba(0, 22, 58, .35), rgba(0, 12, 32, .85)); }
.vr-frame__play { width: 76px; height: 76px; border-radius: 50%; border: 0; display: grid; place-items: center; background: var(--vr-gold); color: var(--vr-ink); cursor: pointer; box-shadow: 0 0 0 8px rgba(208, 157, 48, .25); transition: transform .15s; }
.vr-frame__play:hover { transform: scale(1.06); }
.vr-frame__play .vr-i { width: 34px; height: 34px; }
.vr-frame__label { margin: .5rem 0 0; font: 800 1.1rem/1.2 var(--vr-display); }
.vr-frame__note { margin: 0; font-size: .8rem; color: rgba(255, 255, 255, .7); }
.vr-video video { width: 100%; border-radius: 16px; background: #000; display: block; }

/* ---------- Sections ---------- */
.vr-section { padding: clamp(3rem, 7vw, 5rem) 0; }
.vr-section__head { margin-bottom: clamp(1.5rem, 3vw, 2.25rem); }
.vr-section__head h2 { margin: 0; font: 800 clamp(1.8rem, 1.4rem + 1.6vw, 2.6rem)/1.05 var(--vr-display); letter-spacing: -.015em; }
.vr-section__head--row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 1rem; }
.vr-empty { padding: 2rem; border-radius: 14px; background: var(--surface, #fff); border: 1px dashed var(--line, #ccc); }

/* Shows */
.vr-shows { background: var(--vr-cream); color: #141414; }
:root[data-theme="dark"] .vr-shows { background: #10151F; color: #EDEDED; }
:root[data-theme="dark"] .vr-kicker--dark { color: var(--vr-gold-2); }
.vr-shows__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: clamp(1.25rem, 3vw, 2rem); }
.vr-show { position: relative; display: grid; grid-template-columns: minmax(130px, 210px) minmax(0, 1fr); gap: clamp(1rem, 2.5vw, 1.75rem); align-items: center; padding: clamp(1rem, 2.5vw, 1.5rem); border-radius: 22px; background: linear-gradient(150deg, var(--vr-navy), var(--vr-deep)); color: #fff; box-shadow: 0 30px 60px -36px rgba(0, 22, 58, .9); overflow: hidden; }
.vr-show::after { content: ""; position: absolute; right: -60px; bottom: -60px; width: 220px; height: 220px; border-radius: 50%; border: 26px solid var(--vr-accent); opacity: .16; pointer-events: none; }
.vr-show__count { margin: 0 0 .35rem; font: 700 .75rem/1 var(--vr-display); letter-spacing: .14em; text-transform: uppercase; color: var(--vr-accent); filter: brightness(1.25); }
.vr-show__name { margin: 0 0 .35rem; font: 800 clamp(1.4rem, 1.1rem + 1vw, 1.9rem)/1.05 var(--vr-display); }
.vr-show__name a { color: #fff; text-decoration: none; }
.vr-show__name a:hover { text-decoration: underline; }
.vr-show__tagline { margin: 0 0 .75rem; color: rgba(255, 255, 255, .82); }
.vr-show__facts { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .35rem; font-size: .92rem; color: rgba(255, 255, 255, .78); }
.vr-show__facts li { display: flex; gap: .5rem; align-items: center; }
.vr-show__facts .vr-i { color: var(--vr-gold-2); }
.vr-show__actions { display: flex; flex-wrap: wrap; gap: .6rem; position: relative; z-index: 1; }
.vr-show__actions .vr-btn { min-height: 42px; padding: .55rem 1rem; font-size: .92rem; }

/* Tools: chips and search */
.vr-tools { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .75rem 1.5rem; margin-bottom: 1.25rem; }
.vr-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.vr-chips button { display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; padding: .45rem .95rem; border-radius: 999px; border: 1.5px solid var(--line, #DADAD6); background: var(--surface, #fff); color: var(--text, #141414); font: 600 .9rem/1 var(--vr-display); cursor: pointer; }
.vr-chips button span { opacity: .6; font-weight: 500; }
.vr-chips button:hover { border-color: var(--vr-navy); }
.vr-chips button[aria-pressed="true"] { background: var(--vr-navy); border-color: var(--vr-navy); color: #fff; }
.vr-chips button[aria-pressed="true"] span { opacity: .8; }
.vr-search { flex: 0 1 300px; min-width: 0; min-height: 44px; padding: .6rem 1rem; border-radius: 999px; border: 1.5px solid var(--line, #DADAD6); background: var(--surface, #fff); color: var(--text, #141414); font: inherit; }
.vr-search:focus { outline: 3px solid rgba(208, 157, 48, .45); border-color: var(--vr-gold); }
.vr-tools--compact { margin: 0; }

/* Track list */
.vr-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.vr-row { position: relative; display: grid; grid-template-columns: 64px 52px minmax(0, 1fr) auto; gap: 1rem; align-items: center; padding: .75rem 1.1rem .75rem .75rem; border-radius: 14px; background: var(--surface, #fff); border: 1px solid var(--line, #E3E3DF); transition: border-color .15s, box-shadow .15s, transform .15s; }
.vr-row::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 4px; border-radius: 0 4px 4px 0; background: var(--vr-accent); }
.vr-row:hover { border-color: var(--vr-gold); box-shadow: 0 14px 30px -22px rgba(0, 22, 58, .6); }
.vr-row.is-current { border-color: var(--vr-navy); background: linear-gradient(90deg, rgba(208, 157, 48, .12), var(--surface, #fff) 45%); }
.vr-row__date { display: grid; justify-items: center; line-height: 1; color: var(--vr-navy); }
:root[data-theme="dark"] .vr-row__date { color: var(--vr-gold-2); }
.vr-row__day { font: 800 1.6rem/1 var(--vr-display); font-variant-numeric: tabular-nums; }
.vr-row__mon { font: 700 .66rem/1.2 var(--vr-display); letter-spacing: .1em; text-transform: uppercase; opacity: .75; margin-top: .2rem; white-space: nowrap; }
.vr-play.vr-row__play { width: 52px; height: 52px; border-radius: 50%; border: 0; display: grid; place-items: center; background: var(--vr-navy); color: #fff; cursor: pointer; text-decoration: none; transition: background .15s, transform .15s; }
.vr-play.vr-row__play:hover { background: var(--vr-gold); color: var(--vr-ink); transform: scale(1.05); }
.vr-play.vr-row__play.is-playing { background: var(--vr-gold); color: var(--vr-ink); }
.vr-row__play .vr-i { width: 22px; height: 22px; }
.vr-row__main { display: grid; gap: .15rem; min-width: 0; }
.vr-row__show { font: 700 .75rem/1.2 var(--vr-display); letter-spacing: .1em; text-transform: uppercase; color: #8A6512; }
:root[data-theme="dark"] .vr-row__show { color: var(--vr-gold-2); }
.vr-row__title { font: 700 1.08rem/1.3 var(--vr-display); color: var(--text, #141414); text-decoration: none; }
.vr-row__title::after { content: ""; position: absolute; inset: 0; }
.vr-row__play, .vr-row .vr-badge { position: relative; z-index: 1; }
.vr-row__title:hover { text-decoration: underline; }
.vr-row__guests { font-size: .9rem; color: var(--muted, #5C5C5C); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vr-row__meta { display: grid; justify-items: end; gap: .35rem; }
.vr-row__badges { display: flex; gap: .35rem; }
.vr-badge { display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .55rem; border-radius: 6px; background: rgba(0, 39, 88, .08); color: var(--vr-navy); font: 700 .72rem/1 var(--vr-display); letter-spacing: .04em; }
.vr-badge--video { background: rgba(208, 157, 48, .18); color: #7A5710; }
:root[data-theme="dark"] .vr-badge { background: rgba(255, 255, 255, .1); color: #fff; }
.vr-badge .vr-i { width: 1em; height: 1em; }
.vr-row__len { display: inline-flex; gap: .3rem; align-items: center; font: 600 .85rem/1 var(--vr-display); color: var(--muted, #5C5C5C); font-variant-numeric: tabular-nums; }
.vr-row .vr-eq { position: absolute; right: .9rem; top: .7rem; color: var(--vr-gold); opacity: 0; }
.vr-row.is-playing .vr-eq { opacity: 1; }
.vr-none { padding: 1rem 0; color: var(--muted, #5C5C5C); }
.vr-more-wrap { text-align: center; margin: 1.5rem 0 0; }
.vr-year + .vr-year { margin-top: 2rem; }
.vr-year__title { display: flex; align-items: baseline; gap: .75rem; margin: 0 0 .9rem; font: 800 1.5rem/1 var(--vr-display); color: var(--vr-navy); }
:root[data-theme="dark"] .vr-year__title { color: #fff; }
.vr-year__title::after { content: ""; flex: 1; height: 1px; background: var(--line, #DADAD6); }
.vr-year__title small { font: 600 .85rem/1 var(--vr-display); color: var(--muted, #5C5C5C); }

/* Request band */
.vr-request { background: linear-gradient(100deg, var(--vr-gold), var(--vr-gold-2)); color: var(--vr-ink); padding: clamp(2rem, 5vw, 3rem) 0; }
.vr-request__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem 2rem; }
.vr-request .vr-kicker { color: var(--vr-ink); margin-bottom: .6rem; }
.vr-request__title { margin: 0; max-width: 34ch; font: 800 clamp(1.25rem, 1rem + 1vw, 1.7rem)/1.2 var(--vr-display); }
.vr-request__actions { display: flex; flex-wrap: wrap; gap: .6rem; }

/* ---------- Show page ---------- */
.vr-hero--show .vr-hero__glow { background: repeating-radial-gradient(circle, color-mix(in srgb, var(--vr-accent) 30%, transparent) 0 2px, transparent 2px 26px); }
.vr-showhead { display: grid; grid-template-columns: minmax(180px, 340px) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; padding: clamp(1.5rem, 4vw, 3rem) 0 clamp(2.5rem, 5vw, 4rem); }
.vr-showhead__art { border-radius: 22px; box-shadow: 0 0 0 6px rgba(255, 255, 255, .06), 0 40px 80px -30px rgba(0, 0, 0, .95); }
.vr-station { display: inline-flex; background: var(--vr-cream); border-radius: 8px; padding: 4px 8px; line-height: 0; }
.vr-station img { height: 22px; width: auto; }
.vr-showhead__name { margin: 0 0 .5rem; font: 800 clamp(2.2rem, 1.6rem + 3vw, 4rem)/1 var(--vr-display); letter-spacing: -.02em; }
.vr-showhead__tagline { margin: 0 0 1rem; font: 600 clamp(1.1rem, 1rem + .5vw, 1.35rem)/1.3 var(--vr-display); color: var(--vr-gold-2); }
.vr-showhead__facts { list-style: none; margin: 0 0 1rem; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; color: rgba(255, 255, 255, .85); }
.vr-showhead__facts li { display: inline-flex; align-items: center; gap: .45rem; }
.vr-showhead__facts .vr-i { color: var(--vr-gold-2); }
.vr-showhead__about { margin: 0 0 1.5rem; max-width: 60ch; color: rgba(255, 255, 255, .8); }

/* ---------- Episode page ---------- */
.vr-ephead { display: grid; grid-template-columns: minmax(150px, 260px) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: center; padding: clamp(1.5rem, 4vw, 2.5rem) 0 clamp(2rem, 5vw, 3.5rem); }
.vr-ephead__title { margin: 0 0 .75rem; font: 800 clamp(1.8rem, 1.3rem + 2.4vw, 3rem)/1.05 var(--vr-display); letter-spacing: -.015em; }
.vr-ephead__facts { list-style: none; margin: 0 0 1.25rem; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; color: rgba(255, 255, 255, .82); font-size: .95rem; }
.vr-ephead__facts li { display: inline-flex; align-items: center; gap: .45rem; }
.vr-ephead__facts .vr-i { color: var(--vr-gold-2); }
.vr-ephead__dl { margin: .85rem 0 0; }
.vr-ephead__dl a { display: inline-flex; gap: .4rem; align-items: center; color: var(--vr-gold-2); font: 700 .95rem/1 var(--vr-display); }
.vr-epbody { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 340px); gap: clamp(2rem, 5vw, 4rem); padding-top: clamp(2rem, 5vw, 3.5rem); padding-bottom: clamp(3rem, 6vw, 4.5rem); }
.vr-epblock { margin-bottom: 2rem; }
.vr-epblock__title { display: flex; align-items: center; gap: .5rem; margin: 0 0 .9rem; font: 800 1.35rem/1 var(--vr-display); }
.vr-epblock__title .vr-i { color: var(--vr-gold); }
.vr-lead { font-size: 1.2rem; line-height: 1.55; margin: 0 0 1.25rem; }
.vr-adjacent { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 2.5rem; }
.vr-adjacent a { display: grid; gap: .3rem; padding: 1rem 1.1rem; border-radius: 14px; border: 1px solid var(--line, #DADAD6); background: var(--surface, #fff); color: var(--text, #141414); font: 700 1rem/1.3 var(--vr-display); text-decoration: none; }
.vr-adjacent a:hover { border-color: var(--vr-gold); }
.vr-adjacent span { font: 700 .75rem/1 var(--vr-display); letter-spacing: .1em; text-transform: uppercase; color: #8A6512; }
.vr-adjacent__next { grid-column: 2; text-align: right; }
.vr-sidecard { padding: 1.25rem; border-radius: 20px; background: linear-gradient(150deg, var(--vr-navy), var(--vr-deep)); color: #fff; margin-bottom: 1.75rem; }
.vr-sidecard__art { width: 120px; margin-bottom: 1rem; }
.vr-sidecard .vr-kicker { color: var(--vr-gold-2); margin-bottom: .4rem; }
.vr-sidecard h2 { margin: 0 0 .4rem; font: 800 1.4rem/1.1 var(--vr-display); }
.vr-sidecard h2 a { color: #fff; text-decoration: none; }
.vr-sidecard p { margin: 0 0 .5rem; color: rgba(255, 255, 255, .8); }
.vr-sidecard__when { display: flex; gap: .45rem; align-items: center; font-size: .92rem; }
.vr-side__title { font: 800 1.15rem/1.2 var(--vr-display); margin: 0 0 .75rem; }
.vr-list--mini .vr-row { grid-template-columns: 54px 40px minmax(0, 1fr); gap: .65rem; padding: .55rem .7rem .55rem .55rem; }
.vr-list--mini .vr-row__meta, .vr-list--mini .vr-row__guests { display: none; }
.vr-list--mini .vr-play.vr-row__play { width: 40px; height: 40px; }
.vr-list--mini .vr-row__day { font-size: 1.2rem; }
.vr-list--mini .vr-row__title { font-size: .95rem; }
.vr-side__all { display: inline-block; margin-top: .9rem; font: 700 .95rem/1 var(--vr-display); }

/* ---------- Now playing bar ---------- */
.vr-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 140; color: #fff; background: linear-gradient(180deg, #002A5E, var(--vr-ink, #000C20)); background-color: #001431; box-shadow: 0 -18px 40px -18px rgba(0, 0, 0, .8); padding-bottom: env(safe-area-inset-bottom, 0px); font-family: var(--font-display, system-ui, sans-serif); }
.vr-bar[hidden] { display: none; }
.vr-bar__progress { height: 3px; background: rgba(255, 255, 255, .15); }
.vr-bar__progress span { display: block; height: 100%; width: 0; background: #E9BC55; box-shadow: 0 0 10px #E9BC55; }
.vr-bar__in { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: 52px minmax(0, 1.1fr) auto minmax(0, 1.4fr) auto auto; gap: .9rem; align-items: center; padding: .6rem 1rem; }
.vr-bar__art { width: 52px; height: 52px; border-radius: 10px; overflow: hidden; background: #FBF6EA; display: grid; place-items: center; }
.vr-bar__art img { width: 88%; height: auto; }
.vr-bar__art.has-cover img { width: 100%; height: 100%; object-fit: cover; }
.vr-bar__info { min-width: 0; }
.vr-bar__show { display: flex; align-items: center; gap: .4rem; margin: 0 0 .15rem; font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #E9BC55; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vr-bar .vr-lamp { animation-play-state: paused; opacity: .5; box-shadow: none; }
.vr-bar.is-playing .vr-lamp { animation-play-state: running; opacity: 1; box-shadow: 0 0 10px 2px rgba(255, 59, 59, .8); }
.vr-bar__title { display: block; color: #fff; font-weight: 700; font-size: .98rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: none; }
.vr-bar__title:hover { text-decoration: underline; color: #fff; }
.vr-bar__controls { display: flex; align-items: center; gap: .4rem; }
.vr-bar__skip { position: relative; width: 40px; height: 40px; border: 0; border-radius: 50%; background: transparent; color: #fff; cursor: pointer; display: grid; place-items: center; }
.vr-bar__skip .vr-i { width: 30px; height: 30px; opacity: .9; }
.vr-bar__skip span { position: absolute; font-size: .55rem; font-weight: 800; top: 55%; left: 50%; transform: translate(-50%, -50%); }
.vr-bar__skip:hover { background: rgba(255, 255, 255, .1); }
.vr-bar__play { width: 50px; height: 50px; border-radius: 50%; border: 0; background: #D09D30; color: #000C20; cursor: pointer; display: grid; place-items: center; }
.vr-bar__play:hover { background: #E9BC55; }
.vr-bar__play .vr-i { width: 24px; height: 24px; }
.vr-bar .vr-play .vr-i:nth-of-type(2) { display: none; }
.vr-bar.is-playing .vr-bar__play .vr-i:first-of-type { display: none; }
.vr-bar.is-playing .vr-bar__play .vr-i:nth-of-type(2) { display: inline-block; }
.vr-bar__track { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.vr-bar__track input { flex: 1; min-width: 0; accent-color: #E9BC55; }
.vr-bar__time { font-size: .8rem; font-weight: 600; color: rgba(255, 255, 255, .75); font-variant-numeric: tabular-nums; min-width: 3.2em; text-align: center; }
.vr-bar__speed { min-width: 48px; height: 34px; border-radius: 8px; border: 1px solid rgba(255, 255, 255, .3); background: transparent; color: #fff; font-weight: 700; cursor: pointer; }
.vr-bar__close { width: 36px; height: 36px; border: 0; border-radius: 50%; background: transparent; color: rgba(255, 255, 255, .75); cursor: pointer; display: grid; place-items: center; }
.vr-bar__close:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.vr-bar__close .vr-i { width: 18px; height: 18px; }
.vr-bar button:focus-visible { outline: 3px solid #E9BC55; outline-offset: 2px; }
body.vr-bar-on { padding-bottom: 78px; }
body.vr-bar-on .chat-launcher { bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
body.vr-bar-on .ig-editbar { bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
body.vr-bar-on .cookie-banner { bottom: 90px; }

/* Editors: empty editable wording stays clickable. */
.vr [data-ig-edit]:empty { display: inline-block; min-width: 8ch; min-height: 1.2em; outline: 1px dashed rgba(233, 188, 85, .6); }
.vr [data-ig-edit]:empty::before { content: "Click to add"; opacity: .55; font-style: italic; }

/* ---------- Smaller screens ---------- */
@media (max-width: 960px) {
  .vr-hero__grid { grid-template-columns: 1fr; }
  .vr-epbody { grid-template-columns: 1fr; }
  .vr-bar__in { grid-template-columns: 48px minmax(0, 1fr) auto auto; }
  .vr-bar__track { grid-column: 1 / -1; order: 5; }
  .vr-bar__speed { display: none; }
  body.vr-bar-on { padding-bottom: 116px; }
  body.vr-bar-on .chat-launcher, body.vr-bar-on .ig-editbar { bottom: calc(124px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 720px) {
  .vr-showhead, .vr-ephead { grid-template-columns: 1fr; }
  .vr-showhead__art { max-width: 240px; }
  .vr-ephead__art { max-width: 200px; }
  .vr-show { grid-template-columns: 1fr; }
  .vr-show__art { max-width: 200px; }
  .vr-row { grid-template-columns: 46px 46px minmax(0, 1fr); gap: .75rem; padding-right: .9rem; }
  .vr-row__meta { grid-column: 3; justify-items: start; grid-auto-flow: column; justify-content: start; align-items: center; gap: .6rem; }
  .vr-play.vr-row__play { width: 46px; height: 46px; }
  .vr-row__day { font-size: 1.3rem; }
  .vr-search { flex-basis: 100%; }
  .vr-adjacent { grid-template-columns: 1fr; }
  .vr-adjacent__next { grid-column: auto; }
  .vr-bar__skip { display: none; }
  .vr-dial__scale span:nth-child(even) { visibility: hidden; }
}
@media (prefers-reduced-motion: reduce) {
  .vr-lamp, .vr-eq i, .vr-deck__wave i, .vr-dial__needle { animation: none !important; }
}