/* Production homepage native player. Shared stylesheet for the Season 6 radio hero. */
:root{--ds-green:#d6ff00;--ds-red:#ff202b}
.ds-demo-watermark{position:fixed;left:16px;top:84px;z-index:98;pointer-events:none;font:800 9px/1.2 'Barlow',Arial,sans-serif;letter-spacing:.15em;color:rgba(255,255,255,.65);background:rgba(20,16,19,.65);border:1px solid rgba(255,255,255,.15);padding:8px 11px;border-radius:3px;backdrop-filter:blur(12px)}
#ds-player-slot{width:100%;height:100%;min-height:0}
#md-custom-player .md-nowplaying-frame{overflow:visible}
#md-custom-player .md-nowplaying-frame:before{pointer-events:none}
.ds-player{position:relative;isolation:isolate;width:100%;height:100%;aspect-ratio:1/1;overflow:hidden;background:#15131a;border-radius:4px;color:#fff;text-align:left;font-family:'Barlow','Google Sans',Arial,sans-serif;box-shadow:0 10px 35px rgba(0,0,0,.28);transform:translateZ(0)}
.ds-art{position:absolute;inset:0;background:url('/assets/img/bg.png') center/cover no-repeat;transition:filter .35s;transform:scale(1.005)}
.ds-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,7,12,.71),rgba(8,8,12,.1) 34%,rgba(9,9,13,.45) 59%,rgba(8,8,10,.94) 96%),linear-gradient(90deg,rgba(5,5,8,.2),transparent 60%)}
.ds-content{position:relative;z-index:1;padding:clamp(11px,1.1vw,20px);height:100%;min-height:0;display:flex;flex-direction:column}
.ds-head{display:flex;align-items:center;justify-content:space-between;gap:8px;font:800 clamp(8px,.66vw,11px)/1.2 'Barlow',Arial,sans-serif;letter-spacing:.1em}
.ds-status{display:flex;gap:8px;align-items:center;min-width:0;text-shadow:0 1px 8px #000}.ds-status i{width:7px;height:7px;background:var(--ds-green);box-shadow:0 0 13px var(--ds-green);border-radius:50%;flex-shrink:0}.ds-status span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ds-signal{font-size:9px;white-space:nowrap;opacity:.92}.ds-signal b{color:var(--ds-green);margin-left:4px}
.ds-song{margin:auto 0 13px;min-width:0;text-shadow:0 3px 10px #000c}.ds-kicker{font-size:clamp(8px,.61vw,10px);font-weight:800;letter-spacing:.15em;color:var(--ds-green)}.ds-song h2{font:800 clamp(21px,2.4vw,37px)/.99 'Barlow Condensed','Barlow',Arial,sans-serif;letter-spacing:-.025em;margin:7px 0 3px;color:white;overflow-wrap:anywhere;max-height:2.15em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.ds-song>p{margin:0;color:#eee;font:600 clamp(11px,.9vw,14px)/1.35 'Barlow',Arial,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ds-song .ds-track-secondary{font-size:10px;color:#d9d5d8;margin-top:5px}
.ds-bottom{position:relative;margin:0;padding:0}.ds-station-row{display:flex;align-items:center;gap:10px;min-width:0;padding-bottom:10px}.ds-thumb{display:block;width:clamp(35px,4vw,54px);height:clamp(35px,4vw,54px);object-fit:cover;border:1px solid rgba(255,255,255,.22);border-radius:4px;background:#121214}.ds-station{display:flex;flex:1;flex-direction:column;gap:3px;min-width:0}.ds-station strong{font:800 clamp(12px,1.1vw,17px)/1.15 'Barlow',Arial,sans-serif;color:#fff}.ds-station small{font-size:clamp(8px,.68vw,10px);font-weight:700;letter-spacing:.03em;color:#d1cdd2}.ds-beam{color:var(--ds-green);letter-spacing:-4px;margin-right:9px}.ds-hd{font-size:10px;font-weight:900;color:var(--ds-green);margin-left:auto;align-self:center}
.ds-links{display:flex;align-items:center;gap:7px;min-height:20px;margin:0 0 7px;flex-wrap:wrap}.ds-links a{display:inline-flex;gap:6px;align-items:center;white-space:nowrap;border-radius:3px;background:#111c;border:1px solid #ffffff47;color:#fff;padding:4px 7px;font-size:clamp(8px,.60vw,10px);font-weight:800;letter-spacing:.07em;max-width:100%}.ds-links a:hover{background:var(--ds-green);color:#111}.ds-links a span{color:var(--ds-green)}.ds-links a:hover span{color:#111}.ds-links a[hidden]{display:none}
.ds-transport{display:flex;align-items:center;gap:clamp(5px,.65vw,12px);padding-top:9px;border-top:1px solid #ffffff44;min-width:0}.ds-play{display:grid;place-items:center;width:clamp(36px,3.3vw,51px);height:clamp(36px,3.3vw,51px);flex-shrink:0;border:0;border-radius:50%;background:var(--ds-green);color:#171717;transition:transform .14s,background-color .14s}.ds-play:hover{background:#e6ff5c;transform:scale(1.045)}.ds-play svg{width:22px;height:22px}.ds-play .icon-pause{display:none}.ds-player.is-playing .ds-play .icon-play{display:none}.ds-player.is-playing .ds-play .icon-pause{display:block}
.ds-volume{display:flex;align-items:center;gap:5px;min-width:0}.ds-volume button{display:grid;place-items:center;padding:3px;background:transparent;border:0;color:#fff}.ds-volume button svg{width:18px;height:18px}.ds-volume input{appearance:none;-webkit-appearance:none;width:clamp(45px,5.2vw,90px);height:4px;border-radius:5px;background:linear-gradient(to right,var(--ds-green) var(--fill,80%),#ffffff57 var(--fill,80%));accent-color:var(--ds-green);cursor:pointer}.ds-volume input::-webkit-slider-thumb{-webkit-appearance:none;background:var(--ds-green);border:0;width:13px;height:13px;border-radius:50%}.ds-volume input::-moz-range-thumb{background:var(--ds-green);border:0;width:13px;height:13px;border-radius:50%}.ds-volume>span{font-size:10px;color:#ccc;min-width:17px}
.ds-playing-label{display:none;font-size:9px;color:#ddd;font-weight:700}.ds-utilities{display:flex;align-items:center;margin-left:auto;gap:5px;flex-shrink:0}.ds-tool{font:800 clamp(8px,.65vw,10px)/1 'Barlow',Arial,sans-serif;letter-spacing:.05em;border:1px solid #ffffff55;border-radius:4px;background:#101014c9;color:#fff;display:flex;align-items:center;gap:4px;padding:clamp(7px,.6vw,10px) clamp(5px,.65vw,10px);white-space:nowrap}.ds-tool:hover,.ds-tool[aria-expanded="true"]{border-color:var(--ds-green)}.ds-tool b{color:#ddd}.ds-tool b.active{color:var(--ds-green)}.ds-tool .tool-light{width:5px;height:5px;border-radius:50%;background:#5a585a}.ds-tool .tool-light.active{background:var(--ds-green);box-shadow:0 0 8px var(--ds-green)}
/* Panel is moved to document.body so it is not clipped by homepage cards. */
.ds-panel{position:fixed;z-index:11111;left:max(16px,env(safe-area-inset-left));bottom:max(22px,env(safe-area-inset-bottom));width:min(400px,calc(100vw - 32px));max-height:calc(100dvh - 70px);overflow-y:auto;padding:24px;background:linear-gradient(130deg,#242024,#100e13);color:#fff;border:1px solid #6c6068;border-radius:12px;box-shadow:0 25px 85px #000e;scrollbar-width:thin;font-family:'Barlow',Arial,sans-serif;transform:none}.ds-panel[hidden]{display:none!important}.ds-panel-top{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--ds-green);font-size:10px;letter-spacing:.13em;font-weight:800}.ds-panel-top button{width:34px;height:34px;display:grid;place-items:center;font-size:26px;font-weight:300;background:#ffffff16;border:1px solid #ffffff29;border-radius:50%;color:white}.ds-panel h3{font:900 29px/1 'Barlow Condensed','Barlow',Arial,sans-serif;letter-spacing:-.03em;margin:21px 0 10px}.ds-panel h3 em{font-style:normal;color:var(--ds-green)}.ds-panel p{font-size:12px;color:#b7b3b6;margin:0 0 18px;line-height:1.5}.ds-switch-row{border-top:1px solid #ffffff24;border-bottom:1px solid #ffffff24;padding:16px 0;display:flex;align-items:center;justify-content:space-between;gap:16px}.ds-switch-row strong,.ds-switch-row small{display:block}.ds-switch-row strong{font-size:11px;letter-spacing:.07em}.ds-switch-row small{font-size:11px;color:#bbb;margin-top:5px}.ds-switch{width:57px;min-width:57px;height:31px;background:#514b53;border:1px solid #ffffff2b;border-radius:25px;display:flex;align-items:center;padding:4px}.ds-switch>span{display:block;background:white;width:21px;height:21px;border-radius:50%;transition:transform .2s}.ds-switch[aria-checked="true"]{background:var(--ds-green);border-color:var(--ds-green)}.ds-switch[aria-checked="true"]>span{background:#151515;transform:translateX(26px)}.ds-presets{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:17px 0 14px}.ds-presets button{font-size:11px;font-weight:800;padding:12px 3px;color:#eee;background:#ffffff12;border:1px solid #ffffff34;border-radius:5px;letter-spacing:.06em}.ds-presets button:hover{border-color:#fff}.ds-presets button.is-selected{border-color:var(--ds-green);color:var(--ds-green);background:#d6ff0017}.ds-panel-note{color:#88818a;font-size:9px;letter-spacing:.1em}
.ds-toast{position:fixed;z-index:12000;left:50%;bottom:155px;transform:translate(-50%,12px);opacity:0;pointer-events:none;background:#252127;color:white;border:1px solid #726770;padding:12px 17px;border-radius:7px;font:600 12px/1.5 'Barlow',Arial,sans-serif;box-shadow:0 14px 60px #000b;text-align:center;max-width:calc(100vw - 30px);transition:opacity .17s,transform .17s}.ds-toast.visible{opacity:1;transform:translate(-50%,0)}
/* Single player is moved to body when the entire hero is off-screen.
   The global audio element is NEVER moved, recreated or reconnected. */
.ds-player.is-sticky{position:fixed;z-index:10900;left:15px;bottom:calc(15px + env(safe-area-inset-bottom));width:min(432px,calc((100vw - 55px)/2));height:117px;aspect-ratio:auto;border:1px solid #ffffff49;border-radius:12px;box-shadow:0 18px 70px #000d;overflow:hidden;animation:ds-enter .23s ease}.ds-player.is-sticky .ds-shade{background:linear-gradient(90deg,#100f12ed,#131115ed)}.ds-player.is-sticky .ds-art{filter:blur(17px) brightness(.55)}.ds-player.is-sticky .ds-content{padding:11px 14px;gap:6px;display:grid;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}.ds-player.is-sticky .ds-head{display:none}.ds-player.is-sticky .ds-song{margin:0;display:flex;flex-direction:column;justify-content:center;min-width:0}.ds-player.is-sticky .ds-kicker{font-size:8px}.ds-player.is-sticky .ds-song h2{font-size:clamp(14px,1.65vw,20px);line-height:1.1;max-height:none;-webkit-line-clamp:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:4px 0 1px;display:block}.ds-player.is-sticky .ds-song p{font-size:11px}.ds-player.is-sticky .ds-track-secondary{display:none}.ds-player.is-sticky .ds-station-row,.ds-player.is-sticky .ds-links{display:none}.ds-player.is-sticky .ds-transport{padding-top:7px}.ds-player.is-sticky .ds-play{width:39px;height:39px}.ds-player.is-sticky .ds-play svg{width:18px;height:18px}.ds-player.is-sticky .ds-volume input{width:clamp(35px,5.1vw,77px)}.ds-player.is-sticky .ds-volume>span{display:none}.ds-player.is-sticky .ds-tool{font-size:9px;padding:10px 8px}.ds-player.is-sticky .ds-playing-label{display:none}.ds-player.is-sticky .ds-utilities{margin-left:auto}
@keyframes ds-enter{from{transform:translateY(22px);opacity:.45}to{transform:translateY(0);opacity:1}}
@media(max-width:1300px){.ds-player.is-sticky{width:min(370px,calc((100vw - 50px)/2))}.ds-player.is-sticky #share-button span{display:none}.ds-player.is-sticky .ds-volume input{width:46px}}
@media(max-width:1000px){.ds-player.is-sticky{width:min(340px,calc(100vw - 24px));bottom:calc(155px + env(safe-area-inset-bottom));left:12px}.ds-panel{bottom:calc(155px + env(safe-area-inset-bottom))}.ds-player.is-sticky .ds-volume input{width:70px}}
@media(max-width:850px){.ds-demo-watermark{top:74px;left:10px}.ds-song h2{font-size:clamp(21px,3vw,35px)}.ds-volume input{width:62px}}
@media(max-width:600px){.ds-demo-watermark{top:70px;font-size:8px;padding:5px 7px}.ds-content{padding:13px}.ds-head{font-size:8px}.ds-signal{font-size:8px}.ds-song{margin-bottom:8px}.ds-song h2{font-size:clamp(22px,6vw,32px)}.ds-station-row{padding-bottom:7px}.ds-thumb{width:40px;height:40px}.ds-station strong{font-size:14px}.ds-hd{font-size:9px}.ds-links{margin-bottom:4px}.ds-transport{gap:6px}.ds-volume input{width:65px}.ds-volume>span{display:none}.ds-play{width:42px;height:42px}.ds-tool{padding:9px 7px}.ds-tool#share-button span{display:none}
.ds-player.is-sticky{height:116px;left:10px;bottom:calc(152px + env(safe-area-inset-bottom));width:min(330px,calc(100vw - 20px))}.ds-player.is-sticky .ds-content{padding:10px 12px}.ds-player.is-sticky .ds-song h2{font-size:17px}.ds-player.is-sticky .ds-tool{padding:9px 7px}.ds-player.is-sticky .ds-volume input{width:65px}.ds-panel{top:max(80px,calc(env(safe-area-inset-top) + 65px));bottom:auto;left:12px;width:calc(100vw - 24px);max-height:calc(100dvh - 100px);padding:18px}.ds-toast{bottom:270px}
}
@media(max-width:355px){.ds-player.is-sticky .ds-volume input{width:40px}.ds-player.is-sticky .ds-tool{padding:9px 6px}.ds-player.is-sticky .ds-volume button svg{width:16px}}
@media(prefers-reduced-motion:reduce){.ds-player,.ds-switch>span,.ds-toast{animation:none!important;transition:none!important}}


/* DEMO V3 / Deseo red UI. Fluorescent green is reserved for DSP/HD markers. */
:root { --ds-green:#d6ff00; --ds-red:#ff0000; }
.ds-player{--ds-control:#ff0000;}
.ds-head{align-items:flex-start;min-height:27px}
.ds-status{flex:1;max-width:54%;align-items:center;gap:7px;font-size:clamp(9px,.72vw,12px);font-weight:900;letter-spacing:.05em}
.ds-status i{background:#ff0000;box-shadow:0 0 9px #ff0000a8}
.ds-status span{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.18}
.ds-status .ds-hd{flex-shrink:0;font-size:9px;font-weight:900;color:var(--ds-green);margin-left:3px}
.ds-save{display:flex;align-items:center;justify-content:flex-end;gap:6px;max-width:58%;flex-wrap:wrap}
.ds-save[hidden]{display:none!important}
.ds-save-label{font-size:clamp(7px,.58vw,9px);color:#fff;font-weight:900;letter-spacing:.07em;white-space:nowrap}
.ds-save a{display:inline-flex;align-items:center;gap:4px;padding:5px 6px;border-radius:5px;background:#080808a8;color:#fff;border:1px solid #ffffff57;text-transform:none;white-space:nowrap;font:800 clamp(8px,.65vw,10px)/1.1 'Barlow',Arial,sans-serif;text-decoration:none}
.ds-save a[hidden]{display:none!important}
.ds-save a:hover,.ds-save a:focus-visible{background:#ff0000;border-color:#ff0000}
.ds-brand-icon{width:clamp(12px,.95vw,16px);height:clamp(12px,.95vw,16px);display:block;flex-shrink:0}
.ds-song{max-width:100%}
.ds-song-copy{min-width:0}
.ds-sticky-art{display:none}
.ds-kicker{color:#fff;font-weight:900}
.ds-song h2{font-family:'Barlow Condensed','Barlow',Arial,sans-serif}
.ds-player .ds-track-secondary[hidden]{display:none!important}
.ds-bottom{padding-bottom:0}
.ds-transport{border-color:#ffffff59;justify-content:space-between}
.ds-play{background:#ff0000;color:#fff}
.ds-play:hover{background:#e00000}
.ds-volume input{background:linear-gradient(to right,#ff0000 var(--fill,80%),#ffffff66 var(--fill,80%))}
.ds-volume input::-webkit-slider-thumb{background:#ff0000}
.ds-volume input::-moz-range-thumb{background:#ff0000}
.ds-tool{border-color:#ffffff5c}
.ds-tool:hover,.ds-tool[aria-expanded="true"]{border-color:#ff0000}
.ds-tool b.active{color:var(--ds-green)}
.ds-tool .tool-light.active{background:var(--ds-green);box-shadow:0 0 9px var(--ds-green)}
.ds-song .ds-kicker,.ds-hd{letter-spacing:.065em}
.ds-panel{border-color:#646067}
.ds-panel-top{color:#ff0000}
.ds-panel h3 em{color:#ff0000}
.ds-panel .ds-switch[aria-checked="true"]{background:#ff0000;border-color:#ff0000}
.ds-panel .ds-switch[aria-checked="true"]>span{background:#fff}
.ds-panel .ds-presets button.is-selected{background:#ff00001d;border-color:#ff0000;color:#fff}
.ds-levels{border:1px solid #ffffff28;border-radius:8px;padding:12px;margin:14px 0}
.ds-levels-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font:800 10px/1.4 'Barlow',Arial,sans-serif;letter-spacing:.06em;margin:7px 0 5px}
.ds-levels-top strong{font-variant-numeric:tabular-nums;color:var(--ds-green);font-size:11px}
.ds-meter{height:6px;border-radius:3px;background:#4b4046;overflow:hidden}
.ds-meter i{height:100%;width:0;background:linear-gradient(90deg,#a00000,#ff0000);display:block;border-radius:3px;transition:width .18s linear}
.ds-panel .ds-panel-note{font-size:10px;letter-spacing:0;line-height:1.5}
.ds-presets{max-height:170px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;grid-template-columns:repeat(3,minmax(0,1fr));padding-right:3px}
.ds-presets button{min-height:38px;font-size:10px;padding:8px 3px}
.ds-player.is-sticky .ds-art{filter:blur(13px) brightness(.58)}
.ds-player.is-sticky .ds-song{display:flex;flex-direction:row;align-items:center;gap:11px;overflow:hidden}
.ds-player.is-sticky .ds-sticky-art{display:block;width:55px;height:55px;flex:0 0 55px;object-fit:cover;border-radius:6px;border:1px solid #ffffff36;background:#121212}
.ds-player.is-sticky .ds-song-copy{min-width:0;flex:1}
.ds-player.is-sticky .ds-song h2{max-width:100%}
.ds-player.is-sticky .ds-head{display:none}
.ds-player.is-sticky .ds-save{display:none!important}
.ds-player.is-sticky .ds-content{gap:4px;grid-template-rows:minmax(0,1fr) auto}
.ds-player.is-sticky .ds-transport{justify-content:space-between}
.ds-player.is-sticky .ds-song .ds-kicker{font-size:8px}
.ds-player.is-sticky .ds-song p{color:#fff}
.ds-player.is-sticky .ds-play{width:41px;height:41px}
.ds-player.is-sticky .ds-tool{border-color:#ffffff61}
.ds-player.is-sticky .ds-tool b.active{color:var(--ds-green)}
@media(max-width:1300px){
  .ds-save-label{font-size:8px}
  .ds-status{max-width:46%}
  .ds-save{max-width:61%}
  .ds-save a{padding:5px}
}
@media(max-width:850px){
 .ds-save-label{font-size:8px}
 .ds-save a{font-size:9px}
}
@media(max-width:600px){
  .ds-head{gap:5px;min-height:22px}
  .ds-status{font-size:10px;max-width:42%}
  .ds-save{max-width:61%;gap:4px}
  .ds-save-label{font-size:7px}
  .ds-save a{font-size:8px;padding:5px 4px;gap:3px}
  .ds-brand-icon{width:13px;height:13px}
  .ds-status .ds-hd{font-size:8px}
  .ds-song h2{font-size:clamp(23px,6.4vw,34px)}
  .ds-player.is-sticky .ds-sticky-art{width:51px;height:51px;flex-basis:51px}
  .ds-player.is-sticky .ds-song{gap:9px}
  .ds-panel .ds-presets{max-height:165px}
  .ds-panel .ds-presets button{font-size:9px}
}
@media(max-width:380px){
 .ds-save{max-width:65%}
 .ds-save-label{width:100%;text-align:right}
 .ds-save a span{font-size:8px}
 .ds-status{max-width:41%}
}

.ds-param-values{padding:10px 12px;background:#ffffff0a;border:1px solid #ffffff26;border-radius:6px;color:#c8c3c7;font:600 10px/1.6 'Barlow',Arial,sans-serif;word-spacing:.025em}
.ds-panel .ds-presets{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.ds-panel .ds-presets .preset{overflow-wrap:anywhere}
@media(max-width:430px){.ds-panel .ds-presets{max-height:148px}.ds-panel .ds-presets button{font-size:8px}}


/* Demo V4: one RIGHT-side sticky with DJ, existing share/sponsor and full controls. */
#md-player-dock.md-dock{width:min(555px,calc(100vw - 24px))!important;max-width:calc(100vw - 24px)!important;z-index:1002}
#md-player-dock .md-dock-body{grid-template-columns:minmax(0,1fr) 99px;gap:12px;align-items:center}
#md-player-dock .md-dock-program{flex-wrap:wrap;align-items:center;gap:10px 12px;min-width:0}
#md-player-dock .md-dock-program-copy{flex:1;min-width:0}
#md-player-dock .md-dock-program-photo>img{width:72px;height:72px}
#md-player-dock .ds-dock-controls{width:100%;display:flex;align-items:center;gap:10px;min-width:0;padding:8px 0 0;border-top:1px solid rgba(255,255,255,.17)}
#md-player-dock .ds-dock-controls button{cursor:pointer}
#md-player-dock .ds-dock-play{width:38px;height:38px;min-width:38px;border:0;border-radius:50%;display:grid;place-items:center;background:#ff0000;color:#fff}
#md-player-dock .ds-dock-play:hover{background:#df0000}
#md-player-dock .ds-dock-play svg{width:20px;height:20px;display:block}
#md-player-dock .ds-dock-play .icon-pause{display:none}
#md-player-dock .ds-dock-play.is-playing .icon-play{display:none}
#md-player-dock .ds-dock-play.is-playing .icon-pause{display:block}
#md-player-dock .ds-dock-mute{display:grid;place-items:center;padding:5px;border:0;background:transparent;color:#fff;flex-shrink:0}
#md-player-dock .ds-dock-mute svg{width:19px;height:19px}
#md-player-dock .ds-dock-volume{-webkit-appearance:none;appearance:none;flex:1;min-width:35px;max-width:120px;height:4px;border-radius:5px;background:linear-gradient(to right,#ff0000 var(--fill,80%),#4e474c var(--fill,80%));cursor:pointer}
#md-player-dock .ds-dock-volume::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border-radius:50%;border:0;background:#ff0000}
#md-player-dock .ds-dock-volume::-moz-range-thumb{width:13px;height:13px;border-radius:50%;border:0;background:#ff0000}
#md-player-dock .ds-dock-live{font:800 9px/1.3 'Barlow',Arial,sans-serif;letter-spacing:.045em;color:#b8b1b5;white-space:nowrap;margin-left:auto}
#md-player-dock .ds-dock-controls :focus-visible{outline:2px solid #ff0000;outline-offset:3px}
.ds-player.is-sticky{position:relative;left:auto;bottom:auto;width:100%;height:100%;aspect-ratio:1/1;animation:none;box-shadow:0 10px 35px rgba(0,0,0,.28)}
.ds-mobile-native #dsp-trigger,.ds-mobile-native #dsp-panel,#dsp-trigger[hidden]{display:none!important}
.ds-mobile-native .ds-tool#share-button{margin-left:auto}
.ds-panel{z-index:11111}
.ds-panel .ds-levels{margin-top:18px}
.ds-panel .ds-switch-row{margin-bottom:8px}
.ds-panel .ds-panel-note{font-size:12px;line-height:1.65;letter-spacing:normal;color:#aba7ab}
.ds-panel .ds-levels-top strong{color:#d6ff00}
@media(max-width:950px){
  #md-player-dock.md-dock{max-width:min(510px,calc(100vw - 20px))!important}
  #md-player-dock .md-dock-body{grid-template-columns:minmax(0,1fr) 83px!important;gap:9px}
  #md-player-dock .md-dock-sponsor{width:83px;height:83px}
  #md-player-dock .md-dock-program-photo>img{width:65px;height:65px}
}
@media(max-width:600px){
  #md-player-dock.md-dock{right:9px!important;bottom:calc(9px + env(safe-area-inset-bottom))!important;width:calc(100vw - 18px)!important;max-width:460px!important}
  #md-player-dock .md-dock-body{grid-template-columns:minmax(0,1fr) 72px!important;gap:8px!important;padding:10px!important}
  #md-player-dock .md-dock-program{gap:6px 9px}
  #md-player-dock .md-dock-program-photo>img{width:58px;height:58px}
  #md-player-dock .md-dock-program-copy strong{font-size:14px}
  #md-player-dock .md-dock-sponsor{width:72px;height:72px}
  #md-player-dock .ds-dock-controls{gap:7px;padding-top:7px}
  #md-player-dock .ds-dock-play{width:36px;height:36px;min-width:36px}
  #md-player-dock .ds-dock-mute svg{width:17px;height:17px}
  #md-player-dock .ds-dock-volume{max-width:100px}
  #md-player-dock .ds-dock-live{font-size:8px}
  #dsp-trigger{display:none!important}
}
@media(max-width:360px){
  #md-player-dock .md-dock-body{grid-template-columns:minmax(0,1fr) 61px!important}
  #md-player-dock .md-dock-sponsor{width:61px;height:61px}
  #md-player-dock .ds-dock-volume{max-width:57px}
  #md-player-dock .ds-dock-live{font-size:7px}
}


/* Demo keyboard + Audio Engine cursor: the site's decorative cursor (z-index
   10008) is behind the audio panel (11111), so always use a real OS pointer. */
@media (hover:hover) and (pointer:fine) {
  html.md-has-custom-cursor #dsp-panel,
  html.md-has-custom-cursor #dsp-panel *,
  #dsp-panel,
  #dsp-panel * {
    cursor:default!important;
  }
  html.md-has-custom-cursor #dsp-panel button,
  html.md-has-custom-cursor #dsp-panel [role="switch"],
  #dsp-panel button,
  #dsp-panel [role="switch"] {
    cursor:pointer!important;
  }
  html.ds-native-dsp-cursor .md-custom-cursor {
    opacity:0!important;
    visibility:hidden!important;
  }
}


/* DEMO V5 — two columns only. The published homepage stays unchanged.
   Explicitly override the live layout's three-card grid at every breakpoint. */
#md-custom-player .md-player-squares{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:clamp(17px,2.2vw,44px)!important;
  align-items:start!important;
  justify-items:stretch!important;
  width:100%!important;
}
#md-custom-player .md-nowplaying-column{
  grid-column:1!important;
  grid-row:1!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
}
#md-custom-player .md-sponsor-column{
  grid-column:2!important;
  grid-row:1!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
}
#md-custom-player .ds-onair-data[hidden]{display:none!important}
#md-custom-player .ds-player-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:32px;
  margin-bottom:6px;
}
#md-custom-player .ds-player-heading .md-player-square-label{
  margin:0!important;
}
#md-custom-player .ds-player-heading .md-onair-share{
  display:inline-flex!important;
  gap:7px;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  min-width:0;
  min-height:30px;
  margin:0;
  padding:7px 12px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.28);
  background:#171417ba;
  color:white;
  cursor:pointer;
  font:800 10px/1 'Barlow',Arial,sans-serif;
  letter-spacing:.08em;
}
#md-custom-player .ds-player-heading .md-onair-share svg{width:13px;height:13px;flex-shrink:0}
#md-custom-player .ds-player-heading .md-onair-share:hover,
#md-custom-player .ds-player-heading .md-onair-share:focus-visible{
  background:#ff0000;
  border-color:#ff0000;
}
#md-custom-player .ds-profile-button{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  align-self:flex-start;
  border:1px solid rgba(255,255,255,.65);
  border-radius:5px;
  padding:8px 12px;
  background:rgba(0,0,0,.73);
  color:white;
  font:900 clamp(9px,.7vw,12px)/1.2 'Barlow',Arial,sans-serif;
  white-space:nowrap;
  letter-spacing:.05em;
  transition:background .15s ease,border .15s ease;
  cursor:pointer;
}
#md-custom-player .ds-profile-button:hover,
#md-custom-player .ds-profile-button:focus-visible{
  background:#ff0000;
  border-color:#ff0000;
}
#md-custom-player .ds-profile-button[hidden],
#md-custom-player .ds-profile-button:disabled{
  display:none!important;
}
/* Producer imagery must be the actual photograph: no photo blur, tint, dark filter,
   artificial saturation or image opacity. Keep only a localized bottom text gradient. */
#md-custom-player .ds-player.is-dj .ds-art{
  filter:none!important;
  opacity:1!important;
  transform:none!important;
  background-position:center center!important;
  background-size:cover!important;
}
#md-custom-player .ds-player.is-dj .ds-shade{
  background:none!important; /* full, unfiltered DJ photograph */
}
#md-custom-player .ds-player.is-dj .ds-song-copy{
  display:inline-block;
  max-width:100%;
  width:max-content;
  padding:8px 12px;
  background:transparent;
  text-shadow:0 2px 8px rgba(0,0,0,.9);
}
#md-custom-player .ds-player.is-dj .ds-bottom{
  background:rgba(0,0,0,.34);
  border-radius:6px;
  padding:4px 8px;
}
#md-custom-player .ds-player:not(.is-dj) .ds-shade{
  /* Song art keeps the cinematic tinted/contrast gradient. */
  background:linear-gradient(180deg,rgba(5,5,8,.64),rgba(5,5,8,.09) 37%,rgba(8,8,11,.48) 70%,rgba(8,8,11,.93) 100%);
}
/* No decorative arrow glyphs on the demo's custom UI. */
#md-custom-player .md-hero-powered-arrow,
.deseo-context-foot > span[aria-hidden="true"]{display:none!important}
@media(max-width:850px){
  #md-custom-player .md-player-squares{
    grid-template-columns:minmax(0,1fr)!important;
    gap:clamp(20px,4vw,33px)!important;
    justify-items:center!important;
  }
  #md-custom-player .md-nowplaying-column{
    grid-column:1!important;grid-row:1!important;
    max-width:440px!important;
  }
  #md-custom-player .md-sponsor-column{
    grid-column:1!important;grid-row:2!important;
    max-width:440px!important;
  }
}
@media(max-width:600px){
  #md-custom-player .ds-profile-button{padding:7px 9px;font-size:9px}
  #md-custom-player .ds-player-heading .md-onair-share{font-size:9px;padding:7px 10px}
  #md-custom-player .ds-player-heading{margin-bottom:8px}
}


/* DEMO V6 — compact, centered twin-square hero, without sacrificing the tagline.
   Old 3-column artwork was ~495px on large monitors. Two columns must not
   expand into giant half-screen squares merely because the DJ tile is gone. */
@media (min-width:851px) {
  .md-hero .md-hero-content {
    --ds-hero-tile:min(515px, max(275px, calc(100svh - 330px)), calc((100vw - 94px)/2));
    width:min(1850px, calc(100% - 54px))!important;
    min-height:100svh!important;
    height:auto!important;
    box-sizing:border-box!important;
    padding:clamp(86px, 11svh, 126px) 0 clamp(62px, 7.5svh, 82px)!important;
    justify-content:center!important;
  }
  .md-hero .md-hero-grid {
    gap:clamp(13px, 2.1svh, 27px)!important;
    justify-content:center!important;
    align-items:center!important;
  }
  .md-hero-grid > .md-player-home,
  .md-hero-grid > .md-hero-copy {
    width:100%!important;
    max-width:none!important;
    margin:0 auto!important;
    align-self:center!important;
  }
  #md-custom-player .md-player-squares {
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0, var(--ds-hero-tile)))!important;
    justify-content:center!important;
    justify-items:center!important;
    align-items:start!important;
    gap:clamp(20px, 3.1vw, 56px)!important;
    width:100%!important;
    margin:0 auto!important;
  }
  #md-custom-player .md-nowplaying-column,
  #md-custom-player .md-sponsor-column{
    grid-column:auto!important;
    grid-row:1!important;
    width:100%!important;
    max-width:var(--ds-hero-tile)!important;
    min-width:0!important;
    margin:0 auto!important;
    justify-self:center!important;
    align-self:start!important;
  }
  #md-custom-player .md-nowplaying-frame,
  #md-custom-player .md-custom-sponsor{
    width:100%!important;
    aspect-ratio:1/1!important;
  }
  .md-hero-grid .md-brand-headline{
    width:100%!important;
    max-width:calc(100vw - 60px)!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    justify-content:center!important;
    align-items:baseline!important;
    gap:clamp(6px, .85vw, 16px)!important;
    margin:0 auto!important;
    padding:0!important;
    font-size:clamp(23px, 3.75vw, 75px)!important;
    line-height:1.03!important;
    white-space:nowrap!important;
    letter-spacing:-.04em!important;
    text-align:center!important;
  }
  .md-hero-grid .md-brand-headline > span{
    white-space:nowrap!important;
    flex-shrink:1!important;
    min-width:0!important;
  }
}

/* Shorter laptop viewports: reduce the square and surrounding white space
   together, so THE SOUNDTRACK OF YOUR LIFE stays inside the first viewport. */
@media (min-width:851px) and (max-height:700px){
  .md-hero .md-hero-content {
    --ds-hero-tile:min(495px, max(235px, calc(100svh - 310px)), calc((100vw - 94px)/2));
    padding:clamp(78px, 12svh, 104px) 0 56px!important;
  }
  .md-hero .md-hero-grid{gap:clamp(10px, 1.8svh, 18px)!important}
  .md-hero-grid .md-brand-headline{font-size:clamp(23px, 3.65vw, 61px)!important}
}
@media (min-width:851px) and (max-height:560px){
  .md-hero .md-hero-content{
    --ds-hero-tile:min(370px, max(190px, calc(100svh - 280px)), calc((100vw - 94px)/2));
    padding:72px 0 52px!important;
  }
  .md-hero .md-hero-grid{gap:9px!important}
  .md-hero-grid .md-brand-headline{font-size:clamp(20px, 3.1vw, 46px)!important}
}

/* Mobile/tablet: small centered cards and the full tagline ABOVE them, so
   it isn't lost below two stacked square images on the initial viewport. */
@media (max-width:850px){
  .md-hero .md-hero-content{
    width:calc(100% - 32px)!important;
    height:auto!important;
    min-height:100svh!important;
    padding:clamp(88px, 11svh, 119px) 0 80px!important;
  }
  .md-hero .md-hero-grid{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(19px, 3svh, 30px)!important;
  }
  .md-hero-grid > .md-hero-copy{
    order:0!important;
    width:100%!important;
    margin:0 auto!important;
  }
  .md-hero-grid > .md-player-home{
    order:1!important;
    width:100%!important;
    max-width:440px!important;
    margin:0 auto!important;
  }
  #md-custom-player .md-player-squares{
    grid-template-columns:minmax(0,1fr)!important;
    justify-items:center!important;
    gap:clamp(20px,3.5vw,30px)!important;
  }
  #md-custom-player .md-nowplaying-column,
  #md-custom-player .md-sponsor-column{
    width:100%!important;
    max-width:min(440px, calc(100vw - 36px))!important;
    margin:0 auto!important;
    justify-self:center!important;
  }
  #md-custom-player .md-nowplaying-column{grid-column:1!important;grid-row:1!important}
  #md-custom-player .md-sponsor-column{grid-column:1!important;grid-row:2!important}
  .md-hero-grid .md-brand-headline{
    display:flex!important;
    flex-wrap:wrap!important;
    justify-content:center!important;
    align-items:center!important;
    gap:4px clamp(5px, 1.05vw, 11px)!important;
    width:100%!important;
    max-width:100%!important;
    font-size:clamp(22px, 4.8vw, 39px)!important;
    line-height:1.1!important;
    text-align:center!important;
    white-space:normal!important;
    overflow:visible!important;
  }
  .md-hero-grid .md-brand-headline > span{
    white-space:nowrap!important;
    max-width:100%!important;
  }
}
@media (max-width:600px){
  .md-hero .md-hero-content{
    width:calc(100% - 30px)!important;
    padding:clamp(89px, 12svh, 112px) 0 75px!important;
  }
  .md-hero-grid .md-brand-headline{
    font-size:clamp(20px, 5.25vw, 30px)!important;
  }
  #md-custom-player .md-nowplaying-column,
  #md-custom-player .md-sponsor-column{
    max-width:min(400px,calc(100vw - 30px))!important;
  }
}
@media(max-width:380px){
  .md-hero-grid .md-brand-headline{
    font-size:clamp(18px,5.05vw,21px)!important;
    gap:3px 5px!important;
  }
}

/* PWA top safe-area padding must not undo the compact hero layout. */
@media(max-width:850px){
  html.md-pwa-standalone .md-hero .md-hero-content{
    padding-top:calc(clamp(88px,11svh,119px) + var(--md-pwa-statusbar-top, 0px) + var(--md-pwa-header-gap, 0px))!important;
  }
}
@media(max-width:600px){
  html.md-pwa-standalone .md-hero .md-hero-content{
    padding-top:calc(clamp(89px,12svh,112px) + var(--md-pwa-statusbar-top, 0px) + var(--md-pwa-header-gap, 0px))!important;
  }
}


/* PLAYER / TYPOGRAPHY INTEGRITY
   Full DJ names, track titles and metadata must never lose descenders/accents
   or be silently truncated by the legacy square-player line clamps.
   Extra-long text is scaled to the available height by demo-home-player.js;
   any remaining content is scrollable instead of cut off. */
#md-custom-player .ds-player .ds-content {
  min-width:0;
}
#md-custom-player .ds-player .ds-song{
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.3) transparent;
  padding:3px 1px 5px;
  text-shadow:0 3px 10px rgba(0,0,0,.78);
}
#md-custom-player .ds-player .ds-song-copy{
  box-sizing:border-box!important;
  max-width:100%!important;
  min-width:0;
  overflow:visible!important;
}
#md-custom-player .ds-player .ds-song h2{
  display:block!important;
  font-family:'Barlow Condensed','Barlow',Arial,sans-serif;
  font-size:var(--ds-fit-title,var(--ds-title-base,clamp(21px,2.4vw,37px)))!important;
  line-height:1.26!important;
  font-weight:800;
  letter-spacing:-.015em!important;
  margin:3px 0 4px!important;
  padding:.09em .035em .17em!important;
  max-height:none!important;
  min-height:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  -webkit-line-clamp:unset!important;
  -webkit-box-orient:initial!important;
  text-wrap:pretty;
}
#md-custom-player .ds-player .ds-song-copy > p,
#md-custom-player .ds-player .ds-track-secondary{
  line-height:1.48!important;
  padding-block:2px 3px!important;
  max-height:none!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}
#md-custom-player .ds-player .ds-kicker{
  display:block;
  line-height:1.38!important;
  padding-block:2px 3px!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
#md-custom-player .ds-player .ds-head{
  min-height:0;
  align-items:flex-start;
  flex-wrap:wrap;
}
#md-custom-player .ds-player .ds-status{
  min-width:0;
  max-width:100%;
  align-items:flex-start;
}
#md-custom-player .ds-player .ds-status > span{
  display:block!important;
  line-height:1.38!important;
  white-space:normal!important;
  overflow:visible!important;
  max-height:none!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
  -webkit-line-clamp:unset!important;
  -webkit-box-orient:initial!important;
  padding:1px 0 2px;
}
#md-custom-player .ds-player .ds-profile-button{
  line-height:1.3!important;
  padding-block:9px!important;
  white-space:normal!important;
  text-align:center;
}
#md-player-dock .md-dock-program-copy,
#md-player-dock .md-dock-program-info{
  min-width:0;
  max-width:100%;
  overflow:visible;
}
#md-player-dock .md-dock-program-copy strong{
  line-height:1.32!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  padding:.1em 0 .16em!important;
}
#md-player-dock .md-dock-program-copy small,
#md-player-dock .md-dock-program-info > span{
  line-height:1.38!important;
  white-space:normal!important;
  overflow:visible!important;
  overflow-wrap:anywhere!important;
  padding-block:2px!important;
}
#md-player-dock .ds-dock-live{
  line-height:1.35!important;
  white-space:normal!important;
}
@media(max-width:600px){
  #md-custom-player .ds-player .ds-song{--ds-title-base:clamp(22px,6.4vw,34px)}
  #md-custom-player .ds-player .ds-song h2{line-height:1.28!important}
  #md-player-dock .md-dock-program-copy strong{line-height:1.35!important}
}


/* PRODUCTION PLAYER: status dot, label and HD+ share the same text baseline. */
#md-custom-player .ds-player .ds-status{
  display:inline-flex!important;
  align-items:flex-start!important;
  gap:7px!important;
}
#md-custom-player .ds-player .ds-status > i{
  display:block!important;
  flex:0 0 7px!important;
  width:7px!important;
  height:7px!important;
  margin-top:clamp(5px,.47em,7px)!important;
  align-self:flex-start!important;
}
#md-custom-player .ds-player .ds-status > span{
  flex:0 1 auto!important;
  min-width:0;
  line-height:1.32!important;
  padding:1px 0 2px!important;
  margin:0!important;
}
#md-custom-player .ds-player .ds-status > .ds-hd{
  align-self:flex-start!important;
  margin:1px 0 0!important;
  line-height:1.3!important;
}
/* DSP OFF, unsupported browsers and pending checks use a subdued SD badge. */
#md-custom-player .ds-player .ds-status > .ds-hd.is-sd{
  color:#aaa5aa!important;
}
/* Native phone sound is OS-managed: no in-player volume slider/mute controls. */
html.ds-mobile-native #md-custom-player .ds-volume,
html.ds-mobile-native #md-player-dock .ds-dock-mute,
html.ds-mobile-native #md-player-dock .ds-dock-volume{
  display:none!important;
}
html.ds-mobile-native #md-player-dock .ds-dock-live{
  margin-left:auto;
}
/* Accessible compact keyboard-help dialog, separate from DSP settings. */
.ds-help-trigger{display:inline-flex;align-items:center;justify-content:center;gap:5px;cursor:pointer}
.ds-help-trigger svg{width:15px;height:15px;display:block;flex-shrink:0}
.ds-shortcuts-dialog{
  border:1px solid rgba(255,255,255,.27);
  background:linear-gradient(145deg,#201b20,#100e12);
  color:#fff;
  width:min(375px,calc(100vw - 28px));
  max-width:calc(100vw - 28px);
  max-height:calc(100dvh - 30px);
  overflow-y:auto;
  padding:21px;
  border-radius:12px;
  box-shadow:0 24px 85px #000e;
  font-family:'Barlow',Arial,sans-serif;
  cursor:default!important;
}
.ds-shortcuts-dialog:not([open]){display:none!important}
.ds-shortcuts-dialog::backdrop{background:rgba(0,0,0,.7);backdrop-filter:blur(5px)}
.ds-shortcuts-dialog,.ds-shortcuts-dialog *{box-sizing:border-box;cursor:default!important}
.ds-shortcuts-dialog button{cursor:pointer!important}
.ds-shortcuts-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.ds-shortcuts-eyebrow{font-size:10px;font-weight:900;letter-spacing:.14em;color:#ff0000}
#ds-shortcuts-close{border:1px solid #ffffff50;border-radius:50%;width:32px;height:32px;background:#ffffff12;color:#fff;font-size:23px;line-height:1;display:grid;place-items:center}
.ds-shortcuts-dialog h2{font:900 26px/1.15 'Barlow Condensed','Barlow',Arial,sans-serif;margin:18px 0 8px;letter-spacing:.02em}
.ds-shortcuts-dialog p{font-size:12px;color:#c3bdc3;line-height:1.55;margin:0 0 18px}
.ds-shortcuts-list{margin:0;padding:0;border-top:1px solid #ffffff2b}
.ds-shortcuts-list>div{display:flex;align-items:center;gap:12px;justify-content:space-between;padding:11px 0;border-bottom:1px solid #ffffff22}
.ds-shortcuts-list dt,.ds-shortcuts-list dd{margin:0;min-width:0}
.ds-shortcuts-list dt{flex:0 0 90px}
.ds-shortcuts-list kbd{display:inline-block;border:1px solid #ffffff5a;border-bottom-width:2px;border-radius:5px;padding:7px 9px;font:900 10px/1 'Barlow',Arial,sans-serif;letter-spacing:.05em;background:#171319;color:#fff;white-space:nowrap}
.ds-shortcuts-list dd{flex:1;color:#fff;font-size:12px;line-height:1.35;text-align:right}
.ds-shortcuts-dialog .ds-shortcuts-hint{font-size:11px;color:#aaa;margin:16px 0 0}
html.ds-native-dsp-cursor .md-custom-cursor{opacity:0!important;visibility:hidden!important}
@media(max-width:600px){
  #md-custom-player .ds-help-trigger{padding:8px;min-width:33px}
  #md-custom-player .ds-help-trigger>span{display:none}
  .ds-shortcuts-dialog{padding:17px}
}


/* PRODUCTION PLAYER V7: 2x size Play/Stop in hero AND right sticky. */
#md-custom-player .ds-player .ds-play{
  width:clamp(72px,6.6vw,102px)!important;
  height:clamp(72px,6.6vw,102px)!important;
  min-width:clamp(72px,6.6vw,102px)!important;
  border-radius:50%!important;
  flex-shrink:0!important;
  touch-action:manipulation;
}
#md-custom-player .ds-player .ds-play svg{
  width:44px!important;height:44px!important;
}
#md-player-dock .ds-dock-play{
  width:76px!important;height:76px!important;min-width:76px!important;
  border-radius:50%!important;flex-shrink:0!important;touch-action:manipulation;
}
#md-player-dock .ds-dock-play svg{
  width:40px!important;height:40px!important;
}
#md-custom-player .ds-player .ds-transport{
  min-width:0;
  gap:clamp(6px,.7vw,12px);
}
#md-player-dock .ds-dock-controls{
  min-width:0;
  gap:clamp(7px,.7vw,12px);
  align-items:center;
}
#md-player-dock .ds-dock-volume{min-width:28px;max-width:95px}
#md-player-dock .ds-dock-live{flex:0 1 auto;min-width:0;text-align:center}
#md-custom-player .ds-player .ds-play:focus-visible,
#md-player-dock .ds-dock-play:focus-visible{
  outline:3px solid #fff;outline-offset:3px;
}
/* No transient OFF: show pending support check separately from true DSP OFF. */
#md-custom-player #dsp-trigger.is-dsp-checking #dsp-state{
  color:#ddd;
}
#md-custom-player #dsp-trigger.is-dsp-checking .tool-light{
  background:#ddd;
}
.ds-panel #dsp-toggle:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:850px){
  /* Mobile main button doubles the original 42px; sticky doubles 36px. */
  #md-custom-player .ds-player .ds-play{
    width:84px!important;height:84px!important;min-width:84px!important;
  }
  #md-custom-player .ds-player .ds-play svg{
    width:40px!important;height:40px!important;
  }
  #md-player-dock .ds-dock-play{
    width:72px!important;height:72px!important;min-width:72px!important;
  }
  #md-player-dock .ds-dock-play svg{
    width:38px!important;height:38px!important;
  }
}
/* Phone status is visible in the MAIN player and also mirrors the right sticky:
   PRESS PLAY TO LISTEN -> BUFFERING -> LIVE. */
