:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f7f7fa;background:#101014;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}#app{display:grid;grid-template-columns:230px 1fr;min-height:100vh;padding-bottom:105px}.sidebar{position:sticky;top:0;height:calc(100vh - 105px);background:#17171d;padding:32px 18px;display:flex;flex-direction:column;border-right:1px solid #292932}.brand{font-size:22px;font-weight:850;letter-spacing:1.5px;margin:0 0 42px 12px}.brand-icon{color:#ff3864;font-size:30px}.sidebar nav{display:grid;gap:8px}.nav{display:flex;align-items:center;gap:15px;text-align:left;background:none;border:0;color:#a6a6b0;padding:13px 16px;border-radius:10px;font-size:17px}.nav:first-letter{font-size:24px}.nav.active,.nav:hover{background:#30303a;color:#fff}.sidebar-bottom{margin-top:auto;color:#888895;font-size:12px;line-height:1.9;padding-left:12px}main{padding:42px 5.5vw 40px;min-width:0}header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:35px}.eyebrow{color:#ff557b;letter-spacing:2px;font-size:11px;font-weight:800}h1{font-size:clamp(30px,4vw,48px);letter-spacing:-1.5px;margin:9px 0}h2{font-size:23px;margin:34px 0 18px;letter-spacing:-.6px}.profile{border:1px solid #42424c;border-radius:22px;background:#292931;color:white;padding:9px 15px}.hero{border-radius:22px;padding:45px 42px;min-height:240px;background:radial-gradient(circle at 80% 20%,#fd527c 0,transparent 37%),linear-gradient(120deg,#601c61,#be234b 75%,#ef4167);display:flex;align-items:center;justify-content:space-between;overflow:hidden}.hero .eyebrow{color:#ffcad6}.hero h2{font-size:clamp(30px,4vw,49px);max-width:500px;margin:12px 0}.hero p{color:#ffdfeb}.hero-art{font-size:130px;opacity:.6;transform:rotate(-18deg)}.primary{background:#fff;color:#ad1742;border:0;border-radius:24px;padding:12px 22px;font-weight:800}.song-list{display:grid;gap:7px}.song{display:grid;grid-template-columns:46px minmax(0,1fr) auto auto;gap:15px;align-items:center;padding:10px;border-radius:12px;transition:background .15s}.song:hover,.song.current{background:#26262e}.cover{height:54px;width:54px;border-radius:9px;display:grid;place-items:center;font-size:25px;flex-shrink:0;color:#fff}.cover.small{height:48px;width:48px}.song .cover{height:46px;width:46px}.song strong,.now strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.song small,.now small{display:block;color:#9d9da8;margin-top:5px;font-size:12px}.song-meta{min-width:0}.muted{color:#aaaab5}.icon-btn{background:transparent;border:0;color:#bcbcc8;font-size:23px;padding:7px}.icon-btn:hover,.icon-btn.on{color:#ff4b75}.duration-text{color:#8d8d98;font-size:12px}.grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:18px}.mix-card{border:0;text-align:left;color:white;background:#22222a;border-radius:14px;padding:12px}.mix-card .cover{width:100%;height:auto;aspect-ratio:1;font-size:58px;margin-bottom:12px}.mix-card strong{display:block}.mix-card small{color:#aaaab5}.search-box{width:100%;max-width:600px;background:#25252d;border:1px solid #40404a;border-radius:12px;color:white;padding:17px;font-size:16px;outline:none}.search-box:focus{border-color:#fa4772}.tabs{display:flex;gap:10px;margin:22px 0}.tab{border:0;background:#2b2b33;color:#eee;padding:10px 18px;border-radius:20px}.tab.active{background:#ff3d69}.empty{padding:55px 10px;color:#aaaab5;text-align:center;border:1px dashed #454550;border-radius:15px}.player{position:fixed;bottom:0;left:0;right:0;z-index:10;display:grid;grid-template-columns:1fr 1.3fr 1fr;align-items:center;gap:25px;background:#23232b;border-top:1px solid #3a3a45;padding:13px 28px;height:105px}.now{display:flex;align-items:center;gap:13px;min-width:0}.now-meta{min-width:0}.play-center{display:grid;justify-items:center;gap:7px}.controls{display:flex;align-items:center;gap:15px}.play-btn{border:0;background:#fff;border-radius:50%;width:36px;height:36px;font-size:17px}.progress{display:flex;align-items:center;gap:12px;width:min(100%,480px);font-size:11px;color:#9999a5}.progress input{flex:1;min-width:30px}.volume{display:flex;justify-content:flex-end;align-items:center;gap:10px}input[type=range]{accent-color:#ff4b75}.mobile-nav{display:none}.note{color:#aaaab5;font-size:13px;line-height:1.6;margin-top:18px}@media(max-width:760px){#app{display:block;padding-bottom:176px}.sidebar{display:none}main{padding:26px 18px}.hero{padding:26px;min-height:220px}.hero-art{font-size:70px}.profile span{display:none}.player{height:116px;bottom:61px;grid-template-columns:1fr;gap:8px;padding:10px 17px}.now{height:42px}.now .cover{height:39px;width:39px}.play-center{display:flex;align-items:center;gap:12px}.controls{gap:7px}.controls .icon-btn{font-size:18px}.progress{flex:1}.volume{display:none}.mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;height:61px;background:#19191f;z-index:11;justify-content:space-around;border-top:1px solid #34343e}.mobile-nav button{background:none;border:0;color:#888895;display:grid;justify-items:center;align-content:center;font-size:21px}.mobile-nav button span{font-size:10px}.mobile-nav button.active{color:#ff4b75}.song{grid-template-columns:46px minmax(0,1fr) auto;gap:9px}.duration-text{display:none}.grid-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}

