.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);padding:var(--s-3) var(--s-5);border-radius:var(--r-full);font-weight:600;font-size:var(--fs-base);line-height:1;white-space:nowrap;border:1px solid transparent;transition:transform var(--t-fast) var(--ease),background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),color var(--t-fast) var(--ease)}.btn svg{width:18px;height:18px;flex-shrink:0}@media (hover: hover){.btn:hover{transform:translateY(-1px)}}.btn:active{transform:translateY(0) scale(.98)}.btn--primary{background:var(--brand);color:var(--text-on-brand);box-shadow:var(--sh-brand)}.btn--primary:hover{background:var(--brand-strong);color:var(--text-on-brand)}.btn--grad{background:var(--brand-grad);color:#fff;box-shadow:var(--sh-brand)}.btn--grad:hover{color:#fff;filter:brightness(1.08)}.btn--ghost{background:var(--surface);color:var(--text);border-color:var(--line-2)}.btn--ghost:hover{background:var(--surface-2);color:var(--text)}.btn--quiet{background:transparent;color:var(--text-2)}.btn--quiet:hover{background:var(--surface);color:var(--text)}.btn--sm{padding:var(--s-2) var(--s-4);font-size:var(--fs-sm)}.btn--sm svg{width:15px;height:15px}.btn--lg{padding:var(--s-4) var(--s-6);font-size:var(--fs-md)}.icon-btn{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:var(--r-full);color:var(--text-2);flex-shrink:0;transition:background var(--t-fast) var(--ease),color var(--t-fast) var(--ease)}.icon-btn svg{width:19px;height:19px}.icon-btn:hover{background:var(--surface-2);color:var(--text)}.icon-btn--on{color:var(--brand-soft)}.icon-btn--sm{width:32px;height:32px}.icon-btn--sm svg{width:16px;height:16px}.play-fab{display:inline-grid;place-items:center;width:56px;height:56px;border-radius:var(--r-full);background:var(--brand-grad);color:#fff;box-shadow:var(--sh-brand);transition:transform var(--t-fast) var(--ease),filter var(--t-fast) var(--ease)}.play-fab svg{width:24px;height:24px;margin-left:2px}.play-fab:hover{transform:scale(1.06);filter:brightness(1.08)}.play-fab:active{transform:scale(.97)}.play-fab--sm{width:42px;height:42px}.play-fab--sm svg{width:18px;height:18px}.badge{display:inline-flex;align-items:center;gap:var(--s-1);padding:3px var(--s-2);border-radius:var(--r-sm);background:var(--surface-2);color:var(--text-2);font-size:var(--fs-xs);font-weight:600;line-height:1.5}.badge--brand{background:color-mix(in srgb,var(--brand) 20%,transparent);color:var(--brand-soft)}.badge--live{background:color-mix(in srgb,var(--danger) 20%,transparent);color:var(--danger)}.badge--lg{color:#fff}.badge--vi{background:var(--lg-vi)}.badge--en{background:var(--lg-en)}.badge--ja{background:var(--lg-ja)}.badge--ko{background:var(--lg-ko)}.badge--zh{background:var(--lg-zh)}.badge--other,.badge--inst{background:var(--lg-other)}.chips{display:flex;flex-wrap:wrap;gap:var(--s-2)}.chip{display:inline-flex;align-items:center;gap:var(--s-2);padding:var(--s-2) var(--s-4);border-radius:var(--r-full);background:var(--surface);border:1px solid var(--line);color:var(--text-2);font-size:var(--fs-sm);font-weight:600;transition:all var(--t-fast) var(--ease)}.chip:hover{background:var(--surface-2);color:var(--text);border-color:var(--line-2)}.chip--on{background:var(--brand);border-color:var(--brand);color:var(--text-on-brand)}.chip--on:hover{background:var(--brand-strong);color:var(--text-on-brand)}.chips--scroll{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--s-5) * -1);padding:0 var(--s-5) var(--s-2)}.chips--scroll::-webkit-scrollbar{display:none}.chips--scroll .chip{flex-shrink:0}.card{position:relative;min-width:0}.card__art{position:relative;aspect-ratio:1;border-radius:var(--r-md);overflow:hidden;background:var(--surface-2);margin-bottom:var(--s-3);box-shadow:var(--sh-1)}.card__art img{width:100%;height:100%;object-fit:cover;transition:transform var(--t-slow) var(--ease)}@media (hover: hover){.card:hover .card__art img{transform:scale(1.06)}}.card__play{position:absolute;right:var(--s-3);bottom:var(--s-3);opacity:0;transform:translateY(8px);transition:opacity var(--t) var(--ease),transform var(--t) var(--ease)}@media (hover: hover){.card:hover .card__play,.card:focus-within .card__play{opacity:1;transform:translateY(0)}}@media (hover: none){.card__play{opacity:1;transform:none}}.card__title{font-size:var(--fs-base);font-weight:600;margin:0 0 2px;line-height:1.35}.card__sub{font-size:var(--fs-sm);color:var(--text-2);margin:0;line-height:1.4}.card__stat{font-size:var(--fs-xs);color:var(--text-3);margin-top:var(--s-1);display:flex;align-items:center;gap:var(--s-1)}.card__stat svg{width:12px;height:12px}.card--artist{text-align:center}.card--artist .card__art{border-radius:var(--r-full)}.card--artist .card__play{right:50%;transform:translate(50%,8px)}@media (hover: hover){.card--artist:hover .card__play{transform:translate(50%,0)}}@media (hover: none){.card--artist .card__play{transform:translate(50%,0)}}.card--video .card__art{aspect-ratio:16 / 9;border-radius:var(--r)}.card__dur{position:absolute;right:var(--s-2);bottom:var(--s-2);padding:2px 6px;border-radius:var(--r-sm);background:rgba(0,0,0,.78);color:#fff;font-size:var(--fs-xs);font-weight:600;font-variant-numeric:tabular-nums}.card--rank{display:grid;grid-template-columns:40px minmax(0,1fr);gap:var(--s-3);align-items:center}.card__rank{font-size:var(--fs-xl);font-weight:800;color:var(--text-3);text-align:center;font-variant-numeric:tabular-nums;line-height:1}.card--rank:nth-child(1) .card__rank{color:var(--brand)}.card--rank:nth-child(2) .card__rank{color:var(--brand-soft)}.card--rank:nth-child(3) .card__rank{color:var(--brand-2)}.tracklist{display:flex;flex-direction:column}.trow{display:grid;grid-template-columns:36px 44px minmax(0,1fr) auto auto;align-items:center;gap:var(--s-3);padding:var(--s-2) var(--s-3);border-radius:var(--r);transition:background var(--t-fast) var(--ease)}.trow:hover{background:var(--surface)}.trow--playing{background:var(--surface-2)}.trow--playing .trow__title{color:var(--brand-soft)}.trow__no{text-align:center;color:var(--text-3);font-size:var(--fs-sm);font-variant-numeric:tabular-nums}.trow__no .trow__play{display:none}@media (hover: hover){.trow:hover .trow__no .num-text{display:none}.trow:hover .trow__no .trow__play{display:inline-grid}}.trow__art{width:44px;height:44px;border-radius:var(--r-sm);overflow:hidden;background:var(--surface-2);flex-shrink:0}.trow__art img{width:100%;height:100%;object-fit:cover}.trow__main{min-width:0}.trow__title{font-weight:600;font-size:var(--fs-base);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trow__sub{font-size:var(--fs-sm);color:var(--text-2);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trow__actions{display:flex;align-items:center;gap:var(--s-1);opacity:0}@media (hover: hover){.trow:hover .trow__actions,.trow:focus-within .trow__actions{opacity:1}}@media (hover: none){.trow__actions{opacity:1}}.trow__dur{color:var(--text-2);font-size:var(--fs-sm);font-variant-numeric:tabular-nums;min-width:42px;text-align:right}@media (max-width: 640px){.trow{grid-template-columns:44px minmax(0,1fr) auto;gap:var(--s-3)}.trow__no,.trow__dur{display:none}}.eq{display:inline-flex;align-items:flex-end;gap:2px;height:14px}.eq i{width:3px;background:var(--brand-soft);border-radius:1px;animation:eq 900ms ease-in-out infinite}.eq i:nth-child(1){height:40%;animation-delay:-300ms}.eq i:nth-child(2){height:100%;animation-delay:-150ms}.eq i:nth-child(3){height:65%}@keyframes eq{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}@media (prefers-reduced-motion: reduce){.eq i{animation:none;height:70%}}.search{position:relative;flex:1;max-width:460px}.search__input{width:100%;padding:var(--s-3) var(--s-4) var(--s-3) 42px;border-radius:var(--r-full);background:var(--surface);border:1px solid var(--line);color:var(--text);font-size:var(--fs-base);transition:border-color var(--t-fast) var(--ease),background var(--t-fast) var(--ease)}.search__input::placeholder{color:var(--text-3)}.search__input:focus{background:var(--surface-2);border-color:var(--brand);outline:none}.search__icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--text-3);pointer-events:none}@media (max-width: 860px){.search{max-width:none}}@media (max-width: 640px){.header .search{display:none}}.empty{text-align:center;padding:var(--s-8) var(--s-4);color:var(--text-2)}.empty svg{width:56px;height:56px;color:var(--text-3);margin-bottom:var(--s-4)}.empty h3{color:var(--text);margin-bottom:var(--s-2)}.pager{display:flex;align-items:center;justify-content:center;gap:var(--s-2);margin-top:var(--s-6);flex-wrap:wrap}.pager__item{min-width:38px;height:38px;padding:0 var(--s-3);display:inline-grid;place-items:center;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);color:var(--text-2);font-weight:600;font-size:var(--fs-sm);transition:all var(--t-fast) var(--ease)}.pager__item:hover{background:var(--surface-2);color:var(--text)}.pager__item--on{background:var(--brand);border-color:var(--brand);color:var(--text-on-brand)}.pager__item--off{opacity:.4;pointer-events:none}.langsw{display:inline-flex;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-full);padding:2px;gap:2px}.langsw a{padding:5px var(--s-3);border-radius:var(--r-full);font-size:var(--fs-xs);font-weight:700;color:var(--text-2);text-transform:uppercase;letter-spacing:.04em;transition:all var(--t-fast) var(--ease)}.langsw a:hover{color:var(--text)}.langsw a[aria-current="true"]{background:var(--brand);color:var(--text-on-brand)}.lyrics{white-space:pre-line;line-height:2;color:var(--text-2);font-size:var(--fs-md);max-width:var(--w-read)}.lyrics--empty{color:var(--text-3);font-style:italic;font-size:var(--fs-base)}.tabs{display:flex;gap:var(--s-1);border-bottom:1px solid var(--line);margin-bottom:var(--s-4)}.tabs__btn{padding:var(--s-3) var(--s-4);font-weight:600;font-size:var(--fs-sm);color:var(--text-2);border-bottom:2px solid transparent;margin-bottom:-1px;transition:all var(--t-fast) var(--ease)}.tabs__btn:hover{color:var(--text)}.tabs__btn[aria-selected="true"]{color:var(--brand-soft);border-bottom-color:var(--brand)}.toast-host{position:fixed;left:50%;bottom:calc(var(--h-player) + var(--s-4));transform:translateX(-50%);z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--s-2);pointer-events:none}@media (max-width: 1079px){.toast-host{bottom:calc(var(--h-player-m) + var(--h-tabbar) + var(--s-4))}}.toast{background:var(--surface-3);color:var(--text);padding:var(--s-3) var(--s-5);border-radius:var(--r-full);box-shadow:var(--sh-2);font-size:var(--fs-sm);font-weight:600;animation:toast-in var(--t) var(--ease)}.toast--err{background:var(--danger);color:#fff}@keyframes toast-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.skel{background:linear-gradient(90deg,var(--surface) 25%,var(--surface-2) 37%,var(--surface) 63%);background-size:400% 100%;animation:skel 1.4s ease infinite;border-radius:var(--r-sm)}@keyframes skel{from{background-position:100% 50%}to{background-position:0 50%}}.info{border-top:1px solid var(--line)}.info__row{display:grid;grid-template-columns:120px minmax(0,1fr);gap:var(--s-3);padding:var(--s-3) 0;border-bottom:1px solid var(--line);font-size:var(--fs-sm)}.info__k{color:var(--text-3);font-weight:600}.info__v{color:var(--text)}.notice{display:flex;gap:var(--s-3);padding:var(--s-4);border-radius:var(--r);background:var(--surface);border:1px solid var(--line);font-size:var(--fs-sm);color:var(--text-2)}.notice svg{width:20px;height:20px;color:var(--text-3);flex-shrink:0;margin-top:2px}.notice strong{color:var(--text);display:block;margin-bottom:2px}.ph{display:grid;place-items:center;width:100%;height:100%;background:linear-gradient(145deg,hsl(var(--ph-h,260) 55% 32%),hsl(calc(var(--ph-h,260) + 40) 60% 20%));color:rgba(255,255,255,.82);font-size:2.2rem;font-weight:800;text-transform:uppercase;user-select:none}.trow__art .ph{font-size:1.05rem}.player__art .ph{font-size:1.2rem}