.brand {
  --brand-symbol-width: 44px;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  position: relative;
  isolation: isolate;
  overflow: visible;
  width: fit-content;
  max-width: 100%;
  min-height: 48px;
  padding: .15rem 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #168fb7;
  box-shadow: none;
  direction: ltr;
  text-decoration: none;
  transition: opacity .2s ease;
}
.brand-symbol {
  display: block;
  flex: 0 0 var(--brand-symbol-width);
  width: var(--brand-symbol-width);
  aspect-ratio: 406 / 312;
  /* Reuse the original A mark in the store's blue palette. */
  background: currentColor;
  -webkit-mask-image: url('/images/brand/acitymall-logo.png');
  mask-image: url('/images/brand/acitymall-logo.png');
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: calc(var(--brand-symbol-width) * 5.349754) auto;
  mask-size: calc(var(--brand-symbol-width) * 5.349754) auto;
  -webkit-mask-position: calc(var(--brand-symbol-width) * -.165025) calc(var(--brand-symbol-width) * -.504926);
  mask-position: calc(var(--brand-symbol-width) * -.165025) calc(var(--brand-symbol-width) * -.504926);
}
.brand-wordmark {
  display: block;
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.035em;
  white-space: nowrap;
}
.brand-wordmark span { color: inherit; font-weight: 400; }
.brand:hover { opacity: .85; }
.brand:focus-visible { outline: 3px solid #51cbee; outline-offset: 4px; }
.site-header .brand { --brand-symbol-width: 38px; max-width: none; color: #43c4e9; }
.site-header .brand-wordmark { text-shadow: 0 1px 3px #071c2499; }
.site-header .brand-symbol { filter: drop-shadow(0 1px 2px #071c2480); }
.site-header .brand-wordmark { font-size: 1.5rem; }
.admin-header .brand { --brand-symbol-width: 32px; }
.admin-header .brand-wordmark { font-size: 1.25rem; }
.store-footer .brand { margin-bottom: .4rem; color: #43c4e9; }
html[data-theme="dark"] .admin-header .brand { color: #43c4e9; }
@media (prefers-reduced-motion: no-preference) {
  .site-header .brand { animation: brand-appear .5s; }
}
@keyframes brand-appear { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 820px) {
  .site-header .brand { --brand-symbol-width: 34px; }
  .site-header .brand-wordmark { font-size: 1.4rem; }
}
@media (max-width: 480px) {
  .site-header { column-gap: .55rem; }
  .site-header .language-trigger { min-width: 60px; }
  .site-header .language-label { display: none; }
}
@media (max-width: 380px) {
  .site-header .brand { --brand-symbol-width: 29px; gap: .35rem; }
  .site-header .brand-wordmark { font-size: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
  .brand { transition: none; }
}
@media (forced-colors: active) {
  .brand, .site-header .brand, .store-footer .brand, html[data-theme="dark"] .admin-header .brand { color: LinkText; }
  .site-header .brand-wordmark { text-shadow: none; }
  .site-header .brand-symbol { filter: none; }
  .brand-symbol { background: LinkText; }
}