:root{color-scheme:dark;--bg:#0b0c13;--panel:#13151e;--panel2:#191b27;--card:#181a25;--line:#2a2b37;--text:#f7f7fb;--muted:#9899aa;--subtle:#73758a;--accent:#b59aff;--accent2:#dfbcff;--green:#9af2ca;--heading:'Outfit','DM Sans',system-ui,sans-serif;--body:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);-webkit-font-smoothing:antialiased;font-size:14px}button,input{font:inherit}button{cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.42}button:focus-visible,input:focus-visible,.track-row:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button svg{pointer-events:none}svg.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}svg use[href="#i-pause"]{fill:currentColor;stroke:none}.svg-sprite{position:absolute;width:0;height:0;overflow:hidden} [hidden]{display:none!important}
.app-shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:calc(100vh - 104px)}.sidebar{position:sticky;top:0;align-self:start;height:calc(100vh - 104px);background:#101118;border-right:1px solid #20212c;padding:30px 17px 24px;display:flex;flex-direction:column;z-index:6}.brand{display:flex;align-items:center;gap:11px;background:none;border:0;text-align:left;width:100%;padding:0 10px;margin:3px 0 49px}.brand-icon{height:39px;width:39px;background:linear-gradient(135deg,#c7a9ff,#835df7);border-radius:13px;display:flex;gap:3px;align-items:center;justify-content:center;box-shadow:0 9px 24px #6a3cc438}.brand-icon span{background:#1d1430;width:4px;border-radius:20px;height:13px}.brand-icon span:nth-child(2){height:24px}.brand-icon span:nth-child(3){height:18px}.brand-icon span:nth-child(4){height:29px}.brand-name{font-family:var(--heading);font-size:25px;letter-spacing:-1px;font-weight:700;line-height:.82}.brand-dot{color:#ae8aff}.brand-name small{font-family:var(--body);font-size:9px;letter-spacing:3.5px;font-weight:700;display:block;color:#8f8ba2;margin-top:8px}.side-label{font-size:10px;letter-spacing:2.5px;color:#686b7d;padding:0 17px;margin:0 0 14px;font-weight:800}.side-nav{display:grid;gap:5px}.nav-button{border:0;background:transparent;display:flex;align-items:center;gap:15px;width:100%;padding:13px 16px;border-radius:11px;text-align:left;font-weight:700;color:#9797a7;transition:background .2s,color .2s}.nav-button .icon{width:19px;height:19px}.nav-button:hover{color:white;background:#1b1a28}.nav-button.active{background:#272138;color:#d6c6ff}.nav-button.active .icon{color:#bb9bff}.nav-count{margin-left:auto;font-size:10px;color:#bda6ef;background:#332a47;padding:3px 7px;border-radius:50px}.side-bottom{margin-top:auto}.side-tip{border:1px solid #393049;border-radius:17px;background:radial-gradient(circle at 100% 0%,#4d366e50,transparent 65%),#201b29;padding:20px 18px}.side-tip-symbol{width:36px;height:36px;border-radius:12px;background:#37254e;color:#d3baff;display:grid;place-items:center;margin-bottom:18px}.side-tip strong{font-family:var(--heading);font-size:18px}.side-tip p{line-height:1.6;font-size:12px;color:#bbb1c6;margin:7px 0 14px}.side-tip button{background:none;border:0;padding:0;color:#ceb5ff;display:flex;gap:8px;align-items:center;font-weight:700;font-size:12px}.side-tip button .icon{width:15px;height:15px}.side-settings{background:none;border:0;color:#87899a;display:flex;align-items:center;gap:12px;font-size:12px;margin-top:19px;width:100%;padding:11px}.side-settings:hover{color:#fff}.side-settings .icon{width:17px;height:17px}
.main-area{min-width:0;padding:0 clamp(24px,4vw,65px);max-width:1650px;width:100%;margin:0 auto}.topbar{height:85px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #21222c}.topbar-left{display:flex;align-items:center;gap:10px}.eyebrow,.section-kicker{font-size:10px;font-weight:800;letter-spacing:2.5px;color:#85849a}.topbar-right{display:flex;align-items:center;gap:18px}.topbar-mark{font-size:10px;color:#aaa8bc;font-weight:700;letter-spacing:1.2px;display:flex;align-items:center;gap:11px}.pulse-dot,.hero-live-dot{width:7px;height:7px;border-radius:50%;background:#a5e8bc;box-shadow:0 0 0 4px #a5e8bc16}.icon-button{background:none;border:0;padding:8px;display:grid;place-items:center;color:#aaaabb;border-radius:10px;position:relative}.icon-button:hover{background:#22212e;color:white}.queue-toggle,.mobile-menu{display:none}.search-section{padding:31px 0 29px}#search-form{display:flex;align-items:center;border:1px solid #2f303b;background:#191b26;border-radius:16px;height:64px;padding:7px 8px 7px 21px;transition:border-color .2s,box-shadow .2s}#search-form:focus-within{border-color:#a78afc;box-shadow:0 0 0 4px #a78afc13}.search-form-icon{color:#b6a6e6!important;width:21px!important;height:21px!important}#query{background:none;border:0;outline:0;min-width:0;flex:1;height:100%;font-size:14px;color:#fff;padding:0 16px}#query::placeholder{color:#777989}.search-clear{background:transparent;border:0;padding:10px;color:#bdb9ce}.search-clear .icon{width:16px}.search-submit,.primary-cta{border:0;background:#b99cff;color:#211733;font-weight:800;border-radius:11px;padding:0 22px;height:48px;display:flex;align-items:center;justify-content:center;gap:11px;white-space:nowrap;transition:transform .2s,background .2s}.search-submit:hover,.primary-cta:hover{background:#cfb8ff;transform:translateY(-1px)}.search-submit .icon,.primary-cta .icon{width:16px;height:16px}
.hero{height:340px;border-radius:23px;position:relative;overflow:hidden;display:flex;align-items:center;background:radial-gradient(ellipse 60% 120% at 87% 40%,#7544bf80 0%,transparent 85%),linear-gradient(115deg,#29213d 0%,#332246 47%,#453060 100%);border:1px solid #59457680}.hero:before{content:"";position:absolute;inset:0;opacity:.25;background-image:radial-gradient(#cab7e8 .55px,transparent .55px);background-size:17px 17px;mask-image:linear-gradient(90deg,transparent,black)}.hero-content{position:relative;z-index:2;max-width:610px;padding-left:clamp(25px,4vw,62px)}.hero-pill{display:inline-flex;gap:11px;align-items:center;font-size:9px;letter-spacing:1.8px;font-weight:800;color:#ddd0ec;border:1px solid #a792c47a;border-radius:40px;padding:10px 14px}.hero h1{font-family:var(--heading);font-size:clamp(32px,3.4vw,53px);font-weight:700;letter-spacing:-1.8px;line-height:1.09;margin:17px 0 12px}.hero h1 em{font-style:normal;color:#dfc4ff}.hero p{font-size:13px;line-height:1.7;max-width:340px;color:#d0c4d9;margin:0 0 23px}.primary-cta{height:45px;display:inline-flex;padding:0 19px;font-size:12px}.hero-art{position:absolute;right:-65px;top:-35px;width:50%;height:410px;display:grid;place-items:center;pointer-events:none}.hero-orbit{position:absolute;width:460px;height:460px;border-radius:50%;border:1px solid #c4a5ff54;box-shadow:0 0 100px #a065ec2b}.hero-orbit-2{width:370px;height:370px;border-color:#d3b6ff3e}.hero-disc{position:absolute;width:275px;height:275px;display:grid;place-items:center;border-radius:50%;background:repeating-radial-gradient(circle at center,#271b38 0px,#271b38 3px,#36244a 4px,#1c172c 6px,#1a1327 8px);border:8px solid #24182f;box-shadow:0 17px 40px #120c1e70,inset 0 0 25px #916ac94d;transform:rotate(-20deg)}.hero-disc:after{content:"";width:37px;height:37px;background:#342647;border:7px solid #dbc3fc;border-radius:50%;position:absolute;box-shadow:0 0 25px #ab8fe8}.hero-disc-label{background:#c8aff7;width:124px;height:124px;border-radius:50%;display:grid;place-items:center;color:#35224c;font-family:var(--heading);font-size:12px;line-height:1.15;font-weight:800;letter-spacing:2px;text-align:center}.mini-bars{font-size:9px;letter-spacing:2px}.hero-spark{position:absolute;color:#e5ccfc;font-size:26px;z-index:3}.hero-spark.one{top:82px;right:115px}.hero-spark.two{bottom:66px;left:0;font-size:17px}
.content-section{margin-top:38px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:20px}.section-kicker{margin:0 0 8px;color:#a18aba}.section-heading h2,.view-header h1{font-family:var(--heading);letter-spacing:-.7px;font-size:26px;font-weight:600;margin:0}.heading-star{font-size:20px;color:#b496ef}.text-link{border:0;background:none;color:#bca6eb;font-weight:700;font-size:12px;display:flex;align-items:center;gap:7px;white-space:nowrap}.text-link .icon{width:15px;height:15px}.horizontal-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.music-card{background:#181923;border:1px solid #292936;border-radius:15px;padding:13px;text-align:left;min-width:0;position:relative;transition:transform .2s,background .2s}.music-card:hover{background:#23212f;transform:translateY(-2px)}.music-card-cover{aspect-ratio:1;position:relative;overflow:hidden;border-radius:10px;background:linear-gradient(135deg,#4c3c75,#261c3d);display:grid;place-items:center;color:#d5c3ff}.music-card-cover img{width:100%;height:100%;object-fit:cover}.music-card-cover .icon{width:45px;height:45px;opacity:.6}.music-card-play{position:absolute;bottom:9px;right:9px;width:39px;height:39px;background:#b99dff;color:#211433;border-radius:50%;display:grid;place-items:center;opacity:0;transform:translateY(6px);transition:all .2s}.music-card:hover .music-card-play,.music-card:focus-visible .music-card-play{opacity:1;transform:translateY(0)}.music-card strong{font-size:13px;font-weight:800;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:12px}.music-card small{color:#9998aa;font-size:11px;display:block;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.music-card .music-card-play .icon{width:18px;height:18px;fill:#211433;stroke:none}.radio-card .music-card-cover{background:radial-gradient(circle at 70% 30%,#b998ff,#3d255e);}.radio-card .music-card-cover .icon{width:64px;height:64px;opacity:.9}.genres{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.genre{display:flex;align-items:flex-end;justify-content:space-between;text-align:left;height:112px;padding:17px;border:1px solid #ffffff0d;border-radius:16px;font-family:var(--heading);font-size:17px;line-height:1.1;font-weight:700;overflow:hidden;position:relative}.genre span{max-width:90px;position:relative;z-index:2}.genre .icon{align-self:start;position:relative;z-index:2;width:18px;height:18px}.genre:after{content:"";width:96px;height:96px;position:absolute;border-radius:19px;right:-30px;bottom:-35px;transform:rotate(28deg);border:18px solid #ffffff22}.genre-purple{background:#563b74}.genre-orange{background:#79503c}.genre-green{background:#2b5d5c}.genre-blue{background:#314a78}.genre:hover{filter:brightness(1.15)}.site-footer{margin:58px 0 32px;font-size:11px;color:#696b7e;line-height:1.6}
.view-header{padding:10px 0 27px}.view-header h1{font-size:34px}.view-header>p:last-child{color:#9495a8;font-size:13px;margin:9px 0 0}.search-empty,.empty-state{text-align:center;border:1px dashed #30313f;border-radius:20px;padding:65px 25px;background:#13141d;margin:8px 0 20px}.empty-icon{border-radius:18px;background:#2a2240;color:#cbb1ff;width:68px;height:68px;display:grid;place-items:center;margin:0 auto 18px}.empty-icon .icon{width:28px;height:28px}.search-empty h3,.empty-state h3{font-family:var(--heading);font-size:21px;margin:0 0 7px}.search-empty p,.empty-state p{color:#9999ab;line-height:1.6;max-width:410px;margin:0 auto 19px}.suggestions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.suggestions button{background:#211c30;border:1px solid #3c344a;padding:9px 13px;border-radius:30px;color:#ddcbfb;font-size:12px}.results-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 10px;font-size:12px;color:#b3abc1;font-weight:700}.results-hint{font-size:11px;color:#737587;font-weight:500}.track-list{display:flex;flex-direction:column;gap:3px}.track-row{display:grid;grid-template-columns:27px 52px minmax(0,1fr) 60px 38px 38px;gap:13px;align-items:center;text-align:left;padding:9px 10px;border-radius:11px;background:transparent;border:1px solid transparent;min-width:0}.track-row:hover,.track-row.is-current{background:#1c1c28;border-color:#2b2939}.track-row.is-current .row-title{color:#c8b0ff}.track-number{color:#77798a;font-size:12px;text-align:center}.track-row.is-current .track-number{color:#ba9ef3}.track-cover{width:52px;height:52px;border-radius:8px;object-fit:cover;background:#37314a;display:block}.row-main{min-width:0;border:0;background:none;padding:0;text-align:left;display:flex;flex-direction:column;gap:6px}.row-title{font-weight:800;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row-artist{font-size:12px;color:#9999aa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row-duration{color:#838497;font-size:12px;text-align:right;font-variant-numeric:tabular-nums}.row-action{border:0;background:transparent;color:#9899a8;display:grid;place-items:center;height:37px;width:37px;border-radius:8px}.row-action:hover{color:#decaff;background:#332a45}.row-action.is-favorite{color:#cbb0ff}.row-action.is-favorite svg{fill:currentColor}.row-action .icon{width:18px;height:18px}.track-main-play{position:relative;border:0;background:transparent;padding:0;border-radius:8px}.track-main-play:hover:after{content:'▶';position:absolute;inset:0;background:#0008;display:grid;place-items:center;font-size:15px}.load-more-wrap{text-align:center;margin:25px 0}.secondary-button{border:1px solid #464052;background:#252032;color:#ddcdfa;font-weight:800;border-radius:12px;padding:12px 17px;display:inline-flex;align-items:center;gap:9px}.secondary-button:hover{background:#382949}.secondary-button .icon{width:16px;height:16px}
.queue-panel{position:fixed;top:0;bottom:104px;right:0;width:344px;background:#161720;border-left:1px solid #2b2a38;z-index:20;display:flex;flex-direction:column;box-shadow:-20px 0 70px #0009;transform:translateX(105%);transition:transform .28s ease;visibility:hidden}.queue-panel.open{transform:translateX(0);visibility:visible}.queue-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #282837;padding:29px 20px 20px}.queue-head h2{font-family:var(--heading);font-size:26px;font-weight:600;letter-spacing:-.6px;margin:0}.queue-head h2 span{color:#c5b0fa;font-size:13px}.queue-scroll{overflow:auto;flex:1;padding:22px 19px}.queue-now{padding:0 0 26px;text-align:center}.queue-now-cover{width:min(100%,220px);aspect-ratio:1;background:linear-gradient(135deg,#3c2759,#191e36);border-radius:14px;margin:auto;display:grid;place-items:center;overflow:hidden;color:#b9a3e7}.queue-now-cover img{width:100%;height:100%;object-fit:cover}.queue-now-cover .icon{width:65px;height:65px;opacity:.7}.queue-now-label{color:#b69bea;font-size:9px;font-weight:800;letter-spacing:2px;margin:20px 0 8px}.queue-now h3{font-family:var(--heading);font-size:18px;line-height:1.3;margin:0 0 6px;overflow-wrap:anywhere}.queue-now>p:last-child{font-size:12px;color:#9999a9;margin:0}.queue-section-heading{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:10px}.queue-section-heading h3{font-size:12px;margin:0;font-weight:800}.subtle-button{border:0;background:none;color:#a49bb7;font-size:11px}.subtle-button:hover{color:#fff}.queue-items{display:grid;gap:5px}.queue-item{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:8px;align-items:center;padding:7px 2px;border-radius:9px}.queue-item:hover{background:#222330}.queue-item img{width:40px;height:40px;object-fit:cover;border-radius:7px}.queue-item-text{border:0;background:none;min-width:0;text-align:left;display:flex;flex-direction:column;gap:5px;padding:0}.queue-item-text strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}.queue-item-text span{font-size:10px;color:#9293a7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue-item-actions{display:flex;align-items:center}.queue-item-actions button{padding:5px;border:0;background:transparent;color:#818197;border-radius:5px;display:grid;place-items:center}.queue-item-actions button:hover{color:#fff;background:#373143}.queue-item-actions .icon{width:14px;height:14px}.queue-empty{text-align:center;padding:26px 10px;color:#77778a}.queue-empty .icon{width:27px;height:27px;opacity:.75}.queue-empty p{font-size:12px;line-height:1.5}.queue-recommend{border:1px solid #383045;border-radius:12px;background:#241f30;color:#b8a9c8;display:flex;gap:10px;padding:12px;margin-top:25px;font-size:11px;line-height:1.6}.queue-recommend .icon{width:16px;height:16px;color:#c7a3ff}.queue-auto{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #2d2b39;padding:19px 21px;gap:16px}.queue-auto strong{font-size:12px;display:block}.queue-auto small{font-size:11px;color:#8e8b9f;display:block;margin-top:4px}.switch{position:relative;display:inline-flex;align-items:center;cursor:pointer}.switch input{position:absolute;opacity:0}.switch-track{width:39px;height:22px;display:block;background:#504958;border-radius:50px;transition:background .2s}.switch-track:after{content:"";width:16px;height:16px;background:#fff;position:absolute;top:3px;left:3px;border-radius:50%;transition:transform .2s}.switch input:checked+.switch-track{background:#b299f6}.switch input:checked+.switch-track:after{transform:translateX(17px)}.switch input:focus-visible+.switch-track{outline:2px solid white;outline-offset:2px}.overlay{position:fixed;inset:0;background:#04040ac2;z-index:10}
.player-bar{position:fixed;bottom:0;left:0;right:0;background:#181921;border-top:1px solid #36323d;min-height:104px;z-index:22;display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,1.1fr) minmax(0,1fr);align-items:center;gap:16px;padding:13px 30px max(13px,env(safe-area-inset-bottom));box-shadow:0 -12px 35px #0005}.player-song{display:flex;align-items:center;gap:13px;min-width:0}.player-cover-placeholder{width:57px;height:57px;border-radius:10px;background:linear-gradient(135deg,#42305d,#242334);display:grid;place-items:center;overflow:hidden;flex:none}.player-cover-placeholder img{width:100%;height:100%;object-fit:cover}.player-cover-placeholder .icon{color:#bca5e6;width:29px;height:29px}.player-song-info{display:flex;flex-direction:column;gap:6px;min-width:0}.player-song-info strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-song-info span{color:#9695a8;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-like{margin-left:3px}.player-like.is-favorite{color:#c9a9ff}.player-like.is-favorite .icon{fill:currentColor}.player-like .icon{width:18px;height:18px}.player-center{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0}.player-controls{display:flex;align-items:center;justify-content:center;gap:20px}.player-controls .icon{width:18px;height:18px}.player-controls .secondary-control:hover,.player-controls .secondary-control.active{color:#bd9eff}.big-play{display:grid;place-items:center;width:39px;height:39px;background:#e5dded;border-radius:50%;border:0;color:#16141c;padding:0;transition:transform .15s}.big-play:hover{transform:scale(1.08)}.big-play .icon{width:20px;height:20px;fill:#18151b;stroke:none}.player-progress{display:flex;align-items:center;gap:10px;width:100%;font-size:10px;color:#9696a8;font-variant-numeric:tabular-nums}.player-progress input{flex:1;min-width:0;accent-color:#c4a6ff;cursor:pointer;height:4px;margin:0}.player-right{display:flex;align-items:center;justify-content:flex-end;gap:18px}.volume-control{display:flex;align-items:center;gap:7px;color:#aaa9b7}.volume-control .icon{width:18px;height:18px}.volume-control input{width:85px;accent-color:#b69af9;cursor:pointer}.player-queue-toggle{color:#b8b4c6}.player-queue-toggle.active{color:#c5aaff}.player-message{font-size:10px;color:#beb3d3;max-width:130px;text-align:right}.repeat-one{position:absolute;bottom:2px;right:0;font-size:8px;font-weight:800;background:var(--accent);color:#15131a;border-radius:50%;width:11px;height:11px;display:grid;place-items:center}.mobile-nav,.mobile-progress{display:none}.toast{position:fixed;z-index:90;bottom:122px;left:50%;transform:translate(-50%,15px);background:#30293c;border:1px solid #66567c;border-radius:11px;padding:13px 20px;font-size:12px;box-shadow:0 14px 45px #0009;max-width:min(450px,calc(100vw - 24px));text-align:center;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.toast.visible{opacity:1;transform:translate(-50%,0)}.toast.error{border-color:#a45368;color:#ffd3dc}
.settings-dialog{border:1px solid #484054;background:#1d1c28;color:#fff;border-radius:20px;max-width:min(95vw,485px);width:100%;padding:25px;box-shadow:0 18px 70px #0009}.settings-dialog::backdrop{background:#05040bdc}.dialog-head{display:flex;align-items:flex-start;justify-content:space-between}.dialog-head h2{font-family:var(--heading);font-size:27px;margin:0}.settings-description,.settings-note{color:#aaa6bb;line-height:1.7;font-size:12px}.settings-description{margin:18px 0 23px}.settings-dialog label{display:block;font-size:12px;font-weight:700;margin-bottom:8px}.settings-dialog input{width:100%;border:1px solid #61556f;background:#15141d;color:#fff;padding:13px 12px;border-radius:10px;min-width:0}.settings-dialog .secondary-button{margin-top:13px}.settings-note{margin:20px 0 0;font-size:11px}
@media(min-width:1700px){.horizontal-cards{grid-template-columns:repeat(5,minmax(0,1fr))}.main-area{padding-left:70px;padding-right:70px}}
@media(max-width:1100px){.app-shell{grid-template-columns:205px minmax(0,1fr)}.sidebar{padding:26px 12px}.main-area{padding:0 26px}.hero-art{right:-110px}.hero-content{padding-left:30px}.hero h1{font-size:38px}.horizontal-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.genres{grid-template-columns:repeat(2,minmax(0,1fr))}.player-bar{grid-template-columns:minmax(0,1fr) minmax(270px,1fr) auto;padding-left:16px;padding-right:16px}.player-message{display:none}.volume-control input{width:65px}}
@media(max-width:760px){.app-shell{display:block;min-height:100vh}.sidebar{position:fixed;top:0;bottom:0;height:100dvh;width:min(300px,85vw);left:0;transform:translateX(-102%);transition:transform .25s;z-index:18;box-shadow:20px 0 50px #0009}.sidebar.open{transform:translateX(0)}.main-area{padding:0 17px}.topbar{height:67px}.mobile-menu,.queue-toggle{display:grid}.topbar-mark{display:none}.eyebrow{font-size:9px;letter-spacing:1.4px}.search-section{padding:21px 0 20px}#search-form{height:57px;padding:6px 6px 6px 14px;border-radius:14px}#query{font-size:12px;padding:0 10px}#query::placeholder{font-size:12px}.search-submit{height:42px;padding:0 13px;font-size:12px}.search-submit .icon{display:none}.hero{height:310px;border-radius:19px}.hero-content{padding-left:24px}.hero-pill{font-size:8px;letter-spacing:1.1px;padding:8px 10px}.hero h1{font-size:clamp(29px,8vw,38px);letter-spacing:-1.3px}.hero p{font-size:12px;max-width:240px;line-height:1.5}.hero-art{right:-157px;opacity:.57;width:80%;top:-18px;transform:scale(.79)}.hero-content{z-index:3}.content-section{margin-top:29px}.section-heading h2{font-size:23px}.section-kicker{font-size:9px;letter-spacing:1.8px}.horizontal-cards{display:flex;gap:11px;overflow-x:auto;padding-bottom:9px;scroll-snap-type:x mandatory;scrollbar-width:none}.horizontal-cards::-webkit-scrollbar{display:none}.music-card{flex:0 0 145px;scroll-snap-align:start;padding:9px}.music-card-play{opacity:1;transform:none;width:30px;height:30px}.genres{gap:9px}.genre{height:104px;padding:14px;font-size:16px}.site-footer{margin:35px 0 210px}.view-header{padding:8px 0 24px}.view-header h1{font-size:28px}.results-toolbar{flex-direction:column;align-items:flex-start;gap:4px}.track-row{grid-template-columns:22px 47px minmax(0,1fr) 32px 32px;gap:7px;padding:8px 2px}.track-cover{width:47px;height:47px}.row-duration{display:none}.row-title{font-size:12px}.row-artist{font-size:11px}.row-action{width:32px;height:32px}.row-action .icon{width:17px;height:17px}.search-empty,.empty-state{padding:45px 16px}.queue-panel{z-index:26;top:auto;bottom:0;height:min(92dvh,850px);width:100%;border-top:1px solid #4a3859;border-left:0;border-radius:23px 23px 0 0;transform:translateY(104%)}.queue-panel.open{transform:translateY(0)}.queue-head{padding:22px 20px 17px}.queue-scroll{padding:17px 20px}.queue-now-cover{width:125px}.queue-now{padding-bottom:15px}.queue-now-label{margin:13px 0 6px}.queue-now h3{font-size:16px}.queue-auto{padding:15px 19px max(18px,env(safe-area-inset-bottom))}.player-bar{grid-template-columns:minmax(0,1fr) auto;gap:8px;min-height:66px;bottom:calc(66px + env(safe-area-inset-bottom));padding:8px 13px;background:#242130;border-top:1px solid #493c58;border-radius:12px 12px 0 0;z-index:22}.player-song{gap:9px}.player-cover-placeholder{width:44px;height:44px;border-radius:7px}.player-song-info strong{font-size:12px}.player-song-info span{font-size:10px}.player-like{display:none}.player-center{gap:0}.player-controls{gap:5px}.player-controls .secondary-control:not(#next-button){display:none}.player-progress{display:none}.big-play{width:34px;height:34px;background:#d7c4f9}.player-controls .icon{width:18px;height:18px}.player-right{display:none}.mobile-progress{display:block;position:fixed;left:0;right:0;bottom:calc(132px + env(safe-area-inset-bottom));height:2px;background:#4a3c53;z-index:23}.mobile-progress div{width:0;height:100%;background:#d0b1ff;transition:width .4s linear}.mobile-nav{position:fixed;bottom:0;left:0;right:0;height:calc(66px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(4,1fr);z-index:22;background:#171820;border-top:1px solid #2d2936}.mobile-nav-item{border:0;background:none;color:#828394;font-size:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.mobile-nav-item .icon{width:20px;height:20px}.mobile-nav-item.active{color:#d0b4ff}.toast{bottom:160px}}
@media(max-width:390px){.main-area{padding:0 12px}.hero-content{padding-left:18px}.hero h1{font-size:29px}.hero-art{right:-205px}.topbar .eyebrow{font-size:8px}.track-row{grid-template-columns:18px 40px minmax(0,1fr) 30px 30px;gap:6px}.track-cover{width:40px;height:40px}.row-title{font-size:11px}.row-artist{font-size:10px}.row-action{width:29px;height:30px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

.track-main-play.fallback-art{display:grid;place-items:center;width:52px;height:52px;background:linear-gradient(135deg,#4c336d,#242237);color:#c6aaf0}.track-main-play.fallback-art .icon{width:23px;height:23px}.radio-card .music-card-cover img{opacity:.67;filter:saturate(.78)}.radio-card .music-card-cover:has(img):after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#29143b66,transparent);pointer-events:none}@media(max-width:760px){.track-main-play.fallback-art{width:47px;height:47px}}@media(max-width:390px){.track-main-play.fallback-art{width:40px;height:40px}}


/* Reproductor de respaldo visible y controlable: respeta el área mínima de los embeds de YouTube. */
.video-fallback[hidden]{display:none!important}
.video-fallback{position:fixed;z-index:24;right:25px;bottom:119px;width:min(420px,calc(100vw - 32px));padding:12px;background:#201c2b;border:1px solid #64517e;border-radius:16px;box-shadow:0 16px 55px #000b;color:#f6f1fc}
.video-fallback-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.video-fallback-head div{display:flex;flex-direction:column;gap:3px;min-width:0}
.video-fallback-head strong{font-size:12px;color:#d5b9fc}
.video-fallback-head span{font-size:11px;color:#a9a0b8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.video-fallback-head button{flex:none;background:#3d324c;color:white;border:0;width:31px;height:31px;border-radius:8px;display:grid;place-items:center;cursor:pointer}
.video-fallback-head button .icon{width:16px;height:16px}
.video-fallback-frame{width:100%;aspect-ratio:16/9;min-height:200px;overflow:hidden;background:#08080b;border-radius:9px}
.video-fallback-frame iframe{display:block;width:100%;height:100%;min-height:200px;border:0}
.video-fallback-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:9px;font-size:10px;line-height:1.4;color:#a9a2b5}
.video-fallback-bottom a{color:#d6bafc;font-weight:700;text-decoration:none;white-space:nowrap}
.video-fallback-bottom a:hover{text-decoration:underline}
@media(max-width:760px){.video-fallback{left:10px;right:10px;bottom:calc(145px + env(safe-area-inset-bottom));width:auto;padding:10px;border-radius:13px}.video-fallback-frame{min-height:200px}.video-fallback-bottom{font-size:9px}}
.category-group { margin: 28px 0 12px; }
.category-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.category-heading h3 { margin: 0; font-size: 1.1rem; }
