/* SHC Radio 0.6.37 RC1 — Sonic Hardcore IC5 full-player surfaces and compact global sticky player. */
body.shcRadioMainPlayerActive,
.shcRadioPage {
    --shcr-blue: var(--shc-global-blue, var(--shc-blue, #0b7cff));
    --shcr-blue-bright: var(--shc-global-blue-bright, var(--shc-blue-bright, #27a6ff));
    --shcr-orange: var(--shc-global-orange, var(--shc-orange, #ff7200));
    --shcr-text: var(--shc-global-text, var(--shc-text, #f3f8ff));
    --shcr-soft: var(--shc-global-soft, var(--shc-text-soft, #9fb3c8));
    --shcr-border: var(--shc-global-border, var(--shc-border, #173a59));
    --shcr-surface: var(--shc-global-surface, var(--shc-bg-surface, #06111e));
    --shcr-raised: var(--shc-global-raised, var(--shc-bg-raised, #091a2a));
}

/* Authoritative full-player surfaces own playback; sticky/global players stay out of homepage and /radio. */
body.shcRadioMainPlayerActive .shcGlobalPlayer,
body.shcRadioMainPlayerActive [data-shc-block="global_player"].shcPlayer {
    display: none !important;
}
body.shcRadioMainPlayerActive .shcShell { --shc-player-height: 0px; }

.shcRadio.shcRadio--mainPlayer {
    position: relative;
    display: block;
    min-height: 342px;
    padding: 0;
    overflow: hidden;
    background-image:
        linear-gradient(105deg, rgb(2 9 17 / 98%) 0%, rgb(2 9 17 / 91%) 43%, rgb(2 9 17 / 68%) 72%, rgb(2 9 17 / 45%) 100%),
        var(--shc-radio-image);
    background-size: cover;
    background-position: center;
}

.shcRadio.shcRadio--mainPlayer > .shcBadge { display: none; }

.shcRadioMainPlayer,
.shcRadioMainPlayer * { box-sizing: border-box; }

.shcRadioMainPlayer {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(170px, 220px) minmax(260px, 1.2fr) minmax(245px, .92fr);
    grid-template-areas:
        "art now controls"
        "points points details";
    gap: 18px 22px;
    min-height: 342px;
    padding: 28px 24px 22px;
    color: var(--shcr-text);
}

.shcRadioMainPlayer::before {
    content: '';
    position: absolute;
    inset: 0 0 auto;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--shcr-blue) 20%, var(--shcr-orange) 80%, transparent);
    box-shadow: 0 0 18px rgb(11 124 255 / 35%);
}

.shcRadioMainPlayer__art {
    grid-area: art;
    position: relative;
    align-self: center;
    width: min(100%, 210px);
    aspect-ratio: 1;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--shcr-blue) 58%, var(--shcr-orange));
    border-radius: 9px;
    background: radial-gradient(circle at 50% 35%, #0d4f8f, #030a13 70%);
    box-shadow: 0 18px 38px rgb(0 0 0 / 38%), 0 0 24px rgb(11 124 255 / 14%);
}

.shcRadioMainPlayer__art img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: opacity .22s ease, transform .35s ease;
}
.shcRadioMainPlayer__art img.is-changing { opacity: .22; transform: scale(.97); }

.shcRadioMainPlayer__live {
    position: absolute;
    left: 10px;
    bottom: 10px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 27px;
    padding: 5px 9px;
    color: #68f6cd;
    background: rgb(2 25 26 / 90%);
    border: 1px solid rgb(41 222 178 / 48%);
    border-radius: 6px;
    font-size: .63rem;
    font-weight: 900;
    letter-spacing: .09em;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
}
.shcRadioMainPlayer__live i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #2ae9b7;
    box-shadow: 0 0 12px rgb(42 233 183 / 80%);
}
.shcRadioMainPlayer.is-offline .shcRadioMainPlayer__live { color: #a6b5c4; border-color: #45596d; background: rgb(7 14 22 / 90%); }
.shcRadioMainPlayer.is-offline .shcRadioMainPlayer__live i { background: #65788b; box-shadow: none; }

.shcRadioMainPlayer__now {
    grid-area: now;
    align-self: center;
    min-width: 0;
}
.shcRadioMainPlayer__eyebrow {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    color: var(--shcr-blue-bright);
    font-size: .66rem;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.shcRadioMainPlayer__eyebrow::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--shcr-orange);
    box-shadow: 0 0 10px rgb(255 114 0 / 55%);
}
.shcRadioMainPlayer__title {
    margin: 0;
    overflow: hidden;
    color: #fff;
    font-size: clamp(1.55rem, 2.7vw, 2.55rem);
    font-weight: 950;
    line-height: 1.05;
    letter-spacing: -.025em;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-shadow: 0 2px 14px rgb(0 0 0 / 60%);
}
.shcRadioMainPlayer__artist {
    display: block;
    margin-top: 8px;
    overflow: hidden;
    color: #ffc08d;
    font-size: .94rem;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.shcRadioMainPlayer__station {
    display: block;
    margin-top: 6px;
    color: var(--shcr-soft);
    font-size: .68rem;
}

.shcRadioMainPlayer__wave {
    position: relative;
    height: 50px;
    margin-top: 18px;
    overflow: hidden;
    border: 1px solid rgb(39 166 255 / 14%);
    border-radius: 7px;
    background: rgb(2 10 18 / 22%);
    box-shadow: none;
    mask-image: linear-gradient(90deg, transparent, #000 2.5%, #000 97.5%, transparent);
}
.shcRadioMainPlayer__wave canvas {
    width: 100%;
    height: 100%;
    display: block;
}
.shcRadioMainPlayer__wave small {
    position: absolute;
    right: 7px;
    bottom: 4px;
    z-index: 2;
    max-width: calc(100% - 14px);
    overflow: hidden;
    color: rgb(159 179 200 / 76%);
    font-size: .48rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
    pointer-events: none;
}
.shcRadioMainPlayer.is-playing .shcRadioMainPlayer__wave {
    border-color: rgb(39 166 255 / 20%);
    box-shadow: none;
}
.shcRadioMainPlayer__wave.is-unavailable {
    border-color: rgb(255 114 0 / 24%);
}
.shcRadioMainPlayer__wave.is-unavailable small { color: #ffb06d; }

.shcRadioMainPlayer__controls {
    grid-area: controls;
    align-self: center;
    display: grid;
    gap: 14px;
}
.shcRadioMainPlayer__play {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 20px;
    color: #fff;
    background: linear-gradient(180deg, #1685ff, #0750d9);
    border: 1px solid #278eff;
    border-radius: 8px;
    box-shadow: 0 0 22px rgb(8 124 255 / 26%);
    font-size: .82rem;
    font-weight: 900;
    letter-spacing: .035em;
    text-transform: uppercase;
    cursor: pointer;
}
.shcRadioMainPlayer__play:hover { filter: brightness(1.08); box-shadow: 0 0 28px rgb(8 124 255 / 40%); }
.shcRadioMainPlayer__play:disabled { opacity: .48; cursor: not-allowed; filter: none; }
.shcRadioMainPlayer.is-playing .shcRadioMainPlayer__play {
    background: linear-gradient(180deg, #ff8b24, #dc4d05);
    border-color: var(--shcr-orange);
    box-shadow: 0 0 22px rgb(255 114 0 / 25%);
}

.shcRadioMainPlayer__volume {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 42px;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 7px 10px;
    background: rgb(2 11 21 / 82%);
    border: 1px solid var(--shcr-border);
    border-radius: 8px;
}
.shcRadioMainPlayer__mute {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: #e9f4ff;
    background: #061522;
    border: 1px solid #24435e;
    border-radius: 50%;
    cursor: pointer;
}
.shcRadioMainPlayer__volume input { width: 100%; accent-color: var(--shcr-blue); }
.shcRadioMainPlayer__volume output { color: #8fb5d5; font-size: .68rem; text-align: right; }

.shcRadioMainPlayer__points {
    grid-area: points;
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(120px, 1fr) auto;
    grid-template-areas: "label rail time" "status status status" "hour hour hour";
    align-items: center;
    gap: 8px 13px;
    min-height: 70px;
    padding: 11px 14px;
    background: linear-gradient(90deg, rgb(3 19 35 / 94%), rgb(4 25 45 / 92%));
    border: 1px solid #18466f;
    border-radius: 8px;
    overflow: hidden;
}
.shcRadioMainPlayer__points::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(var(--shcr-blue), var(--shcr-orange));
}
.shcRadioMainPlayer__pointsLabel {
    grid-area: label;
    display: flex;
    align-items: center;
    gap: 7px;
    color: #ffad57;
    font-size: .68rem;
    font-weight: 950;
    letter-spacing: .09em;
    text-transform: uppercase;
    white-space: nowrap;
}
.shcRadioMainPlayer__pointsLabel i { color: var(--shcr-blue-bright); }
.shcRadioMainPlayer__pointsRail {
    grid-area: rail;
    height: 8px;
    overflow: hidden;
    background: #020914;
    border: 1px solid #1d3d57;
    border-radius: 999px;
}
.shcRadioMainPlayer__pointsRail i {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--shcr-blue), var(--shcr-orange));
    box-shadow: 0 0 10px rgb(11 124 255 / 35%);
    transition: width .35s ease;
}
.shcRadioMainPlayer__pointsTime { grid-area: time; color: #e9f4ff; font-size: .7rem; white-space: nowrap; }
.shcRadioMainPlayer__pointsStatus { grid-area: status; color: #99aec2; font-size: .65rem; line-height: 1.35; }
.shcRadioMainPlayer__hourBonus { grid-area: hour; min-width: 0; display: grid; grid-template-columns: auto minmax(90px, 1fr) auto; align-items: center; gap: 7px; color: #91aac0; font-size: .58rem; }
.shcRadioMainPlayer__hourBonus b { color: #ffb36f; font-size: .56rem; text-transform: uppercase; white-space: nowrap; }
.shcRadioMainPlayer__hourRail { height: 4px; overflow: hidden; background: #020914; border: 1px solid #1d3d57; border-radius: 999px; }
.shcRadioMainPlayer__hourRail i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--shcr-orange), var(--shcr-blue)); transition: width .35s ease; }
.shcRadioMainPlayer__hourBonus strong { color: #cfe5f8; font-size: .57rem; white-space: nowrap; }
.shcRadioMainPlayer__points.is-reward { animation: shcrRewardPanel .75s ease; }

.shcRadioMainPlayer__reward {
    position: absolute;
    z-index: 8;
    right: 12px;
    bottom: calc(100% + 10px);
    min-width: 210px;
    max-width: min(360px, 90vw);
    padding: 12px 14px;
    color: #fff;
    background: linear-gradient(135deg, #073e78, #0a6dcc 58%, #a44108);
    border: 1px solid #3a9dff;
    border-radius: 8px;
    box-shadow: 0 18px 38px rgb(0 0 0 / 46%), 0 0 26px rgb(11 124 255 / 25%);
    transform: translateY(8px);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
    font-size: .72rem;
    font-weight: 850;
}
.shcRadioMainPlayer__reward.is-visible { opacity: 1; transform: translateY(0); }
.shcRadioMainPlayer__reward strong { color: #ffd09e; }

.shcRadioMainPlayer__details {
    grid-area: details;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}
.shcRadioMainPlayer__detail {
    min-width: 0;
    padding: 8px 9px;
    background: rgb(2 11 21 / 78%);
    border: 1px solid #17354f;
    border-radius: 7px;
}
.shcRadioMainPlayer__detail small,
.shcRadioMainPlayer__detail strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shcRadioMainPlayer__detail small { color: #7f98b0; font-size: .56rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.shcRadioMainPlayer__detail strong { margin-top: 3px; color: #eaf4ff; font-size: .71rem; }
.shcRadioMainPlayer__detail--wide { grid-column: 1 / -1; }
.shcRadioMainPlayer__detail--wide strong { color: #ffb06d; }

@keyframes shcrRewardPanel {
    0%, 100% { border-color: #18466f; box-shadow: none; }
    45% { border-color: var(--shcr-orange); box-shadow: 0 0 24px rgb(255 114 0 / 30%); }
}

@media (max-width: 1080px) {
    .shcRadioMainPlayer {
        grid-template-columns: 160px minmax(230px, 1fr) 220px;
        gap: 15px;
        padding-inline: 18px;
    }
    .shcRadioMainPlayer__details { grid-template-columns: 1fr; }
    .shcRadioMainPlayer__detail--wide { grid-column: auto; }
}

@media (max-width: 820px) {
    .shcRadio.shcRadio--mainPlayer { min-height: 0; }
    .shcRadioMainPlayer {
        grid-template-columns: 112px minmax(0, 1fr);
        grid-template-areas:
            "art now"
            "controls controls"
            "points points"
            "details details";
        min-height: 0;
        gap: 14px;
        padding: 18px 14px;
    }
    .shcRadioMainPlayer__art { width: 112px; }
    .shcRadioMainPlayer__title { font-size: clamp(1.25rem, 5vw, 1.8rem); }
    .shcRadioMainPlayer__wave { height: 36px; margin-top: 10px; }
    .shcRadioMainPlayer__controls { grid-template-columns: minmax(140px, .8fr) minmax(170px, 1.2fr); align-items: center; }
    .shcRadioMainPlayer__play { min-height: 50px; }
    .shcRadioMainPlayer__volume { min-height: 50px; }
    .shcRadioMainPlayer__details { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .shcRadioMainPlayer__detail--wide { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
    .shcRadioMainPlayer {
        grid-template-columns: 88px minmax(0, 1fr);
        gap: 11px;
        padding: 14px 11px;
    }
    .shcRadioMainPlayer__art { width: 88px; }
    .shcRadioMainPlayer__eyebrow { margin-bottom: 4px; font-size: .57rem; }
    .shcRadioMainPlayer__title { font-size: 1.18rem; }
    .shcRadioMainPlayer__artist { margin-top: 5px; font-size: .78rem; }
    .shcRadioMainPlayer__station { display: none; }
    .shcRadioMainPlayer__wave { height: 28px; margin-top: 6px; }
    .shcRadioMainPlayer__controls { display: grid; grid-template-columns: 1fr; }
    .shcRadioMainPlayer__points {
        grid-template-columns: 1fr auto;
        grid-template-areas: "label time" "rail rail" "status status";
    }
    .shcRadioMainPlayer__details { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shcRadioMainPlayer__detail--wide { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
    .shcRadioMainPlayer__reward,
    .shcRadioMainPlayer__pointsRail i,
    .shcRadioMainPlayer__art img { transition: none; }
}

/* 0.6.6 — swap SHC Points and visualizer emphasis without changing their data/behavior. */
.shcRadioMainPlayer__points--compact {
    grid-area: auto;
    margin-top: 12px;
    min-height: 44px;
    padding: 6px 10px;
    gap: 5px 9px;
    grid-template-columns: auto minmax(80px, 1fr) auto;
    grid-template-areas: "label rail time" "status status status" "hour hour hour";
    border-radius: 7px;
}
.shcRadioMainPlayer__points--compact .shcRadioMainPlayer__pointsLabel { font-size: .61rem; }
.shcRadioMainPlayer__points--compact .shcRadioMainPlayer__pointsRail { height: 6px; }
.shcRadioMainPlayer__points--compact .shcRadioMainPlayer__pointsTime { font-size: .62rem; }
.shcRadioMainPlayer__points--compact .shcRadioMainPlayer__pointsStatus {
    overflow: hidden;
    font-size: .56rem;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.shcRadioMainPlayer__wave--wide {
    grid-area: points;
    align-self: stretch;
    height: 156px;
    margin-top: 0;
    border-radius: 8px;
}
.shcRadioMainPlayer.is-playing .shcRadioMainPlayer__wave--wide {
    box-shadow: none;
}

@media (max-width: 820px) {
    .shcRadioMainPlayer__points--compact { margin-top: 8px; }
    .shcRadioMainPlayer__wave--wide { height: 126px; margin-top: 0; }
}

@media (max-width: 560px) {
    .shcRadioMainPlayer__points--compact {
        grid-template-columns: 1fr auto;
        grid-template-areas: "label time" "rail rail" "status status";
        min-height: 52px;
        padding: 6px 8px;
    }
    .shcRadioMainPlayer__points--compact .shcRadioMainPlayer__pointsStatus { font-size: .56rem; }
    .shcRadioMainPlayer__wave--wide { height: 100px; margin-top: 0; }
}

.shcRadioMainPlayer__wave--wide::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgb(255 255 255 / 6%), transparent);
    transform: translateY(-0.5px);
    pointer-events: none;
    z-index: 1;
}
.shcRadioMainPlayer__wave--wide canvas { position: relative; z-index: 0; }
.shcRadioMainPlayer__wave--wide small { z-index: 2; }

/* 0.6.14 — split /radio page: chat placeholder left, full player right. */
body.shcRadioFullPageActive .ipsPageHeader,
body.shcRadioFullPageActive [data-role="pageHeader"],
body.shcRadioFullPageActive [data-page-header] {
    display: none !important;
}

.shcRadioPage {
    width: min(100%, 1580px);
    margin: 0 auto;
    padding: 0 0 34px;
    color: var(--shcr-text);
}

.shcRadioPage__split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 18px;
    align-items: stretch;
}

.shcRadioPage__chat,
.shcRadioPage__radio {
    min-width: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 8%, rgb(11 124 255 / 10%), transparent 34%),
        radial-gradient(circle at 90% 92%, rgb(255 114 0 / 7%), transparent 30%),
        linear-gradient(118deg, rgb(2 9 17 / 99%), rgb(4 18 31 / 98%) 55%, rgb(5 14 23 / 99%));
    border: 1px solid rgb(39 166 255 / 18%);
    border-radius: 10px;
}

.shcRadioPage__chat {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 660px;
}

.shcRadioPage__chat::before,
.shcRadioPage__radio::before {
    content: '';
    display: block;
    height: 2px;
    flex: 0 0 2px;
    background: linear-gradient(90deg, var(--shcr-blue), var(--shcr-orange));
}

.shcRadioPage__chatHeader {
    min-height: 62px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 0 18px;
    background: rgb(3 15 27 / 72%);
    border-bottom: 1px solid rgb(39 166 255 / 13%);
}

.shcRadioPage__chatHeader strong {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #f3f8ff;
    font-size: .82rem;
    font-weight: 950;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.shcRadioPage__chatHeader strong i { color: var(--shcr-blue-bright); }

.shcRadioPage__chatHeader span {
    padding: 5px 8px;
    color: #ffb06d;
    background: rgb(52 26 7 / 62%);
    border: 1px solid rgb(255 114 0 / 28%);
    border-radius: 999px;
    font-size: .53rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.shcRadioPage__chatBody {
    flex: 1;
    min-height: 420px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 34px 28px;
    text-align: center;
}

.shcRadioPage__chatIcon {
    width: 72px;
    height: 72px;
    display: grid;
    place-items: center;
    margin-bottom: 17px;
    color: #58b8ff;
    background: linear-gradient(145deg, #0a3156, #061522);
    border: 1px solid #1f6da8;
    border-radius: 18px;
    font-size: 1.75rem;
}

.shcRadioPage__chatBody h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.5rem, 2.5vw, 2.25rem);
    font-weight: 950;
    letter-spacing: -.025em;
}

.shcRadioPage__chatBody p {
    max-width: 420px;
    margin: 10px auto 0;
    color: var(--shcr-soft);
    font-size: .78rem;
    line-height: 1.6;
}

.shcRadioPage__chatBody small {
    margin-top: 14px;
    color: #ffad57;
    font-size: .58rem;
    font-weight: 900;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.shcRadioPage__radio {
    position: relative;
}

.shcRadioPage .shcRadio.shcRadio--fullPagePlayer {
    min-height: 0;
    overflow: hidden;
    background: transparent;
    border: 0;
    border-radius: 0;
}

.shcRadioPage .shcRadioMainPlayer {
    grid-template-columns: 170px minmax(0, 1fr);
    grid-template-areas:
        "art now"
        "controls controls"
        "points points"
        "details details";
    gap: 18px;
    min-height: 0;
    padding: 24px 20px 20px;
}

.shcRadioPage .shcRadioMainPlayer::before { display: none; }

.shcRadioPage .shcRadioMainPlayer__art {
    width: 170px;
    align-self: center;
}

.shcRadioPage .shcRadioMainPlayer__title {
    font-size: clamp(1.55rem, 2.2vw, 2.35rem);
}

.shcRadioPage .shcRadioMainPlayer__artist { font-size: .92rem; }

.shcRadioPage .shcRadioMainPlayer__points--compact {
    max-width: none;
    margin-top: 14px;
}

.shcRadioPage .shcRadioMainPlayer__controls {
    grid-template-columns: minmax(180px, .78fr) minmax(250px, 1.22fr);
    align-items: center;
}

.shcRadioPage .shcRadioMainPlayer__wave--wide {
    height: 180px;
    margin-top: 0;
}

.shcRadioPage .shcRadioMainPlayer__details {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.shcRadioPage .shcRadioMainPlayer__detail {
    min-height: 56px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 9px 10px;
}

.shcRadioPage .shcRadioMainPlayer__detail--wide { grid-column: span 2; }

@media (max-width: 1180px) {
    .shcRadioPage__split { grid-template-columns: 1fr; }
    .shcRadioPage__chat { min-height: 380px; }
    .shcRadioPage__chatBody { min-height: 270px; }
    .shcRadioPage .shcRadioMainPlayer {
        grid-template-columns: 190px minmax(0, 1fr);
        padding: 24px 22px;
    }
    .shcRadioPage .shcRadioMainPlayer__art { width: 190px; }
    .shcRadioPage .shcRadioMainPlayer__wave--wide { height: 176px; }
}

@media (max-width: 720px) {
    .shcRadioPage { padding-top: 0; }
    .shcRadioPage__split { gap: 12px; }
    .shcRadioPage__chat { min-height: 300px; }
    .shcRadioPage__chatHeader { min-height: 54px; padding: 0 14px; }
    .shcRadioPage__chatBody { min-height: 220px; padding: 26px 18px; }
    .shcRadioPage__chatIcon { width: 58px; height: 58px; border-radius: 15px; font-size: 1.35rem; }
    .shcRadioPage .shcRadioMainPlayer {
        grid-template-columns: 112px minmax(0, 1fr);
        grid-template-areas:
            "art now"
            "controls controls"
            "points points"
            "details details";
        gap: 14px;
        padding: 18px 14px;
    }
    .shcRadioPage .shcRadioMainPlayer__art { width: 112px; }
    .shcRadioPage .shcRadioMainPlayer__title { font-size: clamp(1.35rem, 6vw, 2rem); }
    .shcRadioPage .shcRadioMainPlayer__controls { grid-template-columns: 1fr; }
    .shcRadioPage .shcRadioMainPlayer__wave--wide { height: 132px; }
    .shcRadioPage .shcRadioMainPlayer__details { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shcRadioPage .shcRadioMainPlayer__detail--wide { grid-column: 1 / -1; }
}

@media (max-width: 480px) {
    .shcRadioPage__chatHeader span { display: none; }
    .shcRadioPage .shcRadioMainPlayer {
        grid-template-columns: 88px minmax(0, 1fr);
        gap: 11px;
        padding: 14px 11px;
    }
    .shcRadioPage .shcRadioMainPlayer__art { width: 88px; }
    .shcRadioPage .shcRadioMainPlayer__station { display: none; }
    .shcRadioPage .shcRadioMainPlayer__points--compact { margin-top: 9px; }
    .shcRadioPage .shcRadioMainPlayer__wave--wide { height: 108px; }
}

/* 0.6.16 — authoritative global expanded/minimised sticky Radio player. */
.shcRadioStickyHost,
.shcRadioStickyHost * { box-sizing: border-box; }

.shcRadioStickyHost {
    position: fixed;
    z-index: 10050;
    left: 0;
    right: 0;
    bottom: 0;
    color: var(--shcr-text, #f3f8ff);
    pointer-events: none;
}

/* 0.6.37 RC1 — centered sticky-bar visibility tab. HIDE removes the full bar; SHOW restores it. */
.shcRadioStickyHost__visibility {
    position: absolute;
    z-index: 5;
    left: 50%;
    bottom: calc(100% - 11px);
    min-width: 78px;
    height: 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 15px;
    color: #fff;
    background: linear-gradient(180deg, #0d66ba, #052b50);
    border: 1px solid #278eff;
    border-bottom-color: #123d60;
    border-radius: 7px;
    box-shadow: 0 -5px 16px rgb(0 0 0 / 34%), 0 0 14px rgb(11 124 255 / 20%);
    transform: translateX(-50%);
    pointer-events: auto;
    cursor: pointer;
    font-size: .57rem;
    font-weight: 950;
    letter-spacing: .11em;
    line-height: 1;
    text-transform: uppercase;
}
.shcRadioStickyHost__visibility:hover,
.shcRadioStickyHost__visibility:focus-visible {
    background: linear-gradient(180deg, #1685ff, #064783);
    border-color: #55acff;
    outline: none;
    box-shadow: 0 -5px 18px rgb(0 0 0 / 38%), 0 0 20px rgb(39 142 255 / 34%);
}
.shcRadioStickyHost.is-hidden .shcRadioSticky { display: none !important; }
.shcRadioStickyHost.is-hidden .shcRadioStickyHost__visibility {
    bottom: 0;
    min-width: 86px;
    height: 27px;
    background: linear-gradient(180deg, #ff8b24, #b84405);
    border-color: #ff982f;
    border-bottom: 0;
    border-radius: 7px 7px 0 0;
    box-shadow: 0 -7px 20px rgb(0 0 0 / 40%), 0 0 18px rgb(255 114 0 / 28%);
}
.shcRadioStickyHost.is-hidden .shcRadioStickyHost__visibility:hover,
.shcRadioStickyHost.is-hidden .shcRadioStickyHost__visibility:focus-visible {
    background: linear-gradient(180deg, #ffa047, #d85208);
    border-color: #ffb36f;
}

.shcRadioSticky {
    position: relative;
    display: grid;
    grid-template-columns: 82px minmax(190px, 1.05fr) minmax(300px, 1.45fr) minmax(265px, .95fr) 42px;
    grid-template-areas:
        "art now wave controls toggle"
        "art points details controls toggle";
    align-items: center;
    gap: 8px 16px;
    min-height: 142px;
    padding: 12px max(18px, calc((100vw - 1600px) / 2 + 18px));
    color: var(--shcr-text, #f3f8ff);
    background:
        radial-gradient(circle at 16% 0%, rgb(11 124 255 / 13%), transparent 30%),
        radial-gradient(circle at 84% 100%, rgb(255 114 0 / 9%), transparent 28%),
        linear-gradient(90deg, rgb(1 6 13 / 99%), rgb(3 17 29 / 99%) 48%, rgb(2 8 15 / 99%));
    border-top: 1px solid rgb(39 166 255 / 30%);
    box-shadow: 0 -16px 38px rgb(0 0 0 / 46%);
    pointer-events: auto;
    transition: min-height .22s ease, padding .22s ease;
}

.shcRadioSticky::before {
    content: '';
    position: absolute;
    inset: 0 0 auto;
    height: 2px;
    background: linear-gradient(90deg, transparent 2%, var(--shcr-blue, #0b7cff) 26%, var(--shcr-orange, #ff7200) 74%, transparent 98%);
}

.shcRadioSticky__toggle {
    grid-area: toggle;
    align-self: stretch;
    width: 42px;
    min-height: 42px;
    display: grid;
    place-items: center;
    padding: 0;
    color: #b8d3ec;
    background: rgb(4 17 29 / 82%);
    border: 1px solid #1b4567;
    border-radius: 8px;
    cursor: pointer;
}
.shcRadioSticky__toggle:hover { color: #fff; border-color: var(--shcr-blue-bright, #27a6ff); }
.shcRadioSticky__toggle span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.shcRadioSticky__art {
    grid-area: art;
    position: relative;
    width: 82px;
    aspect-ratio: 1;
    overflow: hidden;
    background: #020914;
    border: 1px solid #1d557f;
    border-radius: 8px;
}
.shcRadioSticky__art img { width: 100%; height: 100%; display: block; object-fit: cover; transition: opacity .18s ease; }
.shcRadioSticky__art img.is-changing { opacity: .25; }
.shcRadioSticky__live {
    position: absolute;
    left: 6px;
    right: 6px;
    bottom: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 21px;
    padding: 3px 5px;
    color: #68f6cd;
    background: rgb(2 25 26 / 91%);
    border: 1px solid rgb(41 222 178 / 38%);
    border-radius: 5px;
    font-size: .48rem;
    font-weight: 950;
    letter-spacing: .07em;
    text-transform: uppercase;
}
.shcRadioSticky__live i { width: 6px; height: 6px; border-radius: 50%; background: #2ae9b7; }
.shcRadioSticky.is-offline .shcRadioSticky__live { color: #9dafbf; background: rgb(7 14 22 / 92%); border-color: #43586b; }
.shcRadioSticky.is-offline .shcRadioSticky__live i { background: #65788b; }

.shcRadioSticky__now { grid-area: now; min-width: 0; align-self: end; }
.shcRadioSticky__eyebrow {
    display: block;
    margin-bottom: 3px;
    color: var(--shcr-blue-bright, #27a6ff);
    font-size: .51rem;
    font-weight: 950;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.shcRadioSticky__title {
    margin: 0;
    overflow: hidden;
    color: #fff;
    font-size: clamp(1rem, 1.45vw, 1.32rem);
    font-weight: 950;
    line-height: 1.08;
    letter-spacing: -.02em;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.shcRadioSticky__artist,
.shcRadioSticky__station { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shcRadioSticky__artist { margin-top: 4px; color: #ffb97d; font-size: .69rem; }
.shcRadioSticky__station { margin-top: 2px; color: #8199b0; font-size: .54rem; }

.shcRadioSticky__wave {
    grid-area: wave;
    position: relative;
    align-self: stretch;
    min-height: 64px;
    overflow: hidden;
    background: rgb(2 9 16 / 38%);
    border: 1px solid rgb(39 166 255 / 13%);
    border-radius: 7px;
}
.shcRadioSticky__wave::before {
    content: '';
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgb(255 255 255 / 6%), transparent);
    pointer-events: none;
}
.shcRadioSticky__wave canvas { position: relative; z-index: 0; width: 100%; height: 100%; display: block; }
.shcRadioSticky__wave small {
    position: absolute;
    z-index: 2;
    right: 6px;
    bottom: 3px;
    color: rgb(159 179 200 / 62%);
    font-size: .42rem;
    font-weight: 900;
    letter-spacing: .08em;
}
.shcRadioSticky__wave.is-unavailable small { color: #ffae69; }

.shcRadioSticky__points {
    grid-area: points;
    position: relative;
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(70px, 1fr) auto;
    grid-template-areas: "label rail time" "status status status" "hour hour hour";
    align-items: center;
    gap: 4px 8px;
    align-self: start;
}
.shcRadioSticky__pointsLabel { grid-area: label; color: #ffb36f; font-size: .51rem; white-space: nowrap; }
.shcRadioSticky__pointsRail {
    grid-area: rail;
    height: 5px;
    overflow: hidden;
    background: #010711;
    border: 1px solid #183b58;
    border-radius: 999px;
}
.shcRadioSticky__pointsRail i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--shcr-blue, #0b7cff), var(--shcr-orange, #ff7200)); transition: width .32s ease; }
.shcRadioSticky__pointsTime { grid-area: time; color: #dcecff; font-size: .51rem; white-space: nowrap; }
.shcRadioSticky__pointsStatus { grid-area: status; overflow: hidden; color: #8fa7bc; font-size: .49rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.shcRadioSticky__hourBonus { grid-area: hour; min-width: 0; display: grid; grid-template-columns: auto minmax(70px, 1fr) auto; align-items: center; gap: 6px; color: #8fa7bc; font-size: .46rem; }
.shcRadioSticky__hourBonus b { color: #ffb36f; font-size: .45rem; text-transform: uppercase; white-space: nowrap; }
.shcRadioSticky__hourRail { height: 4px; overflow: hidden; background: #010711; border: 1px solid #183b58; border-radius: 999px; }
.shcRadioSticky__hourRail i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--shcr-orange, #ff7200), var(--shcr-blue, #0b7cff)); transition: width .32s ease; }
.shcRadioSticky__hourBonus strong { color: #cfe5f8; font-size: .46rem; white-space: nowrap; }
.shcRadioSticky__points.is-reward { animation: shcrRewardPanel .75s ease; }
.shcRadioSticky__reward {
    position: absolute;
    right: 0;
    bottom: calc(100% + 10px);
    min-width: 235px;
    max-width: min(380px, 88vw);
    padding: 10px 12px;
    color: #fff;
    background: linear-gradient(135deg, #073e78, #0a6dcc 58%, #a44108);
    border: 1px solid #3a9dff;
    border-radius: 8px;
    box-shadow: 0 16px 34px rgb(0 0 0 / 48%);
    opacity: 0;
    transform: translateY(7px);
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease;
    font-size: .63rem;
    font-weight: 850;
}
.shcRadioSticky__reward.is-visible { opacity: 1; transform: translateY(0); }
.shcRadioSticky__reward strong { color: #ffd09e; }

.shcRadioSticky__controls {
    grid-area: controls;
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    align-self: stretch;
    align-content: center;
}
.shcRadioSticky__play {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 13px;
    color: #fff;
    background: linear-gradient(180deg, #1685ff, #0750d9);
    border: 1px solid #278eff;
    border-radius: 7px;
    font-size: .63rem;
    font-weight: 950;
    letter-spacing: .04em;
    text-transform: uppercase;
    cursor: pointer;
}
.shcRadioSticky__play:disabled { opacity: .48; cursor: not-allowed; }
.shcRadioSticky.is-playing .shcRadioSticky__play { background: linear-gradient(180deg, #ff8b24, #dc4d05); border-color: var(--shcr-orange, #ff7200); }
.shcRadioSticky__volume {
    min-height: 38px;
    display: grid;
    grid-template-columns: 34px minmax(70px, 1fr) 38px;
    align-items: center;
    gap: 6px;
    padding: 0 8px;
    background: rgb(2 10 18 / 72%);
    border: 1px solid #173b59;
    border-radius: 7px;
}
.shcRadioSticky__mute { width: 30px; height: 30px; padding: 0; color: #d8ebff; background: transparent; border: 0; cursor: pointer; }
.shcRadioSticky__volume input { width: 100%; accent-color: var(--shcr-blue, #0b7cff); cursor: pointer; }
.shcRadioSticky__volume output { color: #a7bdd1; font-size: .55rem; text-align: right; }

.shcRadioSticky__details {
    grid-area: details;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 5px;
    align-self: start;
}
.shcRadioSticky__details > span {
    min-width: 0;
    padding: 5px 6px;
    background: rgb(2 10 18 / 58%);
    border: 1px solid #15344e;
    border-radius: 6px;
}
.shcRadioSticky__details small,
.shcRadioSticky__details strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shcRadioSticky__details small { color: #718ca5; font-size: .42rem; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.shcRadioSticky__details strong { margin-top: 2px; color: #e9f4ff; font-size: .51rem; }
.shcRadioSticky__details .is-show strong { color: #ffb06d; }

/* Minimized state is deliberately limited to track, Points status/progress, play and volume. */
.shcRadioSticky.is-minimized {
    grid-template-columns: minmax(180px, 1.05fr) minmax(260px, 1.45fr) minmax(315px, 1fr) 42px;
    grid-template-areas: "now points controls toggle";
    gap: 12px 16px;
    min-height: 72px;
    padding-top: 8px;
    padding-bottom: 8px;
}
.shcRadioSticky.is-minimized .shcRadioSticky__art,
.shcRadioSticky.is-minimized .shcRadioSticky__wave,
.shcRadioSticky.is-minimized .shcRadioSticky__details,
.shcRadioSticky.is-minimized .shcRadioSticky__eyebrow,
.shcRadioSticky.is-minimized .shcRadioSticky__artist,
.shcRadioSticky.is-minimized .shcRadioSticky__station,
.shcRadioSticky.is-minimized .shcRadioSticky__pointsLabel,
.shcRadioSticky.is-minimized .shcRadioSticky__pointsTime { display: none; }
.shcRadioSticky.is-minimized .shcRadioSticky__now { align-self: center; }
.shcRadioSticky.is-minimized .shcRadioSticky__title { font-size: clamp(.88rem, 1.2vw, 1.12rem); }
.shcRadioSticky.is-minimized .shcRadioSticky__points {
    align-self: center;
    grid-template-columns: 1fr;
    grid-template-areas: "rail" "status";
    gap: 5px;
}
.shcRadioSticky.is-minimized .shcRadioSticky__pointsRail { height: 6px; }
.shcRadioSticky.is-minimized .shcRadioSticky__pointsStatus { font-size: .54rem; }
.shcRadioSticky.is-minimized .shcRadioSticky__controls {
    grid-template-columns: minmax(118px, .72fr) minmax(190px, 1.28fr);
    gap: 8px;
    align-self: center;
}
.shcRadioSticky.is-minimized .shcRadioSticky__play,
.shcRadioSticky.is-minimized .shcRadioSticky__volume { min-height: 42px; }

@media (max-width: 1120px) {
    .shcRadioSticky {
        grid-template-columns: 72px minmax(160px, 1fr) minmax(230px, 1.2fr) minmax(220px, .95fr) 38px;
        gap: 7px 11px;
        min-height: 132px;
        padding-inline: 12px;
    }
    .shcRadioSticky__art { width: 72px; }
    .shcRadioSticky__details { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .shcRadioSticky__details .is-show { grid-column: span 2; }
    .shcRadioSticky.is-minimized {
        grid-template-columns: minmax(150px, .9fr) minmax(230px, 1.2fr) minmax(285px, 1fr) 38px;
        padding-inline: 12px;
    }
}

@media (max-width: 780px) {
    .shcRadioSticky {
        grid-template-columns: 64px minmax(0, 1fr) 38px;
        grid-template-areas:
            "art now toggle"
            "wave wave wave"
            "points points points"
            "controls controls controls"
            "details details details";
        min-height: 0;
        padding: 10px 10px 9px;
    }
    .shcRadioSticky__art { width: 64px; }
    .shcRadioSticky__wave { min-height: 70px; }
    .shcRadioSticky__controls { grid-template-columns: minmax(120px, .72fr) minmax(180px, 1.28fr); }
    .shcRadioSticky__details { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .shcRadioSticky.is-minimized {
        grid-template-columns: minmax(0, 1fr) 44px;
        grid-template-areas:
            "now toggle"
            "points points"
            "controls controls";
        gap: 7px 9px;
        min-height: 112px;
        padding: 8px 10px;
    }
    .shcRadioSticky.is-minimized .shcRadioSticky__controls { grid-template-columns: 112px minmax(0, 1fr); }
}

@media (max-width: 480px) {
    .shcRadioSticky__station { display: none; }
    .shcRadioSticky__controls { grid-template-columns: 1fr; }
    .shcRadioSticky__details { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shcRadioSticky__details .is-show { grid-column: 1 / -1; }
    .shcRadioSticky.is-minimized { min-height: 118px; }
    .shcRadioSticky.is-minimized .shcRadioSticky__controls { grid-template-columns: 104px minmax(0, 1fr); }
    .shcRadioSticky__volume { grid-template-columns: 30px minmax(45px, 1fr) 34px; padding-inline: 5px; }
    .shcRadioSticky__play span { font-size: .55rem; }
}

@media (prefers-reduced-motion: reduce) {
    .shcRadioSticky,
    .shcRadioSticky__reward,
    .shcRadioSticky__pointsRail i { transition: none; }
}

/* 0.6.16 — backend-driven sticky bar polish and hard retirement of the old Frontend demo player. */
body.shcRadioStickyActive .shcGlobalPlayer,
body.shcRadioStickyActive [data-shc-global-player],
body.shcRadioStickyActive [data-shc-block="global_player"].shcPlayer {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.shcRadioSticky {
    grid-template-columns: 72px minmax(190px, 1.05fr) minmax(260px, 1.35fr) minmax(245px, .95fr) 42px;
    grid-template-areas:
        "art now wave controls toggle"
        "art points details controls toggle";
    gap: 7px 14px;
    min-height: 118px;
    padding-top: 9px;
    padding-bottom: 9px;
}
.shcRadioSticky__art { width: 72px; }
.shcRadioSticky__wave { min-height: 52px; }
.shcRadioSticky__now { align-self: center; }
.shcRadioSticky__title { font-size: clamp(.96rem, 1.25vw, 1.2rem); }

.shcRadioSticky__points {
    grid-template-columns: minmax(90px, 1fr) auto;
    grid-template-areas:
        "head head"
        "rail time"
        "status status"
        "hour hour";
    gap: 4px 8px;
}
.shcRadioSticky__pointsHead {
    grid-area: head;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.shcRadioSticky__pointsBalance {
    overflow: hidden;
    color: #fff;
    font-size: .56rem;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.shcRadioSticky__points.is-points-unavailable .shcRadioSticky__pointsBalance { color: #8295a8; }
.shcRadioSticky__points.is-points-guest .shcRadioSticky__pointsBalance { color: #ffb36f; }

.shcRadioSticky__controls {
    grid-template-columns: 56px minmax(150px, 1fr);
    gap: 9px;
    align-self: center;
}
.shcRadioSticky__play {
    width: 54px;
    min-width: 54px;
    min-height: 54px;
    height: 54px;
    padding: 0;
    border-radius: 50%;
    font-size: 1rem;
}
.shcRadioSticky__play span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}
.shcRadioSticky__volume { min-height: 42px; }
.shcRadioSticky__details > span { padding-top: 4px; padding-bottom: 4px; }

.shcRadioSticky.is-minimized {
    grid-template-columns: minmax(190px, 1fr) minmax(250px, 1.3fr) minmax(245px, .95fr) 42px;
    grid-template-areas: "now points controls toggle";
    min-height: 68px;
    padding-top: 7px;
    padding-bottom: 7px;
}
.shcRadioSticky.is-minimized .shcRadioSticky__points {
    grid-template-columns: minmax(90px, 1fr) auto;
    grid-template-areas: "head head" "rail time" "status status" "hour hour";
    gap: 3px 7px;
}
.shcRadioSticky.is-minimized .shcRadioSticky__pointsHead { display: flex; }
.shcRadioSticky.is-minimized .shcRadioSticky__pointsLabel { display: none; }
.shcRadioSticky.is-minimized .shcRadioSticky__pointsBalance { margin-left: auto; }
.shcRadioSticky.is-minimized .shcRadioSticky__pointsTime { display: block; }
.shcRadioSticky.is-minimized .shcRadioSticky__controls {
    grid-template-columns: 48px minmax(150px, 1fr);
    gap: 8px;
}
.shcRadioSticky.is-minimized .shcRadioSticky__play {
    width: 46px;
    min-width: 46px;
    height: 46px;
    min-height: 46px;
}

@media (max-width: 1120px) {
    .shcRadioSticky {
        grid-template-columns: 66px minmax(150px, .95fr) minmax(210px, 1.2fr) minmax(220px, 1fr) 38px;
        gap: 7px 10px;
        min-height: 112px;
        padding-inline: 10px;
    }
    .shcRadioSticky__art { width: 66px; }
    .shcRadioSticky__controls { grid-template-columns: 50px minmax(135px, 1fr); }
    .shcRadioSticky__play { width: 48px; min-width: 48px; height: 48px; min-height: 48px; }
    .shcRadioSticky.is-minimized {
        grid-template-columns: minmax(150px, .9fr) minmax(220px, 1.25fr) minmax(220px, 1fr) 38px;
        padding-inline: 10px;
    }
}

@media (max-width: 780px) {
    .shcRadioSticky {
        grid-template-columns: 58px minmax(0, 1fr) 38px;
        grid-template-areas:
            "art now toggle"
            "points points points"
            "controls controls controls"
            "wave wave wave"
            "details details details";
        min-height: 0;
        padding: 8px 9px;
    }
    .shcRadioSticky__art { width: 58px; }
    .shcRadioSticky__wave { min-height: 54px; }
    .shcRadioSticky__controls { grid-template-columns: 48px minmax(0, 1fr); }
    .shcRadioSticky.is-minimized {
        grid-template-columns: minmax(0, 1fr) 38px;
        grid-template-areas:
            "now toggle"
            "points points"
            "controls controls";
        min-height: 106px;
        padding: 7px 9px;
    }
    .shcRadioSticky.is-minimized .shcRadioSticky__controls { grid-template-columns: 44px minmax(0, 1fr); }
    .shcRadioSticky.is-minimized .shcRadioSticky__play { width: 42px; min-width: 42px; height: 42px; min-height: 42px; }
}

@media (max-width: 480px) {
    .shcRadioSticky__pointsBalance { font-size: .5rem; }
    .shcRadioSticky__pointsStatus { font-size: .47rem; }
    .shcRadioSticky__volume { grid-template-columns: 30px minmax(42px, 1fr) 34px; }
}

/* 0.6.17 — compact backend-driven sticky layout; waveform stays on dedicated/full players only. */
.shcRadioSticky {
    grid-template-columns: 72px minmax(220px, 1.05fr) minmax(360px, 1.35fr) minmax(250px, 1.05fr) minmax(220px, .9fr) 42px;
    grid-template-areas: "art now details points controls toggle";
    gap: 10px 14px;
    min-height: 96px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.shcRadioSticky__art { width: 72px; }
.shcRadioSticky__now,
.shcRadioSticky__points,
.shcRadioSticky__details,
.shcRadioSticky__controls { align-self: center; }
.shcRadioSticky__now { min-width: 0; }
.shcRadioSticky__title { font-size: clamp(.98rem, 1.15vw, 1.18rem); }
.shcRadioSticky__artist { margin-top: 4px; font-size: .68rem; }
.shcRadioSticky__station { margin-top: 3px; font-size: .52rem; }
.shcRadioSticky__details {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 5px;
}
.shcRadioSticky__details > span {
    padding: 7px 7px;
    background: rgb(2 10 18 / 48%);
}
.shcRadioSticky__points {
    grid-template-columns: minmax(100px, 1fr) auto;
    grid-template-areas: "head head" "rail time" "status status";
    gap: 5px 8px;
}
.shcRadioSticky__controls {
    grid-template-columns: 54px minmax(150px, 1fr);
    gap: 9px;
}
.shcRadioSticky__play {
    width: 52px;
    min-width: 52px;
    height: 52px;
    min-height: 52px;
}
.shcRadioSticky__volume { min-height: 42px; }
.shcRadioSticky__toggle { min-height: 72px; }

/* Minimized bar deliberately keeps both track and artist visible. */
.shcRadioSticky.is-minimized {
    grid-template-columns: minmax(245px, 1.05fr) minmax(280px, 1.2fr) minmax(235px, .9fr) 42px;
    grid-template-areas: "now points controls toggle";
    gap: 8px 14px;
    min-height: 70px;
    padding-top: 7px;
    padding-bottom: 7px;
}
.shcRadioSticky.is-minimized .shcRadioSticky__artist {
    display: block;
    margin-top: 3px;
    color: #ffb97d;
    font-size: .62rem;
}
.shcRadioSticky.is-minimized .shcRadioSticky__station,
.shcRadioSticky.is-minimized .shcRadioSticky__eyebrow { display: none; }
.shcRadioSticky.is-minimized .shcRadioSticky__title { font-size: clamp(.9rem, 1vw, 1.08rem); }
.shcRadioSticky.is-minimized .shcRadioSticky__toggle { min-height: 52px; }

@media (max-width: 1320px) {
    .shcRadioSticky {
        grid-template-columns: 66px minmax(180px, .95fr) minmax(285px, 1.2fr) minmax(220px, 1fr) minmax(205px, .9fr) 38px;
        gap: 8px 10px;
        min-height: 92px;
        padding-inline: 10px;
    }
    .shcRadioSticky__art { width: 66px; }
    .shcRadioSticky__details > span { padding-inline: 5px; }
    .shcRadioSticky__controls { grid-template-columns: 48px minmax(135px, 1fr); }
    .shcRadioSticky__play { width: 46px; min-width: 46px; height: 46px; min-height: 46px; }
    .shcRadioSticky.is-minimized {
        grid-template-columns: minmax(210px, 1fr) minmax(245px, 1.15fr) minmax(215px, .95fr) 38px;
        padding-inline: 10px;
    }
}

@media (max-width: 980px) {
    .shcRadioSticky {
        grid-template-columns: 60px minmax(190px, 1fr) minmax(230px, 1.1fr) minmax(195px, .9fr) 38px;
        grid-template-areas:
            "art now points controls toggle"
            "art details details controls toggle";
        min-height: 104px;
    }
    .shcRadioSticky__art { width: 60px; }
    .shcRadioSticky__details { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .shcRadioSticky.is-minimized {
        grid-template-columns: minmax(190px, 1fr) minmax(220px, 1.1fr) minmax(195px, .9fr) 38px;
        grid-template-areas: "now points controls toggle";
        min-height: 70px;
    }
}

@media (max-width: 780px) {
    .shcRadioSticky {
        grid-template-columns: 58px minmax(0, 1fr) 38px;
        grid-template-areas:
            "art now toggle"
            "points points points"
            "controls controls controls"
            "details details details";
        gap: 7px 9px;
        min-height: 0;
        padding: 8px 9px;
    }
    .shcRadioSticky__art { width: 58px; }
    .shcRadioSticky__details { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .shcRadioSticky__details .is-show { grid-column: span 2; }
    .shcRadioSticky__controls { grid-template-columns: 46px minmax(0, 1fr); }
    .shcRadioSticky__toggle { min-height: 58px; }
    .shcRadioSticky.is-minimized {
        grid-template-columns: minmax(0, 1fr) 38px;
        grid-template-areas:
            "now toggle"
            "points points"
            "controls controls";
        min-height: 108px;
        padding: 7px 9px;
    }
    .shcRadioSticky.is-minimized .shcRadioSticky__artist { display: block; }
    .shcRadioSticky.is-minimized .shcRadioSticky__controls { grid-template-columns: 44px minmax(0, 1fr); }
}

@media (max-width: 480px) {
    .shcRadioSticky__details { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shcRadioSticky__details .is-show { grid-column: 1 / -1; }
    .shcRadioSticky__artist { font-size: .59rem; }
}

.shcRadioSticky.is-minimized .shcRadioSticky__hourBonus { display: none !important; }

/* 0.6.34 — corrected SHC Chat sizing and scrolling on /radio. */
.shcRadioPage__chat > .shcChatBox--radio {
    flex: 1 1 0;
    width: 100%;
    min-width: 0;
    min-height: 0;
    height: 0;
    max-height: none;
    grid-template-rows: minmax(0, 1fr) auto auto;
    overflow: hidden;
}
.shcRadioPage__chat .shcChatBox--radio .shcChatBox__timeline {
    min-height: 0 !important;
    max-height: none !important;
    height: auto;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}
.shcRadioPage__chat .shcChatBox--radio .shcChatBox__feedback,
.shcRadioPage__chat .shcChatBox--radio .shcChatBox__composer {
    min-height: 0;
}
.shcRadioPage__chat .shcChatBox--radio .shcChatBox__composer {
    flex: 0 0 auto;
}
.shcRadioPage__chat .shcChatBox--radio .shcChatBox__messageFooter { display: flex; }
.shcRadioPage__chatUnavailable {
    flex: 1 1 auto;
    min-height: 420px;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 8px;
    padding: 28px;
    color: var(--shcr-soft);
    text-align: center;
}
.shcRadioPage__chatUnavailable i { color: var(--shcr-blue-bright); font-size: 2rem; }
.shcRadioPage__chatUnavailable strong { color: #fff; font-size: 1rem; }
.shcRadioPage__chatUnavailable span { font-size: .75rem; }
@media (max-width: 1180px) {
    .shcRadioPage__chat { min-height: 500px; }
}
@media (max-width: 720px) {
    .shcRadioPage__chat { min-height: 430px; }
    .shcRadioPage__chatUnavailable { min-height: 260px; }
}
