body.screen-app{background:var(--os);color:var(--os-ink)}
.screen-app main{margin:0}.screen-app .home-os{box-shadow:none;margin:0}
.screen-app input[type=range]{min-height:44px}
.screen-app .toast{font-size:16px}.screen-app .os-content{scrollbar-color:#667d5c var(--os)}
@media(min-width:1000px){
html:has(.screen-app),body.screen-app{width:100vw;height:100dvh;overflow:hidden}
.screen-app .home-os{width:1280px;max-width:none;height:800px;padding:24px 32px 20px;border:0;border-radius:0;display:flex;flex-direction:column}
.screen-app .os-topbar{min-height:48px;flex-shrink:0}.screen-app .os-brand{font-size:27px}.screen-app .os-brand>span,.screen-app .mode-indicator{font-size:16px}
.screen-app .os-navigation{margin:16px 0 22px;padding-bottom:16px;flex-shrink:0}.screen-app .os-navigation button{min-height:52px;font-size:18px;padding:12px 23px}.screen-app .os-navigation img{width:23px;height:23px}
.screen-app .os-content{flex:1;min-height:0;overflow:auto;padding:0 3px 8px}.screen-app .os-bottom{font-size:16px;flex-shrink:0;padding-top:14px;margin-top:14px}
.screen-app .os-subtle,.screen-app .clock>span,.screen-app .clock p,.screen-app .weather-card>span,.screen-app .weather-card>small,.screen-app .now-info>p,.screen-app .now-info>.os-subtle,.screen-app .device-disclosure,.screen-app .os-text,.screen-app .scene-row>span,.screen-app .scene-row>button,.screen-app .music-note,.screen-app .music-feature>p,.screen-app .playback-times,.screen-app .volume-row output,.screen-app .upload-button,.screen-app .music-library>.os-subtle,.screen-app .track-title>small,.screen-app .track-length,.screen-app .saved-state,.screen-app .device-heading>div>span,.screen-app .device-card>label,.screen-app .device-card>.os-subtle,.screen-app .range-endpoints,.screen-app .connection-note p,.screen-app .timer-setup>label,.screen-app .timer-input>span,.screen-app .timer-presets button,.screen-app .os-primary,.screen-app .os-secondary{font-size:16px}
.screen-app .clock strong{font-size:80px}.screen-app .dashboard-top{margin-bottom:22px}.screen-app .weather-card{min-width:340px}.screen-app .weather-card>strong{font-size:44px}
.screen-app .dashboard-grid{grid-template-columns:1.1fr 1fr}.screen-app .now-playing{grid-template-columns:160px 1fr;padding:24px;gap:24px}.screen-app .album{width:160px;height:160px}.screen-app .album small{font-size:14px}.screen-app .now-info h3{font-size:28px}.screen-app .home-glance{padding:24px}.screen-app .glance-heading h3{font-size:24px}.screen-app .glance-controls{margin-top:18px}.screen-app .glance-device{min-height:100px}.screen-app .glance-device>span{font-size:17px}.screen-app .glance-device>strong{font-size:23px}
.screen-app .round-play{width:52px;height:52px}.screen-app .os-icon{width:48px;height:48px}.screen-app .scene-row{margin-top:24px;gap:12px}.screen-app .scene-row>button{min-height:48px}.screen-app .scene-status{font-size:15px}
.screen-app .music-layout{padding:8px 16px;gap:7%}.screen-app .large-art{width:180px;height:180px}.screen-app .music-feature h3{font-size:28px}.screen-app .playlist{max-height:290px}.screen-app .playlist-track{min-height:78px}.screen-app .track-title>strong{font-size:19px}.screen-app .panel-heading h3{font-size:27px}.screen-app .music-controls .round-play{width:58px;height:58px}
.screen-app .device-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.screen-app .device-card{min-height:250px;padding:24px 18px}.screen-app .device-heading{gap:9px;margin-bottom:34px}.screen-app .device-heading h4{font-size:20px}.screen-app .temperature-control>strong{font-size:44px}.screen-app input[type=range]{height:44px}.screen-app input[type=range]::-webkit-slider-thumb{width:22px;height:22px;margin-top:-9px}.screen-app .switch{width:44px;height:28px;padding:4px}.screen-app .switch>i{width:20px;height:20px}.screen-app .switch[aria-checked=true]>i{transform:translateX(16px)}
.screen-app .timer-layout{padding:36px 26px}.screen-app .timer-layout h3{font-size:32px}.screen-app .timer-display{font-size:108px;margin-top:40px}.screen-app .timer-input input{font-size:30px}.screen-app .timer-presets button{min-height:48px}.screen-app .timer-actions button{min-height:52px}
}

@media(min-width:1000px) and (max-height:650px){.screen-app .clock strong{font-size:65px}.screen-app .dashboard-top{margin-bottom:17px}.screen-app .now-playing{padding:18px;grid-template-columns:130px 1fr}.screen-app .album{width:130px;height:130px}.screen-app .home-glance{padding:18px}.screen-app .glance-controls{margin-top:13px}.screen-app .glance-device{min-height:85px}.screen-app .scene-row{margin-top:16px}.screen-app .os-navigation{margin:10px 0 16px;padding-bottom:12px}}

@media(max-width:760px){
.screen-app .os-icon,.screen-app .round-play{min-width:44px;min-height:44px}.screen-app .os-navigation button,.screen-app .scene-row>button,.screen-app .timer-presets button,.screen-app .upload-button{min-height:44px}
.screen-app .device-heading{display:grid;grid-template-columns:24px 1fr;gap:7px;align-items:start;margin-bottom:18px}.screen-app .device-heading>img{grid-column:1;grid-row:1}.screen-app .device-heading>div{grid-column:2;min-width:0}.screen-app .device-heading .switch{position:relative;top:auto;right:auto;grid-column:1/-1;justify-self:end;width:44px;height:44px;padding:0;background:transparent;margin-top:3px}
.screen-app .device-heading .switch::before{content:'';position:absolute;width:34px;height:20px;border-radius:12px;left:5px;top:12px;background:#4c5a4e}.screen-app .device-heading .switch[aria-checked=true]::before{background:#8fae72}.screen-app .device-heading .switch>i{position:absolute;left:7px;top:14px;width:16px;height:16px}.screen-app .device-heading .switch[aria-checked=true]>i{transform:translateX(14px)}.screen-app .device-card:nth-child(-n+2) .device-heading{margin-bottom:10px}
.screen-app .temperature-control>.os-icon{width:44px;height:44px}.screen-app .temperature-control>strong{font-size:26px}.screen-app .device-card{min-height:210px}.screen-app .mini-player{gap:3px}
}
@media(max-width:370px){.screen-app .device-grid{grid-template-columns:1fr}.screen-app .os-navigation button img{display:none}.screen-app .os-navigation button{padding:9px 10px}}
