:root{
  color-scheme:dark;
  --bg:#08080b;
  --panel:#111116;
  --panel-soft:#17171d;
  --panel-elev:#1b1b22;
  --text:#f7f7f8;
  --muted:#96969e;
  --muted2:#777780;
  --line:#2c2c33;
  --line-soft:rgba(255,255,255,.09);
  --accent:#63df72;
  --danger:#ff717c;
  --nav-h:72px;
  --content-max:720px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
html{background:#08080b}
body{padding:env(safe-area-inset-top) 0 calc(var(--nav-h) + 110px + env(safe-area-inset-bottom));overflow-x:hidden}
button,input{font:inherit}
button{color:inherit;-webkit-tap-highlight-color:transparent}
button:focus-visible,input:focus-visible{outline:2px solid rgba(255,255,255,.35);outline-offset:2px}
.hidden{display:none!important}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Original black launch screen */
.boot-splash{position:fixed;inset:0;z-index:1000;background:#08080b;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:opacity .24s ease,visibility .24s ease}
.boot-splash.done{opacity:0;visibility:hidden;pointer-events:none}
.boot-title{font-size:27px;line-height:1;font-weight:760;letter-spacing:-.045em;color:#f4f4f5}
.boot-spinner{width:25px;height:25px;border-radius:50%;border:3px solid #35363c;border-top-color:#b8bac0;margin-top:28px;animation:bootspin .85s linear infinite}
@keyframes bootspin{to{transform:rotate(360deg)}}

.app-shell{width:min(var(--content-max),100%);margin:0 auto;padding:33px 18px 40px}
.topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:0 0 24px}
.brand-block{min-width:0}
.eyebrow{margin:0 0 8px;color:#96969d;font-size:10px;line-height:1;font-weight:760;letter-spacing:.22em}
.topbar h1{margin:0;font-size:38px;line-height:.98;font-weight:790;letter-spacing:-.055em}
.header-actions{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.round-more{width:48px;height:48px;border-radius:50%;border:1px solid #35353d;background:#232329;color:#e5e5e8;font-size:16px;font-weight:800;letter-spacing:2px;padding-bottom:7px}
.primary-btn{border:0;border-radius:999px;background:#fafafa;color:#08080b;padding:13px 18px;font-weight:790;font-size:15px;line-height:1;box-shadow:none;white-space:nowrap}
.primary-btn:active{transform:scale(.98)}

.stats-wrap{margin-bottom:18px}
.stats-card{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #37373f;border-radius:21px;overflow:hidden;background:#101014;margin-bottom:14px}
.stats-card>div{min-width:0;padding:15px 15px 14px;display:flex;flex-direction:column;gap:3px}
.stats-card>div+div{border-left:1px solid #34343b}
.stats-card strong{font-size:19px;line-height:1.05;font-weight:750;letter-spacing:-.025em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stats-card span{font-size:11px;line-height:1.2;color:#92929a}
.storage-card{padding:14px 15px 15px;border:1px solid #33333a;border-radius:21px;background:#101014}
.storage-card__row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.storage-card__head>div{display:flex;flex-direction:column;gap:5px;min-width:0}
.storage-label{color:#92929a;font-size:9px;line-height:1;font-weight:760;letter-spacing:.17em}
.storage-card strong{font-size:17px;line-height:1.1;font-weight:720;letter-spacing:-.02em}
.persist-badge,.local-pill{border:1px solid #356645;color:#c7efd0;border-radius:999px;padding:7px 11px;font-size:10px;letter-spacing:.08em;white-space:nowrap;background:rgba(70,170,90,.06)}
.storage-meter{height:4px;background:#202026;border-radius:99px;margin:12px 0 10px;overflow:hidden}
.storage-meter span{display:block;height:100%;width:0;background:#f0f0f2;border-radius:99px;transition:width .25s ease}
.storage-small{font-size:10px;line-height:1.35;color:#85858d;min-height:22px;align-items:flex-start}
.storage-small+.storage-small{margin-top:5px}
.link-btn,.text-action{border:0;background:none;color:#ceced2;padding:0;font-size:11px;white-space:nowrap}

.controls-row{display:flex;gap:10px;margin-bottom:14px}
.search-wrap{height:54px;flex:1;display:flex;align-items:center;gap:10px;background:#1b1b21;border:1px solid #34343b;border-radius:17px;padding:0 16px;color:#83838c;overflow:hidden}
.search-wrap input{width:100%;border:0;outline:0;background:transparent;color:#f3f3f5;font-size:16px;min-width:0}
.search-wrap input::placeholder{color:#7f7f88}
.search-svg{width:18px;height:18px;fill:none;stroke:#8f8f97;stroke-width:1.8;flex:0 0 auto}
.square-btn{width:54px;height:54px;border:1px solid #34343b;border-radius:17px;background:#1b1b21;display:grid;place-items:center;padding:0}
.square-btn svg{width:24px;height:24px;fill:none;stroke:#e3e3e6;stroke-width:1.5;stroke-linecap:round}

.tabs{display:flex;gap:9px;align-items:center;margin-bottom:26px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{border:1px solid #313138;background:#18181d;color:#9a9aa2;border-radius:999px;padding:10px 15px;font-size:13px;line-height:1;white-space:nowrap}
.tab.active{background:#fafafa;color:#08080b;border-color:#fafafa;font-weight:730}
.tab-count{opacity:.8;margin-left:2px}

.library-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.library-head h2{font-size:25px;line-height:1;margin:0;font-weight:760;letter-spacing:-.035em}
.library-actions{display:flex;align-items:center;gap:28px}
.library-actions button,.text-action{border:0;background:none;color:#aaaab1;font-size:14px;padding:6px 0}
.library-actions button.active{color:#fff;font-weight:680}
.track-list{display:flex;flex-direction:column}
.track{display:grid;grid-template-columns:49px minmax(0,1fr) 38px 30px;align-items:center;gap:11px;padding:9px 2px;border-bottom:1px solid #202026;min-height:66px}
.track-cover{width:49px;height:49px;border-radius:10px;background:#15151a;display:grid;place-items:center;background-size:cover;background-position:center;color:#777;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
.track-main{min-width:0;border:0;background:none;text-align:left;padding:0}
.track-title,.track-artist{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.track-title{font-size:15px;line-height:1.18;font-weight:700;letter-spacing:-.015em}
.track-artist{font-size:12px;line-height:1.2;color:#8f8f97;margin-top:4px}
.track-fav,.track-more{width:36px;height:44px;border:0;background:none;color:#96969e;display:grid;place-items:center;padding:0}
.track-fav{font-size:28px;font-weight:250;line-height:1}
.track-fav.active{color:#f1f1f3}
.track-more{font-size:18px;letter-spacing:1px;padding-bottom:7px}
.track.selecting{grid-template-columns:28px 49px minmax(0,1fr) 30px}
.track.selecting .track-fav{display:none}
.select-dot{width:21px;height:21px;border:1.5px solid #65656d;border-radius:50%;display:grid;place-items:center;font-size:12px;color:#08080b;background:transparent}
.track.selected .select-dot{background:#f5f5f6;border-color:#f5f5f6}
.favorite-dot{display:none}
.empty-state{text-align:left;padding:22px 2px 60px;color:#8e8e96}
.empty-state h2{margin:0 0 7px;color:#d9d9dd;font-size:17px}
.empty-state p{margin:0 0 18px;font-size:13px;line-height:1.45;max-width:340px}
.empty-state .primary-btn{font-size:13px;padding:11px 15px}

.playlist-list{display:flex;flex-direction:column;gap:10px}
.playlist-card{border:1px solid #303038;border-radius:17px;background:#121216;padding:16px;display:flex;justify-content:space-between;align-items:center;text-align:left}
.playlist-card strong{display:block;font-size:15px}.playlist-card span{display:block;color:#92929a;font-size:12px;margin-top:4px}

/* Party screen patterned after the preserved original */
.party-view{padding-bottom:30px}
.party-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin:2px 0 18px}
.party-title-row h2{margin:0;font-size:31px;line-height:1;font-weight:780;letter-spacing:-.05em}
.party-title-row p{margin:7px 0 0;color:#9999a1;font-size:13px}
.party-code{border:1px solid #34343c;border-radius:15px;background:#19191f;padding:10px 13px;font-weight:760;letter-spacing:.18em;font-size:11px;color:#d0d0d4}
.party-actions{display:flex;gap:9px;align-items:center;margin-bottom:16px;overflow-x:auto;scrollbar-width:none}
.party-actions::-webkit-scrollbar{display:none}
.party-actions button{height:49px;border-radius:999px;padding:0 16px;font-size:14px;font-weight:740;white-space:nowrap}
.party-primary{border:0;background:#fafafa;color:#08080b}.party-secondary{border:1px solid #393941;background:#1a1a20}.party-leave{border:1px solid #562832;background:#2a1117;color:#ff7882}
.party-card{border:1px solid #313139;border-radius:22px;background:#121217;padding:15px 16px;margin-bottom:15px}
.party-card-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:7px}.party-card-head h3{margin:0;font-size:20px}.party-card-head span{color:#8c8c94;font-size:11px;white-space:nowrap}
.node-row{display:grid;grid-template-columns:19px minmax(0,1fr) auto;align-items:center;gap:10px;padding:15px 0 4px}.node-dot{width:9px;height:9px;border-radius:50%;background:#73737c}.node-dot.online{background:#61d987;box-shadow:0 0 0 7px rgba(97,217,135,.08)}.node-row strong{font-size:15px}.node-row small{display:block;color:#8d8d95;font-size:11px;margin-top:4px}.role-pill{border:1px solid #393941;border-radius:999px;padding:8px 12px;font-size:9px;font-weight:760;letter-spacing:.17em;color:#acacb3}
.party-playlist{display:flex;flex-direction:column}.party-track{display:grid;grid-template-columns:28px minmax(0,1fr) 32px;align-items:center;gap:8px;padding:13px 0;border-bottom:1px solid #25252b}.party-track:last-child{border-bottom:0}.party-index{color:#76767f;font-size:12px;text-align:center}.party-track strong{font-size:14px}.party-track small{display:block;color:#8f8f97;font-size:11px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.party-remove{border:0;background:none;color:#8e8e96;font-size:21px}
.party-empty{padding:18px 0;color:#87878f;font-size:13px}

/* Bottom navigation */
.bottom-nav{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:min(var(--content-max),100%);height:calc(var(--nav-h) + env(safe-area-inset-bottom));padding:7px 11px env(safe-area-inset-bottom);background:rgba(8,8,11,.96);border-top:1px solid #25252b;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);z-index:35;display:grid;grid-template-columns:repeat(5,1fr)}
.nav-item{border:0;background:none;color:#97979f;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;position:relative;padding:3px}
.nav-item svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.nav-item small{font-size:10px;line-height:1}
.nav-item.active{color:var(--accent)}
.nav-item.active:after{content:"";position:absolute;bottom:-7px;width:48px;height:2px;background:var(--accent);border-radius:99px}

/* Floating player */
.mini-player{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--nav-h) + 10px + env(safe-area-inset-bottom));width:min(calc(var(--content-max) - 18px),calc(100% - 18px));background:rgba(24,24,29,.96);border:1px solid #4a4a52;border-radius:20px;z-index:40;box-shadow:0 15px 45px rgba(0,0,0,.42);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);overflow:hidden}
.mini-collapsed{height:78px;padding:9px 10px;display:flex;align-items:center;gap:7px;position:relative}
.mini-meta{border:0;background:none;display:flex;align-items:center;gap:11px;min-width:0;text-align:left;flex:1;padding:0}
.mini-cover{width:54px;height:54px;flex:0 0 auto;border-radius:11px;background:#111115;display:grid;place-items:center;background-size:cover;background-position:center;overflow:hidden}
.large-cover{width:64px;height:64px}
.mini-text{min-width:0;display:flex;flex-direction:column;gap:4px}.mini-text strong,.mini-text span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-text strong{font-size:14px;line-height:1.15}.mini-text span{color:#9a9aa2;font-size:12px}
.mini-icon,.mini-play{width:34px;height:44px;border:0;background:none;font-size:20px;flex:0 0 auto}.mini-play{font-size:25px;color:#f5f5f6}.mini-progress{position:absolute;left:10px;right:10px;bottom:4px;height:3px;background:#38383f;border-radius:99px;overflow:hidden}.mini-progress span{display:block;height:100%;width:0;background:var(--accent)}
.wave-icon{display:inline-flex;align-items:center;justify-content:center;gap:2px;width:30px;height:30px;color:#d8d8dc;flex:0 0 auto}.wave-icon i{display:block;width:2.5px;border-radius:9px;background:currentColor;animation:wave 1.1s ease-in-out infinite}.wave-icon i:nth-child(1){height:10px}.wave-icon i:nth-child(2){height:19px;animation-delay:-.35s}.wave-icon i:nth-child(3){height:24px;animation-delay:-.6s}.wave-icon i:nth-child(4){height:14px;animation-delay:-.2s}@keyframes wave{0%,100%{transform:scaleY(.5)}50%{transform:scaleY(1)}}
.mini-expanded{padding:10px 11px 12px}.mini-expanded__head{display:flex;align-items:center;gap:7px}.seek{width:100%;height:18px;accent-color:#fff}.mini-expanded .seek{margin-top:8px}.mini-times,.times{display:flex;justify-content:space-between;color:#92929a;font-size:10px}.mini-controls{display:grid;grid-template-columns:1fr 1fr 76px 1fr 1fr;align-items:center;place-items:center;margin-top:5px}.mini-controls button{border:0;background:none;font-size:21px}.play-circle{width:82px;height:82px;border-radius:50%;border:0;background:#fafafa;color:#08080b;font-size:30px;display:grid;place-items:center;padding-left:5px}.mini-big{width:58px;height:58px;font-size:23px}

/* Now Playing — large vinyl UI */
.now-playing{position:fixed;inset:0;z-index:80;background:radial-gradient(circle at 50% 2%,#202029 0,#121218 25%,#08080b 62%);padding:calc(env(safe-area-inset-top) + 22px) 26px calc(env(safe-area-inset-bottom) + 26px);overflow-y:auto;display:flex;flex-direction:column;align-items:stretch}
.np-header{display:grid;grid-template-columns:48px 1fr 48px;align-items:center;min-height:44px;margin-bottom:24px}.np-header>span{text-align:center;font-size:12px;font-weight:760;letter-spacing:.16em;color:#bebec4}.plain-icon{border:0;background:none;color:#d0d0d5;font-size:23px}.np-header .plain-icon:first-child{text-align:left}.np-header .dots{text-align:right;font-size:18px;letter-spacing:2px;padding-bottom:8px}
.vinyl{width:min(78vw,390px);aspect-ratio:1;margin:4px auto 30px;border-radius:50%;position:relative;display:grid;place-items:center;background:
  radial-gradient(circle at 50% 50%,transparent 0 12%,rgba(0,0,0,.92) 12.5% 17%,transparent 17.5%),
  repeating-radial-gradient(circle at center,#111115 0 2px,#050506 2.5px 4px,#17171c 4.5px 5.3px),
  conic-gradient(from 12deg,rgba(255,255,255,.02),rgba(255,255,255,.22) 8deg,rgba(255,255,255,.01) 25deg,rgba(255,255,255,.15) 45deg,rgba(0,0,0,.2) 70deg,rgba(255,255,255,.03) 110deg,rgba(255,255,255,.2) 150deg,rgba(0,0,0,.15) 190deg,rgba(255,255,255,.14) 230deg,rgba(0,0,0,.22) 280deg,rgba(255,255,255,.06) 330deg);
  box-shadow:0 10px 60px rgba(0,0,0,.42),inset 0 0 0 1px rgba(255,255,255,.16)
}
.vinyl:before{content:"";position:absolute;inset:8%;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),inset 0 0 35px rgba(255,255,255,.03)}
.vinyl.playing{animation:vinylspin var(--vinyl-speed,2.5s) linear infinite}.vinyl.paused{animation-play-state:paused}@keyframes vinylspin{to{transform:rotate(360deg)}}
.vinyl-label{width:37%;aspect-ratio:1;border-radius:50%;background:#17171b;display:grid;place-items:center;background-size:cover;background-position:center;position:relative;z-index:2;box-shadow:0 0 0 12px #070708,0 0 0 13px rgba(255,255,255,.04);overflow:hidden;color:#6e6e76;font-size:28px}
.np-info-row{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin:0 0 9px}.np-info{min-width:0}.np-info h2{margin:0;font-size:30px;line-height:1.06;font-weight:790;letter-spacing:-.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.np-info p{margin:8px 0 0;color:#a5a5ac;font-size:18px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quality-badge{align-self:flex-start;border:1px solid #44444d;border-radius:999px;background:#15151a;padding:8px 12px;color:#e0e0e4;font-size:11px;line-height:1;font-weight:730;letter-spacing:.08em;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;margin-bottom:24px}
.scrubber-wrap{margin-top:1px}.seek{-webkit-appearance:none;appearance:none;background:transparent}.seek::-webkit-slider-runnable-track{height:4px;border-radius:99px;background:#35353c}.seek::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#f7f7f8;margin-top:-8px;border:0}.seek::-moz-range-track{height:4px;border-radius:99px;background:#35353c}.seek::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#f7f7f8;border:0}
.times{margin-top:3px;font-size:11px}.transport{display:grid;grid-template-columns:1fr 1fr 92px 1fr 1fr;align-items:center;place-items:center;margin:24px 0 20px}.transport button{border:0;background:none}.transport-side{font-size:26px;color:#74747c}.transport-btn{font-size:30px;color:#f2f2f4}.transport .play-circle{width:82px;height:82px;font-size:30px;background:#fafafa;color:#08080b}.np-actions{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #26262d;margin-top:auto;padding-top:14px}.np-actions button{border:0;background:none;color:#e7e7ea;display:flex;flex-direction:column;align-items:center;gap:4px}.np-actions span{font-size:23px}.np-actions small{font-size:9px;color:#8e8e96}.np-actions button.active span{color:#fff}

/* Settings bottom sheet */
.sheet-backdrop{position:fixed;inset:0;z-index:59;background:rgba(0,0,0,.48);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.settings-sheet{position:fixed;z-index:60;left:50%;transform:translateX(-50%);bottom:0;width:min(var(--content-max),100%);max-height:calc(100dvh - 115px);background:#18171f;border:1px solid #3b3a43;border-bottom:0;border-radius:28px 28px 0 0;padding:9px 18px calc(env(safe-area-inset-bottom) + 18px);box-shadow:0 -25px 70px rgba(0,0,0,.45)}
.sheet-handle{width:45px;height:5px;border-radius:99px;background:#5b5a66;margin:1px auto 22px}.settings-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:21px}.settings-title h2{margin:0;font-size:24px;letter-spacing:-.035em}.settings-scroll{overflow:auto;max-height:calc(100dvh - 210px);padding-bottom:18px}.settings-scroll h3{margin:24px 0 10px;color:#9b99a8;font-size:11px;letter-spacing:.18em;font-weight:780}.settings-scroll h3:first-child{margin-top:0}
.setting-row,.settings-link{width:100%;min-height:73px;border:0;border-bottom:1px solid #33323a;background:none;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 3px;text-align:left}.setting-row>span:first-child,.settings-link>span{min-width:0;display:flex;flex-direction:column;gap:5px}.setting-row strong,.settings-link strong{font-size:16px;line-height:1.12}.setting-row small,.settings-link small{font-size:11px;line-height:1.35;color:#96949f}.setting-row input[type=checkbox]{appearance:none;-webkit-appearance:none;width:27px;height:27px;border-radius:8px;background:#f5f5f6;position:relative;flex:0 0 auto}.setting-row input[type=checkbox]:checked:after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:#08080b;font-size:21px;font-weight:850}.range-row{display:grid;grid-template-columns:1fr auto}.range-row input[type=range]{grid-column:1/-1;width:100%;accent-color:#fff}.setting-value{color:#9b99a5;font-size:11px}.settings-link b{font-size:26px;font-weight:300;color:#8c8b96}.danger-btn{width:100%;margin-top:25px;border:1px solid #5e2b35;background:#2b1118;color:#ff858f;border-radius:15px;padding:14px;font-weight:730}

/* Dialogs */
.modal{border:0;padding:0;background:transparent;color:var(--text);width:min(430px,calc(100% - 26px))}.modal::backdrop{background:rgba(0,0,0,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.modal-card{background:#1a1920;border:1px solid #3a3942;border-radius:22px;padding:18px;box-shadow:0 20px 70px rgba(0,0,0,.55)}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.modal-head h2{margin:0;font-size:20px}.technical-info{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:14px}.technical-info dt,.technical-info dd{margin:0;padding:9px 0;border-bottom:1px solid #313039;font-size:12px}.technical-info dt{color:#9b99a5}.technical-info dd{text-align:right}.action-sheet{display:flex;flex-direction:column;padding:9px 15px 14px}.action-title{padding:12px 4px;color:#aaa8b3;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-sheet button{border:0;border-top:1px solid #313039;background:none;text-align:left;padding:15px 4px;font-size:15px}.action-sheet .danger-text{color:#ff7d86}
.toast{position:fixed;left:50%;bottom:calc(var(--nav-h) + 118px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:120;background:#e9e9eb;color:#111114;border-radius:999px;padding:10px 15px;font-size:12px;font-weight:700;box-shadow:0 8px 30px rgba(0,0,0,.35);max-width:calc(100% - 30px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media (min-width:620px){
  .app-shell{padding-left:28px;padding-right:28px}.topbar h1{font-size:42px}.track{grid-template-columns:54px minmax(0,1fr) 40px 34px}.track-cover{width:54px;height:54px}.vinyl{width:min(52vw,420px)}
}
@media (max-width:390px){
  .app-shell{padding-left:15px;padding-right:15px}.topbar h1{font-size:34px}.primary-btn{padding:12px 15px}.round-more{width:44px;height:44px}.stats-card>div{padding:13px 10px}.stats-card strong{font-size:17px}.storage-card strong{font-size:15px}.search-wrap,.square-btn{height:50px}.square-btn{width:50px}.track{grid-template-columns:46px minmax(0,1fr) 34px 28px;gap:9px}.track-cover{width:46px;height:46px}.library-actions{gap:18px}.vinyl{width:min(80vw,340px)}.np-info h2{font-size:27px}.np-info p{font-size:16px}.now-playing{padding-left:20px;padding-right:20px}.transport{grid-template-columns:1fr 1fr 82px 1fr 1fr}.transport .play-circle{width:74px;height:74px}
}