@import url('/fonts/fonts.css?v=2');
:root{--bg:#14120f;--panel:#1c1915;--panel-2:#242019;--line:#393228;--text:#f2eee5;--muted:#9b9387;--accent:#d7ef8d;--accent-2:#f39b67;--serif:'Playfair Display',serif;--sans:'Manrope',sans-serif;--mono:'DM Mono',monospace}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);min-height:100vh}.grain{position:fixed;inset:0;pointer-events:none;opacity:.055;z-index:10;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}.topbar{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 5vw;position:relative;z-index:2}.brand{display:flex;align-items:center;gap:11px;color:var(--text);text-decoration:none;letter-spacing:-.04em}.brand strong{font-size:20px}.brand em{font:italic 14px var(--serif);color:var(--accent);margin-left:4px}.brand-mark{display:flex;gap:3px;align-items:end;height:23px}.brand-mark i{width:4px;background:var(--accent);border-radius:3px}.brand-mark i:nth-child(1){height:11px}.brand-mark i:nth-child(2){height:23px}.brand-mark i:nth-child(3){height:16px}.top-actions{display:flex;align-items:center;gap:9px;font:11px var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px #d7ef8d16}.icon-button,.player-action,.dialog-close{border:0;background:none;color:var(--muted);font-size:21px;cursor:pointer}.icon-button{margin-left:14px}.shell{max-width:1480px;margin:auto;padding:0 5vw 150px}.hero{min-height:350px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);overflow:hidden}.eyebrow{font:10px var(--mono);letter-spacing:.16em;color:var(--accent-2);margin:0 0 15px}.hero h1{font-size:clamp(48px,6vw,84px);line-height:.96;letter-spacing:-.07em;margin:0;font-weight:700}.hero h1 span{font:italic .91em var(--serif);color:var(--accent)}.hero-text{max-width:420px;color:var(--muted);line-height:1.7;font-size:14px;margin-top:25px}.hero-art{width:360px;height:260px;position:relative;margin-right:4vw}.disc{position:absolute;width:245px;height:245px;border-radius:50%;right:25px;top:5px;background:repeating-radial-gradient(circle at center,#26221b 0 2px,#16130f 3px 5px);box-shadow:10px 25px 55px #0009;display:grid;place-items:center;animation:float 7s ease-in-out infinite}.disc:before{content:'';position:absolute;inset:45px;border-radius:50%;border:1px solid #77694c80;background:radial-gradient(circle,#f39b67 0 11px,#17140f 12px 19px,#d7ef8d 20px 21px,transparent 22px)}.disc-label{position:relative;color:#17140f;text-align:center;font:700 17px var(--sans);line-height:1}.disc-label small{font:7px var(--mono);letter-spacing:.2em}.orb{position:absolute;border-radius:50%;filter:blur(1px);opacity:.7}.orb-one{width:115px;height:115px;background:#d7ef8d;right:0;top:100px;mix-blend-mode:screen}.orb-two{width:95px;height:95px;background:#f39b67;left:20px;top:4px;mix-blend-mode:screen}.hero-note{position:absolute;left:0;bottom:22px;font:10px var(--mono);line-height:1.7;letter-spacing:.12em;color:var(--muted);transform:rotate(-8deg)}.hero-note span{color:var(--accent)}@keyframes float{50%{transform:translateY(-8px) rotate(5deg)}}.stats{display:flex;align-items:center;gap:50px;padding:27px 0 35px;border-bottom:1px solid var(--line)}.stats div:not(.stats-note){display:flex;flex-direction:column;gap:4px}.stats strong{font:24px var(--mono);color:var(--text)}.stats span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}.stats-note{margin-left:auto;text-align:right;font:10px var(--mono);color:var(--accent);line-height:1.6}.stats-note span{font:10px var(--mono);text-transform:none;letter-spacing:0}.layout{display:grid;grid-template-columns:220px 1fr;gap:52px;padding-top:43px}.side-title{font:10px var(--mono);color:#776f64;letter-spacing:.16em;margin-bottom:18px}.genre-heading{margin-top:39px}.main-nav,.filter-list,.playlist-list{display:grid;gap:4px}.nav-item,.filter-item{border:0;text-align:left;background:none;color:var(--muted);padding:10px 10px;border-radius:5px;cursor:pointer;font:12px var(--sans);display:flex;align-items:center;gap:10px}.nav-item span{color:var(--accent-2);font-size:14px}.nav-item b{font:10px var(--mono);margin-left:auto;color:#6c655b}.nav-item.active,.nav-item:hover,.filter-item.active,.filter-item:hover{background:var(--panel-2);color:var(--text)}.filter-item b{margin-left:auto;font:10px var(--mono);color:#6c655b}.new-playlist{color:var(--accent);border:1px dashed #71804e;background:none;border-radius:5px;padding:10px;width:100%;text-align:left;font:11px var(--mono);cursor:pointer}.content-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.content-head h2{font-size:31px;letter-spacing:-.05em;margin:0}.toolbar{display:flex;gap:9px}.search{height:39px;width:275px;display:flex;align-items:center;gap:9px;background:var(--panel);border:1px solid var(--line);padding:0 12px;border-radius:4px;color:var(--muted)}.search input{border:0;outline:0;color:var(--text);background:transparent;width:100%;font:12px var(--sans)}select{height:39px;background:var(--panel);color:var(--muted);border:1px solid var(--line);padding:0 10px;border-radius:4px;font:11px var(--mono)}.active-filters{min-height:0;display:flex;gap:8px;margin-bottom:14px}.chip{font:10px var(--mono);padding:7px 9px;border:1px solid #59613e;color:var(--accent);border-radius:20px}.track-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.track-card{background:var(--panel);border:1px solid transparent;border-radius:7px;overflow:hidden;transition:.25s ease;animation:appear .5s both}.track-card:hover{border-color:#625948;transform:translateY(-3px);box-shadow:0 13px 35px #0004}.cover{height:184px;position:relative;background:#2b261e;overflow:hidden}.cover img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.82)}.cover-placeholder{height:100%;display:flex;align-items:end;padding:15px;background:radial-gradient(circle at 70% 20%,#e8bf6c99 0 5%,transparent 35%),linear-gradient(135deg,#24342d,#ae6749 58%,#201b17)}.cover-placeholder span{font:italic 22px var(--serif);line-height:1.05;max-width:80%;word-break:break-word}.cover:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,#0008)}.badges{position:absolute;z-index:1;top:10px;left:10px;display:flex;gap:5px}.badge{font:9px var(--mono);letter-spacing:.04em;background:#14120fd9;color:var(--accent);padding:5px 7px;border-radius:3px}.badge.orange{color:var(--accent-2)}.card-play{position:absolute;z-index:2;right:10px;bottom:10px;width:38px;height:38px;border:0;border-radius:50%;background:var(--accent);color:#17140f;cursor:pointer;font-size:14px;opacity:0;transform:translateY(5px);transition:.2s}.track-card:hover .card-play,.track-card.playing .card-play{opacity:1;transform:translateY(0)}.card-body{padding:14px 14px 15px}.card-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;font-weight:700}.card-meta{display:flex;justify-content:space-between;gap:6px;margin-top:7px;color:var(--muted);font:10px var(--mono)}.card-meta span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.add-playlist{background:none;border:0;color:#70685d;cursor:pointer;font-size:17px}.loading{grid-column:1/-1;display:flex;gap:7px;justify-content:center;padding:80px}.loading span{width:7px;height:7px;background:var(--accent);border-radius:50%;animation:bounce 1s infinite alternate}.loading span:nth-child(2){animation-delay:.2s}.loading span:nth-child(3){animation-delay:.4s}@keyframes bounce{to{transform:translateY(-8px);opacity:.4}}@keyframes appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.player{position:fixed;z-index:5;bottom:0;left:0;right:0;height:90px;background:#211d18ee;backdrop-filter:blur(18px);border-top:1px solid #52483a;display:grid;grid-template-columns:1fr 1.5fr 1fr;align-items:center;padding:0 5vw;gap:35px}.now-playing{display:flex;gap:12px;align-items:center;min-width:0}.mini-cover{width:48px;height:48px;border-radius:3px;background:linear-gradient(135deg,#e8bf6c,#9f5a4b);display:grid;place-items:center;color:#17140f;font:21px var(--serif);flex:0 0 auto;overflow:hidden}.mini-cover img{width:100%;height:100%;object-fit:cover}.now-playing small{display:block;font:9px var(--mono);color:var(--accent-2);margin-bottom:5px}.now-playing strong,.now-playing span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}.now-playing strong{font-size:12px}.now-playing span{font-size:10px;color:var(--muted);margin-top:3px}.player-center{max-width:570px;width:100%;justify-self:center}.player-controls{display:flex;justify-content:center;align-items:center;gap:20px}.player-controls button{background:none;color:var(--text);border:0;cursor:pointer;font:16px var(--mono)}.play-button{width:34px;height:34px;border-radius:50%;background:var(--accent)!important;color:#19160f!important;font-size:12px!important}.progress-line{display:flex;align-items:center;gap:8px;margin-top:10px}.progress-line span{font:9px var(--mono);color:var(--muted)}input[type=range]{accent-color:var(--accent);height:3px;cursor:pointer}.progress-line input{width:100%}.player-end{display:flex;align-items:center;justify-content:end;gap:12px}.player-end input{width:90px}.toast{position:fixed;z-index:20;right:25px;bottom:108px;background:var(--accent);color:#15130f;padding:12px 16px;border-radius:4px;font:11px var(--mono);opacity:0;transform:translateY(10px);transition:.25s}.toast.show{opacity:1;transform:none}dialog{border:1px solid var(--line);border-radius:8px;background:var(--panel-2);color:var(--text);padding:30px;width:min(380px,90vw);box-shadow:0 20px 80px #000b}dialog::backdrop{background:#0009}.dialog-close{float:right}.dialog-close:hover{color:var(--text)}dialog h3{font-size:28px;margin:0 0 20px}dialog input{width:100%;height:45px;background:var(--panel);color:var(--text);border:1px solid var(--line);padding:0 12px;margin-bottom:12px;border-radius:4px;outline:0}.primary-button{width:100%;height:43px;border:0;border-radius:4px;background:var(--accent);color:#17140f;font:700 12px var(--sans);cursor:pointer}@media(max-width:900px){.hero-art{width:260px;transform:scale(.8);margin-right:-35px}.layout{grid-template-columns:1fr}.sidebar{display:none}.content-head{align-items:start;gap:15px;flex-direction:column}.toolbar{width:100%}.search{flex:1}.player{grid-template-columns:1fr 1fr;height:82px;padding:0 18px}.player-end{display:none}.player-center{max-width:none}.shell{padding-left:18px;padding-right:18px}.topbar{padding:0 18px}.hero{min-height:310px}.stats{gap:18px}.stats-note{display:none}}@media(max-width:560px){.hero-art{position:absolute;right:-45px;opacity:.35}.hero-copy{position:relative;z-index:1}.hero h1{font-size:52px}.track-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.cover{height:145px}.card-body{padding:10px}.card-meta{font-size:9px}.player{grid-template-columns:1fr 42px}.player-center{position:absolute;right:12px;bottom:24px;width:42px}.progress-line{display:none}.player-controls{gap:0}.player-controls button:not(.play-button){display:none}.now-playing strong,.now-playing span{max-width:200px}.stats strong{font-size:18px}.stats span{font-size:9px}}
.player{height:104px}
.mini-cover{width:64px;height:64px;box-shadow:0 7px 18px #0005}
@media(max-width:560px){.player{height:88px}}
.admin-button{border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:4px;padding:9px 12px;font:10px var(--mono);cursor:pointer}.admin-button.active{background:var(--accent);border-color:var(--accent);color:#17140f}.edit-tools{position:absolute;z-index:3;left:10px;bottom:10px;display:none;gap:5px}.track-edit-mode .edit-tools{display:flex}.edit-tools button{border:1px solid #80765f;background:#17140fe8;color:var(--text);border-radius:3px;padding:7px 8px;font:10px var(--mono);cursor:pointer}.edit-tools button:hover{background:var(--accent);color:#17140f}.admin-dialog{border:1px solid var(--line);border-radius:8px;background:var(--panel-2);color:var(--text);padding:30px;width:min(420px,92vw);box-shadow:0 20px 80px #000b}.admin-dialog h3{font-size:28px;margin:0 0 20px}.admin-dialog label{display:block;color:var(--muted);font:10px var(--mono);margin:14px 0 6px}.admin-dialog input{width:100%;height:43px;background:var(--panel);color:var(--text);border:1px solid var(--line);padding:0 12px;border-radius:4px;outline:0}.admin-dialog input[type=file]{padding:11px 8px;height:auto}.admin-dialog .primary-button{margin-top:16px}.dialog-error{color:#f39b67;font:10px var(--mono);min-height:15px;margin-top:10px}.dialog-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.danger-button{width:100%;height:42px;border:1px solid #8d4d3c;border-radius:4px;background:transparent;color:#f39b67;font:700 11px var(--sans);cursor:pointer;margin-top:10px}
.upload-button{display:none}.edit-mode .upload-button{display:block}
.view-toggle{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:4px;padding:9px 11px;font:10px var(--mono);cursor:pointer}.view-toggle.active{background:var(--accent);color:#17140f;border-color:var(--accent)}
body.mobile-mode .hero,body.mobile-mode .stats,body.mobile-mode .sidebar{display:none}body.mobile-mode .shell{padding:18px 14px 135px}body.mobile-mode .layout{display:block;padding-top:8px}body.mobile-mode .content-head{margin-bottom:14px}body.mobile-mode .content-head h2{font-size:25px}body.mobile-mode .track-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}body.mobile-mode .cover{height:145px}body.mobile-mode .toolbar{width:100%}body.mobile-mode .search{width:100%}body.mobile-mode .toolbar select{display:none}body.mobile-mode .player{height:116px;grid-template-columns:1fr;padding:0 14px;gap:0}body.mobile-mode .player-end{display:none}body.mobile-mode .now-playing{padding-bottom:34px}body.mobile-mode .now-playing strong,body.mobile-mode .now-playing span{max-width:calc(100vw - 112px)}body.mobile-mode .player-center{position:absolute;left:14px;right:14px;bottom:8px;max-width:none}body.mobile-mode .progress-line{margin-top:2px}body.mobile-mode .player-controls{position:absolute;right:0;bottom:25px;gap:3px}body.mobile-mode .player-controls button:not(.play-button){display:block;font-size:13px}body.mobile-mode .play-button{width:31px;height:31px}
.cover{height:auto;aspect-ratio:1/1;background:#2b261e;display:grid;place-items:center}.cover img{object-fit:contain;padding:10px;background:radial-gradient(circle at 50% 35%,#41382d,#201c17 75%)}.cover-placeholder{height:100%;width:100%}@media(max-width:560px){.cover{height:auto}}.cover-select{position:absolute;z-index:4;top:10px;right:10px;display:none;align-items:center;gap:5px;color:var(--accent);font:10px var(--mono);background:#17140fe8;border-radius:3px;padding:5px}.track-edit-mode .cover-select{display:flex}.cover-select input{accent-color:var(--accent);width:15px;height:15px}.batch-delete{display:none;border:1px solid #8d4d3c;background:transparent;color:#f39b67;border-radius:4px;padding:9px 11px;font:10px var(--mono);cursor:pointer}.edit-mode .batch-delete{display:block}
.view-toggle{display:none!important}.full-player{position:fixed;z-index:30;inset:0;background:radial-gradient(circle at 50% 22%,#3a3022 0,#1b1814 38%,#12100e 75%);display:none;flex-direction:column;align-items:center;padding:24px clamp(20px,6vw,110px) 34px;overflow:hidden;overscroll-behavior:none}.full-player.open{display:flex}.full-back{align-self:flex-start;width:min(720px,100%);border:0;background:transparent;color:var(--text);font:26px var(--mono);cursor:pointer;padding:4px 8px}.full-kicker{width:min(720px,100%);font:10px var(--mono);letter-spacing:.18em;color:var(--accent-2);margin:24px 0 12px}.full-cover{width:min(68vh,620px);aspect-ratio:1/1;margin:0 auto;display:grid;place-items:center;border-radius:8px;overflow:hidden;background:#252019;box-shadow:0 24px 80px #0008}.full-cover img{width:100%;height:100%;object-fit:contain;padding:16px;background:radial-gradient(circle at 50% 35%,#4a3b2b,#201b16 75%)}.full-cover .cover-placeholder{display:flex;align-items:end;padding:25px}.full-cover .cover-placeholder span{font-size:34px}.full-info{width:min(720px,100%);margin:28px auto 0}.full-title{font-size:clamp(25px,4vw,42px);letter-spacing:-.05em;font-weight:700}.full-artist{color:var(--muted);font-size:14px;margin-top:7px}.full-waveform{width:100%;height:56px;margin:28px auto 6px;cursor:pointer}.full-progress{display:flex;align-items:center;gap:10px}.full-progress span{font:10px var(--mono);color:var(--muted)}.full-progress input{width:100%}.full-controls{display:flex;align-items:center;justify-content:center;gap:25px;margin:28px 0}.full-controls button{border:0;background:transparent;color:var(--text);font:22px var(--mono);cursor:pointer}.full-controls .full-play{width:58px;height:58px;border-radius:50%;background:var(--accent);color:#17140f;font-size:18px}.full-bottom{display:flex;justify-content:center;align-items:center;gap:12px;color:var(--muted);font:11px var(--mono)}.full-bottom input{width:100px}

html{touch-action:pan-x pan-y;-webkit-text-size-adjust:100%}
@media(max-width:560px){.full-player{height:100dvh;padding:calc(14px + env(safe-area-inset-top)) 20px calc(18px + env(safe-area-inset-bottom));justify-content:flex-start}.full-back,.full-kicker{width:100%}.full-kicker{margin:13px 0 10px}.full-cover{width:min(78vw,44dvh);margin:0 auto 18px}.full-info{margin:0 auto;width:100%}.full-waveform{margin-top:20px}.full-controls{margin:20px 0}}

.full-back{text-align:left;display:flex;align-items:center;justify-content:flex-start;gap:10px;min-height:48px}.full-back span{font:11px var(--mono);letter-spacing:.12em;text-transform:uppercase}.full-controls button{width:62px;height:62px;display:grid;place-items:center;font-size:31px;line-height:1}.full-controls .full-play{width:78px;height:78px;font-size:23px}.full-bottom{min-height:44px}.full-bottom input{width:145px;height:20px}.full-progress input{height:20px}
@media(max-width:560px){.full-back{min-height:52px;font-size:25px}.full-controls{gap:28px;margin:24px 0}.full-controls button{width:66px;height:66px;font-size:35px}.full-controls .full-play{width:82px;height:82px;font-size:25px}.full-bottom{gap:16px;min-height:50px}.full-bottom input{width:170px;height:24px}.full-progress{gap:12px}.full-progress input{height:24px}}
.system-volume-only .full-bottom{justify-content:center}.system-volume-only .full-bottom .volume-icon,.system-volume-only #fullVolume{display:none}

/* Mobile layout is locked to the device width: no sideways page panning. */
html,body{width:100%;max-width:100%;overflow-x:hidden}
@media(max-width:560px){body{overscroll-behavior-x:none}.topbar,.shell,.player,.full-player{width:100%;max-width:100%;overflow-x:hidden}.top-actions{min-width:0}.top-actions>span:not(.status-dot){display:none}.hero-copy,.content,.content-head,.toolbar,.search,.track-grid,.track-card,.now-playing,.player-center{min-width:0;max-width:100%}.toolbar{overflow:hidden}.search{width:100%;min-width:0}.now-playing strong,.now-playing span{max-width:calc(100vw - 118px)}.player{overflow:hidden}.full-info,.full-progress{min-width:0}.full-title,.full-artist{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* Landscape player: controls stay fully visible, cover becomes a fixed right-side panel. */
@media(orientation:landscape) and (max-height:800px){.full-player.open{display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,39vw);grid-template-rows:42px 22px minmax(0,1fr);column-gap:clamp(24px,3vw,48px);padding:max(12px,env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(76px,env(safe-area-inset-left));align-items:stretch}.full-back{grid-column:1;grid-row:1;width:100%;min-height:42px;font-size:21px}.full-back span{font-size:10px}.full-kicker{grid-column:1;grid-row:2;width:100%;margin:0;font-size:9px;align-self:center}.full-info{grid-column:1;grid-row:3;width:100%;height:100%;margin:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:8px 0}.full-cover{grid-column:2;grid-row:1 / span 3;width:min(39vw,calc(100dvh - 64px));height:min(39vw,calc(100dvh - 64px));margin:0;align-self:center;justify-self:end;flex-shrink:0}.full-cover img{padding:9px}.full-title{font-size:clamp(25px,4.5vh,42px);line-height:1.02}.full-artist{font-size:13px;margin-top:5px}.full-waveform{height:48px;margin:19px 0 5px}.full-progress{gap:9px}.full-progress input{position:relative;z-index:2;min-height:28px;touch-action:none}.full-controls{gap:32px;margin:20px 0 0}.full-controls button{width:56px;height:56px;font-size:30px}.full-controls .full-play{width:72px;height:72px;font-size:22px}.full-bottom{display:none}}

/* Original Holdon Records mark: compact but prominent in the app chrome. */
.brand-mark{width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px;border-radius:50%;overflow:hidden;background:#f8f7f4;box-shadow:0 0 0 1px #ffffff20,0 5px 15px #0005}.brand-mark img{width:100%;height:100%;object-fit:contain;display:block}.brand-mark i{display:none}
@media(max-width:560px){.brand-mark{width:34px;height:34px;flex-basis:34px}.brand{gap:9px}.brand strong{font-size:18px}}

/* Keep the desktop cover truly square; flex layout may otherwise compress only its height. */
.full-cover{width:min(60vh,560px);height:min(60vh,560px);flex:0 0 min(60vh,560px)}
@media(max-width:560px) and (orientation:portrait){.full-cover{width:min(78vw,44dvh);height:min(78vw,44dvh);flex-basis:min(78vw,44dvh)}}
.full-controls .full-play{font-family:system-ui,sans-serif}

/* iOS must not be able to rubber-band horizontally, even with a wide child element. */
html{overflow-x:clip;overscroll-behavior-x:none}body{position:relative;min-width:0;overflow-x:clip;overscroll-behavior-x:none}.full-player,.shell,.topbar,.player{overscroll-behavior-x:none}

/* Desktop player: reserve vertical space for every transport control. */
@media (min-width:901px){
  .player-center{display:block!important;min-width:300px}
  .player-controls{display:flex!important;min-height:34px}
  .player-controls button{display:grid!important;place-items:center}
}
@media (min-width:801px) and (min-height:801px){
  .full-player.open{justify-content:flex-start;overflow-y:auto}
  .full-cover{width:min(42vh,460px);height:min(42vh,460px);flex-basis:min(42vh,460px)}
  .full-info{margin-top:20px}
  .full-waveform{margin-top:20px}
  .full-controls{margin:20px 0}
}
@media (orientation:landscape) and (max-height:800px){
  .full-cover{width:min(39vw,calc(100dvh - 64px));height:min(39vw,calc(100dvh - 64px));flex-basis:auto}
}

/* Genre editor: compact tag grid for intentional multi-label curation. */
.genre-picker{border:1px solid var(--line);border-radius:6px;margin:16px 0 4px;padding:11px 12px 13px}.genre-picker legend{padding:0 4px;color:var(--muted);font:10px var(--mono)}.genre-picker legend small{color:#70685d;margin-left:5px}.genre-options{display:flex;flex-wrap:wrap;gap:7px}.genre-options label{margin:0!important;display:inline-flex!important;align-items:center;gap:6px;border:1px solid #4b4338;border-radius:999px;padding:6px 8px;color:var(--muted)!important;font:10px var(--mono)!important;cursor:pointer;transition:.15s}.genre-options label:has(input:checked){background:#d7ef8d1a;border-color:#9bb062;color:var(--accent)!important}.genre-options input{appearance:none;width:12px!important;height:12px!important;margin:0!important;border:1px solid #766d5d!important;border-radius:3px!important;padding:0!important;background:transparent!important}.genre-options input:checked{background:var(--accent)!important;border-color:var(--accent)!important;box-shadow:inset 0 0 0 3px var(--panel-2)}

/* Emby-inspired jump rail: letters for alphabetical views, periods for recent files. */
.quick-index{margin:16px 0 20px;padding:12px 10px 10px;border-top:1px solid #322c24;border-bottom:1px solid #322c24}.quick-index-title{margin:0 0 9px}.quick-index-buttons{display:flex;flex-wrap:wrap;gap:5px}.quick-index button{min-width:25px;height:25px;padding:0 6px;border:1px solid #443d32;border-radius:4px;background:#1b1814;color:#9b9387;font:10px var(--mono);cursor:pointer;transition:.16s}.quick-index button:hover{color:#17140f;background:var(--accent);border-color:var(--accent)}
@media(max-width:900px){.quick-index{display:none}}

/* Compact alphabetical rail, modelled after media-library jump bars. */
.quick-index{padding:10px 0 12px;border:0;margin:11px 0 17px}.quick-index-title{padding-left:10px;margin-bottom:7px}.quick-index-buttons.is-alphabet{display:grid;grid-template-columns:1fr;gap:0}.quick-index-buttons.is-alphabet button{width:100%;min-width:0;height:18px;padding:0 10px;border:0;border-radius:0;background:transparent;color:#b6b1aa;text-align:left;font:700 12px/18px var(--mono)}.quick-index-buttons.is-alphabet button:hover{color:var(--accent);background:#d7ef8d12}.quick-index-buttons.is-alphabet button:disabled{color:#4b463f;cursor:default}.quick-index-buttons.is-alphabet button:disabled:hover{background:transparent}.quick-index-buttons.is-time{display:grid;grid-template-columns:1fr;gap:3px;padding:0 8px}.quick-index-buttons.is-time button{width:100%;min-width:0;height:auto;padding:6px 7px;text-align:left;font-size:9px}

/* The index is a real divider between navigation and the cover grid. */
.layout{grid-template-columns:220px 28px minmax(0,1fr);gap:18px}.quick-index{grid-column:2;align-self:start;position:sticky;top:18px;width:28px;margin:0;padding:0;border-left:1px solid #332d25;border-right:1px solid #332d25;z-index:1}.quick-index-title{display:none}.quick-index-buttons.is-alphabet button{height:18px;padding:0;text-align:center;font-size:11px;line-height:18px}.quick-index-buttons.is-time{gap:2px;padding:0}.quick-index-buttons.is-time button{min-height:27px;padding:2px 1px;border:0;border-radius:0;background:transparent;color:#b6b1aa;text-align:center;font:700 7px/9px var(--mono);overflow-wrap:anywhere}.quick-index-buttons.is-time button:hover{background:#d7ef8d12;color:var(--accent)}
@media(max-width:900px){.layout{grid-template-columns:26px minmax(0,1fr);gap:6px;padding-top:26px}.sidebar{display:none}.quick-index{display:block;grid-column:1;top:8px;width:26px}.content{grid-column:2;min-width:0}.quick-index-buttons.is-alphabet button{height:15px;font-size:10px;line-height:15px}.quick-index-buttons.is-time button{min-height:24px;font-size:6px;line-height:8px}}

/* Group headers give genres and release periods a clear library shelf. */
.track-group-heading{grid-column:1/-1;display:flex;align-items:baseline;gap:10px;margin:27px 0 2px;padding:0 0 10px;border-bottom:1px solid #40382d;scroll-margin-top:20px}.track-group-heading:first-child{margin-top:0}.track-group-heading span{font:9px var(--mono);letter-spacing:.14em;color:var(--accent-2);white-space:nowrap}.track-group-heading strong{font-size:22px;letter-spacing:-.04em}.track-group-heading b{margin-left:auto;color:#746b5e;font:10px var(--mono)}
@media(max-width:560px){.track-group-heading{gap:7px;margin:18px 0 0;padding-bottom:7px}.track-group-heading span{font-size:7px;letter-spacing:.08em}.track-group-heading strong{font-size:16px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-group-heading b{font-size:8px}}

/* Time views use the full library width; no letter rail is shown. */
body.time-sort .layout{grid-template-columns:220px minmax(0,1fr);gap:18px}body.time-sort .quick-index{display:none}body.time-sort .content{grid-column:2}@media(max-width:900px){body.time-sort .layout{grid-template-columns:minmax(0,1fr);gap:0}body.time-sort .content{grid-column:1}}

/* Curator list: fast, direct genre assignment without opening each dialog. */
.admin-list-toggle{display:none;border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:4px;padding:9px 11px;font:10px var(--mono);cursor:pointer}.edit-mode .admin-list-toggle{display:block}.admin-list-toggle.active{background:var(--accent);border-color:var(--accent);color:#17140f}.admin-list-view .track-grid{display:block}.admin-list-row{display:grid;grid-template-columns:68px minmax(160px,1fr) 52px minmax(380px,2.8fr) 96px;align-items:center;gap:13px;min-height:86px;margin-bottom:8px;padding:8px 10px;border-color:#3d352b;overflow:visible}.admin-list-row:hover{transform:none;box-shadow:none}.admin-list-row .admin-list-cover{width:68px;height:68px;aspect-ratio:auto;border-radius:4px;overflow:hidden}.admin-list-row .admin-list-cover img{padding:0;object-fit:cover}.admin-list-row .cover-placeholder{padding:7px}.admin-list-row .cover-placeholder span{font-size:11px}.admin-list-row .card-play,.admin-list-row .add-playlist,.admin-list-row .badges,.admin-list-row .edit-tools,.admin-list-row .cover-select{display:none!important}.admin-list-track{display:grid;gap:5px;min-width:0}.admin-list-track strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-list-track span{font:10px var(--mono);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-list-year{font:11px var(--mono);color:var(--accent-2)}.admin-list-genres{display:flex;flex-wrap:wrap;gap:5px}.admin-list-genres label{display:inline-flex;align-items:center;gap:4px;border:1px solid #423a30;border-radius:999px;padding:4px 6px;color:#8e877c;font:9px var(--mono);cursor:pointer;white-space:nowrap}.admin-list-genres label:has(input:checked){border-color:#98ad5f;background:#d7ef8d12;color:var(--accent)}.admin-list-genres input{appearance:none;width:10px;height:10px;margin:0;border:1px solid #756b5b;border-radius:2px;background:transparent}.admin-list-genres input:checked{background:var(--accent);border-color:var(--accent);box-shadow:inset 0 0 0 2px var(--panel)}.admin-list-apply{height:32px;border:1px solid #81924d;border-radius:4px;background:#d7ef8d12;color:var(--accent);font:10px var(--mono);cursor:pointer}.admin-list-apply:hover{background:var(--accent);color:#17140f}.admin-list-apply:disabled{opacity:.6;cursor:wait}
@media(max-width:900px){.admin-list-row{grid-template-columns:54px minmax(0,1fr) 42px;gap:9px;padding:8px}.admin-list-row .admin-list-cover{width:54px;height:54px}.admin-list-genres{grid-column:1/-1;padding-top:2px}.admin-list-apply{grid-column:3;grid-row:2;height:28px}.admin-list-track strong{font-size:12px}.admin-list-year{font-size:10px}.admin-list-genres label{font-size:8px;padding:4px 5px}}
.admin-list-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 10px;padding:11px 12px;border:1px solid #3d352b;background:linear-gradient(90deg,#211d18,#191612)}.admin-list-toolbar div{display:grid;gap:3px}.admin-list-toolbar span{font:9px var(--mono);letter-spacing:.12em;color:var(--accent-2)}.admin-list-toolbar strong{font:11px var(--mono);color:var(--muted)}.admin-list-bulk{min-height:34px;border:1px solid var(--accent);border-radius:4px;background:var(--accent);color:#17140f;padding:7px 10px;font:10px var(--mono);cursor:pointer}.admin-list-bulk:disabled{border-color:#453f35;background:transparent;color:#70685d;cursor:default}.admin-list-row.is-dirty{border-color:#81924d;box-shadow:inset 3px 0 0 var(--accent)}.admin-list-row .admin-list-cover{position:relative;display:block;border:0;background:#15120f;padding:0;cursor:pointer}.admin-list-cover .admin-list-cover-play{position:absolute;inset:0;display:grid;place-items:center;background:#100e0b99;color:var(--accent);font-size:21px;opacity:0;transition:opacity .16s ease}.admin-list-cover:hover .admin-list-cover-play,.admin-list-cover:focus-visible .admin-list-cover-play,.admin-list-cover.is-playing .admin-list-cover-play{opacity:1}.admin-list-cover:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:900px){.admin-list-toolbar{padding:9px;align-items:flex-end}.admin-list-toolbar strong{font-size:9px}.admin-list-bulk{font-size:9px;padding:7px 8px}.admin-list-cover .admin-list-cover-play{font-size:16px;opacity:.78}}

/* Cover replacement offers one clear touch target for file picking and drag-and-drop. */
.cover-file-input{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}.cover-dropzone{position:relative;width:100%;min-height:104px;display:flex;align-items:center;gap:12px;text-align:left;padding:14px 16px;border:1px dashed #6d7750;border-radius:6px;background:#17140f;color:var(--text);cursor:pointer;overflow:hidden;transition:.2s ease}.cover-dropzone:hover,.cover-dropzone.is-dragging{border-color:var(--accent);background:#202018;box-shadow:inset 0 0 0 1px #d7ef8d28}.cover-dropzone.is-dragging{transform:scale(1.01)}.cover-dropzone-icon{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:var(--accent);color:#17140f;font:24px var(--sans)}.cover-dropzone strong,.cover-dropzone small{display:block}.cover-dropzone strong{font-size:12px}.cover-dropzone small{margin-top:4px;color:var(--muted);font:10px var(--mono);line-height:1.45}.cover-dropzone img{display:none;width:72px;height:72px;margin-left:auto;object-fit:cover;border-radius:4px;border:1px solid #ffffff24}.cover-dropzone.has-file{border-style:solid;border-color:#8da357}.cover-dropzone.has-file .cover-dropzone-icon{font-size:0}.cover-dropzone.has-file .cover-dropzone-icon:after{content:'✓';font:18px var(--sans)}.cover-dropzone.has-file img{display:block}@media(max-width:560px){.cover-dropzone{min-height:112px}.cover-dropzone img{width:78px;height:78px}}

/* A cover should always open the player on the first touch; hidden controls do not intercept it. */
.card-play{pointer-events:none}.track-card:hover .card-play,.track-card.playing .card-play{pointer-events:auto}
.track-card .card-play{opacity:1;transform:none;pointer-events:none}.track-card.playing .card-play{background:var(--accent);color:#17140f}
.track-grid .card-play{left:50%;top:50%;right:auto;bottom:auto;width:56px;height:56px;font-size:19px;opacity:0;transform:translate(-50%,-50%) scale(.82);pointer-events:none;transition:opacity .18s ease,transform .2s ease}.track-grid .track-card:hover .card-play,.track-grid .track-card.playing .card-play{opacity:0;transform:translate(-50%,-50%) scale(.82);pointer-events:none}.track-grid .track-card.show-cover-feedback .card-play{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:none}
.track-grid .track-card.show-cover-feedback .card-play{animation:cover-feedback-pop .65s cubic-bezier(.2,.82,.26,1) both}@keyframes cover-feedback-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.13)}42%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(.9)}}

/* The hero record carries the real HRM mark and alternates between a short spin and stillness. */
.disc{animation:record-motion 15s cubic-bezier(.42,0,.24,1) infinite}.disc-label{display:grid;place-items:center;width:82px;height:82px}.disc-logo{width:76px;height:76px;object-fit:contain;border-radius:50%;box-shadow:0 3px 10px #0006}@keyframes record-motion{0%,12%{transform:translateY(0) rotate(0deg)}30%{transform:translateY(-5px) rotate(150deg)}50%{transform:translateY(-8px) rotate(720deg)}62%,100%{transform:translateY(0) rotate(720deg)}}

/* The title acts as the compact edit entry point in curator list mode. */
.admin-list-track strong{cursor:pointer;text-align:left}.admin-list-track strong:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.admin-list-languages{display:flex;align-items:center;flex-wrap:wrap;gap:5px;width:100%;margin-top:3px;padding-top:6px;border-top:1px dashed #4a4237}.admin-list-languages>span{margin-right:3px;color:var(--accent-2);font:8px var(--mono);letter-spacing:.08em}.admin-list-languages label{border-color:#4f463a!important;color:#aaa092!important}.admin-list-languages label:has(input:checked){border-color:#d6a764!important;background:#d6a76414!important;color:#f0c678!important}.admin-list-languages input:checked{background:#f0c678!important;border-color:#f0c678!important}

/* CSS-drawn transport controls stay monochrome on iOS; no emoji glyphs. */
.transport-icon{display:block;position:relative;width:14px;height:16px;margin:auto}.transport-icon.is-play{width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid currentColor}.transport-icon.is-pause:before,.transport-icon.is-pause:after{content:'';position:absolute;top:0;width:4px;height:16px;border-radius:1px;background:currentColor}.transport-icon.is-pause:before{left:1px}.transport-icon.is-pause:after{right:1px}.full-play .transport-icon{width:16px;height:19px}.full-play .transport-icon.is-play{border-top-width:9px;border-bottom-width:9px;border-left-width:14px}.full-play .transport-icon.is-pause:before,.full-play .transport-icon.is-pause:after{height:19px;width:5px}

/* Public studio identity and the listener-account invitation. */
.brand-wordmark{position:relative;display:grid;line-height:1}.brand-wordmark strong{font-size:17px;letter-spacing:-.055em;text-transform:lowercase}.brand-wordmark em{margin:4px 0 0;font:italic 12px var(--serif);letter-spacing:.01em;color:var(--text)}.brand-wordmark i{position:absolute;right:-6px;bottom:-6px;transform:rotate(-5deg);padding:2px 5px;border:1px solid #d7ef8d45;border-radius:20px;background:#1b1814;color:var(--accent);font:700 8px var(--mono);letter-spacing:.08em;text-transform:uppercase}.account-button,.logout-button{border:1px solid #6f7d47;border-radius:999px;background:#d7ef8d12;color:var(--accent);padding:7px 11px;font:10px var(--mono);cursor:pointer}.account-button:hover{background:var(--accent);color:#17140f}.logout-button{border-color:var(--line);color:var(--muted)}.hero-account-cta{display:flex;align-items:center;gap:16px;width:min(510px,100%);margin-top:25px;padding:12px 13px 12px 15px;border:1px solid #716747;background:linear-gradient(100deg,#24231aee,#1a1713cc);box-shadow:0 12px 30px #0003}.hero-account-cta div{display:grid;gap:3px;min-width:0}.hero-account-cta strong{font-size:12px}.hero-account-cta span{color:var(--muted);font:10px/1.45 var(--mono)}.hero-signup{flex:0 0 auto;border:0;border-radius:3px;background:var(--accent);color:#17140f;padding:10px 12px;font:700 10px var(--mono);cursor:pointer}.hero-signup:hover{filter:brightness(1.07)}.playlist-guest{margin:2px 0 9px;padding:10px;border:1px dashed #514a3d;color:var(--muted);font:10px/1.45 var(--mono)}.playlist-guest button{margin-top:7px;border:0;background:transparent;color:var(--accent);padding:0;font:700 10px var(--mono);cursor:pointer}.account-dialog{width:min(420px,92vw)}.account-dialog h3{margin-bottom:7px}.account-dialog .account-copy{margin:0 0 18px;color:var(--muted);font:11px/1.55 var(--sans)}.account-dialog .account-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:15px}.account-dialog .account-actions button{height:43px;border-radius:4px;font:700 11px var(--sans);cursor:pointer}.account-login{border:1px solid var(--line);background:transparent;color:var(--text)}.account-register{border:0;background:var(--accent);color:#17140f}.account-dialog .dialog-error{min-height:19px}
@media(max-width:560px){.brand-wordmark strong{font-size:15px}.brand-wordmark em{font-size:11px}.brand-wordmark i{right:-4px;bottom:-7px;font-size:7px}.top-actions .logout-button{display:none}.account-button{padding:7px 9px}.hero-account-cta{align-items:flex-start}.hero-signup{padding:10px 9px}.hero-account-cta strong{font-size:11px}.hero-account-cta span{font-size:9px}}

/* Listener access belongs to the same tactile, understated Holdon system as the player. */
.brand-wordmark{display:flex;align-items:baseline;gap:5px;line-height:1;white-space:nowrap}.brand-wordmark strong{font-size:16px;letter-spacing:-.045em;color:var(--text)}.brand-wordmark em{margin:0;font:500 12px var(--sans);letter-spacing:.015em;color:#d9d2c6}.brand-wordmark i{position:relative;right:auto;bottom:auto;display:inline-block;transform:translate(-3px,-7px) rotate(-4deg);padding:3px 7px;border:1px solid #d7ef8d66;border-radius:2px;background:linear-gradient(135deg,#dff5a0,#b8d76a);box-shadow:0 4px 14px #0005;color:#18150f;font:800 8px var(--mono);letter-spacing:.1em;text-transform:uppercase}.account-button,.logout-button{position:relative;overflow:hidden;border:1px solid #81795f;border-radius:5px;background:linear-gradient(145deg,#28231d,#191613);box-shadow:inset 0 1px #ffffff12,0 5px 14px #0003;color:#f3eee5;padding:9px 13px;font:700 10px var(--mono);letter-spacing:.055em;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease}.account-button:before{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 25%,#d7ef8d20 50%,transparent 72%);transform:translateX(-110%);transition:transform .45s ease}.account-button:hover{border-color:var(--accent);background:#2c3020;color:var(--accent);transform:translateY(-1px)}.account-button:hover:before{transform:translateX(110%)}.logout-button{border-color:#4b453b;background:#17140f;color:#a79f93}.logout-button:hover{border-color:#b5aa99;color:#f3eee5}.hero-account-cta{position:relative;isolation:isolate;gap:19px;width:min(550px,100%);margin-top:28px;padding:14px 15px 14px 17px;border:1px solid #6a644e;border-radius:7px;background:linear-gradient(112deg,#262219f2,#191611df);box-shadow:0 17px 40px #0005,inset 0 1px #ffffff0b}.hero-account-cta:before{content:'';position:absolute;z-index:-1;inset:1px;border-radius:6px;background:radial-gradient(circle at 80% 0,#d7ef8d12,transparent 39%)}.hero-account-cta strong{font-size:13px;letter-spacing:-.02em}.hero-account-cta span{font:10px/1.45 var(--mono)}.hero-signup{position:relative;flex:0 0 auto;overflow:hidden;border:1px solid #eaffb3;border-radius:5px;background:linear-gradient(135deg,#e4f9a0,#b8d76b);box-shadow:0 7px 20px #c9e87a2e;color:#17140f;padding:11px 14px;font:800 10px var(--mono);letter-spacing:.055em;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}.hero-signup:after{content:'→';margin-left:7px;font-size:13px}.hero-signup:hover{filter:none;transform:translateY(-2px);box-shadow:0 10px 25px #c9e87a46}.account-dialog{border-color:#615a49;background:linear-gradient(145deg,#242019,#15130f);box-shadow:0 24px 70px #000a}.account-dialog .account-actions{gap:10px;margin-top:18px}.account-dialog .account-actions button,.profile-save,.profile-password,.profile-logout{height:44px;border-radius:5px;font:800 10px var(--mono);letter-spacing:.06em;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease}.account-login{border:1px solid #77705e!important;background:linear-gradient(145deg,#29241d,#1a1712)!important;color:#f2ede2!important}.account-login:hover{border-color:var(--accent)!important;color:var(--accent)!important;transform:translateY(-1px)}.account-register,.profile-save{border:1px solid #eaffb3!important;background:linear-gradient(135deg,#e4f9a0,#b8d76b)!important;box-shadow:0 7px 20px #c9e87a26;color:#17140f!important}.account-register:hover,.profile-save:hover,.profile-password:hover{transform:translateY(-1px);filter:brightness(1.04)}.field-optional{color:var(--muted);font:9px var(--mono);font-weight:400}.profile-dialog form{max-height:min(82vh,760px);overflow-y:auto;padding-right:4px}.profile-dialog label{margin-top:13px}.profile-hint{margin:7px 0 0;color:#a9a293;font:10px/1.5 var(--sans)}.profile-divider{display:flex;align-items:center;gap:10px;margin:20px 0 2px;color:var(--accent-2);font:9px var(--mono);letter-spacing:.12em}.profile-divider:after{content:'';height:1px;flex:1;background:#4c4539}.profile-save,.profile-password,.profile-logout{width:100%;margin-top:13px}.profile-password{border:1px solid #a1b965;background:#2d3320;color:var(--accent)}.profile-logout{height:36px;border:0;background:transparent;color:#a69d91;text-decoration:underline;text-underline-offset:4px}.profile-logout:hover{color:#f3eee5}
@media(max-width:560px){.brand-wordmark{gap:3px}.brand-wordmark strong{font-size:13px}.brand-wordmark em{font-size:10px}.brand-wordmark i{transform:translate(-2px,-6px) rotate(-4deg);padding:2px 4px;font-size:6px}.account-button{padding:8px 10px;font-size:9px}.hero-account-cta{gap:12px;padding:13px}.hero-signup{padding:10px 11px;font-size:9px}.hero-signup:after{margin-left:4px}.account-dialog .account-actions{grid-template-columns:1fr}.profile-dialog{width:min(420px,94vw)}}

/* Playlist choice is deliberately a small, focused shelf rather than another form. */
.playlist-picker{width:min(430px,92vw);border-color:#6b644d;background:linear-gradient(145deg,#252119,#15130f);box-shadow:0 24px 70px #000b}.playlist-picker h3{margin-bottom:7px}.playlist-picker-lists{display:grid;gap:8px;max-height:min(42vh,330px);margin:17px 0 11px;overflow:auto;padding-right:3px}.playlist-picker-choice{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;min-height:57px;padding:9px 11px;border:1px solid #4f493b;border-radius:5px;background:linear-gradient(120deg,#211d17,#181511);color:var(--text);text-align:left;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease}.playlist-picker-choice span{display:grid;place-items:center;width:26px;height:26px;border:1px solid #7e9150;border-radius:50%;color:var(--accent);font:14px var(--sans)}.playlist-picker-choice strong{overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.playlist-picker-choice small{color:var(--muted);font:9px var(--mono);white-space:nowrap}.playlist-picker-choice:hover{transform:translateX(2px);border-color:var(--accent);background:#292d1d}.playlist-picker-empty{padding:15px 4px;color:var(--muted);font:11px/1.5 var(--sans)}.playlist-picker-new{width:100%;min-height:43px;margin-top:3px;border:1px dashed #9eb665;border-radius:5px;background:#d7ef8d0d;color:var(--accent);font:800 10px var(--mono);letter-spacing:.06em;cursor:pointer;transition:.18s ease}.playlist-picker-new:hover{border-style:solid;background:#d7ef8d1b;transform:translateY(-1px)}
@media(max-width:560px){.playlist-picker{width:min(430px,94vw)}.playlist-picker-choice{min-height:61px}.playlist-picker-lists{max-height:44vh}}

/* Keep the library navigation compact until a listener asks for a category. */
.sidebar-section{margin-top:12px}.sidebar-section:first-of-type{margin-top:0}.section-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;margin:0;border:0;background:transparent;color:#8f877b;padding:4px 2px 9px;text-align:left;font:10px var(--mono);letter-spacing:.16em;cursor:pointer;transition:color .17s ease}.section-toggle:hover{color:var(--accent)}.section-toggle span{display:grid;place-items:center;width:18px;height:18px;border:1px solid #433c31;border-radius:50%;color:#aca395;font-size:13px;line-height:1;transform:rotate(-90deg);transition:transform .2s ease,border-color .2s ease,color .2s ease}.section-toggle[aria-expanded="true"]{color:#bdb4a7}.section-toggle[aria-expanded="true"] span{transform:rotate(0);border-color:#849852;color:var(--accent)}.section-body[hidden]{display:none!important}.section-body{margin-top:2px}.playlist-section{position:relative;margin-top:34px}.playlist-heading{position:relative;margin:0 0 12px}.playlist-nudge{position:absolute;right:-2px;top:-17px;display:none;align-items:center;gap:4px;max-width:118px;color:var(--accent);font:700 8px/1.1 var(--mono);letter-spacing:.02em;text-transform:none;transform:rotate(-4deg);text-shadow:0 2px 12px #000}.playlist-attention .playlist-nudge{display:inline-flex;animation:playlist-nudge-flash .62s ease-in-out 2 both}.playlist-attention{border-left:2px solid var(--accent);margin-left:-10px;padding:8px 0 8px 8px;background:linear-gradient(90deg,#d7ef8d14,transparent 84%);border-radius:2px}@keyframes playlist-nudge-flash{0%,100%{opacity:0;transform:translateY(-4px) rotate(-4deg)}35%,70%{opacity:1;transform:translateY(1px) rotate(-4deg)}}

/* Reactions use drawn vector marks, never platform-dependent emoji. */
.card-actions{display:flex;align-items:center;gap:4px;margin-left:auto}.reaction-button{position:relative;display:grid;place-items:center;width:27px;height:27px;overflow:visible;border:0;border-radius:50%;background:transparent;color:#786f62;cursor:pointer;transition:color .17s ease,background .17s ease,transform .17s ease}.reaction-button svg,.reaction-report-icon svg{width:15px;height:15px;fill:currentColor}.reaction-button:hover{background:#d7ef8d12;color:var(--accent);transform:translateY(-1px)}.reaction-button.active{background:#d7ef8d1c;color:var(--accent)}.reaction-button.dislike.active{color:#b7d66d}.reaction-button.reaction-burst:before,.reaction-button.reaction-burst:after{content:'';position:absolute;z-index:-1;inset:-10px;border-radius:50%;background:radial-gradient(circle at 50% 0,#d7ef8d 0 2px,transparent 3px),radial-gradient(circle at 90% 24%,#f3c16c 0 2px,transparent 3px),radial-gradient(circle at 86% 78%,#d7ef8d 0 2px,transparent 3px),radial-gradient(circle at 18% 79%,#f39b67 0 2px,transparent 3px),radial-gradient(circle at 7% 30%,#d7ef8d 0 2px,transparent 3px);animation:reaction-firework .58s cubic-bezier(.2,.8,.3,1) both}.reaction-button.reaction-burst:after{animation-delay:.06s;filter:blur(.25px)}@keyframes reaction-firework{0%{opacity:0;transform:scale(.25) rotate(-15deg)}28%{opacity:1}100%{opacity:0;transform:scale(1.3) rotate(18deg)}}.reaction-button.reaction-drop{animation:reaction-dislike .48s cubic-bezier(.3,.8,.36,1) both}@keyframes reaction-dislike{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(3px) rotate(10deg)}58%{transform:translateY(-1px) rotate(-6deg)}}.likes-playlist{margin-bottom:5px;border:1px solid #4e493b!important;background:#1a1712!important;color:#b8b0a4!important}.likes-playlist:hover,.likes-playlist.active{border-color:#91a958!important;background:#d7ef8d16!important;color:var(--accent)!important}.likes-playlist-icon{position:relative;width:13px;height:13px;display:inline-block;border:2px solid currentColor;border-radius:3px;transform:rotate(45deg) scale(.72)}.likes-playlist-icon:before,.likes-playlist-icon:after{content:'';position:absolute;width:7px;height:7px;border:2px solid currentColor;border-radius:50%;background:#1a1712}.likes-playlist-icon:before{left:-4px;top:-5px}.likes-playlist-icon:after{right:-5px;top:-5px}.playlist-nudge{right:-7px;top:-25px;max-width:175px;color:#efffb3;font:800 11px/1.2 var(--mono);letter-spacing:.015em}.playlist-attention .playlist-nudge{animation:playlist-nudge-flash .6s ease-in-out 3 both}.reaction-report-button{border:1px solid #71834a;background:#d7ef8d10;color:var(--accent);border-radius:5px;padding:9px 11px;font:800 10px var(--mono);letter-spacing:.045em;cursor:pointer}.reaction-report-button:hover{background:#d7ef8d20}.reaction-report{width:min(640px,94vw)}.reaction-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:-3px 0 17px}.reaction-summary span{padding:11px 9px;border:1px solid #494334;border-radius:5px;background:#191611;color:var(--muted);font:9px var(--mono);text-align:center}.reaction-summary b{display:block;margin-bottom:3px;color:var(--accent);font:18px var(--sans)}.reaction-report-list{display:grid;gap:7px;max-height:min(55vh,490px);overflow:auto;padding-right:3px}.reaction-report-row{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px;border:1px solid #443d31;border-radius:5px;background:#1a1712}.reaction-report-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#d7ef8d16;color:var(--accent)}.reaction-report-row.dislike .reaction-report-icon{color:#b7d66d}.reaction-report-row strong,.reaction-report-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reaction-report-row strong{font-size:11px}.reaction-report-row small{margin-top:3px;color:var(--muted);font:9px var(--mono)}.reaction-report-row>b{color:var(--accent);font:9px var(--mono)}.reaction-report-empty{padding:22px 5px;color:var(--muted);font:11px var(--sans);text-align:center}@media(max-width:560px){.card-actions{gap:1px}.reaction-button{width:25px;height:25px}.playlist-nudge{font-size:9px;right:0;top:-21px}.reaction-report-button{padding:8px 9px;font-size:9px}.reaction-summary{gap:5px}.reaction-report-row{grid-template-columns:27px minmax(0,1fr) auto;padding:9px}.reaction-report-row small{font-size:8px}}

/* The default library state names the deliberate seasonal omission without competing with the navigation. */
.all-titles-nav{align-items:flex-start}.all-titles-indicator{flex:0 0 auto}.all-titles-copy{display:grid;gap:3px;min-width:0;color:inherit!important;font-size:inherit!important;line-height:1.08}.all-titles-copy small{color:#80786d;font:8px/1.2 var(--mono);letter-spacing:.02em;text-transform:none;white-space:nowrap}.all-titles-nav:hover .all-titles-copy small,.all-titles-nav.active .all-titles-copy small{color:#a9b87c}.stats span{display:flex;align-items:baseline;gap:4px}.seasonal-note{color:#827a6e;font:8px/1.2 var(--mono);letter-spacing:0;text-transform:none;white-space:nowrap}@media(max-width:560px){.all-titles-copy small{font-size:7px}.seasonal-note{display:block;font-size:7px;white-space:normal}.stats span{align-items:flex-start;flex-direction:column;gap:1px}}

/* Cards protect the listening metadata first; reactions live on their own tactile control row. */
.track-grid .card-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;margin-top:7px}.track-grid .card-meta .card-artist{min-width:0;color:var(--muted)}.track-grid .card-meta .card-date,.track-grid .card-meta .card-duration{white-space:nowrap;color:#aaa093}.track-grid .card-duration{display:none}.track-grid .card-actions{display:flex;justify-content:flex-end;gap:6px;width:100%;min-height:35px;margin:10px 0 0;padding-top:8px;border-top:1px solid #383127}.track-grid .add-playlist{display:grid;place-items:center;width:27px;height:27px;border:1px solid #50483b;border-radius:50%;font-size:16px;line-height:1}.marquee{display:block;min-width:0;overflow:hidden;white-space:nowrap}.marquee>span{display:inline-block;min-width:max-content;will-change:transform}.marquee.is-overflow>span{animation:card-marquee 4.7s cubic-bezier(.38,.02,.22,.98) .55s infinite alternate}@keyframes card-marquee{0%,13%{transform:translateX(0)}87%,100%{transform:translateX(var(--marquee-end,0px))}}@media(max-width:560px){.track-grid .card-actions{margin-top:8px;padding-top:7px;min-height:32px}.track-grid .reaction-button,.track-grid .add-playlist{width:25px;height:25px}.track-grid .card-meta{gap:5px}.track-grid .card-meta .card-date{font-size:8px}}

/* Card reactions sit in the visual centre; utility actions stay deliberately to the right. */
.track-grid .card-actions{display:grid;grid-template-columns:auto 1fr auto;align-items:center}.track-grid .share-track{grid-column:1;justify-self:start}.reaction-cluster{grid-column:2;justify-self:center;display:flex;align-items:center;gap:7px}.card-utilities{grid-column:3;display:flex;align-items:center;justify-self:end;gap:6px}.track-grid .share-track,.track-grid .add-playlist{display:grid;place-items:center;width:29px;height:29px;margin:0;border-radius:50%;cursor:pointer}.track-grid .share-track{border:1px solid #5d5548;background:#211d17;color:#c0b7a9}.track-grid .share-track:hover{border-color:#d7ef8d;background:#d7ef8d16;color:var(--accent)}.track-grid .share-track svg{width:15px;height:15px;fill:currentColor}.track-grid .add-playlist{border-color:#c0df71;background:linear-gradient(145deg,#dff69a,#bad96a);box-shadow:0 4px 12px #c9e87a25;color:#17140f;font-size:20px;font-weight:700}.track-grid .add-playlist:hover{filter:brightness(1.05);transform:translateY(-1px)}.track-grid .add-playlist span{display:grid;place-items:center;width:100%;height:100%;line-height:1;transform:translateY(-.5px)}
.share-dialog{width:min(410px,92vw);border-color:#6b644d;background:linear-gradient(145deg,#252119,#15130f);box-shadow:0 24px 70px #000b}.share-dialog h3{margin-bottom:12px}.share-preview{display:grid;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:12px;min-height:76px;margin:0 0 14px;padding:9px;border:1px solid #4b4438;border-radius:6px;background:#191611}.share-preview img,.share-preview-note{display:grid;place-items:center;width:58px;height:58px;border-radius:4px;object-fit:cover;background:#2a251e;color:var(--accent);font:24px var(--serif)}.share-preview strong,.share-preview span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.share-preview strong{font-size:13px}.share-preview span{margin-top:5px;color:var(--muted);font:10px var(--mono)}.share-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:9px;margin-top:18px}.share-actions button{min-height:43px;border-radius:5px;font:800 10px var(--mono);letter-spacing:.05em;cursor:pointer}.share-native{border:1px solid #746c5d;background:#211d17;color:#e8e2d9}.share-copy{border:1px solid #eaffb3;background:linear-gradient(135deg,#e4f9a0,#b8d76b);color:#17140f;box-shadow:0 7px 20px #c9e87a26}.share-native:hover{border-color:var(--accent);color:var(--accent)}.share-copy:hover{filter:brightness(1.05);transform:translateY(-1px)}@media(max-width:560px){.track-grid .share-track,.track-grid .add-playlist{width:27px;height:27px}.reaction-cluster{gap:5px}.card-utilities{gap:4px}.share-dialog{width:min(410px,94vw)}}

/* Playlist sharing uses a compact cover mosaic and keeps its public action distinct from opening the list. */
.playlist-row{display:grid;grid-template-columns:minmax(0,1fr) 30px;align-items:center;gap:3px}.playlist-row .filter-item{width:100%;min-width:0}.playlist-share-button{display:grid;place-items:center;width:29px;height:29px;border:1px solid #514a3d;border-radius:50%;background:#1a1712;color:#a9a194;cursor:pointer;transition:.16s ease}.playlist-share-button:hover{border-color:#d7ef8d;background:#d7ef8d14;color:var(--accent);transform:translateY(-1px)}.playlist-share-button svg{width:14px;height:14px;fill:currentColor}.playlist-share-preview{display:grid;grid-template-columns:88px minmax(0,1fr);align-items:center;gap:13px;min-height:92px;margin:0 0 13px;padding:9px;border:1px solid #4b4438;border-radius:6px;background:#191611}.playlist-share-preview>div:last-child{min-width:0}.playlist-share-preview strong,.playlist-share-preview span,.playlist-share-preview small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.playlist-share-preview strong{font-size:13px}.playlist-share-preview span{margin-top:5px;color:var(--muted);font:10px var(--mono)}.playlist-share-preview small{margin-top:4px;color:var(--accent-2);font:9px var(--mono)}.playlist-share-collage{display:grid;width:88px;height:74px;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:2px;overflow:hidden;border-radius:4px;background:#29241d}.playlist-share-collage img,.playlist-share-collage>span{width:100%;height:100%;object-fit:cover;background:#29241d;color:var(--accent);font:20px var(--serif);display:grid;place-items:center}.playlist-share-collage.count-1>*{grid-column:1/3;grid-row:1/3}.playlist-share-collage.count-2{grid-template-rows:1fr}.playlist-share-collage.count-2>*{grid-row:1/3}.playlist-share-collage.count-3>*:first-child{grid-row:1/3}.playlist-share-revoke{display:block;margin:12px auto 0;border:0;background:transparent;color:#a69d91;font:9px var(--mono);text-decoration:underline;text-underline-offset:4px;cursor:pointer}.playlist-share-revoke:hover{color:#ff8178}.share-actions button:disabled{opacity:.45;cursor:wait;transform:none!important}@media(max-width:560px){.playlist-share-preview{grid-template-columns:78px minmax(0,1fr)}.playlist-share-collage{width:78px;height:68px}.playlist-share-button{width:27px;height:27px}}

/* An opened playlist keeps its public share action beside the title, not hidden in navigation. */
.view-title-row{display:flex;align-items:center;gap:10px;min-width:0}.playlist-context-share{display:grid;place-items:center;flex:0 0 auto;width:31px;height:31px;border:1px solid #6d7650;border-radius:50%;background:#d7ef8d12;color:var(--accent);cursor:pointer;transition:.17s ease}.playlist-context-share:hover{border-color:var(--accent);background:#d7ef8d25;transform:translateY(-1px)}.playlist-context-share svg{width:15px;height:15px;fill:currentColor}.playlist-context-copy{min-height:31px;max-width:100%;border:1px solid #d9f199;border-radius:5px;background:linear-gradient(135deg,#e4f9a0,#b8d76b);box-shadow:0 5px 14px #c9e87a20;color:#17140f;padding:7px 10px;font:800 9px var(--mono);letter-spacing:.035em;cursor:pointer;transition:.17s ease}.playlist-context-copy:hover{transform:translateY(-1px);filter:brightness(1.04)}.playlist-context-copy:disabled{opacity:.6;cursor:wait;transform:none}.playlist-context-share[hidden],.playlist-context-copy[hidden]{display:none!important}

/* A compact library list keeps artwork visible without sacrificing scan speed. */
.library-view-toggle{display:grid;place-items:center;flex:0 0 auto;width:39px;height:39px;border:1px solid #514a3d;border-radius:4px;background:#1b1814;color:#aaa193;cursor:pointer;transition:.17s ease}.library-view-toggle:hover{border-color:#91a958;color:var(--accent);background:#d7ef8d12}.library-view-toggle svg{width:16px;height:16px;fill:currentColor}.library-view-toggle.active{border-color:#b9d96d;background:#d7ef8d18;color:var(--accent)}.library-list-view .track-grid{display:block}.library-list-view .track-grid>.track-card:not(.admin-list-row){display:grid;grid-template-columns:76px minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;min-height:78px;margin:0 0 8px;border-radius:6px;overflow:hidden}.library-list-view .track-grid>.track-card:not(.admin-list-row):hover{transform:none}.library-list-view .track-grid>.track-card:not(.admin-list-row) .cover{grid-column:1;grid-row:1/3;width:76px;height:78px;aspect-ratio:auto}.library-list-view .track-grid>.track-card:not(.admin-list-row) .cover img{object-fit:cover;padding:0}.library-list-view .track-grid>.track-card:not(.admin-list-row) .cover-placeholder{padding:8px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .cover-placeholder span{font-size:12px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .badges{top:5px;left:5px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .badge{padding:3px 4px;font-size:7px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-body{grid-column:2;grid-row:1/3;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;align-content:center;gap:3px;padding:10px 12px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-title{grid-column:1;grid-row:1;font-size:13px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-meta{grid-column:1;grid-row:2;margin:0;max-width:390px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-date{display:none}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-duration{display:block;font:10px var(--mono);color:var(--accent-2)}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-actions{grid-column:2;grid-row:1/3;align-self:center;min-height:0;margin:0;padding:0;border:0;width:auto;min-width:112px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-play{width:42px;height:42px;font-size:14px}.library-list-view .track-group-heading{margin-top:21px}.library-list-view .track-group-heading:first-child{margin-top:0}
.cover-audio-ring{position:absolute;z-index:3;top:50%;left:50%;display:grid;width:52px;height:52px;place-items:center;transform:translate(-50%,-50%);border:1px solid #d7ef8d;border-radius:50%;background:transparent;box-shadow:0 0 0 2px #d7ef8d18;pointer-events:none;animation:cover-ring-arrive .24s cubic-bezier(.2,.8,.2,1) both}.cover-audio-ring:before{content:none}.cover-audio-ring canvas{display:block;width:100%;height:100%;filter:drop-shadow(0 0 2px #d7ef8d66)}@keyframes cover-ring-arrive{from{opacity:0;scale:.72}to{opacity:1;scale:1}}
.library-list-view .track-grid>.track-card:not(.admin-list-row) .cover-audio-ring{width:38px;height:38px;box-shadow:0 0 0 1px #d7ef8d18}.library-list-view .track-grid>.track-card:not(.admin-list-row) .cover-audio-ring:before{content:none}
@media(max-width:560px){.track-grid .cover-audio-ring{width:46px;height:46px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .cover-audio-ring{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){.cover-audio-ring{animation:none}}

/* Raise both bottom-player rows slightly while keeping all transport controls visible. */
.player-center{transform:translateY(-5px)}

/* Welcome is a short, cinematic threshold into the library, never a generic modal. */
.welcome-screen{position:fixed;z-index:90;inset:0;display:grid;place-items:center;isolation:isolate;overflow:auto;padding:max(26px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(26px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:radial-gradient(circle at 50% 18%,#3f3324 0,#211d17 34%,#100e0c 78%);opacity:0;transition:opacity .38s ease}.welcome-screen[hidden]{display:none!important}.welcome-screen.is-open{opacity:1}.welcome-screen:before{content:'';position:fixed;inset:0;z-index:-1;background:linear-gradient(115deg,#d7ef8d08,transparent 33%,#f39b6707 68%,transparent);pointer-events:none}.welcome-aurora{position:absolute;z-index:-1;border-radius:50%;filter:blur(12px);opacity:.28;pointer-events:none}.welcome-aurora-one{width:min(62vw,720px);height:min(62vw,720px);right:-17vw;top:-23vw;background:#d7ef8d;animation:welcome-drift 11s ease-in-out infinite alternate}.welcome-aurora-two{width:min(55vw,590px);height:min(55vw,590px);left:-21vw;bottom:-29vw;background:#f39b67;animation:welcome-drift 13s ease-in-out -5s infinite alternate-reverse}@keyframes welcome-drift{to{transform:translate(30px,18px) scale(1.1);opacity:.16}}.welcome-shell{position:relative;width:min(690px,100%);padding:clamp(25px,5vw,54px);border:1px solid #6b624f;background:linear-gradient(140deg,#211d18eF,#14120eeF);box-shadow:0 30px 100px #000a,inset 0 1px #ffffff12;text-align:center;overflow:hidden}.welcome-shell:before{content:'';position:absolute;inset:8px;border:1px solid #ffffff0a;pointer-events:none}.welcome-kicker{color:var(--accent-2);font:10px var(--mono);letter-spacing:.28em}.welcome-logo{display:block;width:clamp(90px,15vw,128px);height:clamp(90px,15vw,128px);margin:22px auto 14px;border-radius:50%;object-fit:contain;filter:drop-shadow(0 13px 27px #0008);animation:welcome-logo-in .8s cubic-bezier(.18,.9,.3,1) both}@keyframes welcome-logo-in{from{opacity:0;transform:scale(.64) rotate(-18deg)}to{opacity:1;transform:none}}.welcome-brand{display:grid;gap:3px}.welcome-brand strong{font-size:clamp(20px,4vw,30px);letter-spacing:-.055em;text-transform:lowercase}.welcome-brand span{color:#d5cdc0;font:12px var(--sans);letter-spacing:.05em}.welcome-brand i{display:inline-block;margin-left:4px;padding:2px 5px;transform:translateY(-3px) rotate(-4deg);background:var(--accent);color:#1a1710;font:800 8px var(--mono);letter-spacing:.09em;text-transform:uppercase}.welcome-copy{max-width:500px;margin:28px auto 0}.welcome-copy h1{margin:0;font-size:clamp(35px,6.2vw,62px);line-height:.94;letter-spacing:-.07em}.welcome-copy h1 em{color:var(--accent);font:italic .92em var(--serif)}.welcome-copy p{margin:17px 0 0;color:#b0a79a;font:13px/1.65 var(--sans)}.welcome-notes{display:grid;gap:8px;margin:28px auto 0;max-width:500px;text-align:left}.welcome-notes div{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;padding:9px 0;border-top:1px solid #4a4237;color:#b9b0a4;font:10px/1.45 var(--mono)}.welcome-notes div:last-child{border-bottom:1px solid #4a4237}.welcome-notes b{color:var(--accent-2);font:10px var(--mono)}.welcome-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:27px}.welcome-sound,.welcome-enter{min-height:43px;border-radius:5px;padding:0 14px;font:800 10px var(--mono);letter-spacing:.045em;cursor:pointer;transition:.18s ease}.welcome-sound{display:inline-flex;align-items:center;gap:9px;border:1px solid #615b4d;background:#1b1814;color:#e6dfd4}.welcome-sound:hover{border-color:var(--accent);color:var(--accent)}.welcome-sound.is-playing{border-color:#b9d96d;background:#d7ef8d12;color:var(--accent)}.welcome-sound-bars{display:flex;align-items:center;gap:2px;height:15px}.welcome-sound-bars i{display:block;width:2px;height:5px;border-radius:2px;background:currentColor}.welcome-sound-bars i:nth-child(2){height:12px}.welcome-sound-bars i:nth-child(3){height:8px}.welcome-sound.is-playing .welcome-sound-bars i{animation:welcome-bar .65s ease-in-out infinite alternate}.welcome-sound.is-playing .welcome-sound-bars i:nth-child(2){animation-delay:.14s}.welcome-sound.is-playing .welcome-sound-bars i:nth-child(3){animation-delay:.28s}@keyframes welcome-bar{to{height:15px}}.welcome-enter{border:1px solid #eaffb3;background:linear-gradient(135deg,#e4f9a0,#b8d76b);box-shadow:0 8px 22px #c9e87a25;color:#17140f}.welcome-enter:hover{transform:translateY(-1px);filter:brightness(1.04)}.welcome-enter span{margin-left:6px;font-size:14px}.welcome-dismiss{display:inline-flex;align-items:center;gap:7px;margin-top:19px;color:#9c9488;font:10px var(--mono);cursor:pointer}.welcome-dismiss input{appearance:none;width:14px;height:14px;margin:0;border:1px solid #6a6256;border-radius:3px;background:#15120f}.welcome-dismiss input:checked{border-color:var(--accent);background:var(--accent);box-shadow:inset 0 0 0 3px #15120f}
body.welcome-open{overflow:hidden!important}
@media(max-width:560px){.welcome-screen{align-items:start;padding:calc(env(safe-area-inset-top) + 15px) 13px calc(env(safe-area-inset-bottom) + 15px)}.welcome-shell{margin:auto 0;padding:25px 20px 23px}.welcome-kicker{font-size:9px}.welcome-logo{margin:16px auto 11px}.welcome-copy{margin-top:22px}.welcome-copy p{font-size:11px;line-height:1.55}.welcome-notes{margin-top:21px}.welcome-notes div{font-size:9px;padding:8px 0}.welcome-actions{margin-top:21px;display:grid;grid-template-columns:1fr}.welcome-sound,.welcome-enter{width:100%;justify-content:center}.welcome-dismiss{margin-top:16px}}

/* The record may rotate, but its weight stays planted in one place. */
.hero-art{isolation:isolate}
.hero-art:after{content:'';position:absolute;z-index:0;right:4px;top:210px;width:264px;height:43px;border-radius:50%;background:#000a;filter:blur(15px);transform:rotate(-5deg);pointer-events:none}
.disc{z-index:1;box-shadow:none;touch-action:none;user-select:none;cursor:grab;--scratch-turn:0deg}
.disc.is-scratching{cursor:grabbing;animation-play-state:paused}
.hero-note,.orb{z-index:2}
@keyframes record-motion{0%,12%{transform:translateY(0) rotate(var(--scratch-turn))}30%{transform:translateY(-5px) rotate(calc(150deg + var(--scratch-turn)))}50%{transform:translateY(-8px) rotate(calc(720deg + var(--scratch-turn)))}62%,100%{transform:translateY(0) rotate(calc(720deg + var(--scratch-turn)))}}

/* The mark enters on the fourth second of the entrance sound. */
.welcome-logo{opacity:1;animation:welcome-logo-pulse 1.08s cubic-bezier(.18,.9,.3,1) 5.3s both}
@keyframes welcome-logo-pulse{0%,100%{transform:scale(1);filter:drop-shadow(0 13px 27px #0008)}45%{transform:scale(1.28);filter:drop-shadow(0 18px 35px #d7ef8d77)}}
.welcome-notes{max-width:555px;margin-top:31px}.welcome-notes div{grid-template-columns:34px minmax(0,1fr);gap:13px;padding:12px 0;font-size:12px;line-height:1.55}.welcome-notes b{font-size:11px}
@media(max-width:560px){.welcome-notes div{grid-template-columns:30px minmax(0,1fr);gap:10px;padding:10px 0;font-size:10.5px;line-height:1.5}.welcome-notes b{font-size:10px}}
.welcome-notes div{font-size:14px;line-height:1.58}.welcome-notes b{font-size:12px}
@media(max-width:560px){.welcome-notes div{grid-template-columns:32px minmax(0,1fr);gap:11px;padding:12px 0;font-size:13px;line-height:1.53}.welcome-notes b{font-size:11px}}

/* Mobile: the record is deliberately the top touch layer; the decorative
   orbs stay behind it and never steal the scratch gesture. */
.hero-art{z-index:3;pointer-events:none}.hero-art .disc{pointer-events:auto}.orb{z-index:0}.hero-note{z-index:2}

/* A restrained nudge at two o'clock invites the listener to discover the deck. */
.scratch-hint{position:absolute;z-index:4;right:-3px;top:3px;display:grid;justify-items:end;gap:1px;color:var(--accent);font:800 9px var(--mono);letter-spacing:.06em;text-transform:uppercase;filter:drop-shadow(0 3px 6px #0009);pointer-events:none;transform:rotate(-4deg)}.scratch-hint svg{width:64px;height:50px;overflow:visible}.scratch-hint path{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:.9}.scratch-hint span{padding:4px 7px;border:1px solid #d7ef8d55;border-radius:999px;background:#17140fd9}
@media(max-width:560px){.hero-art{opacity:1}.hero-art .disc{opacity:.5}.scratch-hint{right:5px;top:5px;font-size:8px}.scratch-hint svg{width:56px;height:44px}}

.scratch-hint[hidden]{display:none!important}.account-button.easter-unlocked{overflow:visible}.account-name{display:block}.account-crown{position:absolute;right:-7px;top:-9px;display:grid;place-items:center;width:18px;height:18px;border:1px solid #f8dda166;border-radius:50%;background:#201b13;color:#f2c65e;box-shadow:0 3px 11px #0008}.account-crown svg{width:12px;height:12px;fill:currentColor}

/* Achievements use the same warm studio hardware language as the player. */
.achievements-button{display:inline-flex;align-items:center;gap:7px;min-height:34px;border:1px solid #b28a4d;border-radius:5px;background:linear-gradient(145deg,#322818,#1e1912);box-shadow:inset 0 1px #ffe6a41a,0 5px 14px #0003;color:#f4d28a;padding:7px 10px;font:800 9px var(--mono);letter-spacing:.06em;cursor:pointer;transition:.18s ease}.achievements-button:hover{border-color:#f3ce77;background:#3a2d17;transform:translateY(-1px)}.achievements-button b{display:grid;place-items:center;min-width:17px;height:17px;border-radius:50%;background:#f2c65e;color:#21170b;font:800 9px var(--mono)}.achievements-dialog{width:min(650px,94vw);max-height:86vh;padding-right:20px;border-color:#756243;background:linear-gradient(145deg,#282116,#15120e);overflow:hidden}.achievements-dialog form{max-height:calc(86vh - 50px);overflow:auto;padding-right:9px}.achievements-dialog h3{margin-bottom:8px}.achievement-summary{display:flex;align-items:end;gap:9px;margin:20px 0 14px;padding:14px 16px;border:1px solid #5b4d38;border-radius:6px;background:radial-gradient(circle at 88% 0,#f2c65e18,transparent 38%),#19150f}.achievement-summary strong{color:#f3cd76;font-size:33px;line-height:.8;letter-spacing:-.06em}.achievement-summary span{display:grid;gap:1px;color:#d0c6b7;font:11px var(--mono)}.achievement-summary small{color:#8f8473;font:8px var(--mono);letter-spacing:.08em;text-transform:uppercase}.achievement-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.achievement-card{display:grid;grid-template-columns:39px minmax(0,1fr);gap:10px;min-height:104px;padding:12px;border:1px solid #3d372e;border-radius:6px;background:#17140f;color:#746c60;filter:saturate(.3)}.achievement-card.unlocked{border-color:#9cad67;background:radial-gradient(circle at 100% 0,#d7ef8d17,transparent 44%),#1c1c13;color:#ebe4d7;filter:none;box-shadow:inset 0 1px #ffffff0c}.achievement-icon{display:grid;place-items:center;align-self:start;width:38px;height:38px;border:1px solid currentColor;border-radius:50%;background:#0f0e0c;color:#746c60}.achievement-card.unlocked .achievement-icon{border-color:#d4ef88;background:#d7ef8d18;color:var(--accent);box-shadow:0 0 18px #d7ef8d1c}.achievement-icon svg,.achievement-unlock-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.achievement-card strong{display:block;color:inherit;font-size:11px}.achievement-card p{min-height:29px;margin:4px 0 7px;font:9px/1.35 var(--mono)}.achievement-progress{height:3px;overflow:hidden;border-radius:99px;background:#403a31}.achievement-progress i{display:block;height:100%;border-radius:inherit;background:#736b5b}.achievement-card.unlocked .achievement-progress i{background:linear-gradient(90deg,#e2fa9b,#b6d76c)}.achievement-card small{display:block;margin-top:5px;color:inherit;font:8px var(--mono);letter-spacing:.03em}.achievement-unlock{position:fixed;z-index:130;inset:0;display:grid;place-items:center;padding:22px;overflow:hidden;background:#100e0bdc;backdrop-filter:blur(8px);opacity:0;transition:opacity .28s ease}.achievement-unlock[hidden]{display:none!important}.achievement-unlock.is-open{opacity:1}.achievement-confetti,.achievement-confetti:before,.achievement-confetti:after{position:absolute;inset:-20%;content:'';pointer-events:none;background:radial-gradient(circle at 18% 25%,#d7ef8d 0 3px,transparent 4px),radial-gradient(circle at 73% 14%,#f3c16c 0 3px,transparent 4px),radial-gradient(circle at 83% 67%,#f39b67 0 3px,transparent 4px),radial-gradient(circle at 28% 78%,#d7ef8d 0 2px,transparent 3px),radial-gradient(circle at 52% 42%,#f3c16c 0 2px,transparent 3px);background-size:190px 180px;animation:achievement-confetti 2.8s linear infinite}.achievement-confetti:before{transform:rotate(47deg);animation-duration:4.1s;opacity:.7}.achievement-confetti:after{transform:rotate(-36deg);animation-duration:3.3s;opacity:.65}@keyframes achievement-confetti{to{background-position:170px 290px}}.achievement-unlock-card{position:relative;width:min(520px,100%);padding:clamp(32px,7vw,60px) 24px;border:1px solid #e6c87a77;background:radial-gradient(circle at 50% 0,#d7ef8d25,transparent 38%),linear-gradient(145deg,#272117,#13110e);box-shadow:0 30px 100px #000c,inset 0 1px #ffffff1a;text-align:center;transform:translateY(18px) scale(.95);transition:transform .42s cubic-bezier(.18,.9,.3,1)}.achievement-unlock.is-open .achievement-unlock-card{transform:none}.achievement-unlock-kicker{display:block;color:#f2c65e;font:800 10px var(--mono);letter-spacing:.2em}.achievement-unlock-icon{display:grid;place-items:center;width:66px;height:66px;margin:24px auto 17px;border:1px solid #d7ef8d88;border-radius:50%;background:#d7ef8d1c;color:var(--accent);box-shadow:0 0 33px #d7ef8d2b}.achievement-unlock-icon svg{width:34px;height:34px}.achievement-unlock h2{margin:0;color:#eee8dd;font-size:clamp(28px,5vw,48px);line-height:.95;letter-spacing:-.06em}.achievement-unlock h2 em{color:var(--accent);font:italic .92em var(--serif)}.achievement-unlock p{margin:17px auto 0;max-width:315px;color:#bdb3a4;font:11px/1.5 var(--mono)}.achievement-unlock button{min-height:43px;margin-top:27px;padding:0 15px;border:1px solid #eaffb3;border-radius:5px;background:linear-gradient(135deg,#e4f9a0,#b8d76b);box-shadow:0 8px 22px #c9e87a2e;color:#17140f;font:800 10px var(--mono);letter-spacing:.05em;cursor:pointer}.achievement-unlock button span{margin-left:6px;font-size:14px}@media(max-width:560px){.achievements-button{padding:7px 8px;font-size:8px}.achievements-dialog{width:min(650px,96vw);padding:22px 13px}.achievement-list{grid-template-columns:1fr}.achievement-card{min-height:93px}.achievement-unlock-card{padding:36px 19px}.achievement-unlock h2{font-size:35px}}
.achievement-guest{grid-column:1/-1;position:relative;overflow:hidden;padding:28px 24px;border:1px solid #80683d;border-radius:7px;background:radial-gradient(circle at 90% 0,#f2c65e18,transparent 35%),linear-gradient(140deg,#211b12,#15120e);text-align:center}.achievement-guest>span{display:grid;place-items:center;width:50px;height:50px;margin:0 auto 15px;border:1px solid #d9b965;border-radius:50%;background:#f2c65e13;color:#f2c65e}.achievement-guest>span svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.achievement-guest strong{display:block;color:#f1e9dc;font-size:20px;letter-spacing:-.04em}.achievement-guest p{max-width:400px;margin:10px auto 0;color:#bdb3a4;font:11px/1.6 var(--mono)}.achievement-guest button{min-height:42px;margin-top:20px;padding:0 14px;border:1px solid #eaffb3;border-radius:5px;background:linear-gradient(135deg,#e4f9a0,#b8d76b);color:#17140f;font:800 10px var(--mono);letter-spacing:.05em;cursor:pointer}.achievement-guest button i{margin-left:5px;font-size:14px;font-style:normal}@media(max-width:560px){.achievement-guest{padding:25px 17px}.achievement-guest p{font-size:10px}}
.achievement-guest-invitation{padding:16px;background:linear-gradient(145deg,#21180f,#15120e);text-align:left}.achievement-guest-invitation .guest-invitation-note{max-width:none;margin:1px 4px 14px;color:#e8dfd1;font:11px/1.5 var(--sans);text-align:left}.achievement-guest-invitation img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid #8c6632;border-radius:5px;box-shadow:0 12px 30px #0007}.achievement-guest-invitation button{display:block;width:min(280px,100%);margin:16px auto 2px;background:linear-gradient(135deg,#e5f99f,#b8d76b);box-shadow:0 8px 23px #c9e87a2e}.achievement-guest-invitation button:hover{filter:brightness(1.07);transform:translateY(-1px)}@media(max-width:560px){.achievement-guest-invitation{padding:11px}.achievement-guest-invitation .guest-invitation-note{font-size:10px}.achievement-guest-invitation button{margin-top:12px}}

.guest-easter-claim{z-index:131}.guest-easter-claim .achievement-unlock-card{border-color:#f2c65e88;background:radial-gradient(circle at 50% 0,#f2c65e25,transparent 40%),linear-gradient(145deg,#282014,#13110e)}.guest-easter-claim .achievement-unlock-icon{border-color:#f2c65e88;background:#f2c65e18;color:#f2c65e;box-shadow:0 0 33px #f2c65e25}.guest-easter-claim p{max-width:390px}.guest-easter-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:27px}.guest-easter-actions button{min-height:43px;margin:0;padding:0 15px;border-radius:5px;font:800 10px var(--mono);letter-spacing:.05em;cursor:pointer}.guest-easter-actions #guestEasterSignup{border:1px solid #eaffb3;background:linear-gradient(135deg,#e4f9a0,#b8d76b);box-shadow:0 8px 22px #c9e87a2e;color:#17140f}.guest-easter-actions #guestEasterLater{border:1px solid #665b49;background:#1a1712;color:#d6cec1}.guest-easter-actions #guestEasterLater:hover{border-color:#b9ad9b;color:#fff}@media(max-width:560px){.guest-easter-actions{display:grid;grid-template-columns:1fr}.guest-easter-actions button{width:100%}}

.party-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:30px}.party-actions button{min-height:43px;padding:0 16px;border-radius:5px;font:800 10px var(--mono);letter-spacing:.06em;cursor:pointer;transition:transform .18s ease,filter .18s ease,opacity .18s ease}.party-cancel{border:1px solid #8b8275;background:#1b1715;color:#ded6c8}.party-cancel:hover{border-color:#e9dfcf;transform:translateY(-1px)}.party-full{border:1px solid #efffbf;background:linear-gradient(135deg,#e4f9a0,#b8d76b);box-shadow:0 8px 22px #c9e87a36;color:#17140f}.party-full:hover{transform:translateY(-1px);filter:brightness(1.05)}.party-full span{margin-left:6px;font-size:14px}.party-full:disabled{cursor:default;opacity:.7;transform:none;filter:saturate(.5)}
.party-timer{display:grid;grid-template-columns:auto auto minmax(80px,1fr);align-items:center;gap:9px;max-width:280px;margin:23px auto -10px;color:#c9c0b3;font:800 8px var(--mono);letter-spacing:.09em}.party-timer[hidden]{display:none!important}.party-timer strong{color:var(--accent);font:12px var(--mono);letter-spacing:0}.party-timer i{display:block;height:3px;overflow:hidden;border-radius:99px;background:#51493d}.party-timer b{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#e4f9a0,#b8d76b);transition:width .16s linear}
@media(max-width:560px){.party-actions{display:grid;grid-template-columns:1fr;margin-top:23px}.party-actions button{width:100%}}

/* Keep the page behind the welcome still, while letting the welcome itself scroll vertically when needed. */
html.welcome-open,body.welcome-open{overflow:hidden!important;overscroll-behavior:none;touch-action:auto}
.welcome-screen{overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;align-items:safe center}
.welcome-screen .welcome-shell,.welcome-screen button,.welcome-screen input,.welcome-screen label{touch-action:manipulation}
@media(max-width:560px){.welcome-screen{align-items:safe center;overflow-x:hidden;overflow-y:auto;padding:calc(env(safe-area-inset-top) + 12px) 13px calc(env(safe-area-inset-bottom) + 12px)}}

/* The invitation appears only after the opening moment has had time to land. */
.welcome-actions,.welcome-dismiss{opacity:0;pointer-events:none;animation:welcome-invitation-in .55s cubic-bezier(.18,.9,.3,1) 3s both}
@keyframes welcome-invitation-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none;pointer-events:auto}}

/* Full-screen reward for the turntable secret. */
.easter-party{position:fixed;z-index:120;inset:0;display:grid;place-items:center;overflow:hidden;isolation:isolate;padding:24px;background:radial-gradient(circle at 19% 18%,#eaff8d 0 2%,transparent 23%),radial-gradient(circle at 83% 78%,#ff6a3d 0 3%,transparent 25%),linear-gradient(120deg,#160f22,#261113 46%,#11251e);opacity:0;transition:opacity .32s ease}.easter-party[hidden]{display:none!important}.easter-party.is-open{opacity:1}.easter-party:before,.easter-party:after{content:'';position:absolute;inset:-25%;z-index:-1;background:repeating-conic-gradient(from 0deg at 50% 50%,#d7ef8d00 0 7deg,#d7ef8d24 8deg 10deg,#f39b6720 11deg 14deg);animation:party-spin 4s linear infinite}.easter-party:after{animation-direction:reverse;animation-duration:7s;mix-blend-mode:screen;opacity:.56}.party-noise{position:absolute;inset:0;opacity:.18;mix-blend-mode:screen;background-image:radial-gradient(circle,#fff 0 1px,transparent 1.5px);background-size:19px 19px;animation:party-noise .18s steps(2) infinite}.party-card{position:relative;width:min(650px,100%);padding:clamp(36px,7vw,76px) clamp(20px,6vw,65px);border:1px solid #eaffb388;background:#120f13d9;box-shadow:0 25px 100px #000b,inset 0 1px #ffffff25;text-align:center;transform:translateY(20px) scale(.94);transition:transform .45s cubic-bezier(.18,.9,.3,1)}.easter-party.is-open .party-card{transform:none}.party-kicker,.party-congrats{display:block;font:800 10px var(--mono);letter-spacing:.24em;text-transform:uppercase}.party-kicker{color:var(--accent-2);margin-bottom:20px}.party-card strong{display:block;font-size:clamp(34px,6vw,76px);line-height:.9;letter-spacing:-.075em}.party-card strong em{color:var(--accent);font:italic .9em var(--serif)}.party-congrats{margin-top:21px;color:#e8dfd1}.party-bars{display:flex;justify-content:center;align-items:end;gap:6px;height:42px;margin-top:34px}.party-bars i{display:block;width:7px;border-radius:7px;background:var(--accent);box-shadow:0 0 18px #d7ef8d88;animation:party-bars .65s ease-in-out infinite alternate}.party-bars i:nth-child(1){height:17px}.party-bars i:nth-child(2){height:35px;animation-delay:.13s}.party-bars i:nth-child(3){height:23px;animation-delay:.27s}.party-bars i:nth-child(4){height:42px;animation-delay:.08s}.party-bars i:nth-child(5){height:28px;animation-delay:.34s}.party-bars i:nth-child(6){height:37px;animation-delay:.2s}.party-bars i:nth-child(7){height:18px;animation-delay:.4s}@keyframes party-spin{to{transform:rotate(360deg)}}@keyframes party-bars{to{height:8px;filter:hue-rotate(70deg)}}@keyframes party-noise{to{transform:translate(6px,-4px)}}
@media(max-width:560px){.toolbar{display:grid;grid-template-columns:37px minmax(0,1fr);align-items:center}.toolbar .library-view-toggle{grid-column:1;grid-row:1}.toolbar .search{grid-column:2;width:auto}.toolbar select{grid-column:1/-1;width:100%}.library-view-toggle{width:37px;height:39px}.library-list-view .track-grid>.track-card:not(.admin-list-row){grid-template-columns:64px minmax(0,1fr);min-height:66px;margin-bottom:6px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .cover{width:64px;height:66px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-body{padding:8px 9px;gap:2px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-title{font-size:12px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-actions{min-width:99px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .reaction-cluster{gap:2px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .share-track,.library-list-view .track-grid>.track-card:not(.admin-list-row) .add-playlist,.library-list-view .track-grid>.track-card:not(.admin-list-row) .reaction-button{width:23px;height:23px}}

/* On phones the full library navigation lives in a deliberate left drawer. */
.library-drawer-toggle,.library-drawer-scrim{display:none}
@media(max-width:600px), (hover:none) and (pointer:coarse){
  .library-drawer-toggle{display:flex;align-items:center;gap:7px;position:fixed;z-index:29;top:calc(env(safe-area-inset-top) + 87px);left:12px;width:auto;height:36px;margin:0;padding:0 10px;border:1px solid #5a5244;border-radius:5px;background:#1b1814eF;color:var(--accent);cursor:pointer;box-shadow:inset 0 1px #ffffff0c,0 7px 18px #0005}
  .library-drawer-toggle:hover,.library-drawer-toggle[aria-expanded="true"]{border-color:#93a95d;background:#d7ef8d14}
  .library-drawer-toggle:after{content:'MENÜ';font:800 9px var(--mono);letter-spacing:.1em}.library-drawer-icon{display:grid;gap:4px;width:15px}.library-drawer-icon i{display:block;height:1px;border-radius:99px;background:currentColor}.library-drawer-icon i:nth-child(2){width:10px}.library-drawer-icon i:nth-child(3){width:6px}
  .library-drawer-scrim{position:fixed;z-index:41;inset:0;display:block;background:#0009;opacity:0;transition:opacity .24s ease}.library-drawer-scrim[hidden]{display:none!important}.library-drawer-scrim.is-visible{opacity:1}
  .sidebar{display:block;position:fixed;z-index:42;top:0;bottom:0;left:0;width:min(86vw,340px);margin:0;padding:calc(env(safe-area-inset-top) + 96px) 17px calc(env(safe-area-inset-bottom) + 34px);border-right:1px solid #4c4438;background:linear-gradient(140deg,#211d18 0%,#16130f 68%);box-shadow:22px 0 55px #0008;overflow-y:auto;overscroll-behavior:contain;transform:translateX(-105%);transition:transform .28s cubic-bezier(.22,.8,.25,1);-webkit-overflow-scrolling:touch}
  body.library-drawer-open .sidebar{transform:translateX(0)}
  body.library-drawer-open{overflow:hidden!important;touch-action:pan-y}
  .sidebar .side-title:first-child{color:var(--accent-2)}
  .sidebar .filter-item,.sidebar .nav-item{min-height:39px}
  .sidebar .playlist-section{padding-bottom:22px}
}
@media(max-width:600px), (hover:none) and (pointer:coarse){
  .top-actions{gap:6px}.top-actions .status-dot,.top-actions #refresh{display:none}.library-drawer-toggle{height:34px;left:10px;top:calc(env(safe-area-inset-top) + 84px);padding:0 9px}.sidebar{width:min(88vw,330px);padding-top:calc(env(safe-area-inset-top) + 91px)}
  .view-title-row{gap:8px;flex-wrap:wrap}.playlist-context-share{width:29px;height:29px}.playlist-context-copy{min-height:29px;padding:6px 8px;font-size:8px}
}

/* Mobile chrome follows the iPhone safe area and gives the brand first position. */
@media(max-width:600px), (hover:none) and (pointer:coarse){
  .topbar{
    display:grid;
    grid-template-columns:minmax(0,1fr);

    justify-content:initial;
    align-items:start;
    gap:10px;
    width:100%;
    height:auto;
    min-height:0;
    padding:calc(env(safe-area-inset-top) + 18px) 13px 11px 44px;
    overflow:visible;
  }
  .brand{min-width:0;max-width:100%;gap:8px;white-space:nowrap}
  .brand-mark{width:32px;height:32px;flex-basis:32px}
  .brand-wordmark{min-width:0;gap:3px;align-items:baseline;white-space:nowrap}
  .brand-wordmark strong{font-size:clamp(14px,3.7vw,16px)}
  .brand-wordmark em{font-size:clamp(10px,2.8vw,12px)}
  .brand-wordmark i{padding:2px 4px;font-size:7px;transform:translate(-2px,-5px) rotate(-4deg)}
  .top-actions{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;
    align-items:center;
    gap:6px;
    width:100%;
    min-width:0;
    overflow:visible;
  }
  .top-actions>span:not(.status-dot),.top-actions .status-dot,.top-actions #refresh{display:none}
  .top-actions .admin-button,.top-actions .admin-users-button,.top-actions .reaction-report-button,.top-actions .admin-list-toggle,.top-actions .batch-delete,.top-actions .view-toggle{min-height:32px;padding:6px 8px;font-size:8px}
  .top-actions .achievements-button,.top-actions .inbox-button{min-height:32px;padding:5px 7px;font-size:8px}
  .top-actions .inbox-button{min-width:34px}
  .top-actions .account-button,.top-actions .logout-button{min-height:32px;padding:6px 8px;font-size:8px}
  .top-actions .logout-button:not([hidden]){display:inline-flex}
  .top-actions .account-button{min-width:0;max-width:100%}
  .top-actions .account-button .account-name{display:block;max-width:min(34vw,150px);overflow-wrap:anywhere;white-space:normal;line-height:1.15}
  .library-drawer-toggle{
    position:fixed;
    z-index:43;
    top:calc(env(safe-area-inset-top) + 16px);
    left:0;
    display:block;
    width:35px;
    height:88px;
    min-height:0;
    max-height:calc(100dvh - env(safe-area-inset-top) - 24px);
    margin:0;
    padding:0;
    border:1px solid #5a5244;
    border-left:0;
    border-radius:0 9px 9px 0;
    background:linear-gradient(155deg,#211e18f5,#171510f5);
    color:var(--accent);
    box-shadow:inset 0 1px #ffffff0c,5px 8px 20px #0006;
    touch-action:pan-y;
    cursor:grab;
  }
  .library-drawer-toggle:after{content:none}
  .library-drawer-toggle{transition:opacity .16s ease,visibility .16s linear,transform .16s ease}
  body.library-drawer-open .library-drawer-toggle{opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-5px)}
  .library-drawer-toggle:hover,.library-drawer-toggle[aria-expanded="true"]{border-color:#93a95d;background:linear-gradient(155deg,#2a3020f7,#191d15f7)}
  .library-drawer-toggle:active{cursor:grabbing}
  .library-drawer-grip{display:block;position:absolute;left:9px;top:12px;width:17px;height:2px;border-radius:99px;background:#9c927f;box-shadow:0 4px #9c927f,0 8px #9c927f}
  .library-drawer-label{display:block;position:absolute;left:-4px;top:37px;width:43px;height:10px;line-height:10px;transform:rotate(90deg);color:#d9e9aa;font:800 9px/10px var(--mono);letter-spacing:.17em;text-align:center}
  .library-drawer-arrow{display:grid;place-items:center;position:absolute;left:9px;bottom:6px;width:17px;height:17px;border:1px solid #667545;border-radius:50%;color:var(--accent);font-size:0;transition:transform .2s ease}
  .library-drawer-arrow:before{content:'';width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateX(-1px) rotate(-45deg)}
  .library-drawer-toggle[aria-expanded="true"] .library-drawer-arrow{transform:rotate(180deg)}
  .sidebar{width:min(88vw,330px);padding:calc(env(safe-area-inset-top) + 17px) 17px calc(env(safe-area-inset-bottom) + 28px);touch-action:pan-y}
}

@media(max-width:360px){
  .topbar{padding-right:9px;padding-left:44px;gap:8px}
  .brand{gap:6px}
  .brand-wordmark{gap:2px}
  .brand-wordmark strong{font-size:12px}
  .brand-wordmark em{font-size:8px}
  .brand-wordmark i{font-size:6px}
  .top-actions{gap:4px}
  .top-actions .account-button .account-name{max-width:min(38vw,128px)}
}

@media(prefers-reduced-motion:reduce){
  .library-drawer-toggle .library-drawer-arrow{transition:none}
}

/* Account inbox: a small, persistent archive for missed achievement moments. */
.inbox-button{display:inline-flex;align-items:center;gap:7px;min-height:34px;border:1px solid #697f96;border-radius:5px;background:linear-gradient(145deg,#18262f,#151a1e);box-shadow:inset 0 1px #d9efff0d,0 5px 14px #0003;color:#b8deee;padding:7px 10px;font:800 9px var(--mono);letter-spacing:.06em;cursor:pointer;transition:.18s ease}.inbox-button:hover{border-color:#9fc9d9;background:#1c303a;transform:translateY(-1px)}.inbox-button b{display:grid;place-items:center;min-width:17px;height:17px;border-radius:50%;background:#b8deee;color:#142027;font:800 9px var(--mono)}.inbox-dialog{width:min(610px,94vw);max-height:86vh;overflow:auto;border-color:#536d79;background:radial-gradient(circle at 92% 0,#76b9d01a,transparent 37%),linear-gradient(145deg,#1b262a,#121514)}.inbox-dialog h3{margin-bottom:8px}.inbox-list{display:grid;gap:8px;margin-top:19px}.inbox-message{display:grid;grid-template-columns:43px minmax(0,1fr);gap:11px;padding:12px;border:1px solid #3c5058;border-radius:6px;background:linear-gradient(130deg,#162024,#151512)}.inbox-message-icon{display:grid;place-items:center;width:40px;height:40px;border:1px solid #7da4b2;border-radius:50%;background:#9cd6e715;color:#b8deee}.inbox-message-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.inbox-message small{display:block;color:#8fb6c4;font:8px var(--mono);letter-spacing:.08em}.inbox-message strong{display:block;margin-top:4px;color:#f0ebe2;font-size:13px}.inbox-message p{margin:4px 0 9px;color:#a9aaa1;font:9px/1.45 var(--mono)}.inbox-message-actions{display:flex;gap:6px;flex-wrap:wrap}.inbox-message-actions button,.inbox-clear{min-height:27px;padding:5px 8px;border:1px solid #5a7280;border-radius:4px;background:#1c2a30;color:#c7e8f3;font:800 8px var(--mono);letter-spacing:.025em;cursor:pointer}.inbox-message-actions button:last-child{border-color:#5e5147;background:#211b17;color:#c7b6a5}.inbox-clear{display:block;width:100%;margin-top:11px;border-color:#80604d;background:#2a1d18;color:#f1b17e}.inbox-empty{padding:32px 12px;color:var(--muted);font:10px/1.5 var(--mono);text-align:center}
@media(max-width:560px){.inbox-button{min-width:34px;padding:7px 7px;font-size:0}.inbox-button b{font-size:8px}.inbox-dialog{width:min(610px,96vw);padding:22px 13px}.inbox-message{grid-template-columns:37px minmax(0,1fr);padding:10px}.inbox-message-icon{width:35px;height:35px}}

/* The inbox header gives the small account area a physical studio identity. */
.inbox-dialog{position:relative}.inbox-dialog .dialog-close{position:absolute;z-index:2;top:13px;right:13px;display:grid;place-items:center;width:30px;height:30px;margin:0;border:1px solid #627b85;border-radius:5px;background:#172126;color:#c4e0e8;font-size:19px;line-height:1}.inbox-hero{display:grid;grid-template-columns:minmax(0,1fr) 185px;gap:18px;align-items:center;margin:0 0 12px;padding-right:43px}.inbox-hero .eyebrow{margin-bottom:10px}.inbox-hero h3{margin:0;font-size:31px;letter-spacing:-.055em}.inbox-hero img{display:block;width:185px;height:104px;object-fit:cover;border:1px solid #6293a2;border-radius:6px;box-shadow:0 8px 24px #0007}.inbox-copy{max-width:455px;margin:0 0 4px;color:#cad3cf!important;font-size:11px!important;line-height:1.5!important}@media(max-width:560px){.inbox-dialog .dialog-close{top:11px;right:11px;width:28px;height:28px}.inbox-hero{grid-template-columns:minmax(0,1fr) 126px;gap:10px;padding-right:31px}.inbox-hero h3{font-size:26px}.inbox-hero img{width:126px;height:72px}.inbox-copy{font-size:10px!important}}

/* Admin users: compact insight cards, intentionally separate from public UI. */
.admin-users-button{border:1px solid #c18a5b;background:#e9a66c12;color:#f1b77f;border-radius:5px;padding:9px 11px;font:800 10px var(--mono);letter-spacing:.045em;cursor:pointer}.admin-users-button:hover{background:#e9a66c22}.admin-users-dialog{width:min(1000px,95vw);max-height:88vh;overflow:auto}.admin-users-dialog h4{margin:0;color:#e8dfd1;font:800 12px var(--mono);letter-spacing:.09em;text-transform:uppercase}.admin-user-totals{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:-4px 0 18px}.admin-user-totals span{padding:12px 10px;border:1px solid #494334;border-radius:5px;background:#191611;color:var(--muted);font:9px var(--mono);text-align:center}.admin-user-totals b{display:block;margin-bottom:4px;color:var(--accent);font:20px var(--sans)}.admin-insight-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.admin-insight-grid section{min-width:0;border:1px solid #443d31;border-radius:6px;background:#17140f;padding:13px}.admin-insight-grid h4{margin-bottom:10px}.admin-ranking{display:grid;gap:5px}.admin-ranking-row{display:grid;grid-template-columns:25px minmax(0,1fr) auto;gap:8px;align-items:center;padding:7px 0;border-bottom:1px solid #332e25}.admin-ranking-row:last-child{border-bottom:0}.admin-ranking-row>b{color:#f1b77f;font:10px var(--mono)}.admin-ranking-row strong,.admin-ranking-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-ranking-row strong{font-size:11px}.admin-ranking-row small{margin-top:2px;color:var(--muted);font:9px var(--mono)}.admin-ranking-row em{color:var(--accent);font:10px var(--mono);font-style:normal}.admin-ranking-empty{padding:15px 3px;color:var(--muted);font:10px var(--mono);text-align:center}.admin-users-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:24px 0 9px}.admin-users-heading small{max-width:510px;color:var(--muted);font:9px/1.45 var(--mono);text-align:right}.admin-users-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.admin-user-card{border:1px solid #4b4335;border-radius:6px;background:linear-gradient(145deg,#1d1913,#15120e);padding:13px}.admin-user-card header{display:flex;justify-content:space-between;gap:10px;align-items:start}.admin-user-card header p{margin:0 0 4px;color:#f1b77f;font:9px var(--mono);letter-spacing:.1em}.admin-user-card h5{margin:0;font:700 18px var(--sans)}.admin-user-status{flex:0 0 auto;margin-top:2px;padding:5px 7px;border:1px solid #4c4539;border-radius:999px;color:var(--muted);font:8px var(--mono)}.admin-user-status.unlocked{border-color:#819551;background:#d7ef8d12;color:var(--accent)}.admin-user-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:13px 0}.admin-user-metrics span{min-width:0;padding:7px 5px;border:1px solid #393329;border-radius:4px;background:#14110d;color:var(--muted);font:8px var(--mono);text-align:center}.admin-user-metrics b{display:block;overflow:hidden;text-overflow:ellipsis;color:#eee7dc;font:700 11px var(--sans);white-space:nowrap}.admin-user-genres small{display:block;margin-bottom:5px;color:#a99f90;font:8px var(--mono);text-transform:uppercase;letter-spacing:.08em}.admin-user-genres>div{display:flex;flex-wrap:wrap;gap:4px}.admin-user-genres span{padding:4px 6px;border:1px solid #3f382d;border-radius:999px;color:#bdb4a5;font:8px var(--mono)}.admin-user-genres b{color:var(--accent)}.admin-user-card footer{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:13px}.admin-user-card footer button{min-height:29px;padding:6px 8px;border:1px solid #68604d;border-radius:4px;background:#211d16;color:#eee7dc;font:800 8px var(--mono);letter-spacing:.02em;cursor:pointer}.admin-user-card footer button:hover{border-color:var(--accent);color:var(--accent)}.admin-user-card footer .admin-reset-user{margin-left:auto;border-color:#804d40;color:#f19a79}.admin-user-card footer small{color:var(--muted);font:8px var(--mono)}
@media(max-width:680px){.admin-users-dialog{width:calc(100vw - 18px);padding:23px 14px}.admin-insight-grid,.admin-users-list{grid-template-columns:1fr}.admin-users-heading{display:block}.admin-users-heading small{display:block;margin-top:7px;text-align:left}.admin-user-totals{gap:5px}.admin-user-totals span{padding:10px 5px}.admin-user-metrics{grid-template-columns:repeat(3,1fr)}}

/* Granular reset controls remain dense even when many accounts are listed. */
.admin-user-card footer{display:grid;gap:7px;margin-top:13px}.admin-user-card footer>button{justify-self:start}.admin-reset-strip{display:flex;flex-wrap:wrap;gap:4px;padding-top:7px;border-top:1px solid #383126}.admin-reset-strip button{min-height:24px;padding:4px 6px;color:#c8bcaa;font-size:7px}.admin-reset-strip .admin-reset-user{margin-left:auto;border-color:#804d40;color:#f19a79}
.admin-users-list{width:calc((100% - 10px)/2);grid-template-columns:minmax(0,1fr);gap:7px}
.admin-user-row{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;align-items:center;width:100%;min-height:76px;padding:13px;border:1px solid #4b4335;border-radius:6px;background:linear-gradient(145deg,#1d1913,#15120e);color:#eee7dc;text-align:left;transition:border-color .15s,background .15s}
.admin-user-summary{display:grid;grid-template-columns:minmax(0,1fr) auto 64px 10px;gap:8px;align-items:center;min-width:0;border:0;padding:0;background:none;color:inherit;text-align:left;cursor:pointer}.admin-user-summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:3px}
.admin-account-flags input{appearance:auto;width:16px;height:16px;padding:0;margin:0;accent-color:var(--accent);cursor:pointer}
.admin-users-heading{flex-wrap:wrap;align-items:center;gap:10px}.admin-users-heading small{margin-left:auto;order:3;flex-basis:100%;max-width:none;text-align:left}.admin-users-heading .admin-users-button{margin-right:auto}
.admin-account-flags{display:flex;flex-wrap:wrap;gap:24px;margin:18px 0}.admin-account-flags label{display:flex;align-items:center;gap:9px;margin:0;color:#eee7dc;font:700 12px var(--sans);cursor:pointer}.admin-create-user-dialog{width:min(460px,calc(100vw - 24px));max-height:88vh;overflow:auto}.admin-create-user-dialog label small{color:var(--muted);font-weight:400}.admin-account-controls form{margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid #383126}.admin-account-controls .dialog-error{color:#f19a79}
.admin-user-row:hover{border-color:#9ca960;background:#24241a}.admin-user-row:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.admin-user-row-name{min-width:0}.admin-user-row-name strong{display:block;overflow-wrap:anywhere;font:700 16px var(--sans)}
.admin-user-row small{display:block;color:var(--muted);font:8px/1.5 var(--mono)}.admin-user-row-name small{color:#f1b77f;margin-top:3px}.admin-user-row-date{font:10px/1.5 var(--mono)}
.admin-user-row-plays{text-align:right}.admin-user-row-plays b{display:block;color:var(--accent);font:20px var(--sans)}.admin-user-row-arrow{color:#f1b77f;font-size:24px}.admin-user-row.is-disabled{border-style:dashed}
.admin-user-details-dialog{width:min(510px,calc(100vw - 24px));max-height:88vh;overflow:auto}.admin-user-details-dialog h3{overflow-wrap:anywhere;margin-bottom:7px}.admin-user-details-meta{color:var(--muted);font:10px/1.7 var(--mono);margin:0 0 18px}
.admin-account-controls{margin-top:20px;padding-top:18px;border-top:1px solid #4b4335}.admin-account-controls h4{color:#e8dfd1;font:800 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;margin:0 0 9px}.admin-account-controls p,.admin-account-controls small{color:var(--muted);font:10px/1.6 var(--mono)}.admin-account-controls small{display:block;margin-top:10px}.admin-account-controls>div{display:flex;flex-wrap:wrap;gap:8px}
.admin-account-controls button{min-height:38px;padding:9px 11px;border:1px solid #68604d;border-radius:4px;background:#211d16;color:#eee7dc;font:800 9px var(--mono);cursor:pointer}.admin-account-controls button:hover{border-color:var(--accent);color:var(--accent)}.admin-account-controls .admin-account-delete{border-color:#804d40;color:#f19a79}.admin-account-controls button:disabled{opacity:.4;cursor:not-allowed}.admin-account-controls button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:680px){.admin-users-list{width:100%}.admin-user-row{gap:8px;padding:11px}.admin-user-summary{grid-template-columns:minmax(0,1fr) auto 46px 8px;gap:6px}.admin-user-row-name strong{font-size:13px}.admin-user-row-date{font-size:8px}.admin-user-row-plays small{font-size:7px}.admin-user-details-dialog,.admin-create-user-dialog{padding:23px 14px}.admin-account-controls>div{display:grid;grid-template-columns:1fr}.admin-users-heading{display:flex}}

/* Clear, asymmetric hand glyphs make the two reactions unmistakable at a glance. */
:root{--dislike-hand-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 3H6c-.83 0-1.54.5-1.84 1.22l-3.02 7.05C1.05 11.5 1 11.74 1 12v2c0 1.1.9 2 2 2h6.31l-.95 4.57c-.1.5.05 1.01.41 1.37L9.83 23l6.58-6.59c.37-.36.59-.86.59-1.41V5c0-1.1-.9-2-2-2Zm4 0v12h4V3h-4Z'/%3E%3C/svg%3E")}.reaction-button svg{width:17px;height:17px}.reaction-button.like.active{border:1px solid #c9eb77;background:#d7ef8d24;color:#dfffa0;box-shadow:0 0 0 2px #d7ef8d0d}.reaction-button.dislike:hover{background:#f0655d14;color:#ff837a}.reaction-button.dislike.active{border:1px solid #f07169;background:#f0655d20;color:#ff8178;box-shadow:0 0 0 2px #f0655d0d}.reaction-button.reaction-drop{color:#ff8178;animation:reaction-dislike .66s cubic-bezier(.22,.82,.32,1) both}.reaction-button.reaction-drop:before,.reaction-button.reaction-drop:after{content:'';position:absolute;z-index:-1;width:15px;height:15px;background:#ff746d;-webkit-mask:var(--dislike-hand-mask) center/contain no-repeat;mask:var(--dislike-hand-mask) center/contain no-repeat;animation:dislike-stamps .66s cubic-bezier(.22,.82,.32,1) both}.reaction-button.reaction-drop:before{animation-delay:.03s}.reaction-button.reaction-drop:after{animation-delay:.16s;opacity:.78}@keyframes reaction-dislike{0%,100%{transform:translateY(0) rotate(0)}22%{transform:translateY(4px) rotate(7deg)}48%{transform:translateY(-2px) rotate(-5deg)}72%{transform:translateY(3px) rotate(4deg)}}@keyframes dislike-stamps{0%{opacity:0;transform:translateY(-9px) scale(.45)}24%{opacity:1}100%{opacity:0;transform:translateY(15px) scale(.84)}}.reaction-report-row.dislike .reaction-report-icon,.reaction-report-row.dislike>b{color:#ff8178}

/* Guests do not see the account inbox; its artwork leads directly into the messages. */
.inbox-button[hidden]{display:none}
.inbox-hero{display:block;margin:0 0 12px;padding-right:43px}
.inbox-banner{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;margin:0 0 12px;border:1px solid #6293a2;border-radius:6px;box-shadow:0 8px 24px #0007}
.inbox-list{margin-top:0}
@media(max-width:560px){.inbox-dialog .dialog-close{top:11px;right:11px}.inbox-hero{padding-right:31px}}
.inbox-button.has-unread{animation:inbox-new-mail 13.4s ease-in-out infinite}
.inbox-message-unread{border-color:#55727c;box-shadow:inset 2px 0 #b8deee55}
@keyframes inbox-new-mail{0%,5%,10%,100%{box-shadow:inset 0 1px #d9efff0d,0 5px 14px #0003;filter:none}6.5%,8.5%{box-shadow:0 0 0 2px #b8deee22,0 0 17px #b8deee2b;filter:brightness(1.12)}}
@media(prefers-reduced-motion:reduce){.inbox-button.has-unread{animation:none;border-color:#9fc9d9;box-shadow:0 0 0 2px #b8deee1c}}

/* In a phone's landscape view, use the available width for the regular library navigation. */
@media (orientation:landscape) and (min-width:700px) and (max-height:600px){
  .library-drawer-toggle,.library-drawer-scrim{display:none!important}
  .layout{grid-template-columns:minmax(150px,22vw) 26px minmax(0,1fr);gap:10px;padding-top:26px}
  .sidebar{display:block!important;position:sticky;z-index:1;top:8px;align-self:start;width:auto;max-height:calc(100dvh - 110px);margin:0;padding:0 8px 16px 0;border-right:1px solid var(--line);background:none;box-shadow:none;overflow-y:auto;overscroll-behavior:contain;transform:none!important;transition:none;-webkit-overflow-scrolling:touch}
  .quick-index{display:block;grid-column:2;position:sticky;top:8px;align-self:start;width:26px;margin:0;padding:0;border-left:1px solid #332d25;border-right:1px solid #332d25;z-index:1}
  .quick-index-buttons.is-alphabet button{height:15px;font-size:10px;line-height:15px}
  .content{grid-column:3;min-width:0}
  body.library-drawer-open{overflow:visible!important;touch-action:auto}
  body.time-sort .layout{grid-template-columns:minmax(150px,22vw) minmax(0,1fr);gap:10px}
  body.time-sort .quick-index{display:none}
  body.time-sort .content{grid-column:2}
}

/* Player reactions and sharing: compact controls with a dedicated release-date label. */
.player-controls{gap:clamp(10px,1.4vw,20px)}
.player-reaction{position:relative;display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid transparent;border-radius:50%;background:transparent;color:var(--text);cursor:pointer;transition:background .18s,color .18s,border-color .18s,transform .18s}
.player-reaction svg,.player-share svg{width:17px;height:17px;fill:currentColor;display:block}
.player-reaction:hover{background:#ffffff0b;color:var(--text)}
.player-reaction.like.active{border-color:#c9eb77;background:#d7ef8d24;color:#dfffa0;box-shadow:0 0 0 2px #d7ef8d0d}
.player-reaction.dislike.active{border-color:#f07169;background:#f0655d20;color:#ff8178}
.player-reaction.dislike:hover:not(.active){border-color:#82766a;background:#ffffff0b;color:var(--text)}
.player-reaction:disabled{opacity:.4;cursor:default}
.player-share:disabled{opacity:.4;cursor:default}
.progress-end,.full-progress-end{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 auto;min-width:38px}
.player-share{display:grid;place-items:center;width:26px;height:23px;padding:0;border:0;background:transparent;color:var(--accent-2);cursor:pointer;opacity:.88}
.player-share:hover{color:var(--accent);transform:translateY(-1px)}
.progress-end>span,.full-progress-end>span{font:10px var(--mono);color:var(--muted);white-space:nowrap}
.release-date-label{font:9px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent-2)}
.full-artist{display:flex;gap:14px;align-items:center}
.full-artist-name{color:var(--muted)}
.full-release-date{font:11px var(--mono);color:#a79e91;white-space:nowrap}
.full-release-date small{font:9px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent-2)}
.full-bottom{gap:8px}
.card-date:before{content:'Release Date · ';color:#786f63}
.player-controls #playerDislike{order:0}
.player-controls #prev{order:1}
.player-controls #play{order:2}
.player-controls #next{order:3}
.player-controls #playerLike{order:4}
.full-controls{gap:clamp(10px,2vw,25px)}
.full-controls #fullDislike{order:0}
.full-controls #fullPrev{order:1}
.full-controls #fullPlay{order:2}
.full-controls #fullNext{order:3}
.full-controls #fullLike{order:4}
@media(max-width:900px){.player-end{display:none!important}.player{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:12px;padding:0 14px}.player-center{min-width:0}.player-controls{gap:clamp(5px,1.4vw,12px)}.player-reaction{width:28px;height:28px}.progress-line{gap:5px}.progress-line span,.progress-end>span{font-size:9px}}
@media(max-width:560px){.player{height:108px;display:block;padding:0 13px}.now-playing{position:absolute;left:13px;right:12px;top:9px;gap:9px}.mini-cover{width:38px;height:38px}.now-playing small{font-size:8px;margin-bottom:2px}.now-playing strong{max-width:calc(100vw - 185px);font-size:11px}.now-playing span{max-width:calc(100vw - 185px);font-size:9px;margin-top:1px}.player-center{position:absolute;left:10px;right:10px;bottom:7px;width:auto;max-width:none}.player-controls{position:absolute;right:4px;top:-61px;gap:clamp(1px,1vw,5px)}.player-controls button:not(.play-button){display:grid;place-items:center;font-size:14px}.player-controls #prev,.player-controls #next{width:25px;height:30px}.player-controls .play-button{width:32px;height:32px}.player-reaction{width:25px;height:27px}.player-reaction svg{width:15px;height:15px}.progress-line{display:flex;margin-top:0;gap:5px}.progress-line input{min-width:0}.progress-line>span{font-size:8px}.progress-end{min-width:35px}.player-share{height:18px;width:24px}.progress-end>span{font-size:8px}.player-end{display:none!important}}
@media(max-width:360px){.now-playing strong,.now-playing span{max-width:calc(100vw - 168px)}.player-controls{gap:0}.player-controls #prev,.player-controls #next{width:21px}.player-reaction{width:23px}.player-share{width:21px}.progress-end{min-width:31px}}
@media(max-width:900px){.full-bottom .volume-icon,.full-bottom #fullVolume,.player-end #mute,.player-end #volume{display:none!important}}
@media(max-width:560px){.full-artist{gap:6px 11px;flex-wrap:wrap}.full-release-date{font-size:10px}.full-release-date small{font-size:8px}}

/* Remove a song only from the playlist currently being viewed. */
.track-grid .remove-from-playlist{display:grid;place-items:center;width:29px;height:29px;padding:0;border:1px solid #785148;border-radius:50%;background:#281b18;color:#f09a88;font:700 20px/1 var(--sans);cursor:pointer;transition:background .16s,border-color .16s,color .16s,transform .16s}
.track-grid .remove-from-playlist:hover{border-color:#f09a88;background:#f0655d20;color:#ffb2a2;transform:translateY(-1px)}
.track-grid .remove-from-playlist:disabled{opacity:.5;cursor:wait;transform:none}
.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-actions:has(.remove-from-playlist){min-width:140px}
@media(max-width:560px){.track-grid .remove-from-playlist{width:25px;height:25px;font-size:18px}.library-list-view .track-grid>.track-card:not(.admin-list-row) .card-actions:has(.remove-from-playlist){min-width:122px}}

/* A private playlist shelf with the same four-cover collage used by sharing. */
.playlist-heading-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.playlist-heading-row .playlist-heading{margin:0}
.playlist-manage-trigger{flex:0 0 auto;padding:5px 7px;border:1px solid #514a3d;border-radius:4px;background:#1b1814;color:#bdb3a4;font:8px var(--mono);letter-spacing:.015em;cursor:pointer;transition:.16s ease}
.playlist-manage-trigger:hover{border-color:#9eaf69;background:#d7ef8d10;color:var(--accent)}
.playlist-manage-trigger[hidden]{display:none!important}
.playlist-manage-dialog{width:min(940px,95vw);max-height:88vh;overflow:auto;border-color:#655a46;background:radial-gradient(circle at 92% 0,#d7ef8d0c,transparent 38%),linear-gradient(145deg,#211e18,#14120f)}
.playlist-manage-dialog h3{margin-bottom:7px}
.playlist-manage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}
.playlist-manage-card{min-width:0;overflow:hidden;border:1px solid #40392f;border-radius:7px;background:linear-gradient(145deg,#211e19,#171511);transition:border-color .18s,transform .18s,box-shadow .18s}
.playlist-manage-card:hover{border-color:#726b55;transform:translateY(-2px);box-shadow:0 12px 26px #0005}
.playlist-manage-open{display:block;width:100%;padding:9px;border:0;background:transparent;color:var(--text);text-align:left;cursor:pointer}
.playlist-manage-cover{width:100%;height:auto;aspect-ratio:1.32;margin-bottom:10px;border:1px solid #50483b}
.playlist-manage-cover img,.playlist-manage-cover>span{min-width:0;min-height:0}
.playlist-manage-info{display:flex;align-items:baseline;justify-content:space-between;gap:8px;min-width:0}
.playlist-manage-info strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.playlist-manage-info small{flex:0 0 auto;color:var(--accent-2);font:9px var(--mono)}
.playlist-manage-arrow{display:none}
.playlist-manage-actions,.playlist-manage-inline>div,.playlist-manage-confirm>div{display:flex;gap:7px;padding:0 9px 9px}
.playlist-manage-actions button,.playlist-manage-inline button,.playlist-manage-confirm button{min-height:31px;padding:6px 9px;border:1px solid #565043;border-radius:4px;background:#211d17;color:#ded6c9;font:800 8px var(--mono);cursor:pointer;transition:.16s ease}
.playlist-manage-actions button:hover,.playlist-manage-inline button:hover,.playlist-manage-confirm button:hover{border-color:var(--accent);color:var(--accent)}
.playlist-manage-actions .playlist-manage-delete,.playlist-manage-confirm .playlist-manage-delete-confirm{margin-left:auto;border-color:#68453d;color:#e89583}
.playlist-manage-actions .playlist-manage-delete:hover,.playlist-manage-confirm .playlist-manage-delete-confirm:hover{border-color:#e89583;background:#f0655d18;color:#ffb2a2}
.playlist-manage-inline{padding:0 9px 10px}
.playlist-manage-inline label{display:block;margin-bottom:5px;color:var(--accent-2);font:8px var(--mono);text-transform:uppercase;letter-spacing:.07em}
.playlist-manage-inline input{width:100%;height:36px;margin-bottom:7px;padding:0 9px;border:1px solid #6b624f;border-radius:4px;outline:0;background:#12100d;color:var(--text);font:11px var(--sans)}
.playlist-manage-inline input:focus{border-color:var(--accent);box-shadow:0 0 0 2px #d7ef8d16}
.playlist-manage-inline button:disabled{opacity:.5;cursor:wait}
.playlist-manage-inline .playlist-manage-save{border-color:#d9ef94;background:linear-gradient(135deg,#e2f59b,#b5d568);color:#17140f}
.playlist-manage-feedback{display:block;min-height:12px;margin-top:5px;color:#f0a088;font:8px var(--mono)}
.playlist-manage-confirm{padding:1px 9px 10px}
.playlist-manage-confirm>strong{display:block;margin:0 0 9px;color:#f0b198;font-size:10px}
.playlist-manage-confirm>div{padding:0}
.playlist-manage-empty{grid-column:1/-1;padding:32px 15px;border:1px dashed #514a3d;border-radius:6px;color:var(--muted);font:11px/1.55 var(--mono);text-align:center}
.playlist-manage-create{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;margin:7px 0 2px;padding:8px 13px;appearance:none;border:1px solid #d9ef94;border-radius:5px;background:linear-gradient(135deg,#e2f59b,#b5d568);box-shadow:0 5px 18px #c2e66f20;color:#17140f;font:800 9px var(--mono);letter-spacing:.035em;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease}
.playlist-manage-create:hover{transform:translateY(-1px);box-shadow:0 8px 22px #c2e66f30}
.playlist-manage-inline button,.playlist-manage-actions button,.playlist-manage-confirm button{appearance:none}
.playlist-manager-carousel{position:relative;display:block!important;overflow:hidden;background:#14120f}
.playlist-manager-frame{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:2px;opacity:0;transform:translateX(10px);transition:opacity .55s ease,transform .55s ease;pointer-events:none}
.playlist-manager-frame.is-active{opacity:1;transform:translateX(0)}
.playlist-manager-frame>img,.playlist-manager-frame>span{display:flex;width:100%;height:100%;min-width:0;min-height:0;align-items:center;justify-content:center;object-fit:cover;background:linear-gradient(135deg,#28241d,#171511);color:#d7ef8d;font-size:22px}
@media(prefers-reduced-motion:reduce){.playlist-manage-create,.playlist-manager-frame{transition:none}}
@media(max-width:680px){.playlist-manage-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.playlist-manage-dialog{width:calc(100vw - 18px);padding:25px 13px}.playlist-manage-cover{aspect-ratio:1.2}}
@media(max-width:390px){.playlist-manage-grid{grid-template-columns:1fr}.playlist-manage-card{display:grid;grid-template-columns:108px minmax(0,1fr);align-items:center}.playlist-manage-open{position:relative;grid-column:1;grid-row:1/3;padding:8px}.playlist-manage-cover{width:100%;aspect-ratio:1;margin:0}.playlist-manage-info{grid-column:2;display:block;padding:0 8px}.playlist-manage-info strong,.playlist-manage-info small{display:block;white-space:normal}.playlist-manage-info small{margin-top:5px}.playlist-manage-actions,.playlist-manage-inline,.playlist-manage-confirm{grid-column:2;padding:7px 8px 9px}.playlist-manage-actions{flex-wrap:wrap}.playlist-manage-actions button{padding:6px}.playlist-heading-row{gap:4px}.playlist-manage-trigger{padding:5px;font-size:7px}}

/* Library list: clear title hierarchy and compact, separated release details. */
.library-list-view .track-grid > .track-card:not(.admin-list-row) .card-body{column-gap:20px;row-gap:5px;padding-left:16px}
.library-list-view .track-grid > .track-card:not(.admin-list-row) .card-title{font-size:22px;line-height:1.2;letter-spacing:-.025em}
.library-list-view .track-grid > .track-card:not(.admin-list-row) .card-meta{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:6px 12px;max-width:none;min-width:0}
.library-list-view .track-grid > .track-card:not(.admin-list-row) .card-artist{flex:0 1 auto;max-width:100%;font:16px/1.35 var(--sans);color:#c0b7aa;order:0}
.library-list-view .track-grid > .track-card:not(.admin-list-row) .card-duration{order:1;flex:0 0 auto;font:11px/1.5 var(--mono);color:var(--accent-2);padding-left:12px;border-left:1px solid #655743;font-variant-numeric:tabular-nums}
.library-list-view .track-grid > .track-card:not(.admin-list-row) .card-duration:before{content:'Abspieldauer ';color:#a79c8c}
.library-list-view .track-grid > .track-card:not(.admin-list-row) .card-date{display:block;order:2;flex:0 0 auto;font:11px/1.5 var(--mono);color:#c0b7aa;padding-left:12px;border-left:1px solid #655743}
.library-list-view .track-grid > .track-card:not(.admin-list-row) .card-date:before{content:'Release Date ';color:#a79c8c}
@media(max-width:1100px){
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-artist{flex-basis:100%}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-duration{padding-left:0;border-left:0}
}
@media(max-width:560px){
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-body{column-gap:9px;row-gap:5px;padding:10px 9px 10px 12px}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-title{font-size:20px;line-height:1.2}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-artist{font-size:15px}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-meta{gap:5px 8px}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-date,
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-duration{font-size:10px}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-duration:before{content:'Dauer '}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-date{padding-left:8px}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .cover{align-self:center}
}
@media(max-width:560px){
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-body{grid-template-rows:auto auto auto auto}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-title{grid-column:1/-1}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-actions{grid-row:2/4}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-meta{display:contents}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-artist{grid-column:1;grid-row:2}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-duration{grid-column:1;grid-row:3;margin-top:3px}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-date{grid-column:1/-1;grid-row:4;padding-left:0;border-left:0}
  .library-list-view .track-grid > .track-card:not(.admin-list-row) .card-date:before{content:'Release Date · '}
}

/* Studio Post: private correspondence and news from the studio. */
.studio-feedback{display:flex;align-items:center;gap:9px;width:100%;margin-top:20px;padding:13px 10px;border:1px solid #536972;border-radius:6px;background:linear-gradient(120deg,#1e3036,#171c1d);color:#c4e0e8;text-align:left;font:600 12px var(--sans);cursor:pointer}
.studio-feedback>span:first-child{font-size:20px;color:#a8ced9}.studio-feedback small{display:block;margin-top:4px;font:9px var(--mono);color:#91a5ab}.studio-feedback b{margin-left:auto;color:var(--accent)}.studio-feedback:hover{border-color:#9bc0cc;background:#253b40}
.inbox-dialog{width:min(760px,94vw);scrollbar-width:thin;scrollbar-color:#66838b #121a1d;scrollbar-gutter:stable}.inbox-banner{aspect-ratio:16/9;object-fit:cover;object-position:center;margin-bottom:20px}.inbox-dialog::-webkit-scrollbar{width:10px}.inbox-dialog::-webkit-scrollbar-track{margin:8px 2px;border-radius:999px;background:#11191b}.inbox-dialog::-webkit-scrollbar-thumb{min-height:42px;border:2px solid #11191b;border-radius:999px;background:linear-gradient(180deg,#78949b,#405a61)}.inbox-dialog::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#a1c4cb,#587780)}.inbox-dialog::-webkit-scrollbar-corner{background:#11191b}.inbox-hero .eyebrow{font-size:9px;color:#9cbfc9;letter-spacing:.13em}
.inbox-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px}.inbox-folders{display:flex;gap:3px;margin-right:auto;padding:3px;background:#101a1e;border:1px solid #3f545b;border-radius:6px}
.inbox-folders button,.message-new{min-height:34px;padding:8px 11px;border:1px solid transparent;border-radius:4px;background:transparent;color:#9cafb5;font:600 11px var(--sans);cursor:pointer}.inbox-folders button[aria-pressed=true]{background:#2b4149;color:#e0f0f4;box-shadow:0 2px 8px #0003}.message-new{border-color:#93ac65;background:#d7ef8d14;color:var(--accent)}.message-new:hover{background:#d7ef8d28}
.inbox-search{display:block;color:#9db3ba;font:10px var(--mono);margin-bottom:16px}.inbox-search input{display:block;margin:7px 0 0;width:100%;height:38px;background:#121c20;border-color:#3d535a;font:12px var(--sans)}
.inbox-message{padding:15px;gap:13px}.inbox-message strong{font-size:17px;line-height:1.3;overflow-wrap:anywhere}.inbox-message small{font-size:9px;line-height:1.6}.inbox-message .inbox-person{display:block;margin:4px 0 7px;color:#9ac0cc;font:11px var(--sans)}.inbox-message p{font:13px/1.6 var(--sans);color:#bbc4c3;overflow-wrap:anywhere}.inbox-preview{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-wrap}.inbox-message-actions button{min-height:32px;font:600 10px var(--sans);padding:7px 10px}.inbox-message-actions button:first-child{border-color:#8ab0ba;background:#b8deee12;color:#d8edf4}
.message-compose-dialog,.message-thread-dialog{width:min(650px,94vw);max-height:88dvh;overflow:auto;border-color:#536d79;background:linear-gradient(145deg,#1d2a2e,#131919)}.message-compose-dialog h3,.message-thread-dialog h3{font-size:30px;margin-bottom:12px;overflow-wrap:anywhere}.message-compose-dialog label{display:block;margin:16px 0 7px;color:#adc8cf;font:11px var(--mono)}.message-compose-dialog select{width:100%;height:42px;background:#142125;border-color:#49636d;color:#d6e4e7;font:13px var(--sans)}.message-compose-dialog input{margin-bottom:0;font:14px var(--sans);background:#121c20;border-color:#435a61}.message-compose-dialog textarea{width:100%;resize:vertical;min-height:150px;max-height:40vh;padding:12px;border:1px solid #435a61;border-radius:5px;background:#121c20;color:#efece5;font:14px/1.6 var(--sans);outline:none}.message-compose-dialog textarea:focus,.message-compose-dialog input:focus{border-color:#a1cbd6;box-shadow:0 0 0 2px #b8deee12}.message-compose-footer{display:flex;align-items:center;gap:15px;margin-top:12px}.message-compose-footer>span{flex:0 0 auto;color:#92a9b0;font:10px var(--mono)}.message-compose-footer .primary-button{width:auto;flex:1;margin:0;background:var(--accent)}
.message-recipient-picker{margin-top:14px;border:1px solid #49636d;border-radius:5px;background:#121c20;padding:10px 12px}.message-recipient-picker summary{display:flex;justify-content:space-between;gap:8px;cursor:pointer;color:#d6e4e7;font:13px var(--sans)}.message-recipient-picker summary:before{content:'⌄';color:#94bbc6}.message-recipient-picker summary span{margin-left:auto;font-size:11px;color:var(--accent)}#messageRecipientList{max-height:190px;overflow:auto;padding-top:8px}.message-compose-dialog .message-recipient{display:flex;align-items:center;gap:9px;margin:0;padding:8px 2px;font:13px var(--sans)}.message-recipient input{width:16px;height:16px;flex:0 0 auto;accent-color:var(--accent)}.message-recipient small{margin-left:auto;color:#9cacaa;font:10px var(--mono)}.message-thread-entry{margin:12px 0;padding:16px;border:1px solid #45606a;border-radius:7px;background:#16262c}.message-thread-entry.message-own{margin-left:24px;border-color:#66734d;background:#253021}.message-thread-entry small{display:block;color:#9dc0cc;font:10px/1.5 var(--mono)}.message-thread-entry strong{display:block;margin-top:8px;font-size:16px;overflow-wrap:anywhere}.message-thread-entry p{white-space:pre-wrap;overflow-wrap:anywhere;font:14px/1.7 var(--sans);color:#d4dcd7;margin-bottom:0}.message-thread-dialog .primary-button{margin-top:12px}
.message-new[hidden],.message-compose-dialog [hidden],.message-thread-dialog [hidden],.message-recipient[hidden]{display:none!important}
@media(max-width:560px){.inbox-dialog{padding:24px 13px}.inbox-toolbar{gap:7px}.inbox-folders{width:100%;margin-right:0}.inbox-folders button{flex:1}.message-new{flex:1}.inbox-message strong{font-size:16px}.inbox-message{padding:12px}.message-compose-dialog,.message-thread-dialog{padding:22px 16px}.message-compose-dialog h3,.message-thread-dialog h3{font-size:26px}.message-compose-footer{flex-wrap:wrap}.message-compose-footer .primary-button{flex-basis:100%}.message-thread-entry.message-own{margin-left:10px}.message-recipient-picker summary{font-size:12px}}

.discovery-nav-item{align-items:flex-start;min-height:0;padding-top:8px;padding-bottom:8px}.discovery-nav-item>span:first-child{flex:0 0 15px;color:var(--accent);font-size:15px;text-align:center}.discovery-nav-item .all-titles-copy{font-size:11px}.discovery-nav-item .all-titles-copy small{white-space:normal;line-height:1.35}.discovery-nav-item.active .all-titles-copy small,.discovery-nav-item:hover .all-titles-copy small{color:#a9b87c}.discovery-intro{grid-column:1/-1;margin:0 0 8px;padding:13px 15px;border:1px solid #453f33;border-left:2px solid var(--accent);border-radius:5px;background:linear-gradient(110deg,#d7ef8d0c,transparent 65%);color:var(--muted);font-size:12px;line-height:1.6}.discovery-intro strong{display:block;margin-bottom:3px;color:var(--text);font-size:14px}.discovery-badge{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:4px 6px;border:1px solid #d7ef8d75;border-radius:3px;background:#15170fdd;color:var(--accent);font:8px/1.2 var(--mono);backdrop-filter:blur(4px)}.library-list-view .discovery-badge{padding:3px 4px;font-size:7px}.discovery-empty{grid-column:1/-1;padding:28px 20px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--muted);text-align:center}.discovery-empty h3{margin:0 0 8px;color:var(--text);font-size:19px}.discovery-empty p{max-width:540px;margin:0 auto 12px;line-height:1.6}.discovery-empty button{border:1px solid #8da856;border-radius:4px;background:#d7ef8d;color:#1b1a12;padding:9px 14px;font:700 11px var(--sans);cursor:pointer}@media(max-width:560px){.discovery-nav-item{padding:7px 8px}.discovery-intro{padding:10px 11px;font-size:11px}.discovery-badge{font-size:7px}}

/* Track replacement and editorial NEW marker. */
.edit-new-song-option{display:flex;align-items:center;gap:11px;margin:2px 0 16px;padding:11px 12px;border:1px solid #514b3e;border-radius:5px;background:#191611;cursor:pointer}
.edit-new-song-option>input{width:18px;height:18px;flex:0 0 auto;margin:0;accent-color:var(--accent)}
.edit-new-song-option>span{display:grid;gap:3px}
.edit-new-song-option strong{color:var(--text);font:700 12px var(--sans)}
.edit-new-song-option small{color:var(--muted);font:9px/1.4 var(--mono)}
.audio-replace-clear{display:block;margin:-7px 0 15px auto;padding:6px 9px;border:1px solid #514b3e;border-radius:4px;background:#201c16;color:var(--muted);font:9px var(--mono);cursor:pointer}
.audio-replace-clear:hover{border-color:var(--accent);color:var(--accent)}
.audio-replace-clear[hidden]{display:none!important}
.card-title{display:flex;align-items:center;gap:7px}
.card-title-text{flex:1;min-width:0}
.genre-new-flag{flex:0 0 auto;padding:3px 5px;border:1px solid #d7ef8d8c;border-radius:3px;background:#d7ef8d18;color:var(--accent);font:800 8px/1 var(--mono);letter-spacing:.08em}

/* New releases: warm corner label on artwork, lime flag beside each affected genre. */
.cover-new-song{position:absolute;right:0;bottom:0;z-index:3;padding:8px 11px 8px 22px;clip-path:polygon(12px 0,100% 0,100% 100%,0 100%);background:var(--accent-2);color:#21180f;font:800 10px/1.2 var(--sans);letter-spacing:.07em;text-transform:uppercase;pointer-events:none}
.genre-filter-label{flex:1 1 auto;min-width:0;line-height:1.4}
.genre-filter-new{margin-left:5px;white-space:nowrap}
#genreTabs .filter-item{gap:5px}
#genreTabs .filter-item>b{flex:0 0 auto;margin-left:3px}
.library-list-view .cover-new-song{padding:4px 5px 4px 10px;clip-path:polygon(6px 0,100% 0,100% 100%,0 100%);font-size:6px;letter-spacing:.03em}

.upload-release-fields{margin:0 0 15px;padding:12px;border:1px solid var(--line);border-radius:5px;background:var(--panel-2)}
.upload-release-fields[hidden]{display:none}
.upload-release-fields small{display:block;color:var(--muted);font:10px var(--mono);margin-top:7px}
.upload-release-fields input{color-scheme:dark}
.scheduled-release-badge{display:block;margin-top:7px;color:var(--accent-2);font:9px/1.5 var(--mono)}

/* Keep browser autofill and focus states inside the studio search design. */
.search:focus-within{border-color:#a8c86a;box-shadow:0 0 0 2px #d7ef8d14;color:var(--accent)}
#search{appearance:none;-webkit-appearance:none;color-scheme:dark;background:transparent;color:var(--text);caret-color:var(--accent);min-width:0;border-radius:0}
#search::placeholder{color:var(--muted);opacity:1}
#search::selection{background:var(--accent);color:#17140f}
#search:autofill{background:var(--panel)!important;color:var(--text)!important;box-shadow:0 0 0 1000px var(--panel) inset!important;caret-color:var(--accent)}
#search:-webkit-autofill,#search:-webkit-autofill:hover,#search:-webkit-autofill:focus{background:var(--panel)!important;-webkit-text-fill-color:var(--text)!important;-webkit-box-shadow:0 0 0 1000px var(--panel) inset!important;box-shadow:0 0 0 1000px var(--panel) inset!important;caret-color:var(--accent)}

/* Crisp matching track navigation in both player sizes. */
.player-controls #prev,.player-controls #next,.full-controls #fullPrev,.full-controls #fullNext{display:grid;place-items:center;padding:0;border:1px solid #f2eee51c;border-radius:50%;background:#f2eee508;color:var(--text);line-height:1;transition:color .16s,border-color .16s,background .16s,transform .16s;touch-action:manipulation}
.player-controls #prev,.player-controls #next{width:34px;height:34px}
.skip-track-icon{display:block;width:20px;height:20px;fill:currentColor;pointer-events:none}
.full-controls .skip-track-icon{width:28px;height:28px}
@media(hover:hover){.player-controls #prev:hover,.player-controls #next:hover,.full-controls #fullPrev:hover,.full-controls #fullNext:hover{color:var(--accent);border-color:#d7ef8d80;background:#d7ef8d12}}
.player-controls #prev:focus-visible,.player-controls #next:focus-visible,.full-controls #fullPrev:focus-visible,.full-controls #fullNext:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.player-controls #prev:active,.player-controls #next:active,.full-controls #fullPrev:active,.full-controls #fullNext:active{color:var(--accent);background:#d7ef8d20;transform:scale(.92)}
@media(max-width:560px){.player-controls #prev,.player-controls #next{width:25px;height:30px}.player-controls .skip-track-icon{width:17px;height:17px}}
@media(max-width:390px){.player-controls #prev,.player-controls #next{width:21px}.player-controls .skip-track-icon{width:15px;height:15px}}
@media(prefers-reduced-motion:reduce){.player-controls #prev,.player-controls #next,.full-controls #fullPrev,.full-controls #fullNext{transition:none}}
.recommendation-reason{margin-top:10px;padding:9px 10px;border-left:2px solid var(--accent);border-radius:0 4px 4px 0;background:#d7ef8d08;line-height:1.5}
.recommendation-reason small{display:block;margin-bottom:4px;color:var(--accent);font:700 8px/1.3 var(--mono);letter-spacing:.1em}
.recommendation-reason>span{display:block;color:var(--muted);font-size:11px;overflow-wrap:anywhere}
.library-list-view .recommendation-reason{grid-column:1;grid-row:3;margin-top:6px;padding:5px 8px;max-width:560px}.library-list-view .recommendation-reason small{display:none}.library-list-view .recommendation-reason>span{font-size:10px}

/* Administration stays in the signed-in account; the switch only changes the view. */
.top-actions .admin-button{display:inline-flex;align-items:center;gap:9px;min-height:38px;padding:7px 10px;border-radius:6px;background:#211d16;color:var(--muted);font:700 10px var(--mono);white-space:nowrap}
.top-actions .admin-button[hidden]{display:none}.top-actions .admin-button:hover{border-color:#9ca960;color:var(--text)}.top-actions .admin-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.top-actions .admin-button.active{background:#d7ef8d12;border-color:#819551;color:var(--accent)}
.admin-switch-track{display:inline-flex;align-items:center;width:32px;height:18px;padding:2px;border:1px solid #756a55;border-radius:999px;background:#100e0b;transition:background .18s,border-color .18s}.admin-switch-thumb{width:12px;height:12px;border-radius:50%;background:#a69b88;box-shadow:0 1px 3px #0006;transition:transform .18s,background .18s}.admin-button[aria-checked="true"] .admin-switch-track{border-color:var(--accent);background:#d7ef8d26}.admin-button[aria-checked="true"] .admin-switch-thumb{transform:translateX(14px);background:var(--accent)}.admin-switch-state{min-width:3ch;font-size:8px;letter-spacing:.07em}
@media(max-width:680px){.top-actions .admin-button{gap:7px;min-height:36px;padding:6px 8px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.admin-switch-track,.admin-switch-thumb{transition:none}}
@media(min-width:901px){.topbar{height:auto;min-height:78px;gap:14px;padding-top:14px;padding-bottom:14px}.top-actions{flex-wrap:wrap;justify-content:flex-end;min-width:0}.brand{flex-shrink:0}}

/* Track editing is a deliberate step inside management. */
.library-edit-tools{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:0 0 18px;padding:11px 13px;border:1px solid #494334;border-radius:6px;background:#1d1913}.library-edit-tools[hidden]{display:none}.library-edit-tools .admin-button{display:inline-flex;align-items:center;gap:9px;min-height:38px;border-radius:5px;font:700 10px var(--mono)}.library-edit-tools .admin-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.library-edit-tools .admin-button.active{background:#d7ef8d12;color:var(--accent);border-color:#819551}.track-selection-count{color:var(--muted);font:10px var(--mono);margin-left:auto}.library-edit-tools .batch-delete{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:8px 11px;border:1px solid #a7554a;background:#f0655d0d;color:#ff8178;font:700 10px var(--mono);border-radius:5px}.batch-delete svg{width:18px;height:18px;fill:currentColor}.library-edit-tools .batch-delete:disabled{opacity:.4;cursor:default}.library-edit-tools .batch-delete:not(:disabled):hover{background:#f0655d25;border-color:#ff8178}.batch-delete:focus-visible{outline:2px solid #ff8178;outline-offset:3px}.track-card.is-selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px #d7ef8d70}.track-edit-mode .track-card:not(.admin-list-row) .cover-select{top:8px;right:8px;min-height:30px;padding:6px 8px;border:1px solid #7d8b55;border-radius:4px;background:#16140fee}.track-edit-mode.library-list-view .track-card:not(.admin-list-row){padding-top:38px}.track-edit-mode.library-list-view .track-card:not(.admin-list-row) .cover-select{left:8px;right:auto;top:5px}.track-edit-mode .admin-list-row{grid-template-columns:80px 68px minmax(130px,1fr) 62px minmax(260px,2fr) 96px}.track-edit-mode .admin-list-row .cover-select{display:flex!important;position:static;justify-self:start;align-self:center;padding:5px 0;background:none;font-size:9px}.admin-list-track strong{cursor:pointer}.admin-reactions-section{margin-top:22px;padding-top:18px;border-top:1px solid #494334}.admin-reactions-section h4{margin-bottom:12px}.admin-reactions-section .reaction-report-list{max-height:300px;overflow:auto}.track-delete-dialog{width:min(480px,calc(100vw - 24px));max-height:85vh;overflow:auto}.track-delete-dialog h3{font-size:25px}.track-delete-dialog>p{color:var(--muted);font:11px/1.6 var(--mono)}.track-delete-dialog ul{list-style:none;max-height:260px;overflow:auto;margin:16px 0;padding:0;border-top:1px solid var(--line)}.track-delete-dialog li{padding:10px 0;border-bottom:1px solid var(--line);font-size:12px}.track-delete-dialog li strong,.track-delete-dialog li small{display:block}.track-delete-dialog li small{margin-top:4px;font:9px var(--mono);color:var(--muted)}.track-delete-actions{display:flex;gap:9px;justify-content:flex-end}.track-delete-actions button{min-height:38px;padding:9px 12px;border:1px solid #68604d;border-radius:5px;background:#211d16;color:var(--text);font:700 10px var(--mono);cursor:pointer}.track-delete-actions .track-delete-confirm{border-color:#a7554a;background:#f0655d14;color:#ff8178}.track-delete-actions button:disabled{opacity:.5;cursor:wait}
@media(max-width:1150px){.track-edit-mode .admin-list-row{grid-template-columns:74px 54px minmax(0,1fr) 62px;gap:9px}.track-edit-mode .admin-list-row .admin-list-cover{width:54px;height:54px}.track-edit-mode .admin-list-row .admin-list-genres{grid-column:1/-1;grid-row:2}.track-edit-mode .admin-list-row .admin-list-apply{grid-column:1/-1;grid-row:3;justify-self:end;width:105px}.track-edit-mode .admin-list-row .admin-list-year{grid-column:4;grid-row:1}}
@media(max-width:560px){.library-edit-tools{gap:8px;padding:9px}.track-selection-count{font-size:9px}.track-edit-mode .admin-list-row{grid-template-columns:54px minmax(0,1fr) 64px;gap:8px}.track-edit-mode .admin-list-row .cover-select{grid-column:1/-1;grid-row:1}.track-edit-mode .admin-list-row .admin-list-cover{grid-column:1;grid-row:2}.track-edit-mode .admin-list-row .admin-list-track{grid-column:2;grid-row:2}.track-edit-mode .admin-list-row .admin-list-year{grid-column:3;grid-row:2;font-size:9px}.track-edit-mode .admin-list-row .admin-list-genres{grid-row:3}.track-edit-mode .admin-list-row .admin-list-apply{grid-row:4}.track-delete-dialog{padding:23px 14px}}

/* Native audio output picker, shared by both players. */
.media-output{display:inline-grid;place-items:center;width:30px;height:28px;padding:4px;border:0;border-radius:5px;background:transparent;color:var(--muted);cursor:pointer;flex-shrink:0}.media-output svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.media-output .output-triangle{fill:currentColor;stroke:none}.media-output:hover,.media-output.connected{color:var(--accent);background:#d7ef8d12}.media-output:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.media-output:disabled{opacity:.35;cursor:default}.progress-end .media-output{width:28px;height:22px}.full-player #fullOutput{position:absolute;right:max(20px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));width:42px;height:42px;z-index:3;border:1px solid var(--line);background:var(--panel)}.full-player #fullOutput svg{width:25px;height:25px}.media-output-help{width:min(460px,calc(100vw - 28px));max-height:85vh;overflow:auto}.media-output-help p:not(.eyebrow){font:12px/1.7 var(--sans);color:var(--muted)}.media-output-help strong{color:var(--text)}
@media(max-width:560px){.progress-end .media-output{width:24px;height:20px;padding:2px}.media-output svg{width:19px;height:19px}.full-player #fullOutput{top:max(12px,env(safe-area-inset-top));right:max(14px,env(safe-area-inset-right))}}

/* Mobile bottom player: normal-flow rows keep every control inside the panel. */
@media(max-width:900px){
  .player,body.mobile-mode .player{height:auto;min-height:126px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto;gap:10px 18px;padding:12px max(14px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));overflow:visible}
  .player .now-playing,body.mobile-mode .player .now-playing{position:static;grid-column:1;grid-row:1;gap:10px;min-width:0;padding:0;max-width:none}
  .player .mini-cover{width:44px;height:44px;flex:0 0 44px;border-radius:5px}
  .player .now-playing>div:last-child{min-width:0;flex:1}
  .player .now-playing small{font:8px/1.2 var(--mono);letter-spacing:.1em;margin:0 0 4px;color:var(--accent-2)}
  .player .now-playing strong,.player .now-playing span,body.mobile-mode .player .now-playing strong,body.mobile-mode .player .now-playing span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .player .now-playing strong{font-size:12px;line-height:1.4}
  .player .now-playing span{font-size:10px;line-height:1.35;margin-top:2px}
  .player .player-center,body.mobile-mode .player .player-center{display:contents!important;position:static;min-width:0;max-width:none;transform:none}
  .player .player-controls,body.mobile-mode .player .player-controls{position:static;grid-column:2;grid-row:1;display:flex!important;justify-content:center;align-items:center;gap:clamp(8px,2vw,16px);min-height:44px;margin:0;transform:none}
  .player .player-controls #prev,.player .player-controls #next{width:36px;height:36px;flex:0 0 36px}
  .player .player-controls .play-button{width:44px;height:44px;flex:0 0 44px;font-size:17px;padding:0}
  .player .player-controls .play-button svg{width:22px;height:22px}
  .player .player-reaction{width:36px;height:36px;flex:0 0 36px;padding:7px}
  .player .player-reaction svg{width:19px;height:19px}
  .player .player-controls .skip-track-icon{width:20px;height:20px}
  .player .progress-line,body.mobile-mode .player .progress-line{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:32px minmax(0,1fr) 32px 40px 40px;align-items:center;gap:7px;min-width:0;margin:0;min-height:36px}
  .player .progress-end{display:contents;min-width:0}
  .player #currentTime{grid-column:1;grid-row:1}
  .player #progress{grid-column:2;grid-row:1;min-width:0;width:100%;height:32px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;touch-action:none}
  .player #duration{grid-column:3;grid-row:1}
  .player #currentTime,.player #duration{font:9px var(--mono);color:var(--muted);text-align:center;white-space:nowrap}
  .player #playerOutput{grid-column:4;grid-row:1}
  .player #playerShare{grid-column:5;grid-row:1}
  .player #playerOutput,.player #playerShare{position:static;display:grid;place-items:center;width:40px;height:36px;padding:8px;border-radius:6px}
  .player #playerOutput svg,.player #playerShare svg{width:21px;height:21px}
  .player #playerOutput:not(:disabled),.player #playerShare:not(:disabled){background:#f2eee506}
  .player #progress::-webkit-slider-runnable-track{height:4px;border:0;border-radius:4px;background:#514a3e}
  .player #progress::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border:0;border-radius:50%;background:var(--accent);margin-top:-6px;box-shadow:0 0 0 3px #d7ef8d12}
  .player #progress::-moz-range-track{height:4px;border:0;border-radius:4px;background:#514a3e}
  .player #progress::-moz-range-progress{height:4px;border-radius:4px;background:var(--accent)}
  .player #progress::-moz-range-thumb{width:16px;height:16px;border:0;border-radius:50%;background:var(--accent)}
  .player #progress:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:5px}
  .player .player-end{display:none!important}
  .shell,body.mobile-mode .shell{padding-bottom:calc(156px + env(safe-area-inset-bottom))}
}
@media(max-width:560px){
  .player,body.mobile-mode .player{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:8px;min-height:166px;padding-top:10px}
  .player .now-playing,body.mobile-mode .player .now-playing{grid-column:1;grid-row:1}
  .player .now-playing strong{font-size:13px}
  .player .player-controls,body.mobile-mode .player .player-controls{grid-column:1;grid-row:2;gap:18px}
  .player .progress-line,body.mobile-mode .player .progress-line{grid-column:1;grid-row:3;gap:5px}
  .shell,body.mobile-mode .shell{padding-bottom:calc(196px + env(safe-area-inset-bottom))}
}
@media(max-width:360px){.player .player-controls,body.mobile-mode .player .player-controls{gap:13px}.player .progress-line{grid-template-columns:29px minmax(0,1fr) 29px 36px 36px;gap:4px}.player #playerOutput,.player #playerShare{width:36px}}

/* Desktop transport and output controls stay inside two regular player rows. */
@media(min-width:901px){
  .player{grid-template-columns:minmax(0,1fr) minmax(360px,1.5fr) minmax(150px,1fr);gap:24px;padding-top:10px;padding-bottom:10px}
  .player .player-center{position:static;display:grid!important;grid-template-rows:34px 30px;gap:10px;min-width:0;transform:none}
  .player .player-controls{position:static;min-height:34px;margin:0;transform:none}
  .player .progress-line{display:grid;grid-template-columns:32px minmax(0,1fr) 32px 32px 32px;gap:8px;align-items:center;min-width:0;margin:0}
  .player .progress-end{display:contents}
  .player #currentTime{grid-column:1;grid-row:1}
  .player #progress{grid-column:2;grid-row:1;min-width:0;margin:0}
  .player #duration{grid-column:3;grid-row:1;text-align:center}
  .player #playerOutput{grid-column:4;grid-row:1}
  .player #playerShare{grid-column:5;grid-row:1}
  .player #playerOutput,.player #playerShare{width:32px;height:30px;padding:5px;display:grid;place-items:center;border-radius:6px}
  .player #playerOutput svg,.player #playerShare svg{width:20px;height:20px}
}

/* Align the output button with the library navigation below the iPhone safe area. */
@media(max-width:560px){
  .full-player #fullOutput{top:calc(19px + env(safe-area-inset-top));right:20px}
  .full-back{padding-right:56px}
}

/* Warm, discreet scrollbars throughout administration; scrolling stays available. */
.admin-users-dialog,.admin-user-details-dialog,.admin-users-dialog .reaction-report-list{scrollbar-width:thin;scrollbar-color:#756a57 var(--panel-2)}
.admin-users-dialog::-webkit-scrollbar,.admin-user-details-dialog::-webkit-scrollbar,.admin-users-dialog .reaction-report-list::-webkit-scrollbar{width:8px;height:8px}
.admin-users-dialog::-webkit-scrollbar-track,.admin-user-details-dialog::-webkit-scrollbar-track,.admin-users-dialog .reaction-report-list::-webkit-scrollbar-track{background:var(--panel-2);border-radius:8px;margin:8px 0}
.admin-users-dialog::-webkit-scrollbar-thumb,.admin-user-details-dialog::-webkit-scrollbar-thumb,.admin-users-dialog .reaction-report-list::-webkit-scrollbar-thumb{background:#756a57;border:2px solid var(--panel-2);border-radius:8px}
.admin-users-dialog::-webkit-scrollbar-thumb:hover,.admin-user-details-dialog::-webkit-scrollbar-thumb:hover,.admin-users-dialog .reaction-report-list::-webkit-scrollbar-thumb:hover{background:var(--muted)}
.admin-users-dialog::-webkit-scrollbar-button,.admin-user-details-dialog::-webkit-scrollbar-button,.admin-users-dialog .reaction-report-list::-webkit-scrollbar-button{display:none;width:0;height:0}

/* Quiet legal links beneath feedback; native modal with independent scroll area. */
html.legal-modal-open,html.legal-modal-open body{overflow:hidden}
.sidebar-legal{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 3px 4px;padding-top:12px;border-top:1px solid var(--line)}
.sidebar-legal a{color:var(--muted);font:10px/1.6 var(--sans);text-decoration:none;text-underline-offset:4px}
.sidebar-legal a:hover{color:var(--accent);text-decoration:underline}.sidebar-legal a:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:2px}
.legal-dialog{width:min(820px,calc(100vw - 32px));max-width:none;height:min(820px,calc(100vh - 40px));height:min(820px,calc(100dvh - 40px));max-height:none;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--text);box-shadow:0 30px 100px #0009}
.legal-dialog[open]{display:flex;flex-direction:column}.legal-dialog::backdrop{background:#000b;backdrop-filter:blur(4px)}
.legal-dialog-head>div{min-width:0}.legal-dialog-head h2{overflow-wrap:anywhere}
@media(max-width:360px){.legal-dialog .legal-dialog-head h2{font-size:18px}}
.legal-dialog-head{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 28px 18px;border-bottom:1px solid var(--line);flex:0 0 auto}.legal-dialog-head .eyebrow{font-size:9px;margin:0 0 8px}.legal-dialog-head h2{font:600 27px/1.2 var(--serif);margin:0}.legal-dialog-head .dialog-close{position:static;flex:0 0 36px;width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;padding:0;font:23px/1 var(--sans);color:var(--text);background:transparent}.legal-dialog-head .dialog-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
#legalFrame{border:0;display:block;width:100%;flex:1 1 auto;min-height:0;background:var(--bg)}
@media(max-width:560px){.legal-dialog{width:calc(100vw - 20px);height:calc(100dvh - 30px);border-radius:10px}.legal-dialog-head{padding:19px 18px 16px}.legal-dialog-head h2{font-size:23px}.sidebar-legal{margin-top:10px}.sidebar-legal a{font-size:11px}}
/* Privacy controls follow the studio palette and leave player controls available. */
.sidebar-legal{flex-wrap:wrap;gap:8px 10px}.sidebar-legal button{border:0;padding:0;background:transparent;color:var(--muted);font:10px/1.6 var(--sans);cursor:pointer;text-underline-offset:4px}
.sidebar-legal button:hover{color:var(--accent);text-decoration:underline}.sidebar-legal button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.cookie-notice{position:fixed;z-index:110;right:22px;bottom:124px;width:min(440px,calc(100vw - 32px));max-height:45dvh;overflow:auto;padding:22px;border:1px solid #71644c;border-radius:10px;background:#211d17;box-shadow:0 16px 60px #0009;color:var(--text)}
.cookie-notice[hidden],.cookie-status[hidden]{display:none}.cookie-notice h2{margin:9px 0;font:600 23px var(--serif)}.cookie-notice p:not(.eyebrow),.cookie-dialog p{color:var(--muted);font:12px/1.7 var(--sans)}
.cookie-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}.cookie-actions button{flex:1 1 120px;min-height:42px;padding:10px;border:1px solid #8c826c;border-radius:5px;background:#29251d;color:var(--text);font:700 10px var(--mono);cursor:pointer}.cookie-actions button:hover{border-color:var(--accent);color:var(--accent)}.cookie-actions button:focus-visible,.cookie-details:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.cookie-details{margin-top:14px;padding:0;border:0;background:none;color:var(--accent);font:11px var(--sans);cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.cookie-dialog{width:min(580px,calc(100vw - 24px));max-height:calc(100dvh - 32px);overflow-y:auto;padding:30px;background:linear-gradient(145deg,#242019,#15130f)}.cookie-dialog h3{padding-right:24px}.cookie-category{margin-top:16px;padding:16px;border:1px solid var(--line);border-radius:7px;background:#ffffff03}.cookie-category>div,.cookie-category>label{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;font:600 13px var(--sans)}.cookie-category p{margin:10px 0 0}.cookie-required{color:var(--accent);font:9px var(--mono);white-space:nowrap}.cookie-category input{width:22px;height:22px;accent-color:var(--accent);flex:0 0 auto}.cookie-dialog .cookie-footnote{font-size:11px}.cookie-footnote a{color:var(--accent)}html:has(#cookieDialog[open]),html:has(#cookieDialog[open]) body{overflow:hidden}.cookie-status{position:fixed;z-index:130;right:22px;bottom:124px;max-width:calc(100vw - 32px);padding:14px 18px;border:1px solid #71644c;border-radius:6px;background:#211d17;color:var(--accent);font:12px/1.5 var(--sans);box-shadow:0 8px 30px #0007}
.profile-delete{margin-top:22px;border-top:1px solid var(--line);padding-top:16px}.profile-delete summary{cursor:pointer;color:#cc9b8e;font:11px var(--mono)}.profile-delete p,.delete-account-dialog p:not(.eyebrow):not(.dialog-error){color:var(--muted);font:12px/1.7 var(--sans)}.profile-delete button,.account-delete-button{min-height:42px;width:100%;border:1px solid #a15d4f;border-radius:5px;background:#3d211c;color:#ffd6cc;cursor:pointer;font:700 11px var(--mono)}.profile-delete button:hover,.account-delete-button:hover{background:#572a22}.account-delete-button:disabled{opacity:.55;cursor:wait}.delete-confirmation{display:flex!important;gap:10px;align-items:flex-start;font:12px/1.6 var(--sans)!important}.delete-confirmation input{width:18px!important;height:18px;flex:0 0 auto;accent-color:#cc9b8e;margin-top:2px}.delete-account-dialog{max-height:calc(100dvh - 28px);overflow:auto}html:has(#deleteAccountDialog[open]),html:has(#deleteAccountDialog[open]) body{overflow:hidden}
@media(max-width:560px){.cookie-notice,.cookie-status{right:12px;bottom:calc(200px + env(safe-area-inset-bottom,0px));width:calc(100vw - 24px)}.cookie-notice{padding:17px;max-height:40dvh}.cookie-notice h2{font-size:21px}.cookie-dialog{padding:24px 20px}.cookie-dialog .cookie-actions button{flex-basis:100%}.sidebar-legal button{font-size:11px}}
.cookie-category input{appearance:none;-webkit-appearance:none;width:38px;height:22px;border:1px solid #8c826c;border-radius:20px;background:radial-gradient(circle at 10px center,#e9e3d6 0 7px,transparent 8px),#3b352a;cursor:pointer}.cookie-category input:checked{background:radial-gradient(circle at 26px center,#18150f 0 7px,transparent 8px),var(--accent);border-color:var(--accent)}.cookie-category input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.profile-dialog form{scrollbar-width:thin;scrollbar-color:#61513c #211b14}
.cookie-dialog{scrollbar-width:thin;scrollbar-color:#61513c #211b14}
.library-settings-trigger{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:13px 16px;margin:0 0 20px;border:1px solid #71644c;border-radius:6px;background:#242018;color:var(--accent);font:600 12px var(--sans);cursor:pointer}
.library-settings-trigger:hover{background:#30281c;border-color:var(--accent)}
.library-settings-dialog{width:min(680px,calc(100vw - 28px));max-width:680px;max-height:calc(100dvh - 32px);overflow-y:auto;padding:32px;background:linear-gradient(145deg,#242019,#15130f);scrollbar-width:thin;scrollbar-color:#61513c #211b14}
.library-settings-dialog h3,.reaction-signin-dialog h3{padding-right:26px}.settings-intro{color:var(--muted);font:13px/1.7 var(--sans);margin:8px 0 24px}
.settings-panel{margin-top:16px;padding:20px;border:1px solid var(--line);border-radius:8px;background:#ffffff03}.settings-section-heading{display:flex;gap:14px;margin-bottom:18px}.settings-section-heading>span,.settings-panel summary{color:var(--accent);font:11px/1.6 var(--mono)}.settings-section-heading h4{margin:0 0 5px;color:var(--text);font:600 16px var(--sans)}.settings-section-heading p{margin:0;color:var(--muted);font:12px/1.7 var(--sans)}.settings-panel summary{cursor:pointer;padding-right:10px}.settings-panel summary span{margin-left:8px;color:var(--text);font:600 15px var(--sans)}
.library-settings-dialog form{display:block}.library-settings-dialog label:not(.settings-check):not(.settings-genre-row){display:block;margin:15px 0 7px;color:var(--muted);font:11px var(--mono)}.library-settings-dialog select,.library-settings-dialog input[type=text],.library-settings-dialog input:not([type]){width:100%;min-width:0;box-sizing:border-box;min-height:44px;border:1px solid #615440;border-radius:5px;padding:11px 12px;color:var(--text);background:#191611;font:12px var(--sans)}.library-settings-dialog select option,.library-settings-dialog select optgroup{background:#191611;color:var(--text)}
.library-settings-dialog form button,.settings-actions button{min-height:44px;padding:12px 17px;border:1px solid #71644c;border-radius:5px;background:#2c261c;color:var(--text);font:600 11px var(--mono);cursor:pointer}.library-settings-dialog form button{margin-top:16px;width:100%}.library-settings-dialog .primary-button,.settings-actions .primary-button{background:var(--accent);border-color:var(--accent);color:#191611}.library-settings-dialog button:disabled,.library-settings-dialog input:disabled,.library-settings-dialog select:disabled{opacity:.6;cursor:wait}
.library-settings-dialog button:focus-visible,.library-settings-dialog input:focus-visible,.library-settings-dialog select:focus-visible,.library-settings-dialog summary:focus-visible,.settings-actions button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.settings-note{color:var(--muted);font:11px/1.8 var(--sans);margin:14px 0}.settings-genre-list{margin-top:14px}.settings-genre-row{display:flex!important;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;margin:0!important;border-bottom:1px solid var(--line);color:var(--text);font:12px/1.5 var(--sans)!important}.settings-seasonal-label{display:flex;align-items:center;gap:9px;color:var(--muted);font:10px var(--mono);white-space:nowrap}.settings-genre-row input,.settings-check input{width:18px;height:18px;flex:0 0 auto;margin:0;accent-color:var(--accent)}.settings-check{display:flex!important;align-items:center;gap:10px;margin:16px 0 0!important;color:var(--text);font:12px var(--sans)!important}.settings-add-form{margin-top:20px;padding-top:5px;border-top:1px solid var(--line)}.settings-channel-list>div{display:flex;flex-direction:column;gap:4px;padding:12px 0;border-bottom:1px solid var(--line);font:12px var(--sans)}.settings-channel-list span{color:var(--muted);font-size:11px}.settings-status{position:sticky;bottom:-32px;margin:18px -32px -32px;padding:16px 32px;background:#191611;border-top:1px solid var(--line);color:var(--accent);font:12px/1.6 var(--sans);min-height:20px}
.reaction-signin-dialog{width:min(440px,calc(100vw - 28px));max-height:calc(100dvh - 32px);padding:32px;overflow-y:auto;background:linear-gradient(145deg,#242019,#15130f)}.reaction-signin-icons{display:flex;gap:15px;margin:23px 0;color:var(--accent)}.reaction-signin-icons svg{width:28px;height:28px;fill:currentColor}.reaction-signin-icons svg+svg{color:#bc8176}.reaction-signin-dialog>p:not(.eyebrow){color:var(--text);font:14px/1.8 var(--sans)}.reaction-signin-dialog .reaction-signin-note{font-size:12px!important;color:var(--muted)!important}.settings-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.settings-actions button{flex:1 1 auto}
html:has(#librarySettingsDialog[open]),html:has(#librarySettingsDialog[open]) body,html:has(#reactionSigninDialog[open]),html:has(#reactionSigninDialog[open]) body{overflow:hidden}
@media(max-width:560px){.library-settings-dialog,.reaction-signin-dialog{padding:24px 20px}.settings-panel{padding:16px}.settings-genre-row{gap:10px;font-size:11px!important}.settings-seasonal-label{font-size:9px}.settings-status{bottom:-24px;margin:18px -20px -24px;padding:14px 20px}.settings-actions button{flex-basis:100%}}
.channel-choice-list{max-height:260px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#61513c #211b14;border:1px solid var(--line);border-radius:5px;margin:12px 0;padding:4px 12px}.library-settings-dialog .channel-choice{display:flex!important;gap:12px;align-items:center;margin:0!important;padding:10px 0;color:var(--text)!important;font:12px/1.5 var(--sans)!important;border-bottom:1px solid var(--line)}.library-settings-dialog .channel-choice[hidden]{display:none!important}.channel-choice input{width:18px;height:18px;margin:0;flex:0 0 auto;accent-color:var(--accent)}.channel-choice span{min-width:0;overflow-wrap:anywhere}.channel-choice small,.managed-channel summary small{display:block;margin-top:3px;color:var(--muted);font:10px/1.6 var(--mono)}.managed-channel{margin:12px 0;padding:14px;border:1px solid #615440;border-radius:6px;background:#191611;min-width:0}.managed-channel summary{cursor:pointer;overflow-wrap:anywhere}.managed-channel button{width:100%;min-height:44px;margin:8px 0;padding:10px 12px;border:1px solid #71644c;border-radius:5px;background:#2c261c;color:var(--text);font:11px/1.6 var(--mono);cursor:pointer;overflow-wrap:anywhere}.managed-channel .channel-delete{border-color:#94493e;color:#ffb1a1}.channel-add-titles{padding:14px 0;margin:8px 0;border-top:1px solid var(--line)}
.player-controls #shuffle{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border:1px solid #f2eee51c;border-radius:50%;background:#f2eee508;color:var(--muted);padding:7px;cursor:pointer}
.player-controls #shuffle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.player-controls #shuffle[aria-pressed=true]{color:var(--accent);border-color:#d7ef8d80;background:#d7ef8d18}
.player-controls #shuffle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:560px){.player .player-controls,body.mobile-mode .player .player-controls{gap:clamp(7px,2.5vw,18px)}}
.player-controls #shuffle{order:5}
.full-player .full-kicker{gap:8px}
.full-player #fullShuffle{flex-shrink:0;white-space:nowrap}
