:root{--bg:#000;--panel:#121212;--panel2:#181818;--panel3:#242424;--muted:#b3b3b3;--text:#fff;--accent:#1ed760;--danger:#ff5f57;--line:#2a2a2a;--radius:10px;--player-h:90px;--side-w:250px;--queue-w:330px;--topbar-height:64px;--content-top-offset:22px;--shadow:0 14px 40px rgba(0,0,0,.45)}
*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}button,input{font:inherit}button{color:inherit}.hidden{display:none!important}
/* Unified vector icon system: dependency-free, crisp at every DPI and consistent on touch/desktop. */
.icon-sprite{position:absolute!important;width:0!important;height:0!important;overflow:hidden!important;pointer-events:none!important}
.icon{width:20px;height:20px;display:inline-block;vertical-align:-.16em;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
button>.icon{pointer-events:none}
.ico.icon{width:23px;height:23px;text-align:initial;font-size:initial}
.brand-mark .icon{width:19px;height:19px;stroke-width:2.1}
.top-search .icon{width:19px;height:19px}
.outline-pill{display:inline-flex;align-items:center;justify-content:center;gap:7px}
.outline-pill .icon{width:18px;height:18px}
.history-buttons .icon,.queue-head .icon{width:19px;height:19px}
.user-menu-chevron .icon{width:15px;height:15px}
.card-play,.round-play,.play-main{display:grid;place-items:center}
.card-play .icon,.round-play .icon{width:22px;height:22px;stroke-width:2.15}
.play-main .icon{width:20px;height:20px;stroke-width:2.2}
.transport button,.player-extra button,.like-btn{position:relative;display:grid;place-items:center}
.transport button .icon,.player-extra button .icon,.like-btn .icon{width:19px;height:19px}
#shuffleBtn.active,#repeatBtn.active,#playerLike.active,.row-actions .liked{color:var(--accent)}
#playerLike.active .icon,.row-actions .liked .icon,.liked-art .icon{fill:currentColor}
.hero-icon{width:72px;height:72px;stroke-width:1.25;color:#e9e9e9}
.mobile-nav-ico.icon{width:24px;height:24px;font-size:initial}
.mobile-brand-mark .icon{width:20px;height:20px}
.cover-fallback>.icon,.mini-cover>.icon,.card-cover>.icon{width:34%;height:34%;min-width:20px;min-height:20px;color:#a4a4a4;stroke-width:1.45}
/* Metadata administration */
.metadata-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
.metadata-actions button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px}
.metadata-actions .icon{width:18px;height:18px}
.metadata-state{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:700;padding:6px 9px;border-radius:999px;background:#242424}
.metadata-state.ok{color:var(--accent)}
.metadata-state.off{color:var(--muted)}
.compact-toggle{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;cursor:pointer}
.compact-toggle input{accent-color:var(--accent)}
.metadata-progress{margin-top:15px;padding:13px;border-radius:8px;background:#171717;border:1px solid var(--line)}
.metadata-progress-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:9px}
.metadata-progress-head span,.metadata-progress .muted{font-size:12px}
.progress-track{height:6px;border-radius:999px;overflow:hidden;background:#383838;margin-bottom:8px}
.progress-track>span{display:block;width:0;height:100%;background:var(--accent);border-radius:inherit;transition:width .18s ease}
.auth-shell{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 50% -20%,#244b34 0,#111 38%,#000 80%);padding:28px}.auth-card{width:min(470px,96vw);background:#121212;border-radius:18px;padding:38px 42px;box-shadow:var(--shadow)}.auth-brand{justify-content:center;margin-bottom:26px}.auth-card h1{font-size:34px;letter-spacing:-1px;text-align:center;margin:0 0 8px}.auth-sub{text-align:center;color:var(--muted);line-height:1.5}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:#202020;padding:4px;border-radius:999px;margin:24px 0}.auth-tabs button{border:0;background:transparent;border-radius:999px;padding:9px;cursor:pointer}.auth-tabs button.active{background:#333}.auth-form{display:grid;gap:5px}.auth-form label{font-size:13px;font-weight:700}.auth-form input:not([type=checkbox]){width:100%;background:#222;border:1px solid #555;color:#fff;padding:12px;border-radius:6px;margin:6px 0 12px}.auth-form input:not([type=checkbox]):focus{outline:2px solid #fff;outline-offset:1px}.primary{background:var(--accent);border:0;color:#000;font-weight:800;padding:13px;cursor:pointer}.pill{border-radius:999px}.auth-error{min-height:22px;color:#ff7f7f;margin-top:12px;text-align:center}
.app-shell{height:100vh;display:grid;grid-template-columns:var(--side-w) minmax(0,1fr) 0;grid-template-rows:minmax(0,1fr) var(--player-h);grid-template-areas:"side main queue" "player player player";gap:8px;padding:8px;background:#000;overflow:hidden}.app-shell.queue-open{grid-template-columns:var(--side-w) minmax(0,1fr) var(--queue-w)}
.sidebar{grid-area:side;background:var(--panel);border-radius:var(--radius);padding:18px 10px 10px;display:flex;flex-direction:column;min-height:0}.brand{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:800;padding:0 10px 18px}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#fff;color:#000;font-size:20px}.main-nav{display:grid;gap:3px}.nav-item{width:100%;display:flex;align-items:center;gap:12px;background:transparent;border:0;color:var(--muted);font-weight:700;padding:10px;border-radius:7px;text-align:left;cursor:pointer}.nav-item:hover,.nav-item.active{color:#fff;background:#1a1a1a}.ico{width:24px;text-align:center;font-size:23px}.library-head{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:13px;text-transform:uppercase;font-weight:800;letter-spacing:.5px;padding:20px 10px 8px}.library-head button{border:0;background:transparent;color:var(--muted);font-size:22px;cursor:pointer}.library-head button:hover{color:#fff}.playlist-nav{overflow:auto;min-height:0;scrollbar-width:thin}.playlist-nav button{display:block;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:0;background:transparent;color:#bbb;text-align:left;padding:7px 10px;cursor:pointer;border-radius:4px}.playlist-nav button:hover,.playlist-nav button.active{color:#fff;background:#202020}.sidebar-bottom{border-top:1px solid var(--line);padding-top:8px;margin-top:auto}.liked-icon{display:grid;place-items:center;width:24px;height:24px;border-radius:5px;background:linear-gradient(135deg,#421bce,#9bb6ff);font-size:12px}
.main-panel{grid-area:main;background:linear-gradient(#252525 0,#121212 250px);border-radius:var(--radius);min-width:0;overflow:hidden;position:relative}.topbar{position:absolute;z-index:10;top:0;left:0;right:0;height:var(--topbar-height);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 22px;background:rgba(18,18,18,.6);backdrop-filter:blur(14px)}.history-buttons{display:flex;gap:8px}.history-buttons button,.queue-head button{width:34px;height:34px;border:0;border-radius:50%;background:rgba(0,0,0,.65);font-size:26px;display:grid;place-items:center;cursor:pointer}.top-search{flex:1;max-width:470px;background:#fff;color:#111;border-radius:999px;height:42px;display:flex;align-items:center;gap:8px;padding:0 14px}.top-search input{border:0;outline:0;min-width:0;flex:1}.top-actions{display:flex;align-items:center;gap:10px}.outline-pill{border:1px solid #777;background:#0b0b0b;border-radius:999px;padding:8px 14px;font-weight:700;cursor:pointer}.outline-pill:hover{transform:scale(1.02);border-color:#fff}.user-menu-wrap{position:relative}.user-pill{border:0;border-radius:999px;background:#050505;display:flex;align-items:center;gap:7px;padding:4px 10px 4px 4px;cursor:pointer;font-weight:700}.avatar-small{width:28px;height:28px;border-radius:50%;background:#535353;display:grid;place-items:center}.popover{position:absolute;right:0;top:44px;background:#282828;border-radius:5px;box-shadow:var(--shadow);padding:4px;width:170px}.popover button{width:100%;border:0;background:transparent;padding:10px;text-align:left;cursor:pointer;border-radius:4px;display:flex;align-items:center;gap:9px}.popover button .icon{width:18px;height:18px;color:#d6d6d6}.popover button:hover{background:#3a3a3a}.content{height:100%;overflow:auto;padding:86px 24px calc(var(--player-h) / 4 + 30px);scrollbar-color:#555 transparent;outline:none}.content h1,.content h2{letter-spacing:-.7px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:22px 0 12px}.section-head h2{margin:0;font-size:24px}.muted{color:var(--muted)}
.hero{min-height:260px;margin:-22px -24px 22px;padding:80px 24px 22px;display:flex;align-items:end;gap:24px;background:linear-gradient(180deg,rgba(83,83,83,.5),rgba(18,18,18,.2))}.hero-art{width:190px;height:190px;flex:0 0 190px;border-radius:4px;box-shadow:0 10px 35px rgba(0,0,0,.45);overflow:hidden;display:grid;place-items:center;font-size:64px;background:linear-gradient(135deg,#3e3e3e,#171717)}.hero-art.artist-art{border-radius:50%}.hero-art.liked-art{background:linear-gradient(135deg,#4318d1,#9eb9ff)}.hero-art img,.card-cover img,.player-cover img{width:100%;height:100%;object-fit:cover}.hero-copy{min-width:0}.hero-copy small{text-transform:uppercase;font-size:12px;font-weight:800}.hero-copy h1{font-size:clamp(38px,6vw,78px);line-height:.95;margin:10px 0 14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hero-copy p{color:#ddd;margin:0}
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:16px}.media-card{background:#181818;padding:14px;border-radius:8px;cursor:pointer;transition:.18s;position:relative;min-width:0}.media-card:hover{background:#282828}.card-cover{aspect-ratio:1;border-radius:6px;overflow:hidden;background:linear-gradient(135deg,#363636,#151515);display:grid;place-items:center;font-size:42px;box-shadow:0 8px 24px rgba(0,0,0,.35);position:relative}.media-card.artist-card .card-cover{border-radius:50%}.card-play{position:absolute;right:10px;bottom:10px;width:48px;height:48px;border-radius:50%;border:0;background:var(--accent);color:#000;font-size:20px;box-shadow:0 8px 18px rgba(0,0,0,.45);opacity:0;transform:translateY(8px);transition:.18s;cursor:pointer}.media-card:hover .card-play{opacity:1;transform:none}.media-card h3{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:12px 0 6px}.media-card p{font-size:13px;color:var(--muted);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.track-table{width:100%;border-collapse:collapse}.track-table thead th{text-align:left;color:var(--muted);font-size:12px;font-weight:500;border-bottom:1px solid var(--line);padding:8px}.track-table tbody tr{border-radius:5px}.track-table tbody tr:hover{background:rgba(255,255,255,.08)}.track-table td{padding:8px;color:#ddd;font-size:14px}.track-num{width:42px;text-align:center;color:var(--muted)!important}.track-title-cell{display:flex;align-items:center;gap:11px;min-width:0}.mini-cover{width:40px;height:40px;flex:0 0 40px;border-radius:3px;background:#333;display:grid;place-items:center;overflow:hidden}.mini-cover img{width:100%;height:100%;object-fit:cover}.track-lines{min-width:0}.track-name{color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-sub{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-album{max-width:250px}.track-album button,.link-btn{border:0;background:transparent;color:inherit;padding:0;cursor:pointer}.track-album button:hover,.link-btn:hover{text-decoration:underline;color:#fff}.row-actions{width:100px;text-align:right}.row-actions button{border:0;background:transparent;color:var(--muted);font-size:18px;cursor:pointer;padding:4px 7px}.row-actions button:hover{color:#fff}.row-actions .liked{color:var(--accent)}.empty-state{text-align:center;padding:70px 20px;color:var(--muted)}.empty-state strong{display:block;color:#fff;font-size:23px;margin-bottom:8px}.action-row{display:flex;align-items:center;gap:14px;margin:20px 0}.round-play{width:56px;height:56px;border-radius:50%;border:0;background:var(--accent);color:#000;font-size:22px;cursor:pointer}.round-play:hover{transform:scale(1.04)}.secondary-btn{border:1px solid #666;background:transparent;border-radius:999px;padding:8px 13px;cursor:pointer}.search-title{font-size:31px;margin-top:8px}.search-prompt{display:grid;place-items:center;height:50vh;color:var(--muted);text-align:center}.search-prompt .big{font-size:58px;color:#fff}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.stat{background:#202020;border-radius:8px;padding:18px}.stat strong{display:block;font-size:28px}.stat span{color:var(--muted);font-size:13px}
.queue-panel{grid-area:queue;background:var(--panel);border-radius:var(--radius);min-width:0;overflow:hidden;opacity:0;pointer-events:none;transition:opacity .15s}.app-shell.queue-open .queue-panel{opacity:1;pointer-events:auto}.queue-head{display:flex;align-items:center;justify-content:space-between;padding:16px}.queue-head h3{margin:0}.queue-head button{font-size:22px}.queue-section{padding:0 10px}.queue-section h4{font-size:13px;color:#ddd}.queue-item{display:flex;gap:10px;align-items:center;padding:8px;border-radius:5px;cursor:pointer}.queue-item:hover,.queue-item.current{background:#252525}.queue-item .mini-cover{width:44px;height:44px;flex-basis:44px}.queue-item .track-lines{flex:1}.queue-item.current .track-name{color:var(--accent)}
.player-bar{grid-area:player;display:grid;grid-template-columns:minmax(240px,30%) minmax(360px,1fr) minmax(210px,30%);align-items:center;padding:0 14px;background:#000}.now-playing{display:flex;align-items:center;gap:11px;min-width:0}.player-cover{width:56px;height:56px;border-radius:4px;overflow:hidden;display:grid;place-items:center;background:#282828;flex:0 0 56px}.player-meta{min-width:0}.player-meta>div,.player-meta button{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-meta>div{font-size:14px}.player-meta button{color:var(--muted);font-size:11px;margin-top:4px}.like-btn{border:0;background:transparent;color:var(--muted);font-size:24px;cursor:pointer}.like-btn.active{color:var(--accent)}.player-center{max-width:720px;width:100%;justify-self:center}.transport{display:flex;justify-content:center;align-items:center;gap:18px}.transport button,.player-extra button{border:0;background:transparent;color:#bbb;cursor:pointer;font-size:17px}.transport button:hover,.player-extra button:hover{color:#fff}.transport button.active{color:var(--accent)}.transport .play-main{width:34px;height:34px;border-radius:50%;background:#fff;color:#000;font-size:15px}.seek-row{display:grid;grid-template-columns:38px 1fr 38px;align-items:center;gap:8px;font-size:10px;color:var(--muted);margin-top:5px}.player-extra{display:flex;justify-content:flex-end;align-items:center;gap:9px}.player-extra input{width:110px}input[type=range]{appearance:none;height:4px;border-radius:99px;background:#555;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;opacity:0}input[type=range]:hover::-webkit-slider-thumb{opacity:1}input[type=range]::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:#fff;opacity:0}input[type=range]:hover::-moz-range-thumb{opacity:1}
.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.72);display:grid;place-items:center;padding:20px}.modal{width:min(520px,95vw);max-height:85vh;overflow:auto;background:#282828;border-radius:10px;box-shadow:var(--shadow);padding:24px}.modal h2{margin-top:0}.modal label{display:block;font-size:13px;font-weight:700;margin:14px 0 5px}.modal input:not([type=checkbox]):not([type=radio]),.modal textarea,.modal select{width:100%;background:#3a3a3a;border:1px solid #555;border-radius:5px;color:#fff;padding:10px}.modal textarea{min-height:90px;resize:vertical}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.modal-actions button{border:0;border-radius:999px;padding:9px 15px;cursor:pointer}.modal-actions .save{background:#fff;color:#000;font-weight:800}.modal-actions .danger{background:#a81d26}.playlist-choice{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;padding:10px;color:#fff;border-radius:6px;cursor:pointer;text-align:left}.playlist-choice:hover{background:#3b3b3b}.drop-zone{position:fixed;z-index:200;inset:15px;border:3px dashed var(--accent);border-radius:18px;background:rgba(0,0,0,.88);display:grid;place-items:center;text-align:center}.drop-zone strong{display:block;font-size:28px}.drop-zone span{display:block;color:var(--muted);margin-top:8px}.toast-host{position:fixed;z-index:300;left:50%;bottom:112px;transform:translateX(-50%);display:grid;gap:8px}.toast{background:#2e77d0;color:#fff;border-radius:7px;padding:10px 16px;box-shadow:var(--shadow);animation:toastin .2s}.toast.error{background:#b32635}@keyframes toastin{from{transform:translateY(8px);opacity:0}}
@media(max-width:1050px){:root{--side-w:210px}.app-shell.queue-open{grid-template-columns:var(--side-w) minmax(0,1fr) 290px}.track-album{display:none}.player-bar{grid-template-columns:250px 1fr 150px}.user-pill>span:nth-child(2){display:none}}
/* Legacy pre-1.3 mobile block removed in 1.5.1; responsive rules are consolidated below. */

/* Administration */
.admin-ico{font-size:19px}.admin-page{max-width:1500px;margin:0 auto;padding-bottom:40px}.admin-title{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:12px 0 22px}.admin-title small{font-size:11px;letter-spacing:1.4px;color:var(--accent);font-weight:800}.admin-title h1{font-size:40px;margin:5px 0 4px}.admin-title p{margin:0;color:var(--muted)}.admin-role-badge,.role-chip,.system-badge,.status-chip{display:inline-flex;align-items:center;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}.admin-role-badge{padding:7px 12px;background:#252525;border:1px solid #393939}.admin-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:22px;overflow:auto}.admin-tabs button{border:0;background:transparent;color:var(--muted);font-weight:700;padding:11px 14px;cursor:pointer;white-space:nowrap;border-bottom:2px solid transparent}.admin-tabs button:hover{color:#fff}.admin-tabs button.active{color:#fff;border-bottom-color:var(--accent)}.admin-body{display:grid;gap:18px}.admin-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.admin-stat{background:#1b1b1b;border:1px solid #282828;border-radius:10px;padding:18px}.admin-stat span{display:block;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.admin-stat strong{display:block;font-size:32px;margin:4px 0 2px}.admin-stat small{color:#7f7f7f}.admin-card{background:#181818;border:1px solid #282828;border-radius:10px;padding:20px;min-width:0}.admin-card-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.admin-card-head h2{margin:0 0 4px;font-size:20px}.admin-card-head p{margin:0;color:var(--muted);font-size:13px;line-height:1.45}.admin-primary{border:0;background:var(--accent);color:#000;border-radius:999px;padding:9px 15px;font-weight:800;cursor:pointer;white-space:nowrap}.admin-primary:hover{transform:scale(1.02)}.admin-table-wrap{overflow:auto}.admin-table{width:100%;border-collapse:collapse;min-width:760px}.admin-table th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.4px;font-weight:700;text-align:left;border-bottom:1px solid #303030;padding:10px 9px}.admin-table td{padding:11px 9px;border-bottom:1px solid #242424;font-size:13px;color:#d8d8d8}.admin-table tbody tr:hover{background:#202020}.admin-table code{font-size:11px;background:#242424;padding:3px 5px;border-radius:4px}.admin-user{display:flex;align-items:center;gap:9px;min-width:170px}.admin-user>span:last-child{display:grid;gap:2px}.admin-user small{color:var(--muted)}.role-chip{padding:5px 8px;background:#292929}.status-chip{padding:4px 8px}.status-chip.active{background:rgba(30,215,96,.14);color:#69e894}.status-chip.disabled{background:rgba(255,95,87,.14);color:#ff8b85}.admin-actions{white-space:nowrap;text-align:right}.admin-actions button,.role-card-top button{border:1px solid #4b4b4b;background:#242424;color:#fff;border-radius:999px;padding:6px 9px;margin-left:5px;font-size:12px;cursor:pointer}.admin-actions button:hover,.role-card-top button:hover{border-color:#fff}.admin-actions .danger-text{color:#ff8f8a;border-color:#653237}.admin-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 18px}.admin-form label{font-size:12px;font-weight:700;color:#ddd}.admin-form input:not([type=checkbox]),.admin-form select{display:block;width:100%;margin-top:6px;background:#2b2b2b;border:1px solid #4b4b4b;color:#fff;border-radius:6px;padding:10px}.setting-toggles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:20px}.setting-toggle{display:flex;gap:10px;padding:13px;background:#202020;border:1px solid #2f2f2f;border-radius:8px;cursor:pointer}.setting-toggle input{margin-top:3px;accent-color:var(--accent)}.setting-toggle span{display:grid;gap:4px}.setting-toggle small{color:var(--muted);font-weight:400;line-height:1.4}.role-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}.role-card{background:#202020;border:1px solid #303030;border-radius:9px;padding:16px}.role-card-top{display:flex;justify-content:space-between;gap:14px}.role-card h3{margin:0 0 6px}.role-card p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}.system-badge{padding:3px 7px;background:#343434;color:#cfcfcf;margin-left:5px;font-size:10px;vertical-align:middle}.role-meta{display:flex;gap:14px;color:#9d9d9d;font-size:11px;margin:14px 0 9px}.permission-chips{display:flex;flex-wrap:wrap;gap:5px}.permission-chips span{background:#2b2b2b;border:1px solid #393939;padding:4px 6px;border-radius:5px;font:10px ui-monospace,SFMono-Regular,Consolas,monospace;color:#cfcfcf}.permission-chips .muted-chip{color:#777}.permission-list{margin-top:17px;border-top:1px solid #454545;padding-top:14px}.permission-list h3{font-size:14px;margin:0 0 8px}.permission-option{display:flex!important;gap:10px;padding:9px;border-radius:6px;margin:0!important;cursor:pointer}.permission-option:hover{background:#333}.permission-option input{margin-top:4px;accent-color:var(--accent)}.permission-option span{display:grid;gap:2px}.permission-option small{font-weight:400;color:#aaa;line-height:1.35}.permission-option code{font-size:10px;color:#77dc9a}.modal-check{display:flex!important;align-items:center;gap:8px;margin-top:16px!important}.modal-check input{accent-color:var(--accent)}
@media(max-width:1050px){.admin-stats{grid-template-columns:repeat(2,1fr)}.setting-toggles{grid-template-columns:1fr}.admin-form-grid{grid-template-columns:1fr}}
@media(max-width:760px){.admin-title{align-items:flex-start;flex-direction:column}.admin-title h1{font-size:32px}.admin-card{padding:14px}.admin-card-head{align-items:flex-start;flex-direction:column}.admin-stats{grid-template-columns:repeat(2,1fr)}.role-grid{grid-template-columns:1fr}.admin-tabs{margin-left:-16px;margin-right:-16px;padding:0 10px}.admin-role-badge{align-self:flex-start}}
/* Updates & backups */
.update-version-card{display:flex;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(135deg,#1d1d1d,#171717);border:1px solid #2d2d2d;border-radius:12px;padding:18px 20px}.update-version-card>div{display:grid;gap:3px}.update-version-card small{font-size:10px;letter-spacing:1.2px;color:var(--muted);font-weight:800}.update-version-card strong{font-size:30px;line-height:1.1}.update-version-card span{color:var(--muted);font-size:12px}.update-upload{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:14px}.update-upload label{font-size:12px;font-weight:700}.update-upload input[type=file]{display:block;width:100%;margin-top:7px;background:#242424;border:1px solid #444;border-radius:7px;padding:10px;color:#ccc}.update-safety{display:flex;gap:12px;align-items:flex-start;margin-top:16px;padding:13px 14px;border:1px solid rgba(30,215,96,.25);background:rgba(30,215,96,.07);border-radius:8px}.update-safety strong{white-space:nowrap;color:#7ce5a0}.update-safety span{color:#bdbdbd;font-size:12px;line-height:1.45}.rollback-info h2{margin:0 0 8px;font-size:18px}.rollback-info p{margin:0 0 8px;line-height:1.55;color:#d0d0d0}.admin-primary:disabled,.admin-actions button:disabled{opacity:.5;cursor:not-allowed;transform:none}
@media(max-width:760px){.update-upload{grid-template-columns:1fr}.update-upload .admin-primary{width:100%}.update-safety{flex-direction:column}.update-version-card strong{font-size:25px}}

/* Application 1.3.0 — responsive UI/UX refinement */
:root{
  --panel:#121212;
  --panel2:#181818;
  --panel3:#242424;
  --surface-hover:#2a2a2a;
  --soft-line:rgba(255,255,255,.09);
  --mobile-nav-h:64px;
  --touch:44px;
}
html{background:#000;overscroll-behavior:none}
body{min-width:280px;overflow:hidden;-webkit-tap-highlight-color:transparent}
button,input,select{min-width:0}
button{touch-action:manipulation}
button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #fff;outline-offset:2px}
button:disabled{cursor:not-allowed;opacity:.55}
::selection{background:rgba(30,215,96,.32);color:#fff}
.mobile-nav,.mobile-page-title{display:none}

/* Authentication */
.auth-shell{padding:max(24px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:radial-gradient(900px 500px at 50% -10%,rgba(30,215,96,.20),transparent 58%),linear-gradient(#121212,#000 70%)}
.auth-card{border:1px solid rgba(255,255,255,.08);box-shadow:0 24px 70px rgba(0,0,0,.58);padding:40px 44px}
.auth-card h1{font-size:clamp(28px,5vw,38px);line-height:1.08}
.auth-form input:not([type=checkbox]){min-height:48px;border-color:#454545;background:#202020;transition:border-color .15s,background .15s}
.auth-form input:hover{border-color:#777}
.auth-form input:focus{background:#252525;border-color:#fff;outline:none;box-shadow:0 0 0 2px #fff}
.auth-form .primary{min-height:48px;margin-top:4px;transition:transform .15s,filter .15s}
.auth-form .primary:hover{transform:scale(1.015);filter:brightness(1.04)}
.auth-tabs button{min-height:40px}

/* Desktop shell */
.app-shell{gap:8px;padding:8px;isolation:isolate}
.sidebar,.main-panel,.queue-panel{border:1px solid rgba(255,255,255,.035)}
.sidebar{padding-top:16px;background:linear-gradient(180deg,#151515,#101010)}
.brand{user-select:none}
.brand-mark{box-shadow:0 4px 18px rgba(255,255,255,.08)}
.nav-item{min-height:42px;transition:background .15s,color .15s,transform .15s}
.nav-item:active{transform:scale(.985)}
.playlist-nav{padding-right:2px}
.playlist-nav button{min-height:34px}
.main-panel{background:linear-gradient(180deg,#252525 0,#181818 180px,#121212 410px);box-shadow:inset 0 1px rgba(255,255,255,.03)}
.topbar{border-radius:var(--radius) var(--radius) 0 0;background:linear-gradient(180deg,rgba(18,18,18,.9),rgba(18,18,18,.62));border-bottom:1px solid rgba(255,255,255,.035)}
.top-search{box-shadow:0 1px 0 rgba(255,255,255,.08),0 8px 28px rgba(0,0,0,.2)}
.top-search:focus-within{box-shadow:0 0 0 2px #fff,0 10px 30px rgba(0,0,0,.28)}
.outline-pill,.user-pill{min-height:38px}
.user-pill{max-width:220px}
#userName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.popover{border:1px solid rgba(255,255,255,.08);padding:5px;z-index:80}
.popover button{min-height:40px}
.content{overscroll-behavior:contain;padding-bottom:48px}
.content>h1:first-child{font-size:clamp(30px,4vw,44px);margin-top:4px;margin-bottom:24px}
.section-head{margin-top:30px}
.section-head h2{font-size:clamp(21px,2.3vw,26px)}
.card-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:18px}
.media-card{border:1px solid transparent;transition:background .18s,transform .18s,border-color .18s,box-shadow .18s}
.media-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.06);box-shadow:0 12px 28px rgba(0,0,0,.18)}
.card-play{display:grid;place-items:center;will-change:transform,opacity}
.track-table{table-layout:fixed}
.track-table thead{position:sticky;top:0;z-index:2;background:#121212}
.track-table th:nth-child(2){width:auto}.track-table th:nth-child(3){width:min(28vw,300px)}.track-table th:nth-child(4){width:76px}.track-table th:last-child{width:100px}
.track-table tbody tr{transition:background .12s}
.track-table td{height:56px}
.track-main{min-width:0}
.row-actions button{min-width:36px;min-height:36px;border-radius:50%}
.row-actions button:hover{background:rgba(255,255,255,.08)}
.hero{border-bottom:1px solid rgba(255,255,255,.03)}
.hero-copy h1{text-wrap:balance}
.round-play{display:grid;place-items:center;box-shadow:0 8px 24px rgba(30,215,96,.18)}

/* Queue */
.queue-panel{background:linear-gradient(180deg,#171717,#101010);box-shadow:-12px 0 30px rgba(0,0,0,.15)}
.queue-head{border-bottom:1px solid var(--soft-line)}
.queue-head h3{margin:0;font-size:17px}
.queue-head button{min-width:38px;min-height:38px}
.queue-section{padding:4px 10px 14px;overflow:hidden}
.queue-section h4{margin:14px 8px 6px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
.queue-item{min-height:58px;transition:background .15s}
.queue-item:hover{background:#242424}
.queue-item.current{background:rgba(30,215,96,.09)}

/* Player */
.player-bar{position:relative;border-top:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,#0c0c0c,#050505);min-width:0}
.now-playing{min-width:0;overflow:hidden}
.player-meta{overflow:hidden}
#playerTitle,#playerArtist{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#playerLike{min-width:40px;min-height:40px}
.transport button,.player-extra button{min-width:40px;min-height:40px;border-radius:50%}
.transport button:hover,.player-extra button:hover{background:rgba(255,255,255,.08)}
.play-main{min-width:44px!important;min-height:44px!important;transition:transform .12s}
.play-main:hover{transform:scale(1.05)}
input[type=range]{accent-color:#fff}
input[type=range]:hover{accent-color:var(--accent)}

/* Modals, upload and feedback */
.modal-backdrop{backdrop-filter:blur(5px);padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}
.modal{border:1px solid rgba(255,255,255,.1);border-radius:14px;scrollbar-width:thin;overscroll-behavior:contain}
.modal h2:first-child{margin-top:0}
.modal input:not([type=checkbox]):not([type=radio]),.modal select,.modal textarea{min-height:44px}
.modal-actions button{min-height:42px;padding-inline:16px}
.toast-host{width:min(520px,calc(100vw - 24px));pointer-events:none}
.toast{text-align:center;overflow-wrap:anywhere}
.drop-zone{inset:18px;border-width:2px;backdrop-filter:blur(6px)}

/* Administration refinements */
.admin-page{width:100%}
.admin-card,.admin-stat,.role-card,.update-version-card{box-shadow:0 7px 22px rgba(0,0,0,.08)}
.admin-tabs{scrollbar-width:none;position:sticky;top:-22px;z-index:3;background:#121212;padding-top:4px}
.admin-tabs::-webkit-scrollbar{display:none}
.admin-table-wrap{border:1px solid #262626;border-radius:8px;scrollbar-width:thin}
.admin-table th{position:sticky;top:0;background:#181818;z-index:1}
.admin-actions button{min-height:34px}
.admin-form input:not([type=checkbox]),.admin-form select{min-height:44px}

/* Coarse pointer / touch devices: don't hide essential actions behind hover. */
@media (hover:none),(pointer:coarse){
  .card-play{opacity:1;transform:none;width:44px;height:44px}
  .media-card:hover{transform:none}
  .row-actions button,.transport button,.player-extra button,.history-buttons button{min-width:44px;min-height:44px}
  .playlist-nav button{min-height:42px}
}

/* Tablet */
@media (max-width:1050px){
  :root{--side-w:220px}
  .card-grid{grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:14px}
  .topbar{padding-inline:16px}
  .content{padding-inline:20px}
  .hero{margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px}
  .player-bar{grid-template-columns:minmax(210px,28%) minmax(300px,1fr) minmax(130px,22%)}
}

/* Mobile application layout */
@media (max-width:820px){
  :root{--player-h:70px;--mobile-nav-h:64px}
  body{position:fixed;inset:0;width:100%;height:100%;height:100dvh}
  .app-shell,.app-shell.queue-open{
    width:100%;height:100%;height:100dvh;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:minmax(0,1fr) var(--player-h) calc(var(--mobile-nav-h) + env(safe-area-inset-bottom));
    grid-template-areas:"main" "player" "mobile-nav";
    gap:0;padding:0;
  }
  .sidebar{display:none!important}
  .main-panel{border:0;border-radius:0;background:linear-gradient(180deg,#242424 0,#161616 155px,#121212 340px)}
  .mobile-page-title{display:flex;align-items:center;gap:9px;min-width:0;flex:1}
  .mobile-page-title strong{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-brand-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#fff;color:#000;font-weight:900;flex:0 0 30px}
  .topbar{height:58px;padding:env(safe-area-inset-top) 12px 0;min-height:calc(58px + env(safe-area-inset-top));background:rgba(18,18,18,.88);border-radius:0;gap:10px}
  .history-buttons{display:none!important}
  .top-actions{gap:6px;flex:0 0 auto}
  .outline-pill{font-size:0!important;width:42px;height:42px;padding:0!important;display:grid;place-items:center;border-color:#565656;background:#181818}
  .outline-pill span{display:none}
  .user-pill{width:42px;height:42px;padding:4px;border-radius:50%;justify-content:center}
  .user-pill>span:not(.avatar-small){display:none!important}
  .avatar-small{width:34px;height:34px;flex:0 0 34px}
  .popover{position:fixed;right:10px;top:calc(58px + env(safe-area-inset-top));width:min(230px,calc(100vw - 20px));border-radius:10px}
  .popover button{min-height:46px;font-size:15px}
  .topbar.search-active .mobile-page-title,.topbar.search-active .top-actions{display:none}
  .topbar.search-active .top-search{display:flex!important;max-width:none;width:100%;height:42px;flex:1}
  .top-search input{font-size:16px}

  .content{padding:calc(74px + env(safe-area-inset-top)) 14px 26px;scrollbar-width:none;overscroll-behavior-y:contain}
  .content::-webkit-scrollbar{display:none}
  .content>h1:first-child{font-size:30px;margin:5px 0 18px}
  .section-head{margin:25px 0 11px;align-items:center}
  .section-head h2{font-size:21px}
  .hero{min-height:unset;margin:calc(-16px - env(safe-area-inset-top)) -14px 16px;padding:calc(82px + env(safe-area-inset-top)) 16px 18px;align-items:flex-end;gap:16px;background:linear-gradient(180deg,rgba(95,95,95,.50),rgba(18,18,18,.3))}
  .hero-art{width:112px;height:112px;flex-basis:112px;font-size:42px;border-radius:5px}
  .hero-copy h1{font-size:clamp(27px,8vw,38px);line-height:1.02;margin:7px 0 9px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .hero-copy p{font-size:13px;line-height:1.35}
  .hero-copy small{font-size:10px}
  .action-row{margin:14px 0 18px}
  .round-play{width:52px;height:52px}

  .card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .media-card{padding:9px;border-radius:8px;background:#181818}
  .card-cover{border-radius:6px;font-size:34px}
  .card-play{right:7px;bottom:7px;width:42px;height:42px;font-size:17px}
  .media-card h3{font-size:14px;margin:9px 0 4px}
  .media-card p{font-size:12px}

  .track-table,.track-table tbody{display:block;width:100%}
  .track-table thead{display:none!important}
  .track-table tbody{display:grid;gap:2px}
  .track-table tbody tr{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:4px;width:100%;min-height:58px;padding:4px 2px;border-radius:7px}
  .track-table td{height:auto;padding:3px!important}
  .track-table td:not(.track-num):not(.track-main):not(.row-actions){display:none!important}
  .track-table .track-num,.track-table .track-main,.track-table .row-actions{display:block!important;width:auto}
  .track-num{align-self:center;text-align:center}
  .track-num .row-play{width:34px;height:42px;display:grid;place-items:center;text-decoration:none}
  .mini-cover{width:44px;height:44px;flex-basis:44px}
  .track-title-cell{gap:10px}
  .track-name{font-size:14px}
  .track-sub{font-size:12px;max-width:100%}
  .row-actions{display:flex!important;justify-content:flex-end;align-items:center;white-space:nowrap}
  .row-actions button{width:42px;height:42px;padding:0;display:inline-grid;place-items:center}
  .empty-state{padding:52px 14px}
  .search-prompt{height:42vh}
  .search-prompt .big{font-size:48px}
  .stats-grid,.admin-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}

  /* Mini-player above the mobile navigation. */
  .player-bar{grid-area:player;grid-template-columns:minmax(0,1fr) auto auto;gap:3px;height:var(--player-h);padding:5px 8px 4px;background:#171717;border-top:1px solid rgba(255,255,255,.08);z-index:45}
  .now-playing{gap:8px}
  .player-cover{width:50px;height:50px;flex-basis:50px;border-radius:5px}
  .player-meta{font-size:13px}
  #playerTitle{font-weight:700}
  #playerArtist{font-size:11px;color:var(--muted);text-align:left}
  #playerLike{width:40px;height:40px;padding:0;flex:0 0 40px}
  .player-center{position:static;width:auto;max-width:none;justify-self:auto;background:transparent;padding:0;display:flex;align-items:center}
  .transport{display:flex!important;gap:1px}
  .transport #shuffleBtn,.transport #prevBtn,.transport #repeatBtn{display:none}
  .transport #playBtn,.transport #nextBtn{display:grid;place-items:center;width:42px;height:42px;min-width:42px!important;min-height:42px!important;background:transparent;color:#fff;font-size:21px}
  .transport #playBtn{background:#fff;color:#000;width:40px;height:40px;min-width:40px!important;min-height:40px!important}
  .transport #nextBtn{font-size:19px}
  .seek-row{position:absolute;left:0;right:0;top:-2px;display:block;height:4px;z-index:2}
  .seek-row span{display:none!important}
  .seek-row input{width:100%;height:4px;margin:0;display:block;appearance:none;background:transparent}
  .seek-row input::-webkit-slider-runnable-track{height:3px;background:#555}
  .seek-row input::-webkit-slider-thumb{appearance:none;width:0;height:0}
  .seek-row input::-moz-range-track{height:3px;background:#555}
  .seek-row input::-moz-range-thumb{width:0;height:0;border:0}
  .player-extra{justify-content:center;gap:0}
  .player-extra .volume-icon,.player-extra #volume{display:none!important}
  #queueBtn{width:42px;height:42px;font-size:20px}

  /* Mobile primary navigation. */
  .mobile-nav{grid-area:mobile-nav;display:grid;grid-template-columns:repeat(4,1fr);align-items:start;background:linear-gradient(180deg,#101010,#050505);border-top:1px solid rgba(255,255,255,.08);padding:5px 4px env(safe-area-inset-bottom);z-index:50}
  .mobile-nav .nav-item{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:54px;padding:3px 2px;border-radius:7px;text-align:center;font-size:10px;font-weight:650;color:#999}
  .mobile-nav .nav-item:hover{background:transparent}
  .mobile-nav .nav-item.active{background:transparent;color:#fff}
  .mobile-nav .nav-item.active .mobile-nav-ico{transform:scale(1.06)}
  .mobile-nav-ico{font-size:23px;line-height:1.1;transition:transform .15s}

  /* Queue becomes a bottom sheet on phones. */
  .queue-panel{display:block!important;position:fixed;z-index:70;left:0;right:0;top:auto;bottom:calc(var(--player-h) + var(--mobile-nav-h) + env(safe-area-inset-bottom));width:100%;height:min(62dvh,560px);border-radius:18px 18px 0 0;border:1px solid rgba(255,255,255,.08);border-bottom:0;transform:translateY(calc(100% + 16px));opacity:1;pointer-events:none;transition:transform .22s ease;box-shadow:0 -20px 60px rgba(0,0,0,.55);overflow:auto}
  .app-shell.queue-open .queue-panel{transform:none;pointer-events:auto}
  .queue-head{position:sticky;top:0;background:#171717;z-index:2;padding:12px 14px}
  .queue-head:before{content:'';position:absolute;top:6px;left:50%;transform:translateX(-50%);width:38px;height:4px;border-radius:999px;background:#555}
  .queue-head h3{padding-top:4px}
  .queue-section{padding-inline:8px}

  /* Mobile modals are bottom sheets and remain keyboard-friendly. */
  .modal-backdrop{align-items:end;padding:0;background:rgba(0,0,0,.62)}
  .modal{width:100%;max-width:none;max-height:min(88dvh,760px);border-radius:18px 18px 0 0;border-left:0;border-right:0;border-bottom:0;padding:22px 16px calc(18px + env(safe-area-inset-bottom));animation:sheet-in .18s ease-out}
  @keyframes sheet-in{from{transform:translateY(24px);opacity:.7}}
  .modal-actions{position:sticky;bottom:calc(-18px - env(safe-area-inset-bottom));background:#282828;padding:12px 0 calc(4px + env(safe-area-inset-bottom));margin-bottom:calc(-18px - env(safe-area-inset-bottom));flex-wrap:wrap}
  .modal-actions button{min-height:46px;flex:1 1 120px}
  .drop-zone{inset:10px;border-radius:14px}
  .drop-zone strong{font-size:22px}
  .toast-host{bottom:calc(var(--player-h) + var(--mobile-nav-h) + env(safe-area-inset-bottom) + 12px);width:calc(100vw - 20px)}
  .toast{padding:11px 13px;border-radius:9px}

  /* Administration */
  .admin-title{padding-top:4px;gap:10px}
  .admin-title h1{font-size:29px}
  .admin-tabs{top:calc(-16px - env(safe-area-inset-top));margin-left:-14px;margin-right:-14px;padding:7px 10px 0;background:#121212}
  .admin-tabs button{min-height:44px;padding:10px 12px}
  .admin-card{padding:14px;border-radius:9px}
  .admin-card-head{gap:11px}
  .admin-card-head .admin-primary{width:100%;min-height:44px}
  .admin-stat{padding:14px}
  .admin-stat strong{font-size:26px}
  .admin-table-wrap{margin-left:-5px;margin-right:-5px;border-radius:7px;-webkit-overflow-scrolling:touch}
  .admin-table{min-width:680px}
  .admin-form-grid{grid-template-columns:1fr}
  .setting-toggles{grid-template-columns:1fr}
  .setting-toggle{min-height:66px}
  .role-grid{grid-template-columns:1fr}
  .role-card{padding:14px}
  .role-card-top{gap:8px}
  .update-version-card{align-items:flex-start;flex-direction:column}
  .update-upload{grid-template-columns:1fr}
  .update-upload .admin-primary{width:100%;min-height:46px}
}

/* Very narrow phones */
@media (max-width:430px){
  .content{padding-left:11px;padding-right:11px}
  .hero{margin-left:-11px;margin-right:-11px;padding-left:13px;padding-right:13px;gap:12px}
  .hero-art{width:96px;height:96px;flex-basis:96px}
  .hero-copy h1{font-size:27px}
  .card-grid{gap:8px}
  .media-card{padding:8px}
  .player-cover{width:46px;height:46px;flex-basis:46px}
  #playerLike{display:none}
  .player-bar{grid-template-columns:minmax(0,1fr) auto auto;padding-inline:6px}
  .transport #nextBtn{display:none}
  .stats-grid,.admin-stats{grid-template-columns:1fr 1fr}
}

/* Landscape phones: keep controls reachable without consuming the whole viewport. */
@media (max-width:820px) and (orientation:landscape) and (max-height:500px){
  :root{--player-h:58px;--mobile-nav-h:54px}
  .topbar{height:50px;min-height:calc(50px + env(safe-area-inset-top))}
  .content{padding-top:calc(62px + env(safe-area-inset-top))}
  .player-cover{width:42px;height:42px;flex-basis:42px}
  .mobile-nav .nav-item{min-height:44px}
  .mobile-nav-ico{font-size:20px}
  .queue-panel{height:min(70dvh,360px)}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
@media (max-width:820px){
  .seek-row input::-webkit-slider-thumb{appearance:none;width:10px;height:10px;margin-top:-3.5px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 2px #171717}
  .seek-row input::-moz-range-thumb{width:10px;height:10px;border:0;border-radius:50%;background:var(--accent);box-shadow:0 0 0 2px #171717}
}
.mobile-menu-only{display:none}
@media(max-width:820px){.mobile-menu-only{display:block}}

/* 1.4 icon/action refinements */
.admin-tabs button{display:inline-flex;align-items:center;justify-content:center;gap:7px}
.admin-tabs button .icon{width:17px;height:17px}
.admin-primary,.admin-actions button,.role-card-top button,.secondary-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px}
.admin-primary .icon,.admin-actions button .icon,.role-card-top button .icon,.secondary-btn .icon{width:17px;height:17px}
.admin-actions{white-space:nowrap}
.admin-actions button{min-height:34px}
@media(max-width:820px){
  .metadata-actions{display:grid;grid-template-columns:1fr}
  .metadata-actions button{width:100%}
  .metadata-progress-head{align-items:flex-start;flex-direction:column;gap:4px}
  .admin-tabs button{flex:0 0 auto}
}

/* 1.4.1 multi-provider metadata resolver */
.metadata-providers{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px;margin:12px 0 4px}
.provider-chip{display:flex;flex-direction:column;gap:2px;padding:10px 11px;border:1px solid var(--line);border-radius:8px;background:#151515;min-width:0}
.provider-chip strong{font-size:13px;line-height:1.25}
.provider-chip small{font-size:11px;line-height:1.35;color:var(--muted)}
@media(max-width:640px){.metadata-providers{grid-template-columns:1fr 1fr}.provider-chip{padding:9px}}
@media(max-width:430px){.metadata-providers{grid-template-columns:1fr}}

/* Application 1.5.0 — Spotify-inspired playback and responsive UX */
:root{--player-h:94px;--side-w:268px;--queue-w:360px;--range-progress:0%}

/* High-fidelity progress/volume controls. Track progress stays Application green. */
.spotify-range{
  --range-fill:var(--accent);
  --range-rest:#4d4d4d;
  appearance:none!important;-webkit-appearance:none!important;
  height:12px!important;border:0!important;border-radius:999px!important;
  background:linear-gradient(90deg,var(--range-fill) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%) center/100% 4px no-repeat!important;
  cursor:pointer;outline:0;
}
.spotify-range::-webkit-slider-runnable-track{height:4px;background:transparent!important;border:0;border-radius:999px}
.spotify-range::-moz-range-track{height:4px;background:transparent!important;border:0;border-radius:999px}
.spotify-range::-moz-range-progress{height:4px;background:transparent!important}
.spotify-range::-webkit-slider-thumb{-webkit-appearance:none!important;width:12px!important;height:12px!important;margin-top:-4px;border:0;border-radius:50%;background:#fff!important;box-shadow:0 1px 5px rgba(0,0,0,.55);opacity:0!important;transition:opacity .12s,transform .12s}
.spotify-range::-moz-range-thumb{width:12px!important;height:12px!important;border:0!important;border-radius:50%;background:#fff!important;box-shadow:0 1px 5px rgba(0,0,0,.55);opacity:0!important;transition:opacity .12s,transform .12s}
.spotify-range:hover::-webkit-slider-thumb,.spotify-range:focus-visible::-webkit-slider-thumb{opacity:1!important}
.spotify-range:hover::-moz-range-thumb,.spotify-range:focus-visible::-moz-range-thumb{opacity:1!important}
.spotify-range:active::-webkit-slider-thumb{opacity:1!important;transform:scale(1.08)}
.spotify-range:active::-moz-range-thumb{opacity:1!important;transform:scale(1.08)}
.seek-range{--range-fill:var(--accent);touch-action:none;user-select:none}
.volume-range{--range-fill:#fff;--range-rest:#4d4d4d;width:104px!important}
.volume-range:hover,.volume-range:focus-visible{--range-fill:var(--accent)}
.volume-button{border:0;background:transparent;color:#b3b3b3;cursor:pointer;width:38px;height:38px;border-radius:50%;padding:0;display:grid;place-items:center}
.volume-button:hover{color:#fff;background:rgba(255,255,255,.07)}
.volume-button.muted{color:var(--muted)}
.volume-button .icon{width:19px;height:19px}

/* Desktop player geometry and state feedback. */
.player-bar{grid-template-columns:minmax(220px,30%) minmax(340px,1fr) minmax(180px,30%);padding:0 16px;column-gap:18px}
.player-center{max-width:760px}
.transport{gap:14px}
.transport button{width:36px;height:36px;min-width:36px;min-height:36px}
.transport .play-main{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important}
.seek-row{grid-template-columns:42px minmax(80px,1fr) 42px;gap:8px;margin-top:3px;font-variant-numeric:tabular-nums}
.seek-row span:first-child{text-align:right}.seek-row span:last-child{text-align:left}
.player-extra{gap:4px}
#queueBtn.active,.app-shell.queue-open #queueBtn{color:var(--accent)}
#miniNowPlaying{outline-offset:3px}

/* Queue: desktop side panel with its own scroll container and reorder affordance. */
.queue-panel{display:flex;flex-direction:column;overflow:hidden;background:#121212}
.queue-head{flex:0 0 auto;min-height:68px;padding:13px 14px 12px 16px;gap:12px}
.queue-head-copy{display:grid;gap:1px;min-width:0}.queue-head-copy small{font-size:9px;font-weight:800;letter-spacing:1.25px;color:#8f8f8f}.queue-head-copy h3{font-size:18px!important}
.queue-head-actions{display:flex;align-items:center;gap:5px}.queue-head-actions>button{flex:0 0 auto}
.queue-clear{width:auto!important;height:34px!important;padding:0 10px!important;border-radius:999px!important;background:transparent!important;color:#d6d6d6!important;font-size:11px!important;font-weight:700;border:1px solid #4b4b4b!important}
.queue-clear:hover{border-color:#fff!important;color:#fff!important}
.queue-scroll{flex:1;min-height:0;overflow:auto;padding:0 6px 14px;scrollbar-width:thin;scrollbar-color:#555 transparent;overscroll-behavior:contain}
.queue-section{padding:2px 4px 8px}
.queue-section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:15px 8px 6px}.queue-section-title h4{margin:0!important}.queue-section-title span{font-size:10px;color:#777}
.queue-item{position:relative;min-height:60px;padding:8px 7px;gap:10px;border-radius:6px;user-select:none}
.queue-item .mini-cover{width:46px;height:46px;flex-basis:46px}
.queue-item.current{background:transparent}.queue-item.current:hover{background:#202020}.queue-item.current .track-name{color:var(--accent)}
.queue-item.dragging{opacity:.42;background:#202020}.queue-item.drag-over{box-shadow:inset 0 2px 0 var(--accent)}
.queue-drag{width:38px;height:38px;flex:0 0 38px;border:0;border-radius:50%;background:transparent;color:#8e8e8e;display:grid;place-items:center;cursor:grab;touch-action:none}
.queue-drag:hover{color:#fff;background:#292929}.queue-drag:active{cursor:grabbing}.queue-drag .icon{width:20px;height:20px}
.queue-empty{display:grid;gap:5px;text-align:center;padding:54px 20px;color:var(--muted)}.queue-empty strong{color:#fff;font-size:16px}.queue-empty span{font-size:12px;line-height:1.45}.queue-end{padding:8px 9px}
.queue-mobile-player{display:none}

/* Mobile Now Playing view is intentionally separate from the desktop bar. */
.mobile-now-playing{display:none}

@media (max-width:1120px) and (min-width:821px){
  :root{--side-w:224px;--queue-w:320px}
  .player-bar{grid-template-columns:minmax(190px,28%) minmax(310px,1fr) minmax(145px,24%);column-gap:8px;padding-inline:10px}
  .volume-range{width:78px!important}
  .now-playing{gap:8px}.player-cover{width:50px;height:50px;flex-basis:50px}
}

@media (max-width:820px){
  :root{--player-h:70px;--mobile-nav-h:62px}
  .app-shell,.app-shell.queue-open{grid-template-rows:minmax(0,1fr) var(--player-h) calc(var(--mobile-nav-h) + env(safe-area-inset-bottom))}

  /* Floating mini player, like a mobile music app rather than a compressed desktop footer. */
  .player-bar{height:calc(var(--player-h) - 6px);align-self:center;margin:3px 7px;grid-template-columns:minmax(0,1fr) auto auto;gap:2px;padding:5px 7px;background:#242424;border:0;border-radius:8px;box-shadow:0 7px 24px rgba(0,0,0,.35);overflow:visible;z-index:45}
  .now-playing{cursor:pointer;gap:9px;border-radius:6px;min-width:0}
  .player-cover{width:48px;height:48px;flex-basis:48px;border-radius:6px}
  .player-meta>div{font-size:13px;font-weight:700}.player-meta button{font-size:11px;margin-top:2px}
  #playerLike{width:38px;height:38px;min-width:38px;min-height:38px}
  .player-center{display:flex;width:auto;max-width:none;justify-self:auto}
  .transport{gap:0}.transport #shuffleBtn,.transport #prevBtn,.transport #repeatBtn{display:none!important}
  .transport #playBtn{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;background:transparent;color:#fff}
  .transport #nextBtn{width:38px;height:40px;min-width:38px;min-height:40px}
  .player-extra{gap:0}.player-extra #volume,.player-extra #volumeBtn{display:none!important}#queueBtn{width:38px;height:40px;min-width:38px;min-height:40px}
  .seek-row{position:absolute;left:8px;right:8px;top:auto!important;bottom:-1px;display:block;height:4px;margin:0;z-index:2;pointer-events:none}
  .seek-row span{display:none!important}.seek-row input{width:100%;height:3px!important;margin:0;display:block;pointer-events:auto;background-size:100% 2px!important}
  .seek-row input::-webkit-slider-thumb,.seek-row input::-moz-range-thumb{opacity:0!important;width:0!important;height:0!important}

  /* Full-screen mobile Now Playing. */
  .mobile-now-playing{display:flex;position:fixed;inset:0;z-index:84;flex-direction:column;background:radial-gradient(120% 72% at 50% 0,rgba(30,215,96,.20),transparent 58%),linear-gradient(180deg,#303832 0,#171a18 42%,#090909 100%);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);transform:translateY(102%);opacity:.94;pointer-events:none;transition:transform .28s cubic-bezier(.2,.75,.25,1),opacity .22s;overflow:auto;overscroll-behavior:contain}
  .app-shell.nowplaying-open .mobile-now-playing{transform:none;opacity:1;pointer-events:auto}
  .mnp-head{height:60px;flex:0 0 60px;display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;padding:0 10px;position:sticky;top:0;z-index:2}
  .mnp-head>button{width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:#fff;display:grid;place-items:center}.mnp-head>button:hover{background:rgba(255,255,255,.08)}.mnp-head>button .icon{width:24px;height:24px}
  .mnp-head>div{text-align:center;min-width:0;display:grid;gap:2px}.mnp-head small{font-size:9px;font-weight:800;letter-spacing:1.15px}.mnp-head strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#ddd}
  .mnp-body{width:min(100%,560px);min-height:calc(100dvh - 60px - env(safe-area-inset-top) - env(safe-area-inset-bottom));margin:0 auto;padding:14px 24px 24px;display:flex;flex-direction:column;justify-content:space-evenly;gap:22px}
  .mnp-cover{width:min(100%,440px,52dvh);aspect-ratio:1;margin:0 auto;border-radius:8px;overflow:hidden;display:grid;place-items:center;background:#282828;box-shadow:0 24px 58px rgba(0,0,0,.42)}
  .mnp-cover img{width:100%;height:100%;object-fit:cover}.mnp-cover>.icon{width:30%;height:30%;color:#999}
  .mnp-meta-row{display:grid;grid-template-columns:minmax(0,1fr) 48px;gap:12px;align-items:center}.mnp-meta{min-width:0;display:grid;gap:5px}.mnp-meta strong{font-size:21px;line-height:1.16;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mnp-meta button{font-size:14px;text-align:left;color:#b3b3b3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mnp-meta-row .like-btn{width:46px;height:46px;display:grid;place-items:center}.mnp-meta-row .like-btn .icon{width:24px;height:24px}
  .mnp-seek{display:grid;gap:4px}.mnp-seek .spotify-range{width:100%;height:16px!important}.mnp-seek .spotify-range::-webkit-slider-thumb{opacity:1!important}.mnp-seek .spotify-range::-moz-range-thumb{opacity:1!important}.mnp-seek>div{display:flex;justify-content:space-between;font-size:10px;color:#b3b3b3;font-variant-numeric:tabular-nums}
  .mnp-transport{display:grid;grid-template-columns:48px 56px 1fr 56px 48px;align-items:center;justify-items:center}.mnp-transport button{width:46px;height:46px;border:0;border-radius:50%;background:transparent;color:#fff;display:grid;place-items:center}.mnp-transport button .icon{width:24px;height:24px}.mnp-transport button.active{color:var(--accent)}.mnp-play-main{width:64px!important;height:64px!important;background:#fff!important;color:#000!important}.mnp-play-main .icon{width:27px!important;height:27px!important}
  .mnp-actions{display:flex;justify-content:flex-end}.mnp-actions button{min-height:44px;border:0;background:transparent;color:#d5d5d5;display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700}.mnp-actions button .icon{width:20px;height:20px}

  /* Queue is a full-screen view on mobile; no desktop drawer geometry leaks through. */
  .queue-panel{display:flex!important;position:fixed;inset:0!important;z-index:96;width:100%!important;height:100dvh!important;max-height:none!important;border:0!important;border-radius:0!important;background:#121212;box-shadow:none;transform:translateY(102%)!important;opacity:1!important;pointer-events:none!important;transition:transform .26s cubic-bezier(.2,.75,.25,1)!important;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
  .app-shell.queue-open .queue-panel{transform:none!important;pointer-events:auto!important}
  .queue-head{position:relative!important;top:auto!important;min-height:66px;padding:8px 10px 8px 16px;background:#121212;border-bottom:1px solid #242424}.queue-head:before{display:none!important}.queue-head-copy small{font-size:8px}.queue-head-copy h3{font-size:21px!important}.queue-head-actions{gap:4px}.queue-clear{height:36px!important}.queue-head #closeQueue{width:44px;height:44px;background:transparent}
  .queue-scroll{flex:1;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;padding:4px 6px 94px;scrollbar-width:none}.queue-scroll::-webkit-scrollbar{display:none}
  .queue-section{padding:3px 4px 10px}.queue-section h4{margin:17px 9px 8px;font-size:12px;text-transform:none;letter-spacing:0;color:#fff}.queue-section-title{margin:17px 9px 8px}.queue-section-title h4{margin:0!important}.queue-section-title span{font-size:10px}
  .queue-item{min-height:68px;padding:8px 8px;gap:11px;border-radius:6px}.queue-item .mini-cover{width:50px;height:50px;flex-basis:50px}.queue-item .track-name{font-size:14px}.queue-item .track-sub{font-size:12px;margin-top:3px}.queue-drag{width:44px;height:44px;flex-basis:44px;color:#a6a6a6}.queue-drag .icon{width:24px;height:24px}
  .queue-mobile-player{position:absolute;left:0;right:0;bottom:0;height:calc(76px + env(safe-area-inset-bottom));padding:8px 22px calc(8px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;gap:26px;background:linear-gradient(180deg,rgba(18,18,18,.76),#121212 35%);border-top:1px solid #262626;backdrop-filter:blur(14px)}
  .queue-mobile-player button{width:48px;height:48px;border:0;border-radius:50%;background:transparent;color:#fff;display:grid;place-items:center}.queue-mobile-player button .icon{width:23px;height:23px}.queue-mobile-player .queue-play-main{width:52px;height:52px;background:#fff;color:#000}.queue-mobile-player .queue-play-main .icon{width:23px;height:23px}

  /* Mobile nav remains visible only when not covered by Now Playing/Queue. */
  .mobile-nav{padding-top:4px;background:linear-gradient(180deg,#0d0d0d,#050505)}
  .mobile-nav .nav-item{font-size:10px;letter-spacing:.1px}
  .mobile-nav .nav-item.active{color:#fff}.mobile-nav .nav-item.active .icon{stroke-width:2.35}
  .content{padding-bottom:30px}
}

@media (max-width:560px){
  .topbar{padding-left:10px;padding-right:10px}.content{padding-left:11px;padding-right:11px}
  .hero{margin-left:-11px;margin-right:-11px;padding-left:14px;padding-right:14px;gap:13px}.hero-art{width:104px;height:104px;flex-basis:104px}.hero-copy h1{font-size:clamp(25px,8.5vw,34px)}
  .card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.media-card{padding:9px}.media-card h3{margin-top:9px}
  .mnp-body{padding-left:18px;padding-right:18px;gap:18px}.mnp-cover{width:min(100%,410px,49dvh)}.mnp-meta strong{font-size:19px}.mnp-transport{grid-template-columns:42px 52px 1fr 52px 42px}.mnp-play-main{width:60px!important;height:60px!important}
}

@media (max-width:390px){
  .player-bar{margin-inline:5px;padding-inline:5px}.player-cover{width:44px;height:44px;flex-basis:44px}.player-meta>div{font-size:12px}#playerLike{display:none!important}#queueBtn{width:36px;min-width:36px}.transport #nextBtn{display:none!important}
  .mnp-body{padding:8px 15px 18px;gap:14px}.mnp-cover{width:min(100%,360px,47dvh)}.mnp-meta strong{font-size:18px}.mnp-transport{grid-template-columns:38px 46px 1fr 46px 38px}.mnp-transport button{width:40px;height:40px}.mnp-play-main{width:56px!important;height:56px!important}
  .queue-clear{padding-inline:8px!important;font-size:10px!important}.queue-head{padding-left:12px}.queue-item{padding-left:5px;padding-right:5px}
}

@media (max-width:820px) and (orientation:landscape) and (max-height:500px){
  :root{--player-h:58px;--mobile-nav-h:52px}
  .player-bar{height:54px;margin-block:2px}.player-cover{width:42px;height:42px;flex-basis:42px}
  .mobile-now-playing{overflow:auto}.mnp-head{height:50px;flex-basis:50px}.mnp-body{min-height:auto;width:min(94vw,720px);display:grid;grid-template-columns:minmax(180px,34vh) minmax(280px,1fr);grid-template-rows:auto auto auto;column-gap:26px;row-gap:12px;justify-content:center;padding:6px 24px 18px}.mnp-cover{grid-row:1/4;width:min(34vh,240px);align-self:center}.mnp-meta-row{align-self:end}.mnp-seek{align-self:center}.mnp-transport{align-self:start}.mnp-actions{display:none}
  .queue-mobile-player{height:64px;padding-top:5px;padding-bottom:calc(5px + env(safe-area-inset-bottom))}.queue-scroll{padding-bottom:74px}.queue-item{min-height:60px}.queue-item .mini-cover{width:44px;height:44px;flex-basis:44px}
}

/* Spotify-like track-row playback affordance. */
.row-play{width:34px;height:34px;display:grid!important;place-items:center!important;margin:auto;border-radius:50%;position:relative}
.row-play-glyph{display:none;line-height:0}.row-play-glyph .icon{width:17px;height:17px}.row-index{display:block}
.track-row:hover .row-play .row-index,.track-row.current-track .row-play .row-index,.row-play:focus-visible .row-index{display:none}
.track-row:hover .row-play .row-play-glyph,.track-row.current-track .row-play .row-play-glyph,.row-play:focus-visible .row-play-glyph{display:block}
.track-row.current-track .track-name,.track-row.current-track .row-play{color:var(--accent)!important}
.track-row.current-track{background:rgba(255,255,255,.035)}
@media(hover:none),(pointer:coarse){.row-play .row-index{display:none}.row-play .row-play-glyph{display:block}}

/* Application 1.6.1 — consolidated Spotify-style visual system / UI QA */
:root{--control:40px;--control-sm:36px;--sp-black:#000;--sp-base:#121212;--sp-raised:#181818;--sp-elevated:#242424;--sp-hover:#2a2a2a;--sp-subtle:#a7a7a7;--sp-border:rgba(255,255,255,.10);--sp-green:#1ed760;--sp-green-hover:#3be477;--sp-shadow:0 16px 48px rgba(0,0,0,.50)}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
button{transition:color .14s ease,background-color .14s ease,border-color .14s ease,opacity .14s ease,transform .12s ease}button:disabled{opacity:.48;cursor:not-allowed;transform:none!important}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #fff;outline-offset:2px}button[aria-pressed="true"]{color:var(--sp-green)}
.history-buttons button,.library-head button,.transport button,.player-extra button,.like-btn,.row-actions button,.queue-head button,.queue-drag,.mnp-head>button,.mnp-transport button,.mnp-actions button,.devices-head button{border:0;background:transparent;color:var(--muted);border-radius:50%;display:grid;place-items:center;padding:0}
.history-buttons button:hover,.library-head button:hover,.transport button:hover,.player-extra button:hover,.like-btn:hover,.row-actions button:hover,.queue-head button:hover,.queue-drag:hover,.mnp-head>button:hover,.mnp-transport button:hover,.mnp-actions button:hover,.devices-head button:hover{color:#fff;background:rgba(255,255,255,.08)}
.history-buttons button:active,.library-head button:active,.transport button:active,.player-extra button:active,.like-btn:active,.row-actions button:active,.queue-head button:active,.queue-drag:active,.mnp-head>button:active,.mnp-transport button:active,.mnp-actions button:active,.devices-head button:active{transform:scale(.94)}
.primary,.admin-primary,.modal-actions .save,.round-play,.card-play,.play-main,.mnp-play-main,.queue-play-main{transition:transform .14s ease,filter .14s ease,background-color .14s ease}.primary:hover,.admin-primary:hover,.modal-actions .save:hover,.round-play:hover,.card-play:hover{transform:scale(1.035);filter:brightness(1.04)}.outline-pill::after{content:none!important;display:none!important}
/* Shell and navigation */
.app-shell{background:#000}.sidebar{padding:12px 8px 8px;background:var(--sp-base);border-color:transparent}.brand{height:54px;padding:0 12px 10px;font-size:20px;letter-spacing:-.3px;user-select:none}.brand-mark{width:32px;height:32px;background:#fff;color:#000;box-shadow:none}.main-nav{gap:1px}.nav-item{min-height:44px;padding:10px 12px;border-radius:6px;background:transparent;color:#b3b3b3}.nav-item:hover{background:#1f1f1f;color:#fff}.nav-item.active{background:transparent;color:#fff}.nav-item.active .icon{color:#fff}.library-head{padding:18px 12px 8px;text-transform:none;letter-spacing:0;font-size:15px;color:#b3b3b3}.library-head button{width:36px;height:36px;min-width:36px}.playlist-nav{padding-right:2px}.playlist-nav button{min-height:36px;padding:9px 12px;border-radius:5px;font-size:14px;color:#b3b3b3}.playlist-nav button:hover,.playlist-nav button.active{background:#242424;color:#fff}.sidebar-bottom{border-top-color:#252525}.nav-item.active[data-view="liked"] .liked-icon{color:var(--sp-green);background:transparent}
/* Toolbar */
.main-panel{background:linear-gradient(180deg,#252525 0,#181818 185px,#121212 430px);border-color:transparent}.topbar{height:var(--topbar-height);padding:0 20px;background:rgba(18,18,18,.82);backdrop-filter:blur(18px) saturate(125%)}.history-buttons{gap:8px}.history-buttons button{width:40px;height:40px;background:rgba(0,0,0,.58);color:#ddd}.history-buttons button:hover{background:#282828}.top-search{height:46px;max-width:490px;background:#242424;color:#fff;border:1px solid transparent;box-shadow:none}.top-search:hover{background:#2a2a2a;border-color:#444}.top-search:focus-within{background:#2a2a2a;border-color:#fff}.top-search input{background:transparent;color:#fff;font-size:14px}.top-search input::placeholder{color:#b3b3b3}.top-actions{gap:8px}.outline-pill{min-height:40px;border:1px solid #727272;background:transparent;padding:7px 15px;font-weight:750}.outline-pill:hover{border-color:#fff;background:#101010}.outline-pill .icon{width:18px;height:18px}.user-pill{min-height:40px;background:#090909;padding-right:11px;border:1px solid transparent}.user-pill:hover,.user-pill[aria-expanded="true"]{background:#282828}.popover{width:220px;top:46px;padding:4px;background:#282828;border:1px solid rgba(255,255,255,.07);border-radius:4px;box-shadow:var(--sp-shadow)}.popover button{min-height:42px;padding:10px 11px;border-radius:2px;color:#fff}.popover button:hover{background:#3a3a3a}.popover button:last-child{margin-top:4px;border-top:1px solid #3b3b3b;border-radius:0;padding-top:12px}
/* Cards / hero */
.card-grid{gap:18px}.media-card{background:#181818;border:0;border-radius:8px;padding:12px;box-shadow:none;transform:none!important}.media-card:hover,.media-card:focus-within{background:#282828}.card-cover{border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.28)}.artist-card .card-cover{border-radius:50%}.card-play{width:48px;height:48px;right:8px;bottom:8px;background:var(--sp-green);color:#000;box-shadow:0 8px 18px rgba(0,0,0,.42);opacity:0;transform:translateY(7px)}.card-play:hover{background:var(--sp-green-hover)!important;transform:scale(1.045)!important}.media-card:hover .card-play,.media-card:focus-within .card-play{opacity:1;transform:none}.card-play .icon,.round-play .icon{width:20px;height:20px}.media-card h3{font-size:15px;line-height:1.3;margin:11px 0 4px}.media-card p{font-size:13px;line-height:1.35;color:#a7a7a7}.hero{min-height:280px;padding-bottom:24px;border-bottom:0;background:linear-gradient(180deg,rgba(91,91,91,.58),rgba(18,18,18,.08))}.hero-art{border-radius:4px;box-shadow:0 14px 38px rgba(0,0,0,.42)}.hero-copy h1{letter-spacing:-2px}.action-row{min-height:72px;margin:0 0 8px;padding:10px 0;gap:18px}.round-play{width:56px;height:56px;background:var(--sp-green);box-shadow:none}.round-play:hover{background:var(--sp-green-hover)}.secondary-btn{min-height:38px;border-color:#727272;color:#fff;font-weight:700}.secondary-btn:hover{border-color:#fff;background:#1f1f1f}
/* Track rows */
.track-table{border-collapse:separate;border-spacing:0}.track-table thead th{height:36px;padding:0 8px;border-bottom:1px solid #2a2a2a;color:#b3b3b3}.track-time-head{text-align:center!important}.track-time-head .icon{width:16px;height:16px;vertical-align:middle}.track-table tbody tr{border-radius:4px}.track-table tbody tr:hover{background:#2a2a2a}.track-table td{height:56px;padding:8px}.track-row.current-track{background:transparent}.track-row.current-track:hover{background:#2a2a2a}.track-row.current-track .track-name,.track-row.current-track .row-play{color:var(--sp-green)!important}.track-sub,.track-album,.track-table .muted{color:#b3b3b3}.row-actions{width:96px;white-space:nowrap}.row-actions button{width:36px;height:36px;min-width:36px;min-height:36px}.row-actions .liked{color:var(--sp-green)}.row-actions .liked .icon,#playerLike.active .icon,#mnpLike.active .icon{fill:currentColor}.row-play{width:34px;height:34px;border-radius:50%}@media (hover:hover) and (pointer:fine){.row-actions button[data-action="more"]{opacity:0}.track-row:hover .row-actions button[data-action="more"],.track-row:focus-within .row-actions button[data-action="more"]{opacity:1}}
/* Player */
.player-bar{height:var(--player-h);grid-template-columns:minmax(220px,30%) minmax(360px,1fr) minmax(190px,30%);background:#000;border-top:0;padding:0 16px;column-gap:16px}.now-playing{gap:10px}.player-cover{width:56px;height:56px;flex-basis:56px;border-radius:4px}.player-meta>div{font-size:14px;font-weight:500}.player-meta button{font-size:12px}#playerLike{width:40px;height:40px;min-width:40px;min-height:40px}.transport{gap:8px}.transport button{width:36px;height:36px;min-width:36px;min-height:36px;color:#b3b3b3}.transport .play-main{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;background:#fff;color:#000}.transport .play-main:hover{background:#fff;color:#000;transform:scale(1.065)}.transport .play-main .icon{width:17px;height:17px}#shuffleBtn.active,#repeatBtn.active,#queueBtn.active,#devicesBtn.active,.app-shell.queue-open #queueBtn{color:var(--sp-green)}.seek-row{margin-top:8px;grid-template-columns:42px minmax(80px,1fr) 42px;gap:8px}.seek-row span{font-size:11px;color:#a7a7a7;font-variant-numeric:tabular-nums}.player-extra{gap:4px}.player-extra button{width:36px;height:36px;min-width:36px;min-height:36px}.player-extra #devicesBtn.active::after{content:'';position:absolute;right:4px;bottom:4px;width:5px;height:5px;border-radius:50%;background:var(--sp-green);box-shadow:0 0 0 2px #000}.spotify-range{--range-rest:#4d4d4d;--range-progress:0%;appearance:none;height:12px!important;background:linear-gradient(90deg,var(--range-fill,var(--sp-green)) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%) center/100% 4px no-repeat!important;cursor:pointer}.spotify-range::-webkit-slider-runnable-track{height:4px;border-radius:999px;background:linear-gradient(to right,var(--sp-green) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%)}.spotify-range::-moz-range-track{height:4px;border-radius:999px;background:linear-gradient(to right,var(--sp-green) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%)}.spotify-range::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;margin-top:-4px;opacity:0;box-shadow:0 1px 3px rgba(0,0,0,.45)}.spotify-range::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:#fff;opacity:0;box-shadow:0 1px 3px rgba(0,0,0,.45)}.spotify-range:hover::-webkit-slider-thumb,.spotify-range:focus-visible::-webkit-slider-thumb{opacity:1}.spotify-range:hover::-moz-range-thumb,.spotify-range:focus-visible::-moz-range-thumb{opacity:1}.spotify-range:hover::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--sp-green-hover) 0 var(--range-progress),#5e5e5e var(--range-progress) 100%)}.spotify-range:hover::-moz-range-track{background:linear-gradient(to right,var(--sp-green-hover) 0 var(--range-progress),#5e5e5e var(--range-progress) 100%)}.spotify-range:focus-visible{outline:2px solid #fff;outline-offset:2px;border-radius:999px}.volume-range{width:96px!important}
/* Queue */
.queue-panel{border:0;background:var(--sp-base);border-radius:8px;box-shadow:none}.queue-head{min-height:64px;border-bottom:0;padding:12px 10px 8px 16px}.queue-head-copy small{display:none}.queue-head-copy h3{font-size:16px!important;font-weight:800}.queue-head-actions{display:flex;align-items:center;gap:3px}.queue-head #closeQueue{width:38px;height:38px;background:transparent}.queue-clear{height:36px;border:0!important;border-radius:999px!important;padding:0 10px!important;background:transparent!important;color:#fff!important;font-size:12px!important;font-weight:700!important}.queue-clear:hover{background:#2a2a2a!important}.queue-section-title,.queue-section h4{margin-top:12px}.queue-section-title h4,.queue-section h4{text-transform:none;letter-spacing:0;color:#fff;font-size:14px}.queue-item{min-height:64px;border-radius:5px;padding:8px;cursor:pointer}.queue-item:hover{background:#242424}.queue-item.current{background:transparent}.queue-item.current .track-name{color:var(--sp-green)}.queue-item .mini-cover{width:48px;height:48px;flex-basis:48px;border-radius:4px}.queue-drag{width:36px;height:36px;flex-basis:36px}.queue-item.dragging{opacity:.55;background:#2a2a2a}.queue-item.drag-over{box-shadow:inset 0 2px 0 var(--sp-green)}
/* Devices */
.devices-backdrop{display:none;position:fixed;inset:0;z-index:91;border:0;background:rgba(0,0,0,.48);padding:0}.devices-panel{position:fixed;z-index:92;right:14px;bottom:calc(var(--player-h) + 12px);width:min(390px,calc(100vw - 28px));max-height:min(620px,calc(100dvh - var(--player-h) - 28px));display:flex;flex-direction:column;background:#282828;border:1px solid rgba(255,255,255,.07);border-radius:10px;box-shadow:0 20px 64px rgba(0,0,0,.66);overflow:hidden}.devices-panel.hidden{display:none!important}.devices-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 16px 11px}.devices-head>div{min-width:0}.devices-head small{display:block;color:#a7a7a7;font-size:9px;font-weight:800;letter-spacing:1.25px;margin-bottom:3px}.devices-head h3{font-size:18px;margin:0;letter-spacing:-.3px}.devices-head button{width:38px;height:38px;min-width:38px}.devices-body{overflow:auto;padding:0 8px 12px;overscroll-behavior:contain}.devices-intro{display:grid;grid-template-columns:46px minmax(0,1fr);align-items:center;gap:10px;padding:10px 9px 12px;color:#fff}.device-icon{width:42px;height:42px;border-radius:50%;background:#414141;color:#fff;display:grid;place-items:center;flex:0 0 42px}.device-icon .icon{width:21px;height:21px}.device-copy{min-width:0;display:grid;gap:3px}.device-copy strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.device-copy small{font-size:11px;line-height:1.35;color:#b3b3b3;white-space:normal}.devices-section-label{padding:10px 10px 6px;color:#fff;font-size:12px;font-weight:800}.devices-list{display:grid;gap:1px}.device-loading{padding:18px 10px;color:#a7a7a7;font-size:12px;line-height:1.45}.device-row{width:100%;display:grid;grid-template-columns:46px minmax(0,1fr) 32px;align-items:center;gap:10px;padding:9px;border:0;border-radius:7px;background:transparent;color:#fff;text-align:left;cursor:pointer}.device-row:hover{background:#353535}.device-row.selected{background:rgba(30,215,96,.07)}.device-row.selected .device-icon{color:var(--sp-green)}.device-row.selected .device-copy strong{color:var(--sp-green)}.device-row .device-tail{display:grid;place-items:center;color:var(--sp-green);width:28px;height:28px}.device-row .device-tail .icon{width:19px;height:19px}.device-state-line{display:flex;align-items:center;gap:6px}.device-online-dot{width:6px;height:6px;border-radius:50%;background:var(--sp-green);display:inline-block;flex:0 0 6px}.device-this{color:#fff;font-weight:700}.device-output-note{color:var(--sp-green)!important}
/* Modals/admin */
.modal-backdrop{background:rgba(0,0,0,.78)}.modal{background:#282828;border:1px solid rgba(255,255,255,.06);border-radius:8px;box-shadow:0 24px 64px rgba(0,0,0,.62)}.modal input:not([type=checkbox]):not([type=radio]),.modal textarea,.modal select{border-color:#727272;background:#333;border-radius:4px}.modal input:not([type=checkbox]):not([type=radio]):hover,.modal textarea:hover,.modal select:hover{border-color:#999}.modal input:not([type=checkbox]):not([type=radio]):focus,.modal textarea:focus,.modal select:focus{border-color:#fff;outline:1px solid #fff}.modal-actions .save,.admin-primary{background:#fff;color:#000}.modal-actions .save:hover,.admin-primary:hover{background:#f0f0f0}.admin-tabs button.active{border-bottom-color:var(--sp-green)}.admin-card,.role-card,.admin-stat{border-color:#2a2a2a;background:#181818}.admin-actions button,.role-card-top button{min-height:34px;display:inline-flex;align-items:center;gap:5px}.admin-actions button .icon,.role-card-top button .icon{width:15px;height:15px}
@media (min-width:821px) and (max-width:1120px){:root{--side-w:214px;--queue-w:0px}.app-shell.queue-open{grid-template-columns:var(--side-w) minmax(0,1fr) 0}.app-shell.queue-open .queue-panel{position:fixed;z-index:70;top:8px;right:8px;bottom:calc(var(--player-h) + 8px);width:min(360px,44vw);opacity:1;pointer-events:auto;box-shadow:-16px 0 42px rgba(0,0,0,.42)}.player-bar{grid-template-columns:minmax(180px,30%) minmax(300px,1fr) auto}.volume-range{display:none}.devices-panel{right:10px}}
@media (min-width:821px) and (max-width:940px){:root{--side-w:196px}.brand{font-size:18px}.player-bar{grid-template-columns:minmax(170px,30%) minmax(280px,1fr) auto;padding-inline:10px;column-gap:8px}#playerLike{display:none}}
@media (max-width:820px){.topbar{background:rgba(18,18,18,.94)}.outline-pill{border:0;background:transparent;width:42px;height:42px;padding:0}.outline-pill:hover{background:#282828;transform:none}.content{padding-bottom:24px}.card-play{opacity:1;transform:none;width:44px;height:44px}.media-card{border-radius:7px}.track-table tbody tr{grid-template-columns:minmax(0,1fr) auto;min-height:64px;padding:4px 0}.track-table .track-num{display:none!important}.track-table .track-main{padding-left:2px!important}.track-title-cell{gap:12px}.mini-cover{width:48px;height:48px;flex-basis:48px;border-radius:4px}.row-actions{width:auto!important}.row-actions button{width:42px;height:42px;min-width:42px;min-height:42px}.row-actions button[data-action="like"]{display:none}.player-bar{grid-template-columns:minmax(0,1fr) auto;gap:2px;padding:4px 6px;margin:3px 6px;background:#252525;border-radius:7px;overflow:visible}.player-extra{display:none!important}.now-playing{gap:8px;min-width:0}.player-cover{width:48px;height:48px;flex-basis:48px}#playerLike{width:38px;height:38px;min-width:38px;min-height:38px}.player-center{width:auto;justify-self:end}.transport{gap:0}.transport #shuffleBtn,.transport #prevBtn,.transport #repeatBtn,.transport #nextBtn{display:none!important}.transport #playBtn{display:grid!important;width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;background:transparent!important;color:#fff!important}.transport #playBtn:hover{background:rgba(255,255,255,.08)!important;transform:none}.seek-row{position:absolute;left:7px;right:7px;top:-1px;display:block;height:3px;margin:0;pointer-events:none}.seek-row span{display:none!important}.seek-row input{width:100%;height:3px!important;pointer-events:none}.seek-row input::-webkit-slider-runnable-track{height:2px}.seek-row input::-moz-range-track{height:2px}.seek-row input::-webkit-slider-thumb{display:none!important;opacity:0!important}.seek-row input::-moz-range-thumb{opacity:0!important}.mobile-nav{background:linear-gradient(180deg,#101010,#050505);border-top:0;padding-top:4px}.mobile-nav .nav-item{background:transparent!important;border-radius:0;min-height:56px;justify-content:center;font-size:10px;letter-spacing:.1px}.mobile-nav .nav-item.active{color:#fff}.mobile-nav .nav-item.active .mobile-nav-ico{transform:none}.mobile-now-playing{background:linear-gradient(180deg,#3a413a 0,#222722 36%,#0d0d0d 100%)}.mnp-head{background:linear-gradient(180deg,rgba(0,0,0,.12),transparent)}.mnp-cover{border-radius:7px;box-shadow:0 20px 50px rgba(0,0,0,.48)}.mnp-meta strong{font-weight:800}.mnp-play-main{background:#fff!important;color:#000!important}.mnp-actions{justify-content:space-between;gap:10px}.mnp-actions button{min-height:44px;border-radius:999px;padding:0 12px;display:inline-flex;gap:7px}.mnp-actions button.active{color:var(--sp-green)}.queue-panel{background:#121212!important}.queue-head{min-height:62px;border-bottom:0!important}.queue-scroll{padding-left:8px;padding-right:8px}.queue-item{min-height:66px}.queue-mobile-player{height:calc(80px + env(safe-area-inset-bottom));display:grid;grid-template-columns:44px 48px 58px 48px 44px;gap:10px;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}.queue-mobile-player button{width:44px;height:44px}.queue-mobile-player button.active{color:var(--sp-green)}.queue-mobile-player .queue-play-main{width:56px;height:56px}.devices-backdrop:not(.hidden){display:block}.devices-panel{z-index:108;left:0;right:0;bottom:0;width:100%;max-height:min(76dvh,680px);border-radius:18px 18px 0 0;border-left:0;border-right:0;border-bottom:0;padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -22px 70px rgba(0,0,0,.70)}.devices-head{padding:22px 17px 12px;position:relative}.devices-head:before{content:'';position:absolute;top:7px;left:50%;transform:translateX(-50%);width:38px;height:4px;border-radius:999px;background:#686868}.devices-body{padding:0 9px 12px}.devices-intro,.device-row{min-height:68px;padding:10px}.device-row{grid-template-columns:50px minmax(0,1fr) 36px}.device-icon{width:46px;height:46px}}
@media (max-width:560px){.card-grid{gap:12px}.media-card{padding:8px;background:transparent}.media-card:hover,.media-card:focus-within{background:#1b1b1b}.player-meta>div{font-size:12.5px}.mnp-actions button span{display:none}.mnp-actions button{width:46px;padding:0;justify-content:center;border-radius:50%}.devices-panel{max-height:80dvh}}
@media (max-width:390px){.mnp-body{gap:12px}.mnp-cover{max-height:45dvh}.queue-mobile-player{grid-template-columns:40px 44px 54px 44px 40px;gap:6px}#playerLike{display:none!important}.player-cover{width:44px;height:44px;flex-basis:44px}.player-meta>div{font-size:12px}}
@media (max-width:820px) and (orientation:landscape) and (max-height:500px){.devices-panel{max-height:92dvh}}
@media (hover:none),(pointer:coarse){.card-play{opacity:1;transform:none}.row-actions button[data-action="more"]{opacity:1}.spotify-range::-webkit-slider-thumb{opacity:1}.spotify-range::-moz-range-thumb{opacity:1}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}



/* Application 1.6.5 — range regression fix + visible desktop volume */
.spotify-range{
  background:linear-gradient(90deg,var(--range-fill,var(--sp-green)) 0 var(--range-progress),var(--range-rest,#4d4d4d) var(--range-progress) 100%) center/100% 4px no-repeat!important;
}
.spotify-range::-webkit-slider-runnable-track{background:transparent!important}
.spotify-range::-moz-range-track{background:transparent!important}
.seek-range{--range-fill:var(--sp-green);--range-rest:#4d4d4d}
.volume-range{--range-fill:#fff;--range-rest:#4d4d4d;display:block!important;width:96px!important;min-width:64px}
.volume-range:hover,.volume-range:focus-visible{--range-fill:var(--sp-green)}
@media (min-width:821px) and (max-width:1120px){
  .volume-range{display:block!important;width:72px!important}
  .player-extra{min-width:150px;gap:2px}
}
@media (max-width:820px){
  .player-extra{display:none!important}
  .seek-row .spotify-range{background:linear-gradient(90deg,var(--sp-green) 0 var(--range-progress),#4d4d4d var(--range-progress) 100%) center/100% 2px no-repeat!important}
}
.spotify-source-link{display:inline-flex;align-items:center;gap:4px;color:#b3b3b3;font-size:10px;font-weight:700;text-decoration:none;white-space:nowrap}
.spotify-source-link:hover{color:#fff;text-decoration:underline}.track-subline,.player-meta-sub{display:flex;align-items:center;gap:6px;min-width:0}.track-subline .track-sub,.player-meta-sub .link-btn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.metadata-attribution{font-size:12px;color:#a7a7a7}.metadata-attribution a{color:#fff}


/* Application 1.6.6 — Spotify-like context menu & uploads */
.spotify-test-row{display:flex;align-items:center;gap:12px;margin:14px 0 2px;flex-wrap:wrap}.admin-secondary{display:inline-flex;align-items:center;gap:7px;border:1px solid #727272;background:#242424;color:#fff;border-radius:999px;padding:9px 14px;font-weight:750;cursor:pointer}.admin-secondary:hover{border-color:#fff;background:#2c2c2c}.admin-secondary:disabled{opacity:.5;cursor:default}.admin-secondary .icon{width:16px;height:16px}
.modal-two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.track-manage-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px;padding-top:14px;border-top:1px solid #444}.track-manage-actions button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:42px;border:1px solid #555;background:#333;color:#fff;border-radius:999px;font-weight:700;cursor:pointer}.track-manage-actions button:hover{border-color:#fff}.track-manage-actions .danger-text{color:#ff9a95;border-color:#694044}.track-manage-actions .icon{width:16px;height:16px}
.track-context-menu{position:fixed;z-index:520;width:min(282px,calc(100vw - 16px));padding:4px;background:#282828;border:1px solid rgba(255,255,255,.08);border-radius:4px;box-shadow:0 16px 42px rgba(0,0,0,.65);color:#fff}.track-context-menu button,.track-context-menu a{width:100%;height:40px;display:flex;align-items:center;gap:12px;padding:0 12px;border:0;background:transparent;color:#fff;text-decoration:none;text-align:left;border-radius:2px;font:500 13px/1 system-ui,-apple-system,Segoe UI,sans-serif;cursor:pointer}.track-context-menu button:hover,.track-context-menu button:focus-visible,.track-context-menu a:hover,.track-context-menu a:focus-visible{background:#3e3e3e;outline:0}.track-context-menu .icon{width:18px;height:18px;color:#b3b3b3;flex:0 0 18px}.track-context-menu .context-danger{color:#ff8f88}.track-context-menu .context-danger .icon{color:#ff8f88}.context-separator{height:1px;background:#3e3e3e;margin:4px}
.upload-manager{position:fixed;z-index:460;right:16px;bottom:calc(var(--player-h,90px) + 14px);width:min(430px,calc(100vw - 32px));max-height:min(58vh,560px);display:flex;flex-direction:column;background:#282828;border:1px solid rgba(255,255,255,.08);border-radius:9px;box-shadow:0 18px 52px rgba(0,0,0,.62);overflow:hidden}.upload-manager header{height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:#202020;border-bottom:1px solid #393939}.upload-manager header>div:first-child{display:grid;gap:2px}.upload-manager header strong{font-size:14px}.upload-manager header span{font-size:11px;color:#b3b3b3}.upload-manager header>div:last-child{display:flex;gap:2px}.upload-manager header button,.upload-item>button{width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:#b3b3b3;cursor:pointer}.upload-manager header button:hover,.upload-item>button:hover{color:#fff;background:#3a3a3a}.upload-manager header .icon,.upload-item>button .icon{width:17px;height:17px}.upload-items{overflow:auto;max-height:calc(min(58vh,560px) - 54px)}.upload-manager.collapsed .upload-items{display:none}.upload-item{display:grid;grid-template-columns:38px minmax(0,1fr) 36px;align-items:center;gap:10px;padding:11px 10px 11px 12px;border-bottom:1px solid #363636}.upload-item:last-child{border-bottom:0}.upload-file-icon{width:38px;height:38px;border-radius:4px;background:#3b3b3b;display:grid;place-items:center;color:#b3b3b3}.upload-file-icon .icon{width:19px;height:19px}.upload-item-main{min-width:0;display:grid;gap:7px}.upload-item-top{display:flex;justify-content:space-between;gap:10px;align-items:center;min-width:0}.upload-item-top strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.upload-item-top span{font-size:10px;color:#b3b3b3;white-space:nowrap}.upload-progress{height:3px;background:#505050;border-radius:999px;overflow:hidden}.upload-progress i{display:block;height:100%;background:var(--sp-green);border-radius:999px;transition:width .12s linear}.upload-item.done .upload-progress i{width:100%!important}.upload-item.error .upload-progress i{background:#e05b62}.upload-item.cancelled{opacity:.62}
@media(max-width:820px){.upload-manager{left:8px;right:8px;bottom:calc(var(--player-h) + var(--mobile-nav-h) + env(safe-area-inset-bottom) + 8px);width:auto;max-height:42dvh;border-radius:10px}.modal-two-col,.track-manage-actions{grid-template-columns:1fr}.track-context-menu{border-radius:10px;padding:6px}.track-context-menu button,.track-context-menu a{height:46px;font-size:14px}}
@media(max-width:820px){
  .track-context-menu{left:8px!important;right:8px!important;top:auto!important;bottom:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom) + 10px);width:auto;max-height:min(70dvh,560px);overflow:auto;border-radius:14px;padding:7px 6px;animation:context-sheet-in .16s ease-out}
  @keyframes context-sheet-in{from{transform:translateY(18px);opacity:.3}to{transform:none;opacity:1}}
}

/* 1.6.10 touch interaction: tapped action controls must not retain a visual focus state after release. */
@media (hover:none) and (pointer:coarse){
  button:focus:not(:focus-visible),a[href]:focus:not(:focus-visible),input[type=range]:focus:not(:focus-visible),input[type=checkbox]:focus:not(:focus-visible),input[type=radio]:focus:not(:focus-visible),[role=button]:focus:not(:focus-visible),[role=menuitem]:focus:not(:focus-visible),[role=radio]:focus:not(:focus-visible){outline:none!important;box-shadow:none!important}
}

/* Application 1.7.0 — Spotify parity layer */
:root{--library-expanded:292px;--library-compact:82px;--right-panel-w:360px;--devices-panel-w:360px}
.app-shell{grid-template-columns:var(--side-w) minmax(0,1fr) 0}
.app-shell.now-panel-open{grid-template-columns:var(--side-w) minmax(0,1fr) var(--right-panel-w)}
.app-shell.queue-open{grid-template-columns:var(--side-w) minmax(0,1fr) var(--queue-w)}
.app-shell.library-collapsed{--side-w:var(--library-compact)}
.app-shell.library-expanded{--side-w:var(--library-expanded)}
.sidebar{padding:8px;gap:7px}.brand{padding:7px 8px 10px}.main-nav{background:#121212;border-radius:8px;padding:4px}
.library-sidebar-section{display:flex;flex-direction:column;min-height:0;flex:1;background:#121212;border-radius:8px;position:relative;overflow:visible}
.spotify-library-head{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:8px 8px 4px}.library-title-btn,.library-head-actions button,.library-sort-row button{border:0;background:transparent;color:var(--muted);cursor:pointer}.library-title-btn{display:flex;align-items:center;gap:10px;min-height:42px;padding:8px;font-size:16px}.library-title-btn:hover,.library-head-actions button:hover,.library-sort-row button:hover{color:#fff}.library-title-btn strong{white-space:nowrap}.library-head-actions{display:flex;align-items:center;gap:2px}.library-head-actions button{width:38px;height:38px;border-radius:50%;display:grid;place-items:center}.library-head-actions button:hover{background:#232323}
.library-create-menu{position:absolute;z-index:120;right:8px;top:52px;width:230px;background:#282828;border:1px solid #3a3a3a;border-radius:7px;box-shadow:var(--shadow);padding:5px}.library-create-menu button{width:100%;display:flex;align-items:center;gap:10px;border:0;background:transparent;color:#fff;text-align:left;padding:11px;border-radius:4px;cursor:pointer}.library-create-menu button:hover{background:#3e3e3e}
.library-search-wrap{margin:4px 8px 7px;height:34px;background:#242424;border-radius:5px;display:flex;align-items:center;gap:7px;padding:0 9px;color:#b3b3b3}.library-search-wrap input{min-width:0;flex:1;border:0;background:transparent;color:#fff;outline:0;font-size:13px}.library-filter-chips{display:flex;gap:6px;padding:4px 8px 7px;overflow:auto;scrollbar-width:none}.library-filter-chips::-webkit-scrollbar{display:none}.library-filter-chips button,.library-page-chips button{border:0;border-radius:999px;background:#232323;color:#fff;padding:7px 11px;white-space:nowrap;cursor:pointer;font-size:13px}.library-filter-chips button:hover,.library-page-chips button:hover{background:#333}.library-filter-chips button.active,.library-page-chips button.active{background:#fff;color:#000}
.library-sort-row{display:flex;align-items:center;justify-content:space-between;padding:2px 8px 4px}.library-sort-row button{display:flex;align-items:center;gap:5px;border-radius:4px;padding:7px 6px;font-size:12px}.library-sort-row .library-view-btn{width:34px;height:34px;display:grid;place-items:center}.spotify-library-list{padding:2px 4px 8px;overflow:auto;scrollbar-width:thin}.library-item-row{display:grid;grid-template-columns:minmax(0,1fr) 32px;align-items:center;border-radius:6px;min-width:0}.library-item-row:hover{background:#1f1f1f}.library-item-main{border:0;background:transparent;color:#fff;display:grid;grid-template-columns:48px minmax(0,1fr);gap:10px;align-items:center;text-align:left;padding:6px;min-width:0;cursor:pointer}.library-item-cover{width:48px;height:48px;border-radius:5px;background:linear-gradient(135deg,#393939,#171717);display:grid;place-items:center;overflow:hidden;color:#d7d7d7;font-size:18px}.library-item-cover img{width:100%;height:100%;object-fit:cover}.library-item-cover.artist{border-radius:50%}.library-item-cover.liked{background:linear-gradient(135deg,#450af5,#c4efd9);color:#fff}.library-item-copy{min-width:0;display:grid;gap:2px}.library-item-copy strong,.library-item-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.library-item-copy strong{font-size:14px;font-weight:600}.library-item-copy small{color:var(--muted);font-size:12px}.library-item-row.active .library-item-copy strong{color:var(--accent)}.library-pin-toggle,.folder-more{border:0;background:transparent;color:var(--muted);width:32px;height:32px;border-radius:50%;display:grid;place-items:center;cursor:pointer}.library-pin-toggle:hover,.folder-more:hover{background:#333;color:#fff}.library-pin-toggle.pinned{color:var(--accent)}
.library-folder{margin:3px 0}.library-folder-head{display:grid;grid-template-columns:minmax(0,1fr) 32px;align-items:center}.library-folder-toggle{border:0;background:transparent;color:#fff;display:flex;align-items:center;gap:10px;text-align:left;padding:8px;border-radius:5px;cursor:pointer;min-width:0}.library-folder-toggle:hover{background:#1f1f1f}.library-folder-toggle .icon{color:#b3b3b3}.library-folder-toggle strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.library-folder-items{padding-left:12px}.library-folder.collapsed .library-folder-items{display:none}.library-folder.collapsed .library-folder-toggle .folder-chevron{transform:rotate(-90deg)}.folder-chevron{transition:transform .15s}
.library-empty-sidebar{padding:18px 10px;color:var(--muted);font-size:13px;line-height:1.45}
.app-shell.library-collapsed .brand>span:last-child,.app-shell.library-collapsed .main-nav .nav-item span,.app-shell.library-collapsed .library-title-btn strong,.app-shell.library-collapsed .library-head-actions,.app-shell.library-collapsed .library-search-wrap,.app-shell.library-collapsed .library-filter-chips,.app-shell.library-collapsed .library-sort-row,.app-shell.library-collapsed .library-item-copy,.app-shell.library-collapsed .library-pin-toggle,.app-shell.library-collapsed .library-folder-toggle strong,.app-shell.library-collapsed .folder-more,.app-shell.library-collapsed .sidebar-bottom .nav-item span{display:none!important}.app-shell.library-collapsed .brand{justify-content:center}.app-shell.library-collapsed .main-nav .nav-item,.app-shell.library-collapsed .sidebar-bottom .nav-item{justify-content:center;padding-inline:0}.app-shell.library-collapsed .library-title-btn{width:100%;justify-content:center}.app-shell.library-collapsed .library-item-row{display:block}.app-shell.library-collapsed .library-item-main{display:grid;grid-template-columns:1fr;padding:5px}.app-shell.library-collapsed .library-item-cover{width:50px;height:50px;margin:auto}.app-shell.library-collapsed .library-folder-toggle{justify-content:center}.app-shell.library-collapsed .library-folder-items{padding:0}.app-shell.library-collapsed .library-folder-toggle .folder-chevron{display:none}

/* Main Your Library */
.library-page-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:-6px 0 22px}.library-page-search{min-width:min(320px,100%);height:40px;background:#242424;border-radius:5px;display:flex;align-items:center;gap:8px;padding:0 11px}.library-page-search input{flex:1;border:0;background:transparent;color:#fff;outline:0}.library-page-chips{display:flex;gap:7px;overflow:auto;scrollbar-width:none}.library-page-chips::-webkit-scrollbar{display:none}.library-page-sort{margin-left:auto;border:0;background:transparent;color:var(--muted);display:flex;align-items:center;gap:6px;cursor:pointer}.library-list-view{display:grid;gap:4px}.library-page-row{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:12px;align-items:center;padding:7px;border-radius:7px;cursor:pointer}.library-page-row:hover{background:#222}.library-page-row .cover{width:52px;height:52px;border-radius:5px;overflow:hidden;background:#2a2a2a;display:grid;place-items:center}.library-page-row .cover img{width:100%;height:100%;object-fit:cover}.library-page-row .copy{min-width:0}.library-page-row strong,.library-page-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.library-page-row small{color:var(--muted);margin-top:3px}.library-page-row .pin{color:var(--accent)}
.quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:4px 0 28px}.quick-tile{height:64px;border:0;border-radius:5px;background:#2b2b2b;color:#fff;display:flex;align-items:center;gap:12px;overflow:hidden;padding:0;cursor:pointer;text-align:left;font-weight:700}.quick-tile:hover{background:#3a3a3a}.quick-tile .quick-cover{width:64px;height:64px;flex:0 0 64px;background:#333;display:grid;place-items:center;overflow:hidden}.quick-tile .quick-cover img{width:100%;height:100%;object-fit:cover}.quick-tile.liked .quick-cover{background:linear-gradient(135deg,#450af5,#c4efd9)}

/* Playlist controls */
.playlist-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0 18px}.playlist-toolbar .round-play{margin-right:6px}.spotify-action-btn{border:0;background:transparent;color:var(--muted);display:inline-flex;align-items:center;gap:7px;padding:9px 10px;border-radius:6px;font-weight:700;cursor:pointer}.spotify-action-btn:hover{color:#fff;background:#242424}.spotify-action-btn.active{color:var(--accent)}.playlist-sort-select{background:#242424;color:#fff;border:0;border-radius:5px;padding:9px 10px}.playlist-bulk-bar{display:flex;align-items:center;gap:10px;background:#242424;border-radius:7px;padding:10px 12px;margin:0 0 12px}.playlist-bulk-bar button{border:0;background:#fff;color:#000;border-radius:999px;padding:7px 13px;font-weight:700;cursor:pointer}.playlist-bulk-bar button.secondary{background:transparent;color:#fff}.track-select-box{display:inline-grid;place-items:center;margin-right:4px}.track-select-box input{margin:0;accent-color:var(--accent)}.track-table.select-mode .row-play{display:none!important}.track-table.select-mode .track-num{display:flex;justify-content:center;align-items:center}
.add-tracks-results{max-height:54vh;overflow:auto;display:grid;gap:4px;margin-top:10px}.add-track-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding:7px;border-radius:6px}.add-track-row:hover{background:#242424}.add-track-row .mini-cover{width:44px;height:44px}.add-track-row .copy{min-width:0}.add-track-row strong,.add-track-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.add-track-row small{color:var(--muted)}.add-track-row button{border:1px solid #777;background:transparent;color:#fff;border-radius:999px;padding:6px 12px;cursor:pointer}.add-track-row button.added{border-color:var(--accent);color:var(--accent)}

/* Right Now Playing view */
.now-playing-panel{grid-area:queue;display:none;min-width:0;background:#121212;border:1px solid rgba(255,255,255,.04);border-radius:var(--radius);overflow:hidden}.app-shell.now-panel-open .now-playing-panel{display:flex;flex-direction:column}.now-panel-head{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--soft-line)}.now-panel-head h3{font-size:16px;margin:0}.now-panel-head button{width:34px;height:34px;border:0;background:transparent;color:#fff;border-radius:50%;cursor:pointer}.now-panel-head button:hover{background:#292929}.now-panel-scroll{overflow:auto;padding:12px;display:grid;gap:14px}.now-panel-cover{width:100%;aspect-ratio:1;border-radius:8px;overflow:hidden;background:#242424;display:grid;place-items:center}.now-panel-cover img{width:100%;height:100%;object-fit:cover}.now-panel-track-row{display:flex;align-items:center;gap:10px}.now-panel-track-copy{min-width:0;display:grid;gap:4px;flex:1}.now-panel-track-copy strong{font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.now-panel-track-copy button{color:var(--muted);text-align:left}.now-panel-track-copy button:hover{color:#fff;text-decoration:underline}.now-panel-card{background:#1c1c1c;border-radius:9px;overflow:hidden}.now-panel-card-head{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 8px}.now-panel-card-head h4{margin:0;font-size:14px}.now-panel-card-head button{border:0;background:transparent;color:#fff;font-weight:700;cursor:pointer}.now-panel-artist-card{padding:0 12px 14px}.now-panel-artist-hero{display:flex;align-items:center;gap:10px}.now-panel-artist-avatar{width:64px;height:64px;border-radius:50%;background:#333;display:grid;place-items:center;font-size:20px;font-weight:800}.now-panel-artist-copy strong,.now-panel-artist-copy small{display:block}.now-panel-artist-copy small{color:var(--muted);margin-top:3px}.now-panel-next{padding:0 8px 10px}.now-panel-next-row{display:grid;grid-template-columns:44px minmax(0,1fr);gap:9px;align-items:center;padding:6px;border-radius:5px}.now-panel-next-row:hover{background:#252525}.now-panel-next-row .mini-cover{width:44px;height:44px}.now-panel-next-row strong,.now-panel-next-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.now-panel-next-row small{color:var(--muted)}.now-panel-actions-card{padding:5px}.now-panel-actions-card button{width:100%;border:0;background:transparent;color:#fff;text-align:left;padding:10px;border-radius:5px;display:flex;align-items:center;gap:10px;cursor:pointer}.now-panel-actions-card button:hover{background:#2b2b2b}

/* Queue controls */
.queue-tools{display:flex;gap:4px;padding:8px 10px;border-bottom:1px solid var(--soft-line);overflow:auto;scrollbar-width:none}.queue-tools::-webkit-scrollbar{display:none}.queue-tools button{border:0;background:#242424;color:#fff;border-radius:999px;padding:7px 10px;display:flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap;font-size:12px}.queue-tools button:hover{background:#333}.queue-bulk-bar{display:flex;align-items:center;gap:7px;padding:8px 10px;background:#222;border-bottom:1px solid var(--soft-line)}.queue-bulk-bar span{margin-right:auto;font-size:12px;color:var(--muted)}.queue-bulk-bar button{border:0;background:transparent;color:#fff;cursor:pointer;font-weight:700}.queue-select-box{width:30px;display:grid;place-items:center}.queue-select-box input{margin:0;accent-color:var(--accent)}.queue-item.selecting{grid-template-columns:30px 44px minmax(0,1fr) 36px}
.sleep-options{display:grid;gap:3px;margin-top:12px}.sleep-options button{border:0;background:transparent;color:#fff;text-align:left;padding:12px;border-radius:6px;cursor:pointer;display:flex;justify-content:space-between;align-items:center}.sleep-options button:hover{background:#2a2a2a}.sleep-options button.active{color:var(--accent)}

/* Player/side-panel state */
#nowPanelBtn.active{color:var(--accent)}
.player-extra{gap:2px}.player-extra #volume{max-width:110px}

@media(max-width:1250px){:root{--library-expanded:255px;--right-panel-w:320px}.app-shell.now-panel-open{grid-template-columns:var(--side-w) minmax(0,1fr) var(--right-panel-w)}.now-panel-cover{max-height:280px}}
@media(max-width:1050px){.app-shell.now-panel-open{grid-template-columns:var(--side-w) minmax(0,1fr) 0}.now-playing-panel{display:none!important}.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.library-filter-chips button{padding-inline:9px}}
@media(max-width:820px){
  .app-shell,.app-shell.queue-open,.app-shell.now-panel-open,.app-shell.library-collapsed,.app-shell.library-expanded{grid-template-columns:minmax(0,1fr)!important}
  .now-playing-panel{display:none!important}.queue-tools{padding:8px 12px}.queue-tools button{min-height:38px}.queue-tools #reshuffleQueueBtn span,.queue-tools #queueSelectBtn span,.queue-tools #queueSleepBtn span{display:inline}
  .library-page-toolbar{align-items:stretch;gap:8px}.library-page-search{width:100%;min-width:0}.library-page-chips{order:2;width:100%}.library-page-sort{margin-left:0}
  .quick-grid{grid-template-columns:1fr 1fr;gap:7px}.quick-tile{height:56px;font-size:13px}.quick-tile .quick-cover{width:56px;height:56px;flex-basis:56px}
  .playlist-toolbar{gap:4px}.spotify-action-btn span{display:none}.spotify-action-btn{width:44px;height:44px;justify-content:center;padding:0}.playlist-sort-select{max-width:125px}
  .mnp-actions{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:430px){.quick-grid{grid-template-columns:1fr}.library-page-chips button{padding:7px 10px}.queue-tools button span{display:none!important}.queue-tools button{width:40px;height:40px;justify-content:center;padding:0}}

/* Application 1.7.0 parity polish */
.spotify-library-list.compact .library-item-row{min-height:42px}.spotify-library-list.compact .library-item-main{padding:4px 6px;gap:8px}.spotify-library-list.compact .library-item-cover{width:34px;height:34px;flex-basis:34px;border-radius:4px}.spotify-library-list.compact .library-item-copy small{display:none}.spotify-library-list.compact .library-pin-toggle{width:30px;height:30px}
.create-sheet-actions{display:grid;gap:8px;margin-top:12px}.create-sheet-actions button{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:12px;border:0;border-radius:8px;background:#242424;color:#fff;text-align:left;padding:12px;cursor:pointer}.create-sheet-actions button:hover{background:#303030}.create-sheet-actions button>.icon{width:24px;height:24px;justify-self:center}.create-sheet-actions span{display:grid;gap:3px}.create-sheet-actions strong{font-size:15px}.create-sheet-actions small{color:var(--muted);font-size:12px;line-height:1.35}
.library-card{position:relative}.library-card-pin{position:absolute;right:11px;top:11px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(0,0,0,.68);color:#b3b3b3;display:grid;place-items:center;opacity:0;transform:translateY(2px);transition:.15s ease;cursor:pointer}.library-card:hover .library-card-pin,.library-card-pin:focus-visible,.library-card-pin.pinned{opacity:1;transform:none}.library-card-pin:hover,.library-card-pin.pinned{color:var(--accent)}.library-card-pin .icon{width:17px;height:17px}.liked-card-glyph{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(135deg,#450af5,#8e8ee5 55%,#c4efd9);color:#fff}.liked-card-glyph .icon{width:42%;height:42%}.round-cover{border-radius:50%!important}
.shortcut-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px 18px;align-items:center;margin:16px 0 4px}.shortcut-grid span{color:#e8e8e8}.shortcut-grid kbd{min-width:72px;text-align:center;background:#282828;border:1px solid #454545;border-bottom-color:#666;border-radius:5px;color:#fff;padding:5px 8px;font:600 11px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;box-shadow:0 1px 0 #111}
.library-page-chips button{border:0;border-radius:999px;background:#242424;color:#fff;padding:8px 13px;cursor:pointer;white-space:nowrap}.library-page-chips button:hover{background:#333}.library-page-chips button.active{background:#fff;color:#000}.secondary-btn{border:0;border-radius:999px;background:#242424;color:#fff;padding:9px 14px;font-weight:700;display:inline-flex;align-items:center;gap:7px;cursor:pointer}.secondary-btn:hover{background:#333}
@media(max-width:820px){.library-card-pin{opacity:1}.create-sheet-actions button{min-height:68px}.shortcut-grid{grid-template-columns:minmax(0,1fr) auto;gap:8px 10px}.shortcut-grid kbd{min-width:62px}}

/* Keep desktop controls usable at laptop/tablet widths. */
@media (min-width:821px){.player-extra .volume-range{display:block!important;width:clamp(64px,8vw,96px)!important}}
@media (min-width:821px) and (max-width:1050px){
  .app-shell.now-panel-open{grid-template-columns:var(--side-w) minmax(0,1fr) 0!important}
  .app-shell.now-panel-open .now-playing-panel{display:flex!important;position:fixed;z-index:72;top:8px;right:8px;bottom:calc(var(--player-h) + 8px);width:min(360px,44vw);opacity:1;pointer-events:auto;box-shadow:-16px 0 42px rgba(0,0,0,.46)}
  .app-shell.now-panel-open .now-panel-cover{max-height:none}
}
.playlist-filter-search{height:38px;min-width:190px;max-width:260px;background:#242424;border-radius:5px;display:flex;align-items:center;gap:7px;padding:0 9px;color:var(--muted)}.playlist-filter-search .icon{width:16px;height:16px}.playlist-filter-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#fff;font-size:12px}.track-row.hidden{display:none}
@media(max-width:820px){.playlist-filter-search{order:3;width:100%;max-width:none;min-width:0}.playlist-toolbar .playlist-filter-search .icon{display:block}.playlist-filter-search input{display:block}}
.sidebar,.now-playing-panel{position:relative}.panel-resize-handle{position:absolute;top:0;bottom:0;width:8px;z-index:12;cursor:col-resize;touch-action:none;outline:0}.panel-resize-handle::after{content:'';position:absolute;top:10px;bottom:10px;width:1px;background:transparent;transition:background .15s}.panel-resize-handle:hover::after,.panel-resize-handle:focus-visible::after,.panel-resize-handle.dragging::after{background:#777}.library-resize-handle{right:-5px}.library-resize-handle::after{left:3px}.now-resize-handle{left:-5px}.now-resize-handle::after{right:3px}.app-shell.library-collapsed .library-resize-handle{display:none}
@media(max-width:820px){.panel-resize-handle{display:none!important}}
@media(min-width:821px) and (max-width:1050px){.app-shell.now-panel-open .now-playing-panel{width:min(var(--right-panel-w),44vw)!important}}
.entity-toolbar{display:flex;align-items:center;gap:12px;margin:14px 0 20px}.entity-toolbar .round-play{margin:0}.follow-btn{height:34px;border:1px solid #777;border-radius:999px;background:transparent;color:#fff;padding:0 15px;font-weight:700;cursor:pointer}.follow-btn:hover{border-color:#fff;transform:scale(1.02)}.follow-btn.active{border-color:#fff;background:#fff;color:#000}


/* Application 1.7.1 — UI/UX anomaly and fit guard.
   This is the authoritative final layout layer for the 1.7 Spotify-style shell. */
.topbar>*{min-width:0}.top-actions{flex:0 0 auto}.user-pill{max-width:min(220px,32vw);min-width:0}.user-pill>span:nth-child(2){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.player-bar>*{min-width:0}.player-extra{min-width:0;white-space:nowrap}.player-meta-sub{max-width:100%}
.queue-head-copy,.queue-head-actions,.now-panel-card-head h4{min-width:0}.queue-head-actions{flex:0 0 auto}.queue-head-copy h3,.now-panel-card-head h4{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.now-panel-card-head{gap:10px}.now-panel-card-head>button{flex:0 0 auto;white-space:nowrap}.now-panel-actions-card button{min-height:44px}
.modal{overflow-x:hidden}.modal-actions{flex-wrap:wrap}.modal-actions button{min-height:40px}.popover{max-width:calc(100vw - 16px)}
.library-page-sort{white-space:nowrap}.library-page-toolbar>*{min-width:0}.playlist-toolbar>*{min-width:0}.playlist-sort-select{min-height:38px}.playlist-filter-search{flex:1 1 190px}
.library-item-main,.library-folder-toggle,.library-page-row,.quick-tile,.media-card{min-width:0}.quick-tile strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.track-table{max-width:100%}.track-title-cell,.track-lines,.row-actions{min-width:0}

/* Laptop/tablet desktop: Now Playing becomes a real overlay with its remembered width.
   Do not zero --right-panel-w here; that made the panel collapse to 0px in 1.7.0. */
@media (min-width:821px) and (max-width:1050px){
  .app-shell.now-panel-open{grid-template-columns:var(--side-w) minmax(0,1fr) 0!important}
  .app-shell.now-panel-open .now-playing-panel{display:flex!important;position:fixed;z-index:72;top:8px;right:8px;bottom:calc(var(--player-h) + 8px);width:min(var(--right-panel-w),44vw)!important;min-width:300px;max-width:440px;opacity:1;pointer-events:auto;box-shadow:-16px 0 42px rgba(0,0,0,.46)}
  .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:820px){
  .topbar>*{min-width:0}.top-actions{flex:0 0 auto}.user-pill{max-width:42px}
  .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .playlist-toolbar{align-items:center;gap:5px}
  .playlist-toolbar .round-play{flex:0 0 52px;margin-right:2px}
  .playlist-toolbar .spotify-action-btn{flex:0 0 44px}
  .playlist-sort-select{flex:1 1 118px;min-width:105px;max-width:160px;height:40px}
  .playlist-filter-search{order:10;flex:1 0 100%;width:100%;max-width:none;min-width:0}
  .playlist-bulk-bar{align-items:center;flex-wrap:wrap}.playlist-bulk-bar strong{margin-right:auto}.playlist-bulk-bar button{min-height:38px}
  .library-page-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.library-page-search{grid-column:1/-1;width:100%;min-width:0}.library-page-chips{grid-column:1/-1;order:initial;width:100%}.library-page-sort{margin:0;justify-self:end}
  .mnp-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;width:100%}.mnp-actions button{width:100%;min-width:0;justify-content:center!important;padding-inline:8px}
  .queue-tools{max-width:100%}.queue-bulk-bar{flex-wrap:wrap}.queue-bulk-bar span{min-width:0}.queue-head{min-width:0}.queue-head-actions{min-width:0}
  .create-sheet-actions button{min-width:0}.create-sheet-actions span{min-width:0}.create-sheet-actions strong,.create-sheet-actions small{overflow-wrap:anywhere}
}
@media (max-width:560px){
  .mnp-actions button{width:100%!important;border-radius:10px!important;padding:0!important}.mnp-actions button span{display:none!important}
  .playlist-sort-select{max-width:145px}
}
@media (max-width:430px){
  .quick-grid{grid-template-columns:1fr}
  .library-page-toolbar{grid-template-columns:1fr}.library-page-sort{justify-self:start}.library-page-search,.library-page-chips{grid-column:1}
  .playlist-toolbar .round-play{flex-basis:50px}.playlist-sort-select{flex:1 1 110px;max-width:none}
}
@media (min-width:821px) and (max-width:1050px){
  .app-shell.library-expanded{--side-w:min(var(--library-expanded),28vw)}
}

/* 1.7.2 — catalog/UI correctness and Spotify component fidelity. */
/* Search field stays borderless in every state; focus is conveyed by surface tone, not an outline. */
.top-search,.top-search:hover,.top-search:focus-within{border:0!important;box-shadow:none!important;outline:0!important}
#searchInput,#searchInput:hover,#searchInput:focus,#searchInput:focus-visible{border:0!important;outline:0!important;box-shadow:none!important}
.top-search:focus-within{background:#2d2d2d}

/* Library filter chip labels are always real visible text when the expanded filter bar is present. */
#librarySidebarFilters .library-filter-label{display:inline-block!important;visibility:visible!important;opacity:1!important;line-height:1.2;color:inherit;font-size:13px;font-weight:500}
#librarySidebarFilters button{display:inline-flex!important;align-items:center;justify-content:center;min-height:32px;line-height:1;padding:7px 12px!important}
.app-shell.library-collapsed #librarySidebarFilters{display:none!important}

/* Spotify-style sidebar items: a single aligned row, with pin status in metadata and actions floating over the row. */
.spotify-library-list .library-item-row{position:relative;display:block!important;min-height:64px;border-radius:6px;margin:1px 0;overflow:hidden}
.spotify-library-list .library-item-row:hover,.spotify-library-list .library-item-row:focus-within{background:#1f1f1f}
.spotify-library-list .library-item-row.active{background:#232323}
.spotify-library-list .library-item-main{display:grid!important;width:100%!important;grid-template-columns:48px minmax(0,1fr)!important;align-items:center!important;gap:12px!important;min-height:64px;padding:8px 44px 8px 8px!important;margin:0!important;border:0!important;border-radius:6px!important;background:transparent!important;color:#fff!important;text-align:left!important;white-space:normal!important;overflow:visible!important;cursor:pointer}
.spotify-library-list .library-item-cover{width:48px;height:48px;min-width:48px;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.spotify-library-list .library-item-cover.artist{border-radius:50%}
.spotify-library-list .library-item-copy{display:grid;gap:3px;min-width:0;align-content:center}
.spotify-library-list .library-item-copy>strong{display:block;min-width:0;font-size:15px;line-height:1.25;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spotify-library-list .library-item-meta{display:flex!important;align-items:center;gap:5px;min-width:0;color:#b3b3b3;font-size:13px;line-height:1.25;white-space:nowrap;overflow:hidden}
.spotify-library-list .library-item-meta>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spotify-library-list .library-pinned-indicator{width:13px;height:13px;min-width:13px;color:var(--sp-green);fill:currentColor;stroke:none}
.spotify-library-list .library-item-row.active .library-item-copy>strong{color:#fff}
.spotify-library-list .library-pin-toggle{position:absolute!important;right:6px;top:50%;transform:translateY(-50%);display:grid!important;place-items:center;width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;padding:0!important;margin:0!important;border:0!important;border-radius:50%!important;background:rgba(18,18,18,.86)!important;color:#b3b3b3!important;white-space:normal!important;overflow:visible!important;opacity:0;pointer-events:none;transition:opacity .12s ease,background .12s ease,color .12s ease}
.spotify-library-list .library-item-row:hover .library-pin-toggle,.spotify-library-list .library-item-row:focus-within .library-pin-toggle,.spotify-library-list .library-pin-toggle:focus-visible{opacity:1;pointer-events:auto}
.spotify-library-list .library-pin-toggle:hover{background:#333!important;color:#fff!important}
.spotify-library-list .library-pin-toggle.pinned{color:var(--sp-green)!important}
.spotify-library-list .library-pin-toggle .icon{width:16px;height:16px}
@media (hover:none),(pointer:coarse){.spotify-library-list .library-pin-toggle{opacity:1;pointer-events:auto;background:rgba(18,18,18,.72)!important}}
.spotify-library-list.compact .library-item-row{min-height:48px}
.spotify-library-list.compact .library-item-main{grid-template-columns:40px minmax(0,1fr)!important;min-height:48px;padding:4px 40px 4px 6px!important;gap:9px!important}
.spotify-library-list.compact .library-item-cover{width:40px;height:40px;min-width:40px}
.spotify-library-list.compact .library-item-copy>strong{font-size:14px}
.spotify-library-list.compact .library-item-meta{display:none!important}
.app-shell.library-collapsed .spotify-library-list .library-item-row{min-height:58px;overflow:visible}
.app-shell.library-collapsed .spotify-library-list .library-item-main{display:grid!important;grid-template-columns:1fr!important;min-height:58px;padding:4px!important}
.app-shell.library-collapsed .spotify-library-list .library-item-cover{width:50px;height:50px;min-width:50px;margin:auto}
.app-shell.library-collapsed .spotify-library-list .library-pin-toggle{display:none!important}

/* Cards keep artwork and controls as separate siblings; the play action overlays via the art wrapper, not the cover node. */
.card-art-wrap{position:relative;aspect-ratio:1;min-width:0}
.card-art-wrap .card-cover{width:100%;height:100%;aspect-ratio:auto;position:static}
.media-card.artist-card .card-art-wrap,.media-card.artist-card .card-cover{border-radius:50%}
.card-art-wrap>.card-play{position:absolute;right:8px;bottom:8px}

/* Repeat glyphs are self-contained SVGs and use a slightly wider visual box so arrows never clip. */
#repeatBtn .icon,#mnpRepeat .icon,#queueRepeatBtn .icon{width:20px!important;height:20px!important;overflow:visible;stroke-width:1.85}

/* 1.7.2 repeat icons use self-contained filled SVG geometry. */
#repeatBtn .icon,#mnpRepeat .icon,#queueRepeatBtn .icon{width:20px!important;height:20px!important;fill:currentColor;stroke:none!important;overflow:visible}

.artist-placeholder-icon{width:42%!important;height:42%!important;color:#b3b3b3;stroke-width:1.65}
.library-item-cover.artist .icon{width:23px;height:23px}

#searchInput{-webkit-appearance:none;appearance:none;background:transparent!important;border-color:transparent!important}
#searchInput:focus,#searchInput:focus-visible{border-color:transparent!important;outline:none!important;box-shadow:none!important}

/* 1.7.3 — Your Library filter chips: stable geometry in every selected state. */
#librarySidebarFilters{
  display:flex!important;
  align-items:center;
  gap:6px;
  min-width:0;
  width:100%;
  padding:4px 8px 7px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}
#librarySidebarFilters::-webkit-scrollbar{display:none}
#librarySidebarFilters button[data-library-filter]{
  flex:0 0 auto!important;
  width:auto!important;
  min-width:max-content!important;
  max-width:none!important;
  min-height:32px;
  box-sizing:border-box;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  padding:7px 10px!important;
  margin:0!important;
  border:0!important;
  border-radius:999px!important;
  background:#232323;
  color:#fff;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  line-height:1!important;
  transform:none!important;
  position:relative;
}
#librarySidebarFilters button[data-library-filter] .library-filter-label{
  display:block!important;
  flex:0 0 auto;
  width:auto!important;
  min-width:0;
  visibility:visible!important;
  opacity:1!important;
  overflow:visible!important;
  white-space:nowrap!important;
  color:inherit!important;
  line-height:18px!important;
}
#librarySidebarFilters button[data-library-filter]:hover{background:#333}
#librarySidebarFilters button[data-library-filter].active,
#librarySidebarFilters button[data-library-filter][aria-pressed="true"]{
  background:#fff!important;
  color:#000!important;
  padding:7px 10px!important;
  min-width:max-content!important;
  transform:none!important;
}
#librarySidebarFilters button[data-library-filter]:focus-visible{
  outline:2px solid #fff;
  outline-offset:2px;
}
.app-shell.library-collapsed #librarySidebarFilters{display:none!important}

/* 1.7.6 — Your Library filter controls use one invariant layout/state model. */
#librarySidebarFilters{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:center;
  gap:5px;
  width:100%;
  min-width:0;
  padding:4px 6px 7px;
  overflow:visible!important;
  scrollbar-width:none;
}
#librarySidebarFilters button[data-library-filter]{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:32px;
  padding:7px 4px!important;
  margin:0!important;
  border:0!important;
  border-radius:999px!important;
  background:#232323;
  color:#fff;
  font-size:12px;
  font-weight:500;
  line-height:18px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  transform:none!important;
  position:relative;
}
#librarySidebarFilters button[data-library-filter] .library-filter-label{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%;
  visibility:visible!important;
  opacity:1!important;
  overflow:visible!important;
  color:inherit!important;
  font:inherit;
  line-height:18px!important;
  white-space:nowrap!important;
  pointer-events:none;
}
#librarySidebarFilters button[data-library-filter]:hover{background:#333}
#librarySidebarFilters button[data-library-filter].active,
#librarySidebarFilters button[data-library-filter][aria-pressed="true"]{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  padding:7px 4px!important;
  background:#fff!important;
  color:#000!important;
  font-size:12px;
  font-weight:500;
  transform:none!important;
}
#librarySidebarFilters button[data-library-filter]:focus-visible{
  outline:2px solid #fff;
  outline-offset:2px;
}
@media (min-width:821px) and (max-width:940px){
  #librarySidebarFilters{gap:4px;padding-inline:4px}
  #librarySidebarFilters button[data-library-filter],
  #librarySidebarFilters button[data-library-filter].active,
  #librarySidebarFilters button[data-library-filter][aria-pressed="true"]{
    padding-inline:3px!important;
    font-size:11px;
  }
}
.app-shell.library-collapsed #librarySidebarFilters{display:none!important}


/* 1.7.9 — Chatcord-style staged updater */
.staged-release{margin-top:16px;background:linear-gradient(135deg,#1b231e,#171b18)}
.update-package-errors{margin-top:14px;padding:13px 14px;border:1px solid rgba(242,95,92,.32);background:rgba(242,95,92,.08);border-radius:8px}
.update-package-errors>strong{display:block;margin-bottom:8px;color:#ff9d9b}
.update-package-errors ul{margin:0;padding-left:20px;color:#d0d0d0;font-size:12px;line-height:1.55;max-height:220px;overflow:auto}
.update-stage-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:14px}
@media(max-width:760px){.update-stage-actions>button{width:100%}}

/* 1.8.1 — Spotify-focused account security, loading and health UI */
.auth-remember{display:flex;align-items:center;gap:9px;margin:2px 0 10px;color:#d7d7d7;font-size:13px;cursor:pointer;user-select:none}
.auth-remember input{margin:0;accent-color:#1ed760;flex:0 0 auto}
.auth-link{border:0;background:none;color:#fff;text-decoration:underline;text-underline-offset:2px;padding:0;cursor:pointer;font:inherit}

.account-settings{width:min(980px,100%);margin:0 auto;padding:30px clamp(18px,4vw,48px) 90px}
.account-settings-head{padding:10px 0 28px;border-bottom:1px solid #2b2b2b;margin-bottom:22px}
.account-settings-head small{display:block;color:#b3b3b3;font-size:11px;font-weight:800;letter-spacing:.13em;margin-bottom:7px}
.account-settings-head h1{font-size:clamp(30px,5vw,46px);line-height:1.05;margin:0 0 8px;font-weight:800;letter-spacing:-.035em}
.account-settings-head p{margin:0;color:#b3b3b3}
.account-card{background:#181818;border:1px solid #292929;border-radius:12px;padding:22px;margin:0 0 18px;box-shadow:0 10px 30px rgba(0,0,0,.14)}
.account-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:16px}
.account-card-head h2{margin:0 0 5px;font-size:19px}
.account-card-head p{margin:0;color:#aaa;font-size:13px;line-height:1.45;max-width:650px}
.account-card button,.security-verify-dialog button,.two-factor-dialog button,.recovery-dialog button{border:0;border-radius:999px;background:#fff;color:#000;font-weight:700;padding:9px 14px;cursor:pointer;transition:transform .12s ease,background .12s ease}
.account-card button:hover,.security-verify-dialog button:hover,.two-factor-dialog button:hover,.recovery-dialog button:hover{transform:scale(1.025)}
.account-card button:disabled{opacity:.45;cursor:not-allowed;transform:none}
.account-card .secondary-btn,.account-card-head>button{background:#2a2a2a;color:#fff;border:1px solid #4a4a4a}
.account-select{display:flex;flex-direction:column;gap:7px;color:#b3b3b3;font-size:12px;font-weight:650;max-width:300px}
.account-select select{width:100%;min-height:42px;border:1px solid #535353;border-radius:6px;background:#121212;color:#fff;padding:0 12px;font:inherit;font-size:14px}
.security-setting{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 0;border-top:1px solid #2a2a2a}
.security-setting:first-of-type{border-top:0}
.security-setting>div{display:flex;flex-direction:column;gap:5px;min-width:0}
.security-setting strong{font-size:14px;color:#fff}
.security-setting small{font-size:12px;color:#aaa;line-height:1.42}
.login-session-list{border-top:1px solid #2a2a2a}
.login-session-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:66px;border-bottom:1px solid #292929;padding:10px 0}
.login-session-row:last-child{border-bottom:0}
.session-device-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#292929;color:#ddd}
.session-device-icon svg{width:17px;height:17px}
.login-session-row>div:nth-child(2){display:flex;flex-direction:column;gap:4px;min-width:0}
.login-session-row strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.login-session-row small{color:#999;font-size:11px;white-space:normal;line-height:1.35}
.current-session-chip{color:#1ed760;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.two-factor-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:22px;align-items:center;margin:18px 0}
.two-factor-qr{width:200px;height:200px;background:#fff;border-radius:10px;padding:8px;display:grid;place-items:center;color:#111;overflow:hidden}
.two-factor-qr img,.two-factor-qr canvas{max-width:100%;height:auto!important}
.two-factor-key{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0}
.two-factor-key small{color:#aaa}
.two-factor-key code{display:block;max-width:100%;word-break:break-all;background:#252525;border:1px solid #3b3b3b;border-radius:6px;padding:10px;color:#fff;letter-spacing:.04em}
.recovery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0 20px}
.recovery-grid code{background:#242424;border:1px solid #383838;border-radius:6px;padding:9px 10px;text-align:center;color:#fff;font-size:13px}
.security-verify-dialog p,.two-factor-dialog p,.recovery-dialog p{color:#b3b3b3;line-height:1.5}
.security-verify-dialog label,.two-factor-dialog label{display:flex;flex-direction:column;gap:7px;margin:12px 0;font-size:12px;font-weight:700;color:#ddd}
.security-verify-dialog input,.two-factor-dialog input{min-height:42px;background:#121212;border:1px solid #535353;border-radius:5px;color:#fff;padding:0 12px;font-size:14px}

/* Skeletons are shaped like Spotify shelves and track tables, not generic spinners. */
.ss-skeleton{position:relative;overflow:hidden;background:#242424;border-radius:7px}
.ss-skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.055),transparent);animation:ss-shimmer 1.35s infinite}
@keyframes ss-shimmer{100%{transform:translateX(100%)}}
.ss-skeleton-page{padding:22px clamp(16px,3vw,34px) 90px}
.ss-skeleton-title{width:min(310px,58%);height:34px;margin-bottom:22px}
.ss-skeleton-shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:18px;margin-bottom:30px}
.ss-skeleton-card{min-height:220px;border-radius:8px;background:#181818;padding:12px}
.ss-skeleton-card .ss-cover{aspect-ratio:1/1;width:100%;margin-bottom:13px}
.ss-skeleton-card .ss-line{height:13px;margin:8px 0}.ss-skeleton-card .ss-line.short{width:65%}
.ss-skeleton-track{display:grid;grid-template-columns:26px 42px minmax(150px,1fr) minmax(100px,.65fr) 70px;gap:12px;align-items:center;min-height:56px;border-bottom:1px solid rgba(255,255,255,.05)}
.ss-skeleton-track .ss-cover{width:40px;height:40px}.ss-skeleton-track .ss-line{height:12px}.ss-skeleton-track .ss-dot{width:15px;height:15px;border-radius:50%}
.ss-skeleton-admin{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.ss-skeleton-admin>div{height:105px}

.system-health-card{overflow:hidden}
.health-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:#292929;border:1px solid #292929;border-radius:8px;overflow:hidden}
.health-row{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:10px;align-items:center;min-height:62px;padding:10px 12px;background:#181818}
.health-row>div{display:flex;flex-direction:column;gap:3px;min-width:0}.health-row strong{font-size:12px}.health-row small{font-size:10px;color:#9e9e9e;overflow:hidden;text-overflow:ellipsis}.health-row>span:last-child{font-size:10px;font-weight:750;color:#aaa}
.health-dot{width:8px;height:8px;border-radius:50%;background:#f15e6c;box-shadow:0 0 0 3px rgba(241,94,108,.1)}
.health-row.ok .health-dot{background:#1ed760;box-shadow:0 0 0 3px rgba(30,215,96,.1)}
.health-row.ok>span:last-child{color:#1ed760}.health-row.bad>span:last-child{color:#ff8791}

@media(max-width:760px){
  .account-settings{padding:18px 14px 108px}.account-card{padding:17px;border-radius:9px}.account-card-head,.security-setting{align-items:flex-start;flex-direction:column}.account-card-head>button,.security-setting>button{width:100%}
  .login-session-row{grid-template-columns:34px minmax(0,1fr)}.login-session-row>button,.login-session-row>.current-session-chip{grid-column:2;justify-self:start}
  .two-factor-layout{grid-template-columns:1fr}.two-factor-qr{margin:auto}.recovery-grid{grid-template-columns:1fr}
  .health-list{grid-template-columns:1fr}.ss-skeleton-admin{grid-template-columns:repeat(2,minmax(0,1fr))}.ss-skeleton-track{grid-template-columns:24px 40px minmax(130px,1fr)}.ss-skeleton-track>*:nth-child(n+4){display:none}
}
@media (prefers-reduced-motion:reduce){.ss-skeleton::after{animation:none}.account-card button{transition:none}}

/* 1.8.2 realtime/performance diagnostics — compact Spotify-like admin cards. */
.realtime-diagnostics-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}.realtime-diagnostic{min-width:0;padding:16px;border-radius:12px;background:var(--surface-raised,#242424);border:1px solid color-mix(in srgb,currentColor 9%,transparent);display:flex;flex-direction:column;gap:5px}.realtime-diagnostic>span{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-subdued,#b3b3b3)}.realtime-diagnostic>strong{font-size:20px;line-height:1.15;color:var(--text-base,#fff);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.realtime-diagnostic>small{color:var(--text-subdued,#b3b3b3);line-height:1.35}.realtime-domain-line{margin:14px 2px 0}@media(max-width:1100px){.realtime-diagnostics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.realtime-diagnostics-grid{grid-template-columns:1fr}.realtime-diagnostic{padding:14px}}

/* 1.8.3 — scalable music ingestion / catalog maintenance */
.upload-item.queued-import .upload-progress i,.upload-item.processing .upload-progress i{background:#1ed760}.upload-item.duplicate .upload-progress i{background:#64d98b}.upload-item.duplicate .upload-file-icon{color:#1ed760}.upload-item-main>small{font-size:10px;color:#9f9f9f;line-height:1.35}.search-more-wrap,.admin-load-more{display:flex;justify-content:center;padding:14px 0 4px}.audit-filter{display:flex;gap:8px;margin:0 0 16px}.audit-filter input{flex:1;min-width:0;height:40px;border:1px solid #3b3b3b;border-radius:6px;background:#181818;color:#fff;padding:0 12px}.audit-filter input:focus{outline:2px solid #fff;outline-offset:1px}.admin-card .health-list{overflow:hidden;border-radius:6px}.admin-table code{font-size:11px}.admin-table td small{display:block;max-width:460px;white-space:normal;overflow-wrap:anywhere;color:#aaa}.admin-actions.update-stage-actions,.admin-card-head>.admin-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.status-chip.processing{color:#f8c84f}.status-chip.warning{background:rgba(248,200,79,.13);color:#f8c84f}.status-chip.duplicate{color:#8cdea6}
@media(max-width:820px){.audit-filter{flex-direction:column}.admin-card-head>.admin-actions{width:100%}.admin-card-head>.admin-actions button{flex:1}.admin-table td small{max-width:240px}}

/* 1.8.4 — Spotify-style Jam, QR login, Spotify import and navigation continuity */
.auth-divider{display:flex;align-items:center;gap:12px;margin:22px 0 18px;color:#777;font-size:11px;font-weight:750;text-transform:uppercase;letter-spacing:.08em}.auth-divider::before,.auth-divider::after{content:"";height:1px;background:#303030;flex:1}.auth-qr-panel{display:grid;grid-template-columns:116px minmax(0,1fr);gap:16px;align-items:center;padding:14px;border:1px solid #2d2d2d;border-radius:10px;background:#181818}.auth-qr-code{width:116px;height:116px;border-radius:8px;background:#fff;display:grid;place-items:center;overflow:hidden;color:#111;font-size:11px;text-align:center;padding:6px}.auth-qr-code img,.auth-qr-code canvas{max-width:100%;height:auto!important}.auth-qr-copy{display:flex;flex-direction:column;gap:5px;min-width:0}.auth-qr-copy strong{font-size:14px}.auth-qr-copy span,.auth-qr-copy small{font-size:11px;line-height:1.4;color:#aaa}.auth-qr-copy small.error{color:#ff8d96}.auth-qr-panel>.auth-link{grid-column:1/-1;justify-self:center;border:0;background:transparent;color:#fff;text-decoration:underline;cursor:pointer}.auth-qr-panel.approval-pending{grid-template-columns:90px 1fr}.auth-qr-panel.approval-pending .auth-qr-code{width:90px;height:90px;background:#242424;color:#bbb}
#jamBtn.active,#mnpJam.active,#nowPanelJam.active{color:var(--sp-green)!important}.player-extra #jamBtn.active::after{content:"";position:absolute;right:4px;bottom:4px;width:5px;height:5px;border-radius:50%;background:var(--sp-green);box-shadow:0 0 0 2px #000}.jam-dialog{min-width:min(520px,82vw)}.jam-dialog>.eyebrow,.qr-approve-dialog>.eyebrow,.spotify-preview>.eyebrow{display:block;color:#b3b3b3;font-size:10px;font-weight:800;letter-spacing:.12em;margin-bottom:7px}.jam-dialog>p,.jam-head p,.jam-share p,.jam-participant-note small,.spotify-preview>p{color:#b3b3b3;line-height:1.5}.jam-start-btn{width:100%;min-height:48px;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:9px;margin:20px 0 16px}.jam-start-btn .icon{width:20px;height:20px}.jam-divider{display:flex;align-items:center;gap:10px;color:#888;font-size:11px;margin:14px 0}.jam-divider::before,.jam-divider::after{content:"";height:1px;background:#303030;flex:1}.jam-dialog form label{display:flex;flex-direction:column;gap:7px;color:#ddd;font-size:12px;font-weight:700}.jam-dialog form input:not([type=checkbox]){height:44px;background:#121212;border:1px solid #535353;border-radius:5px;color:#fff;padding:0 12px;text-transform:none;font-size:16px;letter-spacing:.03em}.jam-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px}.jam-head h2{margin-bottom:4px}.jam-live-dot{padding:5px 8px;border-radius:999px;background:rgba(30,215,96,.12);color:#1ed760;font-size:9px;font-weight:900;letter-spacing:.12em}.jam-share{display:grid;grid-template-columns:184px minmax(0,1fr);gap:20px;align-items:center;margin:18px 0;padding:16px;background:#181818;border:1px solid #303030;border-radius:12px}.jam-qr{width:184px;height:184px;padding:8px;border-radius:9px;background:#fff;display:grid;place-items:center;overflow:hidden;color:#111}.jam-qr img,.jam-qr canvas{max-width:100%;height:auto!important}.jam-share>div:last-child{display:flex;flex-direction:column;align-items:flex-start;gap:7px}.jam-share small{color:#9a9a9a}.jam-code{font-size:28px;letter-spacing:.16em;color:#fff}.jam-share button,.jam-members+button{border:1px solid #555;background:transparent;color:#fff;border-radius:999px;padding:8px 13px;font-weight:700;cursor:pointer}.jam-setting{display:flex;align-items:flex-start;gap:12px;padding:13px 2px;border-top:1px solid #292929;border-bottom:1px solid #292929}.jam-setting input{accent-color:#1ed760;margin-top:3px}.jam-setting span{display:flex;flex-direction:column;gap:3px}.jam-setting small{color:#999}.jam-participant-note{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid #2f2f2f;border-radius:10px;background:#181818;margin:16px 0}.jam-participant-note>.icon{width:22px;height:22px;color:#1ed760;flex:0 0 auto}.jam-participant-note>div{display:flex;flex-direction:column;gap:4px}.jam-members{margin:18px 0}.jam-members h3{font-size:13px;margin:0 0 8px}.jam-member{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #252525}.jam-member:last-child{border-bottom:0}.jam-member-avatar{width:32px;height:32px;border-radius:50%;background:#333;display:grid;place-items:center;font-size:12px;font-weight:800}.jam-member>div{display:flex;flex-direction:column;gap:2px}.jam-member strong{font-size:12px}.jam-member small{font-size:10px;color:#999}.jam-participant .queue-drag,.jam-participant #clearQueueBtn,.jam-participant #reshuffleQueueBtn,.jam-participant #queueSelectBtn{opacity:.4}.jam-participant .seek-range:disabled{cursor:not-allowed;opacity:.7}
.spotify-import-card .account-card-head{align-items:center}.spotify-connect-btn{background:#1ed760!important;color:#000!important;border:0!important;display:flex;align-items:center;gap:7px}.spotify-connect-empty{display:flex;align-items:center;gap:12px;padding:14px;border-radius:8px;background:#181818;color:#aaa}.spotify-connect-empty>.icon{width:26px;height:26px}.spotify-connect-empty>div{display:flex;flex-direction:column;gap:4px}.spotify-connect-empty strong{color:#fff}.spotify-connect-empty small{font-size:11px;line-height:1.4}.spotify-import-error{color:#ff8d96;font-size:12px}.spotify-import-list{max-height:360px;overflow:auto;border-top:1px solid #292929}.spotify-import-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:11px;align-items:center;min-height:62px;padding:9px 0;border-bottom:1px solid #292929}.spotify-import-row.saved{border-top:1px solid #292929}.spotify-import-icon{width:36px;height:36px;border-radius:5px;background:#282828;display:grid;place-items:center;color:#1ed760}.spotify-import-icon .icon{width:18px;height:18px}.spotify-import-row>div:nth-child(2){display:flex;flex-direction:column;gap:3px;min-width:0}.spotify-import-row strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-import-row small{font-size:10px;color:#999;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-match-list{max-height:min(440px,55vh);overflow:auto;border-top:1px solid #2d2d2d;border-bottom:1px solid #2d2d2d;margin:16px 0}.spotify-match{display:grid;grid-template-columns:26px minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 2px;border-bottom:1px solid #252525}.spotify-match:last-child{border-bottom:0}.spotify-match>span:first-child{color:#888}.spotify-match.matched>span:first-child{color:#1ed760}.spotify-match>div{display:flex;flex-direction:column;gap:2px;min-width:0}.spotify-match strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-match small,.spotify-match>span:last-child{font-size:10px;color:#999}.spotify-match.matched>span:last-child{color:#8cdea6}.qr-approve-dialog code{background:#242424;border-radius:5px;padding:3px 6px;color:#fff}.qr-approve-dialog p{line-height:1.5}
@media(max-width:700px){.auth-card{padding:30px 22px}.auth-qr-panel{grid-template-columns:94px minmax(0,1fr);padding:11px}.auth-qr-code{width:94px;height:94px}.jam-dialog{min-width:0}.jam-share{grid-template-columns:1fr}.jam-qr{margin:auto}.jam-share>div:last-child{align-items:center;text-align:center}.jam-code{font-size:24px}.spotify-import-row{grid-template-columns:34px minmax(0,1fr) auto}.mnp-actions{justify-content:space-between!important;gap:5px}.mnp-actions button{flex:1;min-width:0;justify-content:center}.mnp-actions button span{font-size:10px}}
/* 1.8.6 Spotify-style AI DJ, artwork and appearance surfaces */
.ai-dj-modal{display:grid;gap:16px;min-width:min(620px,86vw)}
.ai-dj-prompt{display:flex;gap:10px}.ai-dj-prompt textarea{flex:1;min-height:78px;resize:vertical;background:#242424;border:1px solid #3e3e3e;color:#fff;border-radius:8px;padding:12px}.ai-dj-results{display:grid;gap:8px;max-height:300px;overflow:auto}.ai-dj-track{display:grid;grid-template-columns:40px 1fr auto;gap:10px;align-items:center;padding:7px;border-radius:6px;background:#181818}.ai-dj-track small{color:#b3b3b3}.ai-dj-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.artwork-edit-btn{position:absolute;right:10px;bottom:10px;border:0;border-radius:999px;width:36px;height:36px;display:grid;place-items:center;background:rgba(0,0,0,.72);color:#fff;box-shadow:0 4px 18px #0008}.hero-art{position:relative}.artist-art img{width:100%;height:100%;object-fit:cover;border-radius:50%}.artwork-editor{display:grid;grid-template-columns:minmax(220px,340px) minmax(220px,1fr);gap:20px}.artwork-canvas-wrap{aspect-ratio:1;background:#111;border-radius:8px;overflow:hidden}.artwork-canvas-wrap canvas{width:100%;height:100%;display:block}.artwork-controls{display:grid;gap:12px;align-content:start}.artwork-controls input[type=range]{width:100%}
.audio-output-list{display:grid;gap:6px;max-height:330px;overflow:auto}.audio-output-row{display:flex;align-items:center;gap:10px;padding:10px;border-radius:8px;background:#181818}.audio-output-row.active{background:#2a2a2a}.audio-output-row button{margin-left:auto}
.appearance-preview.compact .track-row{min-height:38px}.track-density-compact .track-row{min-height:38px;padding-top:3px;padding-bottom:3px}.reduced-motion *,body.reduced-motion *{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
.account-appearance-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}.account-appearance-grid label{display:grid;gap:6px}.account-appearance-grid select,.account-appearance-grid input:not([type=checkbox]){background:#242424;color:#fff;border:1px solid #444;border-radius:6px;padding:9px}.account-switch{display:flex!important;align-items:center;gap:10px!important}
@media(max-width:700px){.artwork-editor{grid-template-columns:1fr}.ai-dj-modal{min-width:0}.ai-dj-prompt{display:grid}}

.playlist-cover-collage{display:grid;grid-template-columns:1fr 1fr;width:100%;height:100%;overflow:hidden}.playlist-cover-collage img{width:100%;height:100%;object-fit:cover}.library-item-cover.artist img{width:100%;height:100%;object-fit:cover;border-radius:50%}


/* 1.8.7 Spotify interaction polish: dialogs, contextual actions, Now Playing and AI DJ */
.modal-app-dialog{width:min(440px,calc(100vw - 28px));padding:24px;border-radius:10px;overflow:hidden}.app-dialog{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;align-items:start}.app-dialog-icon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#333;color:#fff}.app-dialog-icon.danger{background:rgba(226,33,52,.16);color:#ff9a9f}.app-dialog-icon .icon{width:22px;height:22px}.app-dialog-copy{min-width:0}.app-dialog-copy h2{font-size:20px;line-height:1.2;margin:1px 0 8px}.app-dialog-copy p{margin:0;color:#fff;font-size:14px;line-height:1.45;overflow-wrap:anywhere}.app-dialog-copy small{display:block;color:#b3b3b3;font-size:12px;line-height:1.5;margin-top:8px}.app-dialog-actions{grid-column:1/-1;margin-top:8px}.modal-actions .dialog-danger{background:#e91429!important;color:#fff!important}.modal-actions .dialog-danger:hover{background:#ff3045!important}.dialog-inline-alert{display:flex;align-items:flex-start;gap:10px;padding:12px;border-radius:8px;background:rgba(226,33,52,.12);color:#ffb1b6}.dialog-inline-alert .icon{width:20px;height:20px;flex:0 0 auto}

/* Context menus are application-owned everywhere except editable text controls. */
.track-context-menu{width:min(300px,calc(100vw - 16px));padding:5px;border-radius:5px}.track-context-menu button,.track-context-menu a{min-height:41px;height:auto;padding-block:9px;line-height:1.25}.track-context-menu button span,.track-context-menu a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Spotify-like Now Playing sidebar: roomy cover, clear hierarchy and cards that fit narrow widths. */
.now-playing-panel{background:#000;padding:8px 8px 0;overflow:hidden}.now-panel-head{position:sticky;top:0;z-index:4;min-height:48px;padding:0 8px;background:#121212;border-radius:8px 8px 0 0}.now-panel-head h3{font-size:15px;font-weight:800}.now-panel-scroll{display:flex;flex-direction:column;gap:14px;padding:0 8px 18px;background:#121212;border-radius:0 0 8px 8px;min-width:0}.now-panel-cover{width:100%;max-width:none!important;aspect-ratio:1/1;max-height:none!important;min-height:0;border-radius:8px;margin:0;box-shadow:0 8px 30px rgba(0,0,0,.35)}.now-panel-cover img{width:100%;height:100%;object-fit:cover}.now-panel-track-row{padding:2px 2px 4px;gap:10px;align-items:center}.now-panel-track-copy{min-width:0;display:grid;gap:4px}.now-panel-track-copy strong{font-size:19px;line-height:1.25;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.now-panel-track-copy #nowPanelArtist{font-size:13px;color:#b3b3b3;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}.now-panel-track-copy #nowPanelArtist:hover{color:#fff;text-decoration:underline}.now-panel-track-row>.like-btn{flex:0 0 38px;width:38px;height:38px;border-radius:50%}.now-panel-card{margin:0!important;border:0!important;border-radius:9px!important;background:#1f1f1f!important;overflow:hidden}.now-panel-card-head{min-height:46px;padding:0 14px;display:flex;align-items:center;justify-content:space-between}.now-panel-card-head h4{font-size:14px}.now-panel-card-head button{font-size:11px;font-weight:800;color:#b3b3b3}.now-panel-card-head button:hover{color:#fff;text-decoration:underline}.now-panel-artist-card{padding:0!important}.now-panel-artist-hero{display:grid!important;grid-template-columns:1fr!important;gap:0!important;width:100%;text-align:left;overflow:hidden}.now-panel-artist-image{display:block;width:100%;aspect-ratio:16/9;background:#2a2a2a;overflow:hidden}.now-panel-artist-image img{width:100%;height:100%;object-fit:cover}.now-panel-artist-image.placeholder{display:grid;place-items:center;color:#b3b3b3}.now-panel-artist-image.placeholder .icon{width:48px;height:48px}.now-panel-artist-copy{display:grid!important;gap:3px;padding:12px 14px 14px;min-width:0}.now-panel-artist-copy strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.now-panel-artist-copy small{font-size:10px!important;text-transform:uppercase;letter-spacing:.08em;color:#b3b3b3!important;margin:0!important}.now-panel-artist-copy span{font-size:11px;color:#b3b3b3;line-height:1.4}.now-panel-next{padding:0 8px 9px}.now-panel-next-row{width:100%;grid-template-columns:42px minmax(0,1fr);padding:7px 6px;border-radius:5px;background:transparent;color:#fff;text-align:left}.now-panel-next-row .mini-cover{width:42px;height:42px}.now-panel-next-row strong{font-size:12px}.now-panel-next-row small{font-size:10px}.now-panel-actions-card{padding:5px!important}.now-panel-actions-card button{min-width:0;min-height:42px}.now-panel-actions-card button span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* AI DJ uses a wide Spotify-like sheet without fighting the base 520px modal. */
.modal-ai-dj{width:min(760px,calc(100vw - 32px));max-height:min(86dvh,760px);padding:0;overflow:hidden}.ai-dj-modal{min-width:0!important;width:100%;height:min(760px,86dvh);max-height:86dvh;display:flex!important;flex-direction:column;gap:0!important}.ai-dj-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 24px 15px;border-bottom:1px solid #3a3a3a}.ai-dj-head>div{min-width:0}.ai-dj-head h2{font-size:24px;line-height:1.15;margin:4px 0 8px}.ai-dj-head p{margin:0;color:#b3b3b3;line-height:1.45}.modal-icon-close{width:36px;height:36px;flex:0 0 36px;border:0;border-radius:50%;display:grid;place-items:center;background:transparent;color:#b3b3b3;cursor:pointer}.modal-icon-close:hover{background:#3a3a3a;color:#fff}.modal-icon-close .icon{width:18px;height:18px}.ai-dj-prompt{display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:10px!important;padding:16px 24px 10px}.ai-dj-prompt textarea{min-width:0;min-height:72px!important;max-height:150px;resize:vertical;border-radius:7px!important;padding:12px 13px!important;line-height:1.4}.ai-dj-create{align-self:stretch;min-width:116px;border:0;border-radius:999px!important;font-weight:800}.ai-dj-suggestions{display:flex;gap:7px;flex-wrap:wrap;padding:0 24px 14px}.ai-dj-suggestions button{border:1px solid #535353;background:#242424;color:#fff;border-radius:999px;padding:7px 11px;font-size:11px;font-weight:700;cursor:pointer}.ai-dj-suggestions button:hover{border-color:#fff;background:#303030}.ai-dj-results{min-height:0;max-height:none!important;overflow:auto!important;flex:1;display:block!important;padding:0 24px 18px}.ai-dj-empty,.ai-dj-thinking{min-height:170px;display:flex;align-items:center;justify-content:center;gap:12px;color:#b3b3b3;text-align:left}.ai-dj-empty>.icon,.ai-dj-thinking>.icon{width:30px;height:30px;color:#1ed760}.ai-dj-empty>div{display:grid;gap:4px}.ai-dj-empty strong{color:#fff}.ai-dj-empty span{font-size:12px}.ai-dj-message{padding:11px 0 13px;color:#fff;line-height:1.45}.ai-dj-track-list{border-top:1px solid #333}.ai-dj-track{display:grid!important;grid-template-columns:28px 44px minmax(0,1fr) auto!important;gap:10px!important;align-items:center;padding:7px 6px!important;border-radius:5px!important;background:transparent!important;border-bottom:1px solid #303030}.ai-dj-track:hover{background:#333!important}.ai-dj-index,.ai-dj-duration{font-size:11px;color:#b3b3b3}.ai-dj-cover{width:44px;height:44px;border-radius:4px;overflow:hidden;background:#333;display:grid;place-items:center}.ai-dj-cover img{width:100%;height:100%;object-fit:cover}.ai-dj-cover .icon{width:20px;height:20px}.ai-dj-track-copy{display:grid;gap:2px;min-width:0}.ai-dj-track-copy strong,.ai-dj-track-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-dj-track-copy strong{font-size:13px}.ai-dj-track-copy small{font-size:10px!important;color:#b3b3b3}.ai-dj-actions{position:sticky;bottom:0;display:flex!important;justify-content:flex-end;gap:8px!important;padding:14px 0 2px;background:linear-gradient(180deg,rgba(40,40,40,0),#282828 24px)}.ai-dj-actions button{min-height:40px;display:inline-flex;align-items:center;gap:7px;border:1px solid #727272;background:#282828;color:#fff;border-radius:999px;padding:0 15px;font-weight:800}.ai-dj-actions .primary{border:0;background:#1ed760;color:#000}.ai-dj-actions .icon{width:16px;height:16px}

@media(max-width:820px){.modal-app-dialog{align-self:center}.app-dialog{grid-template-columns:38px minmax(0,1fr)}.app-dialog-icon{width:38px;height:38px}.now-playing-panel{padding:0}.modal-ai-dj{width:100%;max-height:92dvh;border-radius:14px 14px 0 0}.ai-dj-modal{height:92dvh;max-height:92dvh}.ai-dj-head{padding:18px 18px 13px}.ai-dj-head h2{font-size:22px}.ai-dj-prompt{grid-template-columns:1fr;padding:13px 18px 8px}.ai-dj-create{min-height:44px}.ai-dj-suggestions{padding:0 18px 12px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.ai-dj-suggestions::-webkit-scrollbar{display:none}.ai-dj-results{padding:0 18px 14px}.ai-dj-track{grid-template-columns:24px 42px minmax(0,1fr) auto!important}.ai-dj-cover{width:42px;height:42px}.mnp-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(min-width:821px) and (max-width:1050px){.app-shell.now-panel-open .now-playing-panel{min-width:300px;max-width:390px}.now-panel-track-copy strong{font-size:17px}}

/* 1.8.8 Spotify fidelity: nested Now Playing, Jam/output sizing and dark controls */
.modal-jam{width:min(680px,calc(100vw - 40px));max-height:min(84dvh,760px);padding:0;overflow:hidden}.modal-jam .jam-dialog{min-width:0!important;width:100%;max-height:min(84dvh,760px);overflow:auto;padding:26px 28px}.modal-jam .jam-dialog.active{display:flex;flex-direction:column}.modal-jam .jam-head{position:sticky;top:-26px;z-index:2;margin:-26px -28px 8px;padding:24px 28px 15px;background:linear-gradient(#282828 78%,rgba(40,40,40,.94));border-bottom:1px solid #383838}.modal-jam .jam-share{grid-template-columns:160px minmax(0,1fr);gap:22px;margin:14px 0;padding:16px}.modal-jam .jam-qr{width:160px;height:160px}.modal-jam .jam-members{margin:12px 0 4px;max-height:190px;overflow:auto;padding-right:4px}.modal-jam .modal-actions{position:sticky;bottom:-26px;margin:14px -28px -26px;padding:14px 28px 18px;background:#282828;border-top:1px solid #383838}.modal-jam button:not(.primary):not(.save):not(.danger){background:#242424;color:#fff;border:1px solid #535353}.modal-jam button:not(.primary):not(.save):not(.danger):hover{background:#333;border-color:#8a8a8a}.modal-jam .modal-actions .danger{background:#e91429;color:#fff;border:0}

.modal-audio-output{width:min(560px,calc(100vw - 36px));padding:0;overflow:hidden}.audio-output-dialog{display:flex;flex-direction:column;max-height:min(76dvh,650px)}.audio-output-head{display:grid;grid-template-columns:48px minmax(0,1fr) 36px;gap:14px;align-items:start;padding:24px 24px 18px;border-bottom:1px solid #393939;background:#282828}.audio-output-head-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#1ed760;color:#000}.audio-output-head-icon .icon{width:23px;height:23px}.audio-output-head small{color:#b3b3b3;font-size:10px;letter-spacing:.12em;font-weight:800}.audio-output-head h2{margin:2px 0 5px;font-size:24px}.audio-output-head p{margin:0;color:#b3b3b3;font-size:12px;line-height:1.45}.audio-output-list{display:grid;gap:6px;max-height:none;overflow:auto;padding:12px 14px;background:#181818}.audio-output-row{width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 12px;border:1px solid transparent!important;border-radius:8px;background:#242424!important;color:#fff;text-align:left;cursor:pointer}.audio-output-row:hover{background:#303030!important}.audio-output-row.active{background:#303030!important;border-color:#535353!important}.audio-output-device-icon{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#111;color:#d8d8d8}.audio-output-row.active .audio-output-device-icon{background:#1ed760;color:#000}.audio-output-copy{display:grid;gap:3px;min-width:0}.audio-output-copy strong,.audio-output-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.audio-output-copy strong{font-size:13px}.audio-output-copy small{font-size:11px;color:#b3b3b3}.audio-output-status{min-width:44px;display:grid;place-items:center;color:#b3b3b3;font-size:11px;font-weight:800}.audio-output-row.active .audio-output-status{color:#1ed760}.audio-output-status .icon{width:20px;height:20px}.audio-output-foot{display:flex;align-items:center;gap:8px;padding:12px 18px;color:#9b9b9b;font-size:10px;background:#202020;border-top:1px solid #333}.audio-output-foot .icon{width:14px;height:14px;flex:0 0 auto}

.now-playing-panel{background:#000!important;padding:8px!important;overflow:hidden}.now-panel-surface{height:100%;min-height:0;display:flex;flex-direction:column;background:#121212;border-radius:8px;overflow:hidden}.now-panel-head{flex:0 0 auto;position:relative!important;top:auto!important;border-radius:0!important;background:#121212!important;padding:0 14px!important;border-bottom:1px solid #202020}.now-panel-scroll{flex:1;min-height:0;overflow-y:auto!important;background:transparent!important;border-radius:0!important;padding:12px 12px 20px!important;gap:12px!important}.now-panel-cover{border-radius:8px!important}.now-panel-track-row{padding:2px 2px 8px!important}.now-panel-card{background:#1f1f1f!important;border-radius:8px!important;box-shadow:0 1px 0 rgba(255,255,255,.03)}.now-panel-card-head{padding:0 12px!important;min-height:44px!important}.now-panel-card-head h4{font-size:13px!important}.now-panel-card-head button{background:transparent!important;border:0!important;padding:7px 5px!important}.now-panel-artist-image{aspect-ratio:16/8.8!important}.now-panel-artist-bio{margin:0;padding:0 14px 12px;color:#d0d0d0;font-size:11px;line-height:1.5;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}.now-panel-artist-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 14px 14px}.now-panel-artist-footer button,.now-panel-artist-footer a{border:1px solid #666;background:transparent;color:#fff;border-radius:999px;padding:6px 10px;font-size:10px;font-weight:800;text-decoration:none;cursor:pointer}.now-panel-artist-footer button:hover,.now-panel-artist-footer a:hover{border-color:#fff;transform:scale(1.02)}.now-panel-card-empty{padding:10px 12px;margin:0}.now-panel-about-loading{display:grid;gap:8px;padding:14px}.now-panel-about-loading span{display:block;height:10px;border-radius:999px;background:#333}.now-panel-about-loading span:first-child{height:120px;border-radius:6px}.now-panel-about-loading span:nth-child(2){width:70%}.now-panel-about-loading span:nth-child(3){width:45%}.now-panel-next{padding:0 8px 10px!important;display:grid;gap:3px}.now-panel-next-row{display:grid!important;grid-template-columns:44px minmax(0,1fr)!important;align-items:center;gap:10px!important;padding:7px!important;border:0!important;border-radius:6px!important;background:transparent!important;color:#fff!important}.now-panel-next-row:hover{background:#2c2c2c!important}.now-panel-next-row.primary{background:#272727!important}.now-panel-next-row.primary:hover{background:#333!important}.now-panel-next-row .mini-cover{width:44px!important;height:44px!important}.now-panel-next-copy{display:grid;gap:2px;min-width:0}.now-panel-next-copy strong,.now-panel-next-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.now-panel-more-count{padding:6px 7px 2px;color:#8f8f8f;font-size:10px}.now-panel-actions-card{display:grid!important;grid-template-columns:1fr 1fr;padding:7px!important;gap:5px}.now-panel-actions-card #nowPanelDevices{grid-column:1/-1}.now-panel-actions-card button{border:0!important;border-radius:6px!important;background:#292929!important;color:#fff!important;padding:9px 10px!important}.now-panel-actions-card button:hover{background:#353535!important}

.library-search-wrap{height:38px!important;margin:5px 8px 8px!important;padding:0 10px!important;border-radius:6px!important;background:#242424!important;border:1px solid transparent;transition:background .12s,border-color .12s}.library-search-wrap:focus-within{background:#2a2a2a!important;border-color:#5a5a5a}.library-search-wrap>.icon{width:16px;height:16px;flex:0 0 auto}.library-search-wrap input{height:100%;font-size:12px!important;padding:0!important}.library-search-wrap input::placeholder{color:#a5a5a5}

/* Dark-theme button normalization for dialogs and player utility surfaces. */
.modal-actions button:not(.save):not(.danger):not(.dialog-danger){background:#242424;color:#fff;border:1px solid #535353}.modal-actions button:not(.save):not(.danger):not(.dialog-danger):hover{background:#333;border-color:#777}.modal .secondary-btn,.modal button.secondary-btn{background:#242424!important;color:#fff!important;border-color:#666!important}.modal .danger{color:#fff!important}.now-panel-card button{color:#fff}

#playerCover{cursor:pointer}.now-playing-panel[aria-hidden="false"]~.player-bar #playerCover{outline:0}

@media(max-width:820px){.modal-jam{width:100%;max-height:92dvh;border-radius:14px 14px 0 0}.modal-jam .jam-dialog{max-height:92dvh;padding:20px 18px}.modal-jam .jam-head{top:-20px;margin:-20px -18px 8px;padding:20px 18px 13px}.modal-jam .jam-share{grid-template-columns:1fr;padding:14px}.modal-jam .jam-qr{width:150px;height:150px;margin:auto}.modal-jam .jam-share>div:last-child{align-items:center;text-align:center}.modal-jam .modal-actions{bottom:-20px;margin:12px -18px -20px;padding:12px 18px calc(16px + env(safe-area-inset-bottom))}.modal-audio-output{width:100%;max-height:92dvh;border-radius:14px 14px 0 0}.audio-output-dialog{max-height:92dvh}.audio-output-head{grid-template-columns:42px minmax(0,1fr) 36px;padding:19px 18px 15px}.audio-output-head-icon{width:42px;height:42px}.audio-output-list{padding:10px}.now-playing-panel{padding:0!important}}

/* Artist metadata enrichment */
.artist-about-section{margin:32px 0 8px}.artist-about-section>h2{margin:0 0 14px;font-size:24px}.artist-about-card{display:grid;grid-template-columns:minmax(160px,220px) minmax(0,1fr);gap:22px;padding:18px;background:#181818;border-radius:10px;overflow:hidden}.artist-about-image{aspect-ratio:1/1;border-radius:8px;overflow:hidden;background:#282828}.artist-about-image img{width:100%;height:100%;object-fit:cover}.artist-about-copy{min-width:0;align-self:center}.artist-about-copy h3{margin:0 0 8px;font-size:22px}.artist-about-copy p{color:#b3b3b3;line-height:1.55;margin:8px 0}.artist-about-facts{font-size:13px;font-weight:700;color:#dedede!important;text-transform:capitalize}.artist-about-source{display:inline-block;margin-top:8px;color:#fff;font-weight:700;text-decoration:none}.artist-about-source:hover{text-decoration:underline}@media(max-width:700px){.artist-about-card{grid-template-columns:96px minmax(0,1fr);gap:14px;padding:14px}.artist-about-copy h3{font-size:18px}.artist-about-copy p{font-size:13px}.artist-about-image{align-self:start}}

/* 1.8.8 dark modal controls: avoid browser-default light buttons in dark surfaces. */
.modal button:not(.primary):not(.save):not(.danger):not(.dialog-danger):not(.modal-icon-close):not(.audio-output-row):not(.ai-dj-create):not(.round-play):not(.card-play){background:#242424;color:#fff;border:1px solid #535353;border-radius:999px;cursor:pointer}
.modal button:not(.primary):not(.save):not(.danger):not(.dialog-danger):not(.modal-icon-close):not(.audio-output-row):not(.ai-dj-create):not(.round-play):not(.card-play):hover{background:#333;border-color:#858585}
.modal button:disabled{opacity:.5}


/* Devices + Now Playing polish */
.devices-body{padding-bottom:10px}.devices-group{margin:0 4px 8px;padding:6px;background:#1b1b1b;border:1px solid rgba(255,255,255,.055);border-radius:10px}.devices-section-head{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 8px 5px}.devices-section-head>div{min-width:0;display:grid;gap:2px}.devices-section-head strong{font-size:12px;color:#fff}.devices-section-head small{font-size:10px;color:#999;font-weight:500}.devices-local-badge{flex:0 0 auto;padding:3px 6px;border-radius:999px;background:#292929;color:#9f9f9f;font-size:8px;font-weight:900;letter-spacing:.11em}.browser-output-list{display:grid;gap:2px}.browser-output-row{width:100%;display:grid;grid-template-columns:42px minmax(0,1fr) 30px;align-items:center;gap:10px;min-height:58px;padding:8px;border:0;border-radius:7px;background:transparent;color:#fff;text-align:left;cursor:pointer}.browser-output-row:hover{background:#303030}.browser-output-row.selected{background:rgba(30,215,96,.075)}.browser-output-icon{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#333;color:#d6d6d6}.browser-output-row.selected .browser-output-icon{background:#1ed760;color:#000}.browser-output-icon .icon{width:19px;height:19px}.browser-output-tail{width:28px;height:28px;display:grid;place-items:center;color:#1ed760}.browser-output-tail .icon{width:19px;height:19px}.browser-output-note{margin:6px 9px 7px;color:#858585;font-size:9.5px;line-height:1.4}.browser-output-unavailable{display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px;align-items:center;padding:10px;color:#b3b3b3}.browser-output-unavailable>.icon{width:19px;height:19px}.browser-output-unavailable span{display:grid;gap:2px}.browser-output-unavailable strong{font-size:11px;color:#ddd}.browser-output-unavailable small{font-size:10px;line-height:1.35;color:#8f8f8f}

.now-panel-head{min-height:56px!important}.now-panel-head>div{display:grid;gap:1px;min-width:0}.now-panel-head small{font-size:8px;font-weight:900;letter-spacing:.14em;color:#777}.now-panel-head h3{font-size:14px!important}.now-panel-scroll{padding:10px 10px 18px!important;gap:10px!important}.now-panel-current-card{padding:8px 8px 10px;background:#181818;border-radius:10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.035);overflow:hidden}.now-panel-current-card .now-panel-cover{border-radius:7px!important;box-shadow:0 12px 34px rgba(0,0,0,.34)}.now-panel-context-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 3px 4px}.now-panel-context-row>span{min-width:0;display:grid;gap:1px}.now-panel-context-row small{font-size:9px;color:#888}.now-panel-context-row #nowPanelAlbum{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;color:#bcbcbc;font-size:10.5px;font-weight:700}.now-panel-context-row #nowPanelAlbum:hover{color:#fff;text-decoration:underline}.now-panel-context-row #nowPanelAlbum:disabled{color:#777;cursor:default;text-decoration:none}.now-panel-context-row #nowPanelCurrentMore{width:34px;height:34px;flex:0 0 34px;border:0;background:transparent;color:#a7a7a7;border-radius:50%;display:grid;place-items:center;cursor:pointer}.now-panel-context-row #nowPanelCurrentMore:hover{color:#fff;background:#2a2a2a}.now-panel-context-row #nowPanelCurrentMore .icon{width:18px;height:18px}.now-panel-track-row{padding:4px 2px 0!important}.now-panel-track-copy strong{font-size:18px!important}.now-panel-card{background:#1a1a1a!important;border:1px solid rgba(255,255,255,.035)!important}.now-panel-card-head{min-height:48px!important}.now-panel-card-head>div{display:grid;gap:1px}.now-panel-card-head small{font-size:8px;color:#7d7d7d;letter-spacing:.11em;font-weight:900}.now-panel-card-head h4{font-size:13px!important}.now-panel-artist-section{background:#1b1b1b!important}.now-panel-artist-image{aspect-ratio:16/8.5!important}.now-panel-next-card{background:#181818!important}.now-panel-next{padding:0 7px 8px!important}.now-panel-next-row{grid-template-columns:46px minmax(0,1fr) 30px!important;min-height:62px;padding:8px!important;border-radius:7px!important}.now-panel-next-row.primary{background:#242424!important}.now-panel-next-row.primary:hover{background:#303030!important}.now-panel-next-row .mini-cover{width:46px!important;height:46px!important}.now-panel-next-copy{gap:1px}.now-panel-next-eyebrow{font-size:8px!important;line-height:1.2;color:#1ed760!important;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.now-panel-next-copy strong{font-size:12px!important}.now-panel-next-copy small:not(.now-panel-next-eyebrow){font-size:10px!important;color:#9a9a9a}.now-panel-next-tail{width:28px;height:28px;display:grid;place-items:center;color:#b3b3b3}.now-panel-next-tail .icon{width:15px;height:15px}.now-panel-next-row:hover .now-panel-next-tail{color:#fff}.now-panel-more-count{width:100%;border:0;background:transparent!important;text-align:left;color:#8f8f8f!important;font-size:9.5px!important;padding:8px 9px!important;border-radius:6px;cursor:pointer}.now-panel-more-count:hover{background:#252525!important;color:#fff!important}.now-panel-actions-card{grid-template-columns:repeat(3,minmax(0,1fr))!important;background:#181818!important}.now-panel-actions-card #nowPanelDevices{grid-column:auto!important}.now-panel-actions-card button{min-height:54px!important;flex-direction:column;justify-content:center;gap:5px!important;padding:7px 5px!important;font-size:9.5px!important;background:transparent!important}.now-panel-actions-card button:hover{background:#282828!important}.now-panel-actions-card button .icon{width:18px;height:18px}
.player-extra{gap:3px}.player-extra #volume{max-width:104px}
@media(max-width:820px){.devices-group{margin-inline:1px}.devices-section-head{padding-inline:10px}.browser-output-row{min-height:64px;grid-template-columns:48px minmax(0,1fr) 34px;padding:8px 10px}.browser-output-icon{width:46px;height:46px}.browser-output-note{font-size:10px;margin:7px 10px 9px}}
@media(min-width:821px) and (max-width:1050px){.now-panel-current-card{padding:7px}.now-panel-actions-card button{font-size:9px!important}.now-panel-track-copy strong{font-size:16px!important}}
/* Keep the Library search control from shrinking inside the flex sidebar. */
.library-search-wrap{min-height:38px!important;flex:0 0 38px}
/* Keep Now Playing cards at their content height; the panel itself scrolls instead of compressing cards. */
.now-panel-scroll>*{flex:0 0 auto;min-width:0}
.now-panel-scroll{overflow-x:hidden!important}

/* 1.9.0 account identity */
.account-inline-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end;margin-top:14px}.account-inline-form label{min-width:0}.account-inline-form input{width:100%}.account-inline-form .save{min-height:42px;white-space:nowrap}@media(max-width:620px){.account-inline-form{grid-template-columns:1fr}.account-inline-form .save{width:100%}}

/* 1.9.1 — responsive administration surfaces */
@media (max-width:900px){
  .admin-page{max-width:none;padding-bottom:calc(34px + env(safe-area-inset-bottom))}
  .admin-title{padding-top:4px;gap:12px}.admin-title h1{font-size:clamp(30px,7vw,38px)}
  .admin-tabs{overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding-inline:10px}
  .admin-tabs button{scroll-snap-align:start;flex:0 0 auto}
  .admin-body{gap:14px}.admin-card{min-width:0}.admin-form-grid{grid-template-columns:1fr}
  .setting-toggles,.realtime-diagnostics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  .admin-title{padding-bottom:14px}.admin-title p{font-size:13px;line-height:1.45}.admin-role-badge{max-width:100%;overflow:hidden;text-overflow:ellipsis}
  .admin-tabs{top:calc(-14px - env(safe-area-inset-top));margin-inline:-14px;margin-bottom:14px;background:#121212;border-bottom-color:#242424}
  .admin-tabs button{min-height:44px;padding-inline:12px}
  .admin-stats,.setting-toggles,.realtime-diagnostics-grid,.role-grid{grid-template-columns:1fr}
  .admin-stat{padding:14px}.admin-stat strong{font-size:27px}
  .admin-card{padding:13px;border-radius:9px}.admin-card-head{gap:10px;margin-bottom:13px}.admin-card-head h2{font-size:18px}
  .admin-card-head>.admin-primary,.admin-card-head>.admin-actions{width:100%}.admin-card-head>.admin-actions{display:grid;grid-template-columns:1fr;gap:7px}
  .admin-card-head>.admin-actions button,.admin-card-head>.admin-actions .admin-primary{width:100%;min-height:42px;margin:0}
  .audit-filter{gap:7px}.audit-filter button{min-height:42px}
  .admin-table-wrap{overflow:visible;border:0;margin:0;background:transparent}
  .admin-table{display:block;width:100%;min-width:0!important}.admin-table thead{display:none}.admin-table tbody{display:grid;gap:9px;width:100%}
  .admin-table tr{display:grid;width:100%;padding:9px 10px;background:#202020;border:1px solid #303030;border-radius:9px;overflow:hidden}
  .admin-table td{display:grid;grid-template-columns:minmax(88px,34%) minmax(0,1fr);align-items:start;gap:10px;width:100%;height:auto!important;min-width:0;padding:7px 2px;border:0!important;white-space:normal;text-align:left!important;overflow-wrap:anywhere}
  .admin-table td[data-label]::before{content:attr(data-label);color:#8f8f8f;font-size:10px;line-height:1.5;font-weight:800;letter-spacing:.055em;text-transform:uppercase}
  .admin-table td:not([data-label]){display:flex;justify-content:flex-end;gap:7px;padding-top:9px;border-top:1px solid #303030!important}
  .admin-table td:not([data-label]):empty{display:none}.admin-table tbody tr:hover{background:#222}
  .admin-table .admin-user{min-width:0}.admin-table .admin-actions{white-space:normal}.admin-table .admin-actions button{min-height:38px;margin:2px 0 2px 5px}
  .admin-table td small{max-width:none}.admin-table code{max-width:100%;overflow-wrap:anywhere;white-space:normal}
  .permission-option{align-items:flex-start}.permission-option span{min-width:0}.permission-option code{overflow-wrap:anywhere}
  .update-version-grid,.update-status-grid{grid-template-columns:1fr!important}.update-stage-actions{display:grid!important;grid-template-columns:1fr;width:100%}.update-stage-actions>button{width:100%;margin:0!important}
}
@media (max-width:430px){
  .admin-page{font-size:13px}.admin-title h1{font-size:29px}.admin-tabs button span{font-size:12px}.admin-tabs button{padding-inline:10px}
  .admin-table td{grid-template-columns:78px minmax(0,1fr);gap:8px}.admin-card{padding:11px}.admin-stat{padding:12px}
}

/* 1.10.2 realtime: DOM deltas own scroll continuity; disable browser anchor counter-adjustments. */
.content,#playlistNav,.queue-scroll,.now-panel-scroll,.devices-body{overflow-anchor:none}
.device-row.connecting{opacity:.92}
.device-row.connecting .device-transfer-spinner{animation:device-transfer-spin .8s linear infinite}
@keyframes device-transfer-spin{to{transform:rotate(360deg)}}

/* 1.10.8 — dark controls, responsive administration, artwork resilience. */
:root{--control-h:42px;--control-bg:#242424;--control-bg-hover:#303030;--control-border:#4b4b4b;--control-focus:#fff}
button{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}
button:disabled{opacity:.48;cursor:not-allowed!important;transform:none!important}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea{
  color-scheme:dark;background:var(--control-bg);color:#fff;border:1px solid var(--control-border);border-radius:6px;
  min-height:var(--control-h);padding:9px 11px;font:inherit;line-height:1.25;vertical-align:middle;
}
textarea{min-height:96px;resize:vertical}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover,select:hover,textarea:hover{border-color:#707070}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,select:focus,textarea:focus{outline:2px solid var(--control-focus);outline-offset:1px;border-color:#fff}
input::placeholder,textarea::placeholder{color:#8b8b8b;opacity:1}
input[type="file"]{padding:5px 7px}
input[type="file"]::file-selector-button{height:30px;margin-right:9px;border:0;border-radius:999px;padding:0 12px;background:#383838;color:#fff;font-weight:700;cursor:pointer}
input[type="file"]::file-selector-button:hover{background:#464646}
.top-search{background:#242424;color:#fff;border:1px solid #424242}.top-search:focus-within{border-color:#fff;box-shadow:0 0 0 1px #fff}.top-search input{background:transparent!important;color:#fff!important;border:0!important;min-height:0!important;padding:0!important;outline:0!important}.top-search input::placeholder{color:#a7a7a7}
.admin-primary,.modal-actions .save{background:var(--accent)!important;color:#06150b!important;border:0!important;min-height:var(--control-h);box-shadow:none!important}.admin-primary:hover,.modal-actions .save:hover{background:#2be473!important;transform:none!important}
.secondary-btn,.admin-secondary,.admin-actions button,.role-card-top button,.modal-actions button:not(.save):not(.danger),.spotify-action-btn{background:#242424;border:1px solid #4b4b4b;color:#fff}.secondary-btn:hover,.admin-secondary:hover,.admin-actions button:hover,.role-card-top button:hover,.modal-actions button:not(.save):not(.danger):hover{background:#303030;border-color:#777}
.modal-actions .danger,.danger-text{background:#2a1a1a!important;border:1px solid #6b3535!important;color:#ff9a95!important}.modal-actions .danger:hover,.danger-text:hover{background:#382020!important;border-color:#a64c4c!important}
.admin-form input:not([type=checkbox]),.admin-form select,.admin-form textarea{margin-top:6px;min-height:var(--control-h);background:var(--control-bg);border-color:var(--control-border)}
.admin-form label>small{display:block;margin-top:5px;line-height:1.4}
.spotify-test-row,.audit-filter,.metadata-filter,.update-upload{align-items:center}.spotify-test-row button,.audit-filter button,.metadata-filter button,.update-upload button{min-height:var(--control-h)}

/* Administration navigation behaves like a compact responsive control bar. */
.admin-tabs{gap:5px;padding:5px;margin-bottom:18px;border:1px solid #292929;border-radius:11px;background:#171717;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-padding-inline:8px}
.admin-tabs::-webkit-scrollbar{display:none}.admin-tabs button{flex:0 0 auto;min-height:40px;border:0!important;border-radius:8px;padding:8px 12px;color:#aaa;background:transparent;transition:background .12s,color .12s}.admin-tabs button:hover{background:#242424;color:#fff}.admin-tabs button.active{background:#303030;color:#fff;box-shadow:inset 0 0 0 1px #444}.admin-tabs button.active .icon{color:var(--accent)}
@media(min-width:1180px){.admin-tabs{flex-wrap:wrap;overflow:visible}.admin-tabs button{flex:1 1 auto}}
@media(max-width:820px){.admin-tabs{border-radius:0;border-left:0;border-right:0;padding:7px 10px;margin-inline:-14px}.admin-tabs button{min-height:42px;padding-inline:11px}.admin-tabs button span{font-size:12px}.admin-actions{display:flex!important;gap:6px;flex-wrap:wrap;justify-content:flex-start!important}.admin-actions button{margin:0!important;flex:1 1 120px}.admin-card-head{align-items:stretch}.admin-card-head>.admin-primary,.admin-card-head>.admin-actions{width:100%}}
@media(max-width:480px){.admin-tabs button{padding-inline:10px}.admin-tabs button .icon{width:16px;height:16px}.admin-title h1{font-size:27px}}

/* Track metadata management. */
.metadata-filter{display:grid;grid-template-columns:minmax(220px,1fr) minmax(160px,220px) auto;gap:8px;margin:0 0 16px}.metadata-filter>*{min-width:0;height:var(--control-h)}
.metadata-track-cell{display:flex;align-items:center;gap:10px;min-width:220px}.metadata-track-cell>span:last-child{display:grid;gap:2px;min-width:0}.metadata-track-cell strong,.metadata-track-cell small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.metadata-issue-list{display:flex;flex-wrap:wrap;gap:4px;max-width:230px}.metadata-issue-list span{display:inline-flex;padding:4px 7px;border-radius:999px;background:#332828;color:#ffb0aa;font-size:10px;font-weight:700}.metadata-issue-list span.ok{background:rgba(30,215,96,.12);color:#79e69a}.metadata-admin-table a{color:#b3b3b3}.metadata-admin-table a:hover{color:#fff}
@media(max-width:820px){.metadata-filter{grid-template-columns:1fr}.metadata-filter>*{width:100%}.metadata-track-cell{min-width:0}.metadata-issue-list{max-width:none}}

/* User-library reset controls. */
.cleanup-all,.cleanup-option{display:flex!important;align-items:flex-start;gap:11px;border:1px solid #3a3a3a;background:#202020;border-radius:9px;padding:12px!important;margin:0!important;cursor:pointer}.cleanup-all{margin:14px 0 10px!important;background:#242424}.cleanup-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.cleanup-all input,.cleanup-option input{margin:2px 0 0!important;accent-color:var(--accent);flex:0 0 auto}.cleanup-all span,.cleanup-option span{display:grid;gap:3px}.cleanup-all small,.cleanup-option small{color:var(--muted);font-weight:400;line-height:1.35}@media(max-width:560px){.cleanup-grid{grid-template-columns:1fr}}

/* Failed artwork is replaced by a stable themed placeholder, never a browser broken-image glyph. */
.card-cover>.cover-icon,.mini-cover>.cover-icon,.player-cover>.cover-icon,.now-panel-cover>.cover-icon,.hero-art>.cover-icon,.playlist-cover-collage>.cover-icon{width:42%;height:42%;color:#777;margin:auto}
.now-panel-artist-card.realtime-loading{opacity:1}.now-panel-artist-card.realtime-loading .now-panel-artist-copy>span{color:var(--muted)}
/* 1.10.8 — remove remaining light button surfaces and align action controls. */
.admin-card-head>.admin-primary,.admin-actions .admin-primary{min-height:var(--control-h)!important;height:auto!important;padding:9px 15px!important}
.library-filter-chips button.active,.library-page-chips button.active{background:#353535;color:#fff;box-shadow:inset 0 0 0 1px #555}
.playlist-bulk-bar button{background:var(--accent);color:#06150b;border:0;min-height:38px}.playlist-bulk-bar button:hover{background:#2be473}.playlist-bulk-bar button.secondary{background:#303030;color:#fff;border:1px solid #4b4b4b}.playlist-bulk-bar button.secondary:hover{background:#3b3b3b}
.account-card button,.security-verify-dialog button,.two-factor-dialog button,.recovery-dialog button{background:#2b2b2b;color:#fff;border:1px solid #4b4b4b;box-shadow:none}.account-card button:hover,.security-verify-dialog button:hover,.two-factor-dialog button:hover,.recovery-dialog button:hover{background:#353535;border-color:#737373;transform:none}.account-inline-form .save,.spotify-connect-btn{background:var(--accent)!important;color:#06150b!important;border:0!important}.account-inline-form .save:hover,.spotify-connect-btn:hover{background:#2be473!important}
.account-inline-form{align-items:end}.account-inline-form input,.account-inline-form button{min-height:var(--control-h)}
/* 1.10.9 — paged Spotify import progress. */
.spotify-import-progress{display:flex;flex-direction:column;gap:8px;margin:14px 0;color:#b3b3b3;font-size:11px}.spotify-import-progress strong{color:#fff}.spotify-import-progress-track{height:5px;border-radius:999px;background:#2b2b2b;overflow:hidden}.spotify-import-progress-track>span{display:block;height:100%;border-radius:inherit;background:var(--sp-green);transition:width .16s linear}.spotify-preview .spotify-match-list>.muted{padding:14px 2px}
/* Localized authentication language selector */
.auth-brand-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.auth-language{display:flex;align-items:center;gap:8px;color:var(--muted,#b3b3b3);font-size:12px}.auth-language select{min-width:112px;height:36px;margin:0;padding:0 30px 0 10px;border:1px solid #4a4a4a;border-radius:999px;background:#242424;color:#fff;color-scheme:dark}.auth-language span{white-space:nowrap}@media(max-width:520px){.auth-brand-row{align-items:flex-start;flex-direction:column}.auth-language{width:100%;justify-content:space-between}.auth-language select{min-width:130px}}

/* 1.10.11 — refined Spotify-style authentication */
.auth-shell{min-height:100dvh;display:grid;place-items:center;overflow:auto;padding:max(28px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:radial-gradient(1000px 620px at 50% -12%,rgba(30,215,96,.19),transparent 60%),radial-gradient(720px 420px at 8% 100%,rgba(30,215,96,.06),transparent 68%),linear-gradient(180deg,#171717 0,#080808 52%,#000 100%)}
.auth-card{width:min(840px,100%);padding:0;overflow:hidden;border-radius:22px;background:linear-gradient(180deg,rgba(24,24,24,.98),rgba(16,16,16,.98));border:1px solid rgba(255,255,255,.09);box-shadow:0 28px 90px rgba(0,0,0,.64),inset 0 1px rgba(255,255,255,.025)}
.auth-card-head{min-height:78px;padding:20px 26px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid rgba(255,255,255,.065)}
.auth-brand{justify-content:flex-start;margin:0;padding:0;font-size:20px}.auth-brand .brand-mark{width:36px;height:36px;box-shadow:0 8px 24px rgba(0,0,0,.32)}
.auth-language{display:flex;align-items:center;gap:9px;color:#a7a7a7;font-size:11px;font-weight:750;letter-spacing:.02em}.auth-language select{height:36px;min-width:112px;padding:0 34px 0 11px;border:1px solid #404040;border-radius:999px;background:#202020;color:#fff;cursor:pointer}.auth-language select:hover{border-color:#777}.auth-language select:focus{border-color:#fff;outline:none;box-shadow:0 0 0 1px #fff}
.auth-intro{padding:34px 34px 8px;text-align:center}.auth-card .auth-intro h1{max-width:660px;margin:0 auto;font-size:clamp(30px,4vw,44px);line-height:1.02;letter-spacing:-1.6px;text-wrap:balance}
.auth-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:0;padding:24px 34px 36px;transition:grid-template-columns .18s ease}.auth-body.register-mode,.auth-body.two-factor-mode{grid-template-columns:minmax(0,440px);justify-content:center}
.auth-primary{min-width:0;padding:0 34px 0 0}.auth-body.register-mode .auth-primary,.auth-body.two-factor-mode .auth-primary{padding-right:0;width:100%}
.auth-side{min-width:0;padding-left:34px;border-left:1px solid rgba(255,255,255,.08);display:flex;align-items:center}.auth-side.hidden{display:none!important}
.auth-tabs{margin:0 0 24px;padding:4px;gap:4px;background:#0f0f0f;border:1px solid #292929;border-radius:999px}.auth-tabs button{min-height:42px;padding:0 14px;color:#b3b3b3;font-weight:750;transition:background .15s,color .15s,box-shadow .15s}.auth-tabs button:hover{color:#fff}.auth-tabs button.active{background:#2b2b2b;color:#fff;box-shadow:inset 0 1px rgba(255,255,255,.05)}
.auth-form{gap:0}.auth-form label:not(.auth-remember){display:grid;gap:7px;margin-bottom:17px;color:#f1f1f1;font-size:12px;font-weight:750}.auth-form input:not([type=checkbox]){height:50px;min-height:50px;margin:0;padding:0 14px;border:1px solid #4b4b4b;border-radius:7px;background:#171717;color:#fff;transition:border-color .15s,background .15s,box-shadow .15s}.auth-form input:not([type=checkbox]):hover{border-color:#858585;background:#1c1c1c}.auth-form input:not([type=checkbox]):focus{border-color:#fff;background:#202020;outline:none;box-shadow:0 0 0 1px #fff}
.auth-remember{display:flex!important;align-items:center;gap:10px;width:max-content;max-width:100%;margin:1px 0 20px;color:#d4d4d4!important;font-size:12px!important;cursor:pointer}.auth-remember input{margin:0!important;accent-color:var(--accent)}
.auth-form .primary{min-height:50px;width:100%;margin-top:0;border-radius:999px;font-size:14px;transition:transform .12s,filter .12s}.auth-form .primary:hover{transform:scale(1.012);filter:brightness(1.04)}.auth-form .primary:active{transform:scale(.994)}
.auth-two-factor h2{margin:0 0 8px;font-size:24px}.auth-two-factor .auth-sub{margin:0 0 22px;text-align:left}.auth-link{min-height:38px;border:0;background:transparent;color:#fff;text-decoration:underline;text-underline-offset:3px;cursor:pointer;font-size:12px;font-weight:700}
.auth-error{min-height:20px;margin:14px 2px 0;text-align:left;color:#ff9ca4;font-size:12px;line-height:1.4}
.auth-side .auth-divider{display:none}.auth-qr-panel{width:100%;display:flex;flex-direction:column;align-items:center;gap:14px;padding:0;border:0;background:transparent;text-align:center}.auth-qr-code{width:164px;height:164px;padding:8px;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.35)}.auth-qr-copy{align-items:center;gap:7px}.auth-qr-copy strong{font-size:16px}.auth-qr-copy span{max-width:240px;font-size:11px;line-height:1.45;color:#b3b3b3}.auth-qr-copy small{max-width:235px;font-size:10px;line-height:1.45;color:#7e7e7e}.auth-qr-panel>.auth-link{margin-top:-3px}.auth-qr-panel.approval-pending .auth-qr-code{width:120px;height:120px}
@media(max-width:760px){.auth-shell{align-items:start;padding:0;background:#121212}.auth-card{width:100%;min-height:100dvh;border:0;border-radius:0;box-shadow:none;background:linear-gradient(180deg,#171717,#101010 55%,#0b0b0b)}.auth-card-head{padding:18px max(20px,env(safe-area-inset-right)) 18px max(20px,env(safe-area-inset-left));min-height:72px}.auth-language>span{display:none}.auth-language select{min-width:104px}.auth-intro{padding:28px 22px 5px}.auth-card .auth-intro h1{font-size:clamp(29px,9vw,39px)}.auth-body,.auth-body.register-mode,.auth-body.two-factor-mode{display:block;padding:24px max(22px,env(safe-area-inset-right)) max(34px,env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left))}.auth-primary,.auth-body.register-mode .auth-primary,.auth-body.two-factor-mode .auth-primary{padding:0;max-width:480px;margin:0 auto}.auth-side{max-width:480px;margin:30px auto 0;padding:27px 0 0;border-left:0;border-top:1px solid #2a2a2a}.auth-side .auth-divider{display:flex;margin:-37px auto 20px;width:70px;background:#111;padding:0 10px}.auth-qr-panel{display:grid;grid-template-columns:108px minmax(0,1fr);gap:16px;text-align:left;align-items:center}.auth-qr-code{width:108px;height:108px;border-radius:9px}.auth-qr-copy{align-items:flex-start}.auth-qr-copy span,.auth-qr-copy small{max-width:none}.auth-qr-panel>.auth-link{grid-column:1/-1;justify-self:center}.auth-error{text-align:center}}
@media(max-width:420px){.auth-card-head{padding-left:16px;padding-right:16px}.auth-brand{font-size:18px}.auth-brand .brand-mark{width:32px;height:32px}.auth-language select{min-width:96px}.auth-body,.auth-body.register-mode,.auth-body.two-factor-mode{padding-left:18px;padding-right:18px}.auth-qr-panel{grid-template-columns:92px minmax(0,1fr);gap:13px}.auth-qr-code{width:92px;height:92px}}

/* 1.10.12 — Spotify-fidelity localization and translation-safe sizing. */
:root{--translated-control-min:42px}
:where(button,.primary,.secondary-btn,.admin-primary,.admin-secondary,.spotify-action-btn,.auth-link){max-width:100%;min-width:0}
:where(.modal-actions,.admin-card-head,.admin-actions,.role-card-top,.playlist-toolbar,.playlist-bulk-bar,.account-card-head,.account-inline-form,.spotify-import-row,.spotify-import-actions,.ai-dj-actions,.jam-head){min-width:0}
:where(.modal label,.admin-form label,.account-card label,.security-setting,.setting-toggle,.permission-option,.cleanup-option,.cleanup-all){min-width:0;overflow-wrap:anywhere}

/* Action rows may grow vertically for French/Spanish instead of clipping labels. */
.modal-actions{flex-wrap:wrap;align-items:center}
.modal-actions button,.admin-actions button,.role-card-top button,.admin-primary,.admin-secondary,.secondary-btn,.spotify-action-btn,.account-card button,.security-setting>button,.playlist-bulk-bar button{
  min-height:var(--translated-control-min);height:auto;line-height:1.2;white-space:normal;overflow-wrap:anywhere;text-align:center
}
.modal-actions button{flex:0 1 auto;max-width:100%}
.admin-card-head{flex-wrap:wrap}.admin-card-head>div{min-width:0;flex:1 1 260px}.admin-card-head>.admin-primary,.admin-card-head>.admin-actions{flex:0 1 auto}
.admin-actions{white-space:normal;display:flex;justify-content:flex-end;align-items:center;gap:6px;flex-wrap:wrap}.admin-actions button{margin-left:0!important}
.role-card-top{align-items:flex-start;flex-wrap:wrap}.role-card-top>div{min-width:0;flex:1 1 180px}

/* Spotify-like filter/action surfaces stay compact but can scroll/wrap instead of truncating translated copy. */
.library-filter-chips,.library-page-chips{scroll-padding-inline:8px}.library-filter-chips button,.library-page-chips button{flex:0 0 auto;max-width:none;white-space:nowrap}
.playlist-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.playlist-toolbar .spotify-action-btn{flex:0 1 auto}.playlist-filter-search{min-width:min(240px,100%);flex:1 1 240px}.playlist-sort-select{flex:0 1 auto;max-width:100%}
.playlist-bulk-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.playlist-bulk-bar strong{min-width:0;overflow-wrap:anywhere}.playlist-bulk-bar button{flex:0 1 auto}

/* Context menus should expand to the localized label instead of ellipsizing it. */
.track-context-menu{width:max-content;max-width:min(360px,calc(100vw - 16px))}
.track-context-menu button,.track-context-menu a{width:100%;max-width:100%;height:auto;min-height:41px;align-items:center}
.track-context-menu button span,.track-context-menu a span{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:1.25}

/* Narrow Now Playing action cards must not hide terms such as “File d’attente de lecture”. */
.now-panel-actions-card button{height:auto;min-height:44px;line-height:1.15}
.now-panel-actions-card button span{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;text-align:center}

/* Login/register tabs remain balanced even when translations are longer. */
.auth-tabs button{min-width:0;height:auto;min-height:42px;white-space:normal;line-height:1.15;overflow-wrap:anywhere;padding-block:9px}
.auth-language{min-width:0}.auth-language>span{min-width:0}.auth-language select{max-width:min(190px,45vw)}

/* Native form controls and text stay aligned at every language length. */
:where(.modal,.admin-form,.account-card,.auth-form) :where(input:not([type=checkbox]):not([type=radio]),select,textarea){min-width:0;max-width:100%}
:where(.modal,.admin-form,.account-card) select{overflow:hidden;text-overflow:ellipsis}
.app-dialog-copy h2,.app-dialog-copy p,.app-dialog-copy small,.admin-title h1,.admin-title p,.admin-card-head h2,.admin-card-head p{overflow-wrap:anywhere}

/* French/Spanish frequently need a little more inline room in compact utility buttons. */
:lang(fr) .spotify-action-btn,:lang(es) .spotify-action-btn,:lang(fr) .admin-actions button,:lang(es) .admin-actions button{padding-inline:12px}

@media(max-width:700px){
  .modal-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr));width:100%}
  .modal-actions button{width:100%;justify-content:center}
  .admin-card-head>.admin-primary,.admin-card-head>.admin-actions{width:100%}
  .admin-actions{justify-content:stretch}.admin-actions button{flex:1 1 min(160px,100%)}
  .playlist-toolbar{gap:6px}.playlist-toolbar .spotify-action-btn{flex:1 1 auto}.playlist-filter-search{order:20;flex-basis:100%}
  .playlist-bulk-bar button{flex:1 1 min(150px,100%)}
}
@media(max-width:420px){
  .auth-tabs{border-radius:18px}.auth-tabs button{padding-inline:9px;font-size:12px}
  .track-context-menu{max-width:calc(100vw - 12px)}
}
.account-inline-form .save{white-space:normal!important;height:auto!important;line-height:1.2;overflow-wrap:anywhere}
.spotify-import-row>.spotify-action-btn{min-width:0;max-width:min(190px,42vw)}
@media(max-width:520px){.spotify-import-row>.spotify-action-btn{max-width:38vw;padding-inline:10px}}

/* 1.10.13 — official Spotify terminology expansion and locale-resilient compact surfaces. */
:where(.section-head,.action-row,.queue-head,.queue-head-actions,.queue-tools,.queue-bulk-bar,.devices-section-head,.top-actions){min-width:0}
.section-head,.action-row{flex-wrap:wrap}.section-head>*,.action-row>*{min-width:0}

/* Popovers size to localized labels while staying inside the viewport. */
.popover{width:max-content;min-width:170px;max-width:min(330px,calc(100vw - 16px))}
.popover button{min-width:0;height:auto;min-height:40px;white-space:normal;line-height:1.2;overflow-wrap:anywhere}
.popover button span{min-width:0;white-space:normal;overflow-wrap:anywhere}

/* Queue terminology is substantially longer in French; keep the heading/actions stable without clipping. */
.queue-head{height:auto!important;min-height:62px;gap:10px;align-items:center}
.queue-head-copy{flex:1 1 100px;min-width:0}.queue-head-copy h3{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:1.08}
.queue-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex:0 1 auto;max-width:70%;min-width:0}
.queue-clear{width:auto!important;min-width:0!important;max-width:100%;height:auto!important;min-height:34px!important;padding:6px 10px!important;border-radius:999px!important;font-size:10px!important;line-height:1.12!important;white-space:normal!important;overflow-wrap:anywhere;text-align:center}
.queue-tools{max-width:100%;scroll-padding-inline:8px}.queue-tools button{height:auto;min-height:38px;line-height:1.12}
.queue-tools button span{min-width:0;white-space:nowrap}
.queue-bulk-bar{flex-wrap:wrap}.queue-bulk-bar span{min-width:0;overflow-wrap:anywhere}.queue-bulk-bar button{height:auto;min-height:36px;line-height:1.15;white-space:normal}

/* Exact Spotify shortcut wording can be long; let the description wrap, never the key chord. */
.shortcut-grid{grid-template-columns:minmax(0,1fr) max-content}.shortcut-grid span{min-width:0;white-space:normal;overflow-wrap:anywhere;line-height:1.3}.shortcut-grid kbd{white-space:nowrap;max-width:100%}

/* Device labels, status chips, and admin actions expand to locale content instead of truncating. */
.devices-section-head>div,.device-copy,.browser-output-row>span{min-width:0}.devices-section-head strong,.devices-section-head small{white-space:normal;overflow-wrap:anywhere}
.admin-primary,.admin-secondary,.admin-actions button,.role-card-top button{max-width:100%;white-space:normal!important;line-height:1.18}
.status-chip,.admin-role-badge,.role-chip{max-width:100%;white-space:normal;line-height:1.15;text-align:center}

/* Compact top actions remain pill-like, but labels may wrap at constrained widths. */
.outline-pill,.user-pill{min-width:0;max-width:100%}.outline-pill{height:auto;min-height:38px;white-space:normal;line-height:1.12;text-align:center}
.top-actions{flex-wrap:wrap;justify-content:flex-end}

/* French and Spanish may need more natural inline room without penalizing English. */
:lang(fr) .queue-head-actions{max-width:74%}
:lang(fr) .popover,:lang(es) .popover{min-width:190px}
:lang(fr) .shortcut-grid,:lang(es) .shortcut-grid{column-gap:14px}

@media(max-width:700px){
  .queue-head{align-items:flex-start}.queue-head-copy{padding-top:3px}.queue-head-actions{max-width:68%}
  .shortcut-grid{grid-template-columns:minmax(0,1fr) max-content;gap:8px 10px}.shortcut-grid kbd{min-width:58px;padding-inline:6px}
  .top-actions{gap:6px}.outline-pill{padding-inline:10px}
}
@media(max-width:430px){
  .queue-head{padding:13px 11px}.queue-head-actions{max-width:66%}.queue-clear{font-size:9px!important;padding-inline:7px!important}
  .popover{max-width:calc(100vw - 12px)}
  .shortcut-grid{grid-template-columns:minmax(0,1fr) minmax(56px,max-content)}
  .admin-actions button,.admin-primary,.admin-secondary{overflow-wrap:anywhere}
}
.queue-tools button{flex:0 0 auto}


/* 1.10.14 — native checkbox sizing with translation-safe spacing.
   Checkboxes keep their browser-native dimensions; layout adapts around them. */
input[type="checkbox"]{
  flex:0 0 auto;
  margin:0;
  padding:0;
  transform:none!important;
  accent-color:var(--accent,var(--sp-green));
}

/* Text-bearing checkbox rows reserve a native-control column and let only text wrap. */
:where(.auth-remember,.account-switch,.compact-toggle,.modal-check,.setting-toggle,.permission-option,.cleanup-all,.cleanup-option,.jam-setting){
  display:grid!important;
  grid-template-columns:max-content minmax(0,1fr);
  align-items:start;
  row-gap:0;
  min-width:0;
}
:where(.auth-remember,.account-switch,.compact-toggle,.modal-check,.setting-toggle,.permission-option,.cleanup-all,.cleanup-option,.jam-setting)>input[type="checkbox"]{
  align-self:start;
  margin-top:.2em!important;
}
:where(.auth-remember,.account-switch,.compact-toggle,.modal-check,.setting-toggle,.permission-option,.cleanup-all,.cleanup-option,.jam-setting)>span{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}

/* Spacing belongs to the row, never to a scaled checkbox. */
.setting-toggle,.cleanup-all,.cleanup-option{column-gap:12px}
.permission-option{column-gap:10px}
.jam-setting{column-gap:12px}
.account-switch,.auth-remember,.compact-toggle,.modal-check{column-gap:9px}

/* A larger label provides the selection hit target while the native checkbox stays untouched. */
.track-select-box{
  width:32px;
  min-width:32px;
  min-height:32px;
  margin-right:0;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.track-select-box input[type="checkbox"]{margin:0!important}

@media(max-width:560px){
  :where(.setting-toggle,.permission-option,.cleanup-all,.cleanup-option,.jam-setting){column-gap:10px}
}

/* 1.10.18 — live track-metadata identification progress. */
.metadata-job-cell{display:grid;gap:5px;min-width:150px;max-width:230px}.metadata-job-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.metadata-job-head .status-chip{font-size:10px;padding:3px 7px;text-transform:capitalize}.metadata-job-head>strong{font-size:11px;font-variant-numeric:tabular-nums;color:#ddd}.metadata-job-mini{height:4px;border-radius:999px;background:#343434;overflow:hidden}.metadata-job-mini>span{display:block;height:100%;border-radius:inherit;background:var(--accent);transition:width .16s linear}.metadata-job-cell>small{display:block;max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.25}.metadata-job-empty{font-size:12px}.metadata-live-list{display:grid;gap:5px;margin-top:9px}.metadata-live-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 9px;border-radius:6px;background:#202020}.metadata-live-row>div{display:grid;gap:2px;min-width:0}.metadata-live-row strong,.metadata-live-row small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metadata-live-row strong{font-size:12px}.metadata-live-row small{font-size:10px;color:var(--muted)}.metadata-live-row>span{flex:0 0 auto;color:#ddd;font-size:11px;font-variant-numeric:tabular-nums}.metadata-progress:not(.hidden){animation:metadata-progress-in .12s ease-out}@keyframes metadata-progress-in{from{opacity:.6;transform:translateY(2px)}to{opacity:1;transform:none}}
@media(max-width:820px){.metadata-job-cell{min-width:0;max-width:none}.metadata-job-cell>small{max-width:none}.metadata-live-row{align-items:flex-start}.metadata-admin-table td[data-label="Activity"]{padding-top:10px;padding-bottom:10px}}


/* Add music sources + YouTube/yt-dlp import. */
.add-music-sheet{display:grid;gap:10px}.add-music-sheet>p{color:var(--muted);margin:0 0 4px}.add-music-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-top:8px}.add-music-options>button{display:flex;align-items:center;gap:13px;min-height:86px;padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--panel3);color:var(--text);text-align:left;cursor:pointer;transition:background .14s,border-color .14s,transform .14s}.add-music-options>button:hover{background:#303030;border-color:#555;transform:translateY(-1px)}.add-music-options>button>svg{width:24px;height:24px;flex:0 0 auto}.add-music-options>button span{display:grid;gap:4px;min-width:0}.add-music-options>button strong{font-size:14px}.add-music-options>button small{font-size:11px;line-height:1.3;color:var(--muted);white-space:normal}
.modal-youtube{width:min(760px,calc(100vw - 40px));max-height:min(88dvh,820px);padding:0;overflow:hidden;background:var(--panel2);border-color:#303030;border-radius:14px}.youtube-import{display:flex;flex-direction:column;min-height:0;max-height:min(88dvh,820px);background:var(--panel2);color:var(--text)}.youtube-import-head{display:grid;grid-template-columns:minmax(0,1fr) 36px;gap:18px;align-items:start;padding:24px 26px 20px;background:linear-gradient(180deg,#242424 0,var(--panel2) 100%);border-bottom:1px solid var(--line)}.youtube-import-title-wrap{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;align-items:start;min-width:0}.youtube-import-mark{width:48px;height:48px;border-radius:10px;display:grid;place-items:center;background:var(--accent);color:#06150b;box-shadow:0 8px 22px rgba(0,0,0,.28)}.youtube-import-mark .icon{width:24px;height:24px}.youtube-import-head .eyebrow{display:block;margin:1px 0 5px;color:var(--accent);font-size:10px;font-weight:800;letter-spacing:1.2px}.youtube-import-head h2{margin:0;font-size:24px;line-height:1.15;letter-spacing:-.45px}.youtube-import-head p{margin:7px 0 0;max-width:600px;color:var(--muted);font-size:12px;line-height:1.5}.youtube-import-close{width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:var(--muted);cursor:pointer}.youtube-import-close:hover{background:rgba(255,255,255,.08);color:var(--text)}.youtube-import-close .icon{width:19px;height:19px}.youtube-import-state{display:flex;flex-direction:column;gap:12px;min-height:0;padding:18px 26px 24px}.youtube-ready{display:flex;align-items:center;gap:10px;min-height:44px;padding:9px 12px;border:1px solid #303030;border-radius:9px;background:var(--panel);color:var(--text)}.youtube-ready-dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(30,215,96,.10)}.youtube-ready>div{display:grid;gap:1px;min-width:0}.youtube-ready strong{font-size:12px}.youtube-ready small{color:var(--muted);font-size:10px;line-height:1.25}.youtube-search-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:stretch}.modal-youtube .youtube-search-field{display:flex;align-items:center;gap:9px;min-width:0;margin:0;padding:0 13px;border:1px solid #555;border-radius:999px;background:var(--panel3);transition:border-color .12s,background .12s,box-shadow .12s}.modal-youtube .youtube-search-field:hover{border-color:#777}.modal-youtube .youtube-search-field:focus-within{border-color:#fff;box-shadow:0 0 0 1px #fff;background:#2b2b2b}.youtube-search-field>.icon{width:18px;height:18px;flex:0 0 auto;color:var(--muted)}.modal-youtube .youtube-search-field input{height:44px;min-width:0;width:100%;padding:0;border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;color:var(--text);font-size:13px}.youtube-search-field input::placeholder{color:#8f8f8f}.modal-youtube .youtube-search-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:112px;min-height:44px;padding:0 18px;border:0;border-radius:999px;background:var(--accent)!important;color:#06150b!important;font-weight:800;cursor:pointer}.youtube-search-button:hover:not(:disabled){background:#2be473!important}.youtube-search-button:disabled{opacity:.7;cursor:default}.youtube-search-button .icon{width:17px;height:17px}.youtube-results{display:flex;flex-direction:column;gap:6px;min-height:176px;max-height:min(52vh,500px);overflow:auto;padding:2px 3px 2px 0;scrollbar-width:thin;scrollbar-color:#4b4b4b transparent;overscroll-behavior:contain}.youtube-results::-webkit-scrollbar{width:9px}.youtube-results::-webkit-scrollbar-thumb{background:#4b4b4b;border:2px solid var(--panel2);border-radius:999px}.youtube-results-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:3px 4px 6px;color:var(--text)}.youtube-results-head strong{font-size:12px}.youtube-results-head small{color:var(--muted);font-size:10px;font-variant-numeric:tabular-nums}.youtube-result{display:grid;grid-template-columns:116px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:82px;padding:8px 10px 8px 8px;border:1px solid transparent;border-radius:9px;background:var(--panel);transition:background .12s,border-color .12s}.youtube-result:hover{background:var(--panel3);border-color:#343434}.youtube-thumb{position:relative;width:116px;aspect-ratio:16/9;border-radius:6px;overflow:hidden;background:#0b0b0b;display:grid;place-items:center;color:#707070;box-shadow:0 4px 14px rgba(0,0,0,.28)}.youtube-thumb>.icon{width:24px;height:24px}.youtube-thumb img{width:100%;height:100%;object-fit:cover}.youtube-thumb>span{position:absolute;right:4px;bottom:4px;padding:2px 5px;border-radius:3px;background:rgba(0,0,0,.88);color:#fff;font-size:9px;font-weight:700;font-variant-numeric:tabular-nums}.youtube-result-copy{display:grid;gap:5px;min-width:0}.youtube-result-copy strong{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:var(--text);font-size:13px;line-height:1.32;white-space:normal}.youtube-result-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:11px}.youtube-add-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:82px;min-height:36px;padding:0 13px;border:1px solid #5d5d5d;border-radius:999px;background:transparent;color:var(--text);font-size:12px;font-weight:750;white-space:nowrap;cursor:pointer;transition:background .12s,border-color .12s,color .12s}.youtube-add-btn:hover:not(:disabled){background:#fff;border-color:#fff;color:#000}.youtube-add-btn.is-loading{background:#2b2b2b;border-color:#555;color:#d0d0d0}.youtube-add-btn.is-queued{background:rgba(30,215,96,.12);border-color:rgba(30,215,96,.55);color:var(--accent)}.youtube-add-btn .icon{width:15px;height:15px}.youtube-inline-state{display:flex;align-items:flex-start;gap:11px;padding:14px;border:1px solid #343434;border-radius:9px;background:var(--panel);color:var(--text)}.youtube-inline-state>.icon,.youtube-inline-state>.loader-dot{flex:0 0 auto;margin-top:1px}.youtube-inline-state>.icon{width:19px;height:19px;color:var(--muted)}.youtube-inline-state>div{display:grid;gap:3px;min-width:0}.youtube-inline-state strong{font-size:12px}.youtube-inline-state small{color:var(--muted);font-size:11px;line-height:1.4;overflow-wrap:anywhere}.youtube-inline-state.is-error{border-color:#593636;background:#241919}.youtube-inline-state.is-error>.icon{color:#ff9a95}.youtube-inline-state.is-error small{color:#d9b2b0}.youtube-searching{margin-top:4px}.youtube-empty-state{min-height:170px;display:flex;align-items:center;justify-content:center;gap:12px;padding:28px 20px;border:1px dashed #383838;border-radius:9px;background:rgba(18,18,18,.55);text-align:left;color:var(--muted)}.youtube-empty-state>.icon{width:26px;height:26px;flex:0 0 auto;color:#777}.youtube-empty-state>div{display:grid;gap:4px;max-width:390px}.youtube-empty-state strong{color:#dedede;font-size:13px}.youtube-empty-state span{font-size:11px;line-height:1.4}.youtube-admin-note{display:flex;align-items:flex-start;gap:9px;padding:0 4px;color:var(--muted);font-size:11px;line-height:1.4}.youtube-admin-note .icon{width:16px;height:16px;flex:0 0 auto}.youtube-button-spinner{width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:youtube-spin .65s linear infinite}@keyframes youtube-spin{to{transform:rotate(360deg)}}.upload-item.processing .upload-progress>i,.upload-item.queued-import .upload-progress>i{transition:width .2s linear}
@media(max-width:820px){.modal-youtube{width:100%;max-height:92dvh;border-radius:16px 16px 0 0}.youtube-import{max-height:92dvh}.youtube-import-head{padding:20px 18px 16px}.youtube-import-state{padding:15px 18px calc(18px + env(safe-area-inset-bottom))}.youtube-import-title-wrap{grid-template-columns:42px minmax(0,1fr);gap:12px}.youtube-import-mark{width:42px;height:42px}.youtube-import-head h2{font-size:22px}.youtube-results{max-height:52dvh}}
@media(max-width:600px){.youtube-search-form{grid-template-columns:1fr}.youtube-search-button{width:100%}.youtube-result{grid-template-columns:96px minmax(0,1fr);gap:10px;padding:8px}.youtube-thumb{width:96px}.youtube-add-btn{grid-column:1/-1;width:100%;min-height:38px}.add-music-options{grid-template-columns:1fr}.youtube-empty-state{min-height:150px}.youtube-import-head p{font-size:11px}}
@media(max-width:390px){.youtube-import-head{grid-template-columns:minmax(0,1fr) 34px;gap:10px;padding-inline:14px}.youtube-import-state{padding-inline:14px}.youtube-import-title-wrap{grid-template-columns:1fr}.youtube-import-mark{display:none}.youtube-result{grid-template-columns:82px minmax(0,1fr)}.youtube-thumb{width:82px}}
.youtube-mode-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:4px;border:1px solid #303030;border-radius:10px;background:#151515}.youtube-mode-tabs button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:0 12px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-size:11px;font-weight:750;cursor:pointer}.youtube-mode-tabs button:hover{background:#232323;color:var(--text)}.youtube-mode-tabs button.active{background:var(--panel3);color:var(--text);box-shadow:0 1px 5px rgba(0,0,0,.25)}.youtube-mode-tabs .icon{width:15px;height:15px}.youtube-spotify-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:2px 3px 5px}.youtube-spotify-head>div{display:grid;gap:3px}.youtube-spotify-head strong{font-size:12px}.youtube-spotify-head small{color:var(--muted);font-size:10px;line-height:1.4}.youtube-spotify-list{display:flex;flex-direction:column;gap:6px;max-height:min(52vh,500px);overflow:auto;padding-right:3px;overscroll-behavior:contain}.youtube-spotify-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:11px;padding:10px 11px;border:1px solid #303030;border-radius:9px;background:var(--panel)}.youtube-spotify-row:hover{background:var(--panel3);border-color:#3b3b3b}.youtube-spotify-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:6px;background:#181818;color:var(--accent)}.youtube-spotify-icon .icon{width:19px;height:19px}.youtube-spotify-row>div{display:grid;gap:3px;min-width:0}.youtube-spotify-row strong,.youtube-spotify-row small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.youtube-spotify-row strong{font-size:12px}.youtube-spotify-row small{font-size:10px;color:var(--muted)}.youtube-inline-action{margin-top:10px;min-height:34px;padding:0 13px;border:1px solid #5d5d5d;border-radius:999px;background:transparent;color:var(--text);font-weight:750;cursor:pointer}.youtube-inline-action:hover{background:#fff;color:#000}.youtube-spotify-progress-copy{display:grid;gap:3px;padding:12px 2px}.youtube-spotify-progress-copy strong{font-size:12px}.youtube-spotify-progress-copy small{color:var(--muted);font-size:10px;line-height:1.45}.youtube-spotify-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.youtube-spotify-summary>div{display:grid;gap:3px;padding:14px;border:1px solid #303030;border-radius:9px;background:var(--panel);text-align:center}.youtube-spotify-summary strong{font-size:21px;line-height:1;color:var(--text);font-variant-numeric:tabular-nums}.youtube-spotify-summary span{font-size:10px;color:var(--muted)}
@media(max-width:600px){.youtube-mode-tabs{grid-template-columns:1fr 1fr}.youtube-mode-tabs button{padding-inline:8px;font-size:10px}.youtube-spotify-row{grid-template-columns:34px minmax(0,1fr)}.youtube-spotify-icon{width:34px;height:34px}.youtube-spotify-row .youtube-add-btn{grid-column:1/-1;width:100%}.youtube-spotify-summary{grid-template-columns:1fr}.youtube-spotify-summary>div{grid-template-columns:auto 1fr;align-items:center;text-align:left}.youtube-spotify-summary strong{font-size:18px}}

/* 1.10.28 — global song ordering, share actions, and Spotify-style full-screen player. */
.top-icon-action{height:40px;max-width:190px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid #555;background:#0d0d0d;color:#e7e7e7;border-radius:999px;padding:0 13px;font-size:12px;font-weight:750;cursor:pointer;white-space:nowrap;transition:background .14s,border-color .14s,transform .14s,color .14s}
.top-icon-action .icon{width:17px;height:17px}.top-icon-action:hover,.top-icon-action[aria-expanded="true"]{background:#242424;border-color:#777;color:#fff}.top-icon-action.active{border-color:rgba(30,215,96,.58);color:#fff}.top-icon-action.active .icon{color:var(--accent)}
.track-share-actions{display:flex;gap:8px;margin:14px 0 18px}.track-share-actions button{min-height:40px;display:inline-flex!important;align-items:center;gap:8px;padding:0 14px!important}.track-share-actions .icon{width:17px;height:17px}
body.fullscreen-player-open{overflow:hidden}
.fullscreen-player{position:fixed;inset:0;z-index:1000;isolation:isolate;overflow:hidden;background:#0a0a0a;color:#fff;outline:none}
.fullscreen-player-backdrop{position:absolute;z-index:-2;inset:-42px;background-position:center;background-size:cover;filter:blur(64px) saturate(1.18);opacity:.46;transform:scale(1.08);transition:background-image .28s ease}
.fullscreen-player::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.33),rgba(8,8,8,.60) 48%,rgba(5,5,5,.88)),radial-gradient(circle at 50% 32%,rgba(255,255,255,.08),transparent 48%);pointer-events:none}
.fullscreen-player-head{height:82px;padding:22px clamp(24px,3vw,54px);display:flex;align-items:center;justify-content:space-between;gap:20px}.fullscreen-player-brand{display:flex;align-items:center;gap:10px;font-size:15px}.fullscreen-player-brand .brand-mark{width:34px;height:34px}.fullscreen-player-head-actions{display:flex;gap:8px}.fullscreen-player-head-actions button,.fullscreen-player-actions button,.fullscreen-transport button{border:0;background:rgba(15,15,15,.46);color:#ddd;cursor:pointer;display:grid;place-items:center;transition:transform .14s,background .14s,color .14s}.fullscreen-player-head-actions button{width:44px;height:44px;border-radius:50%}.fullscreen-player-head-actions button:hover,.fullscreen-player-actions button:hover,.fullscreen-transport button:hover{background:rgba(255,255,255,.14);color:#fff;transform:scale(1.04)}.fullscreen-player-head-actions .icon{width:19px;height:19px}
.fullscreen-player-main{height:calc(100% - 82px);max-width:1180px;margin:0 auto;padding:clamp(12px,2vh,26px) clamp(24px,4vw,64px) clamp(28px,5vh,58px);display:grid;grid-template-rows:minmax(0,1fr) auto auto auto auto;justify-items:center;align-items:center;gap:clamp(13px,2vh,23px)}
.fullscreen-player-cover{width:min(48vh,520px);height:min(48vh,520px);max-width:min(72vw,520px);max-height:min(72vw,520px);aspect-ratio:1;display:grid;place-items:center;overflow:hidden;border-radius:7px;background:linear-gradient(135deg,#343434,#131313);box-shadow:0 30px 90px rgba(0,0,0,.55)}.fullscreen-player-cover img{width:100%;height:100%;object-fit:cover}.fullscreen-player-cover>.icon{width:28%;height:28%;color:#8c8c8c}
.fullscreen-player-meta{width:min(900px,88vw);text-align:center;min-width:0}.fullscreen-player-meta h1{margin:0 0 5px;font-size:clamp(30px,4.2vw,68px);line-height:1.04;letter-spacing:-.035em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fullscreen-player-meta .link-btn{max-width:100%;padding:0;border:0;background:transparent;color:#c9c9c9;font-size:clamp(15px,1.5vw,21px);font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}.fullscreen-player-meta .link-btn:hover{color:#fff;text-decoration:underline}
.fullscreen-seek-row{width:min(880px,86vw);display:grid;grid-template-columns:45px minmax(0,1fr) 45px;align-items:center;gap:12px;color:#c5c5c5;font-size:11px;font-variant-numeric:tabular-nums}.fullscreen-seek-row span:last-child{text-align:right}.fullscreen-seek-row .seek-range{width:100%}
.fullscreen-transport{display:flex;align-items:center;justify-content:center;gap:clamp(14px,2.4vw,32px)}.fullscreen-transport button{width:48px;height:48px;border-radius:50%;background:transparent}.fullscreen-transport button.active{color:var(--accent)}.fullscreen-transport button .icon{width:23px;height:23px}.fullscreen-transport .fullscreen-play-main{width:72px;height:72px;background:#fff;color:#000}.fullscreen-transport .fullscreen-play-main:hover{background:#fff;color:#000;transform:scale(1.06)}.fullscreen-transport .fullscreen-play-main .icon{width:29px;height:29px}
.fullscreen-player-actions{display:flex;justify-content:center;gap:9px}.fullscreen-player-actions button{min-height:42px;border-radius:999px;padding:0 14px;display:inline-flex;align-items:center;gap:7px;background:rgba(15,15,15,.40);border:1px solid rgba(255,255,255,.18)}.fullscreen-player-actions button .icon{width:18px;height:18px}.fullscreen-player-actions .like-btn.active{color:var(--accent);border-color:rgba(30,215,96,.38)}
.fullscreen-player:fullscreen{width:100vw;height:100vh}.fullscreen-player:-webkit-full-screen{width:100vw;height:100vh}
@media(max-width:820px){
  .fullscreen-player-head{height:66px;padding:12px 14px}.fullscreen-player-brand strong{max-width:44vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fullscreen-player-head-actions button{width:40px;height:40px}.fullscreen-player-main{height:calc(100% - 66px);padding:10px 18px calc(22px + env(safe-area-inset-bottom));gap:13px}.fullscreen-player-cover{width:min(50vh,78vw);height:min(50vh,78vw);max-width:78vw;max-height:78vw}.fullscreen-player-meta{width:92vw}.fullscreen-player-meta h1{font-size:clamp(26px,8vw,42px)}.fullscreen-player-meta .link-btn{font-size:16px}.fullscreen-seek-row{width:90vw;grid-template-columns:38px minmax(0,1fr) 38px;gap:8px}.fullscreen-transport{gap:8px;width:94vw;justify-content:space-between}.fullscreen-transport button{width:44px;height:44px}.fullscreen-transport .fullscreen-play-main{width:64px;height:64px}.fullscreen-player-actions button{min-width:44px;padding:0 11px}.fullscreen-player-actions button span{display:none}
}
@media(max-height:650px) and (min-width:821px){.fullscreen-player-head{height:62px;padding-block:12px}.fullscreen-player-main{height:calc(100% - 62px);grid-template-columns:minmax(260px,44vh) minmax(0,1fr);grid-template-rows:auto auto auto auto;column-gap:42px;align-content:center}.fullscreen-player-cover{grid-row:1/5;width:min(44vh,430px);height:min(44vh,430px)}.fullscreen-player-meta,.fullscreen-seek-row{width:min(620px,48vw)}.fullscreen-player-meta{text-align:left}.fullscreen-transport,.fullscreen-player-actions{justify-self:start}}

/* 1.10.30 — offline downloads, touch behavior and hero polish */
img{pointer-events:none!important;-webkit-user-drag:none;user-select:none}
@media (pointer:coarse){button,a,[role="button"],.track-row,.media-card{-webkit-tap-highlight-color:transparent}.mobile-now-playing,#miniNowPlaying,.fullscreen-player-main{touch-action:pan-y}}
.hero-copy{min-width:0;padding-bottom:3px}
.hero-copy h1{line-height:1.06;padding:0 0 .08em;box-sizing:content-box}
.hero-art-shell{position:relative;width:190px;height:190px;flex:0 0 190px;display:block}
.hero-art-shell>.hero-art{width:100%;height:100%;max-width:100%;max-height:100%;flex:none}
.artist-hero-art-shell>.artwork-edit-btn{right:2px;bottom:8px;z-index:3;background:#242424;border:1px solid rgba(255,255,255,.16)}
.track-name{display:flex;align-items:center;gap:6px;min-width:0}.track-downloaded-mark{display:inline-grid;place-items:center;color:var(--sp-green);flex:0 0 auto}.track-downloaded-mark .icon{width:13px;height:13px}
.offline-status{height:32px;padding:0 11px;display:inline-flex;align-items:center;gap:6px;border-radius:999px;background:#232323;color:#b3b3b3;font-size:12px;font-weight:800;white-space:nowrap}.offline-status .icon{width:15px;height:15px}.offline-status.is-offline{background:#2d2515;color:#f0c66a}.offline-status.hidden{display:none!important}
.downloads-title-head{align-items:flex-end}.downloads-title-head>div>h1{font-size:clamp(34px,5vw,58px);margin:3px 0 5px;line-height:1.06}.downloads-title-head>div>p{margin:0;color:var(--muted)}.offline-banner{display:flex;align-items:center;gap:12px;padding:13px 15px;margin:14px 0 18px;border-radius:8px;background:#2d2515;color:#f4ddb0}.offline-banner>.icon{width:22px;height:22px;flex:0 0 auto}.offline-banner div{display:grid;gap:2px}.offline-banner span{font-size:12px;color:#d6c39f}.library-title-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
body.offline-mode #aiDjBtn,body.offline-mode #uploadBtn{display:none!important}
.fullscreen-player-actions button.active{color:var(--sp-green)}
@media (max-width:820px){.hero-art-shell{width:112px;height:112px;flex-basis:112px}.hero-copy h1{line-height:1.08;padding-bottom:.1em}.offline-status{height:30px;padding:0 8px}.offline-status span{display:none}.downloads-title-head{align-items:flex-start;gap:12px}.downloads-title-head>div>h1{font-size:34px}.downloads-title-head .secondary-btn{min-height:38px}}
@media (max-width:560px){.hero-art-shell{width:104px;height:104px;flex-basis:104px}.artist-hero-art-shell>.artwork-edit-btn{width:32px;height:32px;right:-2px;bottom:4px}.library-title-actions{width:100%}.library-title-actions .secondary-btn{flex:1 1 auto}.offline-banner{margin-top:10px}}
.row-actions button.downloaded{color:var(--accent)}
.row-actions button.downloaded:hover{color:var(--accent)}

/* 1.10.31 — contextual Spotify-style ordering controls */
.collection-track-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 12px;flex-wrap:wrap}
.view-sort-control{display:inline-flex;align-items:center;gap:6px;margin-left:auto}
.view-sort-control select{min-height:38px;border:0;border-radius:6px;background:#242424;color:#fff;padding:0 34px 0 11px;font-weight:700}
.view-sort-control button{min-height:38px;display:inline-flex;align-items:center;gap:7px;border:0;border-radius:6px;background:transparent;color:var(--muted);padding:0 10px;font-weight:700;cursor:pointer}
.view-sort-control button:hover:not(:disabled){background:#242424;color:#fff}
.view-sort-control button:disabled{opacity:.42;cursor:default}
.view-sort-control button .icon{width:16px;height:16px}
.playlist-view-sort{margin-left:0}
@media(max-width:700px){.collection-track-toolbar{align-items:stretch}.view-sort-control{width:100%;margin-left:0}.view-sort-control select{flex:1;min-width:0}.view-sort-control button span{display:none}.view-sort-control button{width:40px;justify-content:center;padding:0}}

/* 1.10.32 — Spotify-style desktop track list geometry and row actions. */
.track-table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0 0;color:#fff;font-size:14px}
.track-table col.col-index{width:48px}.track-table col.col-album{width:clamp(170px,24vw,300px)}.track-table col.col-date{width:clamp(132px,16vw,190px)}.track-table col.col-actions{width:132px}
.track-table thead{height:36px;background:transparent!important}.track-table thead tr{height:36px}.track-table thead th{height:36px!important;padding:0 8px!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.10)!important;color:#b3b3b3!important;font-size:12px!important;line-height:36px!important;font-weight:400!important;text-align:left!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.track-table thead th.track-num{padding:0 8px 0 16px!important;text-align:right!important}.track-table thead th.track-actions-head{padding:0 8px!important}.track-actions-head-grid{display:grid;grid-template-columns:32px 48px 32px;gap:2px;align-items:center;justify-content:end}.track-actions-head .track-time-head{display:grid;place-items:center;height:36px}.track-actions-head .track-time-head .icon{width:16px;height:16px}
.track-table tbody tr.track-row{height:56px!important;min-height:56px;border-radius:4px;background:transparent;transition:background-color .08s linear;color:#b3b3b3}.track-table tbody tr.track-row:hover,.track-table tbody tr.track-row:focus-within{background:#2a2a2a}.track-table tbody tr.track-row.current-track{background:transparent}.track-table tbody tr.track-row.current-track:hover,.track-table tbody tr.track-row.current-track:focus-within{background:#2a2a2a}
.track-table tbody td{height:56px!important;min-height:56px;padding:8px!important;border:0!important;vertical-align:middle;overflow:hidden}.track-table tbody td.track-num{padding:8px 8px 8px 16px!important;text-align:right;color:#b3b3b3;font-variant-numeric:tabular-nums}
.track-table .row-play{width:32px!important;height:40px!important;min-width:32px!important;min-height:40px!important;padding:0!important;margin:0!important;display:inline-grid!important;place-items:center;color:#b3b3b3!important;border:0!important;border-radius:0!important;background:transparent!important}.track-table .row-index{font-size:16px;line-height:20px}.track-table .row-play-glyph{display:none;place-items:center}.track-table .row-play-glyph .icon{width:16px;height:16px;fill:currentColor}.track-table tr:hover .row-index,.track-table tr:focus-within .row-index,.track-table tr.current-track .row-index{display:none}.track-table tr:hover .row-play-glyph,.track-table tr:focus-within .row-play-glyph,.track-table tr.current-track .row-play-glyph{display:grid}.track-table tr.current-track .row-play{color:var(--sp-green)!important}
.track-title-cell{display:flex!important;align-items:center!important;gap:12px!important;min-width:0;height:40px}.track-title-cell .mini-cover{width:40px!important;height:40px!important;min-width:40px!important;flex:0 0 40px!important;border-radius:2px!important;overflow:hidden;background:#282828}.track-title-cell .mini-cover img{width:40px!important;height:40px!important;object-fit:cover}.track-lines{display:grid!important;align-content:center!important;gap:2px!important;min-width:0;height:40px}.track-name{min-width:0!important;max-width:100%;font-size:16px!important;line-height:20px!important;font-weight:400!important;color:#fff!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-name .track-downloaded-mark{margin-left:2px}.track-subline{display:flex!important;align-items:center!important;gap:5px!important;min-width:0;height:18px;overflow:hidden}.track-subline .track-sub,.track-album button,.track-album,.track-date{font-size:14px!important;line-height:18px!important;font-weight:400!important;color:#b3b3b3!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-subline .track-sub{display:block;max-width:100%;text-align:left}.track-subline .track-sub:hover,.track-album button:hover{color:#fff!important;text-decoration:underline}.track-table tr.current-track .track-name{color:var(--sp-green)!important}.spotify-source-link{font-size:9px!important;line-height:15px!important;flex:0 0 auto}
.track-table.no-artwork .track-title-cell,.track-table.no-artwork .track-lines{height:40px}.track-table.no-artwork .track-main{padding-left:8px!important}
.row-actions{width:auto!important;height:56px!important;padding:8px!important;vertical-align:middle!important;overflow:visible!important;white-space:nowrap}.row-action-grid{width:116px;height:40px;display:grid;grid-template-columns:32px 48px 32px;gap:2px;align-items:center;justify-content:end;margin-left:auto}.row-actions button{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#b3b3b3!important;display:grid!important;place-items:center}.row-actions button .icon{width:16px!important;height:16px!important}.row-actions .row-save:not(.liked),.row-actions .row-more{opacity:0}.track-row:hover .row-actions .row-save,.track-row:focus-within .row-actions .row-save,.track-row:hover .row-actions .row-more,.track-row:focus-within .row-actions .row-more{opacity:1}.row-actions .row-save.liked{opacity:1;color:var(--sp-green)!important}.row-actions .row-save:hover,.row-actions .row-more:hover{color:#fff!important;transform:scale(1.04)}.row-actions .row-save.liked:hover{color:var(--sp-green)!important}.row-actions .track-duration{display:block;width:48px;text-align:center;color:#b3b3b3;font-size:14px;line-height:20px;font-variant-numeric:tabular-nums}
.track-select-box{width:32px!important;height:40px!important;min-height:40px!important}
@media(max-width:1100px){.track-table.has-date col.col-date,.track-table.has-date th:nth-last-child(2),.track-table.has-date td.track-date{display:none}.track-table col.col-album{width:clamp(150px,22vw,240px)}}
@media(max-width:820px){
  .track-table{display:table!important;width:100%!important}.track-table thead{display:none!important}.track-table colgroup{display:none}.track-table tbody{display:table-row-group!important}.track-table tbody tr.track-row{display:table-row!important;height:64px!important;min-height:64px!important;padding:0!important;background:transparent!important}.track-table tbody tr.track-row:hover{background:transparent!important}.track-table tbody td{display:none!important;height:64px!important;padding:8px 0!important}.track-table tbody td.track-main{display:table-cell!important;width:auto!important;padding-left:8px!important}.track-table tbody td.row-actions{display:table-cell!important;width:48px!important;padding:8px 8px 8px 0!important;vertical-align:middle!important}.track-table tbody td.track-num,.track-table tbody td.track-album,.track-table tbody td.track-date{display:none!important}
  .track-title-cell{height:48px!important;gap:12px!important}.track-title-cell .mini-cover{width:48px!important;height:48px!important;min-width:48px!important;flex-basis:48px!important;border-radius:3px!important}.track-title-cell .mini-cover img{width:48px!important;height:48px!important}.track-lines{height:48px!important;gap:2px!important}.track-name{font-size:16px!important;line-height:22px!important}.track-subline .track-sub{font-size:13px!important;line-height:18px!important}.track-table.no-artwork .track-title-cell{padding-left:4px}
  .row-actions{height:64px!important;width:48px!important;padding:8px 8px 8px 0!important}.row-action-grid{height:48px!important;width:40px!important;display:grid!important;grid-template-columns:40px!important;gap:0!important;margin-left:auto}.row-actions .row-save,.row-actions .track-duration{display:none!important}.row-actions .row-more{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;opacity:1!important}.row-actions .row-more .icon{width:20px!important;height:20px!important}
}

/* 1.10.33 — current Spotify desktop fidelity, resilient hero titles, and Liked Songs filtering. */
/* Spotify collection heroes use a larger square on roomy desktop layouts. The title is fitted in JS
   to the actual copy width; generous line-height/padding prevents glyph clipping at every size. */
.hero{--hero-art-size:clamp(190px,18vw,232px);min-height:calc(var(--hero-art-size) + 112px);padding-top:88px;padding-bottom:24px;gap:24px}
.hero>.hero-art,.hero-art-shell{width:var(--hero-art-size)!important;height:var(--hero-art-size)!important;flex:0 0 var(--hero-art-size)!important}
.hero-copy{min-width:0;max-width:100%;align-self:flex-end;overflow:visible;padding:0 0 2px}
.hero-copy h1{display:block!important;max-width:100%;margin:8px 0 10px!important;padding:.055em 0 .11em!important;box-sizing:content-box!important;font-size:clamp(32px,6.7vw,96px);font-weight:900;line-height:1.08!important;letter-spacing:-.045em;white-space:nowrap;overflow:visible!important;text-overflow:clip!important;text-wrap:nowrap!important;word-break:normal}
.hero-copy h1.hero-title-wrap{white-space:normal!important;text-wrap:balance!important;overflow-wrap:anywhere;word-break:normal}
.hero-copy small{font-size:12px;line-height:16px;font-weight:700;letter-spacing:0;text-transform:none}
.hero-copy p{font-size:14px;line-height:20px;color:#fff;font-weight:400}
.hero-liked{background:linear-gradient(180deg,#5038a4 0,#3a2a75 46%,rgba(18,18,18,.12) 100%)}
.hero-liked .liked-art{background:linear-gradient(135deg,#450af5 0,#c4efd9 100%)}
.content>h1,.section-head h1{line-height:1.15;padding-bottom:.04em;overflow:visible}

/* Search is a persistent desktop control in the current Spotify shell rather than a Search-page-only field. */
@media (min-width:821px){
  .top-search{display:flex!important;max-width:474px;height:48px}
  .sidebar .main-nav .nav-item[data-view="search"]{display:none}
}

/* Liked Songs: Spotify-style list filter/search affordance and contextual sort controls. */
.spotify-liked-toolbar{min-height:80px;margin:0;padding:12px 0 8px;flex-wrap:nowrap}
.collection-primary-actions{display:flex;align-items:center;gap:16px;flex:0 0 auto}
.liked-list-tools{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;min-width:0;color:#b3b3b3}
.spotify-list-filter{height:40px;width:40px;display:flex;align-items:center;justify-content:flex-end;position:relative;overflow:hidden;border-radius:4px;background:transparent;transition:width .16s ease,background-color .12s ease}
.spotify-list-filter.open{width:min(220px,28vw);background:#2a2a2a}
.spotify-list-filter-toggle,.spotify-list-filter-clear{width:40px;height:40px;min-width:40px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:transparent;color:#b3b3b3;cursor:pointer;z-index:2}
.spotify-list-filter-toggle:hover,.spotify-list-filter-clear:hover{color:#fff;background:rgba(255,255,255,.07)}
.spotify-list-filter-toggle .icon,.spotify-list-filter-clear .icon{width:17px;height:17px}
.spotify-list-filter input{width:0;min-width:0;height:40px;opacity:0;padding:0;border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;color:#fff;font-size:14px;transition:width .16s ease,opacity .12s ease}
.spotify-list-filter.open input{width:100%;opacity:1;padding:0 2px 0 0}
.spotify-list-filter input::placeholder{color:#b3b3b3}
.spotify-list-filter.open .spotify-list-filter-toggle{border-radius:4px}
.spotify-list-filter-clear.hidden{display:none!important}
.spotify-filter-chip{height:32px;display:inline-flex;align-items:center;gap:6px;padding:0 12px;border:0;border-radius:999px;background:#232323;color:#fff;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer}
.spotify-filter-chip:hover{background:#2d2d2d}.spotify-filter-chip.active{background:#fff;color:#000}.spotify-filter-chip .icon{width:15px;height:15px}
.liked-filter-count{min-width:0;color:#b3b3b3;font-size:12px;white-space:nowrap}
.spotify-view-sort{gap:2px;margin-left:2px}
.spotify-sort-select{position:relative;height:40px;display:inline-flex;align-items:center;color:#b3b3b3;border-radius:4px}
.spotify-sort-select:hover{color:#fff;background:#242424}
.spotify-view-sort .spotify-sort-select select{appearance:none;-webkit-appearance:none;height:40px;min-height:40px;max-width:145px;padding:0 27px 0 9px!important;border:0!important;border-radius:4px!important;background:transparent!important;color:inherit!important;font-size:14px;font-weight:500;cursor:pointer;outline:0}
.spotify-sort-select>.icon{position:absolute;right:7px;width:14px;height:14px;pointer-events:none}
.spotify-view-sort>button{width:36px;height:36px;min-height:36px;padding:0;display:grid;place-items:center;border-radius:50%;background:transparent}
.spotify-view-sort>button span{display:none}.spotify-view-sort>button .icon{width:16px;height:16px}
.liked-filter-empty{padding-top:44px}

/* Track-list interaction details: provider attribution belongs in metadata views, not Spotify-style rows. */
.track-row .spotify-source-link{display:none!important}
.track-table tbody tr.track-row{cursor:default}
.track-table .track-title-head,.track-table .track-album,.track-table .track-date{padding-left:8px!important;padding-right:8px!important}
.track-table tbody tr.track-row:active{background:#303030}

@media (max-width:1100px) and (min-width:821px){
  .hero{--hero-art-size:clamp(176px,19vw,208px);min-height:calc(var(--hero-art-size) + 104px);padding-top:82px}
  .hero-copy h1{font-size:clamp(32px,6vw,72px)}
  .liked-filter-count{display:none}
}
@media (max-width:820px){
  .hero{--hero-art-size:112px!important;min-height:190px;padding-top:70px;padding-bottom:18px;gap:14px}
  .hero-copy{padding-bottom:0}
  .hero-copy h1{font-size:clamp(27px,8.5vw,44px);line-height:1.1!important;margin:5px 0 6px!important;padding:.04em 0 .1em!important;white-space:normal!important;text-wrap:balance!important;overflow:visible!important;-webkit-line-clamp:unset!important}
  .hero-copy small{font-size:10px;line-height:14px}.hero-copy p{font-size:13px;line-height:18px}
  .spotify-liked-toolbar{min-height:auto;align-items:center;flex-wrap:wrap;padding:10px 0}
  .liked-list-tools{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:7px}
  .spotify-list-filter,.spotify-list-filter.open{width:100%;background:#242424}.spotify-list-filter input{width:100%;opacity:1;padding-right:2px}.spotify-list-filter-toggle{border-radius:4px}
  .spotify-filter-chip{height:36px;padding:0 10px}.spotify-filter-chip span{display:none}
  .liked-filter-count{display:none}.spotify-view-sort{margin-left:0}.spotify-view-sort .spotify-sort-select select{max-width:126px}
}
@media (max-width:560px){
  .hero{--hero-art-size:104px!important;min-height:174px}
  .hero-copy h1{font-size:clamp(25px,8.4vw,36px)}
  .liked-list-tools{grid-template-columns:minmax(0,1fr) 38px auto}.spotify-view-sort>button{display:none}
}

/* Spotify desktop top-search treatment: neutral dark pill, no legacy white search field. */
@media (min-width:821px){
  .topbar{padding-inline:16px 18px}
  .top-search{height:48px!important;max-width:474px!important;padding:0 14px!important;gap:10px!important;border:1px solid transparent;border-radius:999px!important;background:#242424!important;color:#fff!important;box-shadow:none!important;transition:background-color .12s,border-color .12s}
  .top-search:hover{background:#2a2a2a!important;border-color:#4a4a4a}
  .top-search:focus-within{background:#2a2a2a!important;border-color:#fff}
  .top-search>span{display:grid;place-items:center;color:#b3b3b3;flex:0 0 auto}
  .top-search>span .icon{width:22px;height:22px}
  .top-search input{height:46px!important;padding:0!important;background:transparent!important;color:#fff!important;font-size:14px!important;font-weight:400;box-shadow:none!important}
  .top-search input::placeholder{color:#b3b3b3;opacity:1}
}

/* 1.10.34 — Spotify-style opaque track header, five-item mobile nav, and resilient text containers. */
.track-table thead,.track-table thead tr,.track-table thead th{background:#121212!important}
.track-table thead{box-shadow:0 1px 0 rgba(255,255,255,.10)}
.track-table thead th.track-actions-head{background:#121212!important}
.track-actions-head-grid{background:#121212!important}

/* Spotify keeps fixed typography in rows/cards and lets the container clip/ellipsis instead of shrinking labels arbitrarily. */
.track-title-cell,.track-lines,.track-subline,.track-name,.track-sub,.track-album,.track-date,.player-meta,.player-meta-sub,.mnp-meta,.now-panel-track-copy,.fullscreen-player-copy,.quick-tile>span:last-child,.media-card,.media-card h3,.media-card p,.library-item-main,.library-page-row>*,.section-head>*,.hero-copy{min-width:0;max-width:100%}
.track-name,.track-sub,.track-album,.track-date,#playerTitle,#playerArtist,#mnpTitle,#mnpArtist,#nowPanelTitle,#nowPanelArtist{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.quick-tile>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.media-card h3,.media-card p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.content>h1,.section-head h1{max-width:100%;overflow:visible;overflow-wrap:anywhere;text-wrap:balance;font-size:clamp(26px,3.3vw,36px);line-height:1.16}
.hero{height:auto!important;overflow:visible!important}
.hero-copy{flex:1 1 auto!important;width:auto!important;overflow:visible!important}
.hero-copy h1{min-height:1.22em!important;height:auto!important;overflow:visible!important}
.hero-copy h1.hero-title-wrap{min-height:0!important}

/* Mobile: requested direct Downloads destination while retaining Create. */
@media (max-width:820px){
  .mobile-nav{grid-template-columns:repeat(5,minmax(0,1fr))!important}
  .mobile-nav .nav-item{min-width:0!important;padding-left:1px!important;padding-right:1px!important;font-size:9.5px!important}
  .mobile-nav .nav-item span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media (max-width:390px){
  .mobile-nav .nav-item{font-size:9px!important}
  .mobile-nav-ico{width:21px!important;height:21px!important}
}

/* Offline mode keeps browsing/cached playback useful, but clearly de-emphasizes server-only mutations. */
body.offline-mode [data-action="create-playlist"],
body.offline-mode [data-action="playlist-add"],
body.offline-mode [data-action="playlist-pin"],
body.offline-mode [data-action="edit-playlist"],
body.offline-mode [data-action="playlist-more"],
body.offline-mode [data-action="folder-edit-current"],
body.offline-mode [data-action="save-album"],
body.offline-mode [data-action="follow-artist"],
body.offline-mode [data-library-page-pin],
body.offline-mode .library-card-pin{opacity:.34;pointer-events:none}
body.offline-mode .track-row.offline-unavailable{opacity:.46}
body.offline-mode .track-row.offline-unavailable .row-play{cursor:not-allowed}
body.offline-mode .track-row.offline-unavailable .track-name{color:#b3b3b3!important}

/* Text-bearing flex/grid children must be allowed to shrink; headings wrap rather than being vertically clipped. */
.section-head>div,.admin-title>div,.admin-card-head>div,.queue-head>*,.modal>*,.entity-toolbar>*,.playlist-hero-actions>*,.collection-track-toolbar>*{min-width:0}
.modal h1,.modal h2,.modal h3,.admin-title h1,.admin-card-head h2,.queue-head h3,.empty-state strong{max-width:100%;height:auto;min-height:1.15em;line-height:1.18;overflow:visible;overflow-wrap:anywhere}


/* 1.10.35 Spotify fidelity / interaction corrections */
:root{--font-sans:"Spotify Mix","Helvetica Neue",Arial,sans-serif;--spotify-text:#fff;--spotify-subtext:#b3b3b3;--spotify-surface:#121212;--spotify-surface-raised:#181818;}
html,body,button,input,select,textarea{font-family:var(--font-sans);font-optical-sizing:auto;font-synthesis:none;}
html,body{font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
body,#app,.app-shell{user-select:none;-webkit-user-select:none;}
input,textarea,[contenteditable="true"]{user-select:text;-webkit-user-select:text;}
button:not(:disabled),a[href],select,label[for],[role="button"],[data-action],[data-view],[data-card-kind],[data-library-kind],[data-library-card],[data-library-open],[data-folder-card],[data-quick-track],[data-quick-view],.media-card,.track-row.collection-reorderable{cursor:pointer;}
button:disabled,[aria-disabled="true"]{cursor:not-allowed;}
input:not([type="checkbox"]):not([type="radio"]),textarea,[contenteditable="true"]{cursor:text;}
img{pointer-events:none;-webkit-user-drag:none;user-select:none;}
/* Let flex/grid parents actually give Spotify ellipsis/wrapping rules room to work. */
:is(.content,.hero,.hero-copy,.section-head,.playlist-toolbar,.collection-track-toolbar,.liked-list-tools,.track-title-cell,.track-lines,.track-subline,.row-action-grid,.player-track,.player-track-copy,.media-card,.library-item-main,.library-item-copy,.now-panel-artist-copy,.fullscreen-player-copy,.modal-card,.admin-card,.admin-card-head)>*{min-width:0;}
.hero{min-height:280px;height:auto;overflow:visible;align-items:flex-end;}
.hero-copy{flex:1 1 auto;min-height:0;overflow:visible;padding-block:.14em .18em;}
.hero-copy h1{height:auto!important;min-height:1.08em;max-height:none!important;overflow:visible!important;text-overflow:clip!important;line-height:1.02!important;padding:.04em 0 .08em;margin:8px 0 10px;overflow-wrap:anywhere;word-break:normal;}
.content>h1,.section-head h1,.downloads-title-head h1,.library-title-head h1{line-height:1.1;min-height:1.1em;overflow:visible;padding-bottom:.06em;overflow-wrap:anywhere;}
.section-head,.playlist-toolbar,.collection-track-toolbar,.library-page-toolbar,.entity-toolbar{flex-wrap:wrap;row-gap:12px;}
.track-name,.track-sub,.track-album,.track-date,.media-card h3,.media-card p,.library-item-copy strong,.library-item-meta-text,.player-track-copy>*{min-width:0;max-width:100%;}
.artist-card .card-cover,.library-card .card-cover.round-cover,.library-item-cover.artist,.artist-art,.now-panel-artist-image{border-radius:50%;overflow:hidden;}
.artist-card .card-cover img,.library-card .card-cover.round-cover img,.library-item-cover.artist img,.artist-art img,.now-panel-artist-image img{width:100%;height:100%;object-fit:cover;display:block;}
.collection-reorder-enabled .track-row{cursor:grab;touch-action:pan-x;}
.collection-reorder-enabled .track-row:active,.collection-reorder-enabled .track-row.dragging{cursor:grabbing;}
.collection-reorder-grip{display:inline-grid;place-items:center;width:18px;height:32px;color:#b3b3b3;opacity:0;transition:opacity .12s,color .12s;vertical-align:middle;touch-action:none;cursor:grab;}
.collection-reorder-grip .icon{width:16px;height:16px;}
.collection-reorder-enabled .track-row:hover .collection-reorder-grip,.collection-reorder-grip:active{opacity:1;color:#fff;}
.collection-reorder-enabled .track-row .row-index{transition:opacity .12s;}
.collection-reorder-enabled .track-row:hover .collection-reorder-grip+.row-play .row-index{opacity:0;}
.track-row.dragging{opacity:.45;background:#2a2a2a!important;}
.track-row.drag-before{box-shadow:inset 0 2px 0 #fff;}
.track-row.drag-after{box-shadow:inset 0 -2px 0 #fff;}
@media(max-width:820px){.hero{min-height:0;height:auto}.hero-copy h1{line-height:1.08!important;padding-bottom:.08em}.collection-reorder-grip{opacity:1;width:24px}.collection-reorder-enabled .track-row{touch-action:pan-y}.playlist-toolbar,.collection-track-toolbar{align-items:center}.track-row{min-height:64px}}
.fullscreen-player-meta,.fullscreen-player-copy,.now-panel-track-copy,.now-panel-artist-copy{min-width:0;overflow:visible;}
.fullscreen-player-meta h1{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere;line-height:1.05!important;max-width:100%;height:auto!important;}
.auth-intro h1,.account-settings-head h1,.admin-title h1,.admin-card-head h2,.modal h1,.modal h2,.modal h3,.queue-head h3{height:auto!important;max-height:none!important;overflow:visible!important;overflow-wrap:anywhere;}

/* 1.10.35 final Spotify interaction geometry. Desktop rows themselves drag; touch gets Spotify-style handle beside More. */
:root{--font-sans:"Spotify Mix","SpotifyMixUI","CircularSp","Helvetica Neue",Helvetica,Arial,sans-serif;}
.collection-reorder-grip{display:none}
@media (hover:none),(pointer:coarse),(max-width:820px){
  .collection-reorder-enabled .row-actions{display:table-cell!important;width:88px!important;min-width:88px!important}
  .collection-reorder-enabled .row-action-grid{width:80px!important;grid-template-columns:40px 40px!important}
  .collection-reorder-enabled .collection-reorder-grip{display:grid!important;opacity:1;width:40px;height:40px;place-items:center;color:#b3b3b3;cursor:grab;touch-action:none;border-radius:50%}
  .collection-reorder-enabled .collection-reorder-grip:active,.collection-reorder-enabled .collection-reorder-grip:focus-visible{color:#fff;background:rgba(255,255,255,.08)}
  .collection-reorder-enabled .collection-reorder-grip .icon{width:18px;height:18px}
}
/* Make accidental selection impossible throughout the player; editable controls remain functional/selectable. */
body *,#app *{-webkit-user-select:none;user-select:none}
input,textarea,[contenteditable="true"],[contenteditable="true"] *{-webkit-user-select:text!important;user-select:text!important}
::selection{background:transparent;color:inherit}
input::selection,textarea::selection,[contenteditable="true"]::selection,[contenteditable="true"] *::selection{background:rgba(30,215,96,.32);color:#fff}
/* Spotify-like pointer semantics: only actionable surfaces advertise clickability. */
:is(button:not(:disabled),a[href],select,label[for],[role="button"],[data-action],[data-view],[data-card-kind],[data-library-card],[data-library-open],[data-folder-card],[data-quick-track],[data-quick-view]){cursor:pointer}
.track-row:not(.collection-reorderable){cursor:default}
.collection-reorderable{cursor:grab!important}.collection-reorderable.dragging{cursor:grabbing!important}
/* Prevent clipping in high-density Spotify surfaces without shrinking their normal typography. */
:is(.topbar,.sidebar,.main-panel,.player-bar,.queue-panel,.content,.modal,.admin-page,.hero,.section-head,.collection-track-toolbar,.playlist-toolbar){min-width:0}
:is(.brand,.nav-item,.library-item,.playlist-nav button,.user-pill,.popover button,.track-name,.track-sub,.track-album,.track-date,.player-meta,.queue-item,.media-card h3,.media-card p){min-width:0;max-width:100%}
:is(.brand,.nav-item,.user-pill,.popover button,.track-name,.track-sub,.track-album,.track-date,.player-meta,.queue-item,.media-card h3,.media-card p){line-height:normal}
/* 1.10.35 final pointer/text metrics audit. */
:is(input[type="checkbox"],input[type="radio"],input[type="range"],summary){cursor:pointer}
.hero-copy h1{font-weight:800!important}
/* Spotify keeps ordinary metadata at a fixed readable size and truncates horizontally;
   display headings are the surfaces that resize/wrap. */
.track-name{font-weight:400!important}.track-sub,.track-album,.track-date,.track-duration{font-weight:400!important}
:is(.track-lines,.library-item-copy,.player-meta,.now-panel-track-copy,.media-card,.queue-item)>:is(strong,span,button,h1,h2,h3,p,small){min-width:0;max-width:100%}


/* 1.10.36 — lock browser zoom and bind the shell to the actual device viewport. */
html{width:100%;max-width:100%;height:100%;overflow:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%;touch-action:pan-x pan-y;}
body{width:100%;max-width:100%;min-width:0;min-height:100%;overflow-x:hidden;overscroll-behavior:none;}
body.app-ready{height:var(--device-viewport-height,100dvh);max-height:var(--device-viewport-height,100dvh);overflow:hidden;}
.app-shell{width:var(--device-viewport-width,100vw);max-width:100vw;height:var(--device-viewport-height,100dvh)!important;max-height:var(--device-viewport-height,100dvh);margin:0;touch-action:pan-x pan-y;}
.auth-shell{min-height:var(--device-viewport-height,100dvh);width:100%;max-width:100vw;}
@supports(height:100dvh){.app-shell{min-height:100dvh}.auth-shell{min-height:100dvh}}
@media(max-width:820px){html,body,#app,.app-shell{max-width:100vw!important;overflow-x:hidden}.app-shell{padding-left:max(0px,env(safe-area-inset-left));padding-right:max(0px,env(safe-area-inset-right));}.main-panel,.content,.topbar,.player-bar,.mobile-nav{max-width:100vw;min-width:0}.mobile-nav{padding-bottom:max(env(safe-area-inset-bottom),4px)}}

/* 1.10.37 — stable realtime DOM, Spotify icon controls, and true circular artist media. */
.spotify-icon-action{
  width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;
  padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;
  color:#b3b3b3!important;display:inline-grid!important;place-items:center!important;gap:0!important;
  flex:0 0 40px!important;
}
.spotify-icon-action .icon{width:22px!important;height:22px!important}
.spotify-icon-action:hover:not(:disabled){background:transparent!important;color:#fff!important;transform:scale(1.06)}
.spotify-icon-action.active{color:var(--sp-green)!important}
.spotify-icon-action:focus-visible{outline:2px solid #fff!important;outline-offset:2px}
.spotify-view-sort>button{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;padding:0!important;border-radius:50%!important}
/* Artist imagery is always square before the 50% radius is applied, preventing oval/pill portraits. */
.artist-card .card-cover,.library-card .card-cover.round-cover,.library-item-cover.artist,.artist-art,.now-panel-artist-image,.now-panel-artist-avatar,.avatar-small,.jam-member-avatar{
  aspect-ratio:1/1!important;border-radius:50%!important;overflow:hidden!important;
}
.artist-card .card-cover img,.library-card .card-cover.round-cover img,.library-item-cover.artist img,.artist-art img,.now-panel-artist-image img{
  width:100%!important;height:100%!important;aspect-ratio:1/1!important;object-fit:cover!important;border-radius:50%!important;
}
.now-panel-artist-hero{justify-items:center!important;padding-top:14px!important}
.now-panel-artist-image{
  width:min(168px,62%)!important;height:auto!important;max-width:168px!important;margin:0 auto 4px!important;
  display:grid!important;place-items:center!important;background:#2a2a2a!important;
}
.now-panel-artist-image.placeholder .icon{width:52px!important;height:52px!important}
.now-panel-artist-copy{width:100%!important;justify-self:stretch!important}
/* Reordering moves the existing <tr>; do not animate layout in a way that looks like a table reload. */
.collection-reorder-enabled .track-row{will-change:transform}
.track-row.reorder-committing{opacity:.82}
.fullscreen-player-actions button{
  width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;
  padding:0!important;border-radius:50%!important;display:grid!important;place-items:center!important;
}
.fullscreen-player-actions button .icon{width:20px!important;height:20px!important}

/* 1.10.38 — Liked filter visibility and Spotify track-list header alignment. */
/* The filter shell owns its button widths; the text input consumes only the remaining space. */
.spotify-list-filter{justify-content:flex-start!important;flex:0 1 auto;box-sizing:border-box}
.spotify-list-filter-toggle,.spotify-list-filter-clear{flex:0 0 40px;position:relative;inset:auto;visibility:visible!important}
.spotify-list-filter input{flex:0 0 0;box-sizing:border-box}
.spotify-list-filter.open input{flex:1 1 auto;width:auto!important;min-width:0!important}
.spotify-list-filter.open .spotify-list-filter-clear:not(.hidden){display:grid!important}
@media (max-width:1180px) and (min-width:821px){
  .spotify-liked-toolbar{flex-wrap:wrap!important}
  .liked-list-tools{width:100%;justify-content:flex-end;overflow:visible}
}
@media (max-width:820px){
  .spotify-list-filter,.spotify-list-filter.open{display:flex!important;overflow:hidden}
  .spotify-list-filter input,.spotify-list-filter.open input{flex:1 1 auto!important;width:auto!important;min-width:0!important}
}

/* Spotify desktop list header: one continuous opaque 36px strip below the top bar.
   Only the clock labels the right-side duration slot; save/more columns intentionally have no header glyph. */
@media (min-width:821px){
  .track-table thead{height:36px!important;background:#121212!important;box-shadow:0 1px 0 rgba(255,255,255,.10)!important}
  .track-table thead tr{height:36px!important;background:#121212!important}
  .track-table thead th{height:36px!important;background:#121212!important;border-bottom:0!important;vertical-align:middle!important;line-height:36px!important}
  .track-table thead th.track-num{width:48px!important}
  .track-table thead th.track-actions-head{width:132px!important;padding:0 8px!important;text-align:right!important;overflow:visible!important}
  .track-actions-head-grid{width:116px!important;height:36px!important;margin-left:auto;display:grid!important;grid-template-columns:32px 48px 32px!important;gap:2px!important;align-items:center!important;justify-items:center!important;background:transparent!important}
  .track-actions-head-grid .track-actions-spacer{display:block;width:32px;height:36px}
  .track-actions-head .track-time-head{width:48px!important;height:36px!important;display:grid!important;place-items:center!important;color:#b3b3b3!important;line-height:1!important}
  .track-actions-head .track-time-head .icon{display:block;width:16px!important;height:16px!important}
}


/* 1.10.39 — Retina artwork and complete interactive cursor semantics. */
/* Ranges are direct-manipulation controls: the rail and thumb both keep the hand cursor. */
input[type="range"]:not(:disabled),.spotify-range:not(:disabled),.seek-range:not(:disabled){cursor:pointer!important}
input[type="range"]:not(:disabled)::-webkit-slider-runnable-track,input[type="range"]:not(:disabled)::-webkit-slider-thumb{cursor:pointer!important}
input[type="range"]:not(:disabled)::-moz-range-track,input[type="range"]:not(:disabled)::-moz-range-thumb{cursor:pointer!important}
input[type="range"]:disabled,.spotify-range:disabled,.seek-range:disabled{cursor:not-allowed!important}
/* JavaScript-driven surfaces that are intentionally clickable but are not native buttons. */
#playerCover,#miniNowPlaying,.queue-item,[data-device-select],[data-audio-sink],[data-now-play-track],[data-now-artist],
[data-track-resource-play],[data-collection-more],[data-queue-index],[data-create-kind],[data-playlist-add-track],
[data-metadata-edit-track],[data-metadata-track-refresh],[data-sleep-minutes],[data-sleep-end-track],
[data-offline-collection],[data-track-resource-like],[data-track-resource-copy],[data-track-resource-download],[data-track-resource-more]{cursor:pointer}
/* Never imply clickability on disabled/offline controls. */
:is(button,input,select,[role="button"],[data-action],[data-view])[disabled],:is(button,input,select,[role="button"])[aria-disabled="true"]{cursor:not-allowed!important}


/* Spotify-style track-list header visual geometry. Sticky placement is owned by
   the single desktop scroll-layout rule at the end of this file. */
.spotify-track-table-wrap{position:relative;min-width:0;width:100%;overflow:visible;isolation:auto}
@media (min-width:821px){
  .spotify-track-table-wrap .track-table thead{height:36px!important;margin:0!important;background:#121212!important;box-shadow:0 1px 0 rgba(255,255,255,.10)!important}
  #content .spotify-track-table-wrap .track-table thead tr{height:36px!important;background:#121212!important}
  .spotify-track-table-wrap .track-table thead th{
    position:static!important;top:auto!important;z-index:auto!important;height:36px!important;min-height:36px!important;
    padding:0 8px!important;vertical-align:middle!important;background:#121212!important;color:#b3b3b3!important;
    font-size:12px!important;font-weight:400!important;line-height:36px!important;letter-spacing:normal!important;white-space:nowrap!important;
    border:0!important;box-shadow:none!important;background-clip:border-box!important;
  }
  #content .spotify-track-table-wrap .track-table thead th:first-child{padding-left:16px!important}
  .spotify-track-table-wrap .track-table thead th.track-actions-head{width:132px!important;min-width:132px!important;padding:0 8px!important;overflow:visible!important;text-align:right!important}
  .spotify-track-table-wrap .track-actions-head-grid{width:116px!important;height:36px!important;margin:0 0 0 auto!important;display:grid!important;grid-template-columns:32px 48px 32px!important;column-gap:2px!important;align-items:center!important;justify-items:center!important;background:transparent!important}
  .spotify-track-table-wrap .track-actions-head .track-time-head{width:48px!important;height:36px!important;display:grid!important;place-items:center!important;color:#b3b3b3!important;line-height:1!important}
  .spotify-track-table-wrap .track-actions-head .track-time-head .icon{width:16px!important;height:16px!important;display:block!important}
  .spotify-track-table-wrap .track-actions-head-grid .track-actions-spacer{display:block!important;width:32px!important;height:36px!important}
}


/* 1.10.41 — Spotify sticky list header + player duration/remaining-time toggle. */
.player-time-toggle{cursor:pointer;user-select:none;-webkit-user-select:none;border-radius:2px;outline:0;transition:color .08s linear}
.player-time-toggle:hover{color:#fff!important}
.player-time-toggle:focus-visible{color:#fff!important;outline:1px solid #fff;outline-offset:2px}

/* 1.10.43 — visible empty sidebar footer divider + Spotify edge-locked Liked Songs header. */
.sidebar-bottom{flex:0 0 auto}
.sidebar-bottom.sidebar-bottom-empty{
  min-height:9px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.14)!important;
}

/* 1.10.44 — account-scoped synchronized playback on every online device. */
.device-all-row{width:100%;display:grid;grid-template-columns:46px minmax(0,1fr) 32px;align-items:center;gap:10px;padding:9px;margin:1px 0 4px;border:0;border-radius:7px;background:transparent;color:#fff;text-align:left;cursor:pointer}
.device-all-row:hover{background:#353535}.device-all-row.active{background:rgba(30,215,96,.08)}
.device-all-row.active .device-icon,.device-all-row.active .device-copy strong,.device-all-row.active .device-tail{color:var(--sp-green)}
.device-all-row .device-tail{display:grid;place-items:center;width:28px;height:28px;color:#8f8f8f}.device-all-row .device-tail .icon{width:19px;height:19px}
.device-all-row[aria-pressed="false"] .device-tail{opacity:0}.device-all-row:disabled{cursor:not-allowed}
.device-resync-row{margin-top:-1px}.device-resync-row .device-icon{background:#282828}.device-resync-row:hover .device-icon{background:#343434}.device-resync-row.syncing{background:rgba(255,255,255,.035)}.device-resync-row.syncing .device-tail .icon{animation:device-sync-spin .85s linear infinite}.device-resync-row:disabled{opacity:.72}
@keyframes device-sync-spin{to{transform:rotate(360deg)}}
.device-row.synced{background:rgba(30,215,96,.035)}.device-row.synced .device-icon,.device-row.synced .device-tail{color:var(--sp-green)}
.device-row.sync-leader .device-copy strong{color:var(--sp-green)}
@media(max-width:820px){.device-all-row{min-height:68px;padding:10px;grid-template-columns:50px minmax(0,1fr) 36px}.device-all-row .device-icon{width:46px;height:46px}}


/* 1.10.45 — browser-reliable Spotify sticky track header + persistent empty sidebar divider. */
.sidebar-bottom{
  flex:0 0 auto;
  width:100%;
  border-top:1px solid #252525;
}
/* Start empty in the server-rendered shell and keep the separator even before
   bootstrap permissions finish. :has() makes the visual state self-healing if
   visibility is changed by any later UI path without calling the JS helper. */
.sidebar-bottom.sidebar-bottom-empty,
.sidebar-bottom:not(:has(.nav-item:not(.hidden):not([hidden]))){
  min-height:9px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.14)!important;
}


/* 1.10.46 — coordinated all-device start/resync barrier. */
.device-resync-row:focus-visible{outline:2px solid #fff;outline-offset:-2px}.device-resync-row.syncing .device-copy strong{color:#fff}
/* 1.10.58: devices without a document-scoped audio grant remain remote-only. */
.device-row.audio-pending .device-online-dot{background:#8f8f8f}
.device-row.audio-pending .device-icon,.device-row.audio-pending .device-state-value{color:#b3b3b3}
.device-row.audio-pending.selected{background:rgba(255,255,255,.035)}
.device-row.audio-pending.selected .device-icon,.device-row.audio-pending.selected .device-copy strong{color:#fff}
.device-audio-enable-row .device-icon{color:#fff}
.device-audio-enable-row:not(:disabled) .device-tail{color:var(--sp-green)}

/* 1.10.59: explicit personal sync-group membership. */
.device-row[role="checkbox"]:not(.sync-selected) .device-tail{color:#a7a7a7}.device-row.sync-selected .device-tail{color:var(--sp-green)}.device-row.sync-selected.audio-pending .device-tail{color:var(--sp-green)}

/* 1.10.60: granted audio is distinct from sync-ready output. */
.device-row.audio-granted-not-ready .device-online-dot{background:#d7a72b}
.device-row.audio-granted-not-ready .device-state-value{color:#d6b45d}
.device-row.audio-granted-not-ready.sync-selected{background:rgba(215,167,43,.035)}

/* Administration duplicate catalog maintenance */
.duplicate-admin-card{display:grid;gap:16px}.duplicate-admin-card>.admin-card-head{margin-bottom:0}.duplicate-filters{display:flex;gap:8px;flex-wrap:wrap}.duplicate-filter{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:7px 12px;border:1px solid #3b3b3b;border-radius:999px;background:#202020;color:#b7b7b7;font-weight:750;cursor:pointer}.duplicate-filter strong{min-width:22px;padding:2px 6px;border-radius:999px;background:#303030;color:#fff;font-size:11px;text-align:center}.duplicate-filter:hover{border-color:#777;color:#fff}.duplicate-filter.active{border-color:#fff;background:#2a2a2a;color:#fff}.duplicate-safety{display:grid;gap:4px;padding:13px 14px;border:1px solid #343434;border-radius:8px;background:#202020}.duplicate-safety strong{font-size:13px}.duplicate-safety span{color:#aaa;font-size:12px;line-height:1.45}.duplicate-groups{display:grid;gap:12px}.duplicate-group{border:1px solid #303030;border-radius:9px;background:#1d1d1d;overflow:hidden}.duplicate-group-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:14px 15px;border-bottom:1px solid #2d2d2d}.duplicate-group-head>div{min-width:0}.duplicate-group-head p{margin:5px 0 0;color:#aaa;font-size:12px}.duplicate-group-head>small{max-width:310px;color:#858585;font-size:11px;line-height:1.4;text-align:right}.duplicate-match-line{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.duplicate-match-line>strong{font-size:14px}.duplicate-confidence{display:inline-flex;align-items:center;padding:4px 7px;border-radius:999px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.035em}.duplicate-confidence.exact{background:rgba(30,215,96,.14);color:#76e99d}.duplicate-confidence.high{background:rgba(86,156,255,.14);color:#9bc5ff}.duplicate-confidence.review{background:rgba(248,200,79,.13);color:#f8c84f}.duplicate-match-type,.duplicate-release-review{display:inline-flex;align-items:center;padding:4px 7px;border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.02em}.duplicate-match-type{background:#2b2b2b;color:#c9c9c9}.duplicate-release-review{border:1px solid rgba(248,200,79,.32);background:rgba(248,200,79,.10);color:#f8c84f}.duplicate-group.needs-release-review{border-color:#554a27}.duplicate-item.is-cross-release:not(.is-keeper){background:linear-gradient(90deg,rgba(248,200,79,.045),transparent 46%)}.duplicate-items{display:grid}.duplicate-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;padding:12px 14px;border-bottom:1px solid #292929}.duplicate-item:last-child{border-bottom:0}.duplicate-item.is-keeper{background:rgba(30,215,96,.055)}.duplicate-keeper{display:flex;align-items:flex-start;gap:10px;min-width:0;cursor:pointer}.duplicate-keeper input{margin-top:4px;accent-color:var(--sp-green)}.duplicate-keeper>span{display:grid;gap:3px;min-width:0}.duplicate-keeper strong{font-size:13px;overflow-wrap:anywhere}.duplicate-keeper small{display:block;color:#999;font-size:11px;line-height:1.4;overflow-wrap:anywhere}.duplicate-remove-btn{display:inline-flex;align-items:center;gap:5px;min-height:34px;padding:6px 10px;border:1px solid #653237;border-radius:999px;background:#242424;color:#ff9b96;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}.duplicate-remove-btn:hover:not(:disabled){border-color:#ff8f8a;color:#fff}.duplicate-remove-btn:disabled{opacity:.35;cursor:not-allowed}.duplicate-remove-btn .icon{width:15px;height:15px}.duplicate-empty{padding:30px 12px}
@media(max-width:820px){.duplicate-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.duplicate-filter{justify-content:center;padding-inline:8px}.duplicate-group-head{display:grid;gap:7px}.duplicate-group-head>small{max-width:none;text-align:left}.duplicate-item{grid-template-columns:1fr;gap:9px}.duplicate-remove-btn{width:100%;justify-content:center}.duplicate-keeper{align-items:flex-start}}
@media(max-width:480px){.duplicate-filters{grid-template-columns:1fr}.duplicate-filter{justify-content:space-between}.duplicate-match-line{align-items:flex-start;flex-direction:column;gap:6px}}

/* 1.10.75 — one desktop scroll coordinate system for the Spotify-like shell.
   The top bar is a fixed flex row outside #content. #content is the only vertical
   scroller. Its visual 22px opening gap is a scroll-away spacer instead of
   scrollport padding, so every track-table header can use top:0 directly. */
@media (min-width:821px){
  .main-panel{display:flex;flex-direction:column;min-height:0}
  .main-panel>.topbar{position:relative;inset:auto;flex:0 0 var(--topbar-height);height:var(--topbar-height);min-height:var(--topbar-height)}
  .main-panel>.content{flex:1 1 auto;height:auto;min-height:0;padding-top:0}
  .main-panel>.content::before{content:"";display:block;height:var(--content-top-offset);min-height:var(--content-top-offset);pointer-events:none}
  #content .spotify-track-table-wrap{overflow:visible!important;isolation:auto!important}
  #content .spotify-track-table-wrap .track-table thead{
    position:sticky!important;top:0!important;z-index:9!important;height:36px!important;margin:0!important;
    background:#121212!important;box-shadow:0 1px 0 rgba(255,255,255,.10)!important;
  }
  #content .spotify-track-table-wrap .track-table thead tr{height:36px!important;background:#121212!important}
  #content .spotify-track-table-wrap .track-table thead th,
  #content .spotify-track-table-wrap .track-table thead th.track-actions-head{position:static!important;top:auto!important;z-index:auto!important;background:#121212!important}
  #content .spotify-track-table-wrap .track-table thead th:first-child{box-shadow:-24px 0 0 #121212!important}
  #content .spotify-track-table-wrap .track-table thead th:last-child{box-shadow:24px 0 0 #121212!important}
}

/* the application 1.10.80 — Auto Discovery realtime JSON dashboard */
.discovery-live-stats{grid-template-columns:repeat(5,minmax(0,1fr))}
.discovery-realtime-card{overflow:hidden;background:linear-gradient(180deg,rgba(30,215,96,.035),rgba(24,24,24,0) 180px),#181818}
.discovery-realtime-card .admin-card-head h2{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.discovery-meter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:14px}
.discovery-meter-card{padding:14px 15px;border:1px solid var(--line);border-radius:9px;background:#1d1d1d;min-width:0}
.discovery-meter-card>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px}
.discovery-meter-card>div:first-child>span{font-weight:800;font-variant-numeric:tabular-nums}
.discovery-meter-card>small{display:block;color:var(--muted);font-size:11px;line-height:1.4;margin-top:8px}
.discovery-meter{height:7px;margin-top:10px;background:#363636;border-radius:999px;overflow:hidden}
.discovery-meter>span,.discovery-worker-progress>span,.discovery-row-progress>span{display:block;height:100%;width:0;background:var(--accent);border-radius:inherit;transition:width .2s ease}
.discovery-meter.queue>span{opacity:.78}
.discovery-counts{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 14px}
.discovery-count-chip{display:flex;align-items:baseline;gap:5px;border:1px solid var(--line);background:#202020;border-radius:999px;padding:6px 9px}
.discovery-count-chip strong{font-size:13px;font-variant-numeric:tabular-nums}
.discovery-count-chip small{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.35px}
.discovery-worker-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.discovery-worker{display:grid;gap:5px;min-width:0;padding:11px;border:1px solid #2d2d2d;background:#161616;border-radius:8px;transition:border-color .16s ease,background .16s ease}
.discovery-worker.active{border-color:rgba(30,215,96,.38);background:rgba(30,215,96,.055)}
.discovery-worker-head{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:800;letter-spacing:.4px}
.discovery-worker-dot{width:7px;height:7px;border-radius:50%;background:#555}
.discovery-worker.active .discovery-worker-dot{background:var(--accent);box-shadow:0 0 0 4px rgba(30,215,96,.08)}
.discovery-worker>strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.discovery-worker>small{min-height:30px;color:var(--muted);font-size:10px;line-height:1.4;overflow:hidden}
.discovery-worker-progress{height:4px;background:#333;border-radius:999px;overflow:hidden}
.discovery-live-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px;padding-top:12px;border-top:1px solid var(--line)}
.discovery-live-footer>span{color:var(--muted);font-size:11px}
.discovery-activity-card{padding-bottom:10px}
.discovery-table td:first-child strong,.discovery-table td:first-child small,.discovery-table td:nth-child(2) strong,.discovery-table td:nth-child(2) small{display:block}
.discovery-table td:first-child small,.discovery-table td:nth-child(2) small,.discovery-table td:last-child small{color:var(--muted);margin-top:2px}
.discovery-table tbody tr{transition:background .14s ease,opacity .14s ease}
.discovery-table tbody tr.is-processing{background:rgba(30,215,96,.035)}
.discovery-table tbody tr.is-failed{background:rgba(255,95,87,.025)}
.discovery-row-progress{width:min(130px,100%);height:3px;background:#353535;border-radius:999px;overflow:hidden;margin-top:6px}
@media(max-width:1250px){.discovery-live-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.discovery-worker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.discovery-live-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.discovery-meter-grid,.discovery-worker-grid{grid-template-columns:1fr}.discovery-live-footer{align-items:flex-start;flex-direction:column}.discovery-live-footer button{width:100%}}

/* the application 1.10.81 — application-wide progressive loading. */
.app-load-bar{position:absolute;left:0;right:0;bottom:-1px;z-index:24;height:2px;overflow:hidden;pointer-events:none;opacity:0;--app-load-progress:0%;transition:opacity .16s ease}
.app-load-bar::before{content:"";display:block;width:var(--app-load-progress);height:100%;background:var(--sp-green,var(--accent,#1ed760));box-shadow:0 0 10px rgba(30,215,96,.45);transition:width .22s cubic-bezier(.2,.7,.2,1)}
.app-load-bar.visible{opacity:1}.app-load-bar.complete::before{transition-duration:.08s}
.app-boot-skeleton{min-height:320px}
.media-card,.admin-card,.account-card{content-visibility:auto;contain-intrinsic-size:auto 230px}
@media(prefers-reduced-motion:reduce){.app-load-bar,.app-load-bar::before{transition:none}}

/* 1.10.82 Administration operations UX */
.admin-tab-group-label{display:inline-flex;align-items:center;padding:0 7px;color:#707070;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;flex:0 0 auto}
.admin-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.admin-action-card{appearance:none;border:1px solid #303030;background:#202020;color:#fff;border-radius:9px;min-height:82px;padding:13px 14px;display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:12px;text-align:left;cursor:pointer;transition:background .12s,border-color .12s,transform .12s}
.admin-action-card:hover{background:#252525;border-color:#4a4a4a;transform:translateY(-1px)}
.admin-action-card.needs-attention{border-color:rgba(255,139,133,.4);background:rgba(255,95,87,.06)}
.admin-action-card>span:nth-child(2){display:grid;gap:4px;min-width:0}.admin-action-card strong{font-size:14px}.admin-action-card small{color:#a8a8a8;line-height:1.35}.admin-action-card>b{font-size:12px;color:#d7d7d7;background:#2e2e2e;border-radius:999px;padding:5px 8px;white-space:nowrap}
.admin-action-card.needs-attention>b{color:#ffaaa5;background:rgba(255,95,87,.12)}
.admin-action-icon{width:38px;height:38px;border-radius:8px;background:#2d2d2d;display:grid;place-items:center;color:var(--accent)}.admin-action-icon .icon{width:18px;height:18px}

/* Music import progress lives inside Administration instead of floating over playback. */
.admin-page .upload-manager{position:static!important;z-index:auto!important;left:auto!important;right:auto!important;bottom:auto!important;width:100%!important;max-height:none!important;display:block!important;background:#181818!important;border:1px solid #282828!important;border-radius:10px!important;box-shadow:none!important;overflow:hidden!important;padding:20px!important}
.admin-page .upload-manager .admin-card-head{margin-bottom:12px}.admin-page .upload-items{max-height:420px;overflow:auto;border:1px solid #292929;border-radius:8px;background:#161616}
.admin-page .upload-item{padding:11px 12px;border-bottom-color:#292929}.admin-page .upload-item:last-child{border-bottom:0}.admin-page .upload-empty{margin:6px 0 0}.admin-page .upload-manager .upload-items:empty{display:none}

@media(max-width:900px){.admin-action-grid{grid-template-columns:1fr}.admin-tab-group-label{display:none}}
@media(max-width:820px){.admin-page .upload-manager{padding:14px!important;border-radius:10px!important;max-height:none!important}.admin-page .upload-items{max-height:46vh}}

/* Administration reliability + usability (1.10.83) */
.admin-page{position:relative;min-width:0}
.admin-page.admin-loading::before{content:"";position:sticky;display:block;top:0;z-index:12;height:2px;margin-bottom:-2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);background-size:220% 100%;animation:admin-loading-slide .9s linear infinite}
.admin-page.admin-loading .admin-tabs{cursor:progress}
.admin-page.admin-loading .admin-tabs button{pointer-events:none}
@keyframes admin-loading-slide{from{background-position:100% 0}to{background-position:-100% 0}}
.admin-tabs{top:0!important;z-index:8!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:rgba(18,18,18,.96)!important}
.admin-body{min-width:0}
.admin-error-card{border-color:#5b3034!important;background:#211719!important}
.admin-error-card h2{color:#ffb2ae}
.admin-error-text{display:block;max-width:360px;color:#ffaaa6;white-space:normal;overflow-wrap:anywhere;line-height:1.35}
.admin-table-wrap{max-width:100%;overscroll-behavior-x:contain}
.admin-table td,.admin-table th{vertical-align:middle}
.admin-actions button:disabled,.admin-primary:disabled,.secondary-btn:disabled{cursor:wait;opacity:.55}
.admin-actions>.muted{display:inline-flex;align-items:center;min-height:34px;padding:0 6px;font-size:11px;white-space:nowrap}
@media(max-width:820px){.admin-tabs{top:0!important}.admin-error-text{max-width:240px}.admin-card{min-width:0}.admin-table-wrap{margin-inline:-4px}}

/* the application 1.10.83 — Administration frontend/backend reliability final cascade. */

/* the application 1.11.0 — Administration v2: fast workspace navigation and safer update workflow. */
.admin-page-v2{width:min(1720px,100%);margin:0 auto;padding:0 26px 42px;box-sizing:border-box}
.admin-command-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:30px 2px 22px;margin:0;border-bottom:1px solid #282828}
.admin-command-header>div:first-child{min-width:0}.admin-command-header small{color:var(--accent);font-size:10px;font-weight:900;letter-spacing:.12em}.admin-command-header h1{margin:5px 0 6px;font-size:32px;letter-spacing:-.035em}.admin-command-header p{max-width:720px;margin:0;color:#a8a8a8;line-height:1.5}
.admin-title-meta{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.admin-version-badge,.admin-role-badge{display:inline-flex;align-items:center;min-height:28px;padding:5px 10px;border:1px solid #353535;border-radius:999px;background:#202020;color:#ddd;font-size:11px;font-weight:800}.admin-version-badge{font-variant-numeric:tabular-nums;color:#bdbdbd}
.admin-workspace{display:grid;grid-template-columns:228px minmax(0,1fr);gap:24px;align-items:start;padding-top:20px}.admin-nav-rail{position:sticky;top:14px;display:flex;flex-direction:column;gap:14px;max-height:calc(100vh - 160px);padding:10px;border:1px solid #2b2b2b;border-radius:14px;background:linear-gradient(180deg,#1a1a1a,#151515);box-shadow:0 14px 38px rgba(0,0,0,.16);overflow:auto}.admin-page-v2 .admin-tabs{position:static!important;display:flex!important;flex-direction:column!important;gap:2px!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;overflow:visible!important}.admin-page-v2 .admin-tab-group-label{display:block!important;margin:12px 8px 4px;padding:0;color:#686868;font-size:9px;letter-spacing:.13em}.admin-page-v2 .admin-tab-group-label:first-child{margin-top:5px}.admin-page-v2 .admin-tabs button{width:100%;min-height:38px;display:flex;align-items:center;justify-content:flex-start;gap:10px;padding:8px 10px;border:0;border-radius:8px;background:transparent;color:#aaa;text-align:left;font-weight:700;white-space:normal}.admin-page-v2 .admin-tabs button .icon{width:17px;height:17px;flex:0 0 auto}.admin-page-v2 .admin-tabs button:hover{background:#242424;color:#fff}.admin-page-v2 .admin-tabs button.active{background:#2b2b2b;color:#fff;box-shadow:inset 3px 0 0 var(--accent)}.admin-page-v2.admin-loading .admin-tabs button{pointer-events:auto!important;cursor:pointer!important}.admin-nav-foot{display:flex;align-items:center;gap:9px;margin:2px 5px 4px;padding:10px 8px 0;border-top:1px solid #292929;color:#777}.admin-nav-foot .icon{width:15px;height:15px;color:var(--accent)}.admin-nav-foot small{font-size:10px;font-weight:700}
.admin-main{min-width:0}.admin-section-bar{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;min-height:78px;margin-bottom:16px;padding:2px 1px 15px;border-bottom:1px solid #282828}.admin-section-bar>div{min-width:0}.admin-section-bar small{display:block;margin-bottom:3px;color:#737373;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.admin-section-bar h2{margin:0 0 4px;font-size:22px;letter-spacing:-.025em}.admin-section-bar p{margin:0;color:#9d9d9d;font-size:12px;line-height:1.45}.admin-refresh-btn{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:7px 11px;border:1px solid #383838;border-radius:8px;background:#202020;color:#ddd;font-weight:750;cursor:pointer}.admin-refresh-btn:hover{border-color:#555;background:#282828;color:#fff}.admin-refresh-btn .icon{width:15px;height:15px}
.admin-page-v2 .admin-body{display:grid;gap:15px}.admin-page-v2 .admin-card{margin:0!important;border:1px solid #2b2b2b!important;border-radius:13px!important;background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,0) 90px),#181818!important;box-shadow:none!important;padding:19px!important}.admin-page-v2 .admin-card-head{gap:16px}.admin-page-v2 .admin-card-head h2{font-size:16px}.admin-page-v2 .admin-card-head p{max-width:820px;line-height:1.45}.admin-overview-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);gap:15px}.admin-page-v2 .admin-stats{margin:0!important}.admin-page-v2 .admin-stat{border-color:#2d2d2d!important;border-radius:11px!important;background:#1c1c1c!important}.admin-page-v2 .admin-action-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.admin-page-v2 .admin-action-card{min-height:76px;border-radius:10px}.admin-card-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding-top:13px;border-top:1px solid #292929}.admin-card-actions>small{color:#777}.admin-diagnostics-card{min-height:126px}.admin-inline-loading{display:flex;align-items:center;gap:10px;min-height:52px;color:#8e8e8e}.admin-inline-spinner{width:16px;height:16px;border:2px solid #444;border-top-color:var(--accent);border-radius:50%;animation:admin-spin .75s linear infinite}@keyframes admin-spin{to{transform:rotate(360deg)}}
.admin-section-skeleton{display:grid;gap:16px;min-height:360px;padding:4px 0}.admin-section-skeleton>small{color:#686868}.admin-skeleton-line,.admin-skeleton-grid i,.admin-skeleton-card b,.admin-skeleton-card span{display:block;border-radius:8px;background:linear-gradient(100deg,#1d1d1d 20%,#282828 42%,#1d1d1d 64%);background-size:220% 100%;animation:admin-skeleton 1.15s ease-in-out infinite}.admin-skeleton-line{width:48%;height:24px}.admin-skeleton-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.admin-skeleton-grid i{height:92px}.admin-skeleton-card{display:grid;gap:13px;padding:20px;border:1px solid #292929;border-radius:13px}.admin-skeleton-card b{width:28%;height:18px}.admin-skeleton-card span{height:13px}.admin-skeleton-card span:nth-child(3){width:84%}.admin-skeleton-card span:nth-child(4){width:62%}@keyframes admin-skeleton{to{background-position:-120% 0}}
.admin-page-v2 .admin-table-wrap{border:1px solid #292929;border-radius:10px;background:#151515;overflow:auto}.admin-page-v2 .admin-table{margin:0}.admin-page-v2 .admin-table thead th{position:sticky;top:0;z-index:2;background:#1f1f1f!important;box-shadow:0 1px 0 #303030}.admin-page-v2 .admin-table tbody tr:last-child td{border-bottom:0}.admin-page-v2 .admin-table tbody tr:hover{background:#1d1d1d}.admin-page-v2 .admin-actions{gap:6px}
.update-workflow-card{overflow:hidden}.update-workflow{display:grid;grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr) 34px minmax(0,1fr);align-items:center;gap:4px}.update-workflow>i{height:2px;background:#333}.update-step{display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:10px;min-height:64px;padding:10px;border:1px solid #303030;border-radius:10px;background:#1d1d1d}.update-step>b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#303030;color:#aaa}.update-step span{display:grid;gap:3px}.update-step small{color:#828282;line-height:1.25}.update-step.complete{border-color:rgba(30,215,96,.27);background:rgba(30,215,96,.035)}.update-step.complete>b{background:var(--accent);color:#07150b}.update-step.active{border-color:#4a4a4a;background:#222}.update-step.active>b{background:#fff;color:#111}.update-step.attention{border-color:rgba(255,139,133,.38);background:rgba(255,95,87,.045)}.update-step.attention>b{background:#7c3432;color:#fff}.update-validation-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:11px;padding:10px 11px;border:1px solid #2d2d2d;border-radius:9px;background:#191919;color:#999;font-size:11px}.update-validation-meta>span{display:flex;align-items:center;gap:7px}.update-validation-meta .icon{width:14px;height:14px}.update-upload-progress{display:grid;gap:8px;margin:12px 0;padding:12px;border:1px solid #303030;border-radius:9px;background:#171717}.update-upload-progress.hidden{display:none}.update-upload-progress>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px}.update-upload-progress>small{color:#777}.update-progress-track{height:6px;border-radius:999px;background:#303030;overflow:hidden}.update-progress-track>i{display:block;width:0;height:100%;border-radius:inherit;background:var(--accent);transition:width .15s linear}
@media(max-width:1180px){.admin-workspace{grid-template-columns:198px minmax(0,1fr);gap:16px}.admin-overview-grid{grid-template-columns:1fr}.admin-page-v2 .admin-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.admin-page-v2{padding-inline:16px}.admin-command-header{align-items:flex-start;flex-direction:column}.admin-title-meta{justify-content:flex-start}.admin-workspace{grid-template-columns:1fr}.admin-nav-rail{position:sticky;top:0;z-index:10;display:block;max-height:none;padding:8px;border-radius:11px;background:rgba(20,20,20,.96);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow-x:auto}.admin-page-v2 .admin-tabs{flex-direction:row!important;width:max-content!important;min-width:100%}.admin-page-v2 .admin-tab-group-label,.admin-nav-foot{display:none!important}.admin-page-v2 .admin-tabs button{width:auto;min-width:max-content;justify-content:center;padding-inline:12px}.admin-page-v2 .admin-tabs button.active{box-shadow:inset 0 -3px 0 var(--accent)}.admin-section-bar{margin-top:2px}.admin-skeleton-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.admin-page-v2{padding:0 11px 28px}.admin-command-header h1{font-size:28px}.admin-section-bar{align-items:flex-start}.admin-section-bar p{max-width:75vw}.admin-refresh-btn span{display:none}.admin-page-v2 .admin-stats,.admin-page-v2 .admin-action-grid{grid-template-columns:1fr}.admin-page-v2 .admin-card{padding:15px!important}.admin-card-actions,.update-validation-meta{align-items:flex-start;flex-direction:column}.update-workflow{grid-template-columns:1fr;gap:6px}.update-workflow>i{width:2px;height:14px;margin-left:25px}.update-step{width:100%}.update-upload{align-items:stretch;flex-direction:column}.update-upload button{width:100%}.admin-skeleton-grid{grid-template-columns:1fr}.admin-skeleton-grid i{height:72px}}
@media(prefers-reduced-motion:reduce){.admin-inline-spinner,.admin-skeleton-line,.admin-skeleton-grid i,.admin-skeleton-card b,.admin-skeleton-card span{animation:none}}

/* 1.11.1 — Spotify-style infinite song loading */
.infinite-song-loader{min-height:48px;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 0 6px;color:#a7a7a7;font-size:13px}
.infinite-song-loader[data-state="idle"]{min-height:28px;padding:4px 0}
.infinite-song-spinner{display:none;width:18px;height:18px;border:2px solid rgba(255,255,255,.22);border-top-color:#fff;border-radius:50%;animation:sonicshelf-infinite-spin .72s linear infinite}
.infinite-song-loader[data-state="loading"] .infinite-song-spinner{display:inline-block}
.infinite-song-loader[data-state="idle"] .infinite-song-status{display:none}
.infinite-song-loader[data-state="error"]{min-height:56px;flex-wrap:wrap}
.infinite-song-retry{min-height:32px;padding:5px 12px;font-size:12px}
@keyframes sonicshelf-infinite-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.infinite-song-spinner{animation-duration:1.6s}}

.update-install-progress{display:grid;gap:12px;margin:14px 0;padding:16px;border:1px solid #343434;border-radius:12px;background:linear-gradient(180deg,#1b1b1b,#161616);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}.update-install-progress.hidden{display:none}.update-install-progress-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.update-install-progress-head>div{display:grid;gap:4px}.update-install-progress-head small{font-size:9px;letter-spacing:.14em;color:#767676}.update-install-progress-head strong{font-size:15px}.update-install-progress-head>b{font-size:24px;font-variant-numeric:tabular-nums;color:var(--accent)}.update-install-track{height:8px}.update-install-track>i{transition:width .35s ease}.update-progress-stages{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.update-progress-stages span{position:relative;padding:8px 5px;border:1px solid #2d2d2d;border-radius:7px;background:#191919;color:#696969;text-align:center;font-size:10px;font-weight:700;transition:.2s ease}.update-progress-stages span.complete{border-color:rgba(30,215,96,.2);background:rgba(30,215,96,.055);color:#9cd9ae}.update-progress-stages span.active{border-color:rgba(30,215,96,.48);background:rgba(30,215,96,.10);color:#fff}.update-install-progress p{margin:0;color:#a6a6a6;font-size:12px;line-height:1.45}.update-progress-item{display:block;max-width:100%;padding:7px 9px;border-radius:6px;background:#101010;color:#8e8e8e;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.update-progress-item.hidden,.update-recovery-state.hidden{display:none}.update-recovery-state{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:7px;background:rgba(255,167,38,.08);border:1px solid rgba(255,167,38,.22);color:#d8b879;font-size:11px}.update-recovery-state .icon{width:14px;height:14px}.update-install-progress.is-error{border-color:rgba(255,95,87,.4)}.update-install-progress.is-error .update-install-progress-head>b{color:#ff8b85}.update-install-progress.is-recovery{border-color:rgba(255,167,38,.35)}.update-install-progress.is-complete{border-color:rgba(30,215,96,.42)}
@media(max-width:680px){.update-progress-stages{grid-template-columns:repeat(3,minmax(0,1fr))}.update-install-progress{padding:13px}.update-install-progress-head>b{font-size:20px}}

/* Independent Application / Library backups */
.backup-boundary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.backup-boundary-grid>div{display:grid;gap:7px;padding:15px;border:1px solid #303030;background:#1d1d1d;border-radius:10px}
.backup-boundary-grid strong{display:flex;align-items:center;gap:8px;font-size:14px}
.backup-boundary-grid strong .icon{width:18px;height:18px;color:var(--accent)}
.backup-boundary-grid span{color:var(--muted);font-size:12px;line-height:1.55}
@media(max-width:760px){.backup-boundary-grid{grid-template-columns:1fr}}
.backup-operation-progress{margin:0 0 16px}.backup-operation-progress .backup-progress-stages{grid-template-columns:repeat(auto-fit,minmax(68px,1fr))}.backup-operation-progress.is-complete{box-shadow:0 0 0 1px rgba(30,215,96,.08),inset 0 1px 0 rgba(255,255,255,.025)}

/* the application 1.13.3 — maintenance-independent LIVE STATE transport. */
.live-state-kicker{display:flex!important;align-items:center;gap:6px;line-height:1}.live-state-kicker>i{width:7px;height:7px;flex:0 0 auto;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 rgba(30,215,96,.42);animation:live-state-pulse 1.8s ease-out infinite}.live-state-kicker>em{margin-left:2px;padding:3px 6px;border:1px solid rgba(30,215,96,.18);border-radius:999px;background:rgba(30,215,96,.055);color:#9bdcab;font-style:normal;font-size:8px;letter-spacing:.06em}.live-state-kicker>em.is-fallback{border-color:rgba(255,167,38,.24);background:rgba(255,167,38,.07);color:#d8b879}.update-install-progress.is-error .live-state-kicker>i{background:#ff8b85;box-shadow:none;animation:none}.update-install-progress.is-recovery .live-state-kicker>i{background:#d8b879}@keyframes live-state-pulse{0%{box-shadow:0 0 0 0 rgba(30,215,96,.42)}70%,100%{box-shadow:0 0 0 7px rgba(30,215,96,0)}}

/* 1.13.6 — unified desktop/mobile seek interaction.
   Coarse pointers get a Spotify-like forgiving touch target while the visible
   rail remains slim. JavaScript owns scrub coordinates, so WebKit/Chromium
   native range event ordering cannot fight the authoritative playback timeline. */
.seek-range{touch-action:none!important;overscroll-behavior:contain;-webkit-user-select:none;user-select:none}
@media (pointer:coarse){
  .mnp-seek .seek-range,.fullscreen-seek-row .seek-range{height:32px!important;background-size:100% 4px!important}
  .mnp-seek .seek-range::-webkit-slider-runnable-track,.fullscreen-seek-row .seek-range::-webkit-slider-runnable-track{height:4px!important}
  .mnp-seek .seek-range::-moz-range-track,.fullscreen-seek-row .seek-range::-moz-range-track{height:4px!important}
  .mnp-seek .seek-range::-webkit-slider-thumb,.fullscreen-seek-row .seek-range::-webkit-slider-thumb{display:block!important;opacity:1!important;width:16px!important;height:16px!important;margin-top:-6px!important}
  .mnp-seek .seek-range::-moz-range-thumb,.fullscreen-seek-row .seek-range::-moz-range-thumb{opacity:1!important;width:16px!important;height:16px!important}
  .mnp-seek .seek-range:active::-webkit-slider-thumb,.fullscreen-seek-row .seek-range:active::-webkit-slider-thumb{transform:scale(1.12)}
  .mnp-seek .seek-range:active::-moz-range-thumb,.fullscreen-seek-row .seek-range:active::-moz-range-thumb{transform:scale(1.12)}
}

/* the application 1.13.8 — Spotify-like unified seek rail.
   The input keeps a generous invisible interaction box while the visual rail
   stays thin. Default progress is neutral/bright, turns Spotify green only
   while interacting, and keyboard focus is indicated by the thumb/rail rather
   than a border or outline around the range control. */
.seek-range{
  --range-fill:#b3b3b3;
  --range-rest:#4d4d4d;
  height:20px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:linear-gradient(90deg,var(--range-fill) 0 var(--range-progress),var(--range-rest) var(--range-progress) 100%) center/100% 4px no-repeat!important;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:none;
}
.seek-range:focus,.seek-range:focus-visible{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
.seek-range:hover,.seek-range:focus-visible,.seek-range.is-scrubbing{
  --range-fill:var(--sp-green);
  --range-rest:#5e5e5e;
}
.seek-range::-webkit-slider-runnable-track{
  height:4px!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
}
.seek-range::-moz-range-track{
  height:4px!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
}
.seek-range::-moz-range-progress{height:4px!important;background:transparent!important}
.seek-range::-webkit-slider-thumb{
  appearance:none;
  width:12px!important;
  height:12px!important;
  margin-top:-4px!important;
  border:0!important;
  border-radius:50%!important;
  background:#fff!important;
  opacity:0!important;
  box-shadow:0 1px 4px rgba(0,0,0,.5)!important;
  transform:scale(.94);
  transition:opacity .09s linear,transform .09s ease!important;
}
.seek-range::-moz-range-thumb{
  width:12px!important;
  height:12px!important;
  border:0!important;
  border-radius:50%!important;
  background:#fff!important;
  opacity:0!important;
  box-shadow:0 1px 4px rgba(0,0,0,.5)!important;
  transform:scale(.94);
  transition:opacity .09s linear,transform .09s ease!important;
}
.seek-range:hover::-webkit-slider-thumb,.seek-range:focus-visible::-webkit-slider-thumb,.seek-range.is-scrubbing::-webkit-slider-thumb{opacity:1!important;transform:scale(1)!important}
.seek-range:hover::-moz-range-thumb,.seek-range:focus-visible::-moz-range-thumb,.seek-range.is-scrubbing::-moz-range-thumb{opacity:1!important;transform:scale(1)!important}
.seek-range.is-scrubbing{cursor:grabbing}
.seek-range.is-scrubbing::-webkit-slider-thumb{transform:scale(1.12)!important}
.seek-range.is-scrubbing::-moz-range-thumb{transform:scale(1.12)!important}
.seek-range:disabled{cursor:default;opacity:.48}
.seek-range:disabled::-webkit-slider-thumb,.seek-range:disabled::-moz-range-thumb{opacity:0!important}

@media (pointer:coarse){
  .seek-range,.mnp-seek .seek-range,.fullscreen-seek-row .seek-range{
    height:34px!important;
    background-size:100% 4px!important;
  }
  .seek-range::-webkit-slider-thumb,.mnp-seek .seek-range::-webkit-slider-thumb,.fullscreen-seek-row .seek-range::-webkit-slider-thumb{
    width:14px!important;height:14px!important;margin-top:-5px!important;opacity:0!important;
  }
  .seek-range::-moz-range-thumb,.mnp-seek .seek-range::-moz-range-thumb,.fullscreen-seek-row .seek-range::-moz-range-thumb{
    width:14px!important;height:14px!important;opacity:0!important;
  }
  .seek-range:focus-visible::-webkit-slider-thumb,.seek-range.is-scrubbing::-webkit-slider-thumb,
  .mnp-seek .seek-range:focus-visible::-webkit-slider-thumb,.mnp-seek .seek-range.is-scrubbing::-webkit-slider-thumb,
  .fullscreen-seek-row .seek-range:focus-visible::-webkit-slider-thumb,.fullscreen-seek-row .seek-range.is-scrubbing::-webkit-slider-thumb{opacity:1!important}
  .seek-range:focus-visible::-moz-range-thumb,.seek-range.is-scrubbing::-moz-range-thumb,
  .mnp-seek .seek-range:focus-visible::-moz-range-thumb,.mnp-seek .seek-range.is-scrubbing::-moz-range-thumb,
  .fullscreen-seek-row .seek-range:focus-visible::-moz-range-thumb,.fullscreen-seek-row .seek-range.is-scrubbing::-moz-range-thumb{opacity:1!important}
  /* Touch has no hover. Keep the rail neutral until the gesture starts. */
  .seek-range:hover{--range-fill:#b3b3b3;--range-rest:#4d4d4d}
  .seek-range.is-scrubbing,.seek-range:focus-visible{--range-fill:var(--sp-green);--range-rest:#5e5e5e}
}
.seek-range::-moz-focus-outer{border:0!important}

/* the application 1.13.9 — Spotify-style seek position preview.
   One fixed bubble is shared by desktop, mobile Now Playing and fullscreen.
   Mouse/pen hover is preview-only; touch shows it only while scrubbing. */
.seek-position-tooltip{
  position:fixed;
  z-index:10050;
  left:0;
  top:0;
  min-width:38px;
  padding:6px 8px;
  border:0;
  border-radius:4px;
  background:#282828;
  color:#fff;
  box-shadow:0 4px 14px rgba(0,0,0,.45);
  font-size:12px;
  line-height:16px;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  text-align:center;
  white-space:nowrap;
  pointer-events:none;
  user-select:none;
  opacity:0;
  visibility:hidden;
  transform:translate(-50%,-100%) scale(.96);
  transform-origin:50% 100%;
  transition:opacity .06s linear,transform .06s ease,visibility 0s linear .06s;
  will-change:left,top,transform,opacity;
}
.seek-position-tooltip.is-visible{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,-100%) scale(1);
  transition:opacity .06s linear,transform .06s ease,visibility 0s;
}
@media (pointer:coarse){
  .seek-position-tooltip{min-width:42px;padding:7px 9px;border-radius:5px;font-size:12px;line-height:17px;box-shadow:0 5px 18px rgba(0,0,0,.5)}
}
@media (prefers-reduced-motion:reduce){.seek-position-tooltip{transition:none!important}}

/* 1.14.0 — portable Library Export / Import */
.library-portability-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:4px}
.library-portability-pane{display:grid;align-content:start;gap:10px;padding:16px;border:1px solid #303030;border-radius:12px;background:#1b1b1b;min-width:0}
.library-portability-pane>strong{display:flex;align-items:center;gap:8px;font-size:14px}.library-portability-pane>strong .icon{width:18px;height:18px;color:var(--accent)}
.library-portability-pane p,.library-portability-pane li{color:var(--muted);font-size:12px;line-height:1.55}.library-portability-pane p{margin:0}.library-portability-pane ul{margin:0;padding-left:18px;display:grid;gap:4px}
.library-import-form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px;margin-top:2px}.library-import-form label{display:grid;gap:7px;color:#b9b9b9;font-size:11px;font-weight:700}.library-import-form input[type=file]{width:100%;min-width:0;padding:9px;border:1px solid #343434;border-radius:8px;background:#111;color:#ddd}
.library-portability-card code{font-size:11px;color:#c8c8c8}
@media(max-width:820px){.library-portability-grid{grid-template-columns:1fr}.library-import-form{grid-template-columns:1fr}.library-import-form button{width:100%}}

/* the application 1.14.1 — Spotify-style unified touch/tap player gestures.
   Track swipes follow the finger, snap by distance/velocity and spring back at
   queue boundaries. Seek ranges keep exclusive ownership of their gestures. */
.spotify-track-swipe-stage{
  position:relative;isolation:isolate;overflow:hidden;touch-action:none!important;
  -webkit-user-select:none;user-select:none;contain:layout paint;will-change:transform;
}
.spotify-track-swipe-stage>.mnp-cover,
.spotify-track-swipe-stage>.fullscreen-player-cover,
.spotify-track-swipe-stage>.spotify-swipe-ghost{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  max-width:none!important;max-height:none!important;margin:0!important;will-change:transform,opacity;
  transform:translate3d(0,0,0);backface-visibility:hidden;
}
.spotify-track-swipe-stage>.spotify-swipe-ghost{display:grid;place-items:center;background:#282828;opacity:0;pointer-events:none;z-index:1}
.spotify-track-swipe-stage>.spotify-swipe-ghost.prev{transform:translate3d(calc(-100% - 18px),0,0)}
.spotify-track-swipe-stage>.spotify-swipe-ghost.next{transform:translate3d(calc(100% + 18px),0,0)}
.spotify-track-swipe-stage>.spotify-swipe-ghost img{width:100%;height:100%;object-fit:cover;display:block}
.spotify-track-swipe-stage>.spotify-swipe-ghost>.icon{width:28%;height:28%;color:#8c8c8c}
.spotify-track-swipe-stage>.mnp-cover,.spotify-track-swipe-stage>.fullscreen-player-cover{z-index:2}
.spotify-track-swipe-stage.is-settling>.mnp-cover,
.spotify-track-swipe-stage.is-settling>.fullscreen-player-cover,
.spotify-track-swipe-stage.is-settling>.spotify-swipe-ghost{
  transition:transform .205s cubic-bezier(.2,.72,.2,1),opacity .18s linear!important;
}
.spotify-track-swipe-stage.is-resetting>*{transition:none!important}

@media(max-width:820px){
  #miniNowPlaying{touch-action:none!important;will-change:transform,opacity;transform:translate3d(0,0,0)}
  #miniNowPlaying.spotify-mini-swipe-settling{transition:transform .16s cubic-bezier(.2,.72,.2,1),opacity .13s linear!important}
  #miniNowPlaying.spotify-mini-swipe-reset{transition:none!important}
  .mnp-swipe-stage{width:min(100%,440px,52dvh);aspect-ratio:1;margin:0 auto;border-radius:8px;box-shadow:0 24px 58px rgba(0,0,0,.42)}
  .mnp-swipe-stage>.mnp-cover{border-radius:inherit;box-shadow:none!important}
  .mnp-swipe-stage>.spotify-swipe-ghost{border-radius:inherit}
  .mobile-now-playing.spotify-dismiss-dragging{transition:none!important;will-change:transform,opacity,border-radius;box-shadow:0 -12px 60px rgba(0,0,0,.58)}
  .mobile-now-playing.spotify-dismiss-settling{transition:transform .24s cubic-bezier(.2,.72,.2,1),opacity .2s linear,border-radius .24s ease!important;will-change:transform,opacity}
  .mnp-head,.mnp-swipe-stage{touch-action:none!important}
  .mnp-meta-row,.mnp-actions{touch-action:pan-y}
  .mnp-cover{width:100%!important;height:100%!important}
  @media(max-width:560px){.mnp-swipe-stage{width:min(100%,410px,49dvh)}}
  @media(max-width:390px){.mnp-swipe-stage{width:min(100%,360px,47dvh)}}
  @media(orientation:landscape) and (max-height:500px){.mnp-swipe-stage{grid-row:1/4;width:min(34vh,240px);align-self:center}.mnp-cover{grid-row:auto!important}}
}

.fullscreen-swipe-stage{width:min(48vh,520px);height:min(48vh,520px);max-width:min(72vw,520px);max-height:min(72vw,520px);aspect-ratio:1;border-radius:7px;box-shadow:0 30px 90px rgba(0,0,0,.55)}
.fullscreen-swipe-stage>.fullscreen-player-cover{border-radius:inherit;box-shadow:none!important}
.fullscreen-swipe-stage>.spotify-swipe-ghost{border-radius:inherit;background:linear-gradient(135deg,#343434,#131313)}
@media(max-width:820px){.fullscreen-swipe-stage{width:min(50vh,78vw);height:min(50vh,78vw);max-width:78vw;max-height:78vw}}
@media(max-height:650px) and (min-width:821px){.fullscreen-swipe-stage{grid-row:1/5;width:min(44vh,430px);height:min(44vh,430px);align-self:center}.fullscreen-player-cover{grid-row:auto!important}}

/* Spotify-like tap feedback on touch hardware: immediate visual response, no
   delayed browser highlight, while keeping every control's existing action. */
@media(pointer:coarse){
  .player-bar button,.mnp-head button,.mnp-transport button,.mnp-actions button,
  .fullscreen-player button,.queue-mobile-player button,.devices-panel button{
    -webkit-tap-highlight-color:transparent;touch-action:manipulation;
    transition:transform .11s cubic-bezier(.2,.7,.2,1),opacity .11s ease,color .11s ease!important;
  }
  .player-bar button:active,.mnp-head button:active,.mnp-transport button:active,.mnp-actions button:active,
  .fullscreen-player button:active,.queue-mobile-player button:active,.devices-panel button:active{
    transform:scale(.91)!important;opacity:.8;
  }
  .mnp-play-main:active,.fullscreen-play-main:active,.queue-play-main:active{transform:scale(.94)!important;opacity:.9}
}
@media(prefers-reduced-motion:reduce){
  .spotify-track-swipe-stage.is-settling>*,#miniNowPlaying.spotify-mini-swipe-settling,.mobile-now-playing.spotify-dismiss-settling{transition:none!important}
}

/* 1.14.3 — application-wide Spotify-style touch song controls. */
@media(pointer:coarse){
  .track-row,.queue-item,[data-card-kind="track"],[data-quick-track],.add-track-row[data-add-track],.library-item-row[data-library-kind],[data-library-card]{
    touch-action:pan-y;
    -webkit-tap-highlight-color:transparent;
  }
  .track-row.sonic-touch-swiping,.queue-item.sonic-touch-swiping,[data-card-kind="track"].sonic-touch-swiping,[data-quick-track].sonic-touch-swiping,.add-track-row[data-add-track].sonic-touch-swiping,.library-item-row[data-library-kind].sonic-touch-swiping,[data-library-card].sonic-touch-swiping{
    user-select:none;-webkit-user-select:none;
  }
  .track-row.sonic-touch-swiping.sonic-touch-swipe-right,.queue-item.sonic-touch-swiping.sonic-touch-swipe-right,[data-card-kind="track"].sonic-touch-swiping.sonic-touch-swipe-right,[data-quick-track].sonic-touch-swiping.sonic-touch-swipe-right,.add-track-row[data-add-track].sonic-touch-swiping.sonic-touch-swipe-right,.library-item-row[data-library-kind].sonic-touch-swiping.sonic-touch-swipe-right,[data-library-card].sonic-touch-swiping.sonic-touch-swipe-right{
    box-shadow:inset 4px 0 0 var(--sp-green);
  }
  .track-row.sonic-touch-swiping.sonic-touch-swipe-left,.queue-item.sonic-touch-swiping.sonic-touch-swipe-left,[data-card-kind="track"].sonic-touch-swiping.sonic-touch-swipe-left,[data-quick-track].sonic-touch-swiping.sonic-touch-swipe-left,.add-track-row[data-add-track].sonic-touch-swiping.sonic-touch-swipe-left{
    box-shadow:inset -4px 0 0 var(--sp-green);
  }
}

/* 1.14.4 — Spotify-mobile touch routing and reliable swipe actions. */
@media (hover:none), (pointer:coarse){
  .track-row,.queue-item,[data-card-kind="track"],[data-quick-track],.add-track-row[data-add-track],.library-item-row[data-library-kind],[data-library-card]{
    touch-action:pan-y;
    -webkit-touch-callout:none;
    -webkit-tap-highlight-color:transparent;
  }
  /* Spotify mobile treats the artist subtitle inside a song row as part of the
     song tap/swipe target, not as a separate navigation link. Desktop keeps it. */
  .track-row .track-sub.link-btn{pointer-events:none;cursor:default;text-decoration:none!important;}
  .sonic-touch-swiping{translate:var(--sonic-touch-swipe-x,0px) 0;will-change:translate;}
}

/* the application 1.14.5 — Spotify-equivalent song swipe routing + Liked Songs fidelity. */
/* Swipe motion lives on the row itself, while the revealed action stays behind it.
   Use transform rather than the individual translate property for WebKit/table-row reliability. */
@media (hover:none), (pointer:coarse){
  .track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]{
    touch-action:pan-y;
    -webkit-touch-callout:none;
    -webkit-tap-highlight-color:transparent;
  }
  .track-row.sonic-touch-swiping,.track-row.sonic-touch-settling,.track-row.sonic-touch-committing,
  .queue-item.sonic-touch-swiping,.queue-item.sonic-touch-settling,.queue-item.sonic-touch-committing,
  .library-item-row[data-library-kind].sonic-touch-swiping,.library-item-row[data-library-kind].sonic-touch-settling,.library-item-row[data-library-kind].sonic-touch-committing,
  [data-library-card].sonic-touch-swiping,[data-library-card].sonic-touch-settling,[data-library-card].sonic-touch-committing{
    translate:none!important;
    transform:translate3d(var(--sonic-touch-swipe-x,0px),0,0)!important;
    will-change:transform;
    box-shadow:none!important;
  }
  .track-row.sonic-touch-swiping,.queue-item.sonic-touch-swiping,
  .library-item-row[data-library-kind].sonic-touch-swiping,[data-library-card].sonic-touch-swiping{
    transition:none!important;
    user-select:none;-webkit-user-select:none;
  }
  .track-row.sonic-touch-settling,.track-row.sonic-touch-committing,
  .queue-item.sonic-touch-settling,.queue-item.sonic-touch-committing,
  .library-item-row[data-library-kind].sonic-touch-settling,.library-item-row[data-library-kind].sonic-touch-committing,
  [data-library-card].sonic-touch-settling,[data-library-card].sonic-touch-committing{
    transition:transform .17s cubic-bezier(.2,.72,.2,1)!important;
  }

  /* Spotify-style contextual action reveal. Unsupported directions deliberately show no action. */
  .track-row[data-sonic-swipe-action],.queue-item[data-sonic-swipe-action],
  .library-item-row[data-library-kind][data-sonic-swipe-action],[data-library-card][data-sonic-swipe-action]{
    --sonic-swipe-bg:var(--sp-green);--sonic-swipe-fg:#07140a;
  }
  :is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card])[data-sonic-swipe-action="remove"]{
    --sonic-swipe-bg:#e91429;--sonic-swipe-fg:#fff;
  }
  .track-row[data-sonic-swipe-action] .track-main{position:relative;overflow:visible!important}
  .track-row.sonic-touch-swipe-right[data-sonic-swipe-action] .track-main::before{
    content:var(--sonic-touch-label);position:absolute;right:100%;top:-8px;bottom:-8px;width:110px;
    display:flex;align-items:center;justify-content:center;padding:0 10px;box-sizing:border-box;
    background:var(--sonic-swipe-bg);color:var(--sonic-swipe-fg);font-size:12px;font-weight:800;white-space:nowrap;
    pointer-events:none;
  }
  .track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions{position:relative;overflow:visible!important}
  .track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions::after{
    content:var(--sonic-touch-label);position:absolute;left:100%;top:0;bottom:0;width:110px;
    display:flex;align-items:center;justify-content:center;padding:0 10px;box-sizing:border-box;
    background:var(--sonic-swipe-bg);color:var(--sonic-swipe-fg);font-size:12px;font-weight:800;white-space:nowrap;
    pointer-events:none;
  }
  .queue-item,.library-item-row[data-library-kind],[data-library-card]{position:relative}
  .queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
  .library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
  [data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before{
    content:var(--sonic-touch-label);position:absolute;right:100%;top:0;bottom:0;width:110px;
    display:flex;align-items:center;justify-content:center;background:var(--sonic-swipe-bg);color:var(--sonic-swipe-fg);
    font-size:12px;font-weight:800;white-space:nowrap;pointer-events:none;
  }
  .queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after{
    content:var(--sonic-touch-label);position:absolute;left:100%;top:0;bottom:0;width:110px;
    display:flex;align-items:center;justify-content:center;background:var(--sonic-swipe-bg);color:var(--sonic-swipe-fg);
    font-size:12px;font-weight:800;white-space:nowrap;pointer-events:none;
  }

  /* Artist subtitles remain desktop links but are part of the row gesture target on touch. */
  .track-row .track-sub.link-btn{pointer-events:none!important;cursor:default!important;text-decoration:none!important}
}

/* Liked Songs — desktop follows Spotify's playlist hero, action rail and sortable list. */
.spotify-liked-page{min-width:0}
.spotify-liked-hero{margin:-22px -24px 0;padding-left:24px;padding-right:24px;padding-top:88px;background:linear-gradient(180deg,#5139a6 0%,#3a2977 62%,#211b36 100%)!important}
.spotify-liked-hero .liked-art{display:grid!important;place-items:center;background:linear-gradient(135deg,#450af5 0%,#8c70ec 52%,#c4efd9 100%)!important;box-shadow:0 4px 60px rgba(0,0,0,.5)}
.spotify-liked-hero .liked-art .hero-icon{width:34%;height:34%;color:#fff;fill:#fff}
.liked-owner-meta{display:flex!important;align-items:center;gap:6px;margin:0!important;color:#fff!important}
.liked-owner-avatar{width:24px;height:24px;flex:0 0 24px;border-radius:50%;display:grid;place-items:center;background:#535353;color:#fff;font-size:11px;font-weight:800}
.liked-meta-dot{opacity:.9}.liked-mobile-count{display:none}
.spotify-liked-toolbar{min-height:92px!important;padding:18px 0 10px!important;align-items:center!important;border:0}
.liked-primary-actions{gap:15px!important}.liked-primary-actions .liked-play-btn{width:56px!important;height:56px!important;min-width:56px!important;min-height:56px!important}
.liked-primary-actions .spotify-icon-action{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;color:#b3b3b3}
.liked-primary-actions .spotify-icon-action:hover{color:#fff;transform:scale(1.04)}
.liked-primary-actions .liked-shuffle-btn.active{color:var(--sp-green)!important}
.liked-list-tools{align-items:center!important}
.liked-sort-caption{display:none}
.liked-column-sort{display:inline-flex;align-items:center;height:36px;padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;text-align:left}
.liked-column-sort:hover{color:#fff;text-decoration:none}
.liked-duration-sort{width:100%;justify-content:center}.liked-duration-sort .icon{width:16px;height:16px}
.track-table-liked thead th:nth-child(2),.track-table-liked thead th:nth-child(3),.track-table-liked thead th:nth-child(4){cursor:default}
.track-table-liked tbody tr.current-track .track-name{color:var(--sp-green)!important}

@media (max-width:820px){
  /* Mobile Liked Songs is intentionally not a scaled-down desktop hero. */
  .spotify-liked-page{margin:calc(-1 * (74px + env(safe-area-inset-top))) -14px 0;min-height:100%;background:#121212}
  .spotify-liked-hero{
    margin:0!important;min-height:265px!important;padding:calc(92px + env(safe-area-inset-top)) 18px 22px!important;
    display:flex!important;align-items:flex-end!important;background:linear-gradient(180deg,#4368e8 0%,#30478e 44%,#171a23 82%,#121212 100%)!important;
  }
  .spotify-liked-hero .liked-art{display:none!important}
  .spotify-liked-hero .hero-copy{width:100%;align-self:flex-end!important;padding:0!important}
  .spotify-liked-hero .liked-playlist-type,.spotify-liked-hero .liked-owner-meta{display:none!important}
  .spotify-liked-hero h1{margin:0 0 6px!important;padding:0!important;font-size:30px!important;line-height:1.08!important;font-weight:800!important;letter-spacing:-.8px!important;white-space:nowrap!important;text-wrap:nowrap!important}
  .liked-mobile-count{display:block!important;margin:0!important;color:#b3b3b3!important;font-size:13px!important;line-height:18px!important;font-weight:400!important}

  .spotify-liked-toolbar{margin:0!important;min-height:0!important;padding:4px 14px 7px!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px!important;background:#121212}
  .liked-primary-actions{display:grid!important;grid-template-columns:44px 44px minmax(0,1fr) 44px 58px!important;gap:6px!important;width:100%;height:64px;align-items:center!important}
  .liked-primary-actions .liked-download-btn{grid-column:1;grid-row:1;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;justify-self:start}
  .liked-primary-actions .liked-more-btn{grid-column:2;grid-row:1;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;justify-self:start}
  .liked-primary-actions .liked-shuffle-btn{grid-column:4;grid-row:1;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;justify-self:end}
  .liked-primary-actions .liked-play-btn{grid-column:5;grid-row:1;width:56px!important;height:56px!important;min-width:56px!important;min-height:56px!important;justify-self:end}

  .liked-list-tools{width:100%!important;min-height:44px;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;margin:0!important;overflow:visible}
  .liked-list-tools .spotify-list-filter{width:40px!important;min-width:40px;background:transparent!important;flex:0 0 auto!important;border-radius:4px!important}
  .liked-list-tools .spotify-list-filter.open{width:min(100%,300px)!important;flex:1 1 auto!important;background:#242424!important}
  .liked-list-tools .spotify-list-filter:not(.open) input,.liked-list-tools .spotify-list-filter:not(.open) .spotify-list-filter-clear{display:none!important}
  .liked-list-tools .spotify-list-filter.open input{display:block!important;flex:1 1 auto!important;width:auto!important;opacity:1!important;min-width:0!important}
  .liked-list-tools .spotify-filter-chip{height:32px!important;padding:0 12px!important;flex:0 0 auto}
  .liked-list-tools .spotify-filter-chip span{display:inline!important}
  .liked-filter-count{display:none!important}
  .liked-sort-control{margin-left:auto!important;flex:0 0 auto!important;height:40px}
  .liked-sort-control .spotify-sort-select{height:40px!important;min-width:40px;max-width:145px;background:transparent!important}
  .liked-sort-control .spotify-sort-select:hover{background:transparent!important}
  .liked-sort-control .liked-sort-caption{display:block;max-width:108px;padding-left:4px;color:#b3b3b3;font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
  .liked-sort-control .spotify-sort-select select{position:absolute;inset:0;width:100%!important;max-width:none!important;opacity:0!important;padding:0!important;cursor:pointer}
  .liked-sort-control .spotify-sort-select>.icon{position:static!important;width:14px;height:14px;margin:0 5px;color:#b3b3b3}
  .liked-sort-control>#likedSortDirection{display:none!important}

  .spotify-liked-page .spotify-track-table-wrap{padding:0 6px 22px;background:#121212;overflow:visible}
  .spotify-liked-page .track-table-liked tbody tr.track-row{height:64px!important;min-height:64px!important}
  .spotify-liked-page .track-table-liked tbody td.track-main{padding-left:8px!important}
  .spotify-liked-page .track-table-liked .track-title-cell{gap:12px!important}
  .spotify-liked-page .track-table-liked .track-title-cell .mini-cover{width:48px!important;height:48px!important;min-width:48px!important;flex-basis:48px!important;border-radius:2px!important}
  .spotify-liked-page .track-table-liked .track-name{font-size:16px!important;line-height:21px!important;font-weight:400!important}
  .spotify-liked-page .track-table-liked .track-subline .track-sub{font-size:13px!important;line-height:18px!important;color:#b3b3b3!important}
  .spotify-liked-page .track-table-liked .row-actions{width:48px!important;padding-right:4px!important}
  .spotify-liked-page .track-table-liked .row-more{opacity:1!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;color:#b3b3b3!important}
  .spotify-liked-page .track-table-liked .row-more .icon{width:20px!important;height:20px!important}
  .spotify-liked-page .liked-filter-empty{margin-inline:14px}
}

@media (max-width:560px){
  .liked-list-tools .spotify-filter-chip span{display:none!important}
  .liked-sort-control .liked-sort-caption{max-width:92px}
}

@media (prefers-reduced-motion:reduce){
  :is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-settling,
  :is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-committing{transition:none!important}
}


/* the application 1.14.6 — Spotify playlist/Liked Songs interaction + collection fidelity. */
.spotify-collection-page{min-width:0;background:#121212}
.spotify-collection-toolbar{
  min-height:92px;margin:0!important;padding:18px 0 10px!important;
  display:flex!important;align-items:center!important;justify-content:space-between;gap:20px;border:0!important;
}
.spotify-collection-toolbar .collection-primary-actions{display:flex;align-items:center;gap:14px;min-width:0}
.spotify-collection-toolbar .collection-play-btn{width:56px!important;height:56px!important;min-width:56px!important;min-height:56px!important;flex:0 0 56px}
.spotify-collection-toolbar .spotify-icon-action{
  width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;
  padding:0!important;display:grid!important;place-items:center;color:#b3b3b3;background:transparent!important
}
.spotify-collection-toolbar .spotify-icon-action .icon{width:22px;height:22px}
.spotify-collection-toolbar .spotify-icon-action:hover{color:#fff!important;transform:scale(1.04);background:transparent!important}
.spotify-collection-toolbar .collection-shuffle-btn.active{color:var(--sp-green)!important}
.spotify-collection-tools{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0;margin-left:auto}
.spotify-mobile-pull-indicator{display:none}
.spotify-owner-avatar{
  width:24px;height:24px;flex:0 0 24px;border-radius:50%;display:grid;place-items:center;
  background:#535353;color:#fff;font-size:11px;font-weight:800
}
.spotify-playlist-meta{display:flex!important;align-items:center;gap:6px!important;color:#fff!important;margin:0!important}
.spotify-playlist-description{color:#b3b3b3!important;margin:0 0 8px!important;max-width:min(760px,70vw);white-space:normal}
.spotify-playlist-mobile-meta{display:none!important}
.spotify-playlist-hero{
  margin:-22px -24px 0!important;padding:88px 24px 24px!important;
  background:linear-gradient(180deg,#565656 0%,#3c3c3c 56%,#242424 100%)!important;
}
.spotify-playlist-hero .spotify-playlist-art{box-shadow:0 4px 60px rgba(0,0,0,.5)}
.spotify-playlist-hero .hero-copy small{text-transform:none!important}
.spotify-playlist-hero .hero-copy h1{margin-bottom:10px!important}
.spotify-playlist-toolbar{background:#121212}
.playlist-list-tools .spotify-list-filter{flex:0 1 auto}
.playlist-sort-caption{display:none}
.collection-column-sort{
  display:inline-flex;align-items:center;height:36px;padding:0;border:0;background:transparent;
  color:inherit;font:inherit;cursor:pointer;text-align:left
}
.collection-column-sort:hover{color:#fff;text-decoration:none}
.playlist-duration-sort,.liked-duration-sort{width:100%;justify-content:center}
.playlist-duration-sort .icon,.liked-duration-sort .icon{width:16px;height:16px}
.track-table-playlist tbody tr.current-track .track-name,.track-table-liked tbody tr.current-track .track-name{color:var(--sp-green)!important}
.playlist-mobile-edit-bar{display:none}

/* Swipe feedback: action availability is obvious before commit but doesn't
   replace the native vertical scroll gesture. */
@media (hover:none), (pointer:coarse){
  :is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-swipe-ready{
    --sonic-swipe-bg:var(--sp-green);--sonic-swipe-fg:#000;
  }
  :is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-swipe-ready[data-sonic-swipe-action="remove"]{
    --sonic-swipe-bg:#e91429;--sonic-swipe-fg:#fff;
  }
  :is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-swipe-ready[data-sonic-swipe-action="pin"]{
    --sonic-swipe-bg:#1ed760;--sonic-swipe-fg:#000;
  }
}

@media (max-width:820px){
  .spotify-collection-page{
    margin:calc(-1 * (74px + env(safe-area-inset-top))) -14px 0;
    min-height:100%;background:#121212;overscroll-behavior-y:auto;
  }

  /* Liked Songs retains the dedicated Spotify gradient collection identity. */
  .spotify-liked-hero{
    margin:0!important;min-height:260px!important;
    padding:calc(92px + env(safe-area-inset-top)) 18px 22px!important;
    background:linear-gradient(180deg,#466bea 0%,#324b98 44%,#1c2130 77%,#121212 100%)!important
  }

  /* User playlists use Spotify's compact mobile page composition: cover above
     the title, then owner/count metadata; desktop's oversized banner disappears. */
  .spotify-playlist-hero{
    margin:0!important;min-height:0!important;padding:calc(86px + env(safe-area-inset-top)) 18px 16px!important;
    display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:18px!important;
    background:linear-gradient(180deg,#393939 0%,#262626 48%,#171717 76%,#121212 100%)!important
  }
  .spotify-playlist-hero .spotify-playlist-art{
    width:min(54vw,220px)!important;height:min(54vw,220px)!important;flex:0 0 auto!important;
    align-self:center!important;border-radius:4px!important;box-shadow:0 10px 36px rgba(0,0,0,.48)!important
  }
  .spotify-playlist-hero .hero-copy{width:100%!important;padding:0!important;align-self:stretch!important}
  .spotify-playlist-hero .spotify-collection-type{display:none!important}
  .spotify-playlist-hero h1{
    margin:0 0 8px!important;padding:0!important;font-size:24px!important;line-height:1.15!important;
    letter-spacing:-.45px!important;font-weight:800!important;white-space:normal!important;text-wrap:balance!important
  }
  .spotify-playlist-description{
    margin:0 0 10px!important;max-width:none!important;color:#b3b3b3!important;font-size:13px!important;line-height:18px!important
  }
  .spotify-playlist-meta{font-size:13px!important;line-height:20px!important}
  .spotify-playlist-meta .spotify-owner-avatar{width:22px;height:22px;flex-basis:22px;font-size:10px}
  .spotify-playlist-mobile-meta{display:none!important}

  .spotify-collection-toolbar{
    min-height:0!important;padding:2px 14px 8px!important;margin:0!important;
    display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;background:#121212!important
  }
  .spotify-collection-toolbar .collection-primary-actions{width:100%;height:64px;gap:6px!important;align-items:center!important}
  .liked-primary-actions{
    display:grid!important;grid-template-columns:44px 44px minmax(0,1fr) 44px 58px!important
  }
  .liked-primary-actions .liked-download-btn{grid-column:1;grid-row:1}
  .liked-primary-actions .liked-more-btn{grid-column:2;grid-row:1}
  .liked-primary-actions .liked-shuffle-btn{grid-column:4;grid-row:1}
  .liked-primary-actions .liked-play-btn{grid-column:5;grid-row:1}
  .playlist-primary-actions{
    display:grid!important;grid-template-columns:44px 44px 44px minmax(0,1fr) 44px 58px!important
  }
  .playlist-primary-actions .playlist-download-btn{grid-column:1;grid-row:1}
  .playlist-primary-actions .playlist-add-btn{grid-column:2;grid-row:1}
  .playlist-primary-actions .playlist-more-btn{grid-column:3;grid-row:1}
  .playlist-primary-actions .playlist-shuffle-btn{grid-column:5;grid-row:1}
  .playlist-primary-actions .playlist-play-btn{grid-column:6;grid-row:1}
  .spotify-collection-toolbar .collection-play-btn{
    width:56px!important;height:56px!important;min-width:56px!important;min-height:56px!important;justify-self:end
  }
  .spotify-collection-toolbar .spotify-icon-action{
    width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;justify-self:start
  }
  .spotify-collection-toolbar .collection-shuffle-btn{justify-self:end}

  /* Spotify mobile hides playlist search/sort until the user pulls down. */
  .spotify-collection-tools{
    width:100%!important;max-height:0!important;min-height:0!important;overflow:hidden!important;
    opacity:0!important;transform:translateY(-8px);pointer-events:none!important;
    transition:max-height .18s ease,opacity .14s ease,transform .18s ease;
    display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;margin:0!important
  }
  .spotify-collection-page.filters-open .spotify-collection-tools{
    max-height:52px!important;min-height:44px!important;opacity:1!important;transform:none;pointer-events:auto!important;overflow:visible!important
  }
  .spotify-mobile-pull-indicator{
    height:0;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    opacity:0;overflow:visible;pointer-events:none;transform:translateY(var(--spotify-collection-pull,0px));
  }
  .spotify-mobile-pull-indicator span{width:34px;height:4px;border-radius:999px;background:#777}
  .spotify-mobile-pull-indicator small{color:#b3b3b3;font-size:11px;font-weight:600}
  .spotify-collection-page.collection-pull-ready .spotify-mobile-pull-indicator{height:28px;opacity:1}

  .spotify-collection-tools .spotify-list-filter{
    width:40px!important;min-width:40px!important;flex:0 0 40px!important;background:transparent!important;border-radius:4px!important
  }
  .spotify-collection-tools .spotify-list-filter.open{
    width:min(100%,300px)!important;flex:1 1 auto!important;background:#242424!important
  }
  .spotify-collection-tools .spotify-list-filter:not(.open) input,
  .spotify-collection-tools .spotify-list-filter:not(.open) .spotify-list-filter-clear{display:none!important}
  .spotify-collection-tools .spotify-list-filter.open input{
    display:block!important;flex:1 1 auto!important;width:auto!important;opacity:1!important;min-width:0!important
  }
  .spotify-collection-tools .spotify-view-sort{margin-left:auto!important;height:40px;flex:0 0 auto!important}
  .spotify-collection-tools .spotify-sort-select{height:40px!important;min-width:40px;max-width:150px;background:transparent!important}
  .spotify-collection-tools .spotify-sort-select:hover{background:transparent!important}
  .spotify-collection-tools :is(.liked-sort-caption,.playlist-sort-caption){
    display:block!important;max-width:104px;padding-left:4px;color:#b3b3b3;font-size:12px;font-weight:600;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none
  }
  .spotify-collection-tools .spotify-sort-select select{
    position:absolute;inset:0;width:100%!important;max-width:none!important;opacity:0!important;padding:0!important;cursor:pointer
  }
  .spotify-collection-tools .spotify-sort-select>.icon{position:static!important;width:14px;height:14px;margin:0 5px;color:#b3b3b3}
  .spotify-collection-tools :is(#likedSortDirection,#playlistSortDirection){display:none!important}

  .spotify-collection-page .spotify-track-table-wrap{padding:0 6px 24px!important;background:#121212;overflow:visible}
  .spotify-collection-page :is(.track-table-liked,.track-table-playlist) tbody tr.track-row{height:64px!important;min-height:64px!important;border-radius:4px}
  .spotify-collection-page :is(.track-table-liked,.track-table-playlist) tbody td.track-main{padding-left:8px!important}
  .spotify-collection-page :is(.track-table-liked,.track-table-playlist) .track-title-cell{gap:12px!important}
  .spotify-collection-page :is(.track-table-liked,.track-table-playlist) .mini-cover{
    width:48px!important;height:48px!important;min-width:48px!important;flex-basis:48px!important;border-radius:2px!important
  }
  .spotify-collection-page :is(.track-table-liked,.track-table-playlist) .track-name{font-size:16px!important;line-height:21px!important;font-weight:400!important}
  .spotify-collection-page :is(.track-table-liked,.track-table-playlist) .track-sub{font-size:13px!important;line-height:18px!important;color:#b3b3b3!important}
  .spotify-collection-page :is(.track-table-liked,.track-table-playlist) .row-actions{width:48px!important;padding-right:4px!important}
  .spotify-collection-page :is(.track-table-liked,.track-table-playlist) .row-more{
    opacity:1!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;color:#b3b3b3!important
  }

  .playlist-mobile-edit-bar{
    min-height:58px;padding:8px 14px;display:flex!important;align-items:center;gap:10px;background:#181818;border-bottom:1px solid #282828
  }
  .playlist-mobile-edit-bar>div{min-width:0;display:flex;flex-direction:column;gap:2px}
  .playlist-mobile-edit-bar strong{font-size:14px;color:#fff}.playlist-mobile-edit-bar span{font-size:11px;color:#b3b3b3}
  .playlist-mobile-edit-bar button{
    margin-left:auto;min-width:62px;height:36px;padding:0 15px;border:0;border-radius:999px;background:#fff;color:#000;font-weight:800;cursor:pointer
  }
  .spotify-playlist-page.mobile-edit-mode .playlist-list-tools{display:none!important}
  .spotify-playlist-page.mobile-edit-mode .playlist-primary-actions{opacity:.55;pointer-events:none}
  .spotify-playlist-page.mobile-edit-mode .collection-reorder-enabled .row-more{display:none!important}
  .spotify-playlist-page.mobile-edit-mode .collection-reorder-enabled .row-action-grid{width:44px!important;grid-template-columns:44px!important}
  .spotify-playlist-page.mobile-edit-mode .collection-reorder-enabled .collection-reorder-grip{width:44px!important;height:44px!important}
}

@media (max-width:560px){
  .spotify-collection-tools :is(.liked-sort-caption,.playlist-sort-caption){max-width:88px}
  .spotify-playlist-hero .spotify-playlist-art{width:min(58vw,205px)!important;height:min(58vw,205px)!important}
}

@media (prefers-reduced-motion:reduce){
  .spotify-collection-tools{transition:none!important}
}

/* 1.14.6 playlist edit parity: mobile track removal + deliberate reorder hold. */
.playlist-edit-remove{display:none}
.collection-reorder-grip.holding,.track-row.reorder-hold-pending .collection-reorder-grip{color:#fff!important;transform:scale(1.06)}
.track-row.reorder-hold-pending{background:rgba(255,255,255,.035)!important}
@media (max-width:820px){
  .spotify-playlist-page.mobile-edit-mode .track-table-playlist .track-title-cell{gap:10px!important}
  .spotify-playlist-page.mobile-edit-mode .playlist-edit-remove{
    width:30px;height:30px;min-width:30px;min-height:30px;flex:0 0 30px;display:grid!important;place-items:center;
    padding:0;border:1px solid #6a6a6a;border-radius:50%;background:transparent;color:#fff;cursor:pointer
  }
  .spotify-playlist-page.mobile-edit-mode .playlist-edit-remove .icon{width:16px;height:16px;stroke-width:2}
  .spotify-playlist-page.mobile-edit-mode .playlist-edit-remove:active{transform:scale(.94);background:#2a2a2a}
  .spotify-playlist-page.mobile-edit-mode .track-main{padding-left:10px!important}
  .spotify-playlist-page.mobile-edit-mode .track-num{display:none!important}
  .spotify-playlist-page.mobile-edit-mode .row-save,.spotify-playlist-page.mobile-edit-mode .track-duration{display:none!important}
  .spotify-playlist-page.mobile-edit-mode .collection-reorder-grip{touch-action:none;user-select:none;-webkit-user-select:none}
  .spotify-playlist-page.mobile-edit-mode .track-row.dragging{background:#282828!important;box-shadow:0 7px 20px rgba(0,0,0,.34);position:relative;z-index:2}
}

/* Spotify mobile swipe affordance is an icon tile, not an exposed text command. */
@media (hover:none), (pointer:coarse){
  :is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card])[data-sonic-swipe-action]{--sonic-touch-symbol:'+'}
  :is(.track-row,.queue-item)[data-sonic-swipe-action="queue"]{--sonic-touch-symbol:'☷+'}
  :is(.track-row,.queue-item)[data-sonic-swipe-action="like"]{--sonic-touch-symbol:'♥'}
  :is(.track-row,.queue-item)[data-sonic-swipe-action="remove"]{--sonic-touch-symbol:'−'}
  :is(.library-item-row[data-library-kind],[data-library-card])[data-sonic-swipe-action="pin"]{--sonic-touch-symbol:'⌖'}
  .track-row.sonic-touch-swipe-right[data-sonic-swipe-action] .track-main::before,
  .track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions::after,
  .queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
  .queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after,
  .library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
  [data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before{
    content:var(--sonic-touch-symbol)!important;width:72px!important;padding:0!important;
    font-size:22px!important;font-weight:800!important;letter-spacing:-2px;line-height:1!important
  }
}

/* Playlist headers inherit a muted dominant artwork tone, matching Spotify's
   collection-specific banner treatment while preserving the application theming. */
.spotify-playlist-page{--spotify-collection-accent:#535353}
.spotify-playlist-hero{
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--spotify-collection-accent) 84%,#2b2b2b) 0%,
    color-mix(in srgb,var(--spotify-collection-accent) 58%,#242424) 56%,
    #242424 100%)!important
}
@media (max-width:820px){
  .spotify-playlist-hero{
    background:linear-gradient(180deg,
      color-mix(in srgb,var(--spotify-collection-accent) 78%,#252525) 0%,
      color-mix(in srgb,var(--spotify-collection-accent) 44%,#181818) 48%,
      #121212 88%)!important
  }
}

/* the application 1.14.7 — interruption-proof Spotify-style list swipes.
   `touch-action` must be present before pointerdown. Do not gate it behind a
   coarse-pointer media query: hybrid touch laptops and browser emulation often
   advertise a fine primary pointer even while the active PointerEvent is touch. */
.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]{
  touch-action:pan-y;
  -webkit-touch-callout:none;
  -webkit-tap-highlight-color:transparent;
}
.content,.queue-scroll{overscroll-behavior-x:contain}

/* Moving a CSS table row is still unreliable in parts of WebKit. Move the
   track cells as one visual unit instead; queue/library items are ordinary
   blocks and can be transformed directly. */
.track-row.sonic-touch-swiping,.track-row.sonic-touch-settling,.track-row.sonic-touch-committing{
  translate:none!important;
  transform:none!important;
  box-shadow:none!important;
}
.track-row.sonic-touch-swiping>td,.track-row.sonic-touch-settling>td,.track-row.sonic-touch-committing>td{
  transform:translate3d(var(--sonic-touch-swipe-x,0px),0,0)!important;
  will-change:transform;
}
.track-row.sonic-touch-swiping>td{transition:none!important}
.track-row.sonic-touch-settling>td,.track-row.sonic-touch-committing>td{
  transition:transform .17s cubic-bezier(.2,.72,.2,1)!important;
}
.queue-item.sonic-touch-swiping,.queue-item.sonic-touch-settling,.queue-item.sonic-touch-committing,
.library-item-row[data-library-kind].sonic-touch-swiping,.library-item-row[data-library-kind].sonic-touch-settling,.library-item-row[data-library-kind].sonic-touch-committing,
[data-library-card].sonic-touch-swiping,[data-library-card].sonic-touch-settling,[data-library-card].sonic-touch-committing{
  translate:none!important;
  transform:translate3d(var(--sonic-touch-swipe-x,0px),0,0)!important;
  will-change:transform;
  box-shadow:none!important;
}
:is(.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-swiping{transition:none!important}
:is(.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-settling,
:is(.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-committing{
  transition:transform .17s cubic-bezier(.2,.72,.2,1)!important;
}
:is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-swiping{
  user-select:none;-webkit-user-select:none;
}

/* The action reveal must work for the active touch pointer, not only when the
   device's primary-pointer media feature happens to say "coarse". */
.track-row[data-sonic-swipe-action],.queue-item[data-sonic-swipe-action],
.library-item-row[data-library-kind][data-sonic-swipe-action],[data-library-card][data-sonic-swipe-action]{
  --sonic-swipe-bg:var(--sp-green);--sonic-swipe-fg:#07140a;--sonic-touch-symbol:'+';
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="queue"]{--sonic-touch-symbol:'☷+'}
:is(.track-row,.queue-item)[data-sonic-swipe-action="like"]{--sonic-touch-symbol:'♥'}
:is(.track-row,.queue-item)[data-sonic-swipe-action="remove"]{--sonic-swipe-bg:#e91429;--sonic-swipe-fg:#fff;--sonic-touch-symbol:'−'}
:is(.library-item-row[data-library-kind],[data-library-card])[data-sonic-swipe-action="pin"]{--sonic-touch-symbol:'⌖'}
.track-row[data-sonic-swipe-action] .track-main{position:relative;overflow:visible!important}
.track-row.sonic-touch-swipe-right[data-sonic-swipe-action] .track-main::before{
  content:var(--sonic-touch-symbol)!important;position:absolute;right:100%;top:-8px;bottom:-8px;width:72px;
  display:flex;align-items:center;justify-content:center;padding:0;box-sizing:border-box;background:var(--sonic-swipe-bg);color:var(--sonic-swipe-fg);
  font-size:22px;font-weight:800;letter-spacing:-2px;line-height:1;white-space:nowrap;pointer-events:none;
}
.track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions{position:relative;overflow:visible!important}
.track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions::after{
  content:var(--sonic-touch-symbol)!important;position:absolute;left:100%;top:0;bottom:0;width:72px;
  display:flex;align-items:center;justify-content:center;padding:0;box-sizing:border-box;background:var(--sonic-swipe-bg);color:var(--sonic-swipe-fg);
  font-size:22px;font-weight:800;letter-spacing:-2px;line-height:1;white-space:nowrap;pointer-events:none;
}
.queue-item,.library-item-row[data-library-kind],[data-library-card]{position:relative}
.queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
.library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
[data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
.queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after{
  content:var(--sonic-touch-symbol)!important;position:absolute;top:0;bottom:0;width:72px;display:flex;align-items:center;justify-content:center;
  background:var(--sonic-swipe-bg);color:var(--sonic-swipe-fg);font-size:22px;font-weight:800;letter-spacing:-2px;line-height:1;white-space:nowrap;pointer-events:none;
}
.queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
.library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
[data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before{right:100%}
.queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after{left:100%}

@media (prefers-reduced-motion:reduce){
  .track-row.sonic-touch-settling>td,.track-row.sonic-touch-committing>td,
  :is(.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-settling,
  :is(.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-committing{transition:none!important}
}
/* Chromium/WebKit can ignore touch-action inherited through table-row layout.
   Put pan-y on the actual table cells in the pointer hit-test chain as well. */
.track-row>td{touch-action:pan-y}

/* the application 1.14.8 — Spotify mobile swipe actions and Add-to-playlist sheet. */
:is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card])[data-sonic-swipe-action]{
  --sonic-swipe-circle:#1ed760;
  --sonic-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 7h8M5 12h8M5 17h5'/%3E%3Cpath d='M18 10v7M14.5 13.5h7'/%3E%3C/svg%3E");
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="queue"]{
  --sonic-swipe-circle:#1ed760;
  --sonic-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h9M4 11h9M4 16h6'/%3E%3Cpath d='M18 9v8M14 13h8'/%3E%3C/svg%3E");
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="playlist"]{
  --sonic-swipe-circle:#1ed760;
  --sonic-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.15' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6.5h9M4 11.5h9M4 16.5h6'/%3E%3Ccircle cx='18' cy='15' r='4.5'/%3E%3Cpath d='M18 12.8v4.4M15.8 15h4.4'/%3E%3C/svg%3E");
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="like"]{
  --sonic-swipe-circle:#1ed760;
  --sonic-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 20.6 10.65 19.4C5.86 15.08 2.7 12.22 2.7 8.72A5.05 5.05 0 0 1 7.8 3.6c1.62 0 3.18.76 4.2 1.95A5.56 5.56 0 0 1 16.2 3.6a5.05 5.05 0 0 1 5.1 5.12c0 3.5-3.16 6.36-7.95 10.69z'/%3E%3C/svg%3E");
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="remove"]{
  --sonic-swipe-circle:#e91429;
  --sonic-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E");
}
:is(.library-item-row[data-library-kind],[data-library-card])[data-sonic-swipe-action="pin"]{
  --sonic-swipe-circle:#1ed760;
  --sonic-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m8 4 8 0-1.2 5 2.7 2.6v1.4H6.5v-1.4L9.2 9zM12 13v7'/%3E%3C/svg%3E");
}
.track-row.sonic-touch-swipe-right[data-sonic-swipe-action] .track-main::before,
.track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions::after,
.queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
.queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after,
.library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
[data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before{
  content:""!important;
  width:42px!important;height:42px!important;top:50%!important;bottom:auto!important;
  border-radius:50%!important;padding:0!important;
  background-color:var(--sonic-swipe-circle)!important;
  background-image:var(--sonic-swipe-icon)!important;
  background-repeat:no-repeat!important;background-position:center!important;background-size:22px 22px!important;
  box-shadow:0 2px 9px rgba(0,0,0,.28)!important;
  opacity:var(--sonic-touch-icon-opacity,.22)!important;
  transform:translateY(-50%) scale(var(--sonic-touch-icon-scale,.72))!important;
  transform-origin:center!important;
  transition:transform .09s ease-out,opacity .09s linear,box-shadow .09s linear!important;
  pointer-events:none!important;
}
:is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-swipe-ready{
  --sonic-touch-icon-scale:1.08!important;--sonic-touch-icon-opacity:1!important;
}
:is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-swipe-ready[data-sonic-swipe-action]::before,
:is(.track-row,.queue-item).sonic-touch-swipe-ready[data-sonic-swipe-action]::after{
  box-shadow:0 3px 13px rgba(0,0,0,.34)!important;
}
.track-row.sonic-touch-swipe-right[data-sonic-swipe-action] .track-main::before{
  left:calc(16px - var(--sonic-touch-swipe-x,0px))!important;right:auto!important;
}
.track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions::after{
  right:calc(16px + var(--sonic-touch-swipe-x,0px))!important;left:auto!important;
}
.queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
.library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
[data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before{
  left:calc(16px - var(--sonic-touch-swipe-x,0px))!important;right:auto!important;
}
.queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after{
  right:calc(16px + var(--sonic-touch-swipe-x,0px))!important;left:auto!important;
}
.track-row.sonic-touch-swiping>td,.queue-item.sonic-touch-swiping,.library-item-row[data-library-kind].sonic-touch-swiping,[data-library-card].sonic-touch-swiping{
  cursor:grabbing;
}
.track-row.sonic-touch-settling>td,.track-row.sonic-touch-committing>td,
:is(.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-settling,
:is(.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-committing{
  transition:transform .19s cubic-bezier(.22,.78,.2,1)!important;
}

.modal-add-playlist{
  width:min(520px,calc(100vw - 32px));max-height:min(82dvh,720px);padding:0!important;overflow:hidden!important;
  background:#121212!important;border:1px solid #2a2a2a!important;border-radius:16px!important;color:#fff;
}
.spotify-add-playlist-sheet{display:flex;flex-direction:column;min-height:0;max-height:min(82dvh,720px);background:#121212}
.spotify-add-playlist-handle{display:none}
.spotify-add-playlist-head{display:grid;grid-template-columns:88px minmax(0,1fr) 88px;align-items:center;min-height:58px;padding:4px 12px;border-bottom:1px solid #242424;background:#121212}
.spotify-add-playlist-head h2{margin:0!important;text-align:center;font-size:18px;line-height:1.2;letter-spacing:-.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.modal-add-playlist .spotify-add-playlist-head button{justify-self:start;min-height:40px!important;padding:0 8px!important;border:0!important;background:transparent!important;color:#fff!important;border-radius:6px!important;font-size:14px;font-weight:600}
.spotify-add-playlist-new-wrap{display:flex;justify-content:center;padding:18px 18px 14px}
.modal-add-playlist .spotify-add-playlist-new{min-height:44px!important;padding:0 24px!important;border:0!important;border-radius:999px!important;background:#fff!important;color:#000!important;font-size:14px;font-weight:800}
.spotify-add-playlist-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:0 16px 12px}
.modal-add-playlist .spotify-add-playlist-search{display:flex;align-items:center;gap:9px;min-width:0;margin:0!important;padding:0 12px;border:0;border-radius:5px;background:#2a2a2a;color:#b3b3b3}
.spotify-add-playlist-search>.icon{width:19px;height:19px;flex:0 0 auto}
.modal-add-playlist .spotify-add-playlist-search input{width:100%;height:44px!important;min-height:44px!important;padding:0!important;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:#fff;font-size:14px}
.spotify-add-playlist-search input::placeholder{color:#b3b3b3}
.modal-add-playlist .spotify-add-playlist-sort{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:76px;min-height:44px!important;padding:0 12px!important;border:0!important;border-radius:5px!important;background:#2a2a2a!important;color:#fff!important;font-size:13px;font-weight:700}
.spotify-add-playlist-sort .icon{width:17px;height:17px}.spotify-add-playlist-sort.active{color:#1ed760!important}
.spotify-add-playlist-list{flex:1;min-height:120px;overflow:auto;overscroll-behavior:contain;padding:2px 8px 8px;scrollbar-width:thin;scrollbar-color:#4b4b4b transparent}
.spotify-add-playlist-list[aria-busy="true"]{opacity:.72}
.modal-add-playlist .spotify-add-playlist-row{display:grid;grid-template-columns:48px minmax(0,1fr) 30px;align-items:center;gap:12px;width:100%;min-height:64px!important;padding:8px!important;border:0!important;border-radius:6px!important;background:transparent!important;color:#fff!important;text-align:left}
.modal-add-playlist .spotify-add-playlist-row:hover:not(:disabled){background:#202020!important}.modal-add-playlist .spotify-add-playlist-row:disabled{opacity:.65;cursor:default}
.spotify-add-playlist-cover,.spotify-add-playlist-liked-cover{width:48px;height:48px;border-radius:4px;overflow:hidden;display:grid;place-items:center;background:#282828;color:#b3b3b3;box-shadow:0 3px 10px rgba(0,0,0,.22)}
.spotify-add-playlist-cover img{width:100%;height:100%;object-fit:cover}.spotify-add-playlist-cover .icon{width:22px;height:22px}
.spotify-add-playlist-liked-cover{background:linear-gradient(135deg,#450af5 0%,#8e8ee5 55%,#b8f3dc 100%);color:#fff}.spotify-add-playlist-liked-cover .icon{width:22px;height:22px}
.spotify-add-playlist-copy{display:grid;gap:3px;min-width:0}.spotify-add-playlist-copy strong,.spotify-add-playlist-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.spotify-add-playlist-copy strong{font-size:14px;line-height:1.25}.spotify-add-playlist-copy small{color:#b3b3b3;font-size:12px;font-weight:500}
.spotify-add-playlist-check{width:24px;height:24px;border:2px solid #a7a7a7;border-radius:50%;display:grid;place-items:center;justify-self:end;color:#000;transition:background .12s,border-color .12s,transform .12s}.spotify-add-playlist-check.selected{border-color:#1ed760;background:#1ed760;transform:scale(1.02)}.spotify-add-playlist-check .icon{width:15px;height:15px;stroke-width:2.5}
.spotify-add-playlist-empty{padding:34px 18px;text-align:center;color:#b3b3b3;font-size:13px}
.spotify-add-playlist-foot{display:flex;justify-content:center;padding:14px 18px calc(16px + env(safe-area-inset-bottom));border-top:1px solid #242424;background:#121212}
.modal-add-playlist .spotify-add-playlist-done{min-width:104px;min-height:46px!important;padding:0 24px!important;border:0!important;border-radius:999px!important;background:#1ed760!important;color:#000!important;font-size:14px;font-weight:850;letter-spacing:.1px}.modal-add-playlist .spotify-add-playlist-done:hover:not(:disabled){transform:scale(1.035);background:#1fdf64!important}.modal-add-playlist .spotify-add-playlist-done:disabled{background:#3a3a3a!important;color:#818181!important;transform:none}
.spotify-create-playlist-sheet{padding-bottom:4px}.modal-add-playlist-create form{padding:12px 22px 22px}.modal-add-playlist-create .modal-actions{margin-top:22px}

@media(max-width:820px){
  .modal-backdrop:has(.modal-add-playlist){place-items:end center;padding:0!important;background:rgba(0,0,0,.62)}
  .modal-add-playlist{width:100%!important;max-width:none!important;max-height:91dvh!important;border-left:0!important;border-right:0!important;border-bottom:0!important;border-radius:18px 18px 0 0!important}
  .spotify-add-playlist-sheet{max-height:91dvh}
  .spotify-add-playlist-handle{display:block;width:36px;height:4px;margin:8px auto 2px;border-radius:999px;background:#727272}
  .spotify-add-playlist-head{min-height:52px;padding-inline:10px}
  .spotify-add-playlist-new-wrap{padding-top:14px}
  .spotify-add-playlist-tools{padding-inline:12px}
  .spotify-add-playlist-list{padding-inline:4px}
  .modal-add-playlist .spotify-add-playlist-row{min-height:62px!important;padding:7px 10px!important}
  .spotify-add-playlist-foot{position:sticky;bottom:0;z-index:2}
}

/* the application 1.14.9 — Spotify mobile swipe glyph fidelity.
   Spotify reveals a flat action strip behind the translated song row. The glyph
   stays anchored near the moving edge instead of floating in a colored circle. */
:is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card])[data-sonic-swipe-action]{
  --sonic-spotify-swipe-bg:#1ed760;
  --sonic-spotify-swipe-icon:none;
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="queue"]{
  --sonic-spotify-swipe-bg:#1ed760;
  /* Spotify queue-add: plus + hooked first queue line + two horizontal lines. */
  --sonic-spotify-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M7.2 5.5v7.2M3.6 9.1h7.2' stroke='%23fff' stroke-width='2.7' stroke-linecap='round'/%3E%3Cpath d='M14 9.2h5.4c3.1 0 4.9 1.5 4.9 3.8s-1.8 3.8-4.9 3.8h-6.2' stroke='%23fff' stroke-width='2.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7.2 21h17.1M7.2 26h17.1' stroke='%23fff' stroke-width='2.7' stroke-linecap='round'/%3E%3C/svg%3E");
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="playlist"]{
  --sonic-spotify-swipe-bg:#1ed760;
  /* Spotify Add to playlist action: thin outlined circle with centered plus. */
  --sonic-spotify-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Ccircle cx='16' cy='16' r='10.2' stroke='%23fff' stroke-width='2.45'/%3E%3Cpath d='M16 10.8v10.4M10.8 16h10.4' stroke='%23fff' stroke-width='2.45' stroke-linecap='round'/%3E%3C/svg%3E");
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="like"]{
  --sonic-spotify-swipe-bg:#1ed760;
  /* Spotify quick-save confirmation glyph. */
  --sonic-spotify-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='10.7' fill='%23fff'/%3E%3Cpath d='m11.2 16.1 3.1 3.1 6.7-7' fill='none' stroke='%231ed760' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="remove"]{
  --sonic-spotify-swipe-bg:#f0374b;
  /* Spotify Queue swipe-left removal uses a trash-can glyph. */
  --sonic-spotify-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M9.5 10.7h13M13.1 10.7V8.4h5.8v2.3M11.2 13.2l.9 10.4h7.8l.9-10.4M14.4 15.2v5.9M17.6 15.2v5.9' stroke='%23000' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
:is(.library-item-row[data-library-kind],[data-library-card])[data-sonic-swipe-action="pin"]{
  --sonic-spotify-swipe-bg:#1ed760;
  --sonic-spotify-swipe-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M11 6.5h10l-1.4 6.3 3.2 3v1.8H9.2v-1.8l3.2-3L11 6.5ZM16 17.6v8' stroke='%23fff' stroke-width='2.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Table rows: the reveal is rendered by the first/last translated cell so it
   remains behind the row while all cells continue to move together. */
.track-row.sonic-touch-swipe-right[data-sonic-swipe-action] .track-main::before,
.track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions::after,
.queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
.queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after,
.library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
[data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before{
  content:""!important;
  position:absolute!important;
  width:144px!important;
  padding:0!important;
  box-sizing:border-box!important;
  background-color:var(--sonic-spotify-swipe-bg)!important;
  background-image:var(--sonic-spotify-swipe-icon)!important;
  background-repeat:no-repeat!important;
  background-size:31px 31px!important;
  opacity:1!important;
  box-shadow:none!important;
  transform:none!important;
  transition:none!important;
  pointer-events:none!important;
}
.track-row.sonic-touch-swipe-right[data-sonic-swipe-action] .track-main::before{
  top:-8px!important;bottom:-8px!important;right:100%!important;left:auto!important;
  background-position:right 28px center!important;
  border-radius:14px 0 0 14px!important;
}
.track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions::after{
  top:0!important;bottom:0!important;left:100%!important;right:auto!important;
  background-position:left 28px center!important;
  border-radius:0 14px 14px 0!important;
}
.queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
.library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
[data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before{
  top:0!important;bottom:0!important;right:100%!important;left:auto!important;
  background-position:right 28px center!important;
  border-radius:14px 0 0 14px!important;
}
.queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after{
  top:0!important;bottom:0!important;left:100%!important;right:auto!important;
  background-position:left 28px center!important;
  border-radius:0 14px 14px 0!important;
}

/* The Spotify glyph does not inflate into a separate bubble at the threshold.
   Keep only a subtle readiness cue by increasing glyph size a couple of pixels. */
:is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-swipe-ready[data-sonic-swipe-action]::before,
:is(.track-row,.queue-item).sonic-touch-swipe-ready[data-sonic-swipe-action]::after{
  background-size:33px 33px!important;
  box-shadow:none!important;
}
@media(prefers-reduced-motion:no-preference){
  .track-row.sonic-touch-swipe-right[data-sonic-swipe-action] .track-main::before,
  .track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions::after,
  .queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
  .queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after,
  .library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
  [data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before{
    transition:background-size .085s cubic-bezier(.2,.7,.2,1)!important;
  }
}

/* the application 1.14.10 — Spotify swipe geometry fidelity.
   Spotify does not expose a pre-sized action tile. The coloured action surface
   grows exactly with the finger displacement and its glyph stays centred in the
   exposed area. The song row is the rounded dark foreground card. */
:where(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card])[data-sonic-swipe-action]{
  --sonic-spotify-action-bg:#1ed760;
  --sonic-spotify-action-icon:none;
  --sonic-spotify-action-icon-size:31px;
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="queue"]{
  --sonic-spotify-action-bg:#1ed760;
  /* Spotify Queue: plus + hooked queue line + two list lines. */
  --sonic-spotify-action-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M7 5.5v7M3.5 9h7' stroke='%23fff' stroke-width='2.8' stroke-linecap='round'/%3E%3Cpath d='M14.2 9.2h6.4c3 0 4.8 1.55 4.8 3.95s-1.8 3.95-4.8 3.95h-6.9' stroke='%23fff' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7 21.6h18.4M7 27h18.4' stroke='%23fff' stroke-width='2.8' stroke-linecap='round'/%3E%3C/svg%3E");
  --sonic-spotify-action-icon-size:32px;
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="playlist"]{
  --sonic-spotify-action-bg:#1ed760;
  /* Spotify Add-to-playlist / save affordance: clean outlined + circle. */
  --sonic-spotify-action-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Ccircle cx='16' cy='16' r='10.7' stroke='%23fff' stroke-width='2.45'/%3E%3Cpath d='M16 10.4v11.2M10.4 16h11.2' stroke='%23fff' stroke-width='2.45' stroke-linecap='round'/%3E%3C/svg%3E");
  --sonic-spotify-action-icon-size:30px;
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="like"]{
  --sonic-spotify-action-bg:#1ed760;
  --sonic-spotify-action-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='10.8' fill='%23fff'/%3E%3Cpath d='m10.8 16.1 3.3 3.3 7.1-7.3' fill='none' stroke='%231ed760' stroke-width='2.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --sonic-spotify-action-icon-size:30px;
}
:is(.track-row,.queue-item)[data-sonic-swipe-action="remove"]{
  --sonic-spotify-action-bg:#f0374b;
  /* Current Spotify queue removal uses a black trash glyph on the red reveal. */
  --sonic-spotify-action-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M10 10.5h12M13.2 10.5V8.2h5.6v2.3M11.6 13l.9 10.5h7l.9-10.5M14.4 15.2v5.7M17.6 15.2v5.7' stroke='%23000' stroke-width='2.05' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --sonic-spotify-action-icon-size:29px;
}
:is(.library-item-row[data-library-kind],[data-library-card])[data-sonic-swipe-action="pin"]{
  --sonic-spotify-action-bg:#1ed760;
  --sonic-spotify-action-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M11 6.5h10l-1.4 6.3 3.2 3v1.8H9.2v-1.8l3.2-3L11 6.5ZM16 17.6v8' stroke='%23fff' stroke-width='2.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --sonic-spotify-action-icon-size:29px;
}

/* Reset the older fixed-width/floating affordances. */
.track-row.sonic-touch-swipe-right[data-sonic-swipe-action] .track-main::before,
.track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions::after,
.queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
.queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after,
.library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
[data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before{
  content:""!important;
  width:var(--sonic-touch-reveal,0px)!important;
  height:auto!important;
  min-width:0!important;
  min-height:0!important;
  max-height:none!important;
  padding:0!important;
  background-color:var(--sonic-spotify-action-bg)!important;
  background-image:var(--sonic-spotify-action-icon)!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:var(--sonic-spotify-action-icon-size) var(--sonic-spotify-action-icon-size)!important;
  opacity:1!important;
  transform:none!important;
  box-shadow:none!important;
  transition:none!important;
  pointer-events:none!important;
}

/* Table rows: the pseudo element is attached to the translated edge cell. Its
   width equals the current swipe displacement, so its stationary outer edge and
   moving inner edge reproduce Spotify's growing reveal exactly. */
/* 1.14.11: keep both swipe action reveals exactly as tall as the visible
   track-main cell. Do not bleed the action colour into the row's vertical
   spacing/padding above or below the track card. */
.track-row.sonic-touch-swipe-right[data-sonic-swipe-action] .track-main::before{
  top:0!important;bottom:0!important;right:100%!important;left:auto!important;
  border-radius:14px 0 0 14px!important;
}
.track-row.sonic-touch-swipe-left[data-sonic-swipe-action] .row-actions::after{
  top:0!important;bottom:0!important;left:100%!important;right:auto!important;
  border-radius:0 14px 14px 0!important;
}
.queue-item.sonic-touch-swipe-right[data-sonic-swipe-action]::before,
.library-item-row[data-library-kind].sonic-touch-swipe-right[data-sonic-swipe-action]::before,
[data-library-card].sonic-touch-swipe-right[data-sonic-swipe-action]::before{
  top:0!important;bottom:0!important;right:100%!important;left:auto!important;
  border-radius:14px 0 0 14px!important;
}
.queue-item.sonic-touch-swipe-left[data-sonic-swipe-action]::after{
  top:0!important;bottom:0!important;left:100%!important;right:auto!important;
  border-radius:0 14px 14px 0!important;
}

/* Spotify's foreground row is a dark rounded card while the swipe is active. */
.track-row:is(.sonic-touch-swiping,.sonic-touch-settling,.sonic-touch-committing)>td{
  background:#121212!important;
}
@media(max-width:820px){
  .track-row:is(.sonic-touch-swiping,.sonic-touch-settling,.sonic-touch-committing)>.track-main{
    border-radius:14px 0 0 14px!important;
  }
  .track-row:is(.sonic-touch-swiping,.sonic-touch-settling,.sonic-touch-committing)>.row-actions{
    border-radius:0 14px 14px 0!important;
  }
}
@media(min-width:821px){
  .track-row:is(.sonic-touch-swiping,.sonic-touch-settling,.sonic-touch-committing)>td:first-child{border-radius:14px 0 0 14px!important}
  .track-row:is(.sonic-touch-swiping,.sonic-touch-settling,.sonic-touch-committing)>td:last-child{border-radius:0 14px 14px 0!important}
}
.queue-item:is(.sonic-touch-swiping,.sonic-touch-settling,.sonic-touch-committing),
.library-item-row[data-library-kind]:is(.sonic-touch-swiping,.sonic-touch-settling,.sonic-touch-committing),
[data-library-card]:is(.sonic-touch-swiping,.sonic-touch-settling,.sonic-touch-committing){
  background:#121212!important;
  border-radius:14px!important;
}

/* No bubble growth/fade at the threshold: Spotify's icon keeps a fixed size;
   the reveal geometry itself communicates progress. */
:is(.track-row,.queue-item,.library-item-row[data-library-kind],[data-library-card]).sonic-touch-swipe-ready[data-sonic-swipe-action]::before,
:is(.track-row,.queue-item).sonic-touch-swipe-ready[data-sonic-swipe-action]::after{
  background-size:var(--sonic-spotify-action-icon-size) var(--sonic-spotify-action-icon-size)!important;
  box-shadow:none!important;
}


/* 1.14.12 — current Spotify shell navigation, interaction states and downloaded collections. */
@media (min-width:821px){
  /* Current desktop Spotify keeps Home beside the persistent search field and
     uses the left rail primarily for Your Library. */
  .sidebar>.main-nav{display:none!important}
  .topbar{justify-content:flex-start!important;gap:8px!important}
  .history-buttons{margin-right:auto}
  .spotify-top-home{display:grid!important;place-items:center;width:48px;height:48px;min-width:48px;padding:0;border:0;border-radius:50%;background:#1f1f1f;color:#b3b3b3;cursor:pointer;transition:background-color .12s ease,color .12s ease,transform .1s ease}
  .spotify-top-home .icon{width:24px;height:24px;stroke-width:1.9}
  .spotify-top-home:hover{background:#2a2a2a;color:#fff;transform:scale(1.04)}
  .spotify-top-home:active{transform:scale(.96)}
  .spotify-top-home.active{color:#fff}
  .top-search{flex:0 1 474px!important;margin-right:auto}
}
@media (max-width:820px){
  .spotify-top-home{display:none!important}
  .mobile-nav{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}

/* Spotify icon buttons have no chrome at rest; hover brightens/very slightly
   enlarges on pointer devices and touch compresses briefly. */
.spotify-icon-action,.collection-download-btn{border:0!important;background:transparent!important;box-shadow:none!important}
@media (hover:hover) and (pointer:fine){
  .spotify-icon-action:hover:not(:disabled){color:#fff!important;transform:scale(1.06)!important}
  .round-play:hover:not(:disabled){transform:scale(1.04)!important;filter:brightness(1.04)}
}
.spotify-icon-action:active:not(:disabled){transform:scale(.92)!important}
.round-play:active:not(:disabled){transform:scale(.94)!important}
.collection-download-btn.downloaded,.collection-download-btn.downloaded:hover{color:#1ed760!important}
.collection-download-btn.downloaded .icon{width:24px!important;height:24px!important}
.collection-download-btn:not(.downloaded) .icon{width:24px!important;height:24px!important;stroke-width:1.7!important}
.track-downloaded-mark{color:#1ed760!important}
.track-downloaded-mark .icon{width:14px!important;height:14px!important}
.spotify-filter-chip .icon use[href="#i-downloaded"]{color:#1ed760}


/* 1.14.12 — current Spotify control states and Home navigation fidelity. */
:root{--spotify-green:#1ed760;--spotify-muted:#b3b3b3;--spotify-press:.94}

/* Spotify desktop keeps Home and the persistent search field as one centered top cluster. */
@media (min-width:821px){
  .main-panel>.topbar{position:relative!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding-inline:16px 18px!important;gap:12px!important}
  .main-panel>.topbar>.history-buttons{margin:0!important;flex:0 0 auto;z-index:2}
  .spotify-top-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:8px;width:min(540px,calc(100% - 400px));min-width:320px;z-index:1}
  .spotify-top-center .spotify-top-home{flex:0 0 48px!important}
  .spotify-top-center .top-search{display:flex!important;flex:1 1 auto!important;min-width:0!important;max-width:none!important;margin:0!important}
  .main-panel>.topbar>.top-actions{margin-left:auto!important;z-index:2}
  .spotify-top-home{background:#1f1f1f!important;color:var(--spotify-muted)!important;box-shadow:none!important}
  .spotify-top-home:hover{background:#2a2a2a!important;color:#fff!important;transform:scale(1.04)!important}
  .spotify-top-home:active{transform:scale(.96)!important}
  .spotify-top-home.active{color:#fff!important}
  .spotify-top-home .icon{width:24px!important;height:24px!important}
}
@media (min-width:821px) and (max-width:1080px){
  .spotify-top-center{width:min(440px,calc(100% - 310px));min-width:280px}
  .user-pill>span:nth-child(2),.user-menu-chevron{display:none}
}
@media (max-width:820px){
  .spotify-top-center{display:contents}
  .spotify-top-home{display:none!important}
  .mobile-nav{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}

/* Icon-only music controls: transparent at rest, white on hover, slightly compressed on press. */
:is(.spotify-icon-action,.like-btn,.transport button,.player-extra button,.fullscreen-transport button,.fullscreen-player-actions button,.mnp-actions button,.queue-mobile-player button):not(.play-main):not(.fullscreen-play-main):not(.queue-play-main){
  -webkit-tap-highlight-color:transparent;
  transition:color .12s ease,transform .08s ease,opacity .12s ease!important;
}
@media (hover:hover) and (pointer:fine){
  :is(.spotify-icon-action,.like-btn,.transport button,.player-extra button,.fullscreen-transport button,.fullscreen-player-actions button,.mnp-actions button,.queue-mobile-player button):not(.play-main):not(.fullscreen-play-main):not(.queue-play-main):hover:not(:disabled){
    color:#fff!important;background:transparent!important;
  }
}
:is(.spotify-icon-action,.like-btn,.transport button,.player-extra button,.fullscreen-transport button,.fullscreen-player-actions button,.mnp-actions button,.queue-mobile-player button):not(.play-main):not(.fullscreen-play-main):not(.queue-play-main):active:not(:disabled){transform:scale(var(--spotify-press))!important}
:is(.spotify-icon-action,.like-btn,.transport button,.player-extra button,.fullscreen-transport button,.fullscreen-player-actions button,.mnp-actions button,.queue-mobile-player button):disabled{opacity:.35!important;cursor:default!important}

/* Save/Saved and Download/Downloaded use Spotify's current semantic states. */
:is(.like-btn,.row-save,.spotify-icon-action).active,
.row-save.liked,
.collection-download-btn.downloaded,
#fullscreenDownload.active{color:var(--spotify-green)!important}
:is(.like-btn,.row-save) .icon{width:20px!important;height:20px!important}
.row-save .icon{width:18px!important;height:18px!important}
.collection-download-btn .icon,#fullscreenDownload .icon{width:24px!important;height:24px!important}

/* Shuffle/repeat are green when enabled and show the small status dot used by Spotify. */
:is(#shuffleBtn,#repeatBtn,#mnpShuffle,#mnpRepeat,#queueShuffleBtn,#queueRepeatBtn,#fullscreenShuffle,#fullscreenRepeat,.liked-shuffle-btn,.playlist-shuffle-btn).active{position:relative;color:var(--spotify-green)!important}
:is(#shuffleBtn,#repeatBtn,#mnpShuffle,#mnpRepeat,#queueShuffleBtn,#queueRepeatBtn,#fullscreenShuffle,#fullscreenRepeat).active::after{
  content:"";position:absolute;left:50%;bottom:1px;width:4px;height:4px;border-radius:50%;background:var(--spotify-green);transform:translateX(-50%);pointer-events:none
}

/* Play is the one control that visibly grows on hover; press contracts from that state. */
:is(.round-play,.play-main,.fullscreen-play-main,.queue-play-main,.mnp-play-main){transition:transform .08s ease,filter .12s ease!important;box-shadow:none}
@media (hover:hover) and (pointer:fine){
  :is(.round-play,.play-main,.fullscreen-play-main,.queue-play-main,.mnp-play-main):hover:not(:disabled){transform:scale(1.06)!important;filter:brightness(1.03)!important}
}
:is(.round-play,.play-main,.fullscreen-play-main,.queue-play-main,.mnp-play-main):active:not(:disabled){transform:scale(.96)!important}

/* Current Spotify bottom nav does not paint a selected tile; only icon/text state changes. */
@media (max-width:820px){
  .mobile-nav{background:linear-gradient(180deg,rgba(18,18,18,.96),#000 58%)!important;border-top:0!important;padding-top:5px!important}
  .mobile-nav .nav-item{background:transparent!important;color:#a7a7a7!important;border-radius:0!important;transform:none!important;transition:color .12s ease,opacity .08s ease!important}
  .mobile-nav .nav-item.active{color:#fff!important}
  .mobile-nav .nav-item:active{opacity:.72!important;transform:none!important}
  .mobile-nav-ico.icon{width:24px!important;height:24px!important;stroke-width:1.9!important}
}

/* 1.14.12 — final shared Spotify music-button geometry. Keep application/admin
   form buttons unchanged; this targets only navigation/player/collection chrome. */
:is(.spotify-action-btn.spotify-icon-action,.entity-toolbar>.spotify-icon-action,.playlist-hero-actions>.spotify-icon-action,.collection-track-toolbar>.spotify-icon-action){
  width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;
  padding:8px!important;border:0!important;border-radius:50%!important;background:transparent!important;
  color:#b3b3b3!important;display:inline-grid!important;place-items:center!important;box-shadow:none!important;
}
:is(.spotify-action-btn.spotify-icon-action,.entity-toolbar>.spotify-icon-action,.playlist-hero-actions>.spotify-icon-action,.collection-track-toolbar>.spotify-icon-action) .icon{
  width:24px!important;height:24px!important;flex:0 0 24px!important;
}
:is(.spotify-action-btn.spotify-icon-action,.entity-toolbar>.spotify-icon-action,.playlist-hero-actions>.spotify-icon-action,.collection-track-toolbar>.spotify-icon-action).active,
:is(.spotify-action-btn.spotify-icon-action,.entity-toolbar>.spotify-icon-action,.playlist-hero-actions>.spotify-icon-action,.collection-track-toolbar>.spotify-icon-action).downloaded{
  color:var(--spotify-green)!important;
}
@media (hover:hover) and (pointer:fine){
  :is(.spotify-action-btn.spotify-icon-action,.entity-toolbar>.spotify-icon-action,.playlist-hero-actions>.spotify-icon-action,.collection-track-toolbar>.spotify-icon-action):hover:not(:disabled){
    color:#fff!important;background:transparent!important;transform:scale(1.04)!important;
  }
  :is(.spotify-action-btn.spotify-icon-action,.entity-toolbar>.spotify-icon-action,.playlist-hero-actions>.spotify-icon-action,.collection-track-toolbar>.spotify-icon-action).active:hover:not(:disabled),
  :is(.spotify-action-btn.spotify-icon-action,.entity-toolbar>.spotify-icon-action,.playlist-hero-actions>.spotify-icon-action,.collection-track-toolbar>.spotify-icon-action).downloaded:hover:not(:disabled){color:var(--spotify-green)!important}
}
:is(.spotify-action-btn.spotify-icon-action,.entity-toolbar>.spotify-icon-action,.playlist-hero-actions>.spotify-icon-action,.collection-track-toolbar>.spotify-icon-action):active:not(:disabled){transform:scale(.92)!important}

/* Desktop history buttons use the same unobtrusive circular navigation chrome. */
.history-buttons button{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;padding:0!important;background:rgba(0,0,0,.62)!important;color:#b3b3b3!important;border:0!important;box-shadow:none!important;transition:color .12s ease,background-color .12s ease,transform .08s ease!important}
.history-buttons button .icon{width:18px!important;height:18px!important}
@media (hover:hover) and (pointer:fine){.history-buttons button:hover:not(:disabled){color:#fff!important;background:rgba(0,0,0,.82)!important}}
.history-buttons button:active:not(:disabled){transform:scale(.92)!important}.history-buttons button:disabled{opacity:.35!important}

/* Song-row actions follow Spotify's quiet-at-rest / visible-on-interaction model. */
.track-table .row-actions button{border:0!important;background:transparent!important;box-shadow:none!important;-webkit-tap-highlight-color:transparent;transition:color .12s ease,transform .08s ease!important}
.track-table .row-actions .row-save{color:#b3b3b3!important}.track-table .row-actions .row-save.liked{color:var(--spotify-green)!important}
.track-table .row-actions button:active:not(:disabled){transform:scale(.9)!important}
@media (hover:hover) and (pointer:fine){.track-table .row-actions button:hover:not(:disabled){color:#fff!important}.track-table .row-actions .row-save.liked:hover:not(:disabled){color:var(--spotify-green)!important}}

/* Spotify's optional Create tab uses a plain plus glyph, not the Save (+ circle) glyph. */
#mobileCreateBtn .mobile-nav-ico{fill:none!important;stroke:currentColor!important;stroke-width:1.9!important}

/* the application 1.14.13 — Spotify modal/player fidelity + visual-viewport containment. */
:root{
  --spotify-player-desktop-h:90px;
  --spotify-mini-player-h:56px;
  --spotify-modal-bg:#282828;
  --spotify-modal-field:#3e3e3e;
  --spotify-control-muted:#b3b3b3;
  --spotify-control-dim:#a7a7a7;
}

/* Fixed surfaces follow the real visual viewport, including mobile browser chrome
   and the shrunken viewport presented while the software keyboard is open. */
.modal-backdrop{
  inset:auto!important;
  top:var(--device-viewport-top,0px)!important;
  left:var(--device-viewport-left,0px)!important;
  width:var(--device-viewport-width,100vw)!important;
  height:var(--device-viewport-height,100dvh)!important;
  max-width:100vw!important;
  max-height:100dvh!important;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))!important;
  background:rgba(0,0,0,.72)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  overscroll-behavior:contain;
}
.modal-backdrop.hidden{display:none!important}
html.modal-open,html.modal-open body{overscroll-behavior:none}

/* Spotify desktop dialog surface. */
.modal.spotify-modal-surface,.modal{
  position:relative;
  width:min(524px,calc(var(--device-viewport-width,100vw) - 48px));
  max-width:100%;
  max-height:calc(var(--device-viewport-height,100dvh) - max(40px,env(safe-area-inset-top) + env(safe-area-inset-bottom) + 24px));
  min-width:0;
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:24px!important;
  border:0!important;
  border-radius:8px!important;
  background:var(--spotify-modal-bg)!important;
  box-shadow:0 16px 56px rgba(0,0,0,.72)!important;
  color:#fff;
  scrollbar-width:thin;
  scrollbar-color:#686868 transparent;
  animation:spotify-dialog-in .16s cubic-bezier(.2,.72,.2,1);
}
@keyframes spotify-dialog-in{from{opacity:0;transform:scale(.975)}to{opacity:1;transform:scale(1)}}
.modal>*{min-width:0;max-width:100%}
.modal>h2:first-of-type,.modal>form>h2:first-of-type,.modal :is(.security-verify-dialog,.recovery-dialog,.two-factor-dialog,.jam-dialog,.spotify-preview,.add-music-sheet)>h2:first-of-type{
  margin:0 42px 20px 0!important;
  color:#fff;
  font-size:24px!important;
  font-weight:800!important;
  line-height:1.18!important;
  letter-spacing:-.55px!important;
}
.modal h3{font-size:16px;line-height:1.35;margin:22px 0 8px}
.modal p{line-height:1.5}
.modal .muted,.modal small{color:#b3b3b3}
.modal-spotify-close,.modal-icon-close{
  width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;
  display:grid!important;place-items:center!important;
  padding:0!important;border:0!important;border-radius:50%!important;
  background:transparent!important;color:#b3b3b3!important;cursor:pointer;
  transition:color .1s ease,background-color .1s ease,transform .1s ease;
}
.modal-spotify-close{position:absolute;z-index:6;top:12px;right:12px}
.modal-spotify-close .icon,.modal-icon-close .icon{width:20px!important;height:20px!important;stroke-width:2!important}
.modal-spotify-close:hover,.modal-icon-close:hover{color:#fff!important;background:#3e3e3e!important}
.modal-spotify-close:active,.modal-icon-close:active{transform:scale(.94)}

.modal label{margin:14px 0 6px!important;color:#fff;font-size:13px!important;font-weight:700!important}
.modal input:not([type=checkbox]):not([type=radio]):not([type=range]),
.modal textarea,.modal select{
  width:100%;min-width:0;min-height:42px!important;
  margin-top:7px;
  padding:10px 12px!important;
  border:1px solid #727272!important;
  border-radius:4px!important;
  outline:0!important;
  background:var(--spotify-modal-field)!important;
  color:#fff!important;
  box-shadow:none!important;
  font-size:14px!important;
  line-height:1.35;
  transition:border-color .1s ease,box-shadow .1s ease;
}
.modal textarea{min-height:104px!important;resize:vertical}
.modal input:not([type=checkbox]):not([type=radio]):not([type=range]):hover,.modal textarea:hover,.modal select:hover{border-color:#a7a7a7!important}
.modal input:not([type=checkbox]):not([type=radio]):not([type=range]):focus,.modal textarea:focus,.modal select:focus{border-color:#fff!important;box-shadow:0 0 0 1px #fff!important}
.modal input[readonly]{color:#b3b3b3!important;background:#333!important}
.modal input[type=checkbox],.modal input[type=radio]{accent-color:var(--sp-green);min-width:16px;min-height:16px}

.modal-actions{
  position:static!important;
  display:flex!important;align-items:center;justify-content:flex-end;gap:10px!important;
  margin:24px 0 0!important;padding:0!important;
  background:transparent!important;
}
.modal-actions button{
  min-height:40px!important;min-width:0!important;flex:0 0 auto!important;
  border:0!important;border-radius:999px!important;padding:0 18px!important;
  background:transparent!important;color:#fff!important;
  font-size:14px!important;font-weight:700!important;cursor:pointer;
  transition:transform .1s ease,background-color .1s ease,color .1s ease,filter .1s ease;
}
.modal-actions button:hover:not(:disabled){transform:scale(1.035)}
.modal-actions button:active:not(:disabled){transform:scale(.97)}
.modal-actions .save{
  min-height:48px!important;padding-inline:24px!important;
  background:#fff!important;color:#000!important;font-weight:800!important;
}
.modal-actions .save:hover:not(:disabled){background:#f0f0f0!important;filter:none!important}
.modal-actions .danger,.modal-actions .dialog-danger{background:#fff!important;color:#000!important}
.modal-actions .danger:hover,.modal-actions .dialog-danger:hover{background:#f0f0f0!important}
.modal .danger-text{color:#f15e6c!important}

/* Spotify alert/confirm dialogs are typographic, not large illustrated cards. */
.modal-app-dialog{width:min(448px,calc(var(--device-viewport-width,100vw) - 48px))!important;padding:32px!important}
.modal-app-dialog .app-dialog{display:block!important;text-align:left}
.modal-app-dialog .app-dialog-icon{display:none!important}
.modal-app-dialog .app-dialog-copy h2{margin:0 0 10px!important;font-size:24px!important;line-height:1.2!important;letter-spacing:-.45px}
.modal-app-dialog .app-dialog-copy p{margin:0;color:#fff;font-size:15px;line-height:1.5}
.modal-app-dialog .app-dialog-copy small{display:block;margin-top:9px;color:#b3b3b3;line-height:1.45}
.modal-app-dialog .app-dialog-actions{margin-top:26px!important}

/* Action-oriented surfaces use the mobile bottom-sheet pattern; ordinary forms
   and confirmation dialogs stay centered like Spotify dialogs. */
@media(max-width:820px){
  .modal-backdrop{
    padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))!important;
  }
  .modal.spotify-modal-surface,.modal{
    width:min(480px,calc(var(--device-viewport-width,100vw) - 32px))!important;
    max-width:calc(100vw - 32px)!important;
    max-height:calc(var(--device-viewport-height,100dvh) - max(32px,env(safe-area-inset-top) + env(safe-area-inset-bottom) + 16px))!important;
    padding:22px!important;border-radius:8px!important;
  }
  .modal>h2:first-of-type,.modal>form>h2:first-of-type{font-size:22px!important;margin-bottom:18px!important}
  .modal-actions{flex-wrap:wrap;gap:8px!important}
  .modal-actions .save{min-height:48px!important}
  .modal-backdrop:has(.spotify-modal-sheet){align-items:flex-end;padding:0!important}
  .modal.spotify-modal-sheet{
    width:100%!important;max-width:none!important;
    max-height:min(86dvh,calc(var(--device-viewport-height,100dvh) - max(8px,env(safe-area-inset-top))))!important;
    margin:0!important;padding:26px 20px calc(18px + env(safe-area-inset-bottom))!important;
    border-radius:16px 16px 0 0!important;
    animation:spotify-sheet-in .22s cubic-bezier(.2,.76,.2,1)!important;
  }
  .modal.spotify-modal-sheet::before{
    content:"";position:absolute;top:8px;left:50%;transform:translateX(-50%);
    width:36px;height:4px;border-radius:999px;background:#727272;
  }
  .modal.spotify-modal-sheet .modal-spotify-close{display:none!important}
  @keyframes spotify-sheet-in{from{transform:translateY(28px);opacity:.86}to{transform:none;opacity:1}}
  .modal-add-playlist{max-width:none!important}
  .modal-two-col{grid-template-columns:1fr!important}
}
@media(max-width:380px){
  .modal.spotify-modal-surface,.modal{width:calc(100vw - 20px)!important;max-width:calc(100vw - 20px)!important;padding:20px!important}
  .modal-actions button{padding-inline:14px!important}
  .modal-actions .save{padding-inline:20px!important}
}
@media(max-height:520px){
  .modal.spotify-modal-surface,.modal{max-height:calc(var(--device-viewport-height,100dvh) - 16px)!important}
  .modal-backdrop{padding:8px!important}
}

/* Desktop player bar: Spotify's three-zone transport geometry. */
@media(min-width:821px){
  :root{--player-h:var(--spotify-player-desktop-h)}
  .player-bar{
    height:var(--spotify-player-desktop-h)!important;
    grid-template-columns:minmax(180px,30%) minmax(330px,722px) minmax(180px,30%)!important;
    justify-content:space-between;align-items:center;
    gap:12px!important;padding:0 16px!important;
    background:#000!important;border:0!important;box-shadow:none!important;
  }
  .now-playing{height:64px;gap:12px!important;overflow:hidden}
  .player-cover{width:56px!important;height:56px!important;flex:0 0 56px!important;border-radius:4px!important}
  .player-meta{display:grid;gap:2px;min-width:0}
  .player-meta>div{font-size:14px!important;font-weight:400!important;line-height:1.28!important}
  .player-meta button{margin:0!important;font-size:11px!important;line-height:1.3!important;color:#b3b3b3!important;text-align:left}
  .player-meta button:hover{text-decoration:underline;color:#fff!important}
  #playerLike{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;margin-left:2px;color:#b3b3b3}
  #playerLike .icon{width:20px!important;height:20px!important}
  .player-center{width:100%!important;max-width:722px!important;display:grid!important;align-content:center;gap:2px}
  .transport{height:38px;gap:8px!important;align-items:center!important}
  .transport button{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;color:#b3b3b3!important;padding:0!important}
  .transport button .icon{width:17px!important;height:17px!important}
  .transport button:hover{color:#fff!important;transform:none!important}
  .transport button:active{transform:scale(.92)!important}
  .transport .play-main{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;background:#fff!important;color:#000!important}
  .transport .play-main .icon{width:16px!important;height:16px!important}
  .transport .play-main:hover{transform:scale(1.06)!important;background:#fff!important;color:#000!important}
  .transport .play-main:active{transform:scale(.96)!important}
  #shuffleBtn.active,#repeatBtn.active{color:var(--sp-green)!important}
  #shuffleBtn.active::after,#repeatBtn.active::after{
    content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);
    width:4px;height:4px;border-radius:50%;background:var(--sp-green);
  }
  .seek-row{display:grid!important;grid-template-columns:40px minmax(80px,1fr) 40px!important;align-items:center;gap:8px!important;margin:0!important;height:18px}
  .seek-row span{font-size:11px!important;color:#a7a7a7!important;line-height:1;font-variant-numeric:tabular-nums}
  .seek-row span:first-child{text-align:right}.seek-row span:last-child{text-align:left}
  .seek-row .seek-range{height:12px!important}
  .player-extra{min-width:0;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:2px!important;overflow:visible}
  .player-extra button{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;padding:0!important;color:#b3b3b3!important;background:transparent!important;border-radius:50%!important}
  .player-extra button .icon{width:17px!important;height:17px!important}
  .player-extra button:hover{color:#fff!important;background:transparent!important;transform:none!important}
  .player-extra button:active{transform:scale(.92)!important}
  .player-extra button.active,#queueBtn.active,.app-shell.queue-open #queueBtn,#devicesBtn.active,#nowPanelBtn.active{color:var(--sp-green)!important}
  .volume-range{width:93px!important;min-width:52px!important;margin:0 2px!important}
}
@media(min-width:821px) and (max-width:1100px){
  .player-bar{grid-template-columns:minmax(170px,29%) minmax(300px,1fr) minmax(154px,27%)!important;padding-inline:10px!important;gap:8px!important}
  #jamBtn{display:none!important}
  .volume-range{width:72px!important}
}
@media(min-width:821px) and (max-width:930px){
  .player-cover{width:52px!important;height:52px!important;flex-basis:52px!important}
  #nowPanelBtn{display:none!important}
  .volume-range{width:58px!important}
}
@media(min-width:821px) and (max-height:590px){
  :root{--player-h:78px;--spotify-player-desktop-h:78px}
  .player-cover{width:50px!important;height:50px!important;flex-basis:50px!important}
  .transport{height:34px}.seek-row{height:16px}
}

/* Spotify mobile mini-player: a compact rounded card above the primary nav. */
@media(max-width:820px){
  :root{--player-h:64px;--mobile-nav-h:64px}
  .app-shell,.app-shell.queue-open{
    width:var(--device-viewport-width,100vw)!important;
    height:var(--device-viewport-height,100dvh)!important;
    max-height:var(--device-viewport-height,100dvh)!important;
    grid-template-rows:minmax(0,1fr) var(--player-h) calc(var(--mobile-nav-h) + env(safe-area-inset-bottom))!important;
  }
  .player-bar{
    width:auto!important;max-width:none!important;
    height:var(--spotify-mini-player-h)!important;min-height:var(--spotify-mini-player-h)!important;
    align-self:center!important;margin:4px 8px!important;
    grid-template-columns:minmax(0,1fr) 40px 40px!important;
    gap:2px!important;padding:4px 6px 4px 4px!important;
    border:0!important;border-radius:8px!important;
    background:#242424!important;box-shadow:none!important;overflow:hidden!important;
  }
  .now-playing{height:48px!important;gap:8px!important;min-width:0!important;overflow:hidden!important}
  .player-cover{width:48px!important;height:48px!important;flex:0 0 48px!important;border-radius:5px!important}
  .player-meta{display:grid!important;align-content:center!important;gap:1px!important;overflow:hidden!important}
  .player-meta>div{font-size:13px!important;font-weight:600!important;line-height:1.25!important}
  .player-meta button{font-size:11px!important;line-height:1.25!important;margin:0!important;color:#b3b3b3!important;text-align:left!important}
  #playerLike{display:grid!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;color:#fff!important}
  #playerLike .icon{width:21px!important;height:21px!important}
  .player-center{width:40px!important;display:grid!important;place-items:center!important}
  .transport{display:grid!important;place-items:center!important;width:40px!important;height:40px!important}
  .transport #shuffleBtn,.transport #prevBtn,.transport #nextBtn,.transport #repeatBtn{display:none!important}
  .transport #playBtn{display:grid!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;background:transparent!important;color:#fff!important}
  .transport #playBtn .icon{width:24px!important;height:24px!important}
  .transport #playBtn:hover,.transport #playBtn:active{background:transparent!important;color:#fff!important;transform:scale(.94)!important}
  .player-extra{display:none!important}
  .seek-row{
    position:absolute!important;left:8px!important;right:8px!important;bottom:0!important;top:auto!important;
    height:2px!important;margin:0!important;display:block!important;pointer-events:none!important;z-index:3!important;
  }
  .seek-row span{display:none!important}
  .seek-row input{width:100%!important;height:2px!important;margin:0!important;padding:0!important;pointer-events:none!important;background-size:100% 2px!important}
  .seek-row input::-webkit-slider-runnable-track{height:2px!important}.seek-row input::-moz-range-track{height:2px!important}
  .seek-row input::-webkit-slider-thumb{display:none!important;opacity:0!important}.seek-row input::-moz-range-thumb{opacity:0!important;width:0!important;height:0!important}
  .mobile-nav{min-width:0!important;padding-left:max(4px,env(safe-area-inset-left))!important;padding-right:max(4px,env(safe-area-inset-right))!important;padding-bottom:env(safe-area-inset-bottom)!important}
  .mobile-now-playing,.queue-panel{
    width:var(--device-viewport-width,100vw)!important;
    height:var(--device-viewport-height,100dvh)!important;
    max-height:var(--device-viewport-height,100dvh)!important;
  }
  .mnp-body{min-height:calc(var(--device-viewport-height,100dvh) - 60px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important}
}
@media(max-width:360px){
  .player-bar{margin-inline:5px!important;grid-template-columns:minmax(0,1fr) 38px!important;padding-right:4px!important}
  #playerLike{display:none!important}
  .player-center{width:38px!important}.transport{width:38px!important}.transport #playBtn{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important}
}
@media(max-width:820px) and (orientation:landscape) and (max-height:500px){
  :root{--player-h:56px;--mobile-nav-h:52px;--spotify-mini-player-h:52px}
  .player-bar{margin-block:2px!important}.player-cover{width:44px!important;height:44px!important;flex-basis:44px!important}.now-playing{height:44px!important}
}

/* General viewport containment: every shell/modal child can shrink instead of
   forcing horizontal overflow when the browser is narrow, zoomed, or resized. */
:is(.app-shell,.sidebar,.main-panel,.content,.topbar,.player-bar,.player-center,.player-extra,.now-playing,.modal,.modal form,.modal-two-col,.admin-page,.admin-card,.queue-panel,.devices-panel,.mobile-now-playing){min-width:0!important}
:is(img,video,canvas,svg){max-width:100%}
.modal table{max-width:100%}
@media(max-width:820px){
  html,body,#app,.app-shell{width:100%!important;max-width:100vw!important;overflow-x:hidden!important}
  .content{max-width:100%;min-width:0}
}

/* 1.14.13 final fidelity/viewport corrections. */
.mini-player-device{display:none}
@media(min-width:821px){
  /* Jam remains available from Now Playing, but Spotify's desktop play bar keeps
     the utility cluster dedicated to Now Playing / Queue / Connect / volume / fullscreen. */
  .player-extra #jamBtn{display:none!important}
  .player-bar{min-width:0;max-width:100%;overflow:hidden!important}
  .player-meta-sub{min-width:0;overflow:hidden}
  #playerTitle,#playerArtist{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* Current mobile mini-player geometry: artwork + two-line metadata, Connect,
   Save, then Play/Pause. The card itself never exceeds the visual viewport. */
@media(max-width:820px){
  .player-bar{
    grid-template-columns:minmax(0,1fr) 40px!important;
    width:calc(100% - 16px)!important;
    max-width:calc(var(--device-viewport-width,100vw) - 16px)!important;
    justify-self:center!important;
  }
  .now-playing{
    display:grid!important;
    grid-template-columns:48px minmax(0,1fr) 40px 40px!important;
    align-items:center!important;
    gap:6px!important;
  }
  .mini-player-device{display:grid!important;place-items:center;width:40px;height:40px;min-width:40px;min-height:40px;padding:0;border:0;border-radius:50%;background:transparent;color:#fff;cursor:pointer}
  .mini-player-device .icon{width:21px;height:21px}
  .mini-player-device.active{color:var(--sp-green)!important}
  .mini-player-device:active,#playerLike:active{transform:scale(.92)}
  #playerLike{margin:0!important}
  .player-center{grid-column:2;width:40px!important}
  .player-extra{display:none!important}
}
@media(max-width:420px){
  .now-playing{grid-template-columns:46px minmax(0,1fr) 38px 38px!important;gap:4px!important}
  .player-cover{width:46px!important;height:46px!important;flex-basis:46px!important}
  .mini-player-device,#playerLike{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important}
}
@media(max-width:350px){
  .now-playing{grid-template-columns:44px minmax(0,1fr) 36px!important}
  .player-cover{width:44px!important;height:44px!important;flex-basis:44px!important}
  .mini-player-device{display:none!important}
  #playerLike{display:grid!important;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important}
}

/* Overlay surfaces are sized/positioned from VisualViewport rather than the
   layout viewport, keeping them inside browser chrome, zoomed windows and the
   software keyboard viewport. */
.fullscreen-player,.devices-backdrop{
  inset:auto!important;
  top:var(--device-viewport-top,0px)!important;
  left:var(--device-viewport-left,0px)!important;
  width:var(--device-viewport-width,100vw)!important;
  height:var(--device-viewport-height,100dvh)!important;
  max-width:var(--device-viewport-width,100vw)!important;
  max-height:var(--device-viewport-height,100dvh)!important;
}
.devices-panel{
  max-height:min(620px,calc(var(--device-viewport-height,100dvh) - var(--player-h) - 28px))!important;
}
.toast-host{
  left:calc(var(--device-viewport-left,0px) + var(--device-viewport-width,100vw)/2)!important;
  bottom:auto!important;
  top:calc(var(--device-viewport-top,0px) + var(--device-viewport-height,100dvh) - var(--player-h) - 14px)!important;
  transform:translate(-50%,-100%)!important;
  max-width:calc(var(--device-viewport-width,100vw) - 20px)!important;
}
@media(max-width:820px){
  .mobile-now-playing,.queue-panel{
    inset:auto!important;
    top:var(--device-viewport-top,0px)!important;
    left:var(--device-viewport-left,0px)!important;
    right:auto!important;bottom:auto!important;
    width:var(--device-viewport-width,100vw)!important;
    height:var(--device-viewport-height,100dvh)!important;
    max-width:var(--device-viewport-width,100vw)!important;
    max-height:var(--device-viewport-height,100dvh)!important;
  }
  .devices-panel{
    left:var(--device-viewport-left,0px)!important;
    right:auto!important;
    bottom:auto!important;
    top:calc(var(--device-viewport-top,0px) + var(--device-viewport-height,100dvh) - min(76dvh,680px))!important;
    width:var(--device-viewport-width,100vw)!important;
    max-width:var(--device-viewport-width,100vw)!important;
    max-height:min(76dvh,var(--device-viewport-height,100dvh))!important;
  }
  .toast-host{
    top:calc(var(--device-viewport-top,0px) + var(--device-viewport-height,100dvh) - var(--player-h) - var(--mobile-nav-h) - env(safe-area-inset-bottom) - 12px)!important;
  }
  .visual-keyboard-open .player-bar,.visual-keyboard-open .mobile-nav{visibility:hidden;pointer-events:none}
  .visual-keyboard-open .app-shell{grid-template-rows:minmax(0,1fr) 0 0!important}
  .visual-keyboard-open .modal-backdrop{align-items:center!important}
  .visual-keyboard-open .modal.spotify-modal-sheet{max-height:calc(var(--device-viewport-height,100dvh) - 8px)!important}
}

/* Forms and data inside dialogs must shrink instead of forcing the dialog past
   the current viewport. */
.modal :is(form,fieldset,.shortcut-grid,.recovery-grid,.two-factor-layout,.jam-share,.spotify-match-list,.youtube-import,.ai-dj-modal,.artwork-editor,.add-tracks-results){min-width:0;max-width:100%}
.modal :is(.shortcut-grid,.recovery-grid,.spotify-match-list,.add-tracks-results){overflow:auto;overscroll-behavior:contain}
.modal img,.modal canvas,.modal video{max-width:100%;height:auto}
@media(max-width:560px){
  .modal .two-factor-layout,.modal .jam-share{grid-template-columns:1fr!important}
  .modal .two-factor-qr{justify-self:center}
  .modal .shortcut-grid{grid-template-columns:minmax(0,1fr) auto!important}
}

/* Preserve Spotify-style large/special modal compositions after the global
   dialog normalization above. */
.modal:is(.modal-youtube,.modal-ai-dj,.modal-jam,.modal-add-playlist){padding:0!important;overflow:hidden!important}
.modal-youtube,.modal-ai-dj{width:min(760px,calc(var(--device-viewport-width,100vw) - 40px))!important;max-width:760px!important}
.modal-jam{width:min(680px,calc(var(--device-viewport-width,100vw) - 40px))!important;max-width:680px!important}
.modal-add-playlist{width:min(540px,calc(var(--device-viewport-width,100vw) - 40px))!important;max-width:540px!important}
@media(max-width:820px){
  .modal-backdrop:has(:is(.modal-youtube,.modal-ai-dj,.modal-jam,.modal-add-playlist)){align-items:flex-end!important;padding:0!important}
  .modal:is(.modal-youtube,.modal-ai-dj,.modal-jam,.modal-add-playlist){
    width:100%!important;max-width:var(--device-viewport-width,100vw)!important;
    border-radius:16px 16px 0 0!important;
    max-height:min(92dvh,var(--device-viewport-height,100dvh))!important;
  }
}

/* Visual-viewport anchored transient surfaces. */
.toast-host{left:var(--device-viewport-center-x,50%)!important}
@media(min-width:821px){
  .devices-panel{
    right:auto!important;bottom:auto!important;
    width:min(390px,calc(var(--device-viewport-width,100vw) - 28px))!important;
    left:calc(var(--device-viewport-left,0px) + var(--device-viewport-width,100vw) - min(390px,calc(var(--device-viewport-width,100vw) - 28px)) - 14px)!important;
    top:calc(var(--device-viewport-top,0px) + var(--device-viewport-height,100dvh) - var(--player-h) - 12px - min(620px,calc(var(--device-viewport-height,100dvh) - var(--player-h) - 28px)))!important;
  }
}

/* the application 1.14.14 — Spotify Home, exact player height, and truncation fidelity. */
@media(min-width:821px){
  :root{--spotify-player-desktop-h:90px!important;--player-h:90px!important}
  .player-bar{height:90px!important;min-height:90px!important;max-height:90px!important}
}

/* Spotify Home uses compact content filters above personalized shelves. */
.spotify-home{min-width:0;padding-bottom:24px}
.home-filter-chips{display:flex;align-items:center;gap:8px;min-width:0;margin:0 0 22px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.home-filter-chips::-webkit-scrollbar{display:none}
.home-filter-chips button{flex:0 0 auto;height:32px;min-width:0;padding:0 13px;border:0;border-radius:999px;background:#2a2a2a;color:#fff;font-size:13px;font-weight:600;line-height:32px;cursor:pointer;transition:background-color .1s ease,color .1s ease,transform .08s ease}
.home-filter-chips button:hover{background:#3a3a3a}
.home-filter-chips button:active{transform:scale(.96)}
.home-filter-chips button.active{background:#fff;color:#000}
.home-greeting{margin:0 0 18px!important;font-size:clamp(28px,3vw,32px)!important;font-weight:800!important;letter-spacing:-1px!important;line-height:1.2!important}
.spotify-home .section-head{margin-top:32px;margin-bottom:12px}
.spotify-home .section-head h2{font-size:24px;font-weight:800;letter-spacing:-.6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-quick-grid{margin-bottom:28px}
.home-empty{min-height:260px}

/* Spotify truncates identity labels instead of allowing controls to be pushed
   out of their columns. Descriptive card copy gets a two-line ellipsis. */
:is(.player-meta>div,.player-meta button,.track-name,.track-sub,.track-album,.track-date,.queue-item .track-name,.queue-item .track-sub,.library-item-copy strong,.library-item-meta-text,.quick-tile>span:last-child,.device-copy strong,.device-state-value,.browser-output-row .device-copy strong,.browser-output-row .device-copy small,.mnp-meta strong,.mnp-meta small,.now-panel-track-copy strong,.now-panel-track-copy small,.fullscreen-player-copy h1,.fullscreen-player-copy button,.user-pill>span,.playlist-nav button){min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.media-card h3{min-width:0;max-width:100%;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.media-card p{min-width:0;max-width:100%;white-space:normal!important;overflow:hidden!important;text-overflow:ellipsis;display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;min-height:2.7em}
.section-head h2,.hero-copy h1,.account-settings-head h1,.downloads-title-head h1,.library-title-head h1{max-width:100%}

@media(max-width:820px){
  .spotify-home{margin-top:-2px}
  .home-filter-chips{position:relative;margin:0 -2px 18px;padding:0 2px;gap:8px}
  .home-filter-chips button{height:32px;line-height:32px;padding-inline:12px;font-size:13px}
  .home-greeting{font-size:24px!important;margin-bottom:14px!important}
  .spotify-home .section-head{margin-top:28px}
  .spotify-home .section-head h2{font-size:21px}
  .home-quick-grid{margin-bottom:24px}
}

/* 1.14.14 Home-filter hierarchy and final Spotify truncation/player fidelity. */
.home-filter-stack{display:grid;gap:10px;min-width:0;margin-bottom:22px}
.home-filter-stack>.home-filter-chips{margin-bottom:0}
.home-music-filters{display:flex;align-items:center;gap:8px;min-width:0;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.home-music-filters::-webkit-scrollbar{display:none}
.home-music-filters button{flex:0 0 auto;height:30px;padding:0 12px;border:0;border-radius:999px;background:#2a2a2a;color:#fff;font-size:12px;font-weight:650;cursor:pointer;transition:background-color .1s ease,color .1s ease,transform .08s ease}
.home-music-filters button:hover{background:#3a3a3a}.home-music-filters button:active{transform:scale(.96)}
.home-music-filters button.active{background:#fff;color:#000}
.spotify-home .home-quick-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}

/* Spotify keeps compact identity strings on one line so neighboring transport
   and action controls never move when metadata is unusually long. */
:is(.track-lines,.track-title-cell,.player-meta,.player-meta-sub,.mnp-meta,.queue-item .track-lines,.library-item-copy,.device-copy,.browser-output-row .device-copy,.now-panel-track-copy,.playlist-nav button,.top-actions,.user-pill){min-width:0}
:is(#playerTitle,#playerArtist,.track-name,.track-sub,.track-album,.track-date,.queue-item .track-name,.queue-item .track-sub,.library-item-copy strong,.library-item-meta-text,.device-copy strong,.device-copy small,.browser-output-row .device-copy strong,.browser-output-row .device-copy small,.mnp-meta strong,.mnp-meta small,.now-panel-track-copy strong,.now-panel-track-copy small,.user-pill>span,.playlist-nav button){overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}

/* Do not let short desktop windows silently change Spotify's persistent
   playback-bar geometry. Content above the bar is what adapts to height. */
@media(min-width:821px){
  .player-bar{box-sizing:border-box!important;height:90px!important;min-height:90px!important;max-height:90px!important}
}
@media(max-width:820px){
  .home-filter-stack{gap:9px;margin-bottom:18px}
  .spotify-home .home-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .spotify-home .quick-tile{min-width:0;height:56px!important;font-size:13px!important}
  .spotify-home .quick-tile .quick-cover{width:56px!important;height:56px!important;flex-basis:56px!important}
}
@media(max-width:340px){
  .spotify-home .home-quick-grid{grid-template-columns:1fr!important}
}

/* the application 1.14.15 — Spotify desktop collection-header spacing.
   Since 1.10.75 the top bar is a real flex row outside #content. Collection
   heroes must therefore no longer reserve the old 88px absolute-topbar inset.
   Spotify's desktop collection header uses a compact content inset below the
   navigation rather than a second toolbar-height band. */
@media (min-width:821px){
  :root{--spotify-collection-hero-top-gap:24px;--spotify-collection-hero-bottom-gap:24px}
  #content .spotify-collection-page>.hero,
  #content>.hero{
    padding-top:var(--spotify-collection-hero-top-gap)!important;
    padding-bottom:var(--spotify-collection-hero-bottom-gap)!important;
    min-height:calc(var(--hero-art-size) + var(--spotify-collection-hero-top-gap) + var(--spotify-collection-hero-bottom-gap))!important;
  }
  #content .spotify-liked-hero,
  #content .spotify-playlist-hero{
    padding-top:var(--spotify-collection-hero-top-gap)!important;
    padding-bottom:var(--spotify-collection-hero-bottom-gap)!important;
  }
}

/* the application 1.14.16 — Spotify Home shelves, collision-free desktop header,
   and scrollable Your Library filters with edge navigation. */
@media (min-width:821px){
  .main-panel>.topbar{
    display:grid!important;
    grid-template-columns:max-content minmax(220px,1fr) max-content!important;
    align-items:center!important;
    column-gap:16px!important;
    padding-inline:16px 18px!important;
  }
  .main-panel>.topbar>.history-buttons{grid-column:1;position:relative!important;margin:0!important;z-index:2}
  .spotify-top-center{
    grid-column:2;
    position:static!important;
    left:auto!important;top:auto!important;
    transform:none!important;
    width:min(546px,100%)!important;
    min-width:0!important;
    max-width:100%!important;
    justify-self:center;
    z-index:1;
  }
  .spotify-top-center .top-search{min-width:0!important;width:auto!important;max-width:none!important}
  .main-panel>.topbar>.top-actions{grid-column:3;position:relative;min-width:0;margin:0!important;justify-self:end;z-index:2}
}
@media (min-width:821px) and (max-width:1100px){
  .main-panel>.topbar{column-gap:10px!important;padding-inline:12px!important}
  #aiDjBtn,#uploadBtn{width:44px!important;min-width:44px!important;height:40px!important;padding:0!important;justify-content:center!important;gap:0!important}
  #aiDjBtn>span,#uploadBtn>span,.user-pill>span:nth-child(2),.user-menu-chevron{display:none!important}
  .user-pill{width:42px!important;min-width:42px!important;max-width:42px!important;padding:0!important;justify-content:center!important}
  .user-pill .avatar-small{margin:0!important}
}
@media (min-width:821px) and (max-width:900px){
  .main-panel>.topbar{grid-template-columns:max-content minmax(180px,1fr) max-content!important;column-gap:8px!important;padding-inline:8px!important}
  .history-buttons{gap:4px!important}
  .history-buttons button{width:36px!important;height:36px!important}
  .spotify-top-home{width:42px!important;height:42px!important;min-width:42px!important}
  .top-search{height:42px!important}
}

/* Spotify's Your Library filters form one horizontal, non-wrapping rail. The
   edge arrows occupy stable slots only when the chip rail actually overflows. */
.library-filter-strip{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:2px;
  min-width:0;
  width:100%;
  padding:2px 4px 6px;
  box-sizing:border-box;
}
#librarySidebarFilters{
  display:flex!important;
  grid-template-columns:none!important;
  align-items:center!important;
  gap:8px!important;
  min-width:0!important;
  width:100%!important;
  padding:2px 2px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-behavior:smooth;
  scroll-snap-type:x proximity;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
}
#librarySidebarFilters::-webkit-scrollbar{display:none!important}
#librarySidebarFilters :is(button[data-library-filter],button[data-library-route]){
  appearance:none!important;
  -webkit-appearance:none!important;
  flex:0 0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:max-content!important;
  max-width:none!important;
  height:32px!important;
  min-height:32px!important;
  padding:0 12px!important;
  margin:0!important;
  border:0!important;
  border-radius:999px!important;
  background:#232323!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:600!important;
  line-height:32px!important;
  white-space:nowrap!important;
  overflow:visible!important;
  transform:none!important;
  scroll-snap-align:start;
  cursor:pointer;
}
#librarySidebarFilters :is(button[data-library-filter],button[data-library-route]):hover{background:#333!important}
#librarySidebarFilters :is(button[data-library-filter],button[data-library-route]).active,
#librarySidebarFilters :is(button[data-library-filter],button[data-library-route])[aria-pressed="true"]{
  background:#fff!important;color:#000!important;
}
#librarySidebarFilters :is(button[data-library-filter],button[data-library-route]) .library-filter-label{
  display:block!important;width:auto!important;max-width:none!important;overflow:visible!important;white-space:nowrap!important;color:inherit!important;font:inherit!important;line-height:1!important;pointer-events:none;
}
.library-filter-arrow{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  min-width:32px;
  padding:0;
  border:0;
  border-radius:50%;
  background:#1f1f1f;
  color:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.36);
  cursor:pointer;
  z-index:2;
  transition:background-color .12s ease,opacity .12s ease,transform .08s ease;
}
.library-filter-arrow .icon{width:17px;height:17px}
.library-filter-arrow:hover:not(:disabled){background:#2b2b2b;transform:scale(1.04)}
.library-filter-arrow:active:not(:disabled){transform:scale(.94)}
.library-filter-arrow:disabled{opacity:.34;cursor:default}
.library-filter-arrow.hidden{display:none!important}
.app-shell.library-collapsed .library-filter-strip{display:none!important}

/* Spotify Home: section headings themselves are navigation targets and Show all
   is a low-emphasis text action aligned to the same baseline. */
.spotify-home .home-shelf{min-width:0;margin:0}
.spotify-home .home-section-head{
  display:flex!important;
  align-items:baseline!important;
  justify-content:space-between!important;
  gap:16px!important;
  min-width:0;
  margin:30px 0 10px!important;
}
.spotify-home .home-section-head h2{min-width:0;flex:1;margin:0!important;line-height:1.25!important}
.home-section-title,.home-show-all,.media-card-title-link,.media-card-meta-link{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  font:inherit;
  text-align:left;
  cursor:pointer;
}
.home-section-title{display:block;max-width:100%;color:#fff;font-size:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-section-title:hover,.home-section-title:focus-visible{text-decoration:underline;text-underline-offset:2px}
.home-show-all{flex:0 0 auto;color:#b3b3b3;font-size:13px;font-weight:700;line-height:1.4;white-space:nowrap;text-transform:none}
.home-show-all:hover,.home-show-all:focus-visible{color:#fff;text-decoration:underline;text-underline-offset:2px}
.home-section-title:focus-visible,.home-show-all:focus-visible,.media-card-title-link:focus-visible,.media-card-meta-link:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:2px}

.spotify-home .home-card-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;
  gap:18px!important;
  min-width:0;
  overflow:hidden;
}
.spotify-home .media-card{min-width:0}
.media-card h3{margin:8px 0 4px!important;line-height:1.35!important}
.media-card-title-link{display:block;width:100%;max-width:100%;color:#fff;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.media-card-title-link:hover{text-decoration:underline;text-underline-offset:2px}
.media-card p.media-card-meta{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:2.55em!important;
  margin:0!important;
  color:#b3b3b3!important;
  font-size:13px!important;
  line-height:1.3!important;
  overflow:hidden!important;
  white-space:normal!important;
  -webkit-line-clamp:2!important;
}
.media-card-meta-link{display:inline;color:#b3b3b3;font-size:inherit;font-weight:400;line-height:inherit;max-width:100%}
.media-card-meta-link:hover{color:#fff;text-decoration:underline;text-underline-offset:2px}
.media-card-meta-sep{color:#7a7a7a;white-space:pre}

.home-section-page{min-width:0;padding-bottom:32px}
.home-section-page-head{margin:0 0 20px!important}
.home-section-page-head h1{margin:0!important;font-size:32px!important;font-weight:800!important;letter-spacing:-.7px!important}
.home-section-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))!important;gap:18px!important;min-width:0}

@media(max-width:820px){
  .library-filter-strip{padding-inline:8px;gap:3px}
  .library-filter-arrow{width:30px;height:30px;min-width:30px}
  #librarySidebarFilters{gap:8px!important;padding-block:2px!important}
  #librarySidebarFilters :is(button[data-library-filter],button[data-library-route]){height:32px!important;min-height:32px!important;padding-inline:12px!important;font-size:13px!important}
  .spotify-home .home-section-head{margin:26px 0 9px!important;gap:12px!important}
  .home-show-all{font-size:12px}
  .spotify-home .home-card-grid{
    grid-template-columns:none!important;
    grid-auto-flow:column!important;
    grid-auto-columns:minmax(148px,42vw)!important;
    gap:14px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    margin-right:-16px;
    padding-right:16px;
  }
  .spotify-home .home-card-grid::-webkit-scrollbar{display:none}
  .spotify-home .home-card-grid>.media-card{scroll-snap-align:start}
  .home-section-page-head h1{font-size:28px!important}
  .home-section-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}
}
@media(max-width:420px){
  .home-section-grid{grid-template-columns:1fr!important}
}


/* the application 1.14.17 — Spotify Home/Library density, Liked Songs taste rail,
   restored Downloaded destination, and compact desktop playback bar. */

/* Your Library chips keep their intrinsic text width in every state. Older
   width:100% rules are intentionally out-specificed here. */
#libraryFilterStrip #librarySidebarFilters > button[data-library-filter],
#libraryFilterStrip #librarySidebarFilters > button[data-library-filter].active,
#libraryFilterStrip #librarySidebarFilters > button[data-library-filter][aria-pressed="true"]{
  flex:0 0 auto!important;width:auto!important;min-width:max-content!important;max-width:none!important;
  padding:0 12px!important;font-size:13px!important;font-weight:600!important;line-height:32px!important;
}
#libraryFilterStrip #librarySidebarFilters > button[data-library-filter] .library-filter-label{width:auto!important;min-width:max-content!important;max-width:none!important}

/* Four Spotify Library filters live in a clipped rail with stable arrow slots;
   Downloaded is a primary destination again instead of a Library filter chip. */
.library-filter-strip{grid-template-columns:32px minmax(0,1fr) 32px!important;gap:4px!important;padding-inline:7px!important}
.library-filter-arrow.hidden{visibility:hidden!important;display:grid!important;pointer-events:none}
.library-filter-arrow:disabled{opacity:.38!important}
#librarySidebarFilters{gap:8px!important;padding-inline:0!important}

/* Current Spotify desktop/web playback chrome is the compact 72px bottom bar.
   Its internal artwork remains 56px, leaving 8px vertical breathing room. */
@media(min-width:821px){
  :root{--spotify-player-desktop-h:72px!important;--player-h:72px!important}
  .player-bar{height:72px!important;min-height:72px!important;max-height:72px!important;padding-block:0!important}
  .now-playing{height:56px!important}.player-cover{width:56px!important;height:56px!important;flex-basis:56px!important}
  .player-center{gap:0!important}.transport{height:34px!important}.seek-row{height:16px!important;margin-top:0!important}
}

/* Home quick-access tiles preserve Spotify's internal right inset. */
.spotify-home .quick-tile>span:last-child{padding-right:16px!important;line-height:1.25!important}

/* Spotify Home media tiles sit directly on the feed instead of looking like
   permanent raised cards. Artwork is the visual anchor; titles/copy sit below. */
.spotify-home .home-media-card,
.home-section-page .home-media-card{
  background:transparent!important;border:0!important;border-radius:6px!important;padding:0!important;box-shadow:none!important;transform:none!important;overflow:visible!important;
}
.spotify-home .home-media-card:hover,.spotify-home .home-media-card:focus-within,
.home-section-page .home-media-card:hover,.home-section-page .home-media-card:focus-within{background:transparent!important;box-shadow:none!important;transform:none!important}
.home-media-card .card-art-wrap{border-radius:7px!important;overflow:visible!important}
.home-media-card .card-cover{border-radius:7px!important;box-shadow:none!important}
.home-media-card.artist-card .card-cover{border-radius:50%!important}
.home-media-card h3{margin:12px 0 6px!important;font-size:16px!important;line-height:1.35!important;min-height:2.7em!important}
.home-media-card .media-card-title-link{
  white-space:normal!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;line-clamp:2!important;overflow:hidden!important;text-overflow:ellipsis!important;font-weight:650!important;
}
.home-media-card p.media-card-meta{font-size:14px!important;line-height:1.45!important;color:#b3b3b3!important;min-height:2.9em!important;-webkit-line-clamp:2!important;line-clamp:2!important}
.home-media-card .card-play{right:8px!important;bottom:8px!important;width:48px!important;height:48px!important;opacity:0!important;transform:translateY(8px)!important;transition:opacity .16s ease,transform .16s ease,background-color .12s ease!important}
.home-media-card:hover .card-play,.home-media-card:focus-within .card-play,.home-media-card.playing .card-play{opacity:1!important;transform:none!important}
.home-media-card.playing .card-play{background:var(--sp-green)!important}
.spotify-home .home-card-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;gap:24px!important}
.home-section-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;gap:24px!important}

/* Liked Songs genre/mood filters mirror Spotify's horizontally clipped pill rail. */
.liked-taste-filter-shell{position:relative;display:block;margin:8px 0 10px;padding:0 14px;min-width:0}
.liked-taste-filters{display:flex;align-items:center;gap:10px;min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;padding-right:2px}
.liked-taste-filters::-webkit-scrollbar{display:none}
.liked-taste-filters button{flex:0 0 auto;height:40px;padding:0 15px;border:0;border-radius:999px;background:#2a2737;color:#fff;font-size:15px;font-weight:650;line-height:40px;white-space:nowrap;cursor:pointer;transition:background-color .12s ease,color .12s ease,transform .08s ease}
.liked-taste-filters button:hover{background:#3a3648}.liked-taste-filters button:active{transform:scale(.97)}.liked-taste-filters button.active{background:#fff;color:#000}
.liked-taste-arrow{position:absolute;top:0;display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:#fff;color:#222;box-shadow:0 3px 10px rgba(0,0,0,.3);cursor:pointer;z-index:4}
.liked-taste-prev{left:6px}.liked-taste-next{right:6px}.liked-taste-arrow .icon{width:22px;height:22px}.liked-taste-arrow.hidden{visibility:hidden;pointer-events:none}.liked-taste-arrow:disabled{opacity:.35;cursor:default}

/* Mobile primary navigation remains Spotify-like Home / Search / Library / Create.
   Downloaded is surfaced inside Your Library rather than as a fifth permanent tab. */
@media(max-width:820px){
  .mobile-nav{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .liked-taste-filter-shell{padding:0 0 8px;margin:8px 0 8px}
  .liked-taste-arrow{display:none!important}
  .liked-taste-filters{padding:0 16px;margin:0 -16px;gap:8px}
  .liked-taste-filters button{height:34px;line-height:34px;padding:0 13px;font-size:13px}
  .spotify-home .home-card-grid{grid-auto-columns:minmax(164px,44vw)!important;gap:16px!important}
  .home-section-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}
  .home-media-card h3{font-size:15px!important}.home-media-card p.media-card-meta{font-size:13px!important}
}
@media(max-width:380px){.mobile-nav .nav-item{font-size:9px!important}.mobile-nav-ico.icon{width:22px!important;height:22px!important}}


/* the application 1.14.18 — Spotify Home hover surface + restored Downloaded navigation. */

/* Spotify Home cards are transparent at rest but still reserve the exact same
   padded tile geometry. On hover/focus, the full card surface becomes Spotify's
   subtle dark highlight (#1f1f1f) without any halo or layout shift. */
.spotify-home .home-media-card,
.home-section-page .home-media-card{
  background:transparent!important;
  border:0!important;
  border-radius:8px!important;
  padding:12px!important;
  box-shadow:none!important;
  overflow:visible!important;
  transition:background-color .16s ease,color .12s ease!important;
}
.spotify-home .home-media-card:hover,
.spotify-home .home-media-card:focus-within,
.home-section-page .home-media-card:hover,
.home-section-page .home-media-card:focus-within{
  background:#1f1f1f!important;
  box-shadow:none!important;
  transform:none!important;
}
.home-media-card .card-art-wrap{margin:0 0 12px!important;border-radius:6px!important;overflow:visible!important}
.home-media-card .card-cover{border-radius:6px!important;box-shadow:none!important}
.home-media-card.artist-card .card-cover{border-radius:50%!important}
.home-media-card h3{margin:0 0 6px!important;font-size:16px!important;line-height:1.35!important;min-height:2.7em!important}
.home-media-card p.media-card-meta{margin:0!important;font-size:14px!important;line-height:1.45!important;color:#b3b3b3!important;min-height:2.9em!important;-webkit-line-clamp:2!important;line-clamp:2!important}
.home-media-card .card-play{right:8px!important;bottom:8px!important;width:48px!important;height:48px!important;opacity:0!important;transform:translateY(8px)!important;transition:opacity .16s ease,transform .16s ease,background-color .12s ease!important}
.home-media-card:hover .card-play,.home-media-card:focus-within .card-play,.home-media-card.playing .card-play{opacity:1!important;transform:none!important}
.home-media-card.playing .card-play{background:var(--sp-green)!important}

/* Downloaded is a first-class destination again: directly below Administration
   in the desktop sidebar and as its own mobile navigation destination. */
.sidebar-bottom #downloadsNavBtn{display:flex!important}
.mobile-nav [data-view="downloads"]{display:flex!important}
@media(max-width:820px){
  .mobile-nav{grid-template-columns:repeat(5,minmax(0,1fr))!important}
  .mobile-nav .nav-item{min-width:0!important;padding-inline:1px!important;font-size:9.5px!important}
  .mobile-nav .nav-item>span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .spotify-home .home-media-card,
  .home-section-page .home-media-card{padding:8px!important;border-radius:7px!important}
  .home-media-card .card-art-wrap{margin-bottom:10px!important}
}
@media(max-width:390px){
  .mobile-nav .nav-item{font-size:8.8px!important}
  .mobile-nav-ico.icon{width:21px!important;height:21px!important}
}


/* the application 1.14.21 — Liked Songs desktop geometry matched to the supplied
   Spotify references. The hero and post-hero area are one continuous colored
   collection surface; controls, taste filters and table header sit on the
   fading dominant-color background instead of dropping immediately to #121212. */
.spotify-liked-body{min-width:0}

@media (min-width:821px){
  .spotify-liked-page{
    margin:20px -8px 0!important;
    border-radius:8px;
    overflow:clip;
    background:#121212!important;
  }

  #content .spotify-liked-page .spotify-liked-hero{
    --hero-art-size:clamp(244px,22vw,264px)!important;
    margin:0!important;
    min-height:calc(var(--hero-art-size) + 60px)!important;
    padding:30px 28px!important;
    gap:28px!important;
    border-radius:8px 8px 0 0;
    background:linear-gradient(180deg,#523ba1 0%,#49348d 25%,#352666 72%,#2b1f52 100%)!important;
  }
  .spotify-liked-hero .hero-copy{
    align-self:flex-end!important;
    padding:0 0 12px!important;
  }
  .spotify-liked-hero .liked-playlist-type{
    font-size:14px!important;
    line-height:18px!important;
    font-weight:700!important;
  }
  .spotify-liked-hero .hero-copy h1{
    margin:18px 0 16px!important;
    padding:0!important;
    min-height:0!important;
    font-size:clamp(72px,10vw,120px)!important;
    line-height:.98!important;
    letter-spacing:-.035em!important;
    font-weight:900!important;
  }
  .spotify-liked-hero .liked-art{
    border-radius:4px!important;
    box-shadow:0 4px 60px rgba(0,0,0,.50)!important;
  }
  .spotify-liked-hero .liked-art .hero-icon{width:34%!important;height:34%!important}
  .liked-owner-meta{
    min-height:28px;
    gap:6px!important;
    font-size:14px!important;
    line-height:20px!important;
  }
  .liked-owner-avatar{
    width:28px!important;
    height:28px!important;
    flex-basis:28px!important;
    font-size:12px!important;
  }

  .spotify-liked-body{
    background:linear-gradient(180deg,
      rgb(35 25 69) 0,
      rgb(30 22 57) 38px,
      rgb(29 22 51) 78px,
      rgb(26 21 43) 128px,
      rgb(23 20 35) 178px,
      rgb(21 19 29) 218px,
      rgb(19 18 22) 258px,
      #121212 310px)!important;
    border-radius:0 0 8px 8px;
    overflow:visible;
    padding-bottom:22px;
  }

  .spotify-liked-toolbar{
    min-height:118px!important;
    padding:22px 28px 14px!important;
    background:transparent!important;
  }
  .liked-primary-actions{gap:18px!important}
  .liked-primary-actions .liked-play-btn{
    width:70px!important;
    height:70px!important;
    min-width:70px!important;
    min-height:70px!important;
    flex-basis:70px!important;
  }
  .liked-primary-actions .liked-play-btn .icon{
    width:25px!important;
    height:25px!important;
  }
  .liked-primary-actions .spotify-icon-action{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
  }
  .liked-primary-actions .spotify-icon-action .icon{
    width:32px!important;
    height:32px!important;
  }
  .liked-primary-actions .liked-download-btn.downloaded .icon,
  .liked-primary-actions .liked-download-btn.active .icon{
    width:36px!important;
    height:36px!important;
  }

  .liked-list-tools{gap:10px!important}
  .liked-list-tools .spotify-list-filter-toggle,
  .liked-list-tools .spotify-list-filter-clear{
    width:40px!important;height:40px!important;min-width:40px!important;
  }
  .liked-list-tools .spotify-list-filter-toggle .icon,
  .liked-list-tools .spotify-list-filter-clear .icon{
    width:21px!important;height:21px!important;
  }
  .liked-list-tools .spotify-list-filter-toggle:hover,
  .liked-list-tools .spotify-list-filter-clear:hover{background:transparent!important}
  .liked-downloaded-progress{
    color:#fff;
    font-size:12px;
    font-weight:500;
    white-space:nowrap;
  }
  .liked-downloaded-progress.hidden{display:none!important}
  .liked-downloaded-filter.hidden{display:none!important}
  .liked-downloaded-filter{
    height:36px!important;
    padding:0 13px!important;
    background:#242424!important;
    color:#fff!important;
    font-size:13px!important;
    font-weight:700!important;
  }
  .liked-downloaded-filter .icon{color:#1ed760!important}
  .liked-downloaded-filter:hover{background:#2a2a2a!important}
  .liked-downloaded-filter.active{background:#242424!important;color:#fff!important}

  .liked-sort-control{gap:4px!important}
  .liked-sort-control .spotify-sort-select{
    height:40px!important;
    background:transparent!important;
    color:#b3b3b3!important;
  }
  .liked-sort-control .spotify-sort-select:hover{background:transparent!important;color:#fff!important}
  .liked-sort-control .spotify-sort-select select{
    max-width:154px!important;
    padding:0 8px!important;
    font-size:14px!important;
    font-weight:500!important;
  }
  .liked-sort-control .spotify-sort-select>.icon{display:none!important}
  .liked-sort-control>#likedSortDirection{
    width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;
    color:#b3b3b3!important;
  }
  .liked-sort-control>#likedSortDirection .icon{width:19px!important;height:19px!important}

  .liked-taste-filter-shell{
    margin:17px 0 18px!important;
    padding:0 28px!important;
  }
  .liked-taste-filters{gap:10px!important;padding:0!important;width:calc(100% - 32px)!important}
  .liked-taste-filters button{
    height:40px!important;
    line-height:40px!important;
    padding:0 15px!important;
    border-radius:999px!important;
    background:#312d40!important;
    color:#fff!important;
    font-size:16px!important;
    font-weight:700!important;
  }
  .liked-taste-filters button:hover{background:#3a3648!important}
  .liked-taste-filters button.active{background:#fff!important;color:#000!important}
  .liked-taste-arrow{
    top:0!important;
    width:40px!important;height:40px!important;
    background:#fff!important;color:#242424!important;
    box-shadow:0 3px 10px rgba(0,0,0,.30)!important;
  }
  .liked-taste-prev{left:8px!important}
  .liked-taste-next{right:20px!important}
  .liked-taste-arrow .icon{width:22px!important;height:22px!important}

  .spotify-liked-page .spotify-track-table-wrap{
    padding:0 28px 24px!important;
    background:transparent!important;
  }
  .spotify-liked-page .track-table-liked{
    background:transparent!important;
  }
  .spotify-liked-page .track-table-liked thead,
  .spotify-liked-page .track-table-liked thead tr,
  .spotify-liked-page .track-table-liked thead th,
  .spotify-liked-page .track-table-liked thead th.track-actions-head{
    background:transparent!important;
  }
  .spotify-liked-page .track-table-liked thead{
    box-shadow:0 1px 0 rgba(255,255,255,.10)!important;
  }
  .spotify-liked-page .track-table-liked thead th{
    font-size:14px!important;
    line-height:36px!important;
    color:#b3b3b3!important;
  }
  #content .spotify-liked-page .spotify-track-table-wrap .track-table-liked thead,
  #content .spotify-liked-page .spotify-track-table-wrap .track-table-liked thead tr,
  #content .spotify-liked-page .spotify-track-table-wrap .track-table-liked thead th,
  #content .spotify-liked-page .spotify-track-table-wrap .track-table-liked thead th.track-actions-head{
    background:transparent!important;
  }
  .spotify-liked-page .spotify-track-table-wrap .track-table thead th:first-child,
  .spotify-liked-page .spotify-track-table-wrap .track-table thead th:last-child{
    box-shadow:none!important;
  }
  .spotify-liked-page .track-table-liked col.col-album{width:clamp(200px,19vw,230px)!important}
  .spotify-liked-page .track-table-liked col.col-date{width:clamp(230px,23vw,275px)!important}
  .spotify-liked-page .track-table-liked tbody tr.track-row{
    height:56px!important;
    min-height:56px!important;
  }
}

/* The supplied mobile/compact Liked Songs layout remains intentionally
   independent from the desktop collection hero. */
@media (max-width:820px){
  .spotify-liked-body{background:#121212!important;border-radius:0!important;padding-bottom:0!important}
}

/* the application 1.14.22 — Spotify Home media-card mobile fidelity.
   The desktop card geometry introduced in 1.14.20 remains unchanged. The
   responsive rail now uses the same padded tile model instead of shrinking
   cards to an 8px-padded, 44vw + external-gap variant. */
@media (max-width:820px){
  .spotify-home .home-section-head{
    margin:22px 0 10px!important;
  }
  .spotify-home .home-section-head h2,
  .spotify-home .home-section-head .home-section-title{
    font-size:30px!important;
    line-height:1.2!important;
    letter-spacing:-.6px!important;
    font-weight:800!important;
  }

  /* Spotify's narrow Home rail is effectively two padded tile boxes across
     the viewport. The visible artwork spacing comes from 16px card padding,
     not a separate grid gap. */
  .spotify-home .home-card-grid{
    grid-template-columns:none!important;
    grid-auto-flow:column!important;
    grid-auto-columns:calc((100vw - 14px)/2)!important;
    column-gap:0!important;
    row-gap:0!important;
    margin-left:-14px!important;
    margin-right:-14px!important;
    padding:0 14px 0 0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
  }
  .spotify-home .home-card-grid::-webkit-scrollbar{display:none}
  .spotify-home .home-card-grid>.home-media-card{scroll-snap-align:start}

  .spotify-home .home-media-card,
  .home-section-page .home-media-card{
    box-sizing:border-box!important;
    padding:15px!important;
    border-radius:8px!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    transform:none!important;
    overflow:visible!important;
    transition:background-color .16s ease!important;
  }
  .spotify-home .home-media-card:hover,
  .spotify-home .home-media-card:focus-within,
  .home-section-page .home-media-card:hover,
  .home-section-page .home-media-card:focus-within{
    background:#1f1f1f!important;
    box-shadow:none!important;
    transform:none!important;
  }
  .home-media-card .card-art-wrap{
    margin:0 0 12px!important;
    border-radius:6px!important;
  }
  .home-media-card .card-cover{
    border-radius:6px!important;
    box-shadow:none!important;
  }
  .home-media-card h3{
    margin:0 0 6px!important;
    min-height:0!important;
    font-size:20px!important;
    line-height:1.4!important;
    letter-spacing:0!important;
  }
  .home-media-card .media-card-title-link{
    font-size:inherit!important;
    font-weight:700!important;
    line-height:inherit!important;
    white-space:normal!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    line-clamp:2!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .home-media-card p.media-card-meta{
    margin:0!important;
    min-height:0!important;
    font-size:16px!important;
    line-height:1.48!important;
    color:#b3b3b3!important;
    -webkit-line-clamp:2!important;
    line-clamp:2!important;
  }

  /* Match the Spotify overlay seen in the supplied narrow reference. */
  .home-media-card .card-play{
    width:56px!important;
    height:56px!important;
    min-width:56px!important;
    min-height:56px!important;
    right:12px!important;
    bottom:12px!important;
    opacity:0!important;
    transform:translateY(8px)!important;
    box-shadow:0 8px 18px rgba(0,0,0,.42)!important;
  }
  .home-media-card .card-play .icon{width:24px!important;height:24px!important}
  .home-media-card:hover .card-play,
  .home-media-card:focus-within .card-play,
  .home-media-card.playing .card-play{
    opacity:1!important;
    transform:none!important;
  }
}

@media (max-width:560px){
  .spotify-home .home-card-grid{
    grid-auto-columns:calc((100vw - 14px)/2)!important;
    margin-left:-11px!important;
    margin-right:-11px!important;
    padding-right:11px!important;
  }
}

/* the application 1.14.23 — Liked Songs layout fidelity cleanup.
   Keep the regular playlist component untouched: these rules only correct
   Liked Songs-specific toolbar, taste rail, and compact/mobile geometry. */
@media (min-width:821px){
  .spotify-liked-page .spotify-liked-toolbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    column-gap:24px!important;
  }
  .spotify-liked-page .liked-primary-actions{justify-self:start!important;min-width:0!important}
  .spotify-liked-page .liked-list-tools{
    justify-self:end!important;
    width:auto!important;
    max-width:min(48vw,360px)!important;
    min-width:0!important;
    gap:8px!important;
  }
  .spotify-liked-page .liked-list-tools .spotify-list-filter{flex:0 0 auto!important}
  .spotify-liked-page .liked-downloaded-filter,
  .spotify-liked-page .liked-downloaded-progress{display:none!important}

  /* Spotify reserves room for the circular edge arrow rather than painting it
     over a filter pill. Initial geometry stays x=44; after scrolling, the
     left arrow occupies its own 40px lane. */
  .spotify-liked-page .liked-taste-filter-shell{
    padding-left:28px!important;
    padding-right:28px!important;
    overflow:hidden!important;
    transition:padding-left .12s ease,padding-right .12s ease!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev{padding-left:56px!important}
  .spotify-liked-page .liked-taste-filter-shell.has-next{padding-right:64px!important}
  .spotify-liked-page .liked-taste-filters{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
  }
  .spotify-liked-page .liked-taste-prev{left:8px!important}
  .spotify-liked-page .liked-taste-next{right:20px!important}

  /* Keep table width and the fading collection surface locked to the same
     28px content inset used by Spotify's action rail and hero artwork. */
  .spotify-liked-page .spotify-track-table-wrap{padding-left:28px!important;padding-right:28px!important}
  .spotify-liked-page .track-table-liked{width:100%!important;table-layout:fixed!important}
  .spotify-liked-page .track-table-liked thead th{height:36px!important;vertical-align:middle!important}
}

@media (max-width:820px){
  /* The old Liked Songs mobile grid still reserved a second 44px column for a
     removed More button. This made Download/Shuffle/Play look off-center even
     though normal playlists were correct. */
  .spotify-liked-page .liked-primary-actions{
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr) 44px 58px!important;
    gap:6px!important;
    width:100%!important;
  }
  .spotify-liked-page .liked-primary-actions .liked-download-btn{grid-column:1!important;grid-row:1!important}
  .spotify-liked-page .liked-primary-actions .liked-shuffle-btn{grid-column:3!important;grid-row:1!important}
  .spotify-liked-page .liked-primary-actions .liked-play-btn{grid-column:4!important;grid-row:1!important}
  .spotify-liked-page .liked-downloaded-filter,
  .spotify-liked-page .liked-downloaded-progress{display:none!important}

  /* Keep Liked Songs' unique gradient, but use the same horizontal rhythm as
     the playlist mobile layout that already matches Spotify well. */
  .spotify-liked-page .spotify-liked-hero{padding-left:18px!important;padding-right:18px!important}
  .spotify-liked-page .spotify-liked-toolbar{padding-left:14px!important;padding-right:14px!important}
  .spotify-liked-page .liked-taste-filter-shell{margin:4px 0 10px!important;padding:0!important;overflow:hidden!important}
  .spotify-liked-page .liked-taste-filters{
    width:auto!important;
    padding:0 16px!important;
    margin:0!important;
    gap:8px!important;
    scroll-padding-inline:16px!important;
  }
  .spotify-liked-page .liked-taste-filters button{flex:0 0 auto!important}
  .spotify-liked-page .spotify-track-table-wrap{padding-left:6px!important;padding-right:6px!important}
}

@media (min-width:821px){
  /* Clean Spotify edge lanes: no half-visible pill under the navigation arrow. */
  .spotify-liked-page .liked-taste-filter-shell::before,
  .spotify-liked-page .liked-taste-filter-shell::after{
    content:"";position:absolute;top:0;height:40px;pointer-events:none;z-index:3;opacity:0;
  }
  .spotify-liked-page .liked-taste-filter-shell::before{
    left:0;width:56px;background:linear-gradient(90deg,rgb(24 21 36) 62%,transparent 100%);
  }
  .spotify-liked-page .liked-taste-filter-shell::after{
    right:0;width:64px;background:linear-gradient(270deg,rgb(24 21 36) 62%,transparent 100%);
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev::before,
  .spotify-liked-page .liked-taste-filter-shell.has-next::after{opacity:1}
  .spotify-liked-page .liked-taste-arrow{z-index:5!important}
}
@media (max-width:820px){
  .spotify-liked-page .liked-primary-actions .liked-download-btn,
  .spotify-liked-page .liked-primary-actions .liked-shuffle-btn{
    width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
  }
}

/* the application 1.14.24 — unify Liked Songs with the proven playlist collection
   coordinate system. The desktop content scroller already inserts a 22px
   scroll-away spacer. Liked Songs previously added another +20px wrapper
   margin, producing the large ~42px band under the top navigation. Keep the
   Liked-specific gradient/filter rail, but use the same compact collection
   start and horizontal rhythm as Spotify/regular playlists. */
@media (min-width:821px){
  .spotify-liked-page{
    /* 22px content spacer - 16px cancellation = the ~6px visual gap seen in
       the supplied Spotify reference, instead of the former 42px gap. */
    margin:-16px -12px 0!important;
  }

  /* The hero itself already matches the supplied Liked Songs artwork/title
     geometry. Keep that geometry, while locking all following regions to one
     shared 28px content inset so the action rail, filters, table header and
     rows read as one playlist layout. */
  .spotify-liked-page .spotify-liked-toolbar,
  .spotify-liked-page .liked-taste-filter-shell,
  .spotify-liked-page .spotify-track-table-wrap{
    box-sizing:border-box!important;
  }
  .spotify-liked-page .spotify-liked-toolbar{
    padding-left:28px!important;
    padding-right:28px!important;
  }
  .spotify-liked-page .liked-taste-filter-shell{
    margin-top:21px!important;
  }

  /* Regular playlists and Liked Songs now share the same vertical collection
     flow: hero -> action rail -> optional filter rail -> sticky track header.
     Liked Songs keeps the larger reference-sized Play control and its unique
     mood/genre rail, but no extra blank section is reserved between regions. */
  .spotify-liked-page .spotify-liked-toolbar{min-height:110px!important;padding-top:18px!important;padding-bottom:10px!important}
  .spotify-liked-page .liked-taste-filter-shell{margin-bottom:10px!important}
}

/* Mobile already uses the unified collection-page flow introduced for
   playlists. Prevent any desktop wrapper margin from leaking into it. */
@media (max-width:820px){
  .spotify-liked-page{margin:0!important}
}

/* the application 1.14.25 — Liked Songs top-offset hardening.
   Spotify leaves only a compact ~6px breathing space between the persistent
   desktop navigation row and the Liked Songs collection surface. Avoid the
   previous wrapper-negative-margin compensation: reduce #content's synthetic
   scroll-away spacer for this route directly, then keep the collection page in
   normal flow. This makes Liked Songs follow the same proven collection shell
   geometry as regular playlists without inheriting their artwork accent. */
@media (min-width:821px){
  #content:has(> .spotify-liked-page)::before{
    height:6px!important;
    min-height:6px!important;
  }
  #content>.spotify-liked-page{
    margin:0 -12px 0!important;
  }
}

/* the application 1.14.26 — Spotify collection padding, filter controls and playlist
   gradient continuity. Liked Songs now shares the same 24px desktop content
   inset and 56px primary Play control as the regular playlist component.
   Spotify reference captures can be device-scaled; use CSS-pixel geometry
   (56px Play, 32px filter pills/arrows) rather than screenshot device pixels. */
@media (min-width:821px){
  /* Regular playlists occupy the full #content collection width by extending
     through the parent's 24px padding. Give Liked Songs the same coordinate
     system, then re-apply the same 24px inset to its actual content. */
  #content>.spotify-liked-page{margin:0 -24px 0!important}
  .spotify-liked-page .spotify-liked-hero{
    padding-left:24px!important;
    padding-right:24px!important;
  }
  .spotify-liked-page .spotify-liked-toolbar{
    min-height:92px!important;
    padding:18px 24px 10px!important;
  }
  .spotify-liked-page .liked-primary-actions{gap:14px!important}
  .spotify-liked-page .liked-primary-actions .liked-play-btn{
    width:56px!important;height:56px!important;
    min-width:56px!important;min-height:56px!important;flex-basis:56px!important;
  }
  .spotify-liked-page .liked-primary-actions .liked-play-btn .icon{
    width:22px!important;height:22px!important;
  }

  /* Spotify's desktop Liked Songs genre/mood rail uses compact 32px pills.
     Edge arrows use the same 32px circle and reserve their own lane. */
  .spotify-liked-page .liked-taste-filter-shell{
    margin:10px 0 10px!important;
    padding-left:24px!important;
    padding-right:24px!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev{padding-left:64px!important}
  .spotify-liked-page .liked-taste-filter-shell.has-next{padding-right:64px!important}
  .spotify-liked-page .liked-taste-filters{gap:8px!important;width:100%!important}
  .spotify-liked-page .liked-taste-filters button{
    height:32px!important;line-height:32px!important;
    padding:0 12px!important;
    font-size:14px!important;font-weight:700!important;
    background:#312d40!important;
  }
  .spotify-liked-page .liked-taste-arrow{
    display:grid!important;
    top:0!important;
    width:32px!important;height:32px!important;
    min-width:32px!important;min-height:32px!important;
  }
  .spotify-liked-page .liked-taste-arrow.hidden{display:none!important}
  .spotify-liked-page .liked-taste-prev{left:24px!important}
  .spotify-liked-page .liked-taste-next{right:24px!important}
  .spotify-liked-page .liked-taste-arrow .icon{width:18px!important;height:18px!important}

  /* Same horizontal track-list inset as a normal playlist. */
  .spotify-liked-page .spotify-track-table-wrap{
    padding-left:24px!important;padding-right:24px!important;
  }

  /* Resize the edge masks to the compact Spotify filter controls. */
  .spotify-liked-page .liked-taste-filter-shell::before,
  .spotify-liked-page .liked-taste-filter-shell::after{height:32px!important}
  .spotify-liked-page .liked-taste-filter-shell::before{
    left:0!important;width:64px!important;
    background:linear-gradient(90deg,rgb(24 21 36) 70%,transparent 100%)!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::after{
    right:0!important;width:64px!important;
    background:linear-gradient(270deg,rgb(24 21 36) 70%,transparent 100%)!important;
  }

  /* Continue a playlist's sampled artwork color below the hero, exactly like
     Liked Songs continues its purple collection color through the action rail
     and fades it into the list. applySpotifyCollectionAccent() already sets
     --spotify-collection-accent from the playlist artwork. */
  .spotify-playlist-hero{
    background:linear-gradient(180deg,
      color-mix(in srgb,var(--spotify-collection-accent) 84%,#2b2b2b) 0%,
      color-mix(in srgb,var(--spotify-collection-accent) 58%,#242424) 56%,
      color-mix(in srgb,var(--spotify-collection-accent) 34%,#121212) 100%)!important;
  }
  .spotify-playlist-page .spotify-playlist-toolbar{
    background:linear-gradient(180deg,
      color-mix(in srgb,var(--spotify-collection-accent) 34%,#121212) 0%,
      color-mix(in srgb,var(--spotify-collection-accent) 22%,#121212) 100%)!important;
  }
  .spotify-playlist-page .spotify-track-table-wrap{
    background:linear-gradient(180deg,
      color-mix(in srgb,var(--spotify-collection-accent) 22%,#121212) 0,
      color-mix(in srgb,var(--spotify-collection-accent) 12%,#121212) 104px,
      #121212 286px)!important;
  }
  .spotify-playlist-page .track-table-playlist{background:transparent!important}
  #content .spotify-playlist-page .spotify-track-table-wrap .track-table-playlist thead,
  #content .spotify-playlist-page .spotify-track-table-wrap .track-table-playlist thead tr,
  #content .spotify-playlist-page .spotify-track-table-wrap .track-table-playlist thead th,
  #content .spotify-playlist-page .spotify-track-table-wrap .track-table-playlist thead th.track-actions-head{
    background:color-mix(in srgb,var(--spotify-collection-accent) 13%,#121212)!important;
  }
  #content .spotify-playlist-page .spotify-track-table-wrap .track-table-playlist thead th:first-child{
    box-shadow:-24px 0 0 color-mix(in srgb,var(--spotify-collection-accent) 13%,#121212)!important;
  }
  #content .spotify-playlist-page .spotify-track-table-wrap .track-table-playlist thead th:last-child{
    box-shadow:24px 0 0 color-mix(in srgb,var(--spotify-collection-accent) 13%,#121212)!important;
  }
}

@media (max-width:820px){
  /* Mobile Liked Songs keeps the same playlist padding rhythm, while restoring
     the Spotify filter arrows when the rail overflows. */
  .spotify-liked-page .liked-primary-actions .liked-play-btn{
    width:56px!important;height:56px!important;min-width:56px!important;min-height:56px!important;
  }
  .spotify-liked-page .liked-primary-actions .liked-play-btn .icon{width:22px!important;height:22px!important}
  .spotify-liked-page .liked-taste-filter-shell{
    margin:4px 0 10px!important;
    padding-left:14px!important;padding-right:14px!important;
    overflow:hidden!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev{padding-left:52px!important}
  .spotify-liked-page .liked-taste-filter-shell.has-next{padding-right:52px!important}
  .spotify-liked-page .liked-taste-filters{
    width:100%!important;padding:0!important;margin:0!important;gap:8px!important;
    scroll-padding-inline:0!important;
  }
  .spotify-liked-page .liked-taste-filters button{
    height:32px!important;line-height:32px!important;padding:0 12px!important;
    font-size:14px!important;font-weight:700!important;background:#312d40!important;
  }
  .spotify-liked-page .liked-taste-arrow{
    display:grid!important;top:0!important;width:32px!important;height:32px!important;
    min-width:32px!important;min-height:32px!important;background:#fff!important;color:#242424!important;
    box-shadow:0 3px 10px rgba(0,0,0,.30)!important;z-index:6!important;
  }
  .spotify-liked-page .liked-taste-arrow.hidden{display:none!important}
  .spotify-liked-page .liked-taste-prev{left:14px!important}
  .spotify-liked-page .liked-taste-next{right:14px!important}
  .spotify-liked-page .liked-taste-arrow .icon{width:18px!important;height:18px!important}
  .spotify-liked-page .liked-taste-filter-shell::before,
  .spotify-liked-page .liked-taste-filter-shell::after{
    content:"";position:absolute;top:0;height:32px;pointer-events:none;z-index:5;opacity:0;
  }
  .spotify-liked-page .liked-taste-filter-shell::before{
    left:0;width:52px;background:linear-gradient(90deg,#121212 72%,transparent 100%);
  }
  .spotify-liked-page .liked-taste-filter-shell::after{
    right:0;width:52px;background:linear-gradient(270deg,#121212 72%,transparent 100%);
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev::before,
  .spotify-liked-page .liked-taste-filter-shell.has-next::after{opacity:1}

  /* Carry the sampled playlist color into the controls on mobile as well,
     fading back to #121212 before the track list becomes visually dense. */
  .spotify-playlist-page .spotify-playlist-toolbar{
    background:linear-gradient(180deg,
      color-mix(in srgb,var(--spotify-collection-accent) 18%,#121212) 0%,
      #121212 100%)!important;
  }
  .spotify-playlist-page .spotify-track-table-wrap{
    background:linear-gradient(180deg,
      color-mix(in srgb,var(--spotify-collection-accent) 8%,#121212) 0,
      #121212 112px)!important;
  }
}
@media (min-width:821px){
  #content .spotify-liked-page .spotify-liked-hero{
    padding-left:24px!important;
    padding-right:24px!important;
  }
}

/* the application 1.14.27 — sticky Liked Songs header + seamless playlist accent surface.
   Liked Songs had a late transparency override that defeated the shared Spotify
   sticky-track-header surface. Regular playlists already keep an opaque header
   pinned at the top of the sole content scroller. Restore that same behavior.
   Playlist accent gradients are also made full-bleed while preserving the same
   24px content inset, so the sampled artwork tone no longer stops at the inner
   toolbar/table edge and reveal a #121212 gutter. */
@media (min-width:821px){
  .spotify-liked-page{
    --spotify-liked-sticky-head-bg:color-mix(in srgb,#50389d 13%,#121212);
  }
  #content .spotify-liked-page .spotify-track-table-wrap .track-table-liked thead{
    position:sticky!important;
    top:0!important;
    z-index:9!important;
    background:var(--spotify-liked-sticky-head-bg)!important;
    box-shadow:0 1px 0 rgba(255,255,255,.10)!important;
  }
  #content .spotify-liked-page .spotify-track-table-wrap .track-table-liked thead tr,
  #content .spotify-liked-page .spotify-track-table-wrap .track-table-liked thead th,
  #content .spotify-liked-page .spotify-track-table-wrap .track-table-liked thead th.track-actions-head{
    background:var(--spotify-liked-sticky-head-bg)!important;
  }
  #content .spotify-liked-page .spotify-track-table-wrap .track-table-liked thead th:first-child{
    box-shadow:-24px 0 0 var(--spotify-liked-sticky-head-bg)!important;
  }
  #content .spotify-liked-page .spotify-track-table-wrap .track-table-liked thead th:last-child{
    box-shadow:24px 0 0 var(--spotify-liked-sticky-head-bg)!important;
  }

  /* The playlist page itself begins on the normal 24px collection inset. Bleed
     only the colored surface to the outer content edge, then put the controls
     and table back on that same 24px coordinate. */
  .spotify-playlist-page .spotify-playlist-toolbar{
    box-sizing:border-box!important;
    margin-left:-24px!important;
    margin-right:-24px!important;
    padding-left:24px!important;
    padding-right:24px!important;
  }
  .spotify-playlist-page .spotify-track-table-wrap{
    box-sizing:border-box!important;
    margin-left:-24px!important;
    margin-right:-24px!important;
    padding-left:24px!important;
    padding-right:24px!important;
  }
}

/* the application 1.14.28 — full-bleed Liked Songs + true full-width playlist accent.
   Liked Songs should use the same edge-to-edge collection surface as a normal
   playlist: no synthetic gap above the hero and no outer horizontal wrapper
   gutter. Keep the actual artwork/actions/filters/table content on the common
   24px Spotify collection inset. The playlist table wrapper is explicitly
   width:100% in the shared table CSS, so negative margins alone only shift it
   left and leave a 48px right-side seam. Expand its border box by both insets. */
@media (min-width:821px){
  /* Remove the Liked Songs-only scroll-away spacer. The collection surface now
     begins directly under the persistent topbar, like the playlist hero. */
  #content:has(> .spotify-liked-page)::before{
    height:0!important;
    min-height:0!important;
  }

  /* Bleed the entire Liked Songs collection through #content's 24px side
     padding. Internal sections already re-apply their own 24px content inset. */
  #content>.spotify-liked-page{
    margin:0 -24px!important;
    border-radius:0!important;
    overflow:visible!important;
    background:#121212!important;
  }
  #content .spotify-liked-page .spotify-liked-hero{
    margin:0!important;
    border-radius:0!important;
  }
  .spotify-liked-page .spotify-liked-body{
    width:100%!important;
    border-radius:0!important;
  }

  /* .spotify-track-table-wrap has width:100% globally. With -24px margins that
     width used to end 24px short of the parent on the right (48px short of the
     outer content edge), exposing a different #121212 band. Widen the actual
     gradient box so left and right edges reach the same full-bleed boundary. */
  .spotify-playlist-page .spotify-track-table-wrap{
    width:calc(100% + 48px)!important;
    max-width:none!important;
    margin-left:-24px!important;
    margin-right:-24px!important;
    padding-left:24px!important;
    padding-right:24px!important;
  }
  .spotify-playlist-page .spotify-playlist-toolbar{
    width:auto!important;
    margin-left:-24px!important;
    margin-right:-24px!important;
    padding-left:24px!important;
    padding-right:24px!important;
  }
}

/* the application 1.14.29 — Spotify-exact Liked Songs taste-filter rail.
   Reference geometry from the supplied Spotify captures:
   - pills: 40px high
   - circular previous/next controls: 40x40px
   - 10px pill gap
   - arrow lanes sit at the collection edge and fade the first/last chip beneath
     the lane instead of shrinking or covering the labels. */
@media (min-width:821px){
  .spotify-liked-page .liked-taste-filter-shell{
    box-sizing:border-box!important;
    position:relative!important;
    height:40px!important;
    min-height:40px!important;
    margin:12px 0 12px!important;
    padding:0 24px!important;
    overflow:hidden!important;
    transition:none!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev{padding-left:64px!important}
  .spotify-liked-page .liked-taste-filter-shell.has-next{padding-right:64px!important}

  .spotify-liked-page .liked-taste-filters{
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    gap:10px!important;
    padding:0!important;
    margin:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    scroll-behavior:smooth!important;
    scroll-snap-type:none!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .spotify-liked-page .liked-taste-filters::-webkit-scrollbar{display:none!important}
  .spotify-liked-page .liked-taste-filters button{
    box-sizing:border-box!important;
    flex:0 0 auto!important;
    height:40px!important;
    min-height:40px!important;
    line-height:40px!important;
    padding:0 15px!important;
    border:0!important;
    border-radius:999px!important;
    background:#312d40!important;
    color:#fff!important;
    font-size:16px!important;
    font-weight:700!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
    box-shadow:none!important;
    transform:none!important;
    transition:background-color .12s ease,color .12s ease!important;
  }
  .spotify-liked-page .liked-taste-filters button:hover{background:#3a3648!important;transform:none!important}
  .spotify-liked-page .liked-taste-filters button:active{background:#423d50!important;transform:none!important}
  .spotify-liked-page .liked-taste-filters button.active{background:#fff!important;color:#000!important}

  .spotify-liked-page .liked-taste-arrow{
    box-sizing:border-box!important;
    display:grid!important;
    place-items:center!important;
    position:absolute!important;
    top:0!important;
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
    padding:0!important;
    border:0!important;
    border-radius:50%!important;
    background:#fff!important;
    color:#242424!important;
    box-shadow:none!important;
    opacity:1!important;
    transform:none!important;
    cursor:pointer!important;
    z-index:8!important;
    transition:transform .10s ease,background-color .10s ease!important;
  }
  .spotify-liked-page .liked-taste-arrow:hover:not(:disabled){background:#fff!important;transform:scale(1.04)!important}
  .spotify-liked-page .liked-taste-arrow:active:not(:disabled){transform:scale(.96)!important}
  .spotify-liked-page .liked-taste-arrow.hidden{display:none!important}
  .spotify-liked-page .liked-taste-prev{left:18px!important}
  .spotify-liked-page .liked-taste-next{right:20px!important}
  .spotify-liked-page .liked-taste-arrow .icon{width:22px!important;height:22px!important;stroke-width:2!important}

  /* Spotify darkens/fades the chip nearest an active edge arrow. These masks
     are beneath the white circle but above the scrolling rail. */
  .spotify-liked-page .liked-taste-filter-shell::before,
  .spotify-liked-page .liked-taste-filter-shell::after{
    content:""!important;
    position:absolute!important;
    top:0!important;
    width:64px!important;
    height:40px!important;
    pointer-events:none!important;
    opacity:0!important;
    z-index:7!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::before{
    left:0!important;
    background:linear-gradient(90deg,rgb(24 20 36) 48%,rgba(24,20,36,.92) 68%,transparent 100%)!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::after{
    right:0!important;
    background:linear-gradient(270deg,rgb(24 20 36) 48%,rgba(24,20,36,.92) 68%,transparent 100%)!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev::before,
  .spotify-liked-page .liked-taste-filter-shell.has-next::after{opacity:1!important}
}

/* Spotify keeps the same touch target and pill proportions on the compact
   Liked Songs rail; only the edge offsets tighten with the viewport. */
@media (max-width:820px){
  .spotify-liked-page .liked-taste-filter-shell{
    box-sizing:border-box!important;
    height:40px!important;
    min-height:40px!important;
    margin:8px 0 10px!important;
    padding:0 14px!important;
    overflow:hidden!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev{padding-left:58px!important}
  .spotify-liked-page .liked-taste-filter-shell.has-next{padding-right:58px!important}
  .spotify-liked-page .liked-taste-filters{
    width:100%!important;height:40px!important;min-height:40px!important;
    padding:0!important;margin:0!important;gap:10px!important;
  }
  .spotify-liked-page .liked-taste-filters button{
    height:40px!important;min-height:40px!important;line-height:40px!important;
    padding:0 15px!important;font-size:16px!important;font-weight:700!important;
    background:#312d40!important;border-radius:999px!important;
  }
  .spotify-liked-page .liked-taste-arrow{
    display:grid!important;top:0!important;width:40px!important;height:40px!important;
    min-width:40px!important;min-height:40px!important;background:#fff!important;color:#242424!important;
    box-shadow:none!important;z-index:8!important;
  }
  .spotify-liked-page .liked-taste-arrow.hidden{display:none!important}
  .spotify-liked-page .liked-taste-prev{left:18px!important}
  .spotify-liked-page .liked-taste-next{right:18px!important}
  .spotify-liked-page .liked-taste-arrow .icon{width:22px!important;height:22px!important}
  .spotify-liked-page .liked-taste-filter-shell::before,
  .spotify-liked-page .liked-taste-filter-shell::after{
    top:0!important;width:60px!important;height:40px!important;z-index:7!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::before{
    left:0!important;background:linear-gradient(90deg,#121212 52%,rgba(18,18,18,.90) 70%,transparent 100%)!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::after{
    right:0!important;background:linear-gradient(270deg,#121212 52%,rgba(18,18,18,.90) 70%,transparent 100%)!important;
  }
}

/* the application 1.14.30 — make likedTasteFilters a real Spotify-style carousel.
   Spotify keeps this taste-filter strip as a bounded horizontal carousel rather
   than allowing an ultra-wide desktop viewport to consume every filter and
   remove the navigation affordance.  The 1120px desktop window also matches
   the supplied Spotify row proportions; narrower viewports remain fluid. */
@media (min-width:821px){
  .spotify-liked-page .liked-taste-filter-shell{
    width:min(100%,1120px)!important;
    max-width:1120px!important;
    margin-left:0!important;
    margin-right:auto!important;
  }
}

/* the application 1.14.31 — Spotify edge-gap/fade geometry for likedTasteFilters.
   The carousel uses the full available collection width. When an edge arrow is
   present, reserve exactly an 8px breathing gap after the 40px circle and fade
   the nearest pill beneath a short edge mask, matching the supplied Spotify
   captures. Ordinary pill-to-pill spacing is the tighter Spotify 8px rhythm. */
@media (min-width:821px){
  .spotify-liked-page .liked-taste-filter-shell{
    --liked-taste-edge-bg:color-mix(in srgb,#50389d 13%,#121212);
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:24px!important;
    padding-right:24px!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev{padding-left:66px!important}
  .spotify-liked-page .liked-taste-filter-shell.has-next{padding-right:68px!important}
  .spotify-liked-page .liked-taste-filters{
    width:100%!important;
    max-width:none!important;
    gap:8px!important;
  }
  .spotify-liked-page .liked-taste-prev{left:18px!important}
  .spotify-liked-page .liked-taste-next{right:20px!important}

  .spotify-liked-page .liked-taste-filter-shell::before,
  .spotify-liked-page .liked-taste-filter-shell::after{
    width:82px!important;
    height:40px!important;
    opacity:0!important;
    pointer-events:none!important;
    z-index:7!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::before{
    left:0!important;
    background:linear-gradient(90deg,
      var(--liked-taste-edge-bg) 0,
      var(--liked-taste-edge-bg) 58px,
      color-mix(in srgb,var(--liked-taste-edge-bg) 92%,transparent) 62px,
      color-mix(in srgb,var(--liked-taste-edge-bg) 58%,transparent) 70px,
      transparent 82px)!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::after{
    right:0!important;
    background:linear-gradient(270deg,
      var(--liked-taste-edge-bg) 0,
      var(--liked-taste-edge-bg) 60px,
      color-mix(in srgb,var(--liked-taste-edge-bg) 92%,transparent) 64px,
      color-mix(in srgb,var(--liked-taste-edge-bg) 58%,transparent) 72px,
      transparent 82px)!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev::before,
  .spotify-liked-page .liked-taste-filter-shell.has-next::after{opacity:1!important}
}

@media (max-width:820px){
  .spotify-liked-page .liked-taste-filter-shell{
    --liked-taste-edge-bg:color-mix(in srgb,#50389d 13%,#121212);
    width:100%!important;
    max-width:none!important;
    padding-left:16px!important;
    padding-right:16px!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev{padding-left:64px!important}
  .spotify-liked-page .liked-taste-filter-shell.has-next{padding-right:64px!important}
  .spotify-liked-page .liked-taste-filters{width:100%!important;max-width:none!important;gap:8px!important}
  .spotify-liked-page .liked-taste-prev{left:16px!important}
  .spotify-liked-page .liked-taste-next{right:16px!important}
  .spotify-liked-page .liked-taste-filter-shell::before,
  .spotify-liked-page .liked-taste-filter-shell::after{
    width:80px!important;height:40px!important;opacity:0!important;z-index:7!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::before{
    left:0!important;
    background:linear-gradient(90deg,
      var(--liked-taste-edge-bg) 0,
      var(--liked-taste-edge-bg) 56px,
      color-mix(in srgb,var(--liked-taste-edge-bg) 90%,transparent) 60px,
      color-mix(in srgb,var(--liked-taste-edge-bg) 55%,transparent) 68px,
      transparent 80px)!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::after{
    right:0!important;
    background:linear-gradient(270deg,
      var(--liked-taste-edge-bg) 0,
      var(--liked-taste-edge-bg) 56px,
      color-mix(in srgb,var(--liked-taste-edge-bg) 90%,transparent) 60px,
      color-mix(in srgb,var(--liked-taste-edge-bg) 55%,transparent) 68px,
      transparent 80px)!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev::before,
  .spotify-liked-page .liked-taste-filter-shell.has-next::after{opacity:1!important}
}

/* the application 1.14.32 — Spotify-accurate Liked Songs taste filters.
   Desktop uses Spotify's dense charcoal chip rail with compact overlay arrows.
   Mobile is swipe-first (no arrows) and the selected state collapses to a
   dedicated X control + Spotify-green active chip, matching the native app. */
.spotify-liked-page .liked-filter-count{display:none!important}
.spotify-liked-page .liked-taste-filter-shell{
  --liked-filter-surface:color-mix(in srgb,var(--spotify-collection-accent,#50389d) 12%,#121212);
  box-sizing:border-box!important;
  position:relative!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  overflow:hidden!important;
}
.spotify-liked-page .liked-taste-filters{
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  min-width:0!important;
  width:100%!important;
  max-width:none!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
  overscroll-behavior-x:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scroll-behavior:smooth!important;
  touch-action:pan-x pan-y!important;
}
.spotify-liked-page .liked-taste-filters::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}
.spotify-liked-page .liked-taste-filters [data-liked-taste-filter],
.spotify-liked-page .liked-taste-active-chip,
.spotify-liked-page .liked-taste-clear{
  box-sizing:border-box!important;
  flex:0 0 auto!important;
  border:0!important;
  box-shadow:none!important;
  white-space:nowrap!important;
  letter-spacing:0!important;
}
.spotify-liked-page .liked-taste-filters [data-liked-taste-filter]{
  background:#2a2a2a!important;
  color:#fff!important;
  cursor:pointer!important;
  transform:none!important;
  transition:background-color .12s ease,transform .08s ease!important;
}
.spotify-liked-page .liked-taste-filters [data-liked-taste-filter]:hover{background:#3a3a3a!important}
.spotify-liked-page .liked-taste-filters [data-liked-taste-filter]:active{background:#444!important;transform:scale(.97)!important}
.spotify-liked-page .liked-taste-filters.is-filtered [data-liked-taste-filter]{display:none!important}
.spotify-liked-page .liked-taste-clear{
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border-radius:50%!important;
  background:#2a2a2a!important;
  color:#fff!important;
  cursor:pointer!important;
  transition:background-color .12s ease,transform .08s ease!important;
}
.spotify-liked-page .liked-taste-clear:hover{background:#3a3a3a!important}
.spotify-liked-page .liked-taste-clear:active{transform:scale(.94)!important}
.spotify-liked-page .liked-taste-clear.hidden,
.spotify-liked-page .liked-taste-active-chip.hidden{display:none!important}
.spotify-liked-page .liked-taste-active-chip{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:999px!important;
  background:#1ed760!important;
  color:#000!important;
  font-weight:600!important;
  user-select:none!important;
}

@media (min-width:821px){
  .spotify-liked-page .liked-taste-filter-shell{
    height:30px!important;
    min-height:30px!important;
    margin:6px 0 13px!important;
    padding:0 24px!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev{padding-left:60px!important}
  .spotify-liked-page .liked-taste-filter-shell.has-next{padding-right:60px!important}
  .spotify-liked-page .liked-taste-filters{
    height:30px!important;
    min-height:30px!important;
    padding:0!important;
    margin:0!important;
    gap:6px!important;
  }
  .spotify-liked-page .liked-taste-filters [data-liked-taste-filter],
  .spotify-liked-page .liked-taste-active-chip{
    height:28px!important;
    min-height:28px!important;
    line-height:28px!important;
    padding:0 10px!important;
    border-radius:999px!important;
    font-size:11.5px!important;
    font-weight:600!important;
  }
  .spotify-liked-page .liked-taste-clear{
    width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important;
  }
  .spotify-liked-page .liked-taste-clear .icon{width:15px!important;height:15px!important;stroke-width:2!important}
  .spotify-liked-page .liked-taste-arrow{
    box-sizing:border-box!important;
    display:grid!important;
    place-items:center!important;
    position:absolute!important;
    top:1px!important;
    width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important;
    padding:0!important;
    border:0!important;
    border-radius:50%!important;
    background:#fff!important;
    color:#181818!important;
    box-shadow:0 2px 8px rgba(0,0,0,.34)!important;
    cursor:pointer!important;
    opacity:1!important;
    z-index:8!important;
    transition:transform .10s ease,background-color .10s ease!important;
  }
  .spotify-liked-page .liked-taste-arrow:hover:not(:disabled){background:#fff!important;transform:scale(1.04)!important}
  .spotify-liked-page .liked-taste-arrow:active:not(:disabled){transform:scale(.95)!important}
  .spotify-liked-page .liked-taste-arrow.hidden{display:none!important}
  .spotify-liked-page .liked-taste-prev{left:24px!important}
  .spotify-liked-page .liked-taste-next{right:24px!important}
  .spotify-liked-page .liked-taste-arrow .icon{width:16px!important;height:16px!important;stroke-width:2.2!important}
  .spotify-liked-page .liked-taste-filter-shell::before,
  .spotify-liked-page .liked-taste-filter-shell::after{
    content:""!important;
    position:absolute!important;
    top:0!important;
    width:58px!important;
    height:30px!important;
    opacity:0!important;
    pointer-events:none!important;
    z-index:7!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::before{
    left:0!important;
    background:linear-gradient(90deg,var(--liked-filter-surface) 0,var(--liked-filter-surface) 39px,color-mix(in srgb,var(--liked-filter-surface) 72%,transparent) 49px,transparent 58px)!important;
  }
  .spotify-liked-page .liked-taste-filter-shell::after{
    right:0!important;
    background:linear-gradient(270deg,var(--liked-filter-surface) 0,var(--liked-filter-surface) 39px,color-mix(in srgb,var(--liked-filter-surface) 72%,transparent) 49px,transparent 58px)!important;
  }
  .spotify-liked-page .liked-taste-filter-shell.has-prev::before,
  .spotify-liked-page .liked-taste-filter-shell.has-next::after{opacity:1!important}
  .spotify-liked-page .liked-taste-filter-shell:has(.liked-taste-filters.is-filtered){padding-left:24px!important;padding-right:24px!important}
  .spotify-liked-page .liked-taste-filter-shell:has(.liked-taste-filters.is-filtered)::before,
  .spotify-liked-page .liked-taste-filter-shell:has(.liked-taste-filters.is-filtered)::after{opacity:0!important}
}

@media (max-width:820px){
  .spotify-liked-page .liked-taste-filter-shell,
  .spotify-liked-page .liked-taste-filter-shell.has-prev,
  .spotify-liked-page .liked-taste-filter-shell.has-next{
    height:34px!important;
    min-height:34px!important;
    margin:8px 0 12px!important;
    padding:0!important;
    overflow:visible!important;
  }
  .spotify-liked-page .liked-taste-filters{
    height:34px!important;
    min-height:34px!important;
    width:100%!important;
    margin:0!important;
    padding:0 16px!important;
    gap:8px!important;
  }
  .spotify-liked-page .liked-taste-filters [data-liked-taste-filter],
  .spotify-liked-page .liked-taste-active-chip{
    height:34px!important;
    min-height:34px!important;
    line-height:34px!important;
    padding:0 13px!important;
    border-radius:999px!important;
    font-size:13px!important;
    font-weight:500!important;
  }
  .spotify-liked-page .liked-taste-active-chip{font-weight:600!important}
  .spotify-liked-page .liked-taste-clear{
    width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;
  }
  .spotify-liked-page .liked-taste-clear .icon{width:17px!important;height:17px!important;stroke-width:2!important}
  .spotify-liked-page .liked-taste-arrow{display:none!important}
  .spotify-liked-page .liked-taste-filter-shell::before,
  .spotify-liked-page .liked-taste-filter-shell::after{content:none!important;display:none!important}
}

@media (max-width:420px){
  .spotify-liked-page .liked-taste-filters{padding-inline:14px!important;gap:7px!important}
  .spotify-liked-page .liked-taste-filters [data-liked-taste-filter],
  .spotify-liked-page .liked-taste-active-chip{padding-inline:12px!important}
}


/* the application 1.14.33 — Spotify selected Liked Songs filter fidelity + mobile input fix.
   The supplied Spotify reference uses a neutral translucent X circle followed by
   a white selected mood/genre pill. Mobile keeps the native 40px touch geometry. */
.spotify-liked-page .liked-taste-active-chip{
  background:#fff!important;
  color:#000!important;
}
.spotify-liked-page .liked-taste-filters [data-liked-taste-filter].active{
  background:#fff!important;
  color:#000!important;
}
.spotify-liked-page .liked-taste-clear{
  background:rgba(255,255,255,.10)!important;
  color:#b3b3b3!important;
}
.spotify-liked-page .liked-taste-clear:hover{background:rgba(255,255,255,.16)!important;color:#fff!important}
.spotify-liked-page .liked-taste-clear:active{background:rgba(255,255,255,.13)!important}

@media (min-width:821px){
  .spotify-liked-page .liked-taste-active-chip{
    font-weight:600!important;
  }
  .spotify-liked-page .liked-taste-clear .icon{
    stroke-width:1.8!important;
  }
}

@media (max-width:820px){
  .spotify-liked-page .liked-taste-filter-shell,
  .spotify-liked-page .liked-taste-filter-shell.has-prev,
  .spotify-liked-page .liked-taste-filter-shell.has-next{
    height:40px!important;
    min-height:40px!important;
    margin:8px 0 12px!important;
    padding:0!important;
    overflow:visible!important;
  }
  .spotify-liked-page .liked-taste-filters{
    height:40px!important;
    min-height:40px!important;
    width:100%!important;
    margin:0!important;
    padding:0 16px 0 12px!important;
    gap:10px!important;
    scroll-padding-inline:12px!important;
    touch-action:pan-x pan-y!important;
  }
  .spotify-liked-page .liked-taste-filters [data-liked-taste-filter],
  .spotify-liked-page .liked-taste-active-chip{
    height:40px!important;
    min-height:40px!important;
    line-height:40px!important;
    padding:0 16px!important;
    border-radius:999px!important;
    font-size:16px!important;
    font-weight:500!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  .spotify-liked-page .liked-taste-active-chip{
    padding-inline:18px!important;
    background:#fff!important;
    color:#000!important;
    font-weight:500!important;
  }
  .spotify-liked-page .liked-taste-clear{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
    flex-basis:40px!important;
    background:rgba(255,255,255,.10)!important;
    color:#b3b3b3!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  .spotify-liked-page .liked-taste-clear .icon{
    width:22px!important;
    height:22px!important;
    stroke-width:1.65!important;
  }
  .spotify-liked-page .liked-taste-filters.is-filtered{
    gap:10px!important;
  }
}

@media (max-width:420px){
  .spotify-liked-page .liked-taste-filters{
    padding-left:12px!important;
    padding-right:14px!important;
    gap:10px!important;
  }
  .spotify-liked-page .liked-taste-filters [data-liked-taste-filter]{
    padding-inline:15px!important;
  }
  .spotify-liked-page .liked-taste-active-chip{
    padding-inline:18px!important;
  }
}

/* the application 1.14.34 — selected Liked Songs filter pixel fidelity + mobile list enforcement.
   The selected state follows the supplied Spotify reference: a 40px translucent
   circular clear control, a thin centred X, 10px separation, and a 40px white
   active pill with 16px medium black text. This selected geometry is identical
   across desktop and mobile; the unselected desktop rail keeps its denser form. */
.spotify-liked-page .liked-taste-filter-shell.is-filtered,
.spotify-liked-page .liked-taste-filter-shell.is-filtered.has-prev,
.spotify-liked-page .liked-taste-filter-shell.is-filtered.has-next{
  height:40px!important;
  min-height:40px!important;
  padding-left:12px!important;
  padding-right:16px!important;
  overflow:visible!important;
}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-filters{
  height:40px!important;
  min-height:40px!important;
  width:100%!important;
  padding:0!important;
  margin:0!important;
  gap:10px!important;
  align-items:center!important;
}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-clear{
  position:relative!important;
  display:block!important;
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  min-height:40px!important;
  flex:0 0 40px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:999px!important;
  clip-path:circle(50% at 50% 50%)!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.10)!important;
  color:#a7a7a7!important;
  box-shadow:none!important;
  transform:none!important;
}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-clear .icon{display:none!important}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-clear::before,
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-clear::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:18px!important;
  height:1.5px!important;
  border-radius:999px!important;
  background:#a7a7a7!important;
  transform-origin:50% 50%!important;
  pointer-events:none!important;
}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-clear::before{transform:translate(-50%,-50%) rotate(45deg)!important}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-clear::after{transform:translate(-50%,-50%) rotate(-45deg)!important}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-clear:hover{background:rgba(255,255,255,.14)!important}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-clear:hover::before,
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-clear:hover::after{background:#fff!important}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-clear:active{transform:scale(.96)!important}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-active-chip{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:40px!important;
  min-height:40px!important;
  line-height:40px!important;
  padding:0 17px!important;
  margin:0!important;
  border:0!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#000!important;
  font-size:16px!important;
  font-weight:500!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  user-select:none!important;
}
.spotify-liked-page .liked-taste-filter-shell.is-filtered .liked-taste-arrow{display:none!important}
.spotify-liked-page .liked-taste-filter-shell.is-filtered::before,
.spotify-liked-page .liked-taste-filter-shell.is-filtered::after{content:none!important;display:none!important}

@media (min-width:821px){
  .spotify-liked-page .liked-taste-filter-shell.is-filtered{
    margin:6px 0 13px!important;
  }
}
@media (max-width:820px){
  .spotify-liked-page .liked-taste-filter-shell.is-filtered{
    margin:8px 0 12px!important;
    padding-left:12px!important;
    padding-right:14px!important;
  }
  /* The JS also applies an inline important display guard. This selector is a
     CSS-level fallback for responsive/table-row rules and makes the intent
     explicit for browsers restoring a row after touch/viewport work. */
  .spotify-liked-page .track-table-liked tbody tr.track-row.hidden,
  .spotify-liked-page .track-table-liked tbody tr.track-row[hidden]{display:none!important}
}


/* the application 1.14.35 — Spotify collection search fidelity.
   Desktop keeps Spotify's compact magnifier beside Sort and expands only while
   filtering. Mobile uses Spotify's separate pull-down "Find in …" bar above the
   collection header with a dedicated Sort button; it is not a shrunken desktop
   control. */
.spotify-mobile-collection-findbar{display:none}
.spotify-list-filter input[type="search"]::-webkit-search-decoration,
.spotify-list-filter input[type="search"]::-webkit-search-cancel-button,
.spotify-mobile-find-field input[type="search"]::-webkit-search-decoration,
.spotify-mobile-find-field input[type="search"]::-webkit-search-cancel-button{
  -webkit-appearance:none!important;appearance:none!important;display:none!important
}

@media (min-width:821px){
  .spotify-collection-tools .spotify-list-filter{
    width:32px!important;height:32px!important;min-width:32px!important;flex:0 0 32px!important;
    border-radius:4px!important;background:transparent!important;overflow:hidden!important;
    transition:width .16s cubic-bezier(.3,0,.4,1),background-color .12s ease!important;
  }
  .spotify-collection-tools .spotify-list-filter.open{
    width:min(224px,24vw)!important;flex:0 1 224px!important;background:#242424!important;
  }
  .spotify-collection-tools .spotify-list-filter-toggle,
  .spotify-collection-tools .spotify-list-filter-clear{
    width:32px!important;height:32px!important;min-width:32px!important;flex:0 0 32px!important;
    border-radius:4px!important;color:#b3b3b3!important;background:transparent!important;
  }
  .spotify-collection-tools .spotify-list-filter-toggle:hover,
  .spotify-collection-tools .spotify-list-filter-clear:hover{color:#fff!important;background:transparent!important}
  .spotify-collection-tools .spotify-list-filter-toggle .icon,
  .spotify-collection-tools .spotify-list-filter-clear .icon{width:16px!important;height:16px!important}
  .spotify-collection-tools .spotify-list-filter input{
    height:32px!important;min-height:32px!important;padding:0!important;color:#fff!important;
    font-size:13px!important;font-weight:400!important;line-height:32px!important;caret-color:#fff!important;
  }
  .spotify-collection-tools .spotify-list-filter input::placeholder{color:#b3b3b3!important;opacity:1!important}
  .spotify-collection-tools .spotify-list-filter.open:focus-within{background:#2a2a2a!important}
  .spotify-collection-tools .spotify-view-sort{height:32px!important;align-items:center!important}
  .spotify-collection-tools .spotify-sort-select{height:32px!important;min-height:32px!important}
  .spotify-collection-tools .spotify-sort-select select{height:32px!important;min-height:32px!important}
  .liked-list-tools,.playlist-list-tools{gap:8px!important}
}

@media (max-width:820px){
  /* The desktop collection filter/sort row must not duplicate Spotify's mobile
     pull-down search bar. */
  .spotify-collection-toolbar .spotify-collection-tools{display:none!important}
  .spotify-mobile-pull-indicator{display:none!important}

  .spotify-mobile-collection-findbar{
    display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;
    box-sizing:border-box;width:100%;max-height:0;min-height:0;padding:0 16px;
    opacity:0;overflow:hidden;pointer-events:none;transform:translateY(-8px);
    transition:max-height .2s cubic-bezier(.3,0,.4,1),padding .2s cubic-bezier(.3,0,.4,1),opacity .14s ease,transform .2s cubic-bezier(.3,0,.4,1);
    position:relative;z-index:3;
  }
  .spotify-liked-page .spotify-mobile-collection-findbar{background:#466bea}
  .spotify-playlist-page .spotify-mobile-collection-findbar{background:var(--spotify-collection-accent,#464646)}
  .spotify-collection-page.filters-open>.spotify-mobile-collection-findbar{
    max-height:calc(142px + env(safe-area-inset-top));
    padding:calc(84px + env(safe-area-inset-top)) 16px 10px;
    opacity:1;pointer-events:auto;transform:none;overflow:visible;
  }

  .spotify-mobile-find-field{
    height:48px;min-width:0;display:flex;align-items:center;position:relative;
    border:0;border-radius:4px;background:rgba(255,255,255,.16);color:#fff;
    box-shadow:none;overflow:hidden;
  }
  .spotify-mobile-find-field:focus-within{background:rgba(255,255,255,.20)}
  .spotify-mobile-find-field>.icon{
    width:22px;height:22px;min-width:22px;margin:0 10px 0 13px;color:#fff;pointer-events:none
  }
  .spotify-mobile-find-field input{
    width:100%;min-width:0;height:48px!important;min-height:48px!important;margin:0!important;padding:0 6px 0 0!important;
    border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;
    color:#fff!important;font-size:14px!important;font-weight:700!important;line-height:48px!important;
    letter-spacing:0!important;caret-color:#fff!important;-webkit-appearance:none!important;appearance:none!important;
  }
  .spotify-mobile-find-field input::placeholder{color:#fff!important;opacity:.98!important;font-weight:700!important}
  .spotify-mobile-find-clear{
    width:42px;height:48px;min-width:42px;display:grid;place-items:center;padding:0;border:0;
    background:transparent;color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent
  }
  .spotify-mobile-find-clear.hidden{display:none!important}
  .spotify-mobile-find-clear .icon{width:18px;height:18px}
  .spotify-mobile-find-clear:active{background:rgba(0,0,0,.08)}

  .spotify-mobile-collection-sort{
    width:70px;height:48px;min-width:70px;display:grid;place-items:center;position:relative;
    border:0;border-radius:4px;background:rgba(255,255,255,.16);color:#fff;
    font-size:14px;font-weight:700;line-height:48px;overflow:hidden;cursor:pointer;
    -webkit-tap-highlight-color:transparent
  }
  .spotify-mobile-collection-sort:active{background:rgba(255,255,255,.22)}
  .spotify-mobile-collection-sort>span{pointer-events:none}
  .spotify-mobile-collection-sort select{
    position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;opacity:0;cursor:pointer;
    -webkit-appearance:none;appearance:none
  }

  /* Opening the pull-down bar supplies the top safe-area/header offset itself;
     remove the second oversized top pad from the hero so the composition stays
     at Spotify's spacing instead of creating a large empty band. */
  .spotify-collection-page.filters-open>.spotify-liked-hero{padding-top:18px!important}
  .spotify-collection-page.filters-open>.spotify-playlist-hero{padding-top:18px!important}

  /* Mobile search result changes are authoritative even with responsive table
     and touch layers enabled. */
  .spotify-collection-page .track-row.hidden,
  .spotify-collection-page .track-row[hidden]{display:none!important}
}

@media (max-width:420px){
  .spotify-mobile-collection-findbar{gap:7px!important}
  .spotify-collection-page.filters-open>.spotify-mobile-collection-findbar{padding-left:12px!important;padding-right:12px!important}
  .spotify-mobile-collection-sort{width:66px;min-width:66px}
  .spotify-mobile-find-field>.icon{margin-left:12px;margin-right:9px}
}

/* the application 1.14.37 — Spotify desktop player-center vertical rhythm.
   The late compact-player override used gap:0!important, which cancelled the
   earlier spacing work. 34px transport + 6px row gap + 16px seek = 56px,
   preserving the 72px player and its 8px vertical breathing room. */
@media(min-width:821px){
  .player-center{gap:6px!important}
}

/* the application 1.14.39 — Spotify-style Connect/Devices right-column panel.
   On desktop, Devices is a peer of Now Playing/Queue in the third column and
   keeps its own independently persisted width. Mobile retains the bottom sheet. */
@media(min-width:821px){
  .devices-backdrop{display:none!important}
  .app-shell.devices-open{grid-template-columns:var(--side-w) minmax(0,1fr) var(--devices-panel-w)!important}
  .devices-panel{
    grid-area:queue!important;position:relative!important;z-index:auto!important;
    inset:auto!important;top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;
    width:auto!important;max-width:none!important;height:auto!important;max-height:none!important;
    min-width:0!important;margin:0!important;padding:8px!important;
    background:#000!important;border:0!important;border-radius:0!important;box-shadow:none!important;
    overflow:hidden!important;
  }
  .app-shell.devices-open .devices-panel{display:flex!important;flex-direction:column!important}
  .devices-panel-surface{
    width:100%;height:100%;min-width:0;min-height:0;display:flex;flex-direction:column;
    overflow:hidden;background:#121212;border-radius:8px;
  }
  .devices-head{
    flex:0 0 56px;min-height:56px;padding:0 10px 0 16px!important;
    background:#121212!important;border:0!important;
  }
  .devices-head small{display:none!important}
  .devices-head h3{font-size:16px!important;font-weight:800!important;line-height:1.25;letter-spacing:-.2px!important}
  .devices-head button{width:36px!important;height:36px!important;min-width:36px!important;border-radius:50%!important;background:transparent!important;color:#b3b3b3!important}
  .devices-head button:hover{background:#2a2a2a!important;color:#fff!important}
  .devices-head button .icon{width:18px;height:18px}
  .devices-body{
    flex:1;min-height:0;overflow-y:auto!important;overflow-x:hidden!important;
    padding:0 8px 16px!important;background:#121212!important;overscroll-behavior:contain;
  }
  .devices-intro{margin:2px 4px 8px;padding:12px 10px;border-radius:8px;background:#1a1a1a}
  .devices-group{margin:0 4px 10px!important;border-color:rgba(255,255,255,.04)!important;background:#181818!important}
  .devices-section-head{min-height:46px!important;padding:8px 8px 6px!important}
  .devices-section-head strong{font-size:13px!important;font-weight:800!important}
  .device-row,.device-all-row,.browser-output-row{border-radius:6px!important}
  .device-row:hover,.device-all-row:hover,.browser-output-row:hover{background:#262626!important}
  .devices-resize-handle{display:block}
}
@media(min-width:821px) and (max-width:1050px){
  .app-shell.devices-open{grid-template-columns:var(--side-w) minmax(0,1fr) 0!important}
  .app-shell.devices-open .devices-panel{
    position:fixed!important;z-index:72!important;
    top:8px!important;right:8px!important;bottom:calc(var(--player-h) + 8px)!important;left:auto!important;
    width:min(var(--devices-panel-w),44vw)!important;min-width:300px!important;max-width:440px!important;
    height:auto!important;max-height:none!important;box-shadow:-16px 0 42px rgba(0,0,0,.46)!important;
  }
}
@media(max-width:820px){
  .devices-panel-surface{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0;max-height:inherit;overflow:hidden}
  .devices-body{flex:1;min-height:0}
}

/* the application 1.14.41 — Devices sync visibility + shared third-column chrome.
   Queue is the visual reference. Now Playing and Devices use the same direct
   Spotify-style panel shell instead of nesting a second rounded surface inside
   a black gutter. Content remains panel-specific and each persisted width is
   still independent. */
@media(min-width:821px){
  .third-column-panel{
    border:0!important;
    background:var(--sp-base)!important;
    border-radius:8px!important;
    box-shadow:none;
    overflow:hidden!important;
  }
  .now-playing-panel.third-column-panel,
  .devices-panel.third-column-panel{
    padding:0!important;
  }
  .third-panel-surface{
    width:100%;height:100%;min-width:0;min-height:0;
    display:flex;flex-direction:column;
    overflow:hidden;
    background:transparent!important;
    border:0!important;border-radius:0!important;box-shadow:none!important;
  }
  .third-panel-head{
    flex:0 0 64px!important;
    min-height:64px!important;height:auto!important;
    display:flex!important;align-items:center!important;justify-content:space-between!important;
    gap:12px!important;
    padding:12px 10px 8px 16px!important;
    background:var(--sp-base)!important;
    border:0!important;border-radius:0!important;box-shadow:none!important;
    position:relative!important;top:auto!important;
  }
  .third-panel-head>div{min-width:0}
  .third-panel-head small{display:none!important}
  .third-panel-head h3{
    min-width:0;margin:0!important;
    color:#fff!important;font-size:16px!important;font-weight:800!important;
    line-height:1.2!important;letter-spacing:0!important;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .third-panel-close{
    flex:0 0 38px!important;width:38px!important;height:38px!important;
    min-width:38px!important;min-height:38px!important;
    border:0!important;border-radius:50%!important;
    background:transparent!important;color:#b3b3b3!important;
    display:grid!important;place-items:center!important;padding:0!important;
  }
  .third-panel-close:hover{background:#2a2a2a!important;color:#fff!important}
  .third-panel-close:active{transform:scale(.94)}
  .third-panel-close .icon{width:18px!important;height:18px!important}

  /* Match Queue's uninterrupted panel surface below the common header. */
  .now-panel-scroll,
  .devices-body{background:var(--sp-base)!important}

  /* The same subtle separator/resize affordance is used by every resizable
     right-column peer; it sits outside the panel surface and does not create
     another visible frame. */
  .now-playing-panel .panel-resize-handle,
  .devices-panel .panel-resize-handle{z-index:12}
}

/* At laptop widths all third-column peers use the same floating-panel shadow
   as Queue when the grid cannot reserve a permanent third column. */
@media(min-width:821px) and (max-width:1050px){
  .app-shell.now-panel-open .now-playing-panel.third-column-panel,
  .app-shell.devices-open .devices-panel.third-column-panel{
    box-shadow:-16px 0 42px rgba(0,0,0,.42)!important;
  }
}
@media(min-width:821px){
  .third-panel-scroll{
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    scrollbar-width:thin;
    scrollbar-color:#555 transparent;
    overscroll-behavior:contain;
  }
  .third-panel-scroll::-webkit-scrollbar{width:12px}
  .third-panel-scroll::-webkit-scrollbar-track{background:transparent}
  .third-panel-scroll::-webkit-scrollbar-thumb{background:#555;border:4px solid transparent;border-radius:999px;background-clip:padding-box}
  .third-panel-scroll::-webkit-scrollbar-thumb:hover{background:#777;border:4px solid transparent;background-clip:padding-box}
}

/* Use Queue's responsive third-column breakpoint for every desktop peer. */
@media(min-width:821px) and (max-width:1120px){
  .app-shell.now-panel-open,
  .app-shell.devices-open{grid-template-columns:var(--side-w) minmax(0,1fr) 0!important}
  .app-shell.now-panel-open .now-playing-panel.third-column-panel,
  .app-shell.devices-open .devices-panel.third-column-panel{
    display:flex!important;
    position:fixed!important;z-index:72!important;
    top:8px!important;right:8px!important;bottom:calc(var(--player-h) + 8px)!important;left:auto!important;
    height:auto!important;max-height:none!important;
    min-width:300px!important;max-width:440px!important;
    opacity:1!important;pointer-events:auto!important;
    box-shadow:-16px 0 42px rgba(0,0,0,.42)!important;
  }
  .app-shell.now-panel-open .now-playing-panel.third-column-panel{width:min(var(--right-panel-w),44vw)!important}
  .app-shell.devices-open .devices-panel.third-column-panel{width:min(var(--devices-panel-w),44vw)!important}
}

/* the application 1.14.42 — Unified Auto discovery + Track metadata workspace.
   Auto discovery remains the visual/interaction base while metadata health,
   repair jobs and per-track inspection share the same catalog automation view. */
.catalog-metadata-control .admin-card-head h2{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.catalog-metadata-control .metadata-providers{margin:14px 0 0}
.catalog-metadata-control .metadata-actions{margin-top:14px}
.catalog-metadata-control .catalog-metadata-toggle{margin-top:12px}
.catalog-metadata-control .metadata-progress{margin-top:14px}
.catalog-metadata-control .metadata-note{margin:12px 0 0}
.catalog-metadata-counts{margin-top:14px}
.catalog-metadata-counts .discovery-count-chip small[data-metadata-stat-detail]{text-transform:none;letter-spacing:0}
.catalog-track-metadata-card .admin-card-head{margin-bottom:14px}
.catalog-track-metadata-card .metadata-filter{margin-bottom:14px}
@media(max-width:760px){
  .catalog-metadata-control .admin-card-head{align-items:flex-start}
  .catalog-metadata-control .admin-card-head>span.status-chip{margin-top:2px}
  .catalog-metadata-control .metadata-actions{display:grid;grid-template-columns:1fr}
  .catalog-metadata-control .metadata-actions button{width:100%}
}
@media(min-width:1251px){.discovery-live-stats{grid-template-columns:repeat(6,minmax(0,1fr))}}

/* the application 1.14.43 — One readable Catalog automation workspace.
   Discovery and metadata repair now share the same worker pool, worker cards
   and activity timeline instead of presenting two parallel job systems. */
.catalog-automation-card{overflow:visible;background:linear-gradient(180deg,rgba(30,215,96,.025),rgba(24,24,24,0) 210px),#181818}
.catalog-automation-card>.admin-card-head{margin-bottom:16px}
.automation-overview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.automation-lane{min-width:0;padding:14px;border:1px solid var(--line);border-radius:10px;background:#151515}
.automation-lane-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}
.automation-lane-head>div{display:flex;align-items:center;gap:9px;min-width:0}
.automation-lane-head strong{font-size:13px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.automation-kind{display:inline-flex;align-items:center;width:max-content;min-height:22px;padding:3px 8px;border:1px solid #3a3a3a;border-radius:999px;background:#232323;color:#d7d7d7;font-size:10px;font-weight:800;line-height:1;text-transform:uppercase;letter-spacing:.45px;white-space:nowrap}
.automation-kind.discovery{border-color:rgba(30,215,96,.28);background:rgba(30,215,96,.08);color:#9fe9b7}
.automation-kind.metadata{border-color:rgba(126,162,255,.28);background:rgba(126,162,255,.08);color:#b9c9ff}
.automation-lane .discovery-meter-grid{gap:9px;margin-bottom:10px}
.automation-lane .discovery-meter-card{padding:11px 12px;background:#1b1b1b}
.automation-lane .discovery-meter-card>small{min-height:31px}
.automation-lane .discovery-counts{margin:0;gap:6px}
.automation-lane .discovery-count-chip{padding:5px 8px;background:#1b1b1b}
.automation-lane-note{display:block;margin-top:11px;padding-top:10px;border-top:1px solid var(--line);color:var(--muted);font-size:10.5px;line-height:1.45}
.metadata-lane .metadata-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.metadata-lane .catalog-metadata-toggle{margin-top:10px}
.metadata-lane .metadata-progress{margin-top:10px}
.automation-scan-progress{padding:10px 11px;border:1px solid var(--line);border-radius:8px;background:#1b1b1b}
.automation-providers{margin-top:10px;border-top:1px solid var(--line);padding-top:9px}
.automation-providers summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;color:#d7d7d7;font-size:11px;font-weight:700;list-style:none}
.automation-providers summary::-webkit-details-marker{display:none}
.automation-providers summary::after{content:'›';color:var(--muted);font-size:18px;line-height:1;transform:rotate(90deg);transition:transform .15s ease}
.automation-providers[open] summary::after{transform:rotate(-90deg)}
.automation-providers summary span{margin-left:auto;color:var(--muted);font-variant-numeric:tabular-nums}
.automation-providers .metadata-providers{margin:9px 0 0}
.automation-workers-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.automation-workers-head>div{display:grid;gap:2px;min-width:0}
.automation-workers-head strong{font-size:13px}
.automation-workers-head small,.automation-workers-head>span{color:var(--muted);font-size:10.5px;line-height:1.4}
.automation-worker-grid{margin-top:9px}
.discovery-worker-head{justify-content:flex-start}
.discovery-worker-head>span:first-child{margin-right:auto}
.automation-worker-kind{max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#9b9b9b;font-size:9px;letter-spacing:.35px}
.discovery-worker.metadata-work{border-color:rgba(126,162,255,.30);background:rgba(126,162,255,.045)}
.discovery-worker.metadata-work .discovery-worker-dot{background:#9db3ff;box-shadow:0 0 0 4px rgba(126,162,255,.07)}
.discovery-worker.metadata-work .discovery-worker-progress>span{background:#9db3ff}
.automation-activity-card{padding-bottom:10px}
.automation-activity-table td:first-child strong,.automation-activity-table td:first-child small,.automation-activity-table td:nth-child(2) strong,.automation-activity-table td:nth-child(2) small,.automation-activity-table td:nth-child(4) strong,.automation-activity-table td:nth-child(4) small{display:block}
.automation-activity-table td:first-child small,.automation-activity-table td:nth-child(2) small,.automation-activity-table td:nth-child(4) small,.automation-activity-table td:last-child small{margin-top:4px;color:var(--muted)}
.automation-activity-table td:first-child{width:126px}
.automation-activity-table td:nth-child(3){width:155px}
.automation-activity-table td:nth-child(4){width:190px}
.automation-activity-table tbody tr[data-automation-kind="metadata"]{background:rgba(126,162,255,.018)}
.automation-activity-table tbody tr[data-automation-kind="discovery"]{background:rgba(30,215,96,.012)}
.metadata-track-job{display:inline-flex;vertical-align:middle;margin-left:6px;padding:2px 6px;border-radius:999px;background:#2a2a2a;color:#b3b3b3;font-size:9px;font-weight:800;line-height:1.35;text-transform:uppercase;letter-spacing:.25px;white-space:nowrap}
.metadata-track-job.processing{background:rgba(126,162,255,.12);color:#c6d2ff}
.discovery-settings-card{margin-top:0}
.discovery-settings-card>.admin-card-head{margin-bottom:14px}

@media(max-width:1100px){
  .automation-overview-grid{grid-template-columns:1fr}
  .automation-lane .discovery-meter-card>small{min-height:0}
}
@media(max-width:760px){
  .catalog-automation-card>.admin-card-head,.automation-workers-head,.automation-lane-head{align-items:flex-start;flex-direction:column}
  .catalog-automation-card>.admin-card-head>span,.automation-lane-head>span.status-chip{align-self:flex-start}
  .automation-overview-grid{gap:9px}
  .automation-lane{padding:11px}
  .automation-lane-head>div{align-items:flex-start;flex-wrap:wrap}
  .automation-lane-head strong{white-space:normal}
  .metadata-lane .metadata-actions{display:grid;grid-template-columns:1fr}
  .metadata-lane .metadata-actions button{width:100%}
  .automation-workers-head>span{margin-top:-5px}
  .automation-activity-table td:first-child,.automation-activity-table td:nth-child(3),.automation-activity-table td:nth-child(4){width:auto}
}

/* the application 1.14.44 — Separate Auto discovery and Track metadata workspaces.
   Both surfaces keep the shared catalog worker pool, while Track metadata is
   organized around health, repairs, worker visibility, activity and inspection. */
.metadata-top-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important}
button.admin-stat.metadata-action-stat{appearance:none;width:100%;color:inherit;text-align:left;font:inherit;cursor:pointer;transition:border-color .14s ease,background .14s ease,transform .14s ease}
button.admin-stat.metadata-action-stat:hover{border-color:#4a4a4a!important;background:#202020!important;transform:translateY(-1px)}
button.admin-stat.metadata-action-stat:focus-visible{outline:2px solid #fff;outline-offset:2px}
button.admin-stat.metadata-action-stat.needs-attention strong{color:#fff}
button.admin-stat.metadata-action-stat.needs-attention{border-color:#3a3434!important;background:linear-gradient(180deg,rgba(255,105,97,.025),rgba(255,255,255,0) 80px),#1c1c1c!important}
.metadata-primary-stat{background:linear-gradient(180deg,rgba(30,215,96,.055),rgba(30,215,96,0) 90px),#1c1c1c!important;border-color:rgba(30,215,96,.20)!important}

.metadata-health-card{overflow:visible;background:linear-gradient(180deg,rgba(126,162,255,.025),rgba(255,255,255,0) 180px),#181818!important}
.metadata-health-layout{display:grid;grid-template-columns:minmax(180px,230px) minmax(0,1fr);gap:14px;align-items:stretch}
.metadata-health-score{display:flex;flex-direction:column;justify-content:center;min-height:166px;padding:18px;border:1px solid #303030;border-radius:11px;background:#151515}
.metadata-score-label{color:#9f9f9f;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.55px}
.metadata-health-score>strong{margin:8px 0 4px;font-size:42px;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-1.5px}
.metadata-health-score>small{color:var(--muted);font-size:11px;line-height:1.45}
.metadata-health-meters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.metadata-health-meter{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:15px;border:1px solid #2d2d2d;border-radius:10px;background:#1b1b1b}
.metadata-health-meter>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.metadata-health-meter>div:first-child strong{font-size:13px}.metadata-health-meter>div:first-child span{color:#d7d7d7;font-size:12px;font-weight:800;font-variant-numeric:tabular-nums}
.metadata-health-meter>small{display:block;margin-top:8px;color:var(--muted);font-size:10.5px;line-height:1.45}
.metadata-repair-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:14px;padding:14px 0 0;border-top:1px solid #292929}
.metadata-repair-bar>div:first-child{display:grid;gap:3px;min-width:0}.metadata-repair-bar>div:first-child strong{font-size:13px}.metadata-repair-bar>div:first-child small{max-width:700px;color:var(--muted);font-size:10.5px;line-height:1.45}
.metadata-repair-bar .metadata-actions{display:flex;flex:0 0 auto;gap:8px;flex-wrap:wrap}
.metadata-repair-bar .metadata-actions button{margin:0!important}
.metadata-repair-policy{margin-top:12px!important;padding:11px 12px!important;background:#1b1b1b!important}
.metadata-health-card .metadata-progress{margin-top:12px}
.metadata-provider-details{margin-top:12px;padding-top:11px;border-top:1px solid #292929}
.metadata-provider-details summary{display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none;color:#d6d6d6;font-size:11px;font-weight:800}
.metadata-provider-details summary::-webkit-details-marker{display:none}
.metadata-provider-details summary::after{content:'›';order:3;margin-left:2px;color:#8f8f8f;font-size:17px;line-height:1;transform:rotate(90deg);transition:transform .15s ease}
.metadata-provider-details[open] summary::after{transform:rotate(-90deg)}
.metadata-provider-details summary b{order:2;margin-left:auto;min-width:24px;padding:3px 7px;border-radius:999px;background:#242424;color:#aaa;text-align:center;font-size:10px;font-variant-numeric:tabular-nums}
.metadata-provider-details .metadata-providers{margin:10px 0 0}

.metadata-workers-card>.admin-card-head{margin-bottom:12px}
.metadata-workers-card .admin-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.metadata-workers-card .admin-actions button{margin:0!important}
.metadata-worker-grid{margin-top:0}
.metadata-worker-foot{display:flex;align-items:center;gap:9px;margin-top:12px;padding-top:11px;border-top:1px solid #292929;color:var(--muted)}
.metadata-worker-foot>small{font-size:10.5px}.metadata-worker-foot .status-chip{flex:0 0 auto}

.metadata-activity-card{padding-bottom:10px!important}.metadata-activity-card>.admin-card-head{margin-bottom:10px}
.metadata-activity-table tbody tr{background:rgba(126,162,255,.012)}
.metadata-activity-table td:first-child{width:126px}.metadata-activity-table td:nth-child(3){width:155px}.metadata-activity-table td:nth-child(4){width:190px}

.metadata-catalog-card>.admin-card-head{margin-bottom:12px}
.metadata-result-count{display:inline-flex;align-items:center;min-height:28px;padding:5px 9px;border-radius:999px;background:#242424;color:#aaa;font-size:10px;font-weight:800;white-space:nowrap}
.metadata-filter-chips{display:flex;gap:7px;margin:0 0 10px;overflow-x:auto;scrollbar-width:none;padding-bottom:1px}
.metadata-filter-chips::-webkit-scrollbar{display:none}
.metadata-filter-chip{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;min-height:32px;padding:6px 10px;border:1px solid #343434;border-radius:999px;background:#232323;color:#c5c5c5;font-size:11px;font-weight:750;cursor:pointer}
.metadata-filter-chip:hover{background:#2d2d2d;color:#fff;border-color:#484848}.metadata-filter-chip.active{background:#fff;color:#111;border-color:#fff}.metadata-filter-chip.active:hover{background:#f2f2f2}
.metadata-filter-chip b{min-width:18px;padding:2px 5px;border-radius:999px;background:rgba(255,255,255,.08);font-size:9px;line-height:1.2;text-align:center;font-variant-numeric:tabular-nums}.metadata-filter-chip.active b{background:rgba(0,0,0,.10)}
.metadata-filter-v2{grid-template-columns:minmax(260px,1fr) minmax(155px,210px) auto!important;margin-bottom:12px!important}
.metadata-search-control{display:flex;align-items:center;gap:8px;min-width:0;height:var(--control-h);padding:0 11px;border:1px solid var(--control-border);border-radius:6px;background:var(--control-bg)}
.metadata-search-control:focus-within{outline:2px solid #fff;outline-offset:1px;border-color:#fff}.metadata-search-control>.icon{width:17px;height:17px;flex:0 0 auto;color:#aaa}
.metadata-search-control input{width:100%;height:100%!important;min-height:0!important;padding:0!important;border:0!important;outline:0!important;background:transparent!important}
.metadata-release-cell,.metadata-source-cell{display:grid;gap:3px;min-width:0}.metadata-release-cell strong,.metadata-release-cell small,.metadata-source-cell strong,.metadata-source-cell small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.metadata-source-cell{grid-template-columns:minmax(0,1fr) auto;align-items:center}.metadata-source-cell small{grid-column:1/-1}.metadata-source-cell a{color:#b3b3b3}.metadata-source-cell a:hover{color:#fff}
.metadata-confidence{display:inline-flex;align-items:center;justify-content:center;min-width:38px;padding:3px 6px;border-radius:999px;background:rgba(30,215,96,.10);color:#8fe5aa;font-size:9px;font-weight:800;font-variant-numeric:tabular-nums}
.metadata-source-local{display:inline-flex;color:#aaa;font-size:12px;font-weight:700}.metadata-admin-table td>small,.metadata-release-cell small,.metadata-source-cell small{display:block;margin-top:2px;color:var(--muted);font-size:10.5px;line-height:1.35}
.metadata-row-actions{min-width:150px}.metadata-row-actions button{margin:2px 0 2px 5px!important}
.metadata-empty-state{display:grid;place-items:center;gap:5px;min-height:170px;padding:24px;border:1px dashed #333;border-radius:10px;background:#151515;text-align:center}.metadata-empty-state>span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#232323;color:#888}.metadata-empty-state .icon{width:20px;height:20px}.metadata-empty-state strong{margin-top:3px}.metadata-empty-state small{color:var(--muted)}

.discovery-live-stats{grid-template-columns:repeat(5,minmax(0,1fr))!important}
.discovery-focus-card>.admin-card-head{margin-bottom:14px}.discovery-focus-card .admin-card-head h2{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.discovery-focus-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.discovery-focus-grid .discovery-meter-card{padding:13px;background:#1b1b1b}
.discovery-focus-counts{margin-top:11px}.discovery-activity-card>.admin-card-head{margin-bottom:10px}

@media(max-width:1100px){
  .metadata-top-stats,.discovery-live-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .metadata-health-layout{grid-template-columns:1fr}.metadata-health-score{min-height:0}
}
@media(max-width:820px){
  .metadata-health-meters,.discovery-focus-grid{grid-template-columns:1fr}
  .metadata-repair-bar{align-items:stretch;flex-direction:column}.metadata-repair-bar .metadata-actions{display:grid;grid-template-columns:1fr}.metadata-repair-bar .metadata-actions button{width:100%}
  .metadata-filter-v2{grid-template-columns:1fr!important}.metadata-search-control,.metadata-filter-v2 select,.metadata-filter-v2 button{width:100%}
  .metadata-workers-card .admin-actions{width:100%;justify-content:flex-start!important}.metadata-worker-foot{align-items:flex-start;flex-direction:column}
  .metadata-activity-table td:first-child,.metadata-activity-table td:nth-child(3),.metadata-activity-table td:nth-child(4){width:auto}
}
@media(max-width:680px){
  .metadata-top-stats,.discovery-live-stats{grid-template-columns:1fr!important}
  .metadata-filter-chips{margin-inline:-2px;padding-inline:2px}
  .metadata-health-score>strong{font-size:36px}.metadata-health-card,.metadata-workers-card,.metadata-activity-card,.metadata-catalog-card{overflow:hidden}
  .metadata-row-actions{min-width:0}.metadata-row-actions button{margin:2px 4px 2px 0!important}
}


/* 1.14.45 — restore Jam in the desktop player utility cluster. */
@media(min-width:821px){
  .player-extra #jamBtn{display:grid!important;place-items:center!important}
}


/* the application 1.14.46 — dedicated Catalog Workers administration workspace. */
.worker-admin-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.worker-primary-stat{background:linear-gradient(180deg,rgba(30,215,96,.055),rgba(30,215,96,0) 90px),#1c1c1c!important;border-color:rgba(30,215,96,.20)!important}
button.admin-stat.worker-route-stat{appearance:none;width:100%;color:inherit;text-align:left;font:inherit;cursor:pointer;transition:border-color .14s ease,background .14s ease,transform .14s ease}
button.admin-stat.worker-route-stat:hover{border-color:#4a4a4a!important;background:#202020!important;transform:translateY(-1px)}
button.admin-stat.worker-route-stat:focus-visible{outline:2px solid #fff;outline-offset:2px}
.worker-pool-card{background:linear-gradient(180deg,rgba(126,162,255,.025),rgba(255,255,255,0) 180px),#181818!important}
.worker-pool-card>.admin-card-head{margin-bottom:14px}
.workers-section-grid{margin-top:0}
.worker-pool-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:13px;padding-top:12px;border-top:1px solid #292929;color:var(--muted)}
.worker-pool-footer>small{font-size:10.5px}.worker-pool-footer .admin-actions{display:flex;gap:8px;flex-wrap:wrap}.worker-pool-footer .admin-actions button{margin:0!important}
.worker-settings-layout{display:grid;grid-template-columns:minmax(260px,420px) minmax(300px,1fr);gap:18px;align-items:end}
.worker-concurrency-setting{display:grid;gap:7px}.worker-concurrency-setting>select{max-width:260px}.worker-concurrency-setting>small{max-width:560px;color:var(--muted);font-size:10.5px;line-height:1.45}
.worker-capacity-guide{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.worker-capacity-guide>span{display:grid;gap:2px;min-height:62px;padding:10px 9px;border:1px solid #303030;border-radius:9px;background:#1b1b1b;align-content:center;text-align:center}
.worker-capacity-guide>span strong{font-size:17px}.worker-capacity-guide>span small{color:var(--muted);font-size:9.5px;text-transform:uppercase;letter-spacing:.45px}
.worker-capacity-guide>span.recommended{border-color:rgba(30,215,96,.28);background:rgba(30,215,96,.045)}.worker-capacity-guide>span.recommended small{color:#8fe5aa}
.worker-execution-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.worker-execution-grid>div{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;row-gap:3px;padding:13px;border:1px solid #2d2d2d;border-radius:10px;background:#1b1b1b}
.worker-execution-grid>div>span{grid-row:1/3;display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:#252525;color:#bdbdbd}.worker-execution-grid .icon{width:17px;height:17px}
.worker-execution-grid strong{font-size:12px}.worker-execution-grid small{color:var(--muted);font-size:10.5px;line-height:1.4}.worker-execution-grid code{font-size:10px;color:#d8d8d8}
@media(max-width:980px){.worker-admin-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}.worker-settings-layout{grid-template-columns:1fr}.worker-execution-grid{grid-template-columns:1fr}.worker-pool-footer{align-items:flex-start;flex-direction:column}}
@media(max-width:640px){.worker-admin-stats{grid-template-columns:1fr!important}.worker-capacity-guide{grid-template-columns:repeat(2,minmax(0,1fr))}.worker-pool-footer .admin-actions{width:100%}.worker-pool-footer .admin-actions button{flex:1 1 auto}}

/* 1.14.47 Developer API — Spotify Web API compatible account surface */
.developer-api-card code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}
.developer-api-endpoints{display:grid;gap:8px;margin:18px 0 10px}
.developer-api-endpoints>div{display:grid;grid-template-columns:82px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:42px;padding:0 10px 0 14px;border-radius:8px;background:#202020;border:1px solid #2c2c2c}
.developer-api-endpoints span{font-size:12px;font-weight:700;color:#b3b3b3}
.developer-api-endpoints code{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#f1f1f1}
.developer-api-endpoints button,.developer-secret-value button{min-height:30px;padding:5px 12px;border-radius:999px;background:#333;color:#fff;font-weight:700}
.developer-api-links{display:flex;align-items:center;gap:16px;justify-content:space-between;color:#a7a7a7;font-size:12px;margin:10px 2px 18px}
.developer-api-links a{display:inline-flex;align-items:center;gap:6px;color:#fff;font-weight:700;text-decoration:none}
.developer-api-links a:hover{text-decoration:underline}
.developer-app-list{display:grid;gap:8px}
.developer-app-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;padding:14px;border-radius:9px;background:#202020;border:1px solid transparent}
.developer-app-row:hover{background:#242424;border-color:#303030}
.developer-app-main{min-width:0;display:grid;gap:5px}
.developer-app-title{display:flex;align-items:center;gap:8px;min-width:0}
.developer-app-title strong{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.developer-app-main>code{color:#d8d8d8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.developer-app-main>small{color:#9a9a9a}
.developer-app-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.developer-app-actions button{min-height:32px;padding:5px 10px;border-radius:999px}
.developer-api-empty{display:flex;align-items:center;gap:14px;padding:20px;border-radius:9px;background:#202020;color:#b3b3b3}
.developer-api-empty .icon{width:26px;height:26px}
.developer-api-empty strong,.developer-api-empty small{display:block}.developer-api-empty strong{color:#fff;margin-bottom:3px}
.developer-app-form{display:grid;gap:14px;min-width:min(520px,78vw)}
.developer-app-form>label,.developer-secret-modal>label{display:grid;gap:7px;font-weight:700;color:#ddd}
.developer-app-form label small{font-weight:500;color:#8f8f8f}
.developer-app-form input:not([type=checkbox]),.developer-app-form textarea{width:100%;box-sizing:border-box;background:#242424;color:#fff;border:1px solid #4b4b4b;border-radius:6px;padding:11px 12px;font:inherit;resize:vertical}
.developer-app-form input:focus,.developer-app-form textarea:focus{outline:2px solid #fff;outline-offset:1px;border-color:#fff}
.developer-secret-warning{padding:11px 12px;border-radius:7px;background:#2b2413;color:#f5d36d;border:1px solid #574817}
.developer-secret-modal{display:grid;gap:15px;min-width:min(520px,78vw)}
.developer-secret-value{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding:8px;background:#202020;border-radius:7px}
.developer-secret-value code{overflow-wrap:anywhere;word-break:break-all;color:#fff;font-size:12px}
@media(max-width:820px){
  .developer-api-endpoints>div{grid-template-columns:1fr auto;gap:7px;padding:10px}.developer-api-endpoints span{grid-column:1/-1}.developer-api-links{align-items:flex-start;flex-direction:column;gap:8px}.developer-app-row{grid-template-columns:1fr}.developer-app-actions{justify-content:flex-start}.developer-app-form,.developer-secret-modal{min-width:0;width:100%}
}