html.ds-mobile-native #md-custom-player .ds-player .ds-playing-label{
  display:flex!important;
  flex:1 1 100px;
  min-width:0;
  max-width:150px;
  align-items:center;
  color:#fff;
  font:900 clamp(9px,2.45vw,11px)/1.3 'Barlow',Arial,sans-serif;
  letter-spacing:.035em;
  white-space:normal;
  overflow-wrap:anywhere;
  text-align:left;
}
html.ds-mobile-native #md-player-dock .ds-dock-live{
  display:flex!important;
  flex:1 1 70px;
  justify-content:center;
  align-items:center;
  max-width:135px;
  font:900 clamp(9px,2.4vw,11px)/1.35 'Barlow',Arial,sans-serif;
  letter-spacing:.015em;
  color:#fff;
  white-space:normal!important;
  text-align:center;
  overflow-wrap:anywhere;
}
html.ds-mobile-native #md-custom-player .ds-player .ds-playing-label[data-playback-state="buffering"],
html.ds-mobile-native #md-player-dock .ds-dock-live[data-playback-state="buffering"]{
  color:#fff;
}
@media(max-width:600px){
  #md-custom-player .ds-player .ds-transport{
    flex-wrap:nowrap;
    gap:6px;
  }
  #md-custom-player .ds-player .ds-utilities{margin-left:auto;min-width:0}
  #md-player-dock .ds-dock-controls{gap:8px}
}


