:root{--bg:#111214;--panel:#1b1c20;--line:#2b2c31;--muted:#919198;--orange:#ff8454;--white:#f6f3ee}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--white);font:14px 'DM Sans',sans-serif}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button{border:0;background:none}button:hover{filter:brightness(1.2)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--orange);outline-offset:4px}a{color:inherit;text-decoration:none}aside{width:222px;position:fixed;inset:0 auto 90px 0;border-right:1px solid var(--line);padding:34px 24px}.brand{display:flex;align-items:center;gap:9px;font:800 29px Manrope}.brand> :first-child{color:var(--white)}.dot,h1>span{color:var(--orange)}.nav-label{font-size:10px;letter-spacing:1.8px;color:#686970;margin:55px 12px 20px}.nav{display:flex;align-items:center;gap:15px;width:100%;text-align:left;padding:14px 15px;border-radius:8px;color:var(--muted);margin:5px 0;font-size:17px}.nav span{font-size:13px}.nav.active{background:#30231f;color:var(--orange)}.nav small{margin-left:auto;font-size:10px}.side-bottom{position:absolute;bottom:24px;left:28px;right:24px}.tiny-wave{color:var(--orange);margin-bottom:16px}.side-bottom b{font-size:12px}.side-bottom p{font-size:11px;color:var(--muted)}.profile{border-top:1px solid var(--line);padding-top:24px;margin-top:28px;display:flex;gap:12px;align-items:center;font-size:12px}.profile>span,.avatar{display:grid;place-items:center;background:#37332e;border:1px solid #565048;border-radius:50%;width:36px;height:36px}.profile small{display:block;font-size:10px;color:var(--muted);margin-top:5px}main{margin-left:222px;padding:39px 42px 116px;max-width:1650px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:1.7px;color:var(--muted)}h1{font:700 32px Manrope;margin:9px 0}p{color:var(--muted);line-height:1.6}header p{margin:6px 0}.header-right{display:flex;align-items:center;gap:24px}.online{font-size:10px;letter-spacing:1px;color:#a8bda0}.online::first-letter{color:#a3d691}.dashboard{display:grid;grid-template-columns:1fr 300px;gap:22px}.hero{height:330px;background:#333a35;border-radius:14px;position:relative;overflow:hidden;padding:26px 30px;background:radial-gradient(ellipse at 74% 52%,#78837333,transparent 50%),#303934}.hero-top{display:flex;justify-content:space-between;position:relative;z-index:1}.pill{font-size:9px;letter-spacing:1.2px;border:1px solid #657166;border-radius:4px;padding:7px 10px;color:#d8e0d3}.hero-num{color:#b8c0b4;font-size:10px}.hero-content{position:relative;z-index:1;margin-top:23px}.hero-content .eyebrow{font-size:8px;color:#b5c0b4}.hero h2{font:600 37px/1.14 Manrope;letter-spacing:-1.2px;margin:12px 0}.hero p{font-size:12px;color:#bdc5bb;line-height:1.7}.primary{background:var(--orange);color:#21180f;padding:12px 19px;border-radius:7px;font-size:12px;font-weight:700}.hero-bottom{position:absolute;bottom:20px;font-size:8px;letter-spacing:1px;color:#a8b3a9}.hero-bottom span{margin-left:14px;letter-spacing:.2px}.vinyl{width:292px;height:292px;border-radius:50%;position:absolute;right:-30px;top:60px;background:repeating-radial-gradient(circle,#141816 0px,#141816 2px,#303631 3px,#141816 4px);box-shadow:-15px 15px 30px #10151060;display:grid;place-items:center;transform:rotate(-18deg)}.vinyl-core{width:118px;height:118px;border-radius:50%;background:#d3dbb9;color:#2c382a;display:grid;place-content:center;text-align:center}.vinyl-core span{font:800 55px Manrope}.vinyl-core small{font-size:7px;letter-spacing:2px}.widgets{display:flex;flex-direction:column;gap:20px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:13px}.weather,.alarm{padding:22px;flex:1}.section-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#c4c3c5}.section-top button{font-size:20px;color:var(--muted)}.weather-main{display:flex;align-items:center;gap:13px;margin:19px 0}.sun{font-size:38px;color:#dfbc77}.weather-main strong{font:500 36px Manrope;letter-spacing:-1px}.weather-main b{font-size:12px}.weather-main small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.weather-footer,.alarm-footer{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.alarm-main{display:flex;justify-content:space-between;align-items:center;margin:18px 0}.alarm-main input{background:none;color:var(--white);border:0;font:500 34px Manrope;width:143px;color-scheme:dark}.alarm-main input::-webkit-calendar-picker-indicator{display:none}.toggle{width:34px;height:20px;border-radius:20px;background:#38393e;padding:3px}.toggle:before{content:'';display:block;width:14px;height:14px;background:#9b9ba1;border-radius:50%;transition:transform .2s}.toggle.on{background:var(--orange)}.toggle.on:before{transform:translateX(14px);background:#171718}.alarm-footer button{font-size:10px;color:#b9b9bf}.discover{margin-top:32px}.section-title{display:flex;justify-content:space-between;align-items:center}h2{font:700 20px Manrope;margin:0}.section-title p{font-size:12px;margin:6px 0}.search{display:flex;gap:12px;align-items:center;color:var(--muted);background:#1b1c20;border:1px solid var(--line);border-radius:8px;padding:11px 13px;font-size:22px}.search input{border:0;background:none;color:var(--white);outline:none;width:195px;font-size:12px}.search kbd{font-size:9px;border:1px solid #38393e;padding:3px;border-radius:3px}.genres{display:flex;gap:9px;margin:21px 0}.genres button{padding:8px 17px;border:1px solid var(--line);border-radius:20px;font-size:11px;color:#a4a4aa}.genres button.active{background:var(--white);border-color:var(--white);color:#1a1b1c}.stations{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.station{background:#1b1c20;border:1px solid var(--line);border-radius:11px;padding:14px;position:relative;transition:.2s}.station:hover{border-color:#5e5147;transform:translateY(-3px)}.station.selected{border-color:var(--orange)}.station-art{height:119px;border-radius:7px;display:grid;place-items:center;position:relative;overflow:hidden;background:var(--art);font:800 27px Manrope;letter-spacing:-1px;color:var(--ink);text-align:center}.station-art:before{content:'';position:absolute;width:180px;height:180px;border:1px solid currentColor;border-radius:50%;opacity:.12;transform:translate(50px,50px)}.station-art b{z-index:1;max-width:90%;line-height:1.1}.station-art .station-start{position:absolute;bottom:9px;right:9px;width:30px;height:30px;border-radius:50%;background:#151617dd;color:white;display:grid;place-items:center;font-size:11px}.station-title{display:flex;justify-content:space-between;align-items:center;margin-top:13px}.station-title b{font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.favorite{color:#a7a5a7;font-size:19px}.favorite.saved{color:var(--orange)}.station p{font-size:10px;margin:4px 0 12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.station-meta{display:flex;justify-content:space-between;font-size:8px;color:#9c9c9f}.station-meta>span:first-child{border:1px solid #36363d;padding:3px 5px;border-radius:4px}.station-meta>span:last-child{color:#acbca0;padding:3px}.list-footer{display:flex;justify-content:space-between;font-size:10px;color:#72737b;margin-top:16px}.list-footer button{font-size:11px;color:#bab8b4}.sound{margin-top:27px;padding:24px}.sound-heading{display:flex;justify-content:space-between;align-items:center}.sound h2{font-size:17px;margin-top:6px}.vizselect{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:12px}select{background:#26272c;border:1px solid #383940;border-radius:6px;padding:8px;color:#ddd;font-size:11px}.sound-body{display:flex;margin-top:24px;gap:38px}.preset-area{width:235px;border-right:1px solid var(--line);padding-right:24px}.preset-area p{margin:0 0 12px;font-size:11px}.preset-area small{color:#73747c;font-size:9px;line-height:1.5;display:block;margin-top:16px}#presets{display:flex;flex-wrap:wrap;gap:7px}#presets button{font-size:10px;border:1px solid #38393e;border-radius:5px;padding:7px 10px;color:var(--muted)}#presets button.active{border-color:#82503c;color:var(--orange);background:#33241e}.equalizer{display:flex;flex:1;justify-content:space-between;gap:15px}.band{display:flex;flex-direction:column;align-items:center;gap:9px;font-size:9px;color:#a1a1a8}.band input{writing-mode:vertical-lr;direction:rtl;appearance:auto;width:4px;height:85px;accent-color:var(--orange)}.band output{color:#777880;font-size:8px}footer{display:flex;gap:20px;align-items:center;margin-top:25px;color:#777880;font-size:13px;font-weight:700}footer span,footer div{font-size:9px;font-weight:400}footer div{margin-left:auto}.player{position:fixed;bottom:0;left:0;right:0;height:86px;background:#1c1d21ee;backdrop-filter:blur(20px);border-top:1px solid #393a40;display:flex;align-items:center;padding:16px 29px;gap:17px;z-index:10}.now-art{height:49px;width:49px;background:#d9e5c1;color:#34462c;border-radius:7px;display:grid;place-items:center;font:800 23px Manrope}.now-info{width:160px}.now-info b{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.now-info small{font-size:10px;color:var(--muted);display:block;margin-top:6px}.icon{font-size:18px;color:#aaaab1}.controls{display:flex;align-items:center;gap:22px;margin-left:auto;margin-right:34px}.play{height:43px;width:43px;background:var(--orange);color:#1a1715;border-radius:50%;font-size:16px}canvas{width:160px;height:40px}.status{font-size:8px;color:#98999e;letter-spacing:1px;min-width:100px}.volume{display:flex;align-items:center;gap:10px;font-size:23px;color:#aaa}.volume input{width:90px;accent-color:var(--orange);height:3px}#toast{position:fixed;bottom:104px;left:50%;transform:translateX(-50%);background:#35322c;border:1px solid #6a5947;border-radius:8px;padding:12px 22px;font-size:12px;z-index:30;display:none;max-width:90vw}dialog{background:var(--panel);color:var(--white);border:1px solid #45454a;border-radius:16px;padding:30px;max-width:430px;width:90vw}dialog::backdrop{background:#000a;backdrop-filter:blur(5px)}dialog h2{font-size:22px;line-height:1.4}dialog p{font-size:12px}dialog label{display:block;font-size:12px;margin:18px 0}dialog select{display:block;width:100%;margin-top:8px}dialog .primary{margin-top:15px}.close{float:right;font-size:24px}.empty{grid-column:1/-1;padding:35px;border:1px dashed #414148;border-radius:10px;color:var(--muted);text-align:center}.error-retry{color:var(--orange)}@media(min-width:1400px){.hero{height:350px}.vinyl{right:15px;width:320px;height:320px}.station-art{height:145px}}@media(max-width:1100px){aside{width:185px;padding:30px 17px}main{margin-left:185px;padding:30px 25px 115px}.dashboard{grid-template-columns:1fr 260px}.vinyl{right:-85px}.stations{gap:10px}.station-art{font-size:22px;height:100px}.status{display:none}.controls{margin-right:0}.sound-body{gap:20px}}@media(max-width:800px){aside{display:none}main{margin-left:0;padding:24px 20px 110px}.dashboard{grid-template-columns:1fr}.hero{height:320px}.vinyl{right:5px}.widgets{flex-direction:row}.weather,.alarm{width:50%;padding:17px}.header-right .online{display:none}h1{font-size:28px}.stations{grid-template-columns:repeat(2,1fr)}.station-art{height:140px}.section-title{align-items:flex-start;gap:15px;flex-direction:column}.search{width:100%}.search input{flex:1}.genres{overflow:auto;white-space:nowrap}.sound-body{flex-direction:column}.preset-area{width:100%;border:0;padding:0}.equalizer{padding-top:15px}.sound-heading{align-items:flex-start;gap:15px;flex-direction:column}.player{padding:12px 16px;gap:10px}.now-info{width:110px}.now-info small{font-size:8px}.controls{gap:10px;margin:0 0 0 auto}canvas,.volume,#nowFav{display:none}footer span{display:none}.weather-main{gap:7px}.weather-main strong{font-size:30px}.sun{font-size:28px}.alarm-main input{font-size:30px;width:125px}}@media(max-width:430px){.vinyl{right:-90px;opacity:.8}.hero h2{font-size:35px}.hero-content{max-width:240px}.weather-main{flex-wrap:wrap}.weather-main div{width:100%}.weather,.alarm{min-height:178px}.station-art{height:115px}.equalizer{gap:6px}.now-art{width:38px;height:38px}.controls .icon{font-size:13px}.player #sleep{font-size:16px}}

.sound canvas{display:block;width:100%;height:52px;margin-top:15px;background:#16171a;border-radius:7px}.sound-body{margin-top:16px}

@media(max-width:800px){.hero{height:350px}}

.groups{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 0}.groups button{font-size:11px;color:#aaa;padding:9px 14px;border:1px solid #383940;border-radius:7px}.groups button.active{background:#35251e;color:var(--orange);border-color:#87533c}.genres{margin-top:14px}#more[hidden]{display:none}

.live-clock{text-align:right}.live-clock strong{display:block;font:600 24px Manrope;font-variant-numeric:tabular-nums;letter-spacing:1px}.live-clock small{font-size:8px;color:var(--muted);letter-spacing:1.5px}#locationDialog input{width:100%;margin-top:8px;padding:12px;background:#26272c;color:white;border:1px solid #444;border-radius:6px}#cityResults button{display:block;text-align:left;width:100%;padding:12px;border-bottom:1px solid var(--line);font-size:12px}#cityResults{font-size:12px;color:var(--muted);margin-top:12px}#testAlarm{padding:12px;border:1px solid #555;border-radius:6px;margin-right:10px}.alarm-banner{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);z-index:20;background:#35251f;border:1px solid var(--orange);border-radius:12px;padding:20px;display:flex;align-items:center;gap:18px;width:min(640px,94vw);box-shadow:0 12px 40px #0008}.alarm-banner[hidden]{display:none}.alarm-banner small{display:block;color:#c7b5aa;font-size:11px;margin-top:7px}.alarm-banner button{border:1px solid #87604b;border-radius:7px;padding:10px;color:var(--orange);white-space:nowrap}.alarm-banner div{flex:1}@media(max-width:800px){.header-right{gap:10px}.live-clock strong{font-size:18px}.header-right .avatar{display:none}.alarm-banner{flex-wrap:wrap}.alarm-banner div{flex-basis:100%}}

@keyframes record-spin{from{transform:rotate(-18deg)}to{transform:rotate(342deg)}}.vinyl{animation:record-spin 18s linear infinite;animation-play-state:paused}.vinyl.spinning{animation-play-state:running}@media(prefers-reduced-motion:reduce){.vinyl{animation:none}}

.mobile-nav{display:none}@media(max-width:800px){.mobile-nav{display:flex;align-items:center;gap:8px;margin-bottom:24px}.mobile-brand{font:800 20px Manrope;color:var(--orange);margin-right:auto}.mobile-nav button{min-height:44px;padding:8px;font-size:11px;border-radius:7px}.mobile-nav button.active{background:#35251f;color:var(--orange)}.player{display:grid;grid-template-columns:40px 1fr auto;height:110px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));gap:8px 12px}.now-art{grid-row:1;grid-column:1}.now-info{grid-row:1;grid-column:2;width:100%;max-width:165px}.controls{grid-row:1;grid-column:3;margin:0;gap:12px}.controls .icon{min-width:28px;min-height:40px}.play{width:46px;height:46px}.volume{display:flex;grid-row:2;grid-column:2;font-size:20px;min-height:30px}.volume input{height:5px;width:100%;max-width:150px}#sleep{grid-row:2;grid-column:3;min-height:36px;justify-self:end;min-width:44px}main{padding-bottom:150px}.alarm-banner{bottom:125px}.genres button,.groups button{min-height:40px}.favorite{min-width:36px;min-height:36px}.weather-footer{gap:10px;line-height:1.5}.live-clock{min-width:83px}header{gap:12px}.header-right{flex-shrink:0}.equalizer .band{min-width:27px}.band input{width:22px;height:100px}.alarm-main input{min-height:44px}.toggle{min-width:40px;width:40px;height:24px}.toggle.on:before{transform:translateX(18px)}.toggle:before{width:18px;height:18px}dialog{max-height:85dvh;overflow:auto}}@media(max-width:420px){main{padding-left:14px;padding-right:14px}.mobile-brand{font-size:18px}.mobile-nav{gap:3px}.mobile-nav button{padding:7px;font-size:10px}h1{font-size:24px}.live-clock strong{font-size:16px}.hero{padding-left:22px}.hero-content .eyebrow{font-size:7px}.station{padding:10px}.station-art{font-size:22px}.sound{padding:18px 12px}.equalizer{gap:2px}.now-info{max-width:125px}.controls{gap:4px}.alarm-main input{width:113px;font-size:27px}.weather-main strong{font-size:28px}.weather-footer{flex-wrap:wrap}}
.station{min-width:0}.station-title b{min-width:0}.station-art{min-width:0}@media(max-width:800px){.stations{grid-template-columns:repeat(2,minmax(0,1fr))}.station-art b{overflow-wrap:anywhere}.genres{max-width:100%}}
@media(max-width:800px){.dashboard{grid-template-columns:minmax(0,1fr)}.hero,.widgets{min-width:0}}@media(max-width:360px){.widgets{flex-direction:column}.weather,.alarm{width:100%;min-height:150px}.weather-main div{width:auto}.hero h2{font-size:31px}.hero-content{max-width:210px}.hero-bottom{font-size:7px}.header-right{align-self:flex-start}.live-clock strong{font-size:15px}}

.install-card{display:flex;align-items:center;gap:14px;background:#202225;border:1px solid #343638;border-radius:18px;padding:18px;margin-bottom:24px}.install-card img{border-radius:12px}.install-card div{flex:1}.install-card small{display:block;color:#aaa;margin-top:6px}.quick-access{margin-bottom:24px}.quick-access h3{font-size:16px;margin:16px 0 10px}.quick-row{display:flex;gap:10px;overflow:auto;padding-bottom:8px}.quick-row button{flex:0 0 auto;background:#252729;color:#f7f3ef;border:1px solid #414345;border-radius:12px;padding:12px 16px;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quick-row button:hover{border-color:#ff8454}@media(max-width:480px){.install-card{flex-wrap:wrap;padding:14px}.install-card .primary{width:100%}.install-card b{font-size:15px}.install-card small{font-size:12px}}[hidden]{display:none!important}

.player-eq{border:1px solid #655044;border-radius:8px;color:var(--orange);font-size:11px;font-weight:700;min-width:42px;min-height:40px;padding:8px}.player-eq.adjusted{background:#35251f;border-color:var(--orange)}#equalizerDialog{width:min(740px,94vw);max-width:740px;padding:20px;max-height:85dvh;overflow:auto}#equalizerDialog .sound{margin:0;border:0;padding:10px;background:none}#equalizerDialog .close{position:absolute;right:15px;top:10px;float:none;min-width:40px;min-height:40px}#equalizerDialog .sound-heading{padding-right:25px}#equalizerDialog .band{display:flex;margin:0;flex:1;min-width:0}#equalizerDialog .vizselect{display:flex;margin:0}#equalizerDialog .band input{height:130px;width:24px}#equalizerDialog .preset-area{flex-shrink:0}@media(max-width:800px){.player-eq{grid-row:2;grid-column:1;justify-self:start;min-width:40px;min-height:36px}#equalizerDialog{padding:16px}#equalizerDialog .sound-body{gap:16px}#equalizerDialog .equalizer{gap:3px}#equalizerDialog .sound-heading{padding-right:25px}#equalizerDialog .band input{height:115px}}

.player-volume{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:120px}.player-volume .volume{display:flex;margin:0}.player-volume #visualizer{display:block;width:120px;height:24px;border-radius:5px;background:#151619}.player-volume .volume input{width:90px}@media(max-width:800px){.player{height:132px}.player-volume{grid-row:2;grid-column:2;align-items:flex-start;min-width:0;width:100%;gap:0}.player-volume .volume{min-height:26px;width:100%;gap:8px}.player-volume .volume input{flex:1;min-width:0;max-width:150px}.player-volume #visualizer{display:block;width:100%;max-width:174px;height:26px}.player-eq,#sleep{align-self:center}main{padding-bottom:172px}.alarm-banner{bottom:145px}#toast{bottom:148px}}

.brand-icon{display:block;flex-shrink:0;border-radius:8px;object-fit:contain}.brand{gap:8px}.brand .brand-icon{width:38px;height:38px}.mobile-brand{align-items:center;gap:6px}@media(max-width:800px){.mobile-brand{display:flex}.mobile-brand .brand-icon{width:28px;height:28px}}@media(max-width:360px){.mobile-brand{font-size:16px;gap:4px}.mobile-brand .brand-icon{width:24px;height:24px}}

.channel-tools{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:20px 0}.channel-tools span{color:#999;font-size:13px}.channel-action{padding:8px 0;color:#ff8454;font-size:12px}.channel-row{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #333}.channel-row button{color:#ff8454;flex-shrink:0}#channelList{max-height:300px;overflow:auto;margin:20px 0}#channelError{color:#ff8454}#channelDialog{max-height:85vh;overflow:auto}#channelDialog input{width:100%}

.manual-channel{margin:16px 0;color:#aaa;font-size:13px}.manual-channel summary{cursor:pointer}#channelMatches{max-height:260px;overflow:auto}#channelError{display:block;margin:12px 0}#findChannel:disabled{opacity:.6}

.channel-row>div{display:flex;gap:14px}.channel-row span{overflow-wrap:anywhere;min-width:0}.channel-row>div{flex-shrink:0}#editChannelDialog{max-width:420px}#editChannelDialog input{width:100%}.groups{max-height:120px;overflow:auto}