.site-header { color: var(--dfm-header-text); background: var(--dfm-header); border-bottom: 1px solid var(--dfm-line); box-shadow: 0 2px 5px rgb(17 29 42 / 8%); }
.site-topbar { color: var(--dfm-topbar-text); background: var(--dfm-topbar); font-size: .875rem; }
.site-topbar__inner { display: flex; min-height: 3rem; align-items: center; justify-content: space-between; gap: 1rem; }
.site-topbar__tools { display: flex; align-items: center; gap: .75rem; }
.social-links { display: flex; align-items: center; gap: .25rem; margin: 0; padding: 0; list-style: none; }
.social-links a { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border-radius: .2rem; color: inherit; text-decoration: none; }
.social-links a:hover { color: var(--dfm-accent); background: color-mix(in srgb, currentColor 12%, transparent); }
.social-links svg { display: block; width: 1.2rem; height: 1.2rem; fill: currentColor; }
.site-brand-row__inner { position: relative; display: grid; min-height: 7.25rem; grid-template-columns: 3rem 1fr 3rem; align-items: center; }
.site-branding { display: flex; justify-content: center; }
.site-logo { display: block; width: min(100%, 23rem); }
.brand-logo { width: 100%; }
.brand-logo-link, .brand-logo .custom-logo-link { display: block; text-decoration: none; }
.site-logo img, .site-logo .custom-logo { display: block; width: 100%; height: auto; max-height: 5.4rem; object-fit: contain; }
.icon-button { display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border: 0; border-radius: .2rem; color: var(--dfm-header-text); background: transparent; }
.icon-button .material-symbols-outlined { font-size: 1.65rem; }
.icon-button:hover { background: color-mix(in srgb, var(--dfm-header-text) 12%, transparent); }
.search-toggle { justify-self: end; }
@media (max-width: 760px) {
    .site-topbar__inner { min-height: 3rem; font-size: .78rem; }
    .social-links { gap: 0; }
    .social-links a { width: 1.9rem; height: 2rem; }
    .social-links svg { width: 1.05rem; height: 1.05rem; }
    .appearance-controls button { width: 1.8rem; height: 1.8rem; padding: .3rem; }
    .site-brand-row__inner { min-height: 5.5rem; }
    .site-logo { width: min(100%, 15rem); }
    .site-logo img, .site-logo .custom-logo { max-height: 3.7rem; }
}
@media (max-width: 991px) {
    .site-topbar__inner { min-height: 3rem; flex-wrap: nowrap; }
    .site-topbar__inner > time { display: none; }
    .site-topbar__tools { width: 100%; justify-content: space-between; gap: 0; }
    .site-topbar__tools > .social-links,
    .site-topbar__tools > .appearance-controls { flex-shrink: 0; }
}
