/* Each theme uses original artwork; softness is in the image, not a filter. */
:root{--desktop-wallpaper:url('os-assets/blue-flow-vivid.png');--touch-surface:#fcfdff;--touch-chrome:#eaf1fa;--touch-border:#dfe8f3;--touch-ink:#20304b}
.wallpaper{inset:0;background-image:var(--desktop-wallpaper);filter:none;transform:none}
html[data-theme=night]{--desktop-wallpaper:url('os-assets/night-waves-soft.png');--touch-surface:#202226;--touch-chrome:#292c31;--touch-border:#454a54;--touch-ink:#edf0f6;color-scheme:dark}
html[data-theme=night] .taskbar{background:transparent;color:#e4e5e8}
html[data-theme=night] :is(.dock,.system-tray){background:rgba(38,39,43,.9);border-color:#ffffff16}
html[data-theme=night] .dock-button>svg{color:#c8cbd4}
html[data-theme=night] .dock-button:hover,html[data-theme=night] .dock-button.active{background:#ffffff17}
html[data-theme=dawn]{--accent:#586476;--desktop-wallpaper:url('os-assets/pearl-silver.png');--touch-surface:#f6f5f8;--touch-chrome:#e4e3e9;--touch-border:#d6d3df;--touch-ink:#3c3a49}
html[data-theme=dawn] .taskbar{background:transparent;color:#414855}
html[data-theme=dawn] :is(.dock,.system-tray){background:linear-gradient(110deg,#dce5eef2,#eee6dff2 52%,#dedcebf2);border-color:#ffffffe0}
html[data-theme=dawn] .dock-button>svg{color:#6c7080}
html[data-theme=dawn] .dock-button.active:after{background:#7c8099}
html[data-theme=dawn] .desktop-header,html[data-theme=dawn] .glass-button,html[data-theme=dawn] .clock-widget,html[data-theme=dawn] .clock-widget p,html[data-theme=dawn] .mobile-status,html[data-theme=dawn] .desktop-icon{color:#354052}
html[data-theme=dawn] .desktop-icon .icon-label{text-shadow:0 1px 2px #ffffff80}
html[data-theme=dawn] .clock-widget>span,html[data-theme=dawn] .desktop-caption,html[data-theme=dawn] .desktop-caption>small{color:#667181}
.theme-preview,.workspace-preview{filter:none;background:url('os-assets/blue-flow-vivid.png') center / cover}
.theme-preview.theme-night,.workspace-preview.theme-night{background-image:url('os-assets/night-waves-soft.png')}
.theme-preview.theme-dawn,.workspace-preview.theme-dawn{background-image:url('os-assets/pearl-silver.png')}
html[data-ui=touch][data-size=tablet] .desktop-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
html[data-ui=touch][data-size=phone] .desktop-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
html[data-ui=touch][data-size=phone] .dock{justify-content:flex-start;gap:4px}
html[data-ui=touch][data-size=phone] .dock-button{width:48px;min-width:48px}
html[data-ui=touch][data-size=phone] .dock-button .app-art{width:43px;height:43px;border-radius:13px}
html[data-ui=touch][data-size=phone] .desktop-header{right:12px;max-width:calc(100% - 24px)}
html[data-ui=touch][data-size=phone] .header-actions{gap:3px}
html[data-ui=touch][data-size=phone] .workspace-trigger{max-width:43vw}
html[data-ui=touch] .window-controls{display:flex}
html[data-ui=touch] .window-controls [data-window-action=maximize]{display:none}
html[data-ui=touch] .window-controls [data-window-action=minimize]{display:grid;place-items:center;width:38px;min-width:38px;color:var(--touch-ink)}
html[data-ui=touch] .window-controls button{width:32px}
html[data-ui=touch] .window-controls [data-window-action=close]{display:grid;width:42px;min-width:42px;color:var(--touch-ink)}
html[data-ui=touch] :is(.window-content,.window-content>.settings-shell,.window-content>.store-shell,.window-content>.notes-shell,.window-content>.calculator-shell,.window-content>.focus-shell,.window-content>.calendar-shell){background:var(--touch-surface);color:var(--touch-ink)}
html[data-size=phone] .browser-zoom-tools{display:none}
html[data-size=phone] .browser-mode-actions [data-browser-action=external]{display:none}
html[data-ui=touch] .desktop-account{font-size:12px;text-decoration:none;white-space:nowrap}
.desktop-account{display:flex;align-items:center;gap:8px;text-decoration:none}
.browser-server-picker{display:flex;align-items:center;gap:4px;min-width:0}
.browser-server-picker select{max-width:230px;min-width:0;background:#ffffff90;border:1px solid #d7e2ef;border-radius:6px;padding:4px;color:#476586;font-size:12px}
.browser-connection-bar{gap:8px;flex-wrap:wrap;min-height:38px;height:auto;padding-block:5px}
.browser-connection-bar>.browser-mode-actions{margin-left:auto}
@media(max-width:700px){.browser-connection-bar>button{max-width:180px;overflow:hidden}.browser-server-picker select{max-width:200px}}
html[data-size=phone] .browser-connection-bar>.browser-server-picker{flex-basis:100%}
html[data-size=phone] .browser-connection-bar>.browser-server-picker select{flex:1;max-width:none}
html[data-size=phone] .browser-connection-bar>button{min-width:0;flex:1;max-width:none}
html[data-size=phone] .browser-connection-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-size=phone] .browser-mode-actions{flex-shrink:0}
@media(max-height:550px){html[data-ui=touch] .clock-widget{padding:20px 9px}html[data-ui=touch] .clock-widget>time{font-size:48px}html[data-ui=touch] .taskbar{height:62px;bottom:16px}html[data-ui=touch] #desktop{bottom:90px}}