:root{color-scheme:dark;--bg:#111311;--side:#171a17;--panel:#1b1f1b;--line:#30362e;--text:#f1f2e9;--muted:#929b8e;--accent:#c8e6a5;--accent-ink:#26301e;--warm:#cfad80;--radius:18px;font-family:Inter,"Segoe UI",Arial,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:14px;line-height:1.5}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}button:disabled{opacity:.35;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}svg{width:20px;height:20px;display:block}button svg{pointer-events:none}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:550;letter-spacing:-.035em}.eyebrow{font-size:10px;font-weight:650;letter-spacing:1.65px;color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.app-shell{display:grid;grid-template-columns:230px minmax(0,1fr);min-height:100vh}.sidebar{background:var(--side);border-right:1px solid #262c25;padding:34px 22px 0;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:9px;font-size:27px;letter-spacing:-1.4px;font-weight:650;line-height:1}.brand-dot{color:var(--accent);margin-left:-9px}.brand-mark{display:grid;place-items:center;width:34px;height:34px;background:var(--accent);color:#26331f;border-radius:11px;font-family:Georgia,serif;font-style:italic;font-weight:bold;font-size:33px;line-height:1;padding-bottom:5px}.workspace{margin-top:49px}.workspace label{display:block;margin:0 0 12px 3px}.select-wrap{display:flex;align-items:center;gap:9px;padding:11px 9px;background:#20251f;border:1px solid var(--line);border-radius:10px}.server-icon{width:28px;height:28px;background:#343d2e;color:var(--accent);display:grid;place-items:center;border-radius:8px;font-size:12px;font-weight:700;flex-shrink:0}.select-wrap select{width:100%;min-width:0;background:transparent;border:0;color:var(--text);font-size:12px;outline-offset:8px}.select-wrap option{background:var(--panel)}nav{margin-top:32px;display:grid;gap:8px}.nav-link{border:0;background:none;display:flex;align-items:center;gap:12px;text-align:left;padding:12px 14px;border-radius:10px;color:var(--muted);font-size:13px;font-weight:550}.nav-link svg{width:18px;height:18px}.nav-link:hover{background:#22291f}.nav-link.active{background:#2c3824;color:var(--accent)}.nav-dot{width:5px;height:5px;background:var(--accent);border-radius:50%;margin-left:auto;display:none}.active .nav-dot{display:block}.sidebar-note{margin-top:auto;padding:45px 11px 30px}.sidebar-note p{font-size:12px;color:#c4cdbe;margin:13px 0 7px}.sidebar-note small{color:#7f8b78;font-size:11px;line-height:1.8}.little-equalizer{display:flex;align-items:center;gap:3px;height:24px}.little-equalizer i{width:3px;border-radius:2px;background:#8ba075;height:12px}.little-equalizer i:nth-child(2){height:23px}.little-equalizer i:nth-child(3){height:17px}.little-equalizer i:nth-child(4){height:9px}.sidebar-bottom{margin:0 -22px;padding:18px 20px;border-top:1px solid #2a3027}.connection{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted);margin-bottom:20px}.status-dot{display:inline-block;width:6px;height:6px;background:var(--accent);border-radius:50%;flex-shrink:0}.status-dot.offline{background:#d1937e}.version{margin-left:auto;color:#697461}.user-row{display:flex;align-items:center;gap:9px}.avatar{width:31px;height:31px;display:grid;place-items:center;border-radius:50%;background:#3c362d;color:#dbc29e;font-size:12px}.user-row strong{display:block;font-size:12px;max-width:108px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:550}.user-row small{display:block;color:#7f8a79;font-size:9px;margin-top:2px}.user-row button{margin-left:auto}.icon-button{display:grid;place-items:center;width:30px;height:30px;background:transparent;border:0;border-radius:8px;color:var(--muted);flex-shrink:0}.icon-button:hover{background:#313a2b;color:var(--text)}.icon-button svg{width:16px;height:16px}
.main-content{padding:37px 44px 22px;max-width:1530px;width:100%;margin:auto}.page-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:29px}.breadcrumb{font-size:9px;font-weight:600;letter-spacing:1.7px;color:#9da795;margin-bottom:12px}.breadcrumb>span:first-child{padding:0 11px;color:#53604b}.page-header h1{font-size:33px;line-height:1.2;letter-spacing:-1.3px}.page-header p{font-size:12px;color:var(--muted);margin-top:10px}.room-pill{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:30px;padding:9px 14px;font-size:11px;color:#b7c5ab;white-space:nowrap;max-width:270px;overflow:hidden}.room-pill>span:last-child{overflow:hidden;text-overflow:ellipsis}.demo-banner{background:#322f21;border:1px solid #554c31;color:#dfcc91;padding:8px 13px;border-radius:9px;font-size:11px;margin-bottom:22px}.notice{padding:12px 15px;background:#2a3624;border:1px solid #4a623b;color:#ddf3c6;border-radius:10px;margin-bottom:18px;font-size:12px}.notice.error{background:#34231f;border-color:#694035;color:#f0c5b9}.access-hint{display:flex;align-items:center;gap:10px;padding:11px 14px;background:#20271f;color:#b6c4ab;font-size:12px;border-radius:10px;margin-bottom:18px}.access-hint svg{width:16px;height:16px}.music-grid{display:grid;grid-template-columns:minmax(320px, .95fr) minmax(350px,1.15fr);gap:24px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.player-card{padding:23px 28px 0;background:radial-gradient(ellipse at 30% 18%,#2c3227 0,transparent 63%),var(--panel)}.section-top{display:flex;justify-content:space-between;align-items:center;gap:10px}.section-top>.eyebrow{display:flex;align-items:center;gap:8px}.live-dot{width:5px;height:5px;border-radius:50%;background:#65705c}.live-dot.playing{background:var(--accent);box-shadow:0 0 10px #c8e6a530}.source-tag{font-size:8px;letter-spacing:1px;color:#b7c8a7;border:1px solid #445039;padding:4px 7px;border-radius:5px}.art-wrap{display:flex;justify-content:center;margin:28px 0 24px}.cover-art{position:relative;width:238px;aspect-ratio:1;overflow:hidden;isolation:isolate;border-radius:5px;background:#cec0a0;color:#303e27;box-shadow:0 18px 34px #0004;transform:rotate(-3deg)}.cover-art:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,#ffffff05 0px,#ffffff05 1px,transparent 1px,transparent 3px);pointer-events:none;z-index:5}.cover-orbit{position:absolute;width:270px;height:270px;border:29px solid #71805b;border-radius:50%;right:-168px;top:-80px;box-shadow:0 0 0 29px #9ba382,0 0 0 58px #b7b999}.cover-label{position:absolute;left:21px;top:21px;font-size:27px;font-weight:750;line-height:.98;letter-spacing:-1px;z-index:3}.record{position:absolute;width:178px;height:178px;border-radius:50%;bottom:-32px;right:-23px;background:repeating-radial-gradient(circle,#283022 0px,#283022 2px,#30382a 3px,#1a2118 4px);box-shadow:0 0 0 1px #0003,0 8px 15px #0004;display:grid;place-items:center}.record:after{content:"";position:absolute;width:100%;height:100%;border-radius:50%;background:conic-gradient(transparent,#ffffff0c,transparent,#ffffff0c,transparent)}.record-label{width:62px;height:62px;border-radius:50%;background:#b9784c;display:grid;place-items:center;color:#eadfbd;font-family:Georgia,serif;font-style:italic;font-size:29px;padding-bottom:5px}.cover-edition{position:absolute;font-size:6px;letter-spacing:2px;bottom:15px;left:15px;writing-mode:vertical-rl;transform:rotate(180deg)}.track-heading{display:flex;align-items:center;justify-content:center;gap:8px}.track-details h2{font-size:24px;text-align:center;line-height:1.2;overflow-wrap:anywhere}.track-details>p{font-size:12px;color:#a6b29c;text-align:center;margin-top:8px;min-height:18px}.track-heading .icon-button{width:22px;height:22px}.track-heading .icon-button svg{width:14px;height:14px}.progress-group{margin-top:23px}progress{appearance:none;width:100%;height:3px;border:0;border-radius:4px;background:#3c4436;display:block;overflow:hidden}progress::-webkit-progress-bar{background:#3c4436}progress::-webkit-progress-value{background:var(--accent);border-radius:4px}progress::-moz-progress-bar{background:var(--accent)}.time-labels{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#96a28c;margin-top:9px;font-variant-numeric:tabular-nums}.time-labels span:nth-child(2){font-size:9px;color:#75816e}.playback-controls{display:flex;align-items:center;justify-content:center;gap:25px;margin:19px 0 23px}.control-button{width:38px;height:38px;background:none;border:0;display:grid;place-items:center;border-radius:50%;color:#bccbb0}.control-button:hover{background:#34422c}.control-button svg{width:19px;height:19px}.next-button{background:var(--accent);color:#24341c;width:52px;height:52px;border-radius:50%;border:0;display:grid;place-items:center;box-shadow:0 5px 18px #b9e48913}.next-button:hover{background:#dcf4bf}.next-button svg{width:23px;height:23px}.volume-row{display:flex;align-items:center;gap:12px;max-width:224px;margin:0 auto 23px;color:#8e9c82}.volume-row svg{width:17px;height:17px}.volume-row output{font-size:10px;min-width:30px;text-align:right;font-variant-numeric:tabular-nums}.volume-row input{width:100%;height:3px;accent-color:#b9cba8;cursor:pointer}.player-footer{border-top:1px solid #343d2e;margin:0 -28px;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 12px;font-size:10px;color:#8f9f81}.player-footer svg{width:13px;height:13px}
.queue-card{padding:23px 24px 0;display:flex;flex-direction:column;min-height:635px;max-height:790px}.queue-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.queue-heading h2{font-size:23px;margin-top:8px;display:flex;align-items:center;gap:9px}.count-badge{border:1px solid #3a4433;padding:1px 7px;font-size:11px;font-weight:500;border-radius:6px;color:#aebe9f;letter-spacing:0}.queue-duration{font-size:10px;color:#88947e;white-space:nowrap}.queue-card form{margin-top:21px}.add-input{display:flex;align-items:center;background:#131712;border:1px solid #414c38;border-radius:10px;padding:7px 8px 7px 12px;gap:9px}.add-input>span{color:#829575}.add-input>span svg{width:16px;height:16px}.add-input input{min-width:0;flex:1;width:100%;background:none;border:0;color:var(--text);font-size:12px;padding:5px 0;outline:none}.add-input:focus-within{border-color:var(--accent);box-shadow:0 0 0 2px #c8e6a510}.add-input input::placeholder{color:#7d8b73}.add-button{width:31px;height:31px;border:0;border-radius:7px;background:var(--accent);color:#28381d;display:grid;place-items:center;flex-shrink:0}.add-button svg{width:18px;height:18px}.input-note{display:flex;align-items:center;gap:7px;margin:9px 3px 0;color:#79866f;font-size:7px;letter-spacing:1px}.input-note i{width:2px;height:2px;background:#63735a;border-radius:50%}.playlist-note{margin-left:auto;font-size:9px;letter-spacing:0;color:#89977e}.queue-tabs{display:flex;align-items:center;gap:20px;border-bottom:1px solid var(--line);margin-top:25px}.queue-tab{border:0;border-bottom:2px solid transparent;background:none;padding:0 0 12px;color:#84917b;font-size:11px;white-space:nowrap}.queue-tab.selected{color:var(--accent);border-color:var(--accent)}#list-summary{margin-left:auto;font-size:9px;color:#6e7c64;padding-bottom:12px}.track-list{list-style:none;margin:0;padding:4px 0;overflow:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#3f4d34 transparent}.track-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid #2c3428}.track-row:last-child{border-bottom:0}.track-number{font-size:10px;color:#6e7f62;width:12px;flex-shrink:0;font-variant-numeric:tabular-nums}.track-thumb{width:40px;height:40px;flex-shrink:0;border-radius:6px;display:grid;place-items:center;font-size:18px;color:#e4dbc9;background:radial-gradient(circle at 65% 30%,#83926d 0 17%,transparent 18%),linear-gradient(150deg,#b6b996,#53604d);overflow:hidden;position:relative}.track-thumb[data-color="1"]{background:linear-gradient(130deg,#b28766,#443a31)}.track-thumb[data-color="2"]{background:radial-gradient(circle at 60% 40%,#d8bb79 0 24%,transparent 25%),#53647c}.track-thumb[data-color="3"]{background:linear-gradient(140deg,#b3a7ba,#494052)}.track-thumb[data-color="4"]{background:radial-gradient(circle at 80% 75%,#b98668 0 45%,transparent 46%),#344e47}.track-row-text{min-width:0;flex:1}.track-row-title{font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#e1e6d9}.track-row-artist{font-size:10px;color:#88997b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.track-source{font-size:7px;letter-spacing:.7px;color:#849575;display:block;text-align:right;margin-top:4px}.track-row-time{color:#a6b599;font-size:10px;font-variant-numeric:tabular-nums;text-align:right;flex-shrink:0}.queue-footer{margin:auto -24px 0;border-top:1px solid var(--line);padding:14px 24px;display:flex;gap:8px;align-items:center;font-size:9px;color:#85967a}.queue-footer .status-dot{width:4px;height:4px;background:#718b5b}.queue-empty{margin:auto;text-align:center;padding:42px 12px}.empty-record{font-size:28px;color:#849a71;border:1px solid #3c4932;box-shadow:0 0 0 9px #252d20;width:55px;height:55px;border-radius:50%;display:grid;place-items:center;margin:0 auto 23px}.queue-empty h3{font-size:17px;color:#bfcdb4}.queue-empty p{font-size:11px;line-height:1.9;color:#869a77;margin-top:10px}.text-button{background:none;border:0;color:var(--accent);font-size:11px;padding:12px 0}.text-button:hover{color:#e7f9d3}.mini-stats{display:flex;align-items:center;gap:40px;margin-top:24px;padding:22px 4px;border-top:1px solid #2b3326}.mini-stats>div{display:flex;align-items:center;gap:12px}.mini-stats>div>span{background:#20281c;border:1px solid #303b28;border-radius:10px;width:36px;height:36px;display:grid;place-items:center;color:#9bb283}.mini-stats svg{width:17px;height:17px}.mini-stats strong{display:block;font-size:17px;font-weight:550;line-height:1.1;font-variant-numeric:tabular-nums}.mini-stats p span{display:block;font-size:9px;color:#87997a;margin-top:6px}.mini-stats button{margin-left:auto;white-space:nowrap}.page-footer{display:flex;justify-content:space-between;gap:12px;font-size:9px;color:#5f7053;border-top:1px solid #252d20;padding-top:18px;margin-top:9px}.empty-panel{text-align:center;padding:80px 20px;border:1px solid var(--line);border-radius:var(--radius)}.empty-panel>span{display:flex;justify-content:center;color:var(--accent);margin-bottom:20px}.empty-panel h2{font-size:25px}.empty-panel p{color:var(--muted);margin:12px auto 20px;max-width:420px}.secondary{padding:10px 17px;border:1px solid #516344;border-radius:9px;background:#283322;color:var(--accent)}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:23px}.stat-card{padding:22px;background:var(--panel);border:1px solid var(--line);border-radius:14px}.stat-card strong{display:block;font-size:35px;line-height:1.3;font-weight:500;letter-spacing:-1px;margin:13px 0 6px;font-variant-numeric:tabular-nums}.stat-card small{font-size:10px;color:#849778}.analytics-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:24px}.listening-panel,.sources-panel,.activity-panel,.system-panel{padding:24px}.analytics-grid h2{font-size:22px;margin-top:6px}.subtle-pill{font-size:10px;color:#a8b99a;border:1px solid #3c4933;border-radius:6px;padding:5px 8px;white-space:nowrap}.chart-caption{display:flex;align-items:center;gap:7px;color:#9bac8d;font-size:10px;margin-top:27px}.legend-dot,.youtube-dot,.spotify-dot{display:inline-block;width:7px;height:7px;border-radius:2px;background:var(--accent)}.activity-chart{height:155px;margin-top:13px;background:repeating-linear-gradient(to top,transparent 0,transparent 38px,#34422b66 38px,#34422b66 39px);display:flex;align-items:flex-end;gap:6px;padding-top:12px}.activity-chart svg{width:100%;height:100%;overflow:visible}.chart-axis{display:flex;justify-content:space-between;color:#788e69;font-size:9px;margin-top:10px}.chart-footnote{color:#748866;font-size:10px;line-height:1.7;margin-top:17px}.source-donut{position:relative;width:150px;height:150px;margin:21px auto}.source-donut svg{width:100%;height:100%;transform:rotate(-90deg)}.source-donut circle{fill:none;stroke-width:9}.donut-base{stroke:var(--warm)}.donut-fill{stroke:var(--accent);transition:stroke-dasharray .3s}.source-donut>div{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column}.source-donut strong{font-weight:500;font-size:30px}.source-donut span{font-size:8px;letter-spacing:1px;color:var(--muted);margin-top:3px}.source-row{display:flex;justify-content:space-between;font-size:11px;margin:12px 0;color:#b2c1a5}.source-row>span{display:flex;align-items:center;gap:8px}.source-row strong{font-size:12px;font-weight:500;color:var(--text)}.spotify-dot{background:var(--warm)}.sources-panel>small{display:block;font-size:9px;color:#7e926f;border-top:1px solid var(--line);padding-top:14px;margin-top:18px}.bottom-stats-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:24px;margin:24px 0}.activity-panel h2,.system-panel h2{font-size:19px}.recent-activity{padding:0;margin:16px 0 0;list-style:none}.recent-activity li{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #2c3726;font-size:11px;color:#bac9ae}.recent-activity li:last-child{border:0}.recent-activity li>span:first-child{background:#293522;color:#98b780;width:27px;height:27px;border-radius:7px;display:grid;place-items:center;flex-shrink:0}.recent-activity svg{width:13px;height:13px}.recent-activity .event-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recent-activity time{margin-left:auto;white-space:nowrap;color:#7e956e;font-size:9px}.system-panel h2{margin:7px 0 22px}.system-row{display:flex;justify-content:space-between;gap:8px;border-bottom:1px solid #2e3828;padding:11px 0;font-size:11px}.system-row>span{color:#94a785}.system-row strong{font-weight:500;color:#c5d7b4;font-variant-numeric:tabular-nums}
.boot{min-height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;color:var(--muted);font-size:13px}.boot .brand-mark{width:50px;height:50px;font-size:45px}.login-screen{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr;max-width:1200px;margin:auto;align-items:center;gap:50px;padding:70px 70px}.login-copy .brand{margin-bottom:90px}.login-copy>.eyebrow{color:#aabd9a}.login-copy h1{font-size:64px;line-height:1.05;letter-spacing:-3px;margin-top:23px}.login-copy>p{font-size:14px;color:#98a88c;line-height:1.9;max-width:360px;margin-top:25px}.primary{background:var(--accent);color:var(--accent-ink);padding:13px 20px;border-radius:10px;font-weight:600;display:inline-flex;align-items:center;gap:13px;font-size:13px}.login-button{margin-top:34px}.login-button>span:last-child{margin-left:15px}.login-copy>small{display:block;color:#74866a;line-height:1.9;font-size:10px;margin-top:20px}.login-art{text-align:center;background:radial-gradient(ellipse,#38432b,transparent 65%);padding:50px 0}.cover-art.large{width:340px;margin:auto;transform:rotate(8deg)}.cover-art.large .cover-label{font-size:42px;left:28px;top:30px}.cover-art.large .record{width:270px;height:270px;right:-38px;bottom:-50px}.cover-art.large .record-label{width:90px;height:90px;font-size:43px}.cover-art.large .cover-orbit{transform:scale(1.5)}.art-caption{display:block;font-size:8px;letter-spacing:2px;color:#85976f;margin-top:60px}.auth-card{max-width:540px;margin:15vh auto;padding:30px}.auth-card h1{font-size:32px}.auth-card p{color:var(--muted);margin:20px 0 30px}
@media(min-width:1500px){.main-content{padding:46px 58px 25px}.cover-art{width:262px}.queue-card{min-height:660px}.player-card{padding-top:27px}.art-wrap{margin-top:32px}.track-details h2{font-size:27px}}
@media(max-width:1150px){.app-shell{grid-template-columns:195px minmax(0,1fr)}.sidebar{padding-left:15px;padding-right:15px}.sidebar-bottom{margin-left:-15px;margin-right:-15px;padding-left:15px;padding-right:15px}.main-content{padding:28px 25px 20px}.music-grid{gap:18px;grid-template-columns:minmax(270px,.95fr) minmax(300px,1.05fr)}.player-card{padding-left:22px;padding-right:22px}.player-footer{margin-left:-22px;margin-right:-22px}.queue-card{padding-left:20px;padding-right:20px}.queue-footer{margin-left:-20px;margin-right:-20px;padding-left:20px}.cover-art{width:215px}.queue-heading>.queue-duration{display:none}#list-summary{display:none}.mini-stats{gap:22px}.room-pill{font-size:10px;max-width:180px}.page-header h1{font-size:29px}.page-header p{font-size:11px}.stats-grid{gap:12px}.stat-card{padding:17px}.stat-card .eyebrow{font-size:8px}.stat-card small{font-size:9px}.stat-card strong{font-size:30px}.analytics-grid,.bottom-stats-grid{gap:18px;grid-template-columns:1.4fr 1fr}.section-top .eyebrow{font-size:8px}}
@media(max-width:900px){.app-shell{grid-template-columns:1fr}.sidebar{height:auto;position:relative;display:grid;grid-template-columns:auto minmax(160px,1fr) auto;align-items:center;gap:18px;padding:18px 25px;border-right:0;border-bottom:1px solid var(--line)}.workspace{margin:0;max-width:250px}.workspace>label{display:none}.select-wrap{padding:6px 9px}nav{display:flex;margin:0;gap:5px}.nav-link{padding:10px}.nav-dot{display:none!important}.sidebar-note,.sidebar-bottom{display:none}.main-content{padding-top:28px}.music-grid{grid-template-columns:minmax(270px,.95fr) minmax(300px,1.05fr)}.page-header{margin-bottom:24px}.login-screen{padding:50px 35px;gap:25px}.login-copy h1{font-size:53px}.cover-art.large{width:270px}.login-copy .brand{margin-bottom:65px}}
@media(max-width:660px){.sidebar{padding:16px;grid-template-columns:auto 1fr;gap:14px}.brand{font-size:24px}.brand-mark{width:30px;height:30px;font-size:29px}.workspace{margin-left:auto;width:100%;max-width:220px}nav{grid-column:1/-1;justify-content:center;border-top:1px solid #303a28;padding-top:12px}.nav-link{padding:9px 22px;font-size:12px}.main-content{padding:25px 16px 18px}.page-header{display:block}.page-header h1{font-size:29px}.page-header p{font-size:11px;max-width:285px}.room-pill{display:inline-flex;margin-top:17px;padding:6px 11px;max-width:100%}.music-grid{grid-template-columns:1fr;gap:18px}.player-card{padding-top:22px}.cover-art{width:236px}.queue-card{min-height:440px;max-height:650px;padding-top:20px}.track-list{max-height:340px}.queue-empty{padding:35px 12px}.queue-heading>.queue-duration{display:block}.mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px 6px;padding:22px 0}.mini-stats>div{gap:8px}.mini-stats>div>span{width:29px;height:29px;border-radius:8px}.mini-stats svg{width:14px;height:14px}.mini-stats strong{font-size:15px}.mini-stats p span{font-size:8px}.mini-stats button{grid-column:1/-1;margin:auto;padding:3px}.page-footer{font-size:8px;align-items:center}.page-footer>span:first-child{max-width:170px}.stats-grid{grid-template-columns:1fr 1fr;gap:12px}.stat-card{padding:18px}.stat-card strong{font-size:31px}.analytics-grid,.bottom-stats-grid{grid-template-columns:1fr}.listening-panel,.sources-panel,.activity-panel,.system-panel{padding:20px}.source-donut{margin:20px auto}.bottom-stats-grid{margin-top:18px}.login-screen{display:block;padding:35px 25px}.login-copy .brand{margin-bottom:66px}.login-copy h1{font-size:54px}.login-copy>p{font-size:13px}.login-art{padding:42px 0 15px}.cover-art.large{width:220px}.cover-art.large .cover-label{font-size:30px;left:18px;top:18px}.cover-art.large .record{width:180px;height:180px}.cover-art.large .record-label{width:60px;height:60px;font-size:30px}.art-caption{margin-top:38px}.demo-banner{font-size:10px}.track-row{gap:10px}.queue-tabs{gap:20px}.user-mobile-logout{display:block}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

@media(max-width:900px){.sidebar-bottom{display:block;margin:0;border:0;padding:0}.sidebar-bottom .connection,.sidebar-bottom .avatar,.sidebar-bottom .user-row>div{display:none}.sidebar-bottom .user-row{padding:0}.sidebar{position:relative}.sidebar-bottom{position:absolute;right:18px;top:18px}}

.track-info{min-width:0;flex:1}.track-info strong{display:block;font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-info small{display:block;font-size:10px;color:var(--muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.track-duration{font-size:10px;font-variant-numeric:tabular-nums;color:#a6b599;min-width:32px;text-align:right}.track-thumb.color-1{background:linear-gradient(130deg,#b28766,#443a31)}.track-thumb.color-2{background:radial-gradient(circle at 60% 40%,#d8bb79 0 24%,transparent 25%),#53647c}.track-thumb.color-3{background:linear-gradient(140deg,#b3a7ba,#494052)}.track-thumb.color-4{background:radial-gradient(circle at 80% 75%,#b98668 0 45%,transparent 46%),#344e47}.activity-copy{flex:1;min-width:0}.activity-copy strong,.activity-copy small{display:block}.activity-copy strong{font-size:12px;font-weight:500;overflow-wrap:anywhere}.activity-copy small{font-size:10px;color:var(--muted);margin-top:4px}.activity-item{display:flex;align-items:center;gap:12px}.activity-item time{font-size:10px;color:var(--muted)}.activity-dot{width:6px;height:6px;background:var(--accent);border-radius:50%;flex-shrink:0}.activity-dot.error{background:#dca18c}.live-dot.idle,.status-dot.offline{background:#6e7966}

@media(max-width:900px){.sidebar{grid-template-columns:auto minmax(120px,1fr) auto auto}.sidebar-bottom{position:static}.sidebar-bottom .user-row{margin:0}}
@media(max-width:660px){.sidebar{grid-template-columns:auto minmax(100px,1fr) auto;gap:10px}.sidebar-bottom{grid-column:3;grid-row:1}.sidebar nav{grid-row:2;grid-column:1/-1}.workspace{max-width:220px}.select-wrap{min-width:0}.select-wrap select{max-width:100%}}