/* Shared rounded search fields and palette-tinted glass controls. */
body :is(#searchForm,#playerSearchForm){min-height:48px;padding:6px;gap:7px;border:1px solid hsl(var(--accent-h,40) 30% 65% / .2);border-radius:24px;background:linear-gradient(145deg,hsl(var(--accent-h,40) 20% 19% / .6),hsl(var(--accent-h,40) 20% 10% / .65));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 #ffffff0d,inset 0 -1px 0 #0002,0 5px 14px #0002}
body :is(#searchForm,#playerSearchForm):focus-within{border-color:var(--cover-scrollbar,hsl(var(--accent-h,40) 60% 60% / .5));box-shadow:inset 0 1px 0 #ffffff10,0 0 0 3px hsl(var(--accent-h,40) 60% 50% / .08),0 6px 16px #0002}
body #searchForm #search,body #player #playerSearchForm #playerSongQuery{background:transparent;border:0;border-radius:18px;padding:10px 12px;margin:0;outline:none;box-shadow:none;color:#f3f3f5;font-size:12px}
body input[type=search]:not(:where(#search,#playerSongQuery)){border:1px solid hsl(var(--accent-h,40) 30% 65% / .2);border-radius:22px;background:linear-gradient(145deg,hsl(var(--accent-h,40) 20% 19% / .5),hsl(var(--accent-h,40) 20% 10% / .6));box-shadow:inset 0 1px 0 #ffffff09,0 3px 9px #0002;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
body input[type=search]::placeholder{color:#a4a6b0;opacity:1}

@media(max-width:700px){body :is(#searchForm,#playerSearchForm){min-height:44px;padding:5px;gap:5px}}

/* Translucent glass for the four player actions. */
body #player .player-main .actions :is(#favorite,#equalizerToggle,#playerdownload,#playershare){background:linear-gradient(145deg,#ffffff08,#ffffff02);border:1px solid #ffffff14;backdrop-filter:blur(16px) saturate(125%);-webkit-backdrop-filter:blur(16px) saturate(125%);box-shadow:none}
body #player .player-main .actions #equalizerToggle.equalizer-active{border-color:var(--cover-scrollbar,#ffffff30);color:var(--cover-spectrum,var(--gold))}
@media(hover:hover){body #player .player-main .actions :is(#favorite,#equalizerToggle,#playerdownload,#playershare):hover{background:#ffffff0c;border-color:#ffffff25}}

/* Raised palette styling only for Search and Download app. */
body #searchForm>button:not(.header-donate),body #playerSearchForm>button,body .download-app{border:1px solid hsl(var(--accent-h,40) 75% 80% / .4);background:linear-gradient(145deg,hsl(var(--accent-h,40) 78% 74% / .95),hsl(var(--accent-h,40) 68% 51% / .92));color:hsl(var(--accent-h,40) 35% 9%);box-shadow:inset 0 1px 0 #ffffff45,inset 0 -2px 0 #0002,0 3px 0 -1px hsl(var(--accent-h,40) 50% 15% / .6),0 6px 14px #0003;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-weight:700;transition:box-shadow .16s,transform .16s,filter .16s}
body #searchForm>button:not(.header-donate),body #playerSearchForm>button{border-radius:18px}
@media(hover:hover){body #searchForm>button:not(.header-donate):hover,body #playerSearchForm>button:hover,body .download-app:hover{filter:brightness(1.06)}}
body #searchForm>button:not(.header-donate):active,body #playerSearchForm>button:active,body .download-app:active{transform:translateY(1px);box-shadow:inset 0 1px 3px #0002,0 1px 4px #0002}
@media(prefers-reduced-motion:reduce){body #searchForm>button:not(.header-donate),body #playerSearchForm>button,body .download-app{transition:none;transform:none}}

/* Compact desktop hero: QR spans the heading, search and saved links. */
@media(min-width:701px){
 body .hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:24px;row-gap:8px;padding-top:18px;padding-bottom:18px}
 body .hero>h1{grid-column:1;grid-row:1;margin:0;line-height:1.15}
 body .hero>small,body .hero>p{display:none}
 body .hero .search-donate-row{display:contents}
 body .hero #searchForm{grid-column:1;grid-row:2;width:100%;max-width:640px;margin:0}
 body .hero .search-donate-row>.header-donate{grid-column:2;grid-row:1 / span 4;align-self:center;margin:0}
 body .hero>.saved-links{grid-column:1;grid-row:4;margin-top:0}
 body .hero>#searchSuggestions{grid-column:1;grid-row:3}
}
/* Keep category navigation available while the full player is open. */
body.player-open #categoryNav{z-index:35}
@media(max-width:999px){
 body #categoryNav{grid-template-columns:none;grid-template-rows:auto;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
 body #categoryNav button[data-category="R&B"]{display:block}
 body.player-open #categoryNav{display:grid!important}
 body.player-open #player{bottom:var(--player-nav-height,calc(80px + var(--safe)))}
}
@media(min-width:1000px){
 body.player-open #categoryNav{display:flex!important;bottom:0}
 body.player-open #player{left:180px;bottom:0}
}
html[data-android-tv] body.player-open #categoryNav{display:flex!important;bottom:12px}
html[data-android-tv] body.player-open #player{left:166px;bottom:0}
:is(#previous,#next,#miniPrev,#miniNext){display:grid;place-items:center;min-width:44px;min-height:44px;touch-action:manipulation}
:is(#previous,#next,#miniPrev,#miniNext) svg{width:22px;height:22px;fill:currentColor;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;pointer-events:none}
body #mini :is(#miniPrev,#miniNext){width:44px;height:44px;flex-shrink:0}