/* HERO CARD ALIGNMENT — sponsor and player share the same 32px heading row.
   SHARE occupies that row on the player; reserve identical space for SPONSOR.
   This keeps both square cards level at the top and bottom at every breakpoint. */
#md-custom-player .md-sponsor-column > .md-player-square-label{
  box-sizing:border-box;
  display:flex;
  align-items:center;
  height:32px;
  margin-bottom:6px!important;
}

/* Rounded DSP and keyboard-shortcut controls in the homepage player only. */
#md-custom-player .ds-player .ds-utilities #dsp-trigger,
#md-custom-player .ds-player .ds-utilities #shortcuts-trigger{
  border-radius:999px!important;
  padding:8px 14px!important;
  min-height:34px;
}

@media(max-width:600px){
  #md-custom-player .md-sponsor-column > .md-player-square-label{
    margin-bottom:8px!important;
  }
}


/* LAPTOP FIT / same full-size composition, scaled to available CSS viewport.
   Keep two identically sized square cards and the one-line slogan; never switch
   to the mobile/tablet stacked composition above the 850px breakpoint.
   The player controls derive from the tile size, not solely the viewport width,
   so 1366x768, 1280x720 and short laptop windows cannot overflow the card. */
@media (min-width:851px) and (max-width:1600px){
  .md-hero .md-hero-content{
    --ds-hero-tile:min(475px,30.5vw,max(250px,calc(100svh - 304px)),calc((100vw - 78px)/2));
    width:min(100% - 42px,1510px)!important;
    min-height:100svh!important;
    padding:clamp(94px,12svh,114px) 0 clamp(52px,7svh,76px)!important;
  }
  .md-hero .md-hero-grid{
    gap:clamp(10px,1.7svh,20px)!important;
  }
  #md-custom-player .md-player-squares{
    grid-template-columns:repeat(2,minmax(0,var(--ds-hero-tile)))!important;
    gap:clamp(14px,3vw,42px)!important;
  }
  #md-custom-player .md-nowplaying-column,
  #md-custom-player .md-sponsor-column{
    width:100%!important;
    max-width:var(--ds-hero-tile)!important;
  }
  #md-custom-player .ds-player-heading,
  #md-custom-player .md-sponsor-column > .md-player-square-label{
    box-sizing:border-box;
    height:clamp(28px,2.4vw,32px);
    min-height:clamp(28px,2.4vw,32px);
    margin-bottom:6px!important;
    align-items:center;
  }
  #md-custom-player .md-player-square-label{
    font-size:clamp(10px,.83vw,13px)!important;
  }
  #md-custom-player .ds-player-heading .md-onair-share{
    min-height:clamp(26px,2.3vw,32px);
    padding:6px clamp(8px,.8vw,12px);
    font-size:clamp(9px,.67vw,10px);
  }
  #md-custom-player .ds-player .ds-content{
    padding:clamp(8px,calc(var(--ds-hero-tile) * .033),16px)!important;
  }
  #md-custom-player .ds-player .ds-head{
    gap:clamp(4px,calc(var(--ds-hero-tile) * .015),8px);
  }
  #md-custom-player .ds-player .ds-status{
    font-size:clamp(9px,calc(var(--ds-hero-tile) * .026),12px)!important;
    gap:clamp(4px,calc(var(--ds-hero-tile) * .015),7px)!important;
  }
  #md-custom-player .ds-player .ds-profile-button{
    padding:clamp(5px,calc(var(--ds-hero-tile) * .019),9px) clamp(7px,calc(var(--ds-hero-tile) * .027),12px)!important;
    font-size:clamp(8px,calc(var(--ds-hero-tile) * .025),11px)!important;
  }
  #md-custom-player .ds-player.is-dj .ds-song-copy{
    padding:clamp(5px,calc(var(--ds-hero-tile) * .019),8px) clamp(7px,calc(var(--ds-hero-tile) * .028),12px);
  }
  #md-custom-player .ds-player .ds-song{
    --ds-title-base:clamp(19px,calc(var(--ds-hero-tile) * .08),35px);
    margin-bottom:clamp(5px,calc(var(--ds-hero-tile) * .024),12px);
  }
  #md-custom-player .ds-player .ds-kicker{
    font-size:clamp(8px,calc(var(--ds-hero-tile) * .023),10px);
  }
  #md-custom-player .ds-player .ds-song-copy > p{
    font-size:clamp(10px,calc(var(--ds-hero-tile) * .034),14px);
  }
  #md-custom-player .ds-player.is-dj .ds-bottom{
    padding:clamp(2px,calc(var(--ds-hero-tile) * .01),4px) clamp(3px,calc(var(--ds-hero-tile) * .018),8px);
  }
  #md-custom-player .ds-player .ds-transport{
    gap:clamp(3px,calc(var(--ds-hero-tile) * .014),8px)!important;
    padding-top:clamp(5px,calc(var(--ds-hero-tile) * .022),9px);
  }
  #md-custom-player .ds-player .ds-play{
    width:clamp(45px,calc(var(--ds-hero-tile) * .2),95px)!important;
    height:clamp(45px,calc(var(--ds-hero-tile) * .2),95px)!important;
    min-width:clamp(45px,calc(var(--ds-hero-tile) * .2),95px)!important;
  }
  #md-custom-player .ds-player .ds-play svg{
    width:clamp(23px,calc(var(--ds-hero-tile) * .094),43px)!important;
    height:clamp(23px,calc(var(--ds-hero-tile) * .094),43px)!important;
  }
  #md-custom-player .ds-player .ds-volume{
    flex:0 1 auto;
    gap:clamp(2px,calc(var(--ds-hero-tile) * .012),5px);
  }
  #md-custom-player .ds-player .ds-volume button{
    padding:2px;
  }
  #md-custom-player .ds-player .ds-volume button svg{
    width:clamp(13px,calc(var(--ds-hero-tile) * .044),18px);
    height:clamp(13px,calc(var(--ds-hero-tile) * .044),18px);
  }
  #md-custom-player .ds-player .ds-volume input{
    width:clamp(23px,calc(var(--ds-hero-tile) * .11),53px)!important;
  }
  #md-custom-player .ds-player .ds-volume #volume-number{
    display:none;
  }
  #md-custom-player .ds-player .ds-utilities{
    gap:clamp(3px,calc(var(--ds-hero-tile) * .012),6px);
    min-width:0;
  }
  #md-custom-player .ds-player .ds-utilities #dsp-trigger,
  #md-custom-player .ds-player .ds-utilities #shortcuts-trigger{
    gap:clamp(2px,calc(var(--ds-hero-tile) * .01),5px)!important;
    padding:clamp(5px,calc(var(--ds-hero-tile) * .018),8px) clamp(5px,calc(var(--ds-hero-tile) * .025),12px)!important;
    min-height:clamp(25px,calc(var(--ds-hero-tile) * .077),34px);
    font-size:clamp(8px,calc(var(--ds-hero-tile) * .024),10px)!important;
  }
  #md-custom-player .ds-player #shortcuts-trigger svg{
    width:clamp(11px,calc(var(--ds-hero-tile) * .036),15px);
    height:clamp(11px,calc(var(--ds-hero-tile) * .036),15px);
  }
  .md-hero-grid .md-brand-headline{
    font-size:clamp(25px,3.7vw,61px)!important;
    gap:clamp(5px,.78vw,13px)!important;
    line-height:1.02!important;
  }
  .md-header .md-header-inner{
    height:clamp(76px,7.4vw,96px)!important;
    min-height:clamp(76px,7.4vw,96px)!important;
  }
  .md-header .md-logo{
    flex:0 0 clamp(160px,14.8vw,205px)!important;
    width:clamp(160px,14.8vw,205px)!important;
    max-width:clamp(160px,14.8vw,205px)!important;
    height:100%!important;
  }
  .md-header .md-logo img{
    width:100%!important;
    max-width:100%!important;
    height:100%!important;
    max-height:100%!important;
  }
  #md-player-dock .ds-dock-play{
    width:clamp(58px,5.1vw,76px)!important;
    height:clamp(58px,5.1vw,76px)!important;
    min-width:clamp(58px,5.1vw,76px)!important;
  }
  #md-player-dock .ds-dock-play svg{
    width:clamp(30px,2.55vw,40px)!important;
    height:clamp(30px,2.55vw,40px)!important;
  }
}
/* Extra-short landscape laptop windows: retain the identical pair of cards and
   readable controls; let the hero grow vertically instead of cutting anything. */
