:root{--bg:#0a1627;--bg2:#13243c;--panel:#0f1f33;--panel2:#112840;--card:#0d1b2d;--card2:#0a1524;--text:#e7edf7;--muted:#97abc3;--link:#9ac7ff;--accent:#4a8ae4;--accent2:#2d6fce;--accentText:#ffffff;--chip:#18304b;--chipText:#d6e7fb;--border:rgba(255,255,255,.08);--hover:#1f3653;--sidebar1:#08111f;--sidebar2:#0d1728;--hero:#2f5f92;--success:rgba(40,112,77,.35);--danger:rgba(132,34,34,.35);--shadow:0 12px 36px rgba(0,0,0,.18)}body.theme-ocean{--bg:#0a1627;--bg2:#13243c;--panel:#0f1f33;--panel2:#112840;--card:#0d1b2d;--card2:#0a1524;--text:#e7edf7;--muted:#97abc3;--link:#9ac7ff;--accent:#4a8ae4;--accent2:#2d6fce;--chip:#18304b;--sidebar1:#08111f;--sidebar2:#0d1728;--hover:#1f3653;--hero:#2f5f92}body.theme-emerald{--bg:#071b18;--bg2:#12352f;--panel:#0d2521;--panel2:#12332d;--card:#0b1e1a;--card2:#081813;--text:#e9fbf5;--muted:#9bc5b8;--link:#8ef0cc;--accent:#27b783;--accent2:#1f9068;--chip:#16362e;--sidebar1:#071411;--sidebar2:#0c211b;--hover:#184137;--hero:#22956b}body.theme-violet{--bg:#140d24;--bg2:#23193f;--panel:#1c1530;--panel2:#261d40;--card:#150f28;--card2:#110b20;--text:#f0ebff;--muted:#b4a8d7;--link:#c1a8ff;--accent:#7e63ff;--accent2:#6549da;--chip:#2a2147;--sidebar1:#10091d;--sidebar2:#1a1130;--hover:#322555;--hero:#634bc9}body.theme-sunset{--bg:#22120b;--bg2:#4a2314;--panel:#2f180f;--panel2:#3d2115;--card:#25140d;--card2:#1d0f0a;--text:#fff1e9;--muted:#d1b39f;--link:#ffc08f;--accent:#f07c3e;--accent2:#c95a22;--chip:#4a2517;--sidebar1:#170c07;--sidebar2:#2a140d;--hover:#562818;--hero:#b85d2e}body.theme-ruby{--bg:#210c12;--bg2:#431724;--panel:#2d1119;--panel2:#3a1621;--card:#240d14;--card2:#1c0a10;--text:#ffedf1;--muted:#d5aab5;--link:#ff9db6;--accent:#d9486a;--accent2:#b92f52;--chip:#441826;--sidebar1:#16080d;--sidebar2:#260d15;--hover:#501825;--hero:#a93655}body.theme-amber{--bg:#211707;--bg2:#47320d;--panel:#31220b;--panel2:#40300f;--card:#261b09;--card2:#1c1407;--text:#fff7e6;--muted:#d3c08f;--link:#ffd777;--accent:#d8a226;--accent2:#b78210;--chip:#46350f;--sidebar1:#171005;--sidebar2:#261b08;--hover:#574018;--hero:#a57c1a}body.theme-slate{--bg:#14191f;--bg2:#232d37;--panel:#1b232c;--panel2:#222d38;--card:#151c24;--card2:#10161d;--text:#edf3f8;--muted:#a4b1bf;--link:#9cc3e8;--accent:#5c8cb7;--accent2:#486f92;--chip:#24313d;--sidebar1:#10151a;--sidebar2:#171f28;--hover:#31404e;--hero:#44647e}body.theme-forest{--bg:#0e170d;--bg2:#203620;--panel:#142114;--panel2:#1b2a1a;--card:#101b10;--card2:#0b140b;--text:#eef8ee;--muted:#a6bba3;--link:#a7e8a0;--accent:#4c9d4a;--accent2:#387a37;--chip:#213721;--sidebar1:#0b110a;--sidebar2:#141f13;--hover:#2c462b;--hero:#3f7c3d}body.theme-neon{--bg:#07151a;--bg2:#0d2831;--panel:#0b1f26;--panel2:#102932;--card:#09181e;--card2:#071117;--text:#ecfeff;--muted:#9fd0d7;--link:#70f7ff;--accent:#00b8d4;--accent2:#0b94ab;--chip:#15343d;--sidebar1:#051014;--sidebar2:#0a1a21;--hover:#133742;--hero:#0e7d8f}body.theme-rose{--bg:#1d1018;--bg2:#382032;--panel:#271621;--panel2:#341d2c;--card:#1f121a;--card2:#170d13;--text:#fff0f7;--muted:#d6afc2;--link:#ffb2d8;--accent:#d663a0;--accent2:#b64e86;--chip:#432133;--sidebar1:#130b10;--sidebar2:#1f1119;--hover:#4e2640;--hero:#a74f7d}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Segoe UI,Inter,Arial,sans-serif;background:linear-gradient(180deg,var(--bg),var(--bg2) 35%,var(--card2) 100%);color:var(--text)}a{color:var(--link);text-decoration:none}a:hover{text-decoration:underline}.app-shell{display:grid;grid-template-columns:290px 1fr;min-height:100vh;padding-bottom:112px}.sidebar{background:linear-gradient(180deg,var(--sidebar1),var(--sidebar2));border-right:1px solid var(--border);padding:20px 16px;position:sticky;top:0;height:100vh;overflow:auto}.brand-wrap{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:18px}.brand-logo{display:block;width:100%;max-width:140px;height:auto}.brand-byline{color:var(--muted);font-size:12px;padding-left:4px}.sidebar-nav{display:grid;gap:6px;margin-bottom:18px}.sidebar-nav a,.artist-link{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:10px;color:var(--text);background:transparent;border:1px solid transparent}.sidebar-nav a:hover,.artist-link:hover,.sidebar-nav a.active,.artist-link.active{background:linear-gradient(180deg,var(--hover),rgba(255,255,255,.02));border-color:var(--border);text-decoration:none}.sidebar-section-title{margin:18px 6px 10px;color:var(--muted);font-size:11px;letter-spacing:.16em;text-transform:uppercase}.artist-list{display:grid;gap:6px}.main-area{padding:24px 24px 28px}.topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}.topbar h1{margin:4px 0 0;font-size:34px;color:#fff}.topbar-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.page-kicker{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--link)}.panel,.subpanel{background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 86%, white 14%),color-mix(in srgb,var(--panel2) 92%, black 8%));border:1px solid var(--border);border-radius:16px;padding:18px;box-shadow:var(--shadow);margin-bottom:18px}.panel-title-row{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:14px}.panel h2,.subpanel h2{margin:0;font-size:22px;color:#fff}.toolbar,.btn-row,.inline-form,.chip-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.toolbar label,.field{display:flex;flex-direction:column;gap:6px}.toolbar label{font-size:12px;color:var(--muted)}.field label{font-size:13px;color:var(--muted)}.field input,.field select,.field textarea,.toolbar select,.toolbar input,.theme-select{width:100%;padding:11px 12px;border-radius:10px;border:1px solid var(--border);background:var(--card2);color:var(--text);outline:none}.field input:focus,.field select:focus,.toolbar select:focus,.toolbar input:focus,.theme-select:focus{border-color:var(--accent)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 16px;border-radius:10px;border:1px solid color-mix(in srgb,var(--accent) 80%, white 20%);background:linear-gradient(180deg,var(--accent),var(--accent2));color:var(--accentText);font-weight:700;cursor:pointer;text-decoration:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}.btn:hover{text-decoration:none;filter:brightness(1.05)}.btn.secondary{background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 70%, white 30%),var(--panel2));border-color:var(--border)}.btn.ghost{background:linear-gradient(180deg,color-mix(in srgb,var(--card) 70%, white 10%),var(--card2));border-color:var(--border)}.btn.accent{background:linear-gradient(180deg,#f6be37,#dc9c16);border-color:#f2bb45;color:#1b1300}.btn.small{padding:8px 11px;font-size:12px;border-radius:8px}.btn-row.nowrap{flex-wrap:nowrap}.flash{padding:12px 14px;border-radius:12px;margin-bottom:16px;border:1px solid var(--border)}.flash.success{background:var(--success);color:#d9ffe8}.flash.danger{background:var(--danger);color:#ffd5d5}.muted{color:var(--muted)}.album-grid,.video-grid,.user-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.album-card,.video-card{background:linear-gradient(180deg,var(--card),var(--card2));border:1px solid var(--border);border-radius:14px;overflow:hidden}.album-cover,.video-frame{display:block;aspect-ratio:1/1;background:var(--card2);overflow:hidden}.video-frame{aspect-ratio:16/9}.album-cover img,.video-frame img,.video-frame video,.artist-photo-box img{width:100%;height:100%;object-fit:cover;display:block}.album-body,.video-body{padding:12px}.album-title{font-size:16px;font-weight:700;color:#fff;margin-bottom:4px}.album-subtitle{font-size:13px;color:var(--link);margin-bottom:6px}.album-meta{font-size:12px;color:var(--muted)}.album-placeholder{display:grid;place-items:center;height:100%;min-height:220px;background:radial-gradient(circle at top,var(--hero),var(--card2));color:#edf6ff;font-weight:700}.album-placeholder.tall{min-height:280px}.artist-panel{display:grid;grid-template-columns:260px 1fr;gap:18px;align-items:start}.artist-photo-box{border-radius:14px;overflow:hidden;border:1px solid var(--border);background:var(--card2);min-height:280px}.artist-details h2{margin:0 0 8px;font-size:32px;color:#fff}.artist-bio{line-height:1.65;color:var(--text)}.chip{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:var(--chip);border:1px solid var(--border);font-size:12px;color:var(--chipText)}.chip-accent{background:var(--hero);color:#fff}.table-shell{overflow:auto;border-radius:12px;border:1px solid var(--border)}.tracks-table{width:100%;border-collapse:collapse;background:var(--card2)}.tracks-table th,.tracks-table td{padding:12px 10px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}.tracks-table th{background:var(--panel2);color:var(--muted);font-size:11px;letter-spacing:.12em;text-transform:uppercase}.tracks-table tbody tr:nth-child(even){background:rgba(255,255,255,.02)}.playlist-list{display:flex;gap:10px;flex-wrap:wrap}.playlist-pill{display:inline-flex;gap:8px;align-items:center;padding:10px 14px;border-radius:999px;background:var(--panel2);border:1px solid var(--border);color:var(--text)}.playlist-pill.active{background:var(--hero)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}.stat-box{padding:16px;border-radius:12px;background:var(--card);border:1px solid var(--border);display:flex;flex-direction:column;gap:6px}.stat-box strong{font-size:28px;color:#fff}.stat-box span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.split-panel{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.compact select,.compact input[type=file],.compact input[type=text]{max-width:100%}.empty{padding:26px;border-radius:16px;background:var(--card);border:1px dashed var(--border);text-align:center;color:var(--muted)}.player-dock{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:16px;align-items:center;padding:14px 18px;background:linear-gradient(180deg,rgba(7,13,22,.92),rgba(7,13,22,.98));border-top:1px solid var(--border);backdrop-filter:blur(12px);z-index:90}.dock-left strong{display:block;color:#fff;font-size:15px;margin:2px 0 4px}.dock-label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--link)}.queue-list{max-height:78px;overflow:auto;font-size:12px;color:var(--text)}.queue-item{padding:4px 0}.queue-item.active{color:#fff;font-weight:700}.login-screen{display:grid;place-items:center;min-height:100vh;padding:24px;background:radial-gradient(circle at top,var(--hero),var(--card2) 58%)}.login-box{width:min(520px,100%);background:linear-gradient(180deg,var(--panel),var(--card2));padding:28px;border-radius:18px;border:1px solid var(--border);box-shadow:0 24px 60px rgba(0,0,0,.35)}.login-logo{display:block;width:100%;max-width:180px;margin-bottom:10px}.login-box h1{margin:14px 0 8px;color:#fff;font-size:32px}.theme-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.theme-form label{font-size:12px;color:var(--muted)}.theme-form-config{flex-direction:column;align-items:flex-start}.theme-form-config .theme-select{min-width:220px}@media(max-width:1100px){.app-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto}.player-dock{grid-template-columns:1fr;gap:10px}.artist-panel,.split-panel{grid-template-columns:1fr}}.dock-center{display:flex;flex-direction:column;gap:10px}.dock-controls{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}.player-nav-btn{min-width:120px}.queue-item{display:block;width:100%;background:transparent;border:0;padding:6px 0;text-align:left;color:var(--text);cursor:pointer}.queue-item:hover{text-decoration:none;opacity:.92}.queue-item.active{color:#fff;font-weight:700}@media(max-width:680px){.main-area{padding:16px}.album-grid,.video-grid,.user-grid{grid-template-columns:1fr}.topbar{flex-direction:column}.tracks-table th:nth-child(4),.tracks-table td:nth-child(4){display:none}.dock-controls{justify-content:stretch}.player-nav-btn{flex:1;min-width:0}}

.player-dock{grid-template-columns:minmax(320px,1.2fr) minmax(320px,1.1fr) minmax(220px,.9fr);gap:18px;padding:14px 20px;background:linear-gradient(180deg,rgba(7,13,22,.88),rgba(7,13,22,.98));box-shadow:0 -10px 30px rgba(0,0,0,.22)}
.now-playing-card{display:flex;align-items:center;gap:14px;padding:10px 12px;border:1px solid var(--border);border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--panel) 88%, white 12%),color-mix(in srgb,var(--card2) 90%, black 10%));min-height:92px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.now-cover-shell{width:72px;height:72px;flex:0 0 72px;border-radius:14px;overflow:hidden;background:radial-gradient(circle at top,var(--hero),var(--card2));border:1px solid var(--border);display:grid;place-items:center;box-shadow:0 8px 18px rgba(0,0,0,.22)}
.now-cover-image{width:100%;height:100%;object-fit:cover;display:block}
.now-cover-placeholder{width:100%;height:100%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:24px;letter-spacing:.08em}
.now-playing-meta{min-width:0;display:flex;flex-direction:column;gap:4px}
.now-playing-meta #now-title{font-size:18px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.now-artist,.now-album{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.now-artist{color:#fff;font-weight:600}
.now-album{font-size:12px}
.dock-center,.dock-right{padding:10px 12px;border:1px solid var(--border);border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--panel) 84%, white 16%),color-mix(in srgb,var(--card2) 92%, black 8%))}
.queue-list{max-height:92px}
@media(max-width:1100px){.player-dock{grid-template-columns:1fr}.now-playing-card{min-height:auto}}
@media(max-width:680px){.now-cover-shell{width:60px;height:60px;flex-basis:60px}.now-playing-meta #now-title{font-size:16px}.now-playing-card{padding:10px}.dock-center,.dock-right{padding:10px}}

.artist-link{gap:10px}
.artist-link-media{display:flex;align-items:center;gap:10px;min-width:0;width:100%}
.artist-thumb-shell{width:38px;height:38px;flex:0 0 38px;border-radius:10px;overflow:hidden;border:1px solid var(--border);background:linear-gradient(135deg,var(--hero),var(--card2));box-shadow:0 6px 14px rgba(0,0,0,.18)}
.artist-thumb{width:100%;height:100%;display:block;object-fit:cover}
.artist-thumb-placeholder{display:grid;place-items:center;color:#fff;font-weight:800;font-size:18px}
.artist-link-name{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}