html,body,#root{height:100%}body{margin:0;background:#070a0f;color:#eef3ff}:root{--border: rgba(255,255,255,.1);--card: #0b0b12;--card2: #07070d;--muted: #a9b4c7;--accent: #a238ff;--accent2: #6a00ff;--shadow: 0 10px 30px rgba(0,0,0,.45);--radius: 16px}*{box-sizing:border-box}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}.app-shell{min-height:100vh;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:10;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#070a0fbf;border-bottom:1px solid var(--border);padding:14px 18px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:12px}.brand__logo{height:26px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.35))}.brand__title{font-weight:900;letter-spacing:.2px}.brand__subtitle{font-size:12px;color:var(--muted);margin-top:2px}.brand__texts{display:flex;flex-direction:column;line-height:1.1}.nav{display:flex;align-items:center;gap:10px}.btn{border:1px solid var(--border);background:#0b111a;color:#eef3ff;padding:10px 12px;border-radius:12px;cursor:pointer;font-weight:700;display:flex;align-items:center;gap:8px}.btn:hover{filter:brightness(1.08);text-decoration:none}.btn--primary{border-color:#a238ff80;background:#a238ff29}.about{position:relative}.tooltip{position:absolute;right:0;top:calc(100% + 10px);width:min(360px,calc(100vw - 30px));background:#0b1018;border:1px solid var(--border);border-radius:14px;padding:12px;box-shadow:var(--shadow)}.tooltip__title{font-weight:900;margin-bottom:6px}.tooltip__text{color:#d7e0f4;font-size:14px;margin:6px 0}.tooltip__hint{margin-top:8px;color:var(--muted);font-size:12px}.card{background:linear-gradient(180deg,var(--card),var(--card2));border:1px solid rgba(162,56,255,.16);box-shadow:var(--shadow);border-radius:var(--radius)}.small{color:var(--muted);font-size:12px}.search{padding:14px}.search__form{display:flex;gap:10px;align-items:center}.search__icon{color:var(--muted)}.search__input{flex:1;background:#0a0f16;border:1px solid var(--border);color:#eef3ff;border-radius:12px;padding:12px;outline:none}.search__input:focus{border-color:#a238ffa6;box-shadow:0 0 0 4px #a238ff2e}.error{color:#ff8080;margin:10px 0 0}.now{margin-top:10px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.now__state{margin-left:auto;color:#a238fff2;font-weight:800}.section{display:flex;flex-direction:column;gap:12px}.section__header{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.grid{display:grid;gap:14px}.grid--artists{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}.grid--tracks,.grid--albums{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.tile{border-radius:16px;border:1px solid var(--border);background:#0b1018;padding:12px;display:flex;flex-direction:column;gap:10px;transition:transform .12s ease,filter .12s ease;color:#eef3ff}.tile:hover{text-decoration:none;transform:translateY(-2px);filter:none;box-shadow:0 0 0 1px #a238ff59,var(--shadow)}.tile--btn{text-align:left;cursor:pointer;width:100%}.tile__imgWrap{width:100%;aspect-ratio:1 / 1;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.06);background:#060a10}.tile__imgWrap img{width:100%;height:100%;object-fit:cover;display:block}.tile__imgWrap--round{border-radius:999px}.tile__title{color:#eef3ff;font-weight:900;line-height:1.2}.tile__meta{color:var(--muted);font-size:12px}.tile__play{margin-top:2px;color:#a238fff2;font-weight:800;font-size:12px}.artistHeader{padding:14px}.artistHero{display:flex;gap:14px;margin-top:12px;flex-wrap:wrap}.artistHero__img{width:140px;height:140px;border-radius:18px;object-fit:cover;border:1px solid rgba(255,255,255,.08)}.artistHero__name{margin:4px 0 0;font-size:34px;line-height:1.05}.artistHero__info{display:flex;flex-direction:column;gap:6px}.list{padding:6px}.row{width:100%;border:0;background:transparent;color:inherit;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:10px;border-radius:12px}.row:hover{background:#ffffff0a}.row__left{display:flex;align-items:center;gap:10px}.row__idx{width:18px;color:var(--muted)}.row__img{width:40px;height:40px;border-radius:10px;object-fit:cover}.row__texts{display:flex;flex-direction:column;gap:2px}.row__title{font-weight:900}.row__right{color:#a238fff2;font-weight:900}.footer{width:100%;max-width:1300px;margin:12px auto 18px;padding:16px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.footer__links{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap}.icon-link{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:12px;border:1px solid var(--border);background:#0a0f16;font-weight:800}.icon-link:hover{text-decoration:none;filter:brightness(1.08)}.icon-link__text{font-size:12px;color:#e7eeff}.footer__logo{height:74px;padding:8px;border:1px solid var(--border);border-radius:14px;background:#fff;object-fit:contain}@media(max-width:520px){.search__form{flex-direction:column;align-items:stretch}.btn{justify-content:center}}body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}.container{width:100%;max-width:1300px;margin:18px auto;padding:0 18px 110px;display:flex;flex-direction:column;gap:18px}.playerBar{position:fixed;left:0;right:0;bottom:0;z-index:999;background:#0b0f16;border-top:1px solid rgba(255,255,255,.08);padding:12px 16px}.playerBar__inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:60px 1fr auto;gap:14px;align-items:center}.playerBar__cover{width:56px;height:56px;border-radius:10px;overflow:hidden}.playerBar__cover img{width:100%;height:100%;object-fit:cover}.playerBar__title{font-weight:700;line-height:1.2}.playerBar__meta{opacity:.8;font-size:13px}.playerBar__btn{border:0;border-radius:999px;padding:10px 14px;cursor:pointer;font-weight:700}