@media (min-width:851px) and (max-width:1600px) and (max-height:620px){
  .md-hero .md-hero-content{
    padding-top:clamp(86px,17svh,100px)!important;
    padding-bottom:50px!important;
  }
  .md-hero .md-hero-grid{gap:9px!important}
  .md-hero-grid .md-brand-headline{font-size:clamp(23px,3.35vw,53px)!important}
}


/* Compact laptops: lower title size just a touch, and another small step for
   genuinely long track / DJ names. This is deliberately scoped to laptop
   widths so large desktop and phone typography remain exactly as before. */
@media (min-width:851px) and (max-width:1600px){
  #md-custom-player .ds-player .ds-song{
    --ds-title-base:clamp(18px,calc(var(--ds-hero-tile) * .076),33px);
  }
  #md-custom-player .ds-player .ds-song.is-long-title{
    --ds-title-base:clamp(18px,calc(var(--ds-hero-tile) * .073),31px);
  }
}

/* Very narrow laptop windows: retain the two matching hero cards and all
   working desktop controls without squeezing the transport row. */
@media (min-width:851px) and (max-width:1100px){
  #md-custom-player .ds-player .ds-play{
    width:clamp(48px,calc(var(--ds-hero-tile) * .187),65px)!important;
    height:clamp(48px,calc(var(--ds-hero-tile) * .187),65px)!important;
    min-width:clamp(48px,calc(var(--ds-hero-tile) * .187),65px)!important;
  }
  #md-custom-player .ds-player .ds-play svg{
    width:clamp(23px,calc(var(--ds-hero-tile) * .087),32px)!important;
    height:clamp(23px,calc(var(--ds-hero-tile) * .087),32px)!important;
  }
  #md-custom-player .ds-player .ds-volume input{
    width:clamp(19px,calc(var(--ds-hero-tile) * .095),32px)!important;
    min-width:0;
  }
  #md-custom-player .ds-player .ds-utilities #dsp-trigger,
  #md-custom-player .ds-player .ds-utilities #shortcuts-trigger{
    padding-inline:clamp(5px,.65vw,7px)!important;
    font-size:8px!important;
    gap:3px!important;
  }
  #md-custom-player .ds-player .ds-transport{
    gap:clamp(3px,.38vw,5px)!important;
  }
}


