/* Clean vector artwork. Use the wordmark that contrasts with its surface. */
.wb-lockup { position: relative; display: inline-block; flex: 0 0 auto; width: 166px; height: 32px; background: url('/branding/workbeat-logo-navy-clean.svg') center / contain no-repeat; vertical-align: middle; }
html[data-theme="dark"] .wb-lockup, .sidebar .wb-lockup { background-image: url('/branding/workbeat-logo-white-clean.svg'); }
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .wb-lockup { background-image: url('/branding/workbeat-logo-white-clean.svg'); }
}
@media (min-width: 900px) {
  html.wb-light .sidebar .wb-lockup { background-image: url('/branding/workbeat-logo-navy-clean.svg'); }
}
/* The public website uses light surfaces independently of the app appearance. */
:root .site-header .wb-lockup, :root .site-footer .wb-lockup { background-image: url('/branding/workbeat-logo-navy-clean.svg'); }
.site-header .brand, .site-footer .brand, .sidebar .brand { gap: 0; }
.sidebar .wb-lockup { width: 150px; height: 30px; }
.login-mark .wb-lockup { width: 190px; height: 38px; }
.ls-brand .wb-lockup { width: 210px; height: 44px; }
.wb-brand-name { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.billing-brand { display: inline-flex; align-items: center; gap: 10px; }
img.wb-mark { width: 42px; height: 26px; object-fit: contain; }
@media (max-width: 420px) { .site-header .wb-lockup { width: 130px; height: 28px; } .site-header .brand { gap: 0; } }

/* Dashboard title keeps its accessible text while displaying the same logo. */
#app.dashboard-view #mobile-page-title { font-size: 0; display: inline-flex; align-items: center; }
#app.dashboard-view #mobile-page-title::before { content: ''; display: block; width: 166px; height: 32px; background: url('/branding/workbeat-logo-navy-clean.svg') center / contain no-repeat; }
html[data-theme="dark"] #app.dashboard-view #mobile-page-title::before { background-image: url('/branding/workbeat-logo-white-clean.svg'); }
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) #app.dashboard-view #mobile-page-title::before { background-image: url('/branding/workbeat-logo-white-clean.svg'); }
}
@media (max-width: 420px) { #app.dashboard-view #mobile-page-title::before { width: 140px; height: 28px; } }