.app-theme .brand { gap: 8px; }
.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) {
  html[data-theme] .app-theme .brand .brand-jar { width: 30px; height: 30px; margin-left: 0; }
}