/* DESKTOP PLAYER BUTTON REFINEMENT
   Laptop hero Play/Pause: 20% larger than the previous 0.6x size (now 0.72x).
   Laptop sticky and every larger desktop sticky: one consistent compact scale.
   Only desktop widths (>=851px); original mobile/tablet styles remain unchanged. */
@media (min-width:851px) and (max-width:1600px){
  #md-custom-player .ds-player .ds-play{
    width:clamp(32.4px,calc(var(--ds-hero-tile) * .144),68.4px)!important;
    height:clamp(32.4px,calc(var(--ds-hero-tile) * .144),68.4px)!important;
    min-width:clamp(32.4px,calc(var(--ds-hero-tile) * .144),68.4px)!important;
  }
  #md-custom-player .ds-player .ds-play svg{
    width:clamp(16.8px,calc(var(--ds-hero-tile) * .06768),31.2px)!important;
    height:clamp(16.8px,calc(var(--ds-hero-tile) * .06768),31.2px)!important;
  }
}
@media (min-width:851px) and (max-width:1100px){
  #md-custom-player .ds-player .ds-play{
    width:clamp(34.8px,calc(var(--ds-hero-tile) * .13464),46.8px)!important;
    height:clamp(34.8px,calc(var(--ds-hero-tile) * .13464),46.8px)!important;
    min-width:clamp(34.8px,calc(var(--ds-hero-tile) * .13464),46.8px)!important;
  }
  #md-custom-player .ds-player .ds-play svg{
    width:clamp(16.8px,calc(var(--ds-hero-tile) * .06264),22.8px)!important;
    height:clamp(16.8px,calc(var(--ds-hero-tile) * .06264),22.8px)!important;
  }
}
@media (min-width:851px){
  #md-player-dock .ds-dock-play{
    width:clamp(35px,3.06vw,46px)!important;
    height:clamp(35px,3.06vw,46px)!important;
    min-width:clamp(35px,3.06vw,46px)!important;
  }
  #md-player-dock .ds-dock-play svg{
    width:clamp(18px,1.53vw,24px)!important;
    height:clamp(18px,1.53vw,24px)!important;
  }
}

