.app-theme .brand { gap: 8px; }
.app-theme .brand .brand-tagline { flex: 0 1 220px; min-width: 0; max-width: 220px; margin-left: 8px; color: var(--muted); font-size: 14px; line-height: 1.35; font-style: italic; font-weight: 400; letter-spacing: 0; white-space: normal; }
.app-theme .site-header:has(.brand-tagline) { height: auto; min-height: 82px; }
.app-theme .brand .brand-mark { width: 36px; height: 30px; flex-shrink: 0; stroke-linecap: round; stroke-linejoin: round; }
.app-theme .brand-wordmark { display: inline-block; position: relative; line-height: 1.1; padding-bottom: 4px; }
.app-theme .brand-name { position: relative; z-index: 1; }
html[data-theme] .app-theme .brand .brand-honey { position: absolute; left: 1px; top: calc(100% - 8px); width: calc(100% - 2px); height: 15px; fill: #df9d25; stroke: none; overflow: visible; pointer-events: none; }
.app-theme .brand:hover .brand-honey { fill: #edb33f; }
html[data-theme] .app-theme .brand .brand-jar { width: 36px; height: 36px; flex-shrink: 0; margin-left: 2px; fill: none; stroke: none; }
@media (max-width: 620px) {
  .app-theme .brand .brand-tagline { flex-basis: 140px; max-width: 140px; font-size: 12px; margin-left: 4px; }
  html[data-theme] .app-theme .brand .brand-jar { width: 30px; height: 30px; margin-left: 0; }
}