/* Ported from the San DNB radio (themes/enthuzy). The accent follows the Site: --radio-accent. */
    .rp-copyright__body p{
        color: #ded4d4;
        font-size:16px;
    }
    .radio-page {
        min-height: 100vh;
        position: relative;
        overflow: hidden;
    }

    .radio-page__bg {
        position: fixed;
        inset: 0;
        z-index: 0;
        pointer-events: none;
    }

    #radioPageVizCanvas {
        width: 100%;
        height: 100%;
        display: block;
    }

    .radio-page__overlay {
        position: fixed;
        inset: 0;
        z-index: 1;
        background: linear-gradient(180deg,
        rgba(0,0,0,0.60) 0%,
        rgba(0,0,0,0.25) 40%,
        rgba(0,0,0,0.60) 100%);
        pointer-events: none;
        transition: opacity .5s ease;
    }

    .radio-page__content {
        position: relative;
        z-index: 2;
        max-width: 1100px;
        margin: 0 auto;
        padding: 40px 20px 80px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 28px;
        align-items: start;
        transition: opacity .4s ease, transform .4s ease;
    }

    @media (max-width: 820px) {
        .radio-page__content {
            grid-template-columns: 1fr;
            padding: 24px 16px 80px;
        }
    }

    /* ---- Player panel ---- */
    .rp-full {
        background: rgba(10,10,12,0.72);
        border: 1px solid rgba(255,255,255,0.12);
        border-radius: 20px;
        padding: 20px;
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        box-shadow: 0 20px 60px rgba(0,0,0,0.50);
        color: #fff;
    }

    .rp-full__header {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 16px;
    }

    .rp-full__badge {
        padding: 5px 10px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.06em;
        border: 1px solid rgba(255,255,255,0.18);
        background: rgba(255,255,255,0.06);
    }

    .rp-full__badge.is-live {
        border-color: color-mix(in srgb, var(--radio-accent) 45%, transparent);
        color: color-mix(in srgb, var(--radio-accent) 95%, transparent);
    }

    .rp-full__station { font-weight: 800; font-size: 18px; }

    .rp-full__mid {
        display: flex;
        gap: 14px;
        align-items: center;
        margin-bottom: 14px;
    }

    .rp-full__cover {
        width: 72px;
        height: 72px;
        border-radius: 14px;
        object-fit: cover;
        border: 1px solid rgba(255,255,255,0.14);
        background: rgba(255,255,255,0.06);
        flex-shrink: 0;
    }

    .rp-full__meta { min-width: 0; flex: 1; }

    .rp-full__now {
        font-size: 17px;
        font-weight: 800;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .rp-full__sub {
        opacity: 0.78;
        margin-top: 4px;
        font-size: 13px;
    }

    .rp-full__controls {
        display: flex;
        gap: 10px;
        align-items: center;
        margin-top: 10px;
        flex-wrap: wrap;
    }

    .rp-full__btn {
        padding: 10px 16px;
        border-radius: var(--rp-radius, var(--radius-md, 10px));
        font-family: inherit;
        border: 1px solid rgba(255,255,255,0.16);
        background: rgba(255,255,255,0.08);
        color: #fff;
        font-weight: 700;
        cursor: pointer;
        transition: background .12s ease, transform .12s ease;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
    }

    .rp-full__btn:hover {
        background: rgba(255,255,255,0.12);
        transform: translateY(-1px);
    }

    .rp-full__btn--popout {
        margin-left: auto;
        border-color: rgba(255,255,255,0.12);
        opacity: 0.8;
        font-size: 12px;
    }

    .rp-full__btn--fs {
        border-color: rgba(255,255,255,0.12);
        opacity: 0.8;
        font-size: 12px;
        padding: 10px 12px;
    }

    .rp-full__vol {
        flex: 1;
        min-width: 80px;
        max-width: 160px;
    }

    /* Equalizer canvas */
    .rp-full__viz {
        width: 100%;
        height: 48px;
        border-radius: 12px;
        background: rgba(255,255,255,0.04);
        margin-top: 14px;
        display: block;
    }

    /* Inner butterchurn — mobile only */
    .rp-full__viz-wrap {
        margin-top: 14px;
        border-radius: 16px;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,0.10);
        background: rgba(0,0,0,0.20);
        position: relative;
        height: 180px;
        display: none; /* hidden on desktop */
    }

    @media (max-width: 820px) {
        .rp-full__viz-wrap { display: block; }
    }

    #radioPageMilk { width: 100%; height: 100%; display: block; }

    .rp-full__console {
        position: absolute;
        top: 8px; left: 10px;
        z-index: 3;
        padding: 5px 8px;
        border-radius: 8px;
        background: rgba(0,0,0,0.06);
        border: 1px solid color-mix(in srgb, var(--radio-accent) 14%, transparent);
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 10px;
        line-height: 1.3;
        color: color-mix(in srgb, var(--radio-accent) 92%, transparent);
        pointer-events: none;
    }

    /* ---- Copyright notice ---- */
    .rp-copyright {
        margin-top: 12px;
        border-radius: 14px;
        border: 1px solid rgba(255,255,255,0.08);
        background: rgba(0,0,0,0.25);
        overflow: hidden;
    }

    .rp-copyright__toggle {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 14px;
        background: none;
        border: none;
        color: rgba(255,255,255,0.50);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        cursor: pointer;
        text-align: left;
    }

    .rp-copyright__toggle:hover { color: rgba(255,255,255,0.75); }

    .rp-copyright__arrow {
        transition: transform .2s ease;
        font-size: 10px;
    }

    .rp-copyright__toggle.is-open .rp-copyright__arrow {
        transform: rotate(180deg);
    }

    .rp-copyright__body {
        display: none;
        padding: 0 14px 12px;
        font-size: 11px;
        line-height: 1.6;
        color: rgba(255,255,255,0.45);
    }

    .rp-copyright__body.is-open { display: block; }

    /* ---- Artist panel ---- */
    .radio-artist {
        background: rgba(10,10,12,0.72);
        border: 1px solid rgba(255,255,255,0.12);
        border-radius: 20px;
        padding: 20px;
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        box-shadow: 0 20px 60px rgba(0,0,0,0.50);
        color: #fff;
    }

    .radio-artist__head {
        display: flex;
        gap: 16px;
        align-items: flex-start;
        margin-bottom: 16px;
    }

    .radio-artist__avatar {
        width: 80px; height: 80px;
        border-radius: 16px;
        object-fit: cover;
        border: 1px solid rgba(255,255,255,0.14);
        flex-shrink: 0;
    }

    .radio-artist__avatar-fallback {
        width: 80px; height: 80px;
        border-radius: 16px;
        background: linear-gradient(135deg, #1a1a20, #0a0a0e);
        border: 1px solid rgba(255,255,255,0.12);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 32px;
        font-weight: 900;
        color: color-mix(in srgb, var(--radio-accent) 85%, transparent);
        flex-shrink: 0;
    }

    .radio-artist__name {
        font-size: 22px;
        font-weight: 900;
        line-height: 1.1;
        margin-bottom: 6px;
    }

    .radio-artist__now-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 4px 10px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.04em;
        background: color-mix(in srgb, var(--radio-accent) 12%, transparent);
        border: 1px solid color-mix(in srgb, var(--radio-accent) 30%, transparent);
        color: color-mix(in srgb, var(--radio-accent) 95%, transparent);
        margin-bottom: 8px;
    }

    .radio-artist__now-dot {
        width: 7px; height: 7px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--radio-accent) 90%, transparent);
        animation: rpNowDot 1.4s ease-in-out infinite;
    }

    @keyframes rpNowDot {
        0%, 100% { opacity: 1; }
        50% { opacity: 0.3; }
    }

    .radio-artist__bio {
        font-size: 13px;
        line-height: 1.6;
        opacity: 0.82;
        margin-bottom: 16px;
    }

    .radio-artist__bio p { margin: 0 0 8px; }
    .radio-artist__bio p:last-child { margin-bottom: 0; }

    .radio-artist__profile-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 8px 14px;
        border-radius: 12px;
        border: 1px solid rgba(255,255,255,0.14);
        background: rgba(255,255,255,0.06);
        color: rgba(255,255,255,0.90);
        text-decoration: none;
        font-size: 13px;
        font-weight: 700;
        transition: background .12s ease, transform .12s ease;
        margin-bottom: 16px;
    }

    .radio-artist__profile-link:hover {
        background: rgba(255,255,255,0.10);
        transform: translateY(-1px);
    }

    /* No-profile CTA */
    .radio-artist__claim {
        margin-top: 12px;
        padding: 12px 14px;
        border-radius: 14px;
        border: 1px solid color-mix(in srgb, var(--radio-accent) 18%, transparent);
        background: color-mix(in srgb, var(--radio-accent) 5%, transparent);
        font-size: 12px;
        line-height: 1.5;
        color: rgba(255,255,255,0.65);
    }

    .radio-artist__claim a {
        color: color-mix(in srgb, var(--radio-accent) 90%, transparent);
        text-decoration: none;
        font-weight: 700;
    }

    .radio-artist__claim a:hover { text-decoration: underline; }

    .radio-artist__events-title {
        font-size: 12px;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        opacity: 0.60;
        margin-bottom: 10px;
    }

    .radio-artist__events {
        display: flex;
        flex-direction: column;
        gap: 0;
        border-radius: 12px;
        overflow: hidden;
        border: 1px solid rgba(255,255,255,0.07);
    }


    
    
    
    

    .radio-no-artist {
        text-align: center;
        padding: 40px 20px;
        opacity: 0.55;
    }

    .radio-no-artist__icon { font-size: 36px; margin-bottom: 10px; }
    .radio-no-artist__text { font-size: 14px; line-height: 1.5; }

    /* ---- Fullscreen mode ---- */
    .radio-page.is-fullscreen .radio-page__content {
        opacity: 0;
        pointer-events: none;
        transform: translateY(20px);
    }

    .radio-page.is-fullscreen .radio-page__overlay {
        opacity: 0.15;
    }

    /* Docked player bar */
    /* ---- Docked fullscreen bar — full width ---- */
    .rp-docked {
        display: none;
        position: fixed;
        bottom: 0; left: 0; right: 0;
        z-index: 100;
        opacity: 0;
        transform: translateY(8px);
        transition: opacity .3s ease, transform .3s ease;
        pointer-events: none;
    }

    .radio-page.is-fullscreen .rp-docked {
        display: block;
    }

    .rp-docked.is-visible {
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
    }

    .rp-docked__inner {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 10px 16px 20px;
        width: 100%;
        box-sizing: border-box;
        background: rgba(10,10,12,0.88);
        border-top: 1px solid rgba(255,255,255,0.08);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        color: #fff;
    }

    .rp-docked__cover {
        width: 44px;
        height: 44px;
        border-radius: 10px;
        object-fit: cover;
        background: rgba(255,255,255,0.06);
        border: 1px solid rgba(255,255,255,0.12);
        flex-shrink: 0;
        display: block;
    }

    .rp-docked__cover-fallback {
        width: 44px;
        height: 44px;
        border-radius: 10px;
        background: color-mix(in srgb, var(--radio-accent) 10%, transparent);
        border: 1px solid color-mix(in srgb, var(--radio-accent) 20%, transparent);
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
    }

    .rp-docked__now {
        flex: 1;
        min-width: 0;
        font-size: 13px;
        font-weight: 700;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        opacity: 0.90;
    }

    .rp-docked__btn {
        padding: 8px 14px;
        border-radius: var(--rp-radius, var(--radius-md, 10px));
        font-family: inherit;
        border: 1px solid rgba(255,255,255,0.16);
        background: rgba(255,255,255,0.08);
        color: #fff;
        font-weight: 700;
        font-size: 13px;
        cursor: pointer;
        white-space: nowrap;
        transition: background .12s ease;
        flex-shrink: 0;
    }

    .rp-docked__btn:hover { background: rgba(255,255,255,0.14); }

    .rp-docked__vol {
        width: 80px;
        flex-shrink: 0;
    }

    .rp-docked__sep {
        width: 1px;
        height: 18px;
        background: rgba(255,255,255,0.12);
        flex-shrink: 0;
    }

    .rp-docked__vc-lbl {
        font-size: 11px;
        font-weight: 700;
        color: rgba(255,255,255,0.40);
        white-space: nowrap;
        flex-shrink: 0;
    }

    .rp-docked__vc-btn {
        width: 30px;
        height: 26px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        border-radius: var(--rp-radius, var(--radius-md, 8px));
        border: 1px solid rgba(255,255,255,0.14);
        background: rgba(255,255,255,0.08);
        color: #fff;
        font-weight: 900;
        cursor: pointer;
        font-size: 13px;
        flex-shrink: 0;
    }

    .rp-docked__vc-btn:hover { background: rgba(255,255,255,0.14); }

    .rp-docked__vc-range {
        width: 80px;
        flex-shrink: 0;
    }

    .rp-docked__exit {
        opacity: 0.50;
        font-size: 11px;
        padding: 8px 10px;
        flex-shrink: 0;
    }

    /* Hide footer/global decorations in fullscreen */
    .radio-page.is-fullscreen ~ footer.site-footer,
    .radio-page.is-fullscreen ~ * footer.site-footer {
        display: none !important;
    }

    body:has(.radio-page.is-fullscreen) .global-block::before,
    body:has(.radio-page.is-fullscreen) .site-footer {
        display: none !important;
    }

    /* Header fade in fullscreen */
    .radio-page.is-fullscreen ~ * .site-nav,
    body.radio-fullscreen .site-nav {
        opacity: 0;
        pointer-events: none;
        transition: opacity .4s ease;
    }
    /* ---- Gate overlay on full page ---- */
    .rp-page-gate {
        position: absolute;
        inset: 0;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(0,0,0,0.55);
        backdrop-filter: blur(10px);
        border-radius: 20px;
        pointer-events: auto;
    }

    .rp-page-gate__inner {
        text-align: center;
        padding: 24px;
    }

    .rp-page-gate__title {
        font-size: 20px;
        font-weight: 900;
        color: #fff;
        margin-bottom: 8px;
    }

    .rp-page-gate__sub {
        font-size: 13px;
        opacity: 0.65;
        color: #fff;
        margin-bottom: 18px;
    }

    .rp-page-gate__btn {
        padding: 14px 28px;
        border-radius: 16px;
        border: 1px solid color-mix(in srgb, var(--radio-accent) 45%, transparent);
        background: color-mix(in srgb, var(--radio-accent) 12%, transparent);
        color: color-mix(in srgb, var(--radio-accent) 95%, transparent);
        font-weight: 900;
        font-size: 16px;
        cursor: pointer;
        transition: background .15s ease, transform .15s ease;
    }

    .rp-page-gate__btn:hover {
        background: color-mix(in srgb, var(--radio-accent) 22%, transparent);
        transform: translateY(-2px);
    }

    /* rp-full needs position:relative for the gate to anchor */
    .rp-full { position: relative; }

    /* ---- Viz controls on full page ---- */
    /* ---- Viz controls — static panel ---- */
    .rp-page-vc {
        margin-top: 10px;
    }

    .rp-page-vc__body {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        padding: 10px 14px;
        border-radius: var(--rp-radius-lg, var(--radius-lg, 14px));
        border: 1px solid rgba(255,255,255,0.10);
        background: rgba(0,0,0,0.25);
        backdrop-filter: blur(10px);
        flex-wrap: wrap;
    }

    .rp-page-vc__title {
        font-size: 11px;
        color: rgba(255,255,255,0.55);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        min-width: 0;
    }
    .rp-page-vc__title strong { color: color-mix(in srgb, var(--radio-accent) 80%, transparent); font-weight: 700; }

    .rp-page-vc__row {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
    }

    .rp-page-vc__status {
        flex: 1;
        min-width: 0;
        font-size: 11px;
        color: rgba(255,255,255,0.45);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .rp-page-vc__status strong {
        color: color-mix(in srgb, var(--radio-accent) 80%, transparent);
        font-weight: 700;
    }

    .rp-page-vc__divider {
        width: 1px;
        height: 16px;
        background: rgba(255,255,255,0.12);
        flex-shrink: 0;
    }

    .rp-page-vc__lbl {
        font-size: 11px;
        font-weight: 700;
        color: rgba(255,255,255,0.45);
        white-space: nowrap;
        flex-shrink: 0;
    }

    .rp-page-vc__btn {
        width: 32px;
        height: 28px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        border-radius: var(--rp-radius, var(--radius-md, 8px));
        border: 1px solid rgba(255,255,255,0.14);
        background: rgba(255,255,255,0.08);
        color: #fff;
        font-weight: 900;
        cursor: pointer;
        font-size: 13px;
        flex-shrink: 0;
        line-height: 1;
    }

    .rp-page-vc__btn:hover { background: rgba(255,255,255,0.14); }

    .rp-page-vc__range {
        width: 90px;
        flex-shrink: 0;
    }

    /* Inner butterchurn — hidden but rendered for WebGL */
    .rp-full__viz-wrap {
        position: fixed;
        top: 0; left: 0;
        width: 100vw;
        height: 100vh;
        visibility: hidden;
        pointer-events: none;
        z-index: -1;
    }

    #radioPageMilk {
        width: 100%;
        height: 100%;
        display: block;
    }

    /* ---- Upcoming-event rows in the artist panel (replaces the San DNB event strip) ---- */
    .radio-ev-row {
        display: flex; align-items: center; gap: 10px;
        min-height: 60px; padding: 6px 10px;
        background: rgba(255,255,255,0.03);
        border-bottom: 1px solid rgba(255,255,255,0.05);
        color: inherit; text-decoration: none;
        transition: background .12s ease;
    }
    .radio-ev-row:last-child { border-bottom: none; }
    .radio-ev-row:hover { background: rgba(255,255,255,0.07); }
    .radio-ev-date { display: flex; flex-direction: column; align-items: center; width: 34px; flex: none; line-height: 1.1; }
    .radio-ev-day { font-size: 18px; font-weight: 800; }
    .radio-ev-mon { font-size: 10px; text-transform: uppercase; letter-spacing: .08em; opacity: .65; }
    .radio-ev-flyer { width: 30px; height: 40px; flex: none; border-radius: 4px; overflow: hidden; background: rgba(255,255,255,0.06); }
    .radio-ev-flyer img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .radio-ev-body { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
    .radio-ev-name { font-size: 12px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .radio-ev-meta { font-size: 11px; opacity: .6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .radio-ev-info { flex: none; font-size: 11px; font-weight: 700; padding: 5px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.16); }


/* Control icons are drawn lines that take the button's colour. */
.rp-ico { display: block; flex: none; }
.rp-full__btn .rp-ico { margin-right: 6px; }
.rp-full__btn--fs .rp-ico { margin-right: 0; }

/* The controls follow the Site's own look: its corner radius, and the Night zine's square, capitalised buttons. */
body.look-zine { --rp-radius: 0px; --rp-radius-lg: 0px; }
body.look-zine .rp-full__btn, body.look-zine .rp-docked__btn, body.look-zine .rp-page-gate__btn {
    text-transform: uppercase; letter-spacing: 0.08em; font-size: 12px; border-radius: 0;
}
body.look-zine .rp-page-vc__body, body.look-zine .rp-page-vc__btn, body.look-zine .rp-docked__vc-btn, body.look-zine .rp-full__cover { border-radius: 0; }

/* With the page left alone, the site menu and the ticket icon fade away, and come back when the pointer moves. */
body.rp-chrome-fade .site-nav, body.rp-chrome-fade .onepage-nav, body.rp-chrome-fade [data-visitor-tickets-icon] { transition: opacity .5s ease; }
body.rp-chrome-fade:not(.rp-awake) .site-nav, body.rp-chrome-fade:not(.rp-awake) .onepage-nav, body.rp-chrome-fade:not(.rp-awake) [data-visitor-tickets-icon] {
    opacity: 0; pointer-events: none;
}
