/* Approved homepage header B: persistent account actions, compact navigation. */
html { scroll-padding-top: 88px; }
section, h2 { scroll-margin-top: 0; }
.site-header { position: sticky; top: 0; z-index: 30; background: var(--surface); box-shadow: 0 2px 8px #28352f06; }
.header-inner { position: relative; min-height: 72px; gap: 22px; }
.site-nav { gap: 20px; }
.header-account-actions { display: flex; align-items: center; gap: 20px; flex: none; margin-left: auto; }
.header-create { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 11px 17px; border: 1px solid var(--accent); border-radius: 7px; background: var(--accent); color: #fff; text-decoration: none; white-space: nowrap; font-size: 13px; font-weight: 550; line-height: 20px; }
.header-create:hover { background: var(--accent-hover); }
.header-signin { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); font-size: 13px; white-space: nowrap; text-decoration: none; }
.header-signin:hover { text-decoration: underline; }
.menu-button { min-width: 44px; width: 44px; height: 44px; padding: 10px; margin-left: 0; }
.menu-button svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.site-nav.open { position: absolute; top: calc(100% - 1px); right: 0; z-index: 40; display: flex; flex-direction: column; align-items: stretch; gap: 0; width: 280px; max-width: calc(100vw - 32px); max-height: calc(100dvh - 96px); overflow-y: auto; margin: 0; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: 0 12px 32px #28352f16; }
.site-nav.open a { padding: 14px 12px; border-radius: 4px; }
.site-nav.open a:hover { background: var(--section); }
@media (max-width: 1150px) {
  .header-inner { gap: 14px; }
  .site-nav { gap: 12px; }
  .brand { font-size: 22px; }
  .header-account-actions { gap: 16px; }
}
@media (max-width: 1050px) {
  .header-inner { min-height: 68px; padding-block: 10px; flex-wrap: nowrap; }
  .menu-button { display: inline-flex; }
  .site-nav:not(.open) { display: none; }
}
@media (max-width: 600px) {
  html { scroll-padding-top: 76px; }
  .header-inner { width: calc(100% - 32px); gap: 12px; min-height: 64px; padding-block: 10px; }
  .brand { gap: 7px; font-size: 19px; }
  .brand-mark { width: 32px; height: 32px; }
  .header-account-actions { gap: 14px; }
  .header-create { padding-inline: 13px; font-size: 12px; }
  .header-signin { font-size: 12px; }
  .menu-button { min-width: 36px; width: 36px; padding-inline: 6px; }
}
@media (max-width: 480px) {
  .brand span { display: none; }
  .brand-mark { width: 36px; height: 36px; }
}
@media (max-width: 350px) {
  .header-inner, .header-account-actions { gap: 9px; }
  .header-create { padding-inline: 10px; }
}