:root{color:#f8fafc;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#070812;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}html,body,#root{min-height:100%}body{margin:0}*{box-sizing:border-box}button,input{font:inherit}button{cursor:pointer;border:0}.desktop-shell{color:#f8fafc;background:radial-gradient(circle at 20% 10%,#a855f747,#0000 32%),radial-gradient(circle at 78% 20%,#22d3ee29,#0000 28%),linear-gradient(135deg,#070812 0%,#101221 45%,#090a12 100%);grid-template-rows:1fr 104px;grid-template-columns:246px 1fr;min-height:100vh;display:grid;overflow:hidden}.sidebar{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#04061294;border-right:1px solid #ffffff14;flex-direction:column;grid-row:1/3;gap:28px;padding:26px 18px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-mark{background:linear-gradient(135deg,#a855f7,#22d3ee);border-radius:16px;place-items:center;width:44px;height:44px;display:grid;box-shadow:0 14px 35px #a855f759}.brand strong{letter-spacing:-.03em;font-size:20px;display:block}.brand span,.song-meta em,.mini-song em{color:#8d95aa;font-size:12px;font-style:normal}nav{flex-direction:column;gap:8px;display:flex}.nav-item{color:#aab1c5;text-align:left;background:0 0;border-radius:15px;align-items:center;gap:12px;width:100%;padding:12px 14px;display:flex}.nav-item.active,.nav-item:hover{color:#fff;background:#ffffff17}.playlist-card{background:linear-gradient(160deg,#a855f738,#22d3ee17);border:1px solid #ffffff1a;border-radius:24px;margin-top:auto;padding:18px}.playlist-card strong{margin-top:10px;display:block}.playlist-card p{color:#aab1c5;font-size:13px;line-height:1.55}.playlist-card button,.hero-actions button{color:#fff;background:linear-gradient(135deg,#a855f7,#6366f1);border-radius:999px;margin-top:12px;padding:10px 14px}.workspace{min-width:0;padding:18px 18px 0}.titlebar{align-items:center;gap:14px;height:54px;display:flex}.traffic{gap:8px;display:flex}.traffic span{background:#fb7185;border-radius:999px;width:12px;height:12px}.traffic span:nth-child(2){background:#fbbf24}.traffic span:nth-child(3){background:#34d399}.history,.toolbar{color:#8d95aa;gap:10px;display:flex}.search-box{color:#8d95aa;background:#ffffff0f;border:1px solid #ffffff17;border-radius:16px;flex:1;align-items:center;gap:10px;height:42px;padding:0 14px;display:flex}.search-box input{color:#fff;background:0 0;border:0;outline:0;width:100%}.content-grid{grid-template-columns:minmax(520px,1fr) 330px;gap:18px;height:calc(100vh - 176px);display:grid;overflow:hidden}.main-panel,.now-panel{background:#ffffff0e;border:1px solid #ffffff14;border-radius:28px;min-height:0;overflow:auto;box-shadow:inset 0 1px #ffffff12}.main-panel{padding:18px}.hero-card{background:linear-gradient(135deg,#a855f747,#0f172aa6),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cpath fill='none' stroke='rgba(255,255,255,.08)' d='M0 70h140M70 0v140'/%3E%3C/svg%3E");border-radius:26px;grid-template-columns:1fr 180px;align-items:center;gap:20px;padding:26px;display:grid}.eyebrow{color:#67e8f9;letter-spacing:.18em;font-size:12px;font-weight:800}h1{letter-spacing:-.06em;max-width:720px;margin:10px 0;font-size:clamp(30px,4vw,54px);line-height:.98}h2{letter-spacing:-.04em;margin:0}p{margin:0}.hero-card p{color:#b7bfd3;max-width:620px}.hero-actions{gap:12px;margin-top:22px;display:flex}.hero-actions .ghost{background:#ffffff1a}.api-search-card{background:#04061247;border:1px solid #ffffff1a;border-radius:18px;grid-template-columns:116px 1fr auto;gap:10px;margin-top:20px;padding:10px;display:grid}.api-search-card input,.api-search-card select{color:#fff;background:#ffffff14;border:1px solid #ffffff1a;border-radius:12px;outline:0;min-width:0;padding:10px 12px}.api-search-card select option{color:#111827}.api-search-card button{color:#fff;background:linear-gradient(135deg,#22d3ee,#6366f1);border-radius:12px;justify-content:center;align-items:center;gap:7px;padding:10px 14px;display:inline-flex}.api-search-card button:disabled{cursor:wait;opacity:.72}.api-status{color:#aab1c5;margin-top:10px;font-size:13px}.vinyl{background:conic-gradient(from 40deg,#1f2937,#111827,#a855f7,#111827,#22d3ee,#111827);border-radius:999px;place-items:center;width:174px;height:174px;animation:16s linear infinite spin;display:grid}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.stat-row{grid-template-columns:repeat(4,1fr);gap:12px;margin:16px 0 22px;display:grid}.stat-card{background:#ffffff12;border:1px solid #ffffff14;border-radius:20px;padding:16px}.stat-card strong,.stat-card span{display:block}.stat-card span{color:#8d95aa;margin-top:4px;font-size:12px}.section-head{justify-content:space-between;align-items:center;margin:4px 0 12px;display:flex}.chips{flex-wrap:wrap;gap:10px;margin-bottom:12px;display:flex}.chip{color:#b7bfd3;background:#ffffff12;border:1px solid #ffffff14;border-radius:999px;padding:9px 13px}.chip.active{color:#fff;background:#22d3ee2e;border-color:#22d3ee73}.song-list{flex-direction:column;gap:10px;display:flex}.song-row{color:#cbd5e1;text-align:left;background:#ffffff0b;border-radius:18px;grid-template-columns:38px 46px 1fr auto 58px;align-items:center;gap:12px;width:100%;padding:10px 12px;display:grid}.song-row:hover,.song-row.active{background:#ffffff1b}.song-index{color:#697087}.cover{color:#fff;background:linear-gradient(135deg,#a855f7,#22d3ee);border-radius:14px;place-items:center;width:44px;height:44px;display:grid;box-shadow:0 14px 25px #00000040}.image-cover{object-fit:cover;display:block}.from-fuchsia-500{background:linear-gradient(135deg,#d946ef,#8b5cf6,#6366f1)}.from-cyan-400{background:linear-gradient(135deg,#22d3ee,#0ea5e9,#2563eb)}.from-amber-300{background:linear-gradient(135deg,#fcd34d,#f97316,#f43f5e)}.from-emerald-400{background:linear-gradient(135deg,#34d399,#14b8a6,#0891b2)}.from-violet-400{background:linear-gradient(135deg,#a78bfa,#ec4899,#ef4444)}.song-meta strong,.song-meta em{display:block}.badge{color:#cffafe;white-space:nowrap;background:#22d3ee1f;border:1px solid #22d3ee47;border-radius:999px;padding:6px 10px;font-size:12px}.badge.large{align-self:center;margin-top:18px}.now-panel{text-align:center;flex-direction:column;align-items:center;padding:22px;display:flex}.album-art{border-radius:34px;place-items:center;width:230px;height:230px;margin-top:8px;display:grid;box-shadow:0 26px 70px #0000005c}.image-art{object-fit:cover;display:block}.now-panel h2{margin-top:14px;font-size:28px}.now-panel p{color:#9aa3b8}.lyrics{color:#8d95aa;background:#0000002e;border-radius:20px;flex-direction:column;gap:10px;width:100%;margin:24px 0;padding:18px;display:flex}.lyrics .focus{color:#fff;font-size:19px}.queue-note{color:#b7bfd3;background:#ffffff12;border-radius:18px;justify-content:center;gap:8px;width:100%;margin-top:auto;padding:14px;display:flex}.player-bar{-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);background:#040612c2;border-top:1px solid #ffffff14;grid-column:2;grid-template-columns:280px 1fr 220px;align-items:center;gap:20px;padding:14px 22px;display:grid}.mini-song{align-items:center;gap:12px;min-width:0;display:flex}.mini-song div{min-width:0}.mini-song strong,.mini-song em{white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}.player-center{flex-direction:column;align-items:center;gap:10px;display:flex}.controls{color:#aab1c5;align-items:center;gap:18px;display:flex}.controls button{color:#fff;background:0 0}.controls .play{color:#111827;background:#fff;border-radius:999px;place-items:center;width:48px;height:48px;display:grid}.progress-line,.volume{color:#8790a8;align-items:center;gap:10px;width:100%;font-size:12px;display:flex}.volume{justify-content:flex-end}input[type=range]{--value:0%;accent-color:#a855f7;appearance:none;background:linear-gradient(90deg, #a855f7 var(--value), #ffffff24 var(--value));border-radius:999px;width:100%;height:4px}input[type=range]::-webkit-slider-thumb{appearance:none;background:#fff;border-radius:999px;width:13px;height:13px;box-shadow:0 0 0 5px #a855f72e}@media (width<=1100px){.content-grid{grid-template-columns:1fr;overflow:auto}.now-panel{display:none}.stat-row{grid-template-columns:repeat(2,1fr)}}