/* MOBILE STICKY PLAY/PAUSE / compact desktop-matched size */
/* Match the compact sticky control used on laptops; do not resize the
   main homepage player on phones. This overrides the legacy 72px mobile dock. */
@media (max-width:850px){
  #md-player-dock .ds-dock-play{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    flex:0 0 42px!important;
  }
  #md-player-dock .ds-dock-play svg{
    width:22px!important;
    height:22px!important;
  }
}
@media (max-width:600px){
  #md-player-dock .ds-dock-play{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    flex-basis:40px!important;
  }
  #md-player-dock .ds-dock-play svg{
    width:21px!important;
    height:21px!important;
  }
}


/* TRACK METADATA SPACING / red on-air label, tighter title and artist */
/* Keep the NOW PLAYING / NOW ON AIR kicker in the same spot and use the
   station red. The dark text shadow remains for artwork readability. */
#md-custom-player .ds-player .ds-song .ds-kicker{
  color:#ff0000!important;
}
/* Track artwork only: a little more air beneath the kicker, less whitespace
   between the title and artist. Reserve the lost height below the artist so
   the kicker stays aligned with its existing position above the controls. */
#md-custom-player .ds-player:not(.is-dj) .ds-song{
  padding-bottom:8px;
}
#md-custom-player .ds-player:not(.is-dj) .ds-song h2{
  margin-top:11px!important;
  margin-bottom:0!important;
  padding-bottom:.04em!important;
}
#md-custom-player .ds-player:not(.is-dj) .ds-song-copy > p{
  padding-top:0!important;
}


