:root{
  --navy:#020735; --deep:#06135f; --blue:#1677ff; --cyan:#3fe9ff; --aqua:#90fff1; --violet:#6a39ff; --lav:#c8c4ff; --white:#ffffff; --soft:rgba(255,255,255,.78); --glass:rgba(255,255,255,.105); --stroke:rgba(255,255,255,.18);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Arial,sans-serif;background:radial-gradient(circle at 22% 24%,rgba(26,120,255,.62),transparent 30%),radial-gradient(circle at 78% 78%,rgba(56,232,255,.42),transparent 28%),linear-gradient(145deg,#02041f 0%,#050e4f 45%,#060320 100%);color:var(--white);overscroll-behavior:none;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;background:url('assets/omnivibe-icon.jpg') center/cover no-repeat;opacity:.06;filter:blur(1px);transform:scale(1.04);pointer-events:none} 
.bg-orb{position:fixed;border-radius:999px;filter:blur(28px);opacity:.5;pointer-events:none}.orb-one{width:250px;height:250px;left:-90px;top:120px;background:var(--blue)}.orb-two{width:320px;height:320px;right:-130px;bottom:110px;background:var(--cyan)}
.app-shell{position:relative;z-index:1;max-width:780px;margin:0 auto;padding:calc(10px + env(safe-area-inset-top)) 18px calc(28px + env(safe-area-inset-bottom))}
.topbar{min-height:76px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:10}.brand-mini{display:flex;align-items:center;gap:12px;letter-spacing:.18em;position:relative;z-index:11}.brand-mini img{width:42px;height:42px;border-radius:14px;box-shadow:0 0 24px rgba(63,233,255,.35);display:block;object-fit:cover;opacity:1;visibility:visible}.brand-mini strong{display:block;font-size:13px}.brand-mini span{display:block;font-size:10px;color:var(--aqua);margin-top:2px}.menu-button{position:relative;z-index:12;width:46px;height:46px;border:1px solid var(--stroke);border-radius:16px;background:rgba(255,255,255,.08);display:grid;place-content:center;gap:5px}.menu-button span{display:block;width:20px;height:2px;background:#fff;border-radius:10px}
.glass{background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.07));border:1px solid var(--stroke);box-shadow:0 24px 80px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.hero-card{border-radius:34px;padding:22px 18px 20px;text-align:center}.hero-logo{width:min(76vw,420px);border-radius:28px;box-shadow:0 28px 80px rgba(0,0,0,.42);display:block;margin:0 auto 22px}.eyebrow{margin:0;color:var(--aqua);text-transform:uppercase;letter-spacing:.24em;font-size:12px;font-weight:800}.hero-card h1{font-size:clamp(36px,9vw,68px);line-height:.92;margin:10px 0;background:linear-gradient(90deg,#fff,var(--aqua),#8b74ff);-webkit-background-clip:text;background-clip:text;color:transparent}.tagline{margin:0 auto 18px;color:var(--soft);max-width:460px;line-height:1.45}
.now-card{display:flex;align-items:center;text-align:left;gap:13px;margin:18px 0;padding:15px;border-radius:22px;background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.12)}.live-dot{width:12px;height:12px;border-radius:999px;background:#5dffda;box-shadow:0 0 0 8px rgba(93,255,218,.12),0 0 22px #5dffda;flex:0 0 auto}.now-card small{display:block;color:var(--lav);font-size:11px;text-transform:uppercase;letter-spacing:.13em}.track-title{font-weight:800;margin-top:4px}.artist-name{color:var(--soft);font-size:14px;margin-top:2px}
.player-panel{display:flex;align-items:center;gap:15px;text-align:left;padding:14px;border-radius:26px;background:linear-gradient(135deg,rgba(22,119,255,.35),rgba(106,57,255,.24));border:1px solid rgba(144,255,241,.23)}.play-button{width:68px;height:68px;border:0;border-radius:24px;color:#050b31;font-size:28px;font-weight:900;background:linear-gradient(135deg,var(--aqua),#35a2ff 52%,#7c61ff);box-shadow:0 14px 35px rgba(63,233,255,.28)}.player-copy strong,.player-copy span{display:block}.player-copy span{color:var(--soft);margin-top:4px;font-size:14px}
.side-menu{position:fixed;z-index:5;right:0;top:0;width:min(86vw,360px);height:100dvh;padding:calc(18px + env(safe-area-inset-top)) 18px 18px;background:rgba(2,7,53,.88);border-left:1px solid var(--stroke);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);transform:translateX(104%);transition:.28s ease;box-shadow:-30px 0 80px rgba(0,0,0,.45)}.side-menu.open{transform:none}.menu-head{display:flex;align-items:center;gap:12px}.menu-head img{width:48px;height:48px;border-radius:16px}.menu-head strong,.menu-head span{display:block}.menu-head span{color:var(--aqua);font-size:13px}#closeMenu{margin-left:auto;width:42px;height:42px;border-radius:14px;border:1px solid var(--stroke);background:rgba(255,255,255,.08);color:white;font-size:28px}.menu-section{margin-top:26px;padding:18px;border-radius:22px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.11)}.menu-section h2{margin:0 0 10px;font-size:14px;letter-spacing:.16em}.menu-section p{margin:8px 0 0;color:var(--soft);line-height:1.45}.menu-section a{color:white;text-decoration:none}.history-card{border-radius:26px;padding:18px;margin-top:16px;text-align:left}.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px}.eyebrow.small{font-size:10px;letter-spacing:.18em;margin:0 0 4px}.history-card h2{margin:0;font-size:20px;letter-spacing:.08em}.refresh-button{border:1px solid rgba(144,255,241,.25);border-radius:16px;background:rgba(255,255,255,.08);color:white;padding:10px 12px;font-weight:800}.recent-list{display:grid;gap:10px}.recent-track{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border-radius:18px;background:rgba(0,0,0,.20);border:1px solid rgba(255,255,255,.10)}.recent-track strong{display:block;font-size:15px}.recent-track span{display:block;color:var(--soft);font-size:13px;margin-top:3px}.recent-track time{color:var(--aqua);font-size:12px;white-space:nowrap}.empty-note{margin:0;color:var(--soft);line-height:1.45}.scrim{position:fixed;inset:0;z-index:4;background:rgba(0,0,0,.42);opacity:0;pointer-events:none;transition:.25s}.scrim.show{opacity:1;pointer-events:auto}
@media(min-width:720px){.hero-card{padding:30px}.history-card{padding:22px}}

.menu-link-button{width:100%;border:1px solid rgba(144,255,241,.25);border-radius:18px;background:linear-gradient(135deg,rgba(22,119,255,.25),rgba(106,57,255,.18));color:white;padding:14px 15px;margin-top:10px;text-align:left;font-weight:900;letter-spacing:.08em}
.content-panel{position:fixed;z-index:7;inset:0;background:linear-gradient(145deg,#02041f 0%,#050e4f 48%,#060320 100%);transform:translateX(104%);transition:.28s ease;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top)}
.content-panel.open{transform:none}
.content-panel-head{height:72px;display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid var(--stroke);background:rgba(2,7,53,.78);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.content-panel-head button{width:44px;height:44px;border-radius:15px;border:1px solid var(--stroke);background:rgba(255,255,255,.08);color:white;font-size:30px;line-height:1}
.content-panel-head div{flex:1}.content-panel-head small{display:block;color:var(--aqua);font-size:10px;letter-spacing:.18em}.content-panel-head strong{display:block;margin-top:3px;letter-spacing:.08em}
#contentFrame{flex:1;width:100%;border:0;background:#020735}

.content-body{flex:1;overflow:auto;padding:18px;background:radial-gradient(circle at 25% 20%,rgba(22,119,255,.28),transparent 35%),radial-gradient(circle at 78% 74%,rgba(63,233,255,.20),transparent 30%)}
.native-section{max-width:760px;margin:0 auto;padding:20px;border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.07));border:1px solid var(--stroke);box-shadow:0 24px 80px rgba(0,0,0,.28);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.native-section h2{font-size:30px;margin:6px 0 10px;letter-spacing:.04em}.native-section>p:not(.eyebrow){color:var(--soft);line-height:1.45;margin:0 0 18px}.native-list{display:grid;gap:14px}.content-card,.episode-row{width:100%;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:rgba(0,0,0,.20);color:white;text-align:left;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.content-card{display:grid;grid-template-columns:86px 1fr;gap:14px;align-items:center;padding:14px}.content-card img{width:86px;height:86px;border-radius:22px;object-fit:cover}.content-card strong,.episode-row strong{display:block;font-size:20px;line-height:1.12}.content-card span,.episode-row span{display:block;color:var(--aqua);margin-top:6px;font-size:14px}.content-card p,.episode-row p{color:var(--soft);line-height:1.35;margin:8px 0 0;max-height:4.1em;overflow:hidden}
.episode-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px}.episode-row button{border:0;border-radius:999px;background:linear-gradient(135deg,var(--aqua),#35a2ff 55%,#7c61ff);color:#050b31;font-weight:900;padding:12px 18px;min-width:76px}.soft-back{border:1px solid rgba(144,255,241,.25);border-radius:999px;background:rgba(255,255,255,.08);color:white;padding:11px 16px;margin:4px 0 18px;font-weight:800}.content-audio{display:none;position:sticky;bottom:0;width:100%;padding:12px 18px;background:rgba(2,7,53,.92);border-top:1px solid var(--stroke)}
@media(max-width:430px){.content-card{grid-template-columns:70px 1fr}.content-card img{width:70px;height:70px;border-radius:18px}.native-section{padding:16px}.native-section h2{font-size:25px}.content-card strong,.episode-row strong{font-size:17px}.episode-row{padding:14px}.episode-row button{padding:10px 14px;min-width:66px}}

.content-audio{display:none!important}
.mini-player{position:sticky;bottom:0;z-index:8;margin:0 12px calc(10px + env(safe-area-inset-bottom));padding:12px;display:none;align-items:center;gap:12px;border:1px solid rgba(144,255,241,.22);border-radius:24px;background:linear-gradient(135deg,rgba(10,19,91,.94),rgba(35,48,126,.92));box-shadow:0 -18px 60px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.mini-player.show{display:flex}.mini-play{width:50px;height:50px;flex:0 0 auto;border:0;border-radius:18px;background:linear-gradient(135deg,var(--aqua),#35a2ff 55%,#7c61ff);color:#050b31;font-size:19px;font-weight:950;box-shadow:0 12px 26px rgba(63,233,255,.22)}
.mini-meta{min-width:0;flex:1}.mini-meta small{display:block;color:var(--aqua);font-size:9px;letter-spacing:.18em;font-weight:900}.mini-meta strong{display:block;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px;line-height:1.2}.mini-meta span{display:block;color:var(--soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;margin-top:2px}.mini-progress{height:5px;margin-top:8px;border-radius:999px;background:rgba(255,255,255,.15);overflow:hidden}.mini-progress span{display:block;height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,var(--aqua),#35a2ff,#7c61ff)}.mini-time{color:var(--soft);font-size:11px;white-space:nowrap;min-width:44px;text-align:right}.episode-row button.is-playing{background:linear-gradient(135deg,#ffffff,var(--aqua),#35a2ff)}
.content-body{padding-bottom:18px}
@media(max-width:430px){.mini-player{margin-left:10px;margin-right:10px;padding:10px;border-radius:20px}.mini-play{width:44px;height:44px;border-radius:15px}.mini-time{display:none}.mini-meta strong{font-size:14px}}

/* OMNIVIBE LIVE v11: OMNI ON DEMAND channel cards */
.channel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:6px}
.channel-card{position:relative;min-height:152px;border:1px solid rgba(255,255,255,.20);border-radius:26px;overflow:hidden;background-size:cover;background-position:center;color:#fff;text-align:left;padding:18px;box-shadow:0 22px 60px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.18);isolation:isolate;cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.channel-card::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02)),radial-gradient(circle at 15% 5%,rgba(255,255,255,.25),transparent 28%);z-index:-1}
.channel-card::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,.03));z-index:-1}
.channel-card:hover,.channel-card:focus-visible{transform:translateY(-2px);border-color:rgba(144,255,241,.45);box-shadow:0 28px 72px rgba(0,0,0,.42),0 0 32px rgba(63,233,255,.14),inset 0 1px 0 rgba(255,255,255,.20)}
.channel-card span{position:absolute;left:18px;bottom:38px;display:block;font-size:25px;font-weight:950;letter-spacing:.04em;text-shadow:0 3px 18px rgba(0,0,0,.6)}
.channel-card small{position:absolute;left:18px;bottom:17px;color:rgba(255,255,255,.82);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:10px;text-shadow:0 2px 10px rgba(0,0,0,.65)}
.channel-card-all{background:linear-gradient(135deg,rgba(10,19,91,.95),rgba(29,42,112,.78)),radial-gradient(circle at 80% 20%,rgba(63,233,255,.28),transparent 35%)}
.channel-section{max-width:860px}.channel-hero{min-height:190px;border-radius:28px;padding:24px;margin:-2px 0 18px;background-size:cover;background-position:center;display:flex;flex-direction:column;justify-content:flex-end;border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 20px 54px rgba(0,0,0,.28)}
.channel-hero h2{font-size:36px;margin:3px 0 2px;text-shadow:0 4px 22px rgba(0,0,0,.5)}.channel-hero span{color:var(--aqua);font-weight:900;letter-spacing:.08em;text-transform:uppercase;font-size:11px}.song-search{display:block;margin:0 0 16px}.song-search span{display:block;color:var(--aqua);font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;margin:0 0 8px 4px}.song-search input{width:100%;border:1px solid rgba(255,255,255,.14);border-radius:18px;background:rgba(0,0,0,.22);color:white;padding:14px 16px;font:inherit;outline:none}.song-search input:focus{border-color:rgba(144,255,241,.45);box-shadow:0 0 0 4px rgba(63,233,255,.10)}.song-row span{color:var(--soft)}
@media(max-width:620px){.channel-grid{grid-template-columns:1fr}.channel-card{min-height:146px}.channel-card span{font-size:23px}.channel-hero{min-height:160px}.channel-hero h2{font-size:30px}}


/* v11.0.1 polish: let the artwork speak, and reset channel home cleanly */
.channel-card{background-image:var(--card-art);background-size:cover;background-position:center;min-height:154px;padding:0}
.channel-card:not(.channel-card-all) span,.channel-card:not(.channel-card-all) small{display:none!important}
.channel-card::after{background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.08));}
.channel-card-all{padding:18px;min-height:154px}
.channel-hero{background-size:cover;background-position:center;min-height:214px;padding:0;display:block}
.channel-hero h2,.channel-hero span,.channel-hero p{display:none!important}
@media(max-width:620px){.channel-card{min-height:146px}.channel-hero{min-height:170px}}


/* v11.0.3 local user playlists */
.channel-card-playlists{background:linear-gradient(135deg,rgba(108,38,255,.92),rgba(6,19,95,.88)),radial-gradient(circle at 72% 24%,rgba(63,233,255,.35),transparent 34%);padding:18px;min-height:154px}
.channel-card-playlists span,.channel-card-playlists small{display:block!important}
.song-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.add-song-button{min-width:44px!important;width:44px;height:44px;border-radius:16px!important;padding:0!important;font-size:22px!important;line-height:1!important}
.remove-song-button{font-size:28px!important}
.playlist-create,.playlist-tools button{border:1px solid rgba(144,255,241,.28);border-radius:18px;background:rgba(0,0,0,.24);color:white;font-weight:900;letter-spacing:.04em;padding:13px 16px;margin:0 0 14px;box-shadow:inset 0 1px 0 rgba(255,255,255,.10)}
.playlist-tools{display:flex;gap:10px;margin-bottom:12px}.playlist-tools button{margin:0}.playlist-tools button:last-child{border-color:rgba(255,120,160,.32)}
.playlist-row button{min-width:86px}
@media(max-width:520px){.song-row{align-items:flex-start}.song-actions{width:100%;justify-content:flex-end}.playlist-tools{flex-wrap:wrap}}

/* v11.0.4 glass playlist modals + My Playlists artwork */
.channel-card-playlists{
  background-image:var(--card-art)!important;
  background-size:cover!important;
  background-position:center!important;
  padding:0!important;
  min-height:154px;
}
.channel-card-playlists span,.channel-card-playlists small{display:none!important}
.ovl-modal-shell{position:fixed;inset:0;z-index:99;display:none;align-items:center;justify-content:center;padding:22px;color:#fff}
.ovl-modal-shell.show{display:flex;animation:ovlFadeIn .16s ease both}
.ovl-modal-backdrop{position:absolute;inset:0;background:radial-gradient(circle at 50% 35%,rgba(63,233,255,.18),transparent 36%),rgba(0,3,28,.72);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.ovl-modal-card{position:relative;width:min(520px,94vw);max-height:min(78vh,680px);overflow:auto;border:1px solid rgba(144,255,241,.30);border-radius:30px;background:linear-gradient(145deg,rgba(12,25,95,.88),rgba(27,37,116,.76) 48%,rgba(7,11,54,.90));box-shadow:0 30px 100px rgba(0,0,0,.55),0 0 46px rgba(63,233,255,.16),inset 0 1px 0 rgba(255,255,255,.18);padding:24px;animation:ovlFloatIn .20s ease both}
.ovl-modal-card::before{content:'';position:absolute;inset:0;border-radius:30px;background:radial-gradient(circle at 20% 0%,rgba(255,255,255,.22),transparent 30%),radial-gradient(circle at 90% 15%,rgba(63,233,255,.18),transparent 34%);pointer-events:none}
.ovl-modal-card>*{position:relative}.ovl-modal-x{position:absolute;top:14px;right:14px;z-index:2;width:38px;height:38px;border:1px solid rgba(255,255,255,.18);border-radius:14px;background:rgba(0,0,0,.18);color:#fff;font-size:26px;line-height:1;cursor:pointer}.ovl-modal-kicker{display:block;color:var(--aqua);font-size:10px;font-weight:950;letter-spacing:.18em;text-transform:uppercase}.ovl-modal-card h3{margin:7px 42px 10px 0;font-size:28px;line-height:1.05;letter-spacing:.03em}.ovl-modal-copy{color:rgba(255,255,255,.82);line-height:1.45;margin:0 0 16px}.ovl-modal-copy strong{color:#fff}.ovl-input-label{display:block;color:var(--aqua);font-size:10px;font-weight:950;letter-spacing:.16em;text-transform:uppercase;margin:12px 0 8px}.ovl-text-input{width:100%;border:1px solid rgba(144,255,241,.26);border-radius:18px;background:rgba(0,0,0,.22);color:#fff;font:inherit;font-weight:800;padding:14px 16px;outline:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}.ovl-text-input:focus{border-color:rgba(144,255,241,.62);box-shadow:0 0 0 4px rgba(63,233,255,.11),inset 0 1px 0 rgba(255,255,255,.12)}.ovl-playlist-choices{display:grid;gap:10px;margin:12px 0 14px}.ovl-playlist-choice{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;border:1px solid rgba(255,255,255,.13);border-radius:18px;background:rgba(0,0,0,.20);color:#fff;padding:13px 14px;text-align:left;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}.ovl-playlist-choice:hover,.ovl-playlist-choice:focus-visible{border-color:rgba(144,255,241,.48);background:rgba(63,233,255,.10)}.ovl-playlist-choice strong{font-size:16px}.ovl-playlist-choice span{color:var(--aqua);font-size:12px;font-weight:800}.ovl-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.ovl-modal-actions button{border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.08);color:#fff;font-weight:950;padding:12px 18px;cursor:pointer}.ovl-modal-actions button.primary{border:0;background:linear-gradient(135deg,var(--aqua),#35a2ff 55%,#7c61ff);color:#061042}.ovl-modal-actions button.danger{border-color:rgba(255,120,160,.42);background:linear-gradient(135deg,rgba(255,84,136,.96),rgba(124,97,255,.88));color:#fff}@keyframes ovlFadeIn{from{opacity:0}to{opacity:1}}@keyframes ovlFloatIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}@media(max-width:520px){.ovl-modal-card{border-radius:24px;padding:20px}.ovl-modal-card h3{font-size:24px}.ovl-modal-actions{flex-wrap:wrap}.ovl-modal-actions button{flex:1 1 auto}}


/* v11.0.5 mobile channel layout fix */
.content-panel,.content-body{overflow-x:hidden;}
.native-section{width:100%;max-width:min(860px,100%);overflow:hidden;}
.channel-section{width:100%;max-width:min(860px,100%);}
.song-row{max-width:100%;min-width:0;}
.song-row>div:first-child{min-width:0;overflow:hidden;}
.song-row strong{overflow-wrap:anywhere;word-break:normal;}
.song-actions{min-width:max-content;}
@media(max-width:620px){
  .content-body{padding:14px 12px 18px;}
  .native-section{padding:14px;border-radius:24px;}
  .channel-hero{width:100%;min-height:auto;aspect-ratio:16/9;border-radius:22px;background-size:cover;background-position:center;}
  .song-search input{font-size:16px;}
  .song-row.episode-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px;border-radius:22px;width:100%;}
  .song-row .song-actions{width:auto;justify-content:flex-end;gap:8px;flex-wrap:nowrap;}
  .song-row .song-actions button{min-width:64px;padding:10px 14px;}
  .song-row .add-song-button{min-width:42px!important;width:42px;height:42px;flex:0 0 42px;}
}
@media(max-width:380px){
  .content-body{padding-left:10px;padding-right:10px;}
  .native-section{padding:12px;}
  .song-row.episode-row{grid-template-columns:1fr;align-items:stretch;}
  .song-row .song-actions{justify-content:flex-start;width:100%;}
  .song-row .song-actions button:first-child{flex:1 1 auto;}
}

.menu-destinations{margin-top:24px;display:flex;flex-direction:column;gap:14px}
.destination-card{width:100%;border:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.06));border-radius:24px;overflow:hidden;min-height:112px;color:#fff;text-align:left;position:relative;padding:0;backdrop-filter:blur(20px);box-shadow:0 18px 46px rgba(0,0,0,.22)}
.destination-card:active{transform:scale(.98)}
.destination-card img{display:block;width:100%;height:132px;object-fit:cover}
.image-destination-card{min-height:132px}
.destination-title{font-weight:800;letter-spacing:.14em}
.destination-sub{opacity:.8;margin-top:6px;font-size:13px}
.podcasts-card,.ondemand-card,.playlists-card{background:linear-gradient(135deg,rgba(22,119,255,.20),rgba(63,233,255,.10))}
.playlists-card{min-height:132px}
.side-menu{width:min(82vw,340px)}


/* v11.14.01 artwork stability + channel playback controls */
.channel-card,
.channel-hero{
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:0 20px 54px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.12)!important;
  transform:translateZ(0);
}
.channel-card{aspect-ratio:16/6;min-height:auto!important;}
.channel-hero{aspect-ratio:16/9;min-height:auto!important;}
.channel-card::before,
.channel-card::after{pointer-events:none;}
.channel-controls{display:flex;gap:10px;margin:0 0 16px;flex-wrap:wrap;}
.channel-controls button{border:1px solid rgba(144,255,241,.28);border-radius:18px;background:linear-gradient(135deg,rgba(63,233,255,.18),rgba(124,97,255,.18));color:white;font-weight:950;letter-spacing:.04em;padding:12px 16px;box-shadow:inset 0 1px 0 rgba(255,255,255,.10);}
.channel-controls button:disabled{opacity:.45;cursor:not-allowed;}
@media(max-width:620px){
  .channel-card{aspect-ratio:16/6;}
  .channel-hero{aspect-ratio:16/9;}
  .channel-controls button{flex:1 1 130px;}
}

/* v11.14.01 premium channel artwork pass */
.channel-card,
.channel-card-playlists,
.channel-hero,
.destination-card.image-destination-card{
  aspect-ratio: 16 / 6 !important;
  min-height: auto !important;
  border: 0 !important;
  outline: 1px solid rgba(255,255,255,.10) !important;
  outline-offset: -1px !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  background-size: cover !important;
  background-position: 50% 50% !important;
  background-repeat: no-repeat !important;
  background-clip: padding-box !important;
  box-shadow:
    0 18px 46px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -1px 0 rgba(255,255,255,.06) !important;
  transform: translate3d(0,0,0);
  -webkit-transform: translate3d(0,0,0);
}
.channel-card::before,
.channel-card::after,
.channel-hero::before,
.channel-hero::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
}
.channel-card::before,
.channel-hero::before{
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 48%,rgba(0,0,0,.10));
  z-index:1;
}
.channel-card::after,
.channel-hero::after{
  box-shadow:inset 0 0 0 1px rgba(144,255,241,.06);
  z-index:2;
}
.channel-card:hover,.channel-card:focus-visible{
  transform:translateY(-2px) translate3d(0,0,0);
  outline-color:rgba(144,255,241,.30)!important;
  box-shadow:0 24px 60px rgba(0,0,0,.38),0 0 28px rgba(63,233,255,.12),inset 0 1px 0 rgba(255,255,255,.16)!important;
}
.destination-card.image-destination-card img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
}
.channel-section .channel-hero{
  width:100%!important;
  margin:0 0 18px!important;
}
@media(max-width:620px){
  .channel-card,
  .channel-card-playlists,
  .channel-hero,
  .destination-card.image-destination-card{border-radius:22px!important;aspect-ratio:16/6!important;}
}

/* v11.14.01 page positioning + smoother navigation */
.content-body{
  scroll-behavior:auto;
  will-change:opacity,transform;
}
.content-body.page-enter .native-section{
  animation:ovlPageFadeIn .24s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes ovlPageFadeIn{
  from{opacity:0;transform:translateY(10px) scale(.992);filter:blur(2px)}
  to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
}
.content-panel.open{
  animation:ovlPanelSoftIn .22s ease both;
}
@keyframes ovlPanelSoftIn{
  from{opacity:.72}
  to{opacity:1}
}
@media (prefers-reduced-motion: reduce){
  .content-body.page-enter .native-section,.content-panel.open{animation:none!important}
}

/* v11.14.01 OMNIVERSE + playlist controls + favorites */
.channel-card-omniverse,
.channel-hero[data-omniverse="true"]{
  background:
    radial-gradient(circle at 18% 18%,rgba(144,255,241,.46),transparent 26%),
    radial-gradient(circle at 82% 24%,rgba(124,97,255,.56),transparent 30%),
    radial-gradient(circle at 50% 88%,rgba(22,119,255,.42),transparent 34%),
    linear-gradient(135deg,rgba(2,7,53,.98),rgba(8,18,91,.96) 45%,rgba(8,5,43,.98))!important;
}
.channel-card-omniverse::before,
.channel-hero[data-omniverse="true"]::before{
  background:
    linear-gradient(120deg,rgba(255,255,255,.10),rgba(255,255,255,0) 42%),
    repeating-radial-gradient(circle at 72% 26%,rgba(255,255,255,.24) 0 1px,transparent 1px 18px)!important;
  opacity:.88;
}
.channel-card-omniverse span,
.channel-card-omniverse small{display:block!important;z-index:3;}
.channel-card-omniverse span{font-size:24px;letter-spacing:.10em;}
.channel-card-omniverse small{color:rgba(144,255,241,.92);}
.playlist-controls{margin-top:0;}
.recent-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.recent-heart{width:38px;height:38px;border:1px solid rgba(144,255,241,.22);border-radius:999px;background:rgba(255,255,255,.08);color:#fff;font-size:22px;font-weight:950;line-height:1;display:grid;place-items:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.10);}
.recent-heart.is-favorite{background:linear-gradient(135deg,rgba(255,87,141,.95),rgba(124,97,255,.88));border-color:rgba(255,255,255,.22);color:#fff;}
.recent-heart:active{transform:scale(.96);}
@media(max-width:520px){
  .recent-track{align-items:flex-start;}
  .recent-actions{flex-direction:column;align-items:flex-end;gap:6px;}
  .recent-heart{width:34px;height:34px;font-size:20px;}
}


/* v11.14.01 Android PWA scroll stability + stationary home */
html{
  height:100%;
  overflow-x:hidden;
}
body{
  min-height:100%;
  overflow-x:hidden;
  touch-action:pan-y;
}
.app-shell{
  min-height:100dvh;
}
main{
  min-height:calc(100dvh - 100px - env(safe-area-inset-top));
  display:flex;
  align-items:center;
}
.hero-card{
  width:100%;
}
.side-menu{
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
.menu-recent{
  margin-top:18px;
  margin-bottom:calc(22px + env(safe-area-inset-bottom));
}
.menu-recent .recent-track{
  padding:11px 12px;
}
.menu-recent .recent-track strong{
  font-size:14px;
}
.content-panel{
  height:100dvh;
  max-height:100dvh;
}
.content-body{
  min-height:0;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding-bottom:calc(96px + env(safe-area-inset-bottom));
}
@supports(height:100svh){
  .app-shell{min-height:100svh;}
  main{min-height:calc(100svh - 100px - env(safe-area-inset-top));}
  .side-menu,.content-panel{height:100svh;max-height:100svh;}
}
@media(max-height:760px){
  main{align-items:flex-start;}
  .hero-card{margin-bottom:18px;}
  .hero-logo{width:min(56vw,320px);}
}


/* v11.14.03 no-nav full-screen shell fix
   Keeps the original home layout, removes the bottom-nav experiment,
   and paints the iOS/Android safe-area so no white strip appears. */
html{
  min-height:100%;
  min-height:100dvh;
  background:#020735;
}
body{
  min-height:100%;
  min-height:100dvh;
  background-color:#020735;
}
body::after{
  content:"";
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  height:calc(64px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(2,7,53,0),rgba(2,7,53,.94) 52%,#020735);
  pointer-events:none;
  z-index:0;
}
.app-shell{
  min-height:100dvh;
  padding-bottom:calc(28px + env(safe-area-inset-bottom));
}
main{
  min-height:calc(100dvh - 100px - env(safe-area-inset-top));
}
.hero-card{
  position:relative;
  z-index:1;
}
@supports(height:100svh){
  html,body,.app-shell{min-height:100svh;}
  main{min-height:calc(100svh - 100px - env(safe-area-inset-top));}
}
@supports(-webkit-touch-callout:none){
  html,body{min-height:-webkit-fill-available;}
  .app-shell{min-height:-webkit-fill-available;}
}


/* v11.14.05 iOS Home Screen PWA viewport/safe-area fix
   Uses the live visual viewport so the menu and panels fill the actual device screen. */
:root{
  --ovl-vh:100dvh;
  --ovl-bottom-safe:env(safe-area-inset-bottom, 0px);
  --ovl-top-safe:env(safe-area-inset-top, 0px);
}
html,
body{
  width:100%;
  height:var(--ovl-vh);
  min-height:var(--ovl-vh);
  background:#020735 !important;
  overflow-x:hidden;
}
body{
  position:relative;
  margin:0;
}
body.menu-is-open{
  overflow:hidden;
  height:var(--ovl-vh);
}
body::after{
  display:none !important;
}
.app-shell{
  min-height:var(--ovl-vh) !important;
  box-sizing:border-box;
  background:radial-gradient(circle at 22% 24%,rgba(26,120,255,.62),transparent 30%),radial-gradient(circle at 78% 78%,rgba(56,232,255,.42),transparent 28%),linear-gradient(145deg,#02041f 0%,#050e4f 45%,#060320 100%);
}
.scrim{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:0;
  height:var(--ovl-vh) !important;
  min-height:var(--ovl-vh) !important;
}
.side-menu{
  position:fixed !important;
  top:0 !important;
  right:0 !important;
  bottom:auto !important;
  left:auto !important;
  height:var(--ovl-vh) !important;
  min-height:var(--ovl-vh) !important;
  max-height:var(--ovl-vh) !important;
  box-sizing:border-box;
  padding-top:calc(18px + var(--ovl-top-safe));
  padding-bottom:calc(22px + var(--ovl-bottom-safe));
  background:linear-gradient(180deg,rgba(2,7,53,.96),rgba(2,7,53,.98) 72%,#020735 100%) !important;
}
.content-panel{
  height:var(--ovl-vh) !important;
  min-height:var(--ovl-vh) !important;
  max-height:var(--ovl-vh) !important;
  box-sizing:border-box;
  padding-top:var(--ovl-top-safe);
  background:linear-gradient(145deg,#02041f 0%,#050e4f 48%,#060320 100%) !important;
}
.content-body{
  padding-bottom:calc(110px + var(--ovl-bottom-safe)) !important;
}
@supports(-webkit-touch-callout:none){
  .side-menu,
  .content-panel,
  .scrim,
  .app-shell{
    height:var(--ovl-vh) !important;
  }
}

/* v11.14.05: Recently Played moved from the menu feed into its own app page */
.recent-destination-card{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  min-height:112px;
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(144,255,241,.18);
  background:
    radial-gradient(circle at 18% 35%, rgba(144,255,241,.34), transparent 28%),
    radial-gradient(circle at 80% 20%, rgba(124,97,255,.44), transparent 35%),
    linear-gradient(135deg, rgba(10,25,107,.92), rgba(2,7,53,.96));
  color:#fff;
  box-shadow:0 18px 46px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.16);
}
.recent-destination-card strong{
  position:relative;
  z-index:2;
  font-size:clamp(20px, 4.6vw, 24px);
  letter-spacing:.08em;
  text-shadow:0 3px 8px rgba(0,0,0,.35);
}
.recent-destination-card small{
  position:relative;
  z-index:2;
  margin-top:8px;
  color:rgba(210,255,251,.86);
  font-size:12px;
  letter-spacing:.16em;
}
.recent-card-orb{
  position:absolute;
  left:22px;
  width:62px;
  height:62px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--aqua),#4b6bff 70%);
  opacity:.55;
  filter:blur(.2px);
}
.recent-card-wave{
  position:absolute;
  inset:auto 0 0 0;
  height:42px;
  opacity:.28;
  background:repeating-linear-gradient(90deg, transparent 0 11px, rgba(144,255,241,.65) 11px 15px, transparent 15px 26px);
  mask-image:linear-gradient(to top, #000, transparent);
  -webkit-mask-image:linear-gradient(to top, #000, transparent);
}
.recently-page .recent-list{
  margin-top:18px;
}
.recent-page-list .recent-track{
  background:rgba(2,7,53,.52);
}


/* v11.14.10 recent card font polish */
.recent-destination-card strong{
  font-size:clamp(20px, 4.6vw, 24px) !important;
  letter-spacing:.08em !important;
  white-space:nowrap;
}
.recent-destination-card small{
  font-size:11px !important;
  letter-spacing:.15em !important;
  white-space:nowrap;
}
.recently-page > p:not(.eyebrow):not(.empty-note){
  display:none !important;
}


/* v11.14.10 About page and menu card */
.about-destination-card{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  min-height:112px;
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(144,255,241,.18);
  background:
    radial-gradient(circle at 20% 30%, rgba(144,255,241,.26), transparent 28%),
    radial-gradient(circle at 82% 24%, rgba(45,121,255,.38), transparent 34%),
    linear-gradient(135deg, rgba(5,18,82,.94), rgba(2,7,53,.98));
  color:#fff;
  box-shadow:0 18px 46px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.16);
}
.about-destination-card strong{
  position:relative;
  z-index:2;
  font-size:clamp(20px, 4.6vw, 24px);
  letter-spacing:.08em;
  text-shadow:0 3px 8px rgba(0,0,0,.35);
  white-space:nowrap;
}
.about-destination-card small{
  position:relative;
  z-index:2;
  margin-top:8px;
  color:rgba(210,255,251,.86);
  font-size:11px;
  letter-spacing:.14em;
  white-space:nowrap;
}
.about-card-orb{
  position:absolute;
  left:22px;
  width:58px;
  height:58px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--aqua),#2d79ff 72%);
  opacity:.46;
}
.about-card-lines{
  position:absolute;
  inset:auto 0 0 0;
  height:44px;
  opacity:.22;
  background:linear-gradient(90deg, transparent, rgba(144,255,241,.55), transparent);
  mask-image:repeating-linear-gradient(90deg, #000 0 10px, transparent 10px 22px);
  -webkit-mask-image:repeating-linear-gradient(90deg, #000 0 10px, transparent 10px 22px);
}
.about-page{
  line-height:1.55;
}
.about-page h2{
  margin-bottom:12px;
}
.about-page h3{
  margin:22px 0 10px;
  font-size:18px;
  letter-spacing:.10em;
}
.about-page h4{
  margin:18px 0 8px;
  font-size:14px;
  letter-spacing:.08em;
  color:var(--aqua);
}
.about-page p{
  color:rgba(236,248,255,.84);
}
.about-page strong{
  color:#fff;
}
.about-divider{
  height:1px;
  margin:22px 0;
  background:linear-gradient(90deg, transparent, rgba(144,255,241,.34), transparent);
}
.legal-line{
  font-weight:800;
  color:#fff !important;
}