/* MobileDesk uses MirrorDesk's brand geometry; app tools stay in the header. */
:root{--app-header-height:80px}
.topbar,.desktop-mode .topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:24px;height:var(--app-header-height);padding:0 32px;background:#0b121bf5;color:#eff8fb;border-bottom:1px solid #2b3c4d88}
.topbar .brand{display:flex;align-items:center;gap:11px;flex-shrink:0;min-width:0}
.topbar .brand-mark{display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;padding:0;border:0;border-radius:0;background:transparent;color:#20cee2}
.topbar .brand-mark svg{display:block;width:40px;height:40px}
.topbar .brand strong{display:block;font-size:23px;font-weight:750;letter-spacing:-.6px;line-height:1.1}
.topbar .brand small{display:block;margin-top:4px;font-size:9px;font-weight:600;letter-spacing:2px;line-height:1.3;color:#95adbd}
.topbar .workspace-top{min-width:0;margin-left:auto;overflow:visible}
.topbar .workspace-actions{gap:7px}
.shell{min-height:calc(100vh - var(--app-header-height))}
.desktop-mode .shell,.desktop-mode .workspace{height:calc(100dvh - var(--app-header-height))}
#workspaceBrand{position:absolute;inset:0;z-index:0;display:grid;place-items:center;pointer-events:none;user-select:none;overflow:hidden}
#workspaceBrand img{display:block;width:min(480px,65%);height:auto;max-height:45%;object-fit:contain;opacity:.2;mix-blend-mode:screen}
@media(max-width:550px){:root{--app-header-height:72px}.topbar,.desktop-mode .topbar{padding:0 16px;gap:10px}.topbar .brand{gap:9px}.topbar .brand-mark{width:36px;height:36px;flex-basis:36px}.topbar .brand-mark svg{width:36px;height:36px}.topbar .brand strong{font-size:21px}.topbar .brand small{font-size:8px;letter-spacing:1.4px}.topbar .workspace-actions{gap:2px}#workspaceBrand img{width:75%;opacity:.18}}
.desktop-mode aside{top:calc(var(--app-header-height) + 12px)}
