.hero .station-like-panel{grid-area:likes;display:flex;align-items:center;justify-content:space-between;gap:18px;min-width:0;padding:14px 18px;border:1px solid #48624b;border-radius:15px;background:linear-gradient(105deg,#15241e,#121a22 70%)}.station-like-panel>div{display:grid;gap:2px}.station-like-panel>div strong{color:#fff;font-size:1rem}.station-like-panel>div span{color:#b8c9c0;font-size:.82rem}
.station-like-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:8px 14px;border:1px solid #a7cf71;border-radius:9px;background:#294d34;color:#f2f8ec;font:inherit;font-size:.9rem;font-weight:850;cursor:pointer;white-space:nowrap}.station-like-button:hover{background:#376344}.station-like-button[aria-pressed=true]{border-color:#d5f0a2;background:#4b7139}.station-like-button b{display:inline-grid;place-items:center;min-width:2em;padding:2px 7px;border:1px solid #a9c591;border-radius:6px;background:#152b23;color:#fff;font-variant-numeric:tabular-nums}.station-like-button:focus-visible{outline:3px solid #a8cc57;outline-offset:3px}.station-like-button:disabled{opacity:.6;cursor:wait}
.station-like-compact{margin-left:auto}.station-like-compact .station-like-button{min-height:36px;padding:6px 10px;font-size:.76rem}.station-like-compact .station-like-button strong{font-size:inherit}
.audience-meter{display:flex;align-items:center;gap:9px;margin-top:13px;padding:10px 12px;border-top:1px solid #5a3b3f;color:#e3eee3}.audience-meter>span:nth-child(2){display:flex;align-items:baseline;gap:6px}.audience-meter strong{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:1.3rem;font-variant-numeric:tabular-nums;color:#d6ef9b}.audience-meter small{font-size:.76rem;font-weight:850;text-transform:uppercase;letter-spacing:.04em}.audience-refresh{margin-left:auto;color:#aabdb5;font-size:.7rem}.audience-pulse{width:8px;height:8px;border-radius:50%;background:#a8d969;box-shadow:0 0 10px #b3eb82}.audience-bars{display:flex;align-items:end;gap:3px;height:18px;margin-left:4px}.audience-bars i{width:3px;height:5px;background:#8da575;border-radius:2px}.audience-meter.has-audience .audience-bars i:nth-child(2){height:10px}.audience-meter.has-audience .audience-bars i:nth-child(3){height:16px}.audience-meter.has-audience .audience-bars i:nth-child(4){height:12px}.audience-meter.has-audience .audience-bars i:nth-child(5){height:8px}
@media(max-width:700px){.hero .station-like-panel{align-items:stretch;flex-direction:column}.station-like-button{width:100%;white-space:normal}.station-like-compact{margin:8px 0 0}.station-like-compact .station-like-button{width:auto}.audience-refresh{font-size:.62rem}}
.stream-readout{display:grid;grid-template-columns:minmax(120px,.7fr) minmax(0,1.3fr);gap:8px 14px;margin-top:15px;padding:14px;border:1px solid #44606b;border-radius:12px;background:linear-gradient(135deg,#09141b,#12222a 60%,#101720);box-shadow:inset 0 1px #d8f8ff17,0 0 18px #4dbcc518}
.stream-readout-count,.stream-readout-music{display:grid;align-content:start;min-width:0;gap:3px}
.stream-readout-count>span,.stream-readout-music>span{color:#9dbcc3;font:800 .68rem/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.1em}
.stream-readout-count strong{color:#d5f5a6;font:900 2rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;font-variant-numeric:tabular-nums;text-shadow:0 0 15px #a5d87688}
.stream-readout-music strong{color:#f2f9fb;font-size:.9rem;line-height:1.35;white-space:normal;overflow-wrap:anywhere}
.stream-equalizer{grid-column:1/-1;display:flex;align-items:center;gap:4px;height:24px;padding-top:5px;border-top:1px solid #46606a99}
.stream-equalizer i{display:block;flex:1;height:4px;border-radius:2px;background:linear-gradient(0deg,#80d4d9,#cff18c);box-shadow:0 0 5px #73d5db55;transform-origin:bottom}
.radio-player.is-playing .stream-equalizer i{animation:streamBeat .9s ease-in-out infinite alternate}
.radio-player.is-playing .stream-equalizer i:nth-child(3n){animation-duration:.65s;animation-delay:-.3s}
.radio-player.is-playing .stream-equalizer i:nth-child(4n){animation-duration:1.2s;animation-delay:-.5s}
@keyframes streamBeat{0%{height:4px}45%{height:20px}100%{height:9px}}
.hero .listener-stats{display:flex;align-items:stretch;justify-self:end;gap:10px;flex-wrap:wrap}
.hero-engagement-row{grid-area:engagement;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr) minmax(0,1.15fr);align-items:stretch;gap:10px;min-width:0;margin-top:-8px}
.hero .hero-engagement-row .listener-stats{display:contents}
.hero .hero-engagement-row .visitor-total-card{grid-column:1;grid-row:1}
.hero .hero-engagement-row .listener-stats .audience-meter{grid-column:2;grid-row:1}
.hero .hero-engagement-row .listener-stats>div{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0;min-height:76px;margin:0;padding:10px 14px;text-align:left}
.hero .hero-engagement-row .listener-stats small{margin:0 0 4px;font-size:.72rem;line-height:1.2;white-space:nowrap}
.hero .hero-engagement-row #total-listeners{font-size:clamp(1.4rem,2.2vw,1.8rem);letter-spacing:.02em;line-height:1.1;white-space:nowrap}
.hero .hero-engagement-row .listener-stats .audience-meter{flex-direction:row;justify-content:center;gap:9px}
.hero .hero-engagement-row .audience-eye{flex:none;width:25px;height:25px;color:#c9eaa4;filter:drop-shadow(0 0 8px rgba(143,202,108,.5))}
.hero .hero-engagement-row .audience-meter>span:nth-child(2){display:flex;flex-direction:column;align-items:flex-start;gap:0;margin:0}
.hero .hero-engagement-row .audience-meter strong{font-size:clamp(1.4rem,2.2vw,1.8rem);line-height:1.1}
.hero .hero-engagement-row .station-like-panel{grid-area:1/3/2/4;justify-content:center;min-width:0;min-height:76px;padding:10px 12px}
.hero .hero-engagement-row .station-like-button{width:100%;min-width:0;max-width:260px;min-height:42px;padding:6px 10px;white-space:nowrap;text-align:center}
@media(max-width:800px){.hero-engagement-row{margin-top:0}}
@media(max-width:520px){.hero-engagement-row{gap:6px}.hero .hero-engagement-row .listener-stats>div{min-height:68px;padding:7px}.hero .hero-engagement-row .listener-stats small{font-size:.7rem;line-height:1.2}.hero .hero-engagement-row #total-listeners,.hero .hero-engagement-row .audience-meter strong{font-size:1.18rem;letter-spacing:0}.hero .hero-engagement-row .listener-stats .audience-meter{padding:7px;gap:5px}.hero .hero-engagement-row .audience-eye{width:22px;height:22px}.hero .hero-engagement-row .station-like-panel{min-height:68px;padding:7px}.hero .hero-engagement-row .station-like-button{min-height:36px;padding:4px;gap:3px;font-size:.74rem}.hero .hero-engagement-row .station-like-button strong{font-size:inherit}.hero .hero-engagement-row .station-like-button b{padding:2px 4px}}
.listener-stats .audience-meter{display:flex;align-items:center;gap:10px;min-width:164px;margin:0;padding:10px 16px 12px;border:1px solid #44634e;border-radius:14px;background:linear-gradient(155deg,#0d1b18,#080b10);box-shadow:inset 0 0 16px #88cf7c15,0 0 16px #88cf7c13;text-align:right}
.listener-stats .audience-meter>span:nth-child(2){display:grid;justify-items:end;gap:0;margin-left:auto}
.listener-stats .audience-meter strong{color:#c9eaa4;font-size:2rem;line-height:1;text-shadow:0 0 12px #8fca6c77}
.listener-stats .audience-meter small{margin-top:6px;color:#b7d1b8;font-size:.72rem;letter-spacing:.13em}
@media(max-width:520px){.stream-readout{grid-template-columns:1fr 1.2fr;padding:11px}.stream-readout-count strong{font-size:1.7rem}.hero .listener-stats{justify-self:stretch}.listener-stats>div,.listener-stats .audience-meter{flex:1;min-width:130px}}
@media(prefers-reduced-motion:reduce){.radio-player.is-playing .stream-equalizer i{animation:none}}
/* Present the station activity as one centered line without individual cards. */
.hero .hero-engagement-row{display:flex;align-items:center;justify-content:center;gap:clamp(16px,4vw,54px);min-height:58px;margin-top:0}
.hero .hero-engagement-row .listener-stats>div,
.hero .hero-engagement-row .station-like-panel{min-width:0;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.hero .hero-engagement-row .listener-stats>div{align-items:center;text-align:center}
.hero .hero-engagement-row .visitor-total-card small{margin:0 0 3px}
.hero .hero-engagement-row .listener-stats .audience-meter{justify-content:center;gap:7px}
.hero .hero-engagement-row .station-like-panel{display:flex;justify-content:center}
.hero .hero-engagement-row .station-like-button{width:auto;min-height:38px}
@media(max-width:520px){.hero .hero-engagement-row{gap:clamp(8px,2.5vw,16px);min-height:56px}.hero .hero-engagement-row .listener-stats>div,.hero .hero-engagement-row .station-like-panel{min-height:0;padding:0}.hero .hero-engagement-row .station-like-button{min-height:34px}}