/* DESEO IMMERSIVE PLAYER / FULL-VIEW RADIO STAGE */
#md-custom-player .ds-player-heading{
  justify-content:flex-start;
}
#md-custom-player .ds-player-heading .md-player-square-label{margin-right:auto!important}
#md-custom-player .ds-player-heading .ds-fullscreen-open{
  display:grid;place-items:center;flex:0 0 33px;
  width:33px;height:33px;min-width:33px;padding:0;
  color:#fff;border:1px solid rgba(255,255,255,.3);
  border-radius:50%;background:rgba(24,21,24,.72);
  cursor:pointer;transition:background .18s,border-color .18s;
}
#md-custom-player .ds-player-heading .ds-fullscreen-open:hover,
#md-custom-player .ds-player-heading .ds-fullscreen-open:focus-visible{
  border-color:#f00;background:#f00;
}
#md-custom-player .ds-fullscreen-open svg{width:15px;height:15px}
.ds-fullscreen-dialog:not([open]){display:none!important}
.ds-fullscreen-dialog[open]{
  display:block!important;position:fixed!important;z-index:12000!important;inset:0!important;
  top:0!important;left:0!important;right:0!important;bottom:0!important;
  width:100vw!important;max-width:none!important;
  height:100vh!important;height:100dvh!important;
  max-height:none!important;margin:0!important;padding:0!important;
  border:0!important;border-radius:0!important;
  overflow-x:hidden!important;overflow-y:auto!important;
  overscroll-behavior:contain;isolation:isolate;
  color:#fff;background:#08080a;
  box-shadow:none!important;
  scrollbar-width:thin;scrollbar-color:#f00 #171216;
  font-family:'Google Sans','Google Sans Flex',Arial,sans-serif;
}
.ds-fullscreen-dialog::backdrop{background:#000}
.ds-fullscreen-dialog *{box-sizing:border-box}
.ds-fs-backdrop{
  position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;
  background:
    radial-gradient(ellipse at 77% 56%,rgba(187,0,0,.25),transparent 48%),
    radial-gradient(ellipse at 23% 80%,rgba(125,0,0,.12),transparent 45%),
    #08080a;
}
.ds-fs-backdrop::before{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(0deg,transparent 0,transparent 45px,rgba(255,255,255,.035) 46px),
             repeating-linear-gradient(90deg,transparent 0,transparent 58px,rgba(255,255,255,.024) 59px);
  mask-image:linear-gradient(to top,#0002,#000e 55%,#0002);
}
.ds-fs-layout{
  position:relative;z-index:1;min-height:100vh;min-height:100dvh;
  display:flex;flex-direction:column;
  width:min(1800px,100%);margin:auto;
  padding:clamp(20px,3.2vw,58px) clamp(22px,5vw,100px) clamp(18px,3vw,38px);
}
.ds-fs-header{
  position:relative;z-index:2;
  display:flex;align-items:center;gap:24px;min-height:61px;
}
.ds-fs-header>img{width:clamp(115px,11vw,176px);height:auto;max-height:72px;object-fit:contain}
.ds-fs-station{
  margin-left:auto;display:inline-flex;align-items:center;gap:9px;
  font:800 11px/1.1 'Barlow',Arial,sans-serif;letter-spacing:.17em;
  color:#b9b5b6;white-space:nowrap;
}
.ds-fs-station i{width:7px;height:7px;border-radius:50%;background:#f00;box-shadow:0 0 13px #f00}
.ds-fs-close{
  display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;
  border-radius:50%;border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.06);color:#fff;
  font:400 35px/1 Arial,sans-serif;cursor:pointer;
  transition:background .2s,border-color .2s;
}
.ds-fs-close:hover,.ds-fs-close:focus-visible{background:#f00;border-color:#f00}
.ds-fs-main{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr);
  align-items:center;gap:clamp(26px,6vw,120px);
  flex:1 0 auto;padding:clamp(24px,3vw,52px) 0;
}
.ds-fs-info{min-width:0;max-width:780px;position:relative;z-index:2}
.ds-fs-eyebrow{
  display:block;color:#f00;margin:0 0 clamp(12px,2vh,24px);
  font:900 clamp(11px,1vw,16px)/1.2 'Barlow',Arial,sans-serif;
  letter-spacing:.18em;text-transform:uppercase;
}
.ds-fs-info h2{
  margin:0!important;padding:0!important;
  color:#fff;font:900 clamp(56px,6.2vw,122px)/.95 'Barlow Condensed','Roboto Condensed',Impact,sans-serif!important;
  letter-spacing:-.035em;text-transform:uppercase;overflow-wrap:anywhere;
  text-wrap:balance;text-shadow:0 8px 35px #000b;
}
.ds-fs-info>p{
  margin:clamp(12px,1.7vw,25px) 0 clamp(24px,3.5vw,50px);
  color:#e8e2e3;font:500 clamp(17px,1.65vw,28px)/1.35 'Google Sans',Arial,sans-serif;
  overflow-wrap:anywhere;text-shadow:0 3px 18px #000;
}
.ds-fs-artwork{
  width:100%;max-width:660px;aspect-ratio:1/1;position:relative;
  justify-self:end;border:1px solid rgba(255,255,255,.24);
  border-radius:13px;overflow:hidden;
  background:#161013;box-shadow:0 35px 110px rgba(0,0,0,.62);
}
.ds-fs-artwork img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.ds-fs-art-label{
  position:absolute;right:17px;top:17px;
  padding:8px 11px;border:1px solid rgba(255,255,255,.2);
  border-radius:25px;color:#fff;background:rgba(0,0,0,.52);
  font:900 10px/1 'Barlow',Arial,sans-serif;letter-spacing:.09em;
}
.ds-fs-save{display:flex;align-items:flex-start;flex-wrap:wrap;gap:12px;margin:0 0 25px}
.ds-fs-save>button{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  color:#fff;background:#f00;border:1px solid #f00;
  padding:13px 19px;border-radius:999px;cursor:pointer;
  font:900 12px/1 'Barlow',Arial,sans-serif;letter-spacing:.1em;
}
.ds-fs-save>button svg{width:16px;height:16px}
.ds-fs-save>button:hover{background:#cb0000;border-color:#cb0000}
.ds-fs-save-links{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.ds-fs-save-links a{
  display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.35);
  border-radius:30px;padding:12px 15px;font:800 11px/1.1 'Barlow',Arial,sans-serif;
  letter-spacing:.07em;background:rgba(10,10,10,.7);cursor:pointer;
}
.ds-fs-save-links a:hover{border-color:#f00;background:#f00}
.ds-fs-controls{
  display:flex;align-items:center;gap:clamp(12px,1.8vw,25px);
  flex-wrap:wrap;padding:clamp(15px,2vw,25px) 0;
  border-top:1px solid rgba(255,255,255,.25);
}
.ds-fs-play{
  display:grid;place-items:center;flex:0 0 64px;width:64px;height:64px;
  background:#f00;color:#fff;border:0;border-radius:50%;cursor:pointer;
}
.ds-fs-play:hover{background:#cf0000}
.ds-fs-play svg{width:32px;height:32px}
.ds-fs-play .ds-fs-pause-icon{display:none}
.ds-fs-play.is-playing .ds-fs-play-icon{display:none}
.ds-fs-play.is-playing .ds-fs-pause-icon{display:block}
.ds-fs-playback{
  color:#fff;font:900 12px/1.35 'Barlow',Arial,sans-serif;
  letter-spacing:.055em;min-width:95px;
}
.ds-fs-volume{display:flex;align-items:center;gap:8px;margin-left:auto;min-width:0}
.ds-fs-volume button{display:grid;place-items:center;padding:4px;background:transparent;border:0;color:#fff;cursor:pointer}
.ds-fs-volume svg{width:19px;height:19px}
.ds-fs-volume input{
  width:clamp(55px,7vw,105px);height:4px;cursor:pointer;
  accent-color:#f00;
}
.ds-fs-dsp{
  display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(255,255,255,.35);
  border-radius:999px;padding:10px 13px;background:rgba(22,21,22,.8);color:#fff;
  font:900 10px/1 'Barlow',Arial,sans-serif;cursor:pointer;
}
.ds-fs-dsp b{color:#aaa}
.ds-fs-dsp[aria-pressed="true"] b{color:#d6ff00}
.ds-fs-dsp:disabled{opacity:.5;cursor:not-allowed}
.ds-fs-footer{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding-top:16px;border-top:1px solid rgba(255,255,255,.18);
  font:700 10px/1.2 'Barlow',Arial,sans-serif;letter-spacing:.13em;color:#8e868b;
}
@media(max-width:1100px){
  .ds-fs-main{gap:26px;grid-template-columns:minmax(0,1fr) minmax(230px,.88fr)}
  .ds-fs-info h2{font-size:clamp(46px,6vw,78px)!important}
  .ds-fs-controls{gap:10px}
  .ds-fs-volume{margin-left:0}
}
@media(max-width:760px){
  .ds-fs-layout{padding:16px 18px 22px}
  .ds-fs-header>img{width:115px}
  .ds-fs-station{font-size:9px;letter-spacing:.06em}
  .ds-fs-close{width:44px;height:44px;flex-basis:44px}
  .ds-fs-main{
    display:flex;flex-direction:column-reverse;align-items:stretch;
    flex:0 0 auto;gap:24px;padding:28px 0;
  }
  .ds-fs-artwork{width:min(100%,400px);justify-self:center;margin:auto}
  .ds-fs-info h2{font-size:clamp(47px,10vw,78px)!important}
  .ds-fs-info>p{margin:12px 0 24px;font-size:18px}
  .ds-fs-play{width:54px;height:54px;flex-basis:54px}
  .ds-fs-play svg{width:27px;height:27px}
  .ds-fs-footer{font-size:9px;letter-spacing:.06em}
}
@media(max-width:460px){
  .ds-fs-station{display:none}
  .ds-fs-info h2{font-size:clamp(43px,12vw,63px)!important}
  .ds-fs-controls{gap:10px}
  .ds-fs-playback{min-width:90px}
  .ds-fs-dsp{margin-left:auto}
}
html.ds-mobile-native .ds-fs-volume{display:none!important}
html.ds-mobile-native .ds-fs-dsp{display:none!important}

/* The custom station dot is hidden while the native top-layer fullscreen
   dialog is open. System pointer remains visible across buttons and X. */
@media(hover:hover) and (pointer:fine){
  html.md-has-custom-cursor.ds-fullscreen-open,
  html.md-has-custom-cursor.ds-fullscreen-open body,
  html.md-has-custom-cursor.ds-fullscreen-open a,
  html.md-has-custom-cursor.ds-fullscreen-open button,
  .ds-fullscreen-dialog[open],
  .ds-fullscreen-dialog[open] *{cursor:default!important}
  html.md-has-custom-cursor.ds-fullscreen-open .md-custom-cursor{display:none!important}
  html.md-has-custom-cursor.ds-fullscreen-open .ds-fullscreen-dialog[open] button,
  html.md-has-custom-cursor.ds-fullscreen-open .ds-fullscreen-dialog[open] a,
  html.md-has-custom-cursor.ds-fullscreen-open .ds-fullscreen-dialog[open] input{cursor:pointer!important}
}


/* IMMERSIVE PLAYER / STRICT VIEWPORT FIT, NO SCROLL */
/* The dialog, the content shell and the stage must never create a second
   scroll viewport. 100dvh follows the visible mobile viewport (100vh fallback). */
.ds-fullscreen-dialog[open]{
  box-sizing:border-box!important;
  width:100%!important;
  height:100vh!important;
  height:100dvh!important;
  min-height:0!important;
  max-height:100dvh!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
  touch-action:manipulation;
}
.ds-fullscreen-dialog[open] .ds-fs-layout{
  box-sizing:border-box!important;
  height:100%;
  min-height:0!important;
  max-height:100%!important;
  overflow:hidden!important;
}
.ds-fullscreen-dialog[open] .ds-fs-header,
.ds-fullscreen-dialog[open] .ds-fs-footer{flex-shrink:0}
.ds-fullscreen-dialog[open] .ds-fs-main{
  flex:1 1 0!important;
  min-height:0!important;
  overflow:hidden!important;
  padding:clamp(6px,1.5dvh,24px) 0!important;
}
.ds-fullscreen-dialog[open] .ds-fs-artwork{
  box-sizing:border-box!important;
  width:min(100%,calc(100dvh - 210px),660px);
  max-height:100%;
  min-height:0;
  aspect-ratio:1/1;
}
.ds-fs-save[hidden],
.ds-fs-save-links[hidden],
.ds-fs-save-links a[hidden]{display:none!important}
.ds-fullscreen-dialog[open] .ds-fs-info{
  min-height:0;
  max-height:100%;
  overflow:hidden;
}
.ds-fullscreen-dialog[open] .ds-fs-close{
  position:relative;
  z-index:20!important;
  flex-shrink:0!important;
  min-width:44px;
  min-height:44px;
  color:#fff!important;
  border-color:rgba(255,255,255,.5)!important;
  background:rgba(24,20,23,.92)!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
.ds-fullscreen-dialog[open] .ds-fs-close:hover,
.ds-fullscreen-dialog[open] .ds-fs-close:focus-visible{
  background:#ff0000!important;
  border-color:#ff0000!important;
}
@media(max-height:760px) and (min-width:761px){
  .ds-fullscreen-dialog[open] .ds-fs-layout{
    padding-top:clamp(12px,2dvh,22px);
    padding-bottom:clamp(10px,1.5dvh,18px);
  }
  .ds-fullscreen-dialog[open] .ds-fs-artwork{
    width:min(100%,calc(100dvh - 148px),540px);
  }
  .ds-fullscreen-dialog[open] .ds-fs-info h2{
    font-size:clamp(35px,5.1vw,73px)!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-info>p{
    margin:8px 0 17px;
    font-size:clamp(14px,1.4vw,21px);
  }
  .ds-fullscreen-dialog[open] .ds-fs-eyebrow{margin-bottom:9px}
  .ds-fullscreen-dialog[open] .ds-fs-controls{padding:10px 0}
  .ds-fullscreen-dialog[open] .ds-fs-save{margin-bottom:10px}
}
@media(max-width:760px){
  .ds-fullscreen-dialog[open]{
    --ds-fs-safe-top:env(safe-area-inset-top,0px);
    --ds-fs-safe-bottom:env(safe-area-inset-bottom,0px);
  }
  .ds-fullscreen-dialog[open] .ds-fs-layout{
    padding:calc(var(--ds-fs-safe-top) + 9px) 16px
      calc(var(--ds-fs-safe-bottom) + 8px)!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-header{
    position:relative!important;
    z-index:30!important;
    height:46px;
    min-height:46px;
    gap:8px;
  }
  .ds-fullscreen-dialog[open] .ds-fs-header>img{
    width:108px;
    max-height:45px;
  }
  .ds-fullscreen-dialog[open] .ds-fs-close{
    margin-left:auto;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    flex:0 0 44px!important;
    font-size:31px!important;
    display:grid!important;
    place-items:center!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-main{
    display:flex!important;
    flex-direction:column-reverse!important;
    justify-content:center;
    align-items:stretch!important;
    gap:clamp(6px,1.25dvh,13px)!important;
    padding:4px 0!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-artwork{
    align-self:center!important;
    flex:0 1 auto!important;
    width:min(100%,33dvh,310px)!important;
    max-height:min(33dvh,310px)!important;
    margin:0 auto!important;
    border-radius:10px;
  }
  .ds-fullscreen-dialog[open] .ds-fs-info{
    flex:0 1 auto!important;
    width:100%;
    max-height:62%;
  }
  .ds-fullscreen-dialog[open] .ds-fs-eyebrow{
    font-size:10px;
    margin:0 0 7px;
  }
  .ds-fullscreen-dialog[open] .ds-fs-info h2{
    font-size:clamp(27px,min(9.8vw,6.6dvh),58px)!important;
    line-height:.94!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-info>p{
    font-size:clamp(13px,3.8vw,18px)!important;
    line-height:1.25;
    margin:7px 0 12px!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-save{margin:0 0 10px}
  .ds-fullscreen-dialog[open] .ds-fs-save>button{
    font-size:10px;
    padding:10px 13px;
  }
  .ds-fullscreen-dialog[open] .ds-fs-save-links a{padding:9px 11px}
  .ds-fullscreen-dialog[open] .ds-fs-controls{
    gap:10px;
    flex-wrap:nowrap;
    padding:9px 0 0;
  }
  .ds-fullscreen-dialog[open] .ds-fs-play{
    flex:0 0 48px;
    width:48px;height:48px;
  }
  .ds-fullscreen-dialog[open] .ds-fs-play svg{width:25px;height:25px}
  .ds-fullscreen-dialog[open] .ds-fs-playback{
    min-width:0;
    font-size:10px;
    overflow-wrap:anywhere;
  }
  .ds-fullscreen-dialog[open] .ds-fs-footer{display:none!important}
}
/* PWA iPhones can report a zero safe-area inset in standalone mode.
   Reserve the physical status bar so the fullscreen close X is never behind it. */
@media(max-width:760px){
  html.md-pwa-standalone.md-pwa-ios .ds-fullscreen-dialog[open]{
    --ds-fs-safe-top:max(env(safe-area-inset-top,0px),44px);
  }
}
@media(max-width:760px) and (max-height:690px){
  .ds-fullscreen-dialog[open] .ds-fs-artwork{
    width:min(100%,27dvh,225px)!important;
    max-height:min(27dvh,225px)!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-info{max-height:68%}
  .ds-fullscreen-dialog[open] .ds-fs-info>p{margin:5px 0 9px!important}
  .ds-fullscreen-dialog[open] .ds-fs-eyebrow{margin-bottom:5px}
}
@media(max-width:760px) and (max-height:550px){
  .ds-fullscreen-dialog[open] .ds-fs-artwork{
    width:min(100%,23dvh,160px)!important;
    max-height:min(23dvh,160px)!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-info h2{
    font-size:clamp(23px,min(8.2vw,6dvh),38px)!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-play{
    flex-basis:40px;
    width:40px;height:40px;
  }
  .ds-fullscreen-dialog[open] .ds-fs-controls{padding-top:5px}
}
/* Phone landscape: keep the photo and metadata side by side in short viewports. */
@media(orientation:landscape) and (max-height:500px){
  .ds-fullscreen-dialog[open] .ds-fs-layout{
    padding-top:calc(env(safe-area-inset-top,0px) + 6px)!important;
    padding-bottom:calc(env(safe-area-inset-bottom,0px) + 6px)!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-header{
    height:38px!important;
    min-height:38px!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-header>img{width:90px}
  .ds-fullscreen-dialog[open] .ds-fs-close{
    flex:0 0 38px!important;
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-main{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,.7fr)!important;
    grid-template-rows:minmax(0,1fr);
    gap:clamp(10px,3vw,28px)!important;
    align-items:center!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-info{
    grid-column:1;
    grid-row:1;
    width:100%!important;
    max-height:100%!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-artwork{
    grid-column:2;
    grid-row:1;
    width:min(100%,calc(100dvh - 105px),330px)!important;
    max-height:min(100%,calc(100dvh - 105px))!important;
    justify-self:center;
  }
  .ds-fullscreen-dialog[open] .ds-fs-info h2{
    font-size:clamp(27px,5.3dvh,52px)!important;
  }
  .ds-fullscreen-dialog[open] .ds-fs-info>p{margin:5px 0 8px!important;font-size:13px!important}
  .ds-fullscreen-dialog[open] .ds-fs-eyebrow{margin-bottom:5px}
  .ds-fullscreen-dialog[open] .ds-fs-controls{padding:5px 0 0}
  .ds-fullscreen-dialog[open] .ds-fs-save{margin-bottom:5px}
  .ds-fullscreen-dialog[open] .ds-fs-footer{display:none!important}
}


/* AUDIO-REACTIVE ABSTRACT RIBBON BACKDROP — live analyser drives a soft,
   flowing silk waveform, styled after the supplied reference video in red.
   The artwork and metadata remain above the animation; no VU bars or labels. */
.ds-fullscreen-dialog[open] .ds-fs-backdrop{
  background:
    radial-gradient(ellipse at 52% 52%,rgba(110,3,19,.25) 0%,transparent 57%),
    radial-gradient(ellipse at 86% 78%,rgba(155,0,19,.18),transparent 52%),
    linear-gradient(110deg,#080307 0%,#120208 45%,#090207 100%)!important;
}
.ds-fullscreen-dialog[open] .ds-fs-backdrop::before{
  background:
    radial-gradient(ellipse at 55% 51%,rgba(255,30,53,.12),transparent 55%),
    linear-gradient(0deg,rgba(0,0,0,.45),transparent 30%,transparent 72%,rgba(0,0,0,.27))!important;
  opacity:1;
  mask-image:none;
}
.ds-fs-audio-canvas{
  display:block!important;
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:.97;
  pointer-events:none;
  mix-blend-mode:screen;
  mask-image:linear-gradient(90deg,rgba(0,0,0,.56),#000 30%,#000 83%,rgba(0,0,0,.84));
  -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.56),#000 30%,#000 83%,rgba(0,0,0,.84));
}
.ds-fullscreen-dialog[open] .ds-fs-info{
  isolation:isolate;
}
.ds-fullscreen-dialog[open] .ds-fs-info h2,
.ds-fullscreen-dialog[open] .ds-fs-info>p{
  text-shadow:0 3px 22px rgba(0,0,0,.82),0 9px 48px rgba(0,0,0,.7)!important;
}
@media(max-width:760px){
  .ds-fs-audio-canvas{
    opacity:.72;
    mask-image:linear-gradient(0deg,rgba(0,0,0,.5),#000 35%,#000 70%,rgba(0,0,0,.45));
    -webkit-mask-image:linear-gradient(0deg,rgba(0,0,0,.5),#000 35%,#000 70%,rgba(0,0,0,.45));
  }
}