:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:#0a0a0a;color:#fafafa;overflow:hidden}.app-layout{display:flex;height:100vh;overflow:hidden}.sidebar{width:260px;background:#111;border-right:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;flex-shrink:0;overflow-y:auto;z-index:50}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1rem;border-bottom:1px solid rgba(255,255,255,.06)}.logo{display:flex;align-items:center;gap:.5rem}.logo-icon{font-size:1.5rem}.logo-text{font-size:1.25rem;font-weight:800;background:linear-gradient(135deg,#8b5cf6,#ec4899);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.sidebar-close{display:none;background:none;border:none;color:#ffffff80;font-size:1.2rem;cursor:pointer}.sidebar-nav{padding:.75rem .5rem;display:flex;flex-direction:column;gap:.25rem}.nav-item{display:flex;align-items:center;gap:.75rem;padding:.6rem .75rem;border-radius:.5rem;background:none;border:none;color:#ffffffa6;font-size:.9rem;font-weight:500;cursor:pointer;transition:background .15s,color .15s;text-align:left;width:100%}.nav-item:hover{background:#ffffff0f;color:#fff}.nav-item.active{background:#8b5cf626;color:#a78bfa}.nav-icon{font-size:1.1rem}.sidebar-section{padding:.75rem 1rem;border-top:1px solid rgba(255,255,255,.06)}.sidebar-title{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#ffffff59;margin-bottom:.6rem}.empty-favs{font-size:.8rem;color:#ffffff4d;padding:.5rem 0}.fav-list{display:flex;flex-direction:column;gap:.2rem}.fav-item{display:flex;align-items:center;gap:.5rem;padding:.4rem .5rem;border-radius:.4rem;background:none;border:none;color:#ffffffb3;font-size:.8rem;cursor:pointer;transition:background .15s;text-align:left;width:100%}.fav-item:hover{background:#ffffff0f}.fav-item.playing{background:#8b5cf61a}.fav-cover{font-size:1.2rem;flex-shrink:0}.fav-info{display:flex;flex-direction:column;min-width:0;flex:1}.fav-title{font-size:.8rem;font-weight:500;color:#ffffffd9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fav-artist{font-size:.7rem;color:#fff6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fav-playing-indicator{display:flex;align-items:flex-end;gap:2px;height:14px;flex-shrink:0}.fav-playing-indicator span{width:3px;background:#8b5cf6;border-radius:1px;animation:eqBounce .8s ease-in-out infinite alternate}.fav-playing-indicator span:nth-child(1){height:40%;animation-delay:0s}.fav-playing-indicator span:nth-child(2){height:70%;animation-delay:.2s}.fav-playing-indicator span:nth-child(3){height:50%;animation-delay:.4s}.cat-list-sidebar{display:flex;flex-direction:column;gap:.2rem}.cat-item-sidebar{display:flex;align-items:center;gap:.5rem;padding:.4rem .5rem;border-radius:.4rem;background:none;border:none;color:#fff9;font-size:.8rem;cursor:pointer;transition:background .15s;text-align:left;width:100%}.cat-item-sidebar:hover{background:#ffffff0f;color:#fff}.main-content{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.top-bar{display:flex;align-items:center;gap:.75rem;padding:.75rem 1.5rem;background:#111c;border-bottom:1px solid rgba(255,255,255,.06);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);flex-shrink:0}.menu-btn{display:none;background:none;border:none;color:#ffffffb3;font-size:1.3rem;cursor:pointer;padding:.25rem}.search-bar{display:flex;align-items:center;gap:.5rem;background:#ffffff0f;border:1px solid rgba(255,255,255,.08);border-radius:2rem;padding:.5rem 1rem;flex:1;max-width:480px}.search-icon{font-size:.9rem;color:#ffffff59}.search-bar input{background:none;border:none;outline:none;color:#fafafa;font-size:.85rem;width:100%}.search-bar input::placeholder{color:#ffffff4d}.clear-search{background:none;border:none;color:#fff6;cursor:pointer;font-size:.9rem;padding:.1rem}.content-scroll{flex:1;overflow-y:auto;padding:1.5rem;scroll-behavior:smooth}.hero-section{text-align:center;padding:2rem 0 1.5rem}.hero-title{font-size:2.2rem;font-weight:800;background:linear-gradient(135deg,#8b5cf6,#ec4899,#f59e0b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.25rem}.hero-subtitle{color:#ffffff73;font-size:1rem}.section{margin-bottom:2rem}.section-title{font-size:1.2rem;font-weight:700;color:#ffffffe6;margin-bottom:1rem}.category-rows{display:flex;flex-direction:column;gap:.6rem}.category-long-box{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1.2rem;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-left:4px solid var(--cat-color, #8b5cf6);border-radius:.6rem;cursor:pointer;transition:background .2s,border-color .2s,transform .15s;text-align:left;width:100%}.category-long-box:hover{background:#ffffff14;border-color:var(--cat-color, #8b5cf6);transform:translate(4px)}.clb-left{display:flex;align-items:center;gap:.75rem}.clb-icon{font-size:1.8rem;flex-shrink:0}.clb-text{display:flex;flex-direction:column}.clb-name{font-size:1rem;font-weight:700;color:#fafafa}.clb-count{font-size:.75rem;color:#fff6}.clb-preview{display:flex;gap:.4rem;flex-shrink:0}.clb-preview-item{font-size:1.1rem;opacity:.5}.clb-arrow{font-size:1.5rem;color:#ffffff40;font-weight:300;flex-shrink:0;transition:color .2s,transform .2s}.category-long-box:hover .clb-arrow{color:var(--cat-color, #8b5cf6);transform:translate(4px)}.favorites-home-grid{display:flex;flex-direction:column;gap:.4rem}.fav-home-card{display:flex;align-items:center;gap:.75rem;padding:.65rem 1rem;background:#8b5cf60f;border:1px solid rgba(139,92,246,.12);border-radius:.5rem;cursor:pointer;transition:background .15s,transform .15s;text-align:left;width:100%}.fav-home-card:hover{background:#8b5cf61f;transform:translate(3px)}.fav-home-card.playing{background:#8b5cf626;border-color:#8b5cf64d}.fav-home-cover{font-size:1.4rem;flex-shrink:0}.fav-home-info{display:flex;flex-direction:column;flex:1;min-width:0}.fav-home-title{font-size:.9rem;font-weight:600;color:#ffffffe6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fav-home-artist{font-size:.75rem;color:#ffffff73;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fav-home-cat{font-size:1rem;opacity:.5;flex-shrink:0}.fav-home-eq{display:flex;align-items:flex-end;gap:2px;height:16px;flex-shrink:0}.fav-home-eq span{width:3px;background:#8b5cf6;border-radius:1px;animation:eqBounce .8s ease-in-out infinite alternate}.fav-home-eq span:nth-child(1){height:40%;animation-delay:0s}.fav-home-eq span:nth-child(2){height:70%;animation-delay:.2s}.fav-home-eq span:nth-child(3){height:50%;animation-delay:.4s}@keyframes eqBounce{0%{height:30%}to{height:100%}}.artists-scroll,.artists-grid{display:flex;gap:.75rem;flex-wrap:wrap}.artist-chip{display:flex;align-items:center;gap:.5rem;padding:.5rem .9rem;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:2rem;cursor:pointer;transition:background .15s,border-color .15s;color:#ffffffbf}.artist-chip:hover{background:#ffffff14;border-color:#ffffff26}.artist-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#8b5cf6,#ec4899);display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;color:#fff}.artist-name{font-size:.85rem;font-weight:500}.category-hero{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:2.5rem 1rem;background:linear-gradient(135deg,color-mix(in srgb,var(--cat-color) 20%,transparent),transparent);border-radius:1rem;margin-bottom:1.5rem}.ch-icon{font-size:3rem}.ch-title{font-size:1.8rem;font-weight:800;color:#fafafa}.ch-count{font-size:.9rem;color:#ffffff80}.artist-hero{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:2.5rem 1rem;margin-bottom:1.5rem}.ah-avatar{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#8b5cf6,#ec4899);display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:800;color:#fff}.ah-name{font-size:1.8rem;font-weight:800;color:#fafafa}.ah-count{font-size:.9rem;color:#ffffff80}.song-list{display:flex;flex-direction:column;gap:.15rem}.song-row{display:flex;align-items:center;gap:.75rem;padding:.55rem .75rem;border-radius:.5rem;cursor:pointer;transition:background .15s}.song-row:hover{background:#ffffff0f}.song-row.current{background:#8b5cf61a}.song-num{width:28px;text-align:center;font-size:.8rem;color:#ffffff4d;flex-shrink:0}.eq-bars{display:flex;align-items:flex-end;gap:2px;height:14px;justify-content:center}.eq-bars span{width:3px;background:#8b5cf6;border-radius:1px;animation:eqBounce .8s ease-in-out infinite alternate}.eq-bars span:nth-child(1){height:40%;animation-delay:0s}.eq-bars span:nth-child(2){height:70%;animation-delay:.2s}.eq-bars span:nth-child(3){height:50%;animation-delay:.4s}.song-cover-sm{font-size:1.3rem;flex-shrink:0}.song-details{display:flex;flex-direction:column;flex:1;min-width:0}.song-title{font-size:.9rem;font-weight:500;color:#ffffffe6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-row.current .song-title{color:#a78bfa}.song-artist{font-size:.75rem;color:#fff6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-cat{font-size:.9rem;opacity:.4;flex-shrink:0}.song-dur{font-size:.8rem;color:#ffffff4d;font-family:ui-monospace,monospace;flex-shrink:0;width:40px;text-align:right}.fav-btn{background:none;border:none;color:#ffffff40;font-size:1.1rem;cursor:pointer;padding:.25rem;transition:color .15s,transform .15s;flex-shrink:0}.fav-btn:hover{color:#ec4899;transform:scale(1.15)}.fav-btn.active{color:#ec4899}.no-results,.search-hint{color:#fff6;font-size:.9rem;padding:1rem 0}.player-bar{position:fixed;bottom:0;left:0;right:0;height:80px;background:#111;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;padding:0 1.5rem;z-index:100;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.player-song{display:flex;align-items:center;gap:.75rem;min-width:200px;max-width:280px}.player-cover{font-size:2rem;flex-shrink:0}.player-info{display:flex;flex-direction:column;min-width:0}.player-title{font-size:.9rem;font-weight:600;color:#fafafa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-artist{font-size:.75rem;color:#ffffff73;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-fav-btn{background:none;border:none;color:#ffffff4d;font-size:1.2rem;cursor:pointer;padding:.25rem;transition:color .15s}.player-fav-btn:hover,.player-fav-btn.active{color:#ec4899}.player-center{display:flex;flex-direction:column;align-items:center;gap:.25rem;flex:1;max-width:600px}.player-controls{display:flex;align-items:center;gap:.5rem}.ctrl-btn{background:none;border:none;color:#fff9;font-size:1.1rem;cursor:pointer;padding:.3rem;transition:color .15s,transform .1s}.ctrl-btn:hover{color:#fff;transform:scale(1.1)}.play-btn{width:36px;height:36px;border-radius:50%;background:#fff;color:#000;display:flex;align-items:center;justify-content:center;font-size:1rem}.play-btn:hover{transform:scale(1.05);background:#ffffffe6}.progress-row{display:flex;align-items:center;gap:.5rem;width:100%}.time-label{font-size:.7rem;color:#fff6;font-family:ui-monospace,monospace;width:35px;text-align:center}.progress-bar{flex:1;height:4px;background:#ffffff1a;border-radius:2px;cursor:pointer;position:relative}.progress-fill{height:100%;background:#8b5cf6;border-radius:2px;transition:width .5s linear}.player-right{display:flex;align-items:center;gap:.5rem;min-width:140px;justify-content:flex-end}.vol-icon{font-size:.9rem;color:#fff6}.vol-slider{width:90px;accent-color:#8b5cf6;height:4px}.sidebar-overlay{display:none}@media(max-width:768px){.sidebar{position:fixed;left:-260px;top:0;bottom:0;transition:left .3s;z-index:200}.sidebar.open{left:0}.sidebar-close{display:block}.sidebar-overlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:199}.menu-btn{display:block}.player-bar{height:70px;padding:0 1rem}.player-song{min-width:120px;max-width:160px}.player-right{display:none}.hero-title{font-size:1.6rem}.category-long-box{padding:.75rem 1rem}.clb-preview{display:none}}