.header-brand-group { display: inline-flex; align-items: center; gap: 12px; min-width: 0; flex: 0 1 auto; }
.drawer-toggle { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 32px; width: 32px; height: 40px; padding: 5px; border: 0; border-radius: 5px; background: transparent; color: var(--ink); }
.drawer-toggle svg { width: 22px; height: 22px; }
.drawer-toggle:hover { background: var(--accent-soft); color: var(--accent); }
html[data-layout-mode="forum"] .masthead > .header-brand-group { margin-right: auto; }

.site-drawer {
    --drawer-surface: #171717;
    --drawer-text: #f7f7f7;
    --drawer-muted: #b7b7bf;
    --drawer-line: #303036;
    --drawer-accent: #b39aff;
    position: fixed;
    inset: 0 auto 0 0;
    width: min(370px, calc(100vw - 28px));
    max-width: none;
    height: 100vh;
    height: 100dvh;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-right: 1px solid var(--drawer-line);
    border-radius: 0;
    background: #000;
    color: var(--drawer-text);
    color-scheme: dark;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #414149 #000;
    box-shadow: 12px 0 45px #0005;
}
.site-drawer[open] { display: flex; flex-direction: column; animation: drawer-enter .2s ease-out; }
.site-drawer::backdrop { background: #0009; }
body[data-theme="dark"] .site-drawer { --drawer-surface: #15171d; --drawer-line: #303440; }
.site-drawer__header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--drawer-line); }
.site-drawer__header h2 { margin: 0; color: var(--drawer-text); font-size: 20px; letter-spacing: -.4px; }
.site-drawer__close { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 40px; width: 40px; height: 40px; padding: 10px; border: 1px solid var(--drawer-line); border-radius: 5px; background: var(--drawer-surface); color: var(--drawer-text); }
.site-drawer__close:hover { border-color: var(--drawer-accent); color: var(--drawer-accent); }
.site-drawer__content { padding: 26px 24px 30px; }
.drawer-quotes { display: flex; flex-direction: column; }
.drawer-quote { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 9px 12px; margin: 0; padding: 20px 0; border-bottom: 1px solid #252525; }
.drawer-quote:first-child { padding-top: 0; }
.drawer-quote:last-child { padding-bottom: 0; border-bottom: 0; }
.drawer-quote__number { grid-column: 1; grid-row: 1 / 3; padding-top: 5px; color: #b69a70; font-size: 10px; font-weight: 500; line-height: 1.5; letter-spacing: 1px; }
.drawer-quote blockquote { grid-column: 2; margin: 0; padding: 0; border: 0; color: #f3f0e9; font-family: Georgia, 'Times New Roman', serif; font-size: 19px; font-weight: 400; line-height: 1.5; letter-spacing: -.15px; }
.drawer-quote blockquote p { margin: 0; }
.drawer-quote figcaption { grid-column: 2; color: #a6a6ad; font-size: 10px; line-height: 1.5; letter-spacing: 1.3px; text-transform: uppercase; }
.drawer-quote figcaption a { color: inherit; text-decoration: none; text-underline-offset: 4px; }
.drawer-quote figcaption a:hover { color: #d9bc8d; text-decoration: underline; }
.site-drawer :focus-visible { outline: 2px solid var(--drawer-accent); outline-offset: 3px; }

@media (min-width: 701px) {
    html[data-layout-mode="social"] .masthead > .header-brand-group { grid-column: 1; grid-row: 2; align-self: center; gap: 8px; padding: 18px 12px; }
    html[data-layout-mode="social"] .header-brand-group .brand-wordmark { --brand-name-size: 19px; --brand-name-gap: 3px; width: auto; }
    html[data-layout-mode="social"] .header-brand-group .drawer-toggle { flex-basis: 26px; width: 26px; }
}
@media (max-width: 640px) {
    .header-brand-group { gap: 7px; }
    .header-brand-group .drawer-toggle { flex-basis: 28px; width: 28px; }
    .header-actions > .search-link { display: none; }
}
@media (min-width: 701px) and (max-width: 1100px) {
    html[data-layout-mode="social"] .masthead > .header-brand-group { gap: 5px; padding-inline: 8px; }
    html[data-layout-mode="social"] .header-brand-group .brand-wordmark { --brand-name-size: 17px; }
}
@media (max-width: 380px) {
    .site-drawer__content { padding: 20px; }
}
@keyframes drawer-enter { from { transform: translateX(-100%); } to { transform: translateX(0); } }
@media (prefers-reduced-motion: reduce) { .site-drawer[open] { animation: none; } }
@media print { .drawer-toggle, .site-drawer { display: none !important; } }