/* Account action is independent of the navigation. No identity in static HTML. */
.header-inner { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 20px; }
.header-inner nav { width: auto; gap: 16px; justify-content: flex-end; }
.header-account { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid #028d4e; border-radius: 8px; background: #028d4e; color: #fff; font-size: 15px; font-weight: 650; white-space: nowrap; text-decoration: none; }
.header-account:hover { background: #016f3d; border-color: #55c18c; }
.header-account:focus-visible, .header-menu-toggle:focus-visible { outline: 3px solid #87f1b9; outline-offset: 4px; }
@media (max-width:1100px) and (min-width:761px) { .header-inner nav { grid-row: 2; grid-column: 1 / -1; justify-content: flex-start; } .header-account { grid-column: 3; grid-row: 1; } }
@media (max-width:760px) {
 .header-inner { grid-template-columns: 44px minmax(0,1fr) auto; gap: 8px; padding: 16px 0; }
 .header-inner .header-menu-toggle { grid-column: 1; grid-row: 1; }
 .header-inner > .brand { grid-column: 2; grid-row: 1; justify-self: center; gap: 6px; font-size: 22px; letter-spacing: -0.8px; white-space: nowrap; }
 .header-inner .brand svg { width: 30px; height: 30px; }
 .header-account { grid-column: 3; grid-row: 1; padding: 0 10px; font-size: 13px; }
 .header-inner nav { grid-column: 1 / -1; grid-row: 2; width: 100%; }
 .preview-chip { grid-column: 1 / -1; }
}
@media (max-width:360px) { .header-inner { gap: 6px; } .header-inner > .brand { font-size: 17px; gap: 5px; } .header-inner .brand svg { width:26px; height:26px; } .header-account { padding:0 8px; } }