.pl-overlay{z-index:10000;background:#000c;justify-content:center;align-items:center;padding:24px;animation:.2s ease-out pl-fade;display:flex;position:fixed;inset:0}.pl-modal{border:1px solid #ffffff12;border-top-color:var(--primary-tint-strong);background:radial-gradient(120% 60% at 100% 0%, var(--primary-tint), transparent 60%), var(--bg-panel);border-radius:24px;flex-direction:column;width:440px;max-width:100%;max-height:calc(100vh - 48px);animation:.3s cubic-bezier(.16,1,.3,1) pl-rise;display:flex;overflow:hidden;box-shadow:0 24px 60px #0009}.pl-head{justify-content:space-between;align-items:center;padding:22px 24px 0;display:flex}.pl-title{font-size:var(--text-2xl);color:var(--text-bright);font-weight:800}.pl-close{width:36px;height:36px;color:var(--text-base);background:#ffffff0f;border-radius:50%;place-items:center;transition:color .15s,background .15s;display:grid}.pl-close:hover{color:var(--text-bright);background:#ffffff1f}.pl-track,.pl-row{grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:14px;display:grid}.pl-track{background:#ffffff0d;border-radius:14px;grid-template-columns:48px minmax(0,1fr);margin:16px 24px 4px;padding:12px}.pl-track img,.pl-row img,.pl-cover{object-fit:cover;border-radius:10px;width:48px;height:48px}.pl-cover.is-empty{background:var(--bg-press);color:var(--text-base);place-items:center;display:grid}.pl-text{flex-direction:column;gap:2px;min-width:0;display:flex}.pl-name{white-space:nowrap;text-overflow:ellipsis;font-size:var(--text-md);color:var(--text-bright);font-weight:700;overflow:hidden}.pl-sub{font-size:var(--text-sm);color:var(--text-base)}.pl-list{scrollbar-width:thin;scrollbar-color:#debe4f73 transparent;flex:1;min-height:0;max-height:320px;padding:12px 16px;list-style:none;overflow-y:auto}.pl-row{border-radius:12px;padding:8px;transition:background .15s}.pl-row:hover{background:#ffffff0f}.pl-add{border-radius:var(--radius-pill);background:var(--gold-gradient);height:34px;color:var(--on-primary);font-size:var(--text-sm);align-items:center;gap:6px;padding:0 14px;font-weight:800;transition:transform .1s,filter .15s;display:inline-flex}.pl-add:hover:not(:disabled){filter:brightness(1.06)}.pl-add:active:not(:disabled){transform:scale(.95)}.pl-add:disabled{opacity:.5;cursor:default}.pl-done{font-size:var(--text-sm);color:var(--primary);align-items:center;gap:6px;padding:0 6px;font-weight:800;display:inline-flex}.pl-empty{font-size:var(--text-md);color:var(--text-base);margin:14px 24px 4px;line-height:1.8}.pl-new{border-top:1px solid #ffffff12;gap:10px;padding:16px 24px 22px;display:flex}.pl-new input{border-radius:var(--radius-pill);min-width:0;height:46px;color:var(--text-bright);font:inherit;font-size:var(--text-md);background:#ffffff0f;border:1px solid #ffffff1a;outline:0;flex:1;padding:0 18px;transition:border-color .15s}.pl-new input:focus{border-color:#debe4fb3}.pl-new input::placeholder{color:#b3b3b3d9}.pl-create{border-radius:var(--radius-pill);background:var(--gold-gradient);height:46px;color:var(--on-primary);font-size:var(--text-md);flex-shrink:0;padding:0 20px;font-weight:800}.pl-create:disabled{color:var(--text-subdued);cursor:default;background:#ffffff14}.pl-modal button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}@keyframes pl-fade{0%{opacity:0}}@keyframes pl-rise{0%{opacity:0;transform:translateY(16px)scale(.97)}}@media (prefers-reduced-motion:reduce){.pl-overlay,.pl-modal{animation:none}.pl-modal *{transition:none!important}}