:root{
 --elite-black:#050409;--elite-panel:#0d0a13;--elite-purple:#7b2cff;--elite-amethyst:#b56cff;--elite-platinum:#f4efff;--elite-silver:#a99db7;--elite-line:rgba(198,153,255,.46);--elite-shadow:0 18px 50px rgba(0,0,0,.62);--elite-inset:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -10px 24px rgba(0,0,0,.42);--elite-radius:22px;
}
*{scrollbar-color:#6f31a7 #08060b}
body{background:radial-gradient(circle at 50% -15%,rgba(119,52,187,.16),transparent 36%),#050409}
.global-hubbar,.sidebar,.rail,.topbar,.bottom-player{backdrop-filter:blur(18px) saturate(1.15)}
.global-hubbar{border-bottom:1px solid rgba(202,164,255,.34);box-shadow:0 8px 30px rgba(0,0,0,.48),inset 0 -1px 0 rgba(255,255,255,.05)}
.app-shell{gap:12px}
.sidebar{margin:10px 0 96px 10px;border:1px solid rgba(209,176,255,.28);border-radius:26px;background:linear-gradient(180deg,rgba(16,11,23,.98),rgba(5,4,9,.98));box-shadow:var(--elite-shadow),inset 0 1px 0 rgba(255,255,255,.08);overflow:hidden}
.sidebar:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(transparent,#a84cff 20%,#eee6ff 50%,#7b2cff 80%,transparent);opacity:.72;pointer-events:none}
.brand{margin:10px;border:1px solid rgba(231,217,255,.4);border-radius:20px;background:linear-gradient(145deg,rgba(34,23,48,.9),rgba(8,6,12,.98));box-shadow:0 10px 25px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.15)}
.install-app-button{margin:0 12px 14px!important;border:1px solid rgba(255,255,255,.72)!important;border-radius:18px!important;background:linear-gradient(180deg,#16101f,#07050b)!important;box-shadow:0 10px 22px rgba(0,0,0,.55),0 0 18px rgba(139,66,255,.24),inset 0 1px 0 rgba(255,255,255,.27),inset 0 -8px 14px rgba(0,0,0,.5)!important;transition:.22s ease}
.install-app-button:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(0,0,0,.62),0 0 26px rgba(158,82,255,.42),inset 0 1px 0 rgba(255,255,255,.3)!important}
.visual-side-nav{padding:0 10px 18px}
.visual-side-nav>small{display:flex;align-items:center;gap:8px;color:#caa9ef;letter-spacing:.18em;padding:4px 7px 10px}
.visual-side-nav>small:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,var(--elite-line),transparent)}
.visual-nav-btn{position:relative;display:grid!important;grid-template-rows:auto 1fr!important;min-height:152px!important;margin:0 0 12px!important;padding:0!important;border:1px solid rgba(198,153,255,.34)!important;border-radius:20px!important;overflow:hidden;background:linear-gradient(180deg,rgba(25,15,35,.96),rgba(5,4,8,.98))!important;box-shadow:0 10px 24px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.11)!important;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.visual-nav-btn:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 15%,rgba(255,255,255,.12) 42%,transparent 56%);transform:translateX(-130%);transition:transform .65s ease;z-index:3}
.visual-nav-btn:hover:before{transform:translateX(130%)}
.visual-nav-btn:hover{transform:translateY(-4px) scale(1.012);border-color:rgba(235,219,255,.78)!important;box-shadow:0 16px 30px rgba(0,0,0,.65),0 0 20px rgba(128,47,230,.25)!important}
.visual-nav-btn.active,.visual-nav-btn[aria-current="page"]{border-color:#e5d7ff!important;box-shadow:0 16px 36px rgba(0,0,0,.7),0 0 0 1px rgba(163,78,255,.5),0 0 26px rgba(141,59,255,.38)!important;transform:translateX(3px)}
.visual-nav-btn.active:after,.visual-nav-btn[aria-current="page"]:after{content:"";position:absolute;left:0;top:18%;bottom:18%;width:4px;border-radius:10px;background:#fff;box-shadow:0 0 13px #a34cff,0 0 24px #7b2cff}
.visual-nav-label{position:relative;z-index:4;padding:11px 12px 9px!important;background:linear-gradient(180deg,rgba(54,25,78,.94),rgba(15,10,22,.95))!important;border-bottom:1px solid rgba(208,171,255,.28);font-size:14px!important;line-height:1.1!important;text-align:center!important;color:#fff!important;text-shadow:0 1px 10px rgba(180,115,255,.6)}
.nav-card-art{width:100%!important;height:112px!important;object-fit:contain!important;padding:8px!important;background:radial-gradient(circle,rgba(119,44,183,.18),transparent 66%)}
.topbar{position:relative;display:grid!important;grid-template-columns:minmax(0,1fr) 250px;gap:10px;padding:7px!important;margin:10px 0 10px!important;border:1px solid rgba(207,171,255,.32)!important;border-radius:23px!important;background:linear-gradient(180deg,rgba(19,13,27,.96),rgba(7,5,11,.98))!important;box-shadow:0 12px 30px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.12)!important}
.search-wrap{height:58px!important;border:1px solid rgba(205,171,255,.34)!important;border-radius:17px!important;background:linear-gradient(180deg,rgba(20,14,28,.9),rgba(8,6,12,.96))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 -8px 15px rgba(0,0,0,.3)!important}
#voiceSearch{border:1px solid rgba(237,221,255,.5)!important;background:linear-gradient(180deg,#7131aa,#32114e)!important;box-shadow:0 7px 14px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.32)!important}
.premium{position:relative!important;height:58px!important;border:2px solid #efe7ff!important;border-radius:18px!important;color:white!important;background:linear-gradient(150deg,#1a0d27 0%,#6d22a9 42%,#1d0a31 72%,#08050e 100%)!important;box-shadow:0 11px 22px rgba(0,0,0,.58),0 0 0 2px rgba(117,48,190,.35),0 0 23px rgba(149,69,255,.42),inset 0 2px 0 rgba(255,255,255,.46),inset 0 -12px 22px rgba(0,0,0,.48)!important;overflow:hidden!important;text-shadow:0 1px 8px rgba(0,0,0,.85)!important}
.premium:before{content:"";position:absolute;inset:3px;border:1px solid rgba(218,187,255,.5);border-radius:14px;pointer-events:none}
.premium:after{content:"";position:absolute;top:-70%;left:-40%;width:30%;height:240%;transform:rotate(22deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.48),transparent);animation:eliteGlint 6.5s ease-in-out infinite;pointer-events:none}
.premium span:not(.premium-icon){color:#fff!important}.premium small{color:#ead9ff!important;opacity:1!important}.premium-icon{color:#fff!important;filter:drop-shadow(0 0 8px #d19cff)}
.premium:hover{transform:translateY(-3px) scale(1.01)!important;box-shadow:0 16px 30px rgba(0,0,0,.65),0 0 31px rgba(160,78,255,.62),inset 0 2px 0 rgba(255,255,255,.55)!important}
.stage{border:1px solid rgba(224,206,255,.43)!important;border-radius:26px!important;box-shadow:0 22px 55px rgba(0,0,0,.68),0 0 0 1px rgba(117,47,177,.18),inset 0 1px 0 rgba(255,255,255,.17)!important;overflow:hidden!important}
.stage:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:8;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),inset 0 -80px 100px rgba(0,0,0,.48)}
.stage-art{transition:opacity .38s ease,transform .7s cubic-bezier(.2,.8,.2,1)!important}.stage.is-switching .stage-art{opacity:.15;transform:scale(1.025)}
.stage-actions button,.bottom-controls button,.controls button,.stage-up-next button,.rail button,.hub-more summary{border:1px solid rgba(239,228,255,.62)!important;background:linear-gradient(180deg,#1b1424,#07050c)!important;color:#fff!important;box-shadow:0 8px 16px rgba(0,0,0,.54),inset 0 1px 0 rgba(255,255,255,.25),inset 0 -6px 11px rgba(0,0,0,.45)!important;transition:.18s ease!important}
.stage-actions button:hover,.bottom-controls button:hover,.controls button:hover,.rail button:hover{transform:translateY(-2px);border-color:white!important;box-shadow:0 11px 20px rgba(0,0,0,.62),0 0 16px rgba(143,65,236,.38),inset 0 1px 0 rgba(255,255,255,.3)!important}
.bottom-play,#play,.mobile-quick-play{position:relative!important;border:2px solid white!important;background:radial-gradient(circle at 36% 28%,#dcb7ff 0,#9b4dff 22%,#6020a6 52%,#180727 100%)!important;box-shadow:0 12px 22px rgba(0,0,0,.7),0 0 0 3px rgba(104,36,169,.45),0 0 28px rgba(171,85,255,.66),inset 0 3px 2px rgba(255,255,255,.6),inset 0 -12px 18px rgba(27,4,47,.62)!important}
.bottom-play:before,#play:before,.mobile-quick-play:before{content:"";position:absolute;inset:5px;border-radius:50%;border:1px solid rgba(255,255,255,.48);pointer-events:none}
.bottom-play:hover,#play:hover,.mobile-quick-play:hover{transform:translateY(-4px) scale(1.06)!important;box-shadow:0 17px 28px rgba(0,0,0,.72),0 0 38px rgba(183,102,255,.82),inset 0 3px 2px rgba(255,255,255,.7)!important}
.bottom-player{border-top:1px solid rgba(225,206,255,.5)!important;background:linear-gradient(180deg,rgba(19,13,26,.98),rgba(5,4,9,.99))!important;box-shadow:0 -16px 38px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.13)!important}
.bottom-seek-row input,.bottom-volume-row input{height:7px!important;border-radius:99px!important;background:linear-gradient(180deg,#020103,#24142f)!important;box-shadow:inset 0 2px 4px rgba(0,0,0,.85),0 0 8px rgba(137,56,218,.2)!important}
.rail{margin:10px 10px 96px 0;border:1px solid rgba(205,171,255,.27);border-radius:25px;background:linear-gradient(180deg,rgba(14,10,20,.98),rgba(5,4,9,.99));box-shadow:var(--elite-shadow),inset 0 1px 0 rgba(255,255,255,.08);padding:12px!important}
.rail>h2{font-size:26px!important;line-height:.95!important;padding:6px 4px 12px;border-bottom:1px solid rgba(203,164,255,.24)}
.mode-btn,.playlist-card{border:1px solid rgba(205,167,255,.33)!important;border-radius:18px!important;background:linear-gradient(145deg,rgba(27,17,38,.96),rgba(8,6,12,.99))!important;box-shadow:0 10px 22px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.11)!important}
.rail-playlists{padding:12px 0;border-top:1px solid rgba(205,168,255,.24);border-bottom:1px solid rgba(205,168,255,.24)}
.elite-progress-card{margin:14px 0;padding:14px;border:1px solid rgba(216,188,255,.38);border-radius:20px;background:linear-gradient(145deg,rgba(40,19,57,.8),rgba(8,6,12,.96));box-shadow:0 12px 25px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.14)}
.elite-progress-card h3{margin:0 0 8px;font:700 20px/1 Georgia,serif}.elite-progress-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.elite-progress-grid div{padding:9px 5px;text-align:center;border:1px solid rgba(220,194,255,.2);border-radius:12px;background:rgba(0,0,0,.25)}.elite-progress-grid strong{display:block;font-size:17px;color:#fff}.elite-progress-grid small{font-size:9px;color:#c9bdd3}
.elite-progress-track{height:7px;margin-top:10px;background:#050307;border-radius:99px;overflow:hidden;box-shadow:inset 0 2px 5px #000}.elite-progress-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,#7025b2,#d3a6ff);box-shadow:0 0 12px #a64cff;transition:width .5s ease}
.elite-start-here{display:grid;grid-template-columns:auto 1fr auto;gap:13px;align-items:center;margin:12px 0;padding:13px 16px;border:1px solid rgba(220,194,255,.35);border-radius:20px;background:linear-gradient(115deg,rgba(15,10,22,.97),rgba(69,28,97,.6),rgba(11,8,16,.98));box-shadow:0 12px 28px rgba(0,0,0,.47),inset 0 1px 0 rgba(255,255,255,.15)}
.elite-start-icon{width:46px;height:46px;display:grid;place-items:center;border:1px solid white;border-radius:50%;background:radial-gradient(circle,#b46cff,#341050);box-shadow:0 0 20px rgba(166,78,255,.52)}.elite-start-here h3{margin:0;font:700 20px/1.05 Georgia,serif}.elite-start-here p{margin:4px 0 0;color:#c9bdcf;font-size:12px}.elite-start-progress{font-size:11px;color:#e7d8ff}.elite-start-here button{min-height:45px;padding:0 16px;border:1px solid white;border-radius:14px;color:white;background:linear-gradient(180deg,#7730ae,#2a0c43);box-shadow:0 8px 18px #000,0 0 16px rgba(151,69,238,.35),inset 0 1px 0 rgba(255,255,255,.34)}
.elite-details-trigger{font-size:16px!important}
.elite-details-drawer{position:fixed;inset:0;z-index:10010;display:grid;place-items:end;pointer-events:none;background:rgba(2,1,4,0);transition:.25s ease}.elite-details-drawer.open{pointer-events:auto;background:rgba(2,1,4,.72);backdrop-filter:blur(7px)}.elite-details-panel{width:min(520px,100%);height:100%;padding:22px;overflow:auto;border-left:1px solid rgba(231,211,255,.45);background:linear-gradient(180deg,#140d1d,#07050b);box-shadow:-25px 0 60px rgba(0,0,0,.7);transform:translateX(105%);transition:.32s cubic-bezier(.2,.8,.2,1)}.elite-details-drawer.open .elite-details-panel{transform:none}.elite-details-close{float:right;width:42px;height:42px;border-radius:50%;border:1px solid #d9c4f5;color:#fff;background:#09060e}.elite-details-art{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:18px;border:1px solid rgba(221,196,255,.4);box-shadow:0 15px 30px rgba(0,0,0,.55)}.elite-details-panel h2{font:700 33px/1 Georgia,serif;margin:16px 0 8px}.elite-detail-meta{color:#c9b8d8;font-size:12px;text-transform:uppercase;letter-spacing:.12em}.elite-detail-copy{color:#eee7f4;line-height:1.6}.elite-detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.elite-detail-actions button{min-height:50px;border-radius:15px;border:1px solid rgba(240,225,255,.7);color:white;background:linear-gradient(180deg,#3e185d,#12091c);box-shadow:0 9px 18px #000,inset 0 1px 0 rgba(255,255,255,.26)}
.elite-first-visit{position:fixed;inset:0;z-index:10020;display:none;place-items:center;padding:20px;background:rgba(3,2,6,.82);backdrop-filter:blur(12px)}.elite-first-visit.open{display:grid}.elite-welcome-card{width:min(650px,100%);padding:28px;border:1px solid rgba(240,225,255,.55);border-radius:28px;background:radial-gradient(circle at 50% 0,rgba(129,51,196,.28),transparent 38%),linear-gradient(180deg,#140d1d,#060409);box-shadow:0 30px 90px rgba(0,0,0,.82),0 0 40px rgba(124,45,205,.28),inset 0 1px 0 rgba(255,255,255,.16);text-align:center}.elite-welcome-diamond{font-size:44px;color:#c89aff;text-shadow:0 0 22px #8e37e5}.elite-welcome-card h2{font:700 39px/1 Georgia,serif;margin:8px 0}.elite-welcome-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.elite-welcome-steps div{padding:15px 10px;border:1px solid rgba(215,187,255,.25);border-radius:16px;background:rgba(0,0,0,.25)}.elite-welcome-steps strong{display:block;font-size:24px;color:#c89aff}.elite-welcome-card button{min-height:54px;padding:0 24px;border:2px solid white;border-radius:17px;color:#fff;font-weight:800;background:linear-gradient(180deg,#963dce,#3d125e);box-shadow:0 12px 25px #000,0 0 25px rgba(169,79,255,.47),inset 0 2px 0 rgba(255,255,255,.4)}
.elite-loading{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;opacity:0;visibility:hidden;pointer-events:none;background:rgba(4,2,7,.7);backdrop-filter:blur(10px);transition:.2s}.elite-loading.show{opacity:1;visibility:visible;pointer-events:none}.elite-loader-card{text-align:center}.elite-loader-diamond{font-size:50px;color:#c790ff;animation:elitePulse 1.4s ease-in-out infinite}.elite-wave{display:flex;justify-content:center;align-items:center;height:38px;gap:5px}.elite-wave i{width:4px;height:10px;border-radius:5px;background:#c58fff;animation:eliteWave .9s ease-in-out infinite}.elite-wave i:nth-child(2){animation-delay:.1s}.elite-wave i:nth-child(3){animation-delay:.2s}.elite-wave i:nth-child(4){animation-delay:.3s}.elite-wave i:nth-child(5){animation-delay:.4s}
body.ambient-morning{--elite-purple:#9a55e3}body.ambient-clarity{--elite-purple:#7657ff}body.ambient-power{--elite-purple:#9b24ec}body.ambient-love{--elite-purple:#a53a8d}body.ambient-night{--elite-purple:#4d2f8e}.stage,.sidebar,.rail,.topbar{transition:border-color .5s ease,box-shadow .5s ease,background .5s ease}
@keyframes eliteGlint{0%,70%{left:-45%;opacity:0}78%{opacity:1}92%{left:130%;opacity:0}100%{left:130%;opacity:0}}@keyframes elitePulse{50%{transform:scale(1.12);filter:drop-shadow(0 0 18px #b66aff)}}@keyframes eliteWave{50%{height:32px}}
@media(max-width:900px){
 .global-hubbar{min-height:48px}.app-shell{display:block!important}.sidebar,.rail{display:none!important}.main{padding:0 8px 105px!important}.topbar{display:block!important;margin:6px 0 8px!important;padding:5px!important}.premium{display:none!important}.search-wrap{height:50px!important}.mobile-command-strip{padding:7px 8px!important;gap:7px!important;background:linear-gradient(180deg,#0f0a16,#06040a)!important;border-bottom:1px solid rgba(213,179,255,.28)}.mobile-command-strip button{min-width:0!important;height:58px!important;border-radius:16px!important;font-size:10px!important}.mobile-quick-install,.mobile-quick-menu{border:1px solid white!important;background:linear-gradient(180deg,#1b1424,#07050c)!important;color:#fff!important;box-shadow:0 9px 18px #000,inset 0 1px 0 rgba(255,255,255,.28)!important}.mobile-quick-max{border:2px solid #fff!important;background:linear-gradient(180deg,#fff,#d7cce3)!important;color:#110b17!important;box-shadow:0 9px 18px #000,0 0 18px rgba(142,59,226,.35),inset 0 1px 0 #fff!important}.stage{border-radius:20px!important;min-height:510px!important}.stage-art{object-fit:contain!important;background:#08060b!important}.stage-bg{filter:blur(18px) brightness(.55);transform:scale(1.12)}.stage-up-next{display:none!important}.stage-actions{top:12px!important;right:10px!important}.stage-badge{top:13px!important;left:50%!important;transform:translateX(-50%);font-size:9px!important}.title-panel{left:8px!important;right:8px!important;bottom:16px!important;padding:13px!important}.title-panel h1{font-size:clamp(25px,8vw,38px)!important}.visualizer{bottom:116px!important}.elite-start-here{grid-template-columns:auto 1fr;margin:9px 0;padding:11px}.elite-start-here button{grid-column:1/-1;width:100%}.elite-start-here h3{font-size:17px}.elite-welcome-steps{grid-template-columns:1fr}.elite-details-panel{width:100%;height:90%;border-left:0;border-top:1px solid rgba(231,211,255,.45);border-radius:24px 24px 0 0;transform:translateY(105%)}.elite-details-drawer.open .elite-details-panel{transform:none}.bottom-player{padding:5px 6px calc(5px + env(safe-area-inset-bottom))!important}.bottom-controls{gap:4px!important}.bottom-controls button{width:36px!important;height:36px!important;font-size:11px!important}.bottom-play{width:48px!important;height:48px!important}.bottom-meta{display:none!important}.bottom-seek-row{order:2!important}.bottom-controls{order:1!important}.bottom-volume-row{order:3!important}.mobile-nav{background:linear-gradient(180deg,#110b18,#050409)!important;border-top:1px solid rgba(221,193,255,.34)!important}
}
@media(max-width:380px){.mobile-command-strip button{height:54px!important}.mobile-command-strip strong{font-size:9px!important}.bottom-controls button{width:32px!important;height:32px!important}.bottom-play{width:44px!important;height:44px!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* V58 — mobile command/search flow repair
   Keep search in normal document flow below the mobile command dock.
   It must never float over or obscure the hero artwork or host faces. */
@media (max-width:860px){
  .main{overflow:visible!important;position:relative!important;padding-top:8px!important}
  .topbar{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    z-index:12!important;
    display:block!important;
    width:100%!important;
    margin:0 0 10px!important;
    padding:4px!important;
    transform:none!important;
    background:linear-gradient(180deg,rgba(18,12,24,.99),rgba(5,3,8,.99))!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
  }
  .search-wrap{
    position:relative!important;
    inset:auto!important;
    z-index:1!important;
    width:100%!important;
    min-height:50px!important;
    margin:0!important;
    transform:none!important;
  }
  .stage{
    position:relative!important;
    z-index:1!important;
    margin-top:0!important;
    clear:both!important;
    isolation:isolate!important;
  }
  .stage-art,.stage-bg{z-index:0!important}
  .stage-shade{z-index:1!important}
}
@media (max-width:480px){
  .main{padding:7px 7px 108px!important}
  .topbar{margin-bottom:8px!important;border-radius:15px!important}
  .search-wrap{min-height:48px!important;height:48px!important;border-radius:13px!important;padding:5px 7px 5px 10px!important}
  .search-wrap input{font-size:12px!important;line-height:1.2!important}
  .search-wrap button{min-width:38px!important;width:38px!important;height:38px!important;padding:0!important}
}

/* =========================================================
   V65 — HUMAN MAXIMUS ELITE BUTTON & ICON SYSTEM
   One authoritative finishing layer for premium controls.
   ========================================================= */
:root{
  --hm-obsidian:#030306;
  --hm-black-glass:#0b0910;
  --hm-deep-violet:#26143d;
  --hm-purple:#8b3dff;
  --hm-amethyst:#b57cff;
  --hm-white:#f8f7fb;
  --hm-platinum:#c9c6d0;
  --hm-gold:#d8b978;
  --hm-focus:#e8d8ff;
  --hm-button-radius:22px;
  --hm-button-shadow:0 14px 28px rgba(0,0,0,.68),0 4px 9px rgba(0,0,0,.5);
  --hm-purple-aura:0 0 0 1px rgba(181,124,255,.24),0 0 22px rgba(139,61,255,.38);
}

/* Shared physical-button construction */
.hub-free-gifts-cta,.hub-start-free-cta,.hub-course-login,
.mobile-free-gifts,.mobile-start-free,
.install-app-button,.premium,.native-install-button,
#eliteStartButton,.guide button,.rail-action,
.rail-connect-grid a,.rail-connect-grid button,
.conversion-continue-free,.conversion-start-trial,
.elite-detail-actions button,.elite-welcome-card button,
.mode-btn,.tabs button,.card-actions button{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-radius:var(--hm-button-radius)!important;
  transform:translateZ(0);
  transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s ease,border-color .18s ease,filter .18s ease!important;
  -webkit-tap-highlight-color:transparent;
}
.hub-free-gifts-cta:before,.hub-start-free-cta:before,.hub-course-login:before,
.mobile-free-gifts:before,.mobile-start-free:before,
.install-app-button:before,.premium:before,.native-install-button:before,
#eliteStartButton:before,.guide button:before,.rail-action:before,
.conversion-continue-free:before,.conversion-start-trial:before{
  content:"";position:absolute;z-index:-1;inset:2px;border-radius:calc(var(--hm-button-radius) - 4px);
  border:1px solid rgba(255,255,255,.18);pointer-events:none;
}
.hub-free-gifts-cta:after,.hub-start-free-cta:after,.hub-course-login:after,
.mobile-free-gifts:after,.mobile-start-free:after,
.install-app-button:after,.premium:after,.native-install-button:after,
#eliteStartButton:after,.guide button:after,.rail-action:after,
.conversion-continue-free:after,.conversion-start-trial:after{
  content:"";position:absolute;z-index:2;left:9%;right:9%;top:2px;height:38%;border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.30),rgba(255,255,255,.02));
  opacity:.48;pointer-events:none;
}
.hub-free-gifts-cta:hover,.hub-start-free-cta:hover,.hub-course-login:hover,
.mobile-free-gifts:hover,.mobile-start-free:hover,
.install-app-button:hover,.premium:hover,.native-install-button:hover,
#eliteStartButton:hover,.guide button:hover,.rail-action:hover,
.rail-connect-grid a:hover,.rail-connect-grid button:hover,
.conversion-continue-free:hover,.conversion-start-trial:hover,
.elite-detail-actions button:hover,.elite-welcome-card button:hover,
.mode-btn:hover,.tabs button:hover,.card-actions button:hover{
  transform:translateY(-3px)!important;filter:brightness(1.06);
}
.hub-free-gifts-cta:active,.hub-start-free-cta:active,.hub-course-login:active,
.mobile-free-gifts:active,.mobile-start-free:active,
.install-app-button:active,.premium:active,.native-install-button:active,
#eliteStartButton:active,.guide button:active,.rail-action:active,
.rail-connect-grid a:active,.rail-connect-grid button:active,
.conversion-continue-free:active,.conversion-start-trial:active,
.elite-detail-actions button:active,.elite-welcome-card button:active,
.mode-btn:active,.tabs button:active,.card-actions button:active{
  transform:translateY(1px) scale(.992)!important;filter:brightness(.96);
  box-shadow:0 5px 10px rgba(0,0,0,.62),inset 0 4px 12px rgba(0,0,0,.38)!important;
}
:where(button,a,[tabindex]):focus-visible{outline:3px solid var(--hm-focus)!important;outline-offset:3px!important;box-shadow:0 0 0 6px rgba(139,61,255,.28)!important}

/* Black Diamond commands — valuable, tactile, quieter than Play */
.hub-free-gifts-cta,.install-app-button,.hub-course-login,.mobile-free-gifts,
.rail-action,.rail-connect-grid a,.rail-connect-grid button,.elite-detail-actions button,
.card-actions button,.tabs button,.mode-btn{
  color:var(--hm-white)!important;
  background:linear-gradient(180deg,#1b1a20 0%,#09090d 45%,#020204 100%)!important;
  border:1px solid rgba(248,247,251,.78)!important;
  box-shadow:var(--hm-button-shadow),inset 0 2px 0 rgba(255,255,255,.22),inset 0 -10px 18px rgba(0,0,0,.64),var(--hm-purple-aura)!important;
  text-shadow:0 2px 8px rgba(0,0,0,.9);
}
.hub-free-gifts-cta,.hub-course-login{min-height:46px;padding:0 20px!important;font-weight:800;letter-spacing:.035em}
.install-app-button{min-height:72px!important;border-width:2px!important}
.install-app-button .install-app-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:15px;background:radial-gradient(circle at 35% 25%,#cfa7ff,#7131be 42%,#170623 78%);border:1px solid rgba(255,255,255,.8);box-shadow:0 7px 15px rgba(0,0,0,.55),0 0 18px rgba(164,83,255,.6),inset 0 2px 2px rgba(255,255,255,.55)}

/* Diamond White conversion commands — unmistakable access action */
.hub-start-free-cta,.mobile-start-free,.premium,.conversion-start-trial{
  color:#08070b!important;
  background:linear-gradient(180deg,#fff 0%,#f3f0f8 48%,#d7d2dd 100%)!important;
  border:2px solid #fff!important;
  box-shadow:var(--hm-button-shadow),0 0 0 2px rgba(5,5,8,.9),0 0 0 4px rgba(181,124,255,.62),0 0 28px rgba(139,61,255,.58),inset 0 2px 1px rgba(255,255,255,.95),inset 0 -10px 18px rgba(77,60,94,.16)!important;
  text-shadow:none!important;
}
.hub-start-free-cta span,.hub-start-free-cta strong,.hub-start-free-cta small,
.mobile-start-free span,.mobile-start-free strong,.mobile-start-free small,
.premium span,.premium strong,.premium small,.conversion-start-trial span,.conversion-start-trial strong,.conversion-start-trial small{color:#09070d!important}
.hub-start-free-cta>span[aria-hidden],.mobile-start-free>span[aria-hidden],.premium-jewel,.conversion-start-trial>span[aria-hidden]{color:#6e18bf!important;filter:drop-shadow(0 0 7px rgba(139,61,255,.62))}
.premium{height:60px!important;min-width:238px!important}
.premium:after{animation:none!important}

/* Royal Purple primary commands — only strongest action in each region */
#play,.bottom-play,.mobile-quick-play,#eliteStartButton,.guide button,.native-install-button,.elite-welcome-card button{
  color:#fff!important;
  background:linear-gradient(180deg,#c276ff 0%,#8b3dff 22%,#5d18a6 58%,#1c052f 100%)!important;
  border:2px solid #fff!important;
  box-shadow:0 16px 28px rgba(0,0,0,.72),0 0 0 3px rgba(104,36,169,.55),0 0 30px rgba(181,124,255,.72),inset 0 3px 2px rgba(255,255,255,.68),inset 0 -13px 20px rgba(25,3,48,.64)!important;
  text-shadow:0 2px 10px rgba(21,0,39,.92)!important;
}
#eliteStartButton,.guide button,.native-install-button,.elite-welcome-card button{min-height:54px;padding:0 24px!important;font-weight:900;letter-spacing:.015em}
#play,.bottom-play,.mobile-quick-play{border-radius:50%!important}

/* Unified utility-control hardware family */
.stage-actions button,.bottom-controls button,.controls button,.stage-up-next button,.volume-button,
#toggleUpNext,.playlist-play,.playlist-remove{
  min-width:46px;min-height:46px;border-radius:50%!important;
  color:#fff!important;background:linear-gradient(180deg,#1a1720,#060509 70%,#020203)!important;
  border:1px solid rgba(248,247,251,.78)!important;
  box-shadow:0 9px 17px rgba(0,0,0,.62),inset 0 2px 0 rgba(255,255,255,.20),inset 0 -8px 13px rgba(0,0,0,.58),0 0 12px rgba(139,61,255,.20)!important;
}
.stage-actions button.active,.bottom-controls button.active,.controls button.active,
.stage-actions button[aria-pressed="true"],.bottom-controls button[aria-pressed="true"]{
  border-color:#fff!important;background:linear-gradient(180deg,#6f2ab1,#220832)!important;
  box-shadow:0 9px 18px rgba(0,0,0,.62),0 0 0 2px rgba(181,124,255,.42),0 0 20px rgba(139,61,255,.54),inset 0 2px 0 rgba(255,255,255,.32)!important;
}
button:disabled,[aria-disabled="true"]{opacity:.38!important;filter:grayscale(.55)!important;box-shadow:none!important;transform:none!important;cursor:not-allowed!important}

/* Featured boards: layered architecture, never flat */
.elite-start-here,.guide{
  border:1px solid rgba(248,247,251,.54)!important;
  box-shadow:0 18px 38px rgba(0,0,0,.64),0 0 0 1px rgba(181,124,255,.20),inset 0 2px 0 rgba(255,255,255,.13),inset 0 -20px 40px rgba(0,0,0,.34)!important;
}
.elite-start-icon{border:1px solid rgba(255,255,255,.88)!important;background:radial-gradient(circle at 35% 28%,#d7b4ff,#7a2dc7 48%,#1a0728 82%)!important;box-shadow:0 10px 20px rgba(0,0,0,.55),0 0 20px rgba(151,67,247,.5),inset 0 2px 2px rgba(255,255,255,.54)!important}

/* Compact mobile conversion rhythm: black + white, clear and thumb-safe */
@media(max-width:760px){
  .mobile-conversion-row{gap:10px!important;padding:10px 12px!important}
  .mobile-free-gifts,.mobile-start-free{min-height:58px!important;padding:8px 12px!important}
  .mobile-free-gifts strong,.mobile-start-free strong{font-size:13px!important;white-space:nowrap}
  .mobile-start-free small{font-size:9px!important}
  .mobile-command-row button{min-height:54px!important}
  .premium{min-width:0!important;width:100%!important}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition-duration:.01ms!important}
}


/* =========================================================
   V66 — precision refinement: feature playback, compact queue,
   aligned conversion controls, and clearer visual hierarchy.
   ========================================================= */
.hub-primary-links{align-items:center!important;gap:12px!important}
.hub-free-gifts-cta,.hub-course-login,.hub-start-free-cta{height:48px!important;min-height:48px!important;box-sizing:border-box!important;border-radius:18px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
.hub-free-gifts-cta{padding:0 19px!important}
.hub-course-login{padding:0 18px!important;font-size:12px!important;line-height:1!important;border:1px solid rgba(255,255,255,.68)!important;box-shadow:0 10px 20px rgba(0,0,0,.58),inset 0 2px 0 rgba(255,255,255,.18),0 0 15px rgba(139,61,255,.20)!important}
.hub-start-free-cta{min-width:132px!important;padding:5px 17px!important;gap:9px!important}
.hub-start-free-cta>span:last-child{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;line-height:1!important}
.hub-start-free-cta>span:last-child:not([aria-hidden]){font-size:12px!important;font-weight:950!important;letter-spacing:.035em!important}
.hub-start-free-cta small{font-size:7px!important;line-height:1!important;margin-top:4px!important;letter-spacing:.12em!important}
.premium{height:58px!important;min-width:222px!important;padding:6px 18px!important;border-radius:20px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:11px!important}
.premium .premium-jewel{width:40px!important;height:40px!important;min-width:40px!important;border-radius:13px!important}
.premium strong{font-size:13px!important;letter-spacing:.035em!important}.premium small{font-size:8px!important;letter-spacing:.11em!important;margin-top:3px!important}
.stage-up-next{width:min(286px,35%)!important;padding:10px 11px!important}.stage-up-next-head{min-height:24px!important;margin-bottom:7px!important}.stage-up-next-head strong{font-size:10px!important;letter-spacing:.16em!important}
#toggleUpNext{min-width:27px!important;width:27px!important;min-height:27px!important;height:27px!important;font-size:14px!important;line-height:1!important;border-radius:50%!important;padding:0!important;box-shadow:0 5px 10px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.18)!important}
.stage-queue-row{grid-template-columns:minmax(0,1fr) 28px!important;gap:6px!important;margin-top:6px!important}.stage-queue-row>button:first-child{min-height:38px!important;padding:7px 8px!important;border-radius:12px!important}.stage-queue-row strong{font-size:10.5px!important;line-height:1.15!important}
.stage-queue-row>button:last-child{min-width:28px!important;width:28px!important;min-height:28px!important;height:28px!important;align-self:center!important;padding:0!important;font-size:14px!important;line-height:1!important;border-radius:9px!important;box-shadow:0 4px 9px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.12)!important}
.elite-feature-powercast{display:grid!important;grid-template-columns:116px minmax(0,1fr) auto!important;align-items:center!important;gap:18px!important;padding:15px!important;background:linear-gradient(135deg,rgba(6,4,9,.98),rgba(35,13,52,.86) 58%,rgba(7,5,10,.98))!important}
.elite-feature-cover{display:block;width:116px;height:116px;object-fit:cover;border-radius:20px;border:1px solid rgba(255,255,255,.78);box-shadow:0 14px 26px rgba(0,0,0,.62),0 0 0 2px rgba(128,50,206,.34),0 0 24px rgba(150,68,242,.35)}
.elite-feature-copy{min-width:0}.elite-feature-powercast h3{font-size:25px!important;line-height:1.03!important;margin:3px 0 6px!important}.elite-feature-powercast p:not(.elite-feature-kicker){font-size:12.5px!important;line-height:1.45!important;max-width:820px!important}
.elite-feature-powercast #eliteStartButton{min-width:172px!important;white-space:nowrap!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:9px!important}.elite-feature-powercast #eliteStartButton span{font-size:15px!important}
.stage-actions button{min-width:43px!important;width:43px!important;min-height:43px!important;height:43px!important}
@media(max-width:1100px){.hub-primary-links{gap:7px!important}.hub-free-gifts-cta,.hub-course-login{padding-inline:11px!important;font-size:10px!important}.hub-start-free-cta{min-width:116px!important;padding-inline:10px!important}}
@media(max-width:760px){.elite-feature-powercast{grid-template-columns:82px minmax(0,1fr)!important;gap:12px!important;padding:12px!important}.elite-feature-cover{width:82px;height:82px;border-radius:15px}.elite-feature-powercast h3{font-size:18px!important}.elite-feature-powercast p:not(.elite-feature-kicker){font-size:11.5px!important}.elite-feature-powercast #eliteStartButton{grid-column:1/-1!important;width:100%!important;min-width:0!important}.mobile-free-gifts,.mobile-start-free{border-radius:18px!important}}

/* =========================================================
   V67 — lightweight external audio delivery and precise
   top-navigation alignment. Audio remains outside the app ZIP.
   ========================================================= */
.hub-course-login{
  height:48px!important;
  min-height:48px!important;
  padding:0 18px 1px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:48px!important;
  vertical-align:middle!important;
  white-space:nowrap!important;
  font-size:12px!important;
  font-weight:850!important;
  letter-spacing:.025em!important;
  transform:translateY(0)!important;
}
.hub-course-login::before{inset:3px!important}
.hub-course-login::after{top:3px!important;height:30%!important;opacity:.34!important}
.hub-start-free-cta{
  height:48px!important;
  min-height:48px!important;
  padding:4px 15px 5px!important;
  align-items:center!important;
  justify-content:center!important;
}
.hub-start-free-cta>span:last-child{
  min-height:34px!important;
  transform:translateY(1px)!important;
}
.hub-start-free-cta small{margin-top:3px!important}
@media(max-width:1100px){
  .hub-course-login{padding-inline:11px!important;font-size:10px!important;line-height:48px!important}
}


/* =========================================================
   V68 — conversion pair + Let Us Help command console
   Clear roles: Free Gifts (black), Start Free (white),
   5-Day Free Trial (black). No duplicated trial wording.
   ========================================================= */
.hub-free-gifts-cta,
.hub-course-login{
  background:
    linear-gradient(180deg,rgba(255,255,255,.16),transparent 24%),
    radial-gradient(circle at 50% 115%,rgba(118,50,178,.20),transparent 48%),
    linear-gradient(180deg,#17161b 0%,#08080b 48%,#010102 100%)!important;
  border:1px solid rgba(255,255,255,.84)!important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.95),
    0 0 0 3px rgba(176,113,224,.22),
    0 12px 24px rgba(0,0,0,.72),
    0 0 20px rgba(137,60,203,.22),
    inset 0 2px 0 rgba(255,255,255,.24),
    inset 0 -10px 18px rgba(0,0,0,.72)!important;
}
.hub-start-free-cta{
  min-width:138px!important;
  padding:0 20px!important;
  gap:10px!important;
  color:#07060a!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,1),rgba(255,255,255,.94) 38%,rgba(220,216,226,.98) 100%)!important;
  border:2px solid #fff!important;
  box-shadow:
    0 0 0 1px rgba(5,4,8,.95),
    0 0 0 4px rgba(170,91,236,.50),
    0 13px 27px rgba(0,0,0,.68),
    0 0 30px rgba(154,67,228,.50),
    inset 0 3px 0 rgba(255,255,255,1),
    inset 0 -10px 17px rgba(73,55,89,.16)!important;
  font-size:12px!important;
  font-weight:950!important;
  letter-spacing:.055em!important;
  text-shadow:0 1px 0 rgba(255,255,255,.75)!important;
}
.hub-start-free-cta>span[aria-hidden]{
  display:grid;place-items:center;width:24px;height:24px;border-radius:8px;
  color:#fff!important;background:linear-gradient(180deg,#c37bff,#7021b4 58%,#240438)!important;
  border:1px solid rgba(255,255,255,.9);box-shadow:0 6px 11px rgba(0,0,0,.4),0 0 13px rgba(147,60,225,.55),inset 0 2px 1px rgba(255,255,255,.56)
}
.hub-start-free-cta>span:last-child{min-height:auto!important;transform:none!important;line-height:1!important}

/* Course Login is intentionally quieter and perfectly centred. */
.hub-course-login{
  height:48px!important;line-height:1!important;padding:0 18px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  transform:none!important;font-size:11px!important;font-weight:850!important;letter-spacing:.025em!important
}

/* The second row now leads with help, not another vague search sentence. */
.topbar{grid-template-columns:minmax(0,1fr) auto!important;gap:12px!important;align-items:stretch!important}
.search-wrap{
  display:grid!important;
  grid-template-columns:auto auto minmax(0,1fr) auto!important;
  align-items:center!important;
  column-gap:10px!important;
  padding:6px 8px 6px 14px!important;
  min-height:60px!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),transparent 42%),
    linear-gradient(180deg,#12101a,#07060b)!important;
  border:1px solid rgba(225,205,244,.42)!important;
  box-shadow:0 13px 25px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.help-console-title{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-height:36px;padding:0 13px;border-radius:12px;
  font-size:10px!important;font-weight:950!important;letter-spacing:.13em!important;white-space:nowrap;
  color:#fff!important;background:linear-gradient(180deg,#2b123f,#0a0610)!important;
  border:1px solid rgba(231,210,250,.58);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 0 15px rgba(147,70,219,.20)
}
.search-spark{font-size:14px!important;color:#d8b4ff!important;text-shadow:0 0 12px rgba(181,124,255,.78)}
.search-wrap input{font-size:14px!important;font-weight:650!important;color:#f5effb!important;min-width:0!important}
.search-wrap input::placeholder{color:rgba(242,234,248,.74)!important;opacity:1!important}
.search-wrap #voiceSearch{width:44px!important;height:44px!important;min-width:44px!important;border-radius:14px!important}

/* The lower CTA complements the white START FREE button instead of duplicating it. */
.premium{
  min-width:250px!important;height:60px!important;padding:6px 18px 6px 8px!important;
  color:#fff!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.15),transparent 23%),
    radial-gradient(circle at 20% 48%,rgba(131,46,201,.28),transparent 29%),
    linear-gradient(180deg,#17141d 0%,#07060a 52%,#010102 100%)!important;
  border:1px solid rgba(255,255,255,.88)!important;
  box-shadow:
    0 0 0 1px #000,
    0 0 0 4px rgba(166,91,224,.40),
    0 15px 30px rgba(0,0,0,.74),
    0 0 29px rgba(148,57,224,.38),
    inset 0 2px 0 rgba(255,255,255,.22),
    inset 0 -12px 20px rgba(0,0,0,.76)!important;
  text-shadow:0 2px 7px #000!important;
}
.premium:before{border-color:rgba(255,255,255,.30)!important;inset:4px!important}
.premium-jewel{
  color:#fff!important;
  background:radial-gradient(circle at 34% 25%,#e1c4ff 0,#9d45f0 24%,#4b0d79 56%,#08020d 100%)!important;
  border:1px solid rgba(255,255,255,.94)!important;
  box-shadow:0 8px 15px rgba(0,0,0,.55),0 0 20px rgba(167,75,244,.63),inset 0 2px 2px rgba(255,255,255,.58)!important
}
.premium-label{
  color:#fff!important;text-align:left!important;font-size:12px!important;font-weight:950!important;letter-spacing:.045em!important;line-height:1.05!important
}
.premium-label small{color:#d9c5e9!important;font-size:7px!important;margin-top:5px!important;letter-spacing:.13em!important}

/* Let the content title lead; removal controls remain secondary. */
.stage-up-next-head strong{font-size:11px!important;letter-spacing:.18em!important}
#toggleUpNext{min-width:24px!important;width:24px!important;min-height:24px!important;height:24px!important;font-size:12px!important}
.stage-queue-row{grid-template-columns:minmax(0,1fr) 24px!important}
.stage-queue-row>button:first-child{min-height:40px!important;padding:8px 9px!important}
.stage-queue-row strong{font-size:11px!important;line-height:1.18!important}
.stage-queue-row>button:last-child{min-width:24px!important;width:24px!important;min-height:24px!important;height:24px!important;font-size:12px!important;border-radius:8px!important}

.rail>h2:first-child{font-size:27px!important;line-height:.96!important;margin-bottom:14px!important}
.mobile-mode-section>h2{font-size:22px!important}

@media(max-width:1100px){
  .hub-start-free-cta{min-width:116px!important;padding-inline:13px!important;font-size:10px!important}
  .premium{min-width:220px!important}
  .help-console-title{padding-inline:9px!important;font-size:9px!important}
}
@media(max-width:760px){
  .mobile-free-gifts{background:linear-gradient(180deg,#17161b,#050507)!important;color:#fff!important}
  .mobile-start-free{background:linear-gradient(180deg,#fff,#dfdae5)!important;color:#08070b!important}
  .mobile-start-free strong{color:#08070b!important}
  .topbar{display:block!important}
  .search-wrap{grid-template-columns:auto auto minmax(0,1fr) auto!important;min-height:54px!important;padding:5px 6px 5px 8px!important;column-gap:7px!important}
  .help-console-title{min-height:34px;padding:0 9px;font-size:8px!important;letter-spacing:.10em!important}
  .search-wrap input{font-size:12px!important}
  .search-wrap #voiceSearch{width:40px!important;height:40px!important;min-width:40px!important}
  .premium{display:none!important}
}

/* =========================================================
   V69 — QUICK HELP RAIL + YOUR LISTENING WORLD
   Maintains the same mobile first-screen height by replacing,
   not stacking, the previous search console.
   ========================================================= */
.quick-help-bar{display:grid!important;grid-template-columns:minmax(0,1fr) 244px!important;gap:10px!important;align-items:center!important}
.quick-help-console{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr) 168px;gap:8px;align-items:center;height:100%;padding:6px 8px;border:1px solid rgba(231,218,244,.28);border-radius:18px;background:linear-gradient(180deg,rgba(18,13,24,.97),rgba(7,5,10,.98));box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 26px rgba(0,0,0,.30)}
.quick-help-console .help-console-title{white-space:nowrap;min-height:34px;display:grid;place-items:center;padding:0 11px;border:1px solid rgba(220,193,255,.45);border-radius:11px;background:linear-gradient(180deg,#2e1743,#130b1d);font-size:9px;letter-spacing:.16em;font-weight:900;color:#fff;box-shadow:inset 0 1px rgba(255,255,255,.12),0 0 14px rgba(143,70,230,.16)}
.quick-help-track{display:flex;gap:7px;min-width:0;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;padding:1px}
.quick-help-track::-webkit-scrollbar{display:none}
.quick-help-card{flex:0 0 132px!important;min-width:132px!important;height:43px!important;display:grid!important;grid-template-columns:35px minmax(0,1fr)!important;align-items:center!important;gap:7px!important;padding:4px 8px 4px 4px!important;border:1px solid rgba(224,208,240,.34)!important;border-radius:14px!important;background:linear-gradient(180deg,rgba(28,20,36,.97),rgba(8,6,12,.98))!important;color:#fff!important;box-shadow:inset 0 1px rgba(255,255,255,.08),0 5px 14px rgba(0,0,0,.28)!important;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease!important}
.quick-help-card:hover,.quick-help-card.active{transform:translateY(-1px)!important;border-color:#f6edff!important;box-shadow:inset 0 1px rgba(255,255,255,.15),0 7px 18px rgba(0,0,0,.4),0 0 16px rgba(152,74,255,.24)!important}
.quick-help-card .mode-card-art{width:35px!important;height:35px!important;object-fit:cover!important;border-radius:10px!important;border:1px solid rgba(232,216,255,.48)!important}
.quick-help-card .mode-card-copy{min-width:0!important;text-align:left!important}
.quick-help-card .visual-mode-label{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;font:700 11px/1.05 Georgia,serif!important}
.quick-help-card .visual-mode-desc{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;margin-top:3px!important;color:#cfc5d7!important;font-size:7.5px!important;line-height:1!important}
.quick-help-search{height:43px;display:grid;grid-template-columns:auto minmax(0,1fr) 34px;align-items:center;gap:5px;padding:0 4px 0 10px;border:1px solid rgba(224,208,240,.32);border-radius:14px;background:#07060a;color:#dcbcff}
.quick-help-search input{min-width:0;width:100%;height:100%;border:0!important;outline:0!important;background:transparent!important;color:#fff!important;font-size:11px!important;padding:0!important}
.quick-help-search button{width:34px!important;height:34px!important;min-width:34px!important;border-radius:10px!important}
.mobile-mode-section{display:none!important}

.listening-world{display:flex!important;flex-direction:column!important;gap:12px!important}
.listening-world>h2{margin:0!important;font-size:27px!important;line-height:.95!important}
.rail-world-card,.rail-playlists{margin:0!important;padding:10px!important;border:1px solid rgba(224,205,243,.28)!important;border-radius:17px!important;background:linear-gradient(180deg,rgba(26,17,35,.78),rgba(7,5,10,.96))!important;box-shadow:inset 0 1px rgba(255,255,255,.07),0 10px 24px rgba(0,0,0,.26)!important}
.rail-section-kicker{font-size:8px;letter-spacing:.16em;font-weight:900;color:#c78cff;margin-bottom:7px}
.rail-section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}
.rail-section-head h2{margin:1px 0 0!important;font-size:22px!important}
.rail-mini-action{width:34px!important;height:34px!important;min-width:34px!important;border-radius:11px!important;border:1px solid rgba(239,224,255,.52)!important;background:linear-gradient(160deg,#6d2ba5,#21102f)!important;color:#fff!important;font-size:20px!important;box-shadow:inset 0 1px rgba(255,255,255,.18),0 0 13px rgba(151,70,240,.26)!important}
.continue-card,.recommend-card{width:100%;display:grid;grid-template-columns:62px minmax(0,1fr);gap:9px;align-items:center;text-align:left;padding:7px;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));color:#fff;cursor:pointer}
.continue-card img,.recommend-card img{width:62px;height:62px;object-fit:cover;border-radius:11px;border:1px solid rgba(232,213,255,.45)}
.continue-card span,.recommend-card span{min-width:0;display:block}
.continue-card small,.recommend-card small{display:block;color:#ca93ff;font-size:7px;letter-spacing:.08em;font-weight:900}
.continue-card strong,.recommend-card strong{display:block;margin:4px 0 3px;font:700 13px/1.05 Georgia,serif;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.continue-card em,.recommend-card em{display:block;color:#cfc7d5;font-size:8px;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.continue-card b,.recommend-card b{display:inline-block;margin-top:6px;color:#fff;font-size:9px}
.playlist-collectible{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 34px 28px;gap:5px;margin:7px 0}
.playlist-collectible .playlist-open{display:grid!important;grid-template-columns:52px minmax(0,1fr)!important;gap:8px!important;padding:6px!important;min-height:65px!important}
.playlist-mosaic{width:52px;height:52px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;overflow:hidden;border-radius:11px;border:1px solid rgba(232,213,255,.46);box-shadow:0 5px 13px rgba(0,0,0,.35)}
.playlist-mosaic i{background-position:center;background-size:cover;min-width:0;min-height:0}
.playlist-card-copy{min-width:0;display:block}
.playlist-card-copy small{display:block!important;color:#c98eff!important;font-size:6.5px!important;letter-spacing:.05em!important}
.playlist-card-copy strong{display:block!important;margin:3px 0!important;font:700 11px/1.05 Georgia,serif!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.playlist-card-copy em{display:block;color:#cfc7d5;font-size:7px;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.playlist-progress{display:block;height:3px;margin-top:6px;border-radius:999px;background:rgba(255,255,255,.10);overflow:hidden}
.playlist-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8e39ee,#fff);box-shadow:0 0 8px #a34cff}
.playlist-collectible .playlist-play-mini{height:auto!important;min-height:65px!important;border-radius:12px!important;background:linear-gradient(160deg,#642599,#251031)!important}
.playlist-collectible .playlist-delete{height:28px!important;min-height:28px!important;align-self:start!important;border-radius:9px!important;font-size:12px!important}
.rail-quick-actions{border-top:1px solid rgba(255,255,255,.10);padding-top:8px}
.rail-quick-actions summary{cursor:pointer;color:#cfc4d7;font-size:10px;font-weight:800;letter-spacing:.06em}
.rail-quick-actions button{margin-top:7px!important}

@media(max-width:1180px){
 .quick-help-bar{grid-template-columns:minmax(0,1fr) 220px!important}
 .quick-help-console{grid-template-columns:auto minmax(0,1fr) 132px}
 .quick-help-card{flex-basis:116px!important;min-width:116px!important}
 .quick-help-card .visual-mode-desc{display:none!important}
}
@media(max-width:860px){
 .quick-help-bar{display:block!important;min-height:54px!important;height:54px!important;padding:5px 7px!important;margin:0!important}
 .quick-help-console{height:44px!important;grid-template-columns:auto minmax(0,1fr);gap:6px;padding:4px!important;border-radius:14px!important}
 .quick-help-console .help-console-title{min-height:34px!important;font-size:8px!important;padding:0 8px!important}
 .quick-help-track{height:36px!important;gap:6px!important}
 .quick-help-card{flex-basis:110px!important;min-width:110px!important;height:36px!important;grid-template-columns:29px minmax(0,1fr)!important;padding:3px 6px 3px 3px!important;border-radius:11px!important}
 .quick-help-card .mode-card-art{width:29px!important;height:29px!important;border-radius:8px!important}
 .quick-help-card .visual-mode-label{font-size:9px!important}
 .quick-help-card .visual-mode-desc{display:none!important}
 .quick-help-search{display:none!important}
 .quick-help-bar>.premium{display:none!important}
 .listening-world{display:none!important}
}

/* =========================================================
   V70 — SEPARATE QUICK-HELP ROW + RESTORED SEARCH CONSOLE
   ========================================================= */
.quick-help-row{
  min-width:0; margin:0 0 10px; padding:7px 9px;
  border:1px solid rgba(226,210,242,.30); border-radius:19px;
  background:linear-gradient(180deg,rgba(18,13,24,.96),rgba(7,5,10,.99));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.30);
}
.quick-help-row .quick-help-track{
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px;
  overflow:visible; padding:0;
}
.quick-help-row .quick-help-card{
  min-width:0!important; width:100%!important; height:52px!important;
  display:grid!important; grid-template-columns:40px minmax(0,1fr)!important;
  gap:8px!important; padding:5px 9px 5px 5px!important; border-radius:14px!important;
  border:1px solid rgba(226,211,242,.32)!important;
  background:linear-gradient(180deg,rgba(29,20,38,.98),rgba(7,5,10,.99))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.08),0 6px 16px rgba(0,0,0,.32)!important;
}
.quick-help-row .quick-help-card .mode-card-art{width:40px!important;height:40px!important;border-radius:11px!important}
.quick-help-row .quick-help-card .visual-mode-label{font-size:12px!important;line-height:1.02!important}
.quick-help-row .quick-help-card .visual-mode-desc{font-size:7.5px!important;margin-top:3px!important}
.quick-help-row .quick-help-card:hover,.quick-help-row .quick-help-card.active{
  transform:translateY(-2px)!important; border-color:#f5edff!important;
  box-shadow:inset 0 1px rgba(255,255,255,.16),0 9px 22px rgba(0,0,0,.42),0 0 18px rgba(148,69,239,.26)!important;
}
/* Restore the proven search console rather than combining it with the modes. */
.topbar{display:grid!important;grid-template-columns:minmax(0,1fr) 244px!important;gap:10px!important;align-items:center!important}
.topbar .search-wrap{display:grid!important;grid-template-columns:auto auto minmax(0,1fr) auto!important;align-items:center!important;min-height:58px!important;padding:6px 7px 6px 10px!important;column-gap:8px!important}
.topbar .search-wrap input{font-size:14px!important}
.topbar .premium{display:flex!important}

/* Clean, calm right rail: one job per card, no crowded dashboard feeling. */
.listening-world-refined{display:flex!important;flex-direction:column!important;gap:10px!important;padding-top:2px!important}
.world-heading{padding:2px 2px 4px;border-bottom:1px solid rgba(255,255,255,.10)}
.world-heading small{display:block;color:#c891ff;font-size:8px;font-weight:900;letter-spacing:.17em}
.world-heading h2{margin:5px 0 0!important;font-size:23px!important;line-height:.96!important}
.listening-world-refined .rail-world-card,.listening-world-refined .rail-playlists{
  padding:9px!important;border-radius:15px!important;background:linear-gradient(180deg,rgba(21,14,29,.84),rgba(6,5,9,.97))!important;
  border-color:rgba(225,207,244,.24)!important;box-shadow:inset 0 1px rgba(255,255,255,.055),0 8px 20px rgba(0,0,0,.25)!important;
}
.listening-world-refined .rail-section-head h2{font-size:20px!important}
.listening-world-refined .continue-card,.listening-world-refined .recommend-card{grid-template-columns:54px minmax(0,1fr);gap:8px;padding:6px;border-radius:12px}
.listening-world-refined .continue-card img,.listening-world-refined .recommend-card img{width:54px;height:54px;border-radius:9px}
.listening-world-refined .continue-card strong,.listening-world-refined .recommend-card strong{font-size:12px}
.listening-world-refined .playlist-collectible{grid-template-columns:minmax(0,1fr) 32px 24px;gap:4px;margin:6px 0}
.listening-world-refined .playlist-collectible .playlist-open{grid-template-columns:45px minmax(0,1fr)!important;min-height:57px!important;padding:5px!important}
.listening-world-refined .playlist-mosaic{width:45px;height:45px;border-radius:9px}
.listening-world-refined .playlist-card-copy strong{font-size:10px!important}
.listening-world-refined .playlist-collectible .playlist-play-mini{min-height:57px!important}
.listening-world-refined .world-progress{margin-top:0!important;padding:9px!important}
.listening-world-refined .world-progress h3{font-size:18px!important;margin:0 0 7px!important}
.listening-world-refined .elite-progress-grid{gap:5px!important}
.listening-world-refined .elite-progress-grid>div{padding:7px 3px!important}
.listening-world-refined .elite-progress-grid strong{font-size:15px!important}
.listening-world-refined .elite-progress-grid small{font-size:7px!important}

@media(max-width:1180px){
 .quick-help-row .quick-help-card .visual-mode-desc{display:none!important}
 .quick-help-row .quick-help-card{height:47px!important;grid-template-columns:36px minmax(0,1fr)!important}
 .quick-help-row .quick-help-card .mode-card-art{width:36px!important;height:36px!important}
 .topbar{grid-template-columns:minmax(0,1fr) 220px!important}
}
@media(max-width:860px){
 .quick-help-row{height:44px!important;min-height:44px!important;margin:0 0 6px!important;padding:4px 5px!important;border-radius:13px!important;overflow:hidden}
 .quick-help-row .quick-help-track{display:flex!important;gap:5px!important;height:34px!important;overflow-x:auto!important;scroll-snap-type:x proximity;padding:0!important}
 .quick-help-row .quick-help-card{flex:0 0 92px!important;min-width:92px!important;width:92px!important;height:34px!important;grid-template-columns:27px minmax(0,1fr)!important;gap:5px!important;padding:3px 5px 3px 3px!important;border-radius:10px!important;scroll-snap-align:start}
 .quick-help-row .quick-help-card .mode-card-art{width:27px!important;height:27px!important;border-radius:7px!important}
 .quick-help-row .quick-help-card .visual-mode-label{font-size:8.5px!important}
 .quick-help-row .quick-help-card .visual-mode-desc{display:none!important}
 .topbar{display:block!important}
 .topbar .search-wrap{min-height:48px!important;padding:4px 5px 4px 7px!important;column-gap:6px!important}
 .topbar .search-wrap input{font-size:11px!important}
 .topbar .premium{display:none!important}
 .listening-world-refined{display:none!important}
}

/* =========================================================
   V71 — ICON-ONLY QUICK HELP RAIL
   Desktop/tablet: clean jewel icons in a horizontal rail.
   Mobile: hidden to preserve the proven first-screen layout.
   ========================================================= */
.quick-help-row{
  min-height:62px!important;
  margin:0 0 8px!important;
  padding:5px 10px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.quick-help-row .quick-help-track{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:14px!important;
  min-width:0!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:2px 4px 7px!important;
  scroll-snap-type:x proximity!important;
  scrollbar-width:none!important;
  overscroll-behavior-inline:contain!important;
}
.quick-help-row .quick-help-track::-webkit-scrollbar{display:none!important}
.quick-help-row .quick-help-card{
  position:relative!important;
  flex:0 0 52px!important;
  min-width:52px!important;
  width:52px!important;
  height:52px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  box-shadow:none!important;
  scroll-snap-align:center!important;
  overflow:visible!important;
  transform:none!important;
}
.quick-help-row .quick-help-card .mode-card-copy{display:none!important}
.quick-help-row .quick-help-card .mode-card-art{
  width:48px!important;
  height:48px!important;
  border-radius:50%!important;
  object-fit:cover!important;
  border:1px solid rgba(239,227,255,.65)!important;
  background:#050307!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -7px 12px rgba(0,0,0,.42),
    0 7px 16px rgba(0,0,0,.48),
    0 0 0 2px rgba(118,42,178,.18),
    0 0 13px rgba(143,65,228,.22)!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,filter .18s ease!important;
}
.quick-help-row .quick-help-card:hover .mode-card-art,
.quick-help-row .quick-help-card:focus-visible .mode-card-art{
  transform:translateY(-2px) scale(1.06)!important;
  border-color:#fff!important;
  filter:brightness(1.08) saturate(1.08)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -7px 12px rgba(0,0,0,.38),
    0 10px 22px rgba(0,0,0,.55),
    0 0 0 2px rgba(194,139,255,.34),
    0 0 22px rgba(156,72,255,.46)!important;
}
.quick-help-row .quick-help-card.active .mode-card-art{
  transform:translateY(-1px) scale(1.07)!important;
  border-color:#fff!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.40),
    inset 0 -7px 12px rgba(0,0,0,.32),
    0 10px 24px rgba(0,0,0,.58),
    0 0 0 2px rgba(255,255,255,.36),
    0 0 0 4px rgba(116,35,179,.42),
    0 0 25px rgba(169,82,255,.58)!important;
}
.quick-help-row .quick-help-card.active::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-5px;
  width:5px;
  height:5px;
  border-radius:50%;
  transform:translateX(-50%);
  background:#fff;
  box-shadow:0 0 8px #fff,0 0 14px #9e46ff;
}
@media(max-width:1180px){
  .quick-help-row .quick-help-track{justify-content:flex-start!important;gap:11px!important}
  .quick-help-row .quick-help-card{flex-basis:48px!important;min-width:48px!important;width:48px!important;height:48px!important}
  .quick-help-row .quick-help-card .mode-card-art{width:44px!important;height:44px!important}
}
@media(max-width:860px){
  .quick-help-row{display:none!important}
}

/* =========================================================
   V72 — PLAYLIST-FIRST LISTENING WORLD
   Quick-help jewels move beneath Playlists in the desktop rail.
   Mobile gets a persistent Playlists destination without changing
   the proven first-screen composition.
   ========================================================= */
.quick-help-row{display:none!important}
.rail-help{order:3!important}
.recommended-world{order:4!important}
.rail-quick-actions{order:5!important}
.world-progress{order:6!important}
.rail-help .rail-section-head{margin:2px 0 8px!important}
.rail-help .rail-section-head h2{font-size:18px!important;line-height:1!important;margin:0!important}
.rail-help-icons{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:6px!important;
  align-items:center!important;
}
.rail-help-icons .quick-help-card{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  min-width:0!important;
  width:100%!important;
  aspect-ratio:1!important;
  padding:2px!important;
  border:1px solid rgba(224,208,240,.22)!important;
  border-radius:13px!important;
  background:linear-gradient(180deg,rgba(22,15,30,.95),rgba(5,4,8,.98))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.08),0 6px 13px rgba(0,0,0,.34)!important;
  overflow:hidden!important;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease!important;
}
.rail-help-icons .mode-card-copy{display:none!important}
.rail-help-icons .mode-card-art{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  border-radius:10px!important;
  border:0!important;
  box-shadow:none!important;
}
.rail-help-icons .quick-help-card:hover,
.rail-help-icons .quick-help-card:focus-visible,
.rail-help-icons .quick-help-card.active{
  transform:translateY(-2px)!important;
  border-color:#f4eaff!important;
  box-shadow:inset 0 1px rgba(255,255,255,.18),0 9px 18px rgba(0,0,0,.48),0 0 18px rgba(151,69,244,.34)!important;
}
.rail-help-icons .quick-help-card.active::after{
  content:"";
  position:absolute;
  left:50%;bottom:2px;
  width:4px;height:4px;border-radius:50%;
  transform:translateX(-50%);
  background:#fff;
  box-shadow:0 0 8px #fff,0 0 13px #9141ef;
}

/* Persistent mobile playlist destination. */
@media(max-width:860px){
  .mobile-nav button[data-nav="playlists"]{
    color:#fff!important;
    background:radial-gradient(circle at 50% 30%,rgba(159,77,255,.34),rgba(36,15,54,.18) 58%,transparent 72%)!important;
    text-shadow:0 0 10px #a758ff!important;
  }
  .mobile-nav button[data-nav="playlists"] span{
    display:grid!important;place-items:center!important;
    width:27px!important;height:27px!important;margin:0 auto 1px!important;
    border:1px solid rgba(245,232,255,.72)!important;border-radius:9px!important;
    background:linear-gradient(180deg,#7d35bd,#25102f)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.28),0 0 15px rgba(154,70,247,.42)!important;
  }
}
.mobile-playlist-hub{width:min(94vw,560px);max-height:86vh;padding:0;border:1px solid rgba(233,214,255,.5);border-radius:24px;background:#08060c;color:#fff;box-shadow:0 30px 90px rgba(0,0,0,.75),0 0 36px rgba(126,50,210,.26)}
.mobile-playlist-hub::backdrop{background:rgba(2,1,4,.82);backdrop-filter:blur(10px)}
.mobile-playlist-shell{padding:16px}
.mobile-playlist-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.12)}
.mobile-playlist-head small{display:block;color:#c78cff;font-size:8px;font-weight:900;letter-spacing:.17em}
.mobile-playlist-head h2{margin:4px 0 3px;font:600 27px/1 Georgia,serif}
.mobile-playlist-head p{margin:0;color:#bdb2c7;font-size:11px}
.mobile-playlist-head>button{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.42);background:#110b17;color:#fff;font-size:22px}
.mobile-playlist-list{max-height:58vh;overflow:auto;padding:10px 1px}
.mobile-playlist-list .playlist-collectible{grid-template-columns:minmax(0,1fr) 42px 32px!important;gap:6px!important;margin:8px 0!important}
.mobile-playlist-list .playlist-open{grid-template-columns:64px minmax(0,1fr)!important;min-height:76px!important;padding:7px!important}
.mobile-playlist-list .playlist-mosaic{width:64px!important;height:64px!important;border-radius:12px!important}
.mobile-playlist-list .playlist-card-copy strong{font-size:14px!important}
.mobile-playlist-list .playlist-card-copy small{font-size:8px!important}
.mobile-playlist-list .playlist-card-copy em{font-size:9px!important}
.mobile-playlist-list .playlist-play-mini{min-height:76px!important;border-radius:14px!important;font-size:17px!important}
.mobile-create-playlist{width:100%;min-height:52px;margin-top:8px;border:2px solid #fff;border-radius:16px;background:linear-gradient(180deg,#6c2ba7,#271034);color:#fff;font-weight:900;letter-spacing:.04em;box-shadow:inset 0 1px rgba(255,255,255,.28),0 10px 24px rgba(0,0,0,.45),0 0 20px rgba(147,65,239,.28)}
@media(min-width:861px){.mobile-playlist-hub{display:none}}

/* =========================================================
   V73 — RECOMMENDED NEXT FIRST + REFINED HELP JEWELS
   The listening rail now prioritizes playlists and the next
   best experience. Recommended Help closes the rail beneath
   progress as a compact, collectible jewel set.
   ========================================================= */
.recommended-world{order:3!important}
.rail-quick-actions{order:4!important}
.world-progress{order:5!important}
.rail-help{order:6!important;margin-top:0!important}
.rail-help .rail-section-head{margin:0 0 10px!important}
.rail-help .rail-section-head h2{
  margin:0!important;
  font-size:18px!important;
  line-height:1!important;
  letter-spacing:-.015em!important;
}
.rail-help-icons{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:8px!important;
  align-items:center!important;
  justify-items:center!important;
  padding:2px 1px 1px!important;
}
.rail-help-icons .quick-help-card{
  grid-column:span 2;
  width:100%!important;
  max-width:62px!important;
  min-width:0!important;
  aspect-ratio:1!important;
  padding:3px!important;
  border:1px solid rgba(241,231,255,.48)!important;
  border-radius:18px!important;
  background:
    radial-gradient(circle at 50% 26%,rgba(174,94,255,.19),transparent 48%),
    linear-gradient(180deg,rgba(24,16,31,.98),rgba(4,3,7,.99))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -8px 18px rgba(0,0,0,.38),
    0 8px 18px rgba(0,0,0,.46),
    0 0 0 1px rgba(116,54,165,.16)!important;
}
.rail-help-icons .quick-help-card:nth-child(4){grid-column:2 / span 2}
.rail-help-icons .quick-help-card:nth-child(5){grid-column:4 / span 2}
.rail-help-icons .mode-card-art{
  width:100%!important;
  height:100%!important;
  border-radius:14px!important;
  object-fit:cover!important;
  filter:saturate(1.08) contrast(1.05)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)!important;
}
.rail-help-icons .quick-help-card:hover,
.rail-help-icons .quick-help-card:focus-visible,
.rail-help-icons .quick-help-card.active{
  transform:translateY(-3px) scale(1.025)!important;
  border-color:#fff!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    inset 0 -8px 18px rgba(0,0,0,.34),
    0 12px 22px rgba(0,0,0,.55),
    0 0 18px rgba(161,77,255,.42),
    0 0 0 1px rgba(238,224,255,.34)!important;
}
.rail-help-icons .quick-help-card.active::after{
  bottom:-1px!important;
  width:5px!important;
  height:5px!important;
  background:#fff!important;
  box-shadow:0 0 8px #fff,0 0 16px #9f4eff!important;
}
@media(max-width:1180px) and (min-width:861px){
  .rail-help-icons{gap:6px!important}
  .rail-help-icons .quick-help-card{max-width:56px!important;border-radius:16px!important}
  .rail-help-icons .mode-card-art{border-radius:12px!important}
}


/* =========================================================
   V74 — FULL CHOOSE-WHAT-HELPS CARDS BELOW PLAYLISTS
   Restore the clear large-card presentation from the original
   right rail, but keep Playlists above it as the higher priority.
   ========================================================= */
.recommended-world{order:4!important}
.rail-quick-actions{order:5!important}
.world-progress{order:6!important}
.rail-help{
  order:3!important;
  margin-top:0!important;
  padding:12px 10px!important;
  border:1px solid rgba(226,211,241,.34)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(18,12,24,.98),rgba(7,5,10,.99))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 25px rgba(0,0,0,.34)!important;
}
.rail-help .rail-section-head{
  margin:0 0 10px!important;
  padding:0 0 9px!important;
  border-bottom:1px solid rgba(255,255,255,.14)!important;
}
.rail-help .rail-section-head h2{
  margin:0!important;
  font:700 25px/.9 Georgia,serif!important;
  letter-spacing:-.025em!important;
  color:#fff!important;
}
.rail-help-icons{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:9px!important;
  padding:0!important;
}
.rail-help-icons .quick-help-card,
.rail-help-icons .quick-help-card:nth-child(4),
.rail-help-icons .quick-help-card:nth-child(5){
  grid-column:auto!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  aspect-ratio:auto!important;
  min-height:78px!important;
  display:grid!important;
  grid-template-columns:66px minmax(0,1fr)!important;
  align-items:center!important;
  gap:11px!important;
  padding:8px!important;
  border:1px solid rgba(229,216,243,.44)!important;
  border-radius:16px!important;
  background:
    radial-gradient(circle at 14% 30%,rgba(133,56,203,.20),transparent 40%),
    linear-gradient(180deg,rgba(22,15,29,.98),rgba(7,5,10,.99))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -10px 20px rgba(0,0,0,.28),
    0 8px 18px rgba(0,0,0,.38)!important;
  overflow:hidden!important;
  text-align:left!important;
}
.rail-help-icons .mode-card-art{
  display:block!important;
  width:66px!important;
  height:66px!important;
  object-fit:cover!important;
  border-radius:14px!important;
  border:1px solid rgba(237,225,255,.72)!important;
  filter:saturate(1.08) contrast(1.05)!important;
  box-shadow:0 0 0 2px rgba(52,18,72,.9),0 0 17px rgba(145,63,225,.24)!important;
}
.rail-help-icons .mode-card-copy{
  display:block!important;
  min-width:0!important;
  text-align:left!important;
}
.rail-help-icons .visual-mode-label{
  display:block!important;
  margin:0!important;
  color:#fff!important;
  font:700 20px/.92 Georgia,serif!important;
  letter-spacing:-.02em!important;
  white-space:normal!important;
  overflow:visible!important;
}
.rail-help-icons .visual-mode-desc{
  display:block!important;
  margin-top:7px!important;
  color:#eee8f1!important;
  font-size:10px!important;
  line-height:1.22!important;
  white-space:normal!important;
  overflow:visible!important;
}
.rail-help-icons .quick-help-card:hover,
.rail-help-icons .quick-help-card:focus-visible,
.rail-help-icons .quick-help-card.active{
  transform:translateY(-2px)!important;
  border-color:#fff!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.2),
    inset 0 -10px 20px rgba(0,0,0,.25),
    0 12px 22px rgba(0,0,0,.5),
    0 0 18px rgba(155,72,245,.34)!important;
}
.rail-help-icons .quick-help-card.active::after{
  content:''!important;
  position:absolute!important;
  left:0!important;
  top:12px!important;
  bottom:12px!important;
  width:3px!important;
  height:auto!important;
  border-radius:3px!important;
  background:#fff!important;
  box-shadow:0 0 10px #fff,0 0 18px #a14cff!important;
}
@media(max-width:1180px) and (min-width:861px){
  .rail-help{padding:10px 8px!important}
  .rail-help .rail-section-head h2{font-size:21px!important}
  .rail-help-icons .quick-help-card{grid-template-columns:55px minmax(0,1fr)!important;gap:8px!important;min-height:67px!important;padding:6px!important}
  .rail-help-icons .mode-card-art{width:55px!important;height:55px!important;border-radius:12px!important}
  .rail-help-icons .visual-mode-label{font-size:16px!important}
  .rail-help-icons .visual-mode-desc{font-size:8.5px!important;margin-top:5px!important}
}
@media(max-width:860px){
  .rail-help{display:none!important}
}


/* V75 — definitive sidebar priority and readability */
.listening-world-refined .world-progress{order:1!important}
.listening-world-refined .continue-world{order:2!important}
.listening-world-refined .recommended-world{order:3!important}
.listening-world-refined .rail-playlists{order:4!important}
.listening-world-refined .rail-help{order:5!important}
.listening-world-refined .rail-quick-actions{order:6!important}

.listening-world-refined .continue-card,
.listening-world-refined .recommend-card{
  grid-template-columns:58px minmax(0,1fr)!important;
  gap:10px!important;
  padding:8px!important;
  min-height:74px!important;
}
.listening-world-refined .continue-card img,
.listening-world-refined .recommend-card img{
  width:58px!important;height:58px!important;border-radius:10px!important;object-fit:cover!important;
}
.listening-world-refined .continue-card strong,
.listening-world-refined .recommend-card strong{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
  font-size:13px!important;
  line-height:1.12!important;
  white-space:normal!important;
}
.listening-world-refined .continue-card small,
.listening-world-refined .recommend-card small,
.listening-world-refined .continue-card p,
.listening-world-refined .recommend-card p{
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  line-height:1.25!important;
}
.listening-world-refined .playlist-card-copy{
  min-width:0!important;
}
.listening-world-refined .playlist-card-copy strong{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
  white-space:normal!important;
  font-size:11px!important;
  line-height:1.1!important;
}
.listening-world-refined .playlist-card-copy small{
  display:block!important;
  white-space:normal!important;
  line-height:1.2!important;
  font-size:8px!important;
}
.listening-world-refined .rail-help-icons .mode-card-copy{display:block!important;min-width:0!important}
.listening-world-refined .rail-help-icons .visual-mode-label{
  display:block!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  font-size:15px!important;
  line-height:1.05!important;
}
.listening-world-refined .rail-help-icons .visual-mode-desc{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:3!important;
  overflow:hidden!important;
  white-space:normal!important;
  font-size:8.5px!important;
  line-height:1.25!important;
}
.listening-world-refined .rail-help-icons .quick-help-card,
.listening-world-refined .rail-help-icons .quick-help-card:nth-child(4),
.listening-world-refined .rail-help-icons .quick-help-card:nth-child(5){
  grid-column:auto!important;
  max-width:none!important;
  width:100%!important;
}
.listening-world-refined .rail-help-icons{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:8px!important;
}
.listening-world-refined .rail-help-icons .quick-help-card{
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr)!important;
  gap:10px!important;
  min-height:72px!important;
  padding:7px!important;
  align-items:center!important;
}
.listening-world-refined .rail-help-icons .mode-card-art{
  width:58px!important;height:58px!important;border-radius:12px!important;object-fit:cover!important;
}


/* V76 — expanded learning progress map + fully readable help cards */
.progress-heading-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.progress-heading-row h3{margin:0!important}
.progress-heading-row>strong{font-size:13px;color:#fff;padding:5px 8px;border:1px solid rgba(231,218,248,.34);border-radius:999px;background:rgba(0,0,0,.32);white-space:nowrap}
.listening-world-refined .elite-progress-grid-expanded{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
.listening-world-refined .elite-progress-grid-expanded>div{min-height:54px!important;padding:7px 4px!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
.listening-world-refined .elite-progress-grid-expanded strong{font-size:14px!important;line-height:1!important}
.listening-world-refined .elite-progress-grid-expanded small{display:block!important;margin-top:5px!important;font-size:7.5px!important;line-height:1.15!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
.listening-world-refined .rail-help{overflow:visible!important}
.listening-world-refined .rail-help-icons .quick-help-card{height:auto!important;min-height:78px!important;overflow:visible!important}
.listening-world-refined .rail-help-icons .mode-card-copy{overflow:visible!important}
.listening-world-refined .rail-help-icons .visual-mode-label{-webkit-line-clamp:unset!important;overflow:visible!important}
.listening-world-refined .rail-help-icons .visual-mode-desc{display:block!important;-webkit-line-clamp:unset!important;overflow:visible!important;max-height:none!important}
@media(max-width:1180px) and (min-width:861px){
  .listening-world-refined .elite-progress-grid-expanded small{font-size:7px!important}
  .listening-world-refined .rail-help-icons .quick-help-card{grid-template-columns:52px minmax(0,1fr)!important;gap:8px!important;min-height:74px!important}
  .listening-world-refined .rail-help-icons .mode-card-art{width:52px!important;height:52px!important}
  .listening-world-refined .rail-help-icons .visual-mode-label{font-size:14px!important}
  .listening-world-refined .rail-help-icons .visual-mode-desc{font-size:8px!important;line-height:1.2!important}
}


/* V77 — Full Library Flow + Exact Duration Intelligence */
.duration-badge{position:absolute;right:9px;bottom:9px;z-index:4;padding:5px 8px;border-radius:999px;background:rgba(2,2,4,.88);border:1px solid rgba(255,255,255,.72);box-shadow:0 5px 16px rgba(0,0,0,.55),inset 0 1px rgba(255,255,255,.12);color:#fff;font-size:9px;font-weight:850;letter-spacing:.04em;backdrop-filter:blur(8px)}
.cover-button{position:relative}
.lock-badge{position:absolute;left:9px;top:9px;z-index:4;padding:5px 8px;border-radius:999px;background:#f8f7fb;color:#08070b;border:1px solid #fff;font-size:9px;font-weight:950;box-shadow:0 0 18px rgba(181,124,255,.48)}
.card-kicker{margin-bottom:5px;color:#d8b978;font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.card.is-locked .cover{filter:saturate(.78) brightness(.72)}
.card.is-locked:hover .cover{filter:saturate(.95) brightness(.9)}
.section-head{gap:14px}
.section-head>div{min-width:0}
.section-jump{flex:0 0 auto;min-height:42px;padding:0 15px;border-radius:16px;border:1px solid rgba(245,242,250,.84);background:linear-gradient(180deg,#111117,#030305);color:#fff;font-weight:850;box-shadow:inset 0 1px rgba(255,255,255,.18),0 8px 18px rgba(0,0,0,.35),0 0 14px rgba(139,61,255,.15)}
.section-jump:hover{transform:translateY(-2px);box-shadow:inset 0 1px rgba(255,255,255,.28),0 12px 24px rgba(0,0,0,.48),0 0 20px rgba(139,61,255,.28)}
.library-section{scroll-margin-top:100px}
.library-flow{align-items:stretch}
.library-flow .card{height:100%}
@media(max-width:860px){
  .section-head{align-items:center}
  .section-head h2{font-size:21px!important}
  .section-head p{font-size:10px!important;line-height:1.35}
  .section-jump{min-height:38px;padding:0 11px;font-size:10px}
  .library-flow{display:flex!important;overflow-x:auto;scroll-snap-type:x proximity;gap:10px;padding:2px 2px 12px;scrollbar-width:thin}
  .library-flow .card{flex:0 0 min(78vw,300px);scroll-snap-align:start}
  .duration-badge{font-size:8px;right:7px;bottom:7px}
}
@media(max-width:480px){
  .section-head{align-items:flex-start}
  .section-jump{font-size:0;width:38px;padding:0}
  .section-jump:after{content:'›';font-size:24px;line-height:1}
  .library-flow .card{flex-basis:min(82vw,285px)}
}


/* V78 — Individual Category Progress: six clear learning paths, no compressed total */
.listening-world-refined .world-progress{padding:13px!important}
.listening-world-refined .world-progress h3{margin-bottom:10px!important}
.listening-world-refined .elite-progress-grid-expanded{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
.listening-world-refined .elite-progress-grid-expanded>div{min-width:0!important;min-height:62px!important;padding:8px 6px 7px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;border:1px solid rgba(222,199,255,.28)!important;border-radius:13px!important;background:linear-gradient(150deg,rgba(50,23,68,.58),rgba(4,4,8,.82))!important;box-shadow:inset 0 1px rgba(255,255,255,.08),0 6px 14px rgba(0,0,0,.28)!important}
.listening-world-refined .elite-progress-grid-expanded strong{font-size:15px!important;line-height:1!important;color:#fff!important;white-space:nowrap!important}
.listening-world-refined .elite-progress-grid-expanded small{display:block!important;width:100%!important;margin-top:5px!important;font-size:7.5px!important;line-height:1.15!important;text-align:center!important;color:#d8cce4!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
.category-progress{display:block;width:82%;height:3px;margin-top:7px;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.65)}
.category-progress i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7d24d8,#bc73ff,#fff);box-shadow:0 0 8px rgba(179,102,255,.72);transition:width .35s ease}
@media(max-width:1180px) and (min-width:861px){
  .listening-world-refined .elite-progress-grid-expanded>div{min-height:58px!important;padding:7px 4px 6px!important}
  .listening-world-refined .elite-progress-grid-expanded strong{font-size:13px!important}
  .listening-world-refined .elite-progress-grid-expanded small{font-size:6.8px!important}
}


/* =========================================================
   V80 — MOBILE LIBRARY IMMERSION
   Collapsible mini-player, expandable vertical collections,
   less duplicate promotion, and more browsing space.
   ========================================================= */
.section-view-all{flex:0 0 auto;min-height:42px;padding:0 15px;border-radius:16px;border:1px solid rgba(245,242,250,.84);background:linear-gradient(180deg,#111117,#030305);color:#fff;font-weight:850;box-shadow:inset 0 1px rgba(255,255,255,.18),0 8px 18px rgba(0,0,0,.35),0 0 14px rgba(139,61,255,.15)}
.section-view-all:hover{transform:translateY(-2px);box-shadow:inset 0 1px rgba(255,255,255,.28),0 12px 24px rgba(0,0,0,.48),0 0 20px rgba(139,61,255,.28)}
.mobile-player-toggle{display:none}
@media(max-width:860px){
  :root{--mobile-player-expanded:148px;--mobile-player-mini:58px}
  .section-view-all{display:inline-flex!important;align-items:center;justify-content:center;min-height:38px;padding:0 11px;font-size:10px;white-space:nowrap}
  .library-section.mobile-expanded .library-flow{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;overflow:visible!important;scroll-snap-type:none!important;padding-bottom:8px!important}
  .library-section.mobile-expanded .library-flow .card{width:auto!important;max-width:none!important;min-width:0!important;flex:auto!important}
  .library-section.mobile-expanded .card h3{font-size:13px!important}
  .library-section.mobile-expanded .card-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .bottom-player{transition:height .25s ease,transform .25s ease,padding .25s ease,grid-template-columns .25s ease!important;overflow:visible!important}
  .mobile-player-toggle{display:grid;place-items:center;position:absolute;right:8px;top:-18px;width:36px;height:22px;border:1px solid rgba(233,214,255,.72);border-bottom:0;border-radius:12px 12px 0 0;background:linear-gradient(180deg,#5f2795,#160c21);color:#fff;font-size:16px;font-weight:900;box-shadow:0 -5px 14px rgba(0,0,0,.35),0 0 12px rgba(151,70,239,.3);z-index:3}
  .bottom-player.mobile-collapsed{height:var(--mobile-player-mini)!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;padding:5px 46px 5px 8px!important}
  .bottom-player.mobile-collapsed .bottom-meta{display:block!important;padding-left:2px!important}
  .bottom-player.mobile-collapsed .bottom-meta strong{font-size:12px!important}
  .bottom-player.mobile-collapsed .bottom-meta small{font-size:8px!important}
  .bottom-player.mobile-collapsed .bottom-seek-row{position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:3px!important;display:block!important}
  .bottom-player.mobile-collapsed .bottom-seek-row span{display:none!important}
  .bottom-player.mobile-collapsed .bottom-seek-row input{display:block!important;width:100%!important;height:3px!important;margin:0!important}
  .bottom-player.mobile-collapsed .bottom-controls{display:flex!important;justify-content:flex-end!important;gap:4px!important}
  .bottom-player.mobile-collapsed .bottom-controls button:not(#bottomPlay){display:none!important}
  .bottom-player.mobile-collapsed .bottom-play{display:grid!important;width:42px!important;height:42px!important;min-width:42px!important}
  .bottom-player.mobile-collapsed .bottom-volume-row{display:none!important}
  body.mobile-player-collapsed{padding-bottom:calc(var(--mobile-player-mini) + var(--mobile-nav-h) + env(safe-area-inset-bottom))!important}
  body.mobile-player-collapsed .bottom-player{bottom:var(--mobile-nav-h)!important}
  body.mobile-player-collapsed .mobile-nav{height:54px!important}
  body.mobile-player-collapsed .mobile-nav button{font-size:7px!important}
  body.mobile-player-collapsed .mobile-nav button span{font-size:15px!important}
}
@media(max-width:480px){
  .section-view-all{font-size:9px!important;min-width:82px!important;width:auto!important}
  .section-view-all:after{content:none!important}
  .library-section.mobile-expanded .library-flow{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .library-section.mobile-expanded .card-body{padding:8px!important}
  .library-section.mobile-expanded .card p{font-size:8px!important}
  .library-section.mobile-expanded .card-actions button{font-size:8px!important;min-height:32px!important}
}

/* =========================================================
   V81 — CLEAN MOBILE PLAYER DOCK
   Compact expanded dock + true mini-player. The collapse tab
   is centered and never overlaps the navigation or controls.
   ========================================================= */
@media(max-width:860px){
  :root{
    --mobile-player-expanded:118px;
    --mobile-player-mini:56px;
    --mobile-nav-h:58px;
  }
  body{
    padding-bottom:calc(var(--mobile-player-expanded) + var(--mobile-nav-h) + env(safe-area-inset-bottom))!important;
  }
  .bottom-player.bottom-player-advanced{
    left:0!important;
    right:0!important;
    bottom:var(--mobile-nav-h)!important;
    height:var(--mobile-player-expanded)!important;
    min-height:var(--mobile-player-expanded)!important;
    max-height:var(--mobile-player-expanded)!important;
    overflow:visible!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:64px 34px!important;
    grid-template-areas:"controls" "seek"!important;
    gap:4px!important;
    padding:8px 8px 8px!important;
    border-radius:18px 18px 0 0!important;
    background:linear-gradient(180deg,rgba(18,11,25,.985),rgba(5,3,8,.995))!important;
    border:1px solid rgba(229,207,255,.34)!important;
    border-bottom:0!important;
    box-shadow:0 -14px 34px rgba(0,0,0,.62),0 -2px 18px rgba(137,62,211,.18),inset 0 1px rgba(255,255,255,.08)!important;
    transition:height .22s ease,padding .22s ease,border-radius .22s ease!important;
  }
  .bottom-player .bottom-meta{display:none!important}
  .bottom-player .bottom-controls{
    grid-area:controls!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    min-width:0!important;
    overflow:hidden!important;
  }
  .bottom-player .bottom-controls button{
    flex:0 0 40px!important;
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    min-height:40px!important;
    font-size:11px!important;
  }
  .bottom-player .bottom-controls #bottomShuffle,
  .bottom-player .bottom-controls #bottomShare{display:none!important}
  .bottom-player .bottom-controls #bottomPlay{
    flex-basis:54px!important;
    width:54px!important;
    min-width:54px!important;
    height:54px!important;
    min-height:54px!important;
    font-size:19px!important;
  }
  .bottom-player .bottom-seek-row{
    grid-area:seek!important;
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr) 38px!important;
    gap:7px!important;
    align-items:center!important;
    min-width:0!important;
    padding:0 2px!important;
    font-size:9px!important;
  }
  .bottom-player .bottom-seek-row input{min-width:0!important;width:100%!important}
  .bottom-player .bottom-volume-row{display:none!important}

  .mobile-player-toggle{
    display:grid!important;
    place-items:center!important;
    position:absolute!important;
    left:50%!important;
    right:auto!important;
    top:-15px!important;
    transform:translateX(-50%)!important;
    width:56px!important;
    height:24px!important;
    min-width:56px!important;
    min-height:24px!important;
    padding:0!important;
    border:1px solid rgba(240,225,255,.75)!important;
    border-bottom:0!important;
    border-radius:14px 14px 0 0!important;
    background:linear-gradient(180deg,#67309b,#1b0d27)!important;
    color:#fff!important;
    font-size:16px!important;
    line-height:1!important;
    box-shadow:0 -7px 16px rgba(0,0,0,.5),0 0 14px rgba(161,77,239,.35)!important;
    z-index:4!important;
  }

  .bottom-player.mobile-collapsed{
    height:var(--mobile-player-mini)!important;
    min-height:var(--mobile-player-mini)!important;
    max-height:var(--mobile-player-mini)!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 46px!important;
    grid-template-rows:1fr!important;
    grid-template-areas:"meta controls"!important;
    gap:8px!important;
    padding:6px 10px!important;
    border-radius:16px 16px 0 0!important;
  }
  .bottom-player.mobile-collapsed .bottom-meta{
    grid-area:meta!important;
    display:block!important;
    align-self:center!important;
    min-width:0!important;
    padding:0 2px!important;
  }
  .bottom-player.mobile-collapsed .bottom-meta strong{
    display:block!important;
    font-size:12px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .bottom-player.mobile-collapsed .bottom-meta small{
    display:block!important;
    margin-top:3px!important;
    font-size:8px!important;
    line-height:1!important;
    color:#c9bad3!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .bottom-player.mobile-collapsed .bottom-controls{
    grid-area:controls!important;
    display:grid!important;
    place-items:center!important;
    overflow:visible!important;
  }
  .bottom-player.mobile-collapsed .bottom-controls button:not(#bottomPlay){display:none!important}
  .bottom-player.mobile-collapsed .bottom-controls #bottomPlay{
    display:grid!important;
    place-items:center!important;
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    font-size:16px!important;
  }
  .bottom-player.mobile-collapsed .bottom-seek-row{
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    height:3px!important;
    padding:0!important;
    display:block!important;
    pointer-events:none!important;
  }
  .bottom-player.mobile-collapsed .bottom-seek-row span{display:none!important}
  .bottom-player.mobile-collapsed .bottom-seek-row input{
    display:block!important;
    width:100%!important;
    height:3px!important;
    min-height:3px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
  }
  body.mobile-player-collapsed{
    padding-bottom:calc(var(--mobile-player-mini) + var(--mobile-nav-h) + env(safe-area-inset-bottom))!important;
  }
  body.mobile-player-collapsed .mobile-nav{
    height:var(--mobile-nav-h)!important;
  }
  body.mobile-player-collapsed .mobile-nav button{
    font-size:9px!important;
  }
  body.mobile-player-collapsed .mobile-nav button span{
    font-size:18px!important;
  }
}
@media(max-width:390px){
  .bottom-player .bottom-controls{gap:3px!important}
  .bottom-player .bottom-controls button{flex-basis:36px!important;width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important;font-size:10px!important}
  .bottom-player .bottom-controls #bottomPlay{flex-basis:50px!important;width:50px!important;min-width:50px!important;height:50px!important;min-height:50px!important}
}

/* =========================================================
   V82 — MOBILE DOCK FORMAT FIX
   Integrates the collapse control inside the dock, removes the
   detached/clipped tab, and guarantees a clean compact layout.
   ========================================================= */
@media(max-width:860px){
  :root{
    --mobile-player-expanded:108px;
    --mobile-player-mini:58px;
    --mobile-nav-h:58px;
  }
  body{
    padding-bottom:calc(var(--mobile-player-expanded) + var(--mobile-nav-h) + env(safe-area-inset-bottom))!important;
  }
  .bottom-player.bottom-player-advanced{
    left:0!important;
    right:0!important;
    bottom:var(--mobile-nav-h)!important;
    height:var(--mobile-player-expanded)!important;
    min-height:var(--mobile-player-expanded)!important;
    max-height:var(--mobile-player-expanded)!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:60px 30px!important;
    grid-template-areas:"controls" "seek"!important;
    gap:2px!important;
    padding:8px 10px 8px!important;
    overflow:hidden!important;
    border-radius:18px 18px 0 0!important;
    background:linear-gradient(180deg,rgba(20,12,29,.99),rgba(5,3,8,.995))!important;
    border:1px solid rgba(231,211,255,.36)!important;
    border-bottom:0!important;
    box-shadow:0 -12px 32px rgba(0,0,0,.66),0 -2px 16px rgba(135,61,210,.18),inset 0 1px rgba(255,255,255,.08)!important;
  }
  .bottom-player .bottom-meta,
  .bottom-player .bottom-volume-row{display:none!important}
  .bottom-player .bottom-controls{
    grid-area:controls!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    min-width:0!important;
    overflow:hidden!important;
    padding:0 38px 0 0!important;
  }
  .bottom-player .bottom-controls button{
    flex:0 0 38px!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    min-height:38px!important;
    font-size:10px!important;
  }
  .bottom-player .bottom-controls #bottomShuffle,
  .bottom-player .bottom-controls #bottomShare{display:none!important}
  .bottom-player .bottom-controls #bottomPlay{
    flex-basis:52px!important;
    width:52px!important;
    min-width:52px!important;
    height:52px!important;
    min-height:52px!important;
    font-size:18px!important;
  }
  .bottom-player .bottom-seek-row{
    grid-area:seek!important;
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr) 36px!important;
    gap:7px!important;
    align-items:center!important;
    min-width:0!important;
    padding:0 2px!important;
    font-size:9px!important;
  }
  .bottom-player .bottom-seek-row input{width:100%!important;min-width:0!important}

  .mobile-player-toggle{
    display:grid!important;
    place-items:center!important;
    position:absolute!important;
    left:auto!important;
    right:8px!important;
    top:12px!important;
    transform:none!important;
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    min-height:32px!important;
    padding:0!important;
    border:1px solid rgba(239,224,255,.72)!important;
    border-radius:10px!important;
    background:linear-gradient(180deg,#4f246f,#170b20)!important;
    color:#fff!important;
    font-size:17px!important;
    font-weight:900!important;
    line-height:1!important;
    box-shadow:0 5px 13px rgba(0,0,0,.48),inset 0 1px rgba(255,255,255,.16)!important;
    z-index:7!important;
  }
  .mobile-player-toggle:focus-visible{outline:2px solid #fff!important;outline-offset:2px!important}

  .bottom-player.mobile-collapsed{
    height:var(--mobile-player-mini)!important;
    min-height:var(--mobile-player-mini)!important;
    max-height:var(--mobile-player-mini)!important;
    grid-template-columns:minmax(0,1fr) 34px 46px!important;
    grid-template-rows:1fr!important;
    grid-template-areas:"meta toggle controls"!important;
    gap:7px!important;
    padding:6px 8px!important;
    overflow:hidden!important;
    border-radius:16px 16px 0 0!important;
  }
  .bottom-player.mobile-collapsed .bottom-meta{
    grid-area:meta!important;
    display:block!important;
    align-self:center!important;
    min-width:0!important;
    padding:0 3px!important;
  }
  .bottom-player.mobile-collapsed .bottom-meta strong{
    display:block!important;
    font-size:12px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .bottom-player.mobile-collapsed .bottom-meta small{
    display:block!important;
    margin-top:3px!important;
    font-size:8px!important;
    line-height:1!important;
    color:#cabbd4!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .bottom-player.mobile-collapsed .mobile-player-toggle{
    grid-area:toggle!important;
    position:static!important;
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    min-height:32px!important;
    align-self:center!important;
    transform:none!important;
  }
  .bottom-player.mobile-collapsed .bottom-controls{
    grid-area:controls!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    overflow:visible!important;
  }
  .bottom-player.mobile-collapsed .bottom-controls button:not(#bottomPlay){display:none!important}
  .bottom-player.mobile-collapsed .bottom-controls #bottomPlay{
    display:grid!important;
    place-items:center!important;
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    font-size:16px!important;
  }
  .bottom-player.mobile-collapsed .bottom-seek-row{
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    height:3px!important;
    display:block!important;
    padding:0!important;
    pointer-events:none!important;
  }
  .bottom-player.mobile-collapsed .bottom-seek-row span{display:none!important}
  .bottom-player.mobile-collapsed .bottom-seek-row input{
    display:block!important;
    width:100%!important;
    height:3px!important;
    min-height:3px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
  }
  body.mobile-player-collapsed{
    padding-bottom:calc(var(--mobile-player-mini) + var(--mobile-nav-h) + env(safe-area-inset-bottom))!important;
  }
}
@media(max-width:390px){
  .bottom-player .bottom-controls{gap:3px!important;padding-right:35px!important}
  .bottom-player .bottom-controls button{flex-basis:34px!important;width:34px!important;min-width:34px!important;height:34px!important;min-height:34px!important;font-size:9px!important}
  .bottom-player .bottom-controls #bottomPlay{flex-basis:48px!important;width:48px!important;min-width:48px!important;height:48px!important;min-height:48px!important}
  .bottom-player.mobile-collapsed .bottom-controls{padding:0!important}
}


/* V86 — explicit search action + dependable voice-search states */
.search-wrap{display:grid!important;grid-template-columns:auto auto minmax(120px,1fr) auto auto!important;align-items:center!important;gap:10px!important}
.search-wrap #search{min-width:0!important;width:100%!important}
#voiceSearch,#submitSearch{position:relative!important;inset:auto!important;flex:0 0 auto!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;height:44px!important;border-radius:13px!important;white-space:nowrap!important}
#voiceSearch{min-width:92px!important;padding:0 13px!important}
#submitSearch{min-width:112px!important;padding:0 18px!important;color:#fff!important;font-weight:900!important;letter-spacing:.08em!important;background:linear-gradient(180deg,#9d4cff,#4e0e83)!important;border:1px solid rgba(255,255,255,.72)!important;box-shadow:0 0 0 3px rgba(130,47,220,.2),inset 0 1px rgba(255,255,255,.45),0 8px 22px rgba(81,12,135,.35)!important}
#submitSearch:hover{transform:translateY(-1px);filter:brightness(1.12)}
#submitSearch:active{transform:translateY(1px);filter:brightness(.96)}
#voiceSearch.listening{background:linear-gradient(180deg,#c262ff,#65139c)!important;box-shadow:0 0 0 4px rgba(182,88,255,.24),0 0 24px rgba(179,80,255,.7)!important;animation:hmcVoicePulse 1.15s ease-in-out infinite}
@keyframes hmcVoicePulse{50%{transform:scale(1.035)}}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:760px){
 .search-wrap{grid-template-columns:auto minmax(0,1fr) 46px 54px!important;gap:6px!important;padding:7px!important}
 .search-wrap .help-console-title{font-size:11px!important;padding:0 8px!important}
 .search-wrap .search-spark{display:none!important}
 #voiceSearch,#submitSearch{height:42px!important;min-width:0!important;width:100%!important;padding:0!important;border-radius:12px!important}
 #voiceSearch .voice-label,#submitSearch .search-submit-label{display:none!important}
 #submitSearch span:first-child{font-size:22px!important}
}
@media(max-width:430px){
 .search-wrap{grid-template-columns:auto minmax(0,1fr) 44px 48px!important}
 .search-wrap .help-console-title{font-size:10px!important;letter-spacing:.08em!important}
}

/* V87 — compact search actions; prevent desktop/mobile overlap */
.topbar .search-wrap{
  display:grid!important;
  grid-template-columns:auto auto minmax(0,1fr) 44px 48px!important;
  align-items:center!important;
  column-gap:7px!important;
  overflow:hidden!important;
  padding:6px 7px 6px 10px!important;
}
.topbar .search-wrap #search{
  min-width:0!important;
  width:100%!important;
  overflow:hidden!important;
}
.topbar #voiceSearch,
.topbar #submitSearch{
  position:static!important;
  inset:auto!important;
  margin:0!important;
  padding:0!important;
  min-width:0!important;
  width:100%!important;
  max-width:none!important;
  height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  border-radius:12px!important;
  white-space:nowrap!important;
  line-height:1!important;
  z-index:1!important;
}
.topbar #voiceSearch .voice-label,
.topbar #submitSearch .search-submit-label{display:none!important}
.topbar #voiceSearch .voice-icon{font-size:17px!important;line-height:1!important}
.topbar #submitSearch span:first-child{font-size:21px!important;line-height:1!important}
@media(max-width:700px){
  .topbar .search-wrap{
    grid-template-columns:auto minmax(0,1fr) 40px 44px!important;
    column-gap:5px!important;
    padding:5px 6px 5px 7px!important;
  }
  .topbar .search-wrap .search-spark{display:none!important}
  .topbar .search-wrap .help-console-title{font-size:10px!important;padding:0 7px!important;white-space:nowrap!important}
  .topbar #voiceSearch,.topbar #submitSearch{height:38px!important;border-radius:10px!important}
}
@media(max-width:430px){
  .topbar .search-wrap{grid-template-columns:minmax(0,1fr) 38px 42px!important}
  .topbar .search-wrap .help-console-title{display:none!important}
}
