.site-header.top{--header-surface:#1c1c1e;--header-line:#3a3a3c;display:grid;grid-template-columns:minmax(0,1fr) auto 40px;align-items:center;gap:16px;width:min(1024px,calc(100% - 56px));margin:0 auto;padding:max(24px,env(safe-area-inset-top)) 0 24px;border-bottom:1px solid var(--header-line);font-family:Roboto,Arial,system-ui,sans-serif;letter-spacing:0;line-height:1.5}
[data-theme=light] .site-header.top{--header-surface:#f8fafb;--header-line:#c0c9d3}
.site-header .brand{gap:12px;min-width:0;white-space:normal}.site-header .brand img{width:44px;height:44px;border-radius:8px;flex:0 0 44px}.site-header .brand b{font-size:24px;font-weight:500;line-height:1.25}.site-header .brand small{font-size:13px;line-height:1.5;margin-top:3px;color:var(--muted)}
.site-header .top-links{display:flex;align-items:center;gap:6px;width:auto;margin:0}.site-header .top-links>a{display:flex;align-items:center;justify-content:center;min-height:40px;padding:8px 12px;font-size:14px;font-weight:500;line-height:1.5;border:0;border-radius:8px;text-decoration:none;background:transparent;color:var(--muted);white-space:nowrap;letter-spacing:0}
.site-header .top-links>a[aria-current=page]{background:var(--header-surface);color:var(--text);box-shadow:inset 0 0 0 1px var(--header-line)}
.site-header .top-links>a:not([aria-current=page]):hover{background:transparent;color:var(--text)}
.site-header .theme-toggle,.site-header .icon-button{display:grid;place-items:center;min-height:40px;width:40px;height:40px;padding:9px;border:0;border-radius:8px;background:var(--header-surface);color:var(--text);justify-self:end}.site-header .theme-toggle svg,.site-header .icon-button svg{width:20px;height:20px}.site-header button:hover{background:var(--header-surface);filter:brightness(1.1)}
@media(max-width:780px){.site-header.top{width:calc(100% - 40px)}}
@media(max-width:620px){.site-header.top{width:calc(100% - 32px);grid-template-columns:minmax(0,1fr) 40px;gap:16px;padding:18px 0}.site-header .brand b{font-size:22px}.site-header .brand img{width:40px;height:40px;flex-basis:40px}.site-header .theme-toggle,.site-header .icon-button{grid-column:2;grid-row:1}.site-header .top-links{grid-column:1 / -1;grid-row:2;width:100%;gap:6px}.site-header .top-links>a{flex:1;min-width:0;padding:8px 6px;font-size:13px}}
@media(max-width:360px){.site-header .brand b{font-size:20px}.site-header .brand{gap:10px}.site-header .brand small{font-size:12px}}
.site-header.top{font-family:Arial,system-ui,sans-serif}