.import-panel{padding-bottom:22px}.import-panel p{color:#a9a8b4}.import-label{display:inline-block;cursor:pointer;margin:8px 0 16px;padding:13px 18px;border-radius:12px}.import-panel .song-list{margin-bottom:26px}.import-panel .note{font-size:12px;margin:10px 0 16px}

/* Soniq Visión — diseño renovado */
:root{color-scheme:dark;background:#0c0a14;color:#f7f5ff}
body{background:radial-gradient(ellipse at 82% -12%,#321849 0,transparent 43%),#0c0a14}
.sidebar{background:#110f1c;border-right:1px solid #29213a}
.brand{display:flex;align-items:center;gap:12px;letter-spacing:-.8px;font-size:21px;margin-left:5px;white-space:nowrap}
.brand-wave{width:48px;height:46px;object-fit:contain;filter:drop-shadow(0 0 11px #a03cff66)}
.brand em{font-style:normal;color:#b78aff;font-weight:600}
.nav{border-radius:14px}.nav.active,.nav:hover{background:#302045;color:#fff}
.eyebrow{color:#bc8aff}
h1{letter-spacing:-1.8px;font-weight:850}
.hero{position:relative;min-height:285px;border:1px solid #6f3da355;background:radial-gradient(ellipse at 88% 44%,#9c46ee 0%,transparent 44%),linear-gradient(120deg,#211330 0%,#42205d 55%,#1c102f 100%);box-shadow:0 18px 70px #06030c60}
.hero:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 55%,#ffffff06);border-radius:inherit}
.hero .eyebrow{color:#e3bbff}.hero p{color:#dfc9ed}.hero h2{font-weight:850;letter-spacing:-1.6px}
.hero-art{font-size:0;opacity:1;transform:none;width:32%;display:flex;justify-content:center;align-items:center}
.hero-art img{width:100%;max-width:235px;filter:drop-shadow(0 0 28px #c154ff99)}
.primary{background:linear-gradient(110deg,#f04ac3,#9149ff);color:#fff;box-shadow:0 5px 22px #b343ee40}
.mix-card{background:#1c1728;border:1px solid #362a46;transition:transform .15s,background .15s}
.mix-card:hover{transform:translateY(-3px);background:#292036}
.song{border:1px solid transparent}.song:hover,.song.current{background:#231b32;border-color:#3c2a53}
.cover{box-shadow:inset 0 0 20px #ffffff10}
.icon-btn:hover,.icon-btn.on{color:#d779ff}
.search-box{background:#21192e;border-color:#493359}.search-box:focus{border-color:#b975ff}
.tab{background:#251b33}.tab.active{background:linear-gradient(110deg,#d943c2,#7e4bec)}
.player{background:#171120f5;border-top:1px solid #3a2a4d;backdrop-filter:blur(20px)}
.play-btn{background:#e3c2ff;color:#28123b}
input[type=range]{accent-color:#bc69ff}
.profile{background:#251b33;border-color:#453052}
.import-label{background:linear-gradient(110deg,#ec47c3,#8947f4)}
.mobile-nav{background:#130f1ded;border-color:#352742;backdrop-filter:blur(20px)}
.mobile-nav button.active{color:#cb85ff}
@media(max-width:760px){main{padding-top:35px}.hero{min-height:220px;padding:25px 22px}.hero h2{font-size:30px;max-width:240px}.hero-art{width:27%}.hero-art img{width:130px;max-width:none}.player{background:#1e1729f5}.grid-cards{gap:10px}.mix-card{padding:9px}}

/* El reproductor se muestra solo tras seleccionar una canción. */
.player[hidden]{display:none!important}
#app{padding-bottom:0}
body.has-player #app{padding-bottom:105px}
.sidebar{height:100vh}
body.has-player .sidebar{height:calc(100vh - 105px)}
@media(max-width:760px){
 #app{padding-bottom:61px}
 body.has-player #app{padding-bottom:176px}
}

/* Corrección definitiva: ningún reproductor ni espacio reservado antes de reproducir */
body:not(.has-player) .player{display:none!important}
body:not(.has-player) #app{padding-bottom:0}
@media(max-width:760px){body:not(.has-player) #app{padding-bottom:61px}}

/* Soniq: portada sin colisiones entre texto y símbolo */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(105px,25%);column-gap:clamp(12px,3vw,32px);align-items:center;isolation:isolate}
.hero>div:first-child{position:relative;z-index:1;min-width:0}
.hero h2{max-width:100%;overflow-wrap:normal}
.hero p{max-width:48ch;line-height:1.5}
.hero-art{position:relative;z-index:0;width:100%;min-width:0;pointer-events:none}
.hero-art img{width:100%;max-width:210px;height:auto;object-fit:contain}
@media(max-width:760px){
 .hero{display:block;padding:25px 22px;min-height:0}
 .hero>div:first-child{width:100%}
 .hero h2{max-width:100%;font-size:clamp(27px,7.5vw,36px);line-height:1.13;margin:18px 0}
 .hero p{max-width:100%;font-size:clamp(14px,3.8vw,17px);line-height:1.5;margin:16px 0 20px}
 .hero-art{display:none!important}
 .hero .primary{max-width:100%;white-space:normal}
}