/* Shared identity for the website, studio, and account pages. */
.logo.brand-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex: none;
  color: #151735;
  text-decoration: none;
  white-space: nowrap;
  font: 700 22px/1 "Instrument Sans", "Segoe UI", Arial, sans-serif;
  letter-spacing: -0.045em;
}
.brand-logo .brand-mark { display: block; width: 38px; height: 38px; flex: none; }
.brand-logo .brand-wordmark { display: inline-flex; gap: .22em; align-items: baseline; }
.brand-logo .brand-wordmark span { font-weight: 500; letter-spacing: -0.035em; }
.logo.brand-logo--icon { gap: 0; }
.brand-logo--icon .brand-mark { width: 34px; height: 34px; }
.brand-logo:focus-visible { outline: 3px solid #FF8A1F; outline-offset: 5px; border-radius: 5px; }
@media (max-width: 480px) {
  .logo.brand-logo { font-size: 19px; gap: 8px; }
  .brand-logo .brand-mark { width: 34px; height: 34px; }
}