/* Sonora v0.8 — reference-led layout. All controls and artwork remain Sonora's own. */
:root{--accent:#ffff08;--accent-yellow:#ffff00;--bg:#000;--surface:#111}
body,.shell,.main-scroll{background:#000}
.topbar{background:#000;box-shadow:none}
.topbar .crumb>b{color:#f5f5f5;font-weight:870;text-transform:lowercase;letter-spacing:-1.25px}
.sonora-star{color:#fff400;font-size:29px;line-height:.6;font-weight:900;vertical-align:-2px;letter-spacing:0}
.header-collection{display:grid;place-items:center;background:transparent;border:0;color:#fff}
.header-collection:hover{background:#161616}
/* The hero is a light cloud floating over black, not a card. */
.hero,.hero[data-wave-mode=discovery],.hero[data-wave-mode=familiar]{background:#000!important;border:0;box-shadow:none;border-radius:0}
.hero::before,.hero::after{display:none!important}
.wave-aura,.wave-visual,.hero-kicker,.hero-eyebrow,.wave-explainer{display:none!important}
.reference-wave{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;pointer-events:none;filter:saturate(1.15);animation:ref-breathe 12s ease-in-out infinite alternate}
@keyframes ref-breathe{from{transform:scale(.985) translateY(4px)}to{transform:scale(1.045) translateY(-8px)}}
.hero-copy{z-index:2;left:0;right:0;top:50%;transform:translateY(-32%);text-shadow:0 4px 22px #0006;pointer-events:none}
.hero h1{font-size:unset;line-height:1.05;font-weight:800;letter-spacing:0}
.hero .wave-start{pointer-events:auto;display:flex;gap:11px;align-items:center;justify-content:center;padding:0;background:transparent!important;border:0!important;box-shadow:none!important;color:#fff;font-size:clamp(38px,5.5vw,78px);font-weight:820;white-space:nowrap;text-shadow:0 4px 22px #0004;min-height:76px}
.hero .wave-start>span:first-child{font-size:.67em;color:#fff;filter:none}
.hero .wave-start-text{letter-spacing:-.05em}
.hero .wave-configure{pointer-events:auto;opacity:.15;transition:opacity .2s;position:absolute;top:100px;min-height:30px;font-size:12px;background:#1119;border:0;box-shadow:none;padding:8px 16px;color:#fff}
.hero:hover .wave-configure,.hero .wave-configure:focus-visible{opacity:1}
.hero .wave-contexts{display:none}
.discovery-controls{margin:0 0 19px;gap:12px;overflow-x:auto;scrollbar-width:none}
.discovery-controls::-webkit-scrollbar{display:none}
.discovery-controls h2{display:none}
.discovery-pill,.discovery-pill.selected{flex:0 0 auto;display:flex;align-items:center;gap:11px;min-width:215px;max-width:245px;min-height:60px;padding:7px 14px 7px 8px;border-radius:36px;border:0;background:#1b1b1b;color:#fff;text-align:left;font-size:16px;white-space:normal;font-weight:700}
.discovery-pill>span:last-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.discovery-pill strong{font-size:18px;line-height:1.15}
.discovery-pill small{font-weight:500;color:#9e9e9e;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.discovery-faces{display:flex;min-width:65px;align-items:center;padding-left:5px}
.discovery-faces i{width:42px;height:42px;display:grid;place-items:center;border:3px solid #191919;border-radius:50%;background:linear-gradient(135deg,#1c2634,#957d7b);font-style:normal;font-size:18px;color:#fff}
.discovery-faces i+i{margin-left:-22px;background:linear-gradient(135deg,#202735,#91618f)}
.discovery-pill:nth-of-type(2) .discovery-faces i{background:linear-gradient(145deg,#262034,#60494b)}
.discovery-pill:nth-of-type(2) .discovery-faces i+i{background:linear-gradient(145deg,#0a1822,#6a3149)}
.home-shortcuts{gap:16px;max-width:none}
.home-shortcuts>button{background:transparent;border:0;border-radius:0;gap:12px;padding:0;min-height:74px}
.home-shortcuts>button:hover{background:transparent}
.home-shortcuts .shortcut-art{border-radius:10px;box-shadow:0 4px 10px #0003;font-size:33px}
.home-shortcuts strong{font-weight:780}
.collection-overview{max-width:1100px}
.collection-wave,.collection-wave:hover{overflow:hidden;position:relative;display:flex;justify-content:center;align-items:center;gap:7px;min-height:115px;background:radial-gradient(ellipse at 72% -40%,#b452fb,transparent 65%),linear-gradient(115deg,#6800d0 5%,#8d00fe 55%,#d728ff 100%)!important;border-radius:17px;margin:0 0 7px!important;box-shadow:none}
.collection-wave::before,.collection-wave::after{content:"";position:absolute;border:3px solid #ffffff28;border-radius:50%;pointer-events:none;width:130%;height:100%;top:35%;transform:rotate(-8deg);filter:blur(7px)}
.collection-wave::after{transform:rotate(12deg);top:45%;left:-20%;border-color:#e9bbff46}
.collection-wave strong{position:relative;z-index:1;font-size:22px;letter-spacing:-.02em}
.collection-caption{text-align:center;color:#878787;font-size:13px;font-weight:650;margin:5px 0 31px}
.collection-caption b{color:#a44aff;font-weight:750}
.library-liked .liked-art{background:none!important;box-shadow:none;color:#ff968d;filter:drop-shadow(-4px 6px 3px #c5365175);text-shadow:2px -4px 0 #ffbaa3,-3px 5px 0 #8f1333,5px 4px 8px #8f1c3d;font-size:68px}
.library-preview-row{min-height:72px;padding:5px 0;gap:8px;display:flex;align-items:center}
.library-preview-open{display:flex;flex:1;min-width:0;align-items:center;gap:14px;text-align:left;color:#eee;border:0;background:none;padding:0;min-height:64px}
.library-preview-open>span{flex:1;display:flex;min-width:0;flex-direction:column;gap:4px}
.library-preview-open strong{font-size:16px;font-weight:620;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.library-preview-open small{font-size:14px;color:#929292;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.library-preview-art{width:55px;height:55px;flex:0 0 55px;border-radius:6px}
.library-preview-more{border:0;background:none;color:#8e8e8e;font-size:20px;min-width:44px;height:44px;font-weight:900;letter-spacing:2px}
.library-preview-more:hover{color:#fff}
.library-more-title{letter-spacing:-.7px}
.collection-overview .library-more-title{margin:56px 0 22px!important;font-size:28px;font-weight:800}
.collection-overview .library-more-title span{font-weight:450;color:#bbb}
.artist-shelf{gap:24px}
.artist-card{flex:0 0 136px}.artist-art{height:136px;width:136px}
.collection-overview .collection-links{margin-top:36px}
/* Playback restructured around album art and metadata. */
.now-playing,.now-playing.tone-0,.now-playing.tone-1,.now-playing.tone-2,.now-playing.tone-3,.now-playing.tone-4,.now-playing.tone-5{background:var(--now-color,#062c39)!important;color:#fff}
.now-header{border:0;position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;max-width:610px;margin:auto;padding:14px 22px}
.now-header .sheet-handle{display:none}
.close-now{position:static;display:grid;place-items:center;width:42px;height:42px;border:0;background:none;color:#c5d1d5;font-size:43px;line-height:1;min-width:42px}
.now-header-title{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;font-size:13px;font-weight:650;color:#dce3e8}
.now-mark{font-size:28px;line-height:1.2;color:#faff00}
.now-header-actions{display:flex;gap:8px}
.now-header-actions button{background:transparent;color:#9eadb2;border:0;font-size:28px;width:34px;height:42px}
.now-layout{display:block;width:100%;max-width:585px;margin:auto;padding:20px 24px 55px}
.now-main{width:100%;display:flex;flex-direction:column;align-items:stretch}
.now-art{width:min(100%,365px);max-width:365px;aspect-ratio:1;align-self:center;border-radius:9px;margin:22px auto 48px;box-shadow:none;object-fit:cover}
.now-track-info{display:flex;align-items:center;gap:12px;width:100%;min-width:0}
.now-avatar{width:54px;height:54px;flex:0 0 54px;border-radius:50%!important;object-fit:cover;display:grid;place-items:center}
.now-song-copy{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px}
.now-track-info .now-title{font-size:25px;font-weight:820;letter-spacing:-.7px;width:100%;line-height:1.2;text-align:left;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.now-track-info .now-artist{font-size:19px;color:#91adb7;margin:0;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.now-song-actions{display:flex;gap:5px;align-items:center}
.now-song-actions button{width:37px;height:42px;display:grid;place-items:center;background:none;border:0;color:#9eb0b9}
.now-song-actions button svg{width:25px;height:25px}
.now-song-actions #now-menu{font-weight:800;font-size:18px;letter-spacing:1px}
.now-codec{align-self:start;font-size:10px;opacity:.55;margin:5px 0 0 66px;line-height:1}
.now-progress{width:100%;margin:32px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:0}
.now-progress input{grid-column:1/-1;grid-row:1;width:100%;padding:0;height:19px}
.now-progress span{grid-row:2;color:#94a6ac;font-size:12px;min-width:0}
.now-progress span:last-child{grid-column:2;text-align:right}
.now-progress input[type=range]::-webkit-slider-runnable-track{height:2px;background:#577482}
.now-progress input[type=range]::-webkit-slider-thumb{width:10px;height:10px;margin-top:-4px;background:#fff}
.now-controls{display:flex;justify-content:space-between;align-items:center;width:100%;margin:23px 0 0;padding:0;gap:5px}
.now-controls button{min-width:0;width:45px;height:50px;display:grid;place-items:center;color:#aac0c8;border:0;background:none}
.now-controls button svg{width:29px;height:29px}
.now-controls .now-play,.now-playing .now-play{background:#ffff00!important;color:#072331!important;border-radius:50%;width:82px;height:82px;flex:0 0 82px}
.now-controls .now-play svg{width:35px;height:35px}
.now-controls .now-favorite{background:none;border:0;color:#adc0c7;border-radius:0;font-size:30px}
.now-controls .now-favorite.active{color:#ffff00}
.now-controls [aria-pressed=true]{color:#fff900}
.now-volume{display:none!important}
.now-tabs{width:100%;margin:44px 0 0;display:grid;grid-template-columns:repeat(5,1fr);gap:9px}
.now-tabs button{width:100%;min-width:0;min-height:52px;border:0;background:#ffffff0b;color:#a7bdc5;border-radius:30px;padding:4px;font-size:25px;display:grid;place-items:center}
.now-tabs button[aria-pressed=true]{background:#ffffff20;color:white}
.now-tabs button:disabled{opacity:.35}
.track-wave-banner{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:96px;margin-top:34px;border:none;border-radius:14px;background:radial-gradient(ellipse at 90% 0,#7f9cb149,transparent 50%),linear-gradient(120deg,#193947,#164457);color:#fff;text-align:center}
.track-wave-banner small{color:#25bdff;font-size:13px;font-weight:690}.track-wave-banner strong{font-size:18px}
.now-playing .now-queue{z-index:30;position:fixed;top:67px;bottom:20px;left:calc(50% - min(280px,46vw));right:auto;width:min(560px,92vw);margin:0;padding:22px;background:#0f2935f5;border-radius:18px;box-shadow:0 20px 80px #0009;overflow-y:auto;max-height:none}
.now-playing[data-panel=queue] .now-queue,.now-playing[data-panel=lyrics] .now-queue{display:block}
/* Keep desktop a responsive music service, not a stretched screenshot. */
@media(min-width:768px){.hero{height:520px;min-height:520px}.reference-wave{width:min(720px,100%);left:50%;transform:translateX(-50%);animation:none}.hero-copy{top:51%}.hero .wave-configure{opacity:.7}.collection-wave{max-width:840px}.now-playing{overflow:auto}.now-layout{padding-top:12px}.now-art{width:290px;max-width:290px;margin:12px auto 22px}.now-header{padding:10px 22px}.now-playing .now-queue{left:calc(50% - 280px)}}
@media(max-width:767px){
  body,.shell,.main-scroll{background:#000}
  .shell{grid-template-rows:minmax(0,1fr) 88px calc(66px + env(safe-area-inset-bottom))}
  .topbar{height:67px;position:sticky;top:0;padding:0 21px;background:#000;backdrop-filter:none;z-index:12}
  .topbar .header-collection{width:36px;height:44px;padding:0;color:#fff;order:1}
  .topbar .crumb{position:absolute;left:58px;right:58px;top:0;height:67px;display:grid;place-items:center;pointer-events:none;color:#fff;min-width:0}
  .topbar .crumb b{font-size:26px;color:#f6f6f6;letter-spacing:-1.3px;white-space:nowrap}
  .topbar .crumb .sonora-star{font-size:28px}
  .topbar .top-actions{order:3;z-index:1;margin-left:auto}
  .topbar .top-actions #header-search{width:35px;height:40px;color:#fff}
  .topbar .top-actions #header-search svg{width:29px;height:29px}
  .topbar .top-actions :is(.quality-select-label,.quality-select,.mobile-create,#rescan,.private-tag){display:none!important}
  .topbar .nav-back:not(.hidden){position:absolute;left:10px;z-index:3;background:#000}
  .topbar:has(.nav-back:not(.hidden)) .header-collection{visibility:hidden}
  .shell[data-view=library] .topbar .crumb b{font-size:0!important;letter-spacing:0}
  .shell[data-view=library] .topbar .crumb b::before{content:'Коллекция';font-size:21px;font-weight:650;letter-spacing:0}
  .shell[data-view=library] .topbar .crumb .sonora-star{display:none}
  .shell[data-view=search] .topbar .crumb b,.shell[data-view=wave] .topbar .crumb b{font-size:0!important}
  .shell[data-view=search] .topbar .crumb b::before{content:'Поиск';font-size:21px;letter-spacing:0}
  .shell[data-view=wave] .topbar .crumb b::before{content:'Моя волна';font-size:21px;letter-spacing:0}
  main{padding:0 15px 50px}
  .hero{height:clamp(405px,56dvh,540px)!important;min-height:405px!important;margin:-5px -15px 0!important;overflow:hidden!important;border-radius:0!important}
  .reference-wave{top:-1%;left:-7%;width:114%;height:106%;}
  .hero-copy{top:51%;transform:translateY(-25%);max-width:none;padding:0;gap:0}
  .hero h1{margin:0}
  .hero .wave-start{font-size:clamp(34px,10.8vw,48px);min-height:76px;font-weight:800}
  .hero .wave-start>span:first-child{font-size:.67em}
  .hero .wave-configure{top:74px;opacity:0;border:0;min-height:27px}
  .hero .wave-configure:focus-visible{opacity:1}
  .discovery-controls{margin:-7px -15px 16px 0;padding-left:0;gap:10px}
  .discovery-pill,.discovery-pill.selected{min-width:238px;min-height:70px;border-radius:42px;max-width:258px;padding:8px 13px 8px 8px}
  .discovery-pill strong{font-size:21px;letter-spacing:-.5px}.discovery-pill small{font-size:12px}
  .discovery-faces{min-width:66px}.discovery-faces i{width:44px;height:44px}
  .home-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:21px 0 25px}
  .home-shortcuts>button{gap:10px;min-height:64px;padding:0 1px;border-radius:0}
  .shortcut-art{width:48px;height:48px;flex:0 0 48px;border-radius:6px;font-size:27px}
  .home-shortcuts strong{font-size:15px;line-height:1.1}.home-shortcuts small{font-size:12px;line-height:1.2}
  .player{grid-row:2;min-height:73px;height:73px;background:#292929e8;border:1px solid #ffffff09;border-radius:16px;padding:8px 12px;margin:0 8px 6px;gap:4px;box-shadow:0 7px 25px #000a}
  .player .mini-cover{width:49px;height:49px;border-radius:6px}
  .player .song-text strong{font-size:16px;font-weight:710}.player .song-text span{font-size:12px}
  .player-song{width:100%;gap:11px}
  .player-song .heart{display:grid;width:34px;place-items:center;color:#ddd}
  .player-center{display:flex;width:40px;flex:0 0 40px}
  .player-center .play-controls{display:flex;width:40px}.player-center .play-controls>button:not(#playpause){display:none!important}
  .player .play-controls #playpause{background:transparent!important;color:#f8f8f8!important;width:40px;height:43px;border-radius:0}
  .player #playpause svg{width:25px;height:25px}
  .player .player-center .seek,.player-right{display:none!important}
  .mobile-nav{display:grid;grid-template-columns:repeat(4,1fr);height:calc(66px + env(safe-area-inset-bottom));padding:4px 7px calc(6px + env(safe-area-inset-bottom));background:linear-gradient(180deg,#101010ee,#161217f8);border:0}
  .mobile-nav button{display:grid;place-items:center;color:#87878b;min-height:51px;padding:0;background:transparent;font-size:0}
  .mobile-nav button svg{width:29px;height:29px;stroke-width:1.8}
  .mobile-nav button.active{color:#fff;background:transparent}
  .mobile-nav button[data-view=library] svg{width:30px;height:30px}
  .collection-overview{margin-top:0}
  .collection-wave{margin:2px 0 0!important;min-height:69px;border-radius:16px;gap:0;font-size:14px;font-weight:700}
  .collection-wave strong{font-size:21px;margin-top:4px}
  .collection-caption{font-size:12px;margin:9px 0 25px}
  .library-liked{gap:14px;margin:0 0 7px;padding:0}
  .library-liked .liked-art{flex:0 0 61px;width:61px;height:67px;font-size:53px;display:grid;place-items:center}
  .library-liked strong{font-size:26px;letter-spacing:-.9px;font-weight:810}
  .library-liked small{font-size:14px;color:#858585}
  .library-preview-row{min-height:75px;padding:5px 1px}
  .library-preview-art{width:54px;height:54px;flex:0 0 54px;border-radius:6px}
  .library-preview-open{gap:14px}
  .library-preview-open strong{font-size:16px}.library-preview-open small{font-size:14px}
  .collection-overview .library-more-title{font-size:24px;margin:38px 0 26px!important;line-height:1.1}
  .artist-shelf{gap:22px;margin:0 -15px 0 0;scrollbar-width:none}
  .artist-card{flex:0 0 133px;gap:9px}.artist-art{width:133px;height:133px}
  .collection-overview .collection-links{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:36px}
  .collection-links button{min-height:88px;border-radius:10px;padding:9px}
  .collection-links button span{width:38px;height:38px;font-size:22px}
  .collection-links strong{font-size:10px}
  .now-playing{height:100dvh;max-height:100dvh;overflow:auto}
  .now-header{height:70px;padding:10px 18px;max-width:520px}
  .now-header .close-now{font-size:37px;width:37px;min-width:37px}
  .now-layout{padding:17px 23px 38px;max-width:520px}
  .now-art{width:min(100%,74vw,39dvh);max-width:365px;margin:41px auto 55px;border-radius:8px}
  .now-track-info{gap:10px}
  .now-avatar{width:49px;height:49px;flex-basis:49px}
  .now-track-info .now-title{font-size:21px}.now-track-info .now-artist{font-size:16px}
  .now-song-actions button{width:32px;height:35px}.now-song-actions button svg{width:22px;height:22px}
  .now-codec{margin-left:60px;font-size:9px;min-height:11px}
  .now-progress{margin-top:25px}.now-progress span{font-size:11px}
  .now-controls{margin:17px 0 0;gap:3px}.now-controls button{width:39px;height:44px}
  .now-controls button svg{width:27px;height:27px}
  .now-controls .now-play{width:72px;height:72px;flex-basis:72px}
  .now-tabs{gap:8px;margin-top:42px}.now-tabs button{min-height:54px;border-radius:36px;font-size:23px}
  .track-wave-banner{margin-top:30px;min-height:92px}
  .now-playing .now-queue{left:12px;right:12px;width:auto;top:64px;bottom:calc(12px + env(safe-area-inset-bottom));background:#0d2b38f5}
}
@media(max-width:350px){.hero .wave-start{font-size:34px}.discovery-pill{min-width:212px}.now-layout{padding-inline:18px}.now-art{margin-top:14px;margin-bottom:21px;width:72vw}.now-tabs{margin-top:23px}.now-controls{margin-top:9px}.collection-wave strong{font-size:19px}}
@media(prefers-reduced-motion:reduce){.reference-wave{animation:none}}

/* Override older shell's view-specific header hiding. */
.topbar .crumb>b .sonora-star{display:inline!important}
@media(max-width:767px){
 .shell:not([data-view=home]) .topbar{display:flex;grid-template-columns:none;justify-content:space-between}
 .shell:not([data-view=home]) .topbar .header-collection{display:grid!important;visibility:visible;background:none;border:0}
 .shell:not([data-view=home]) .topbar:has(.nav-back:not(.hidden)) .header-collection{visibility:hidden!important}
 .shell:not([data-view=home]) .topbar #header-search{display:flex!important}
 .shell:not([data-view=home]) .topbar .crumb{position:absolute;left:60px;right:60px;justify-content:center;pointer-events:none}
 .now-header .close-now svg{height:30px;width:30px;stroke-width:1.6}
 .hero .wave-start{font-size:clamp(42px,11.7vw,53px)}
}
/* Keep just one collection artist heading, as in the supplied reference. */
.shell[data-view=library] #artist-heading{display:none}
.shell[data-view=library] .library-more-title + .artist-shelf{margin-top:0}

/* Subtle cover-derived player ambience without sampling third-party pixels. */
.now-playing{isolation:isolate}
.now-art-backdrop{position:fixed;inset:-40px;overflow:hidden;pointer-events:none;z-index:0;opacity:.30}
.now-art-backdrop img{width:100%;height:100%;object-fit:cover;filter:blur(95px) saturate(.75) brightness(.65);transform:scale(1.4)}
.now-playing>:not(.now-art-backdrop){position:relative;z-index:1}
.now-playing .now-queue{z-index:30}