.site-header{position:sticky;top:0;z-index:var(--z-nav);.mobile-menu-backdrop{background-color:#0006;inset:0;opacity:0;pointer-events:none;position:fixed;transition:opacity var(--transition-base);z-index:var(--z-nav);&.open{opacity:1;pointer-events:auto}}.mobile-menu{background-color:var(--color-bg-page);display:flex;flex-direction:column;inset:0;overflow-y:auto;pointer-events:none;position:fixed;transform:translate(100%);transition:transform var(--transition-base),visibility 0s linear .2s;visibility:hidden;z-index:calc(var(--z-nav) + 1);&.open{pointer-events:auto;transform:translate(0);transition:transform var(--transition-base),visibility 0s linear 0s;visibility:visible}.mobile-menu-header{align-items:center;display:flex;justify-content:flex-end;padding:var(--space-4)}.mobile-menu-inner{align-items:stretch;display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-2) var(--space-6) var(--space-6)}.menu-toggle{align-items:center;background:transparent;border:1px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-text-nav-inactive);cursor:pointer;display:inline-flex;height:44px;justify-content:center;padding:0;transition:background-color var(--transition-base),color var(--transition-base);width:44px;&:hover{background-color:var(--color-bg-cards);color:var(--color-text-nav-brand)}.icon-bars{align-items:center;display:inline-flex;flex-direction:column;gap:5px;height:16px;justify-content:center;width:20px}.bar{background-color:currentColor;border-radius:2px;display:block;height:2px;transition:opacity var(--transition-base),transform var(--transition-base);width:100%}.icon-bars.open .bar-top{transform:translateY(7px) rotate(45deg)}.icon-bars.open .bar-middle{opacity:0}.icon-bars.open .bar-bottom{transform:translateY(-7px) rotate(-45deg)}}.link.auth{align-items:center;background:none;border:none;color:var(--color-text-nav-inactive);cursor:pointer;display:inline-flex;font-family:inherit;font-size:var(--text-lg);font-weight:var(--font-weight-bold);justify-content:flex-start;min-height:44px;padding:0 var(--space-2);text-align:left;text-decoration:none;transition:color var(--transition-base);white-space:nowrap;&:hover{color:var(--color-text-nav-brand)}}.button.cta{align-items:center;background-color:var(--color-btn-primary-bg);border-radius:var(--radius-full);color:var(--color-btn-primary-text);display:inline-flex;font-family:var(--font-display);font-size:var(--text-lg);font-weight:var(--font-weight-medium);justify-content:center;min-height:44px;padding:var(--space-4) var(--space-6);text-align:center;text-decoration:none;transition:opacity var(--transition-base);white-space:nowrap;&:hover{opacity:.9}:root[data-theme=dark] &{font-weight:var(--font-weight-bold)}}}}.skip-link:focus{background:var(--color-primary);border-radius:var(--radius-md);clip:auto;clip-path:none;color:var(--color-white);font-size:var(--text-sm);font-weight:var(--font-weight-medium);height:auto;left:var(--space-4);overflow:visible;padding:var(--space-2) var(--space-4);position:fixed;top:var(--space-4);white-space:normal;width:auto;z-index:calc(var(--z-nav) + 10)}.navigation{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background-color:var(--color-bg-nav);box-shadow:var(--shadow-nav);.inner{align-items:center;display:flex;justify-content:space-between;padding:var(--space-4) var(--space-6);position:relative}.brand{align-items:center;color:var(--color-text-nav-brand);display:flex;flex-shrink:1;font-family:var(--font-display);font-size:var(--text-2xl);font-weight:var(--font-weight-extralight);gap:var(--space-2);letter-spacing:-1.2px;min-width:0;text-decoration:none;.brand-icon{align-items:center;color:var(--color-text-nav-brand);display:flex;flex-shrink:0}.brand-name{font-weight:var(--font-weight-bold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}.actions{align-items:center;display:flex;flex-shrink:0;gap:var(--space-4)}.auth-links{align-items:center;display:flex;gap:var(--space-4)}.link.auth{align-items:center;background:none;border:none;color:var(--color-text-nav-inactive);cursor:pointer;display:inline-flex;font-family:inherit;font-size:var(--text-sm);font-weight:var(--font-weight-bold);min-height:44px;text-decoration:none;transition:color var(--transition-base);white-space:nowrap;&:hover{color:var(--color-text-nav-brand)}}.button.cta{align-items:center;background-color:var(--color-btn-primary-bg);border-radius:var(--radius-full);box-shadow:var(--shadow-btn);color:var(--color-btn-primary-text);display:inline-flex;font-family:var(--font-display);font-size:var(--text-sm);font-weight:var(--font-weight-medium);justify-content:center;min-height:44px;padding:var(--space-2) var(--space-6);text-decoration:none;transition:opacity var(--transition-base);white-space:nowrap;&:hover{opacity:.9}:root[data-theme=dark] &{font-weight:var(--font-weight-bold)}}.profile-menu{display:inline-flex;position:relative}.avatar-trigger{align-items:center;background-color:var(--color-bg-cards);border:2px solid var(--color-white);border-radius:var(--radius-full);box-shadow:var(--shadow-form);color:var(--color-primary);cursor:pointer;display:inline-flex;flex-shrink:0;font-family:var(--font-display);font-size:var(--text-sm);font-weight:var(--font-weight-extrabold);height:40px;justify-content:center;letter-spacing:.5px;padding:0;transition:background-color var(--transition-base),color var(--transition-base),opacity var(--transition-base);width:40px;&:hover{opacity:.92}&:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.avatar-initials{line-height:1}}.profile-dropdown{background-color:var(--color-surface-elevated);border:1px solid var(--color-card-hairline);border-radius:32px;box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-3);padding:9px;position:absolute;right:0;top:100%;width:288px;z-index:calc(var(--z-nav) + 5)}.profile-dropdown-header{background-color:var(--color-bg-cards);border-radius:24px;display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-4)}.profile-dropdown-label{color:var(--color-primary);font-family:var(--font-display);font-size:10px;font-weight:var(--font-weight-extrabold);letter-spacing:1.5px;line-height:1.5;margin:0;opacity:.7}.profile-dropdown-name{color:var(--color-text-heading);font-size:var(--text-sm);font-weight:var(--font-weight-bold);line-height:1.4;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-dropdown-email{color:var(--color-text-haiku);font-size:var(--text-xs);font-weight:var(--font-weight-medium);line-height:1.4;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-dropdown-actions{display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-1) 0}.profile-dropdown-divider{background-color:var(--color-text-haiku);display:block;height:1px;margin:var(--space-1) auto;opacity:.25;width:calc(100% - var(--space-6))}.profile-dropdown-link{align-items:center;background:none;border:none;border-radius:var(--radius-full);color:var(--color-text-haiku);cursor:pointer;display:flex;font-family:inherit;font-size:var(--text-sm);font-weight:var(--font-weight-bold);gap:var(--space-3);min-height:44px;padding:var(--space-3) var(--space-4);text-align:left;text-decoration:none;transition:background-color var(--transition-base),color var(--transition-base);width:100%;&:hover{background-color:var(--color-bg-cards);color:var(--color-text-heading)}&:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}&.sign-out{color:var(--color-text-danger);&:hover{background-color:var(--color-bg-danger-soft);color:var(--color-text-danger)}}}.menu-toggle{align-items:center;background:transparent;border:1px solid var(--color-border);border-radius:var(--radius-full);color:var(--color-text-nav-inactive);cursor:pointer;display:inline-flex;flex-shrink:0;height:44px;justify-content:center;padding:0;transition:background-color var(--transition-base),color var(--transition-base);width:44px;&:hover{background-color:var(--color-bg-cards);color:var(--color-text-nav-brand)}.icon-bars{align-items:center;display:inline-flex;flex-direction:column;gap:5px;height:16px;justify-content:center;width:20px}.bar{background-color:currentColor;border-radius:2px;display:block;height:2px;transition:opacity var(--transition-base),transform var(--transition-base);width:100%}.icon-bars.open .bar-top{transform:translateY(7px) rotate(45deg)}.icon-bars.open .bar-middle{opacity:0}.icon-bars.open .bar-bottom{transform:translateY(-7px) rotate(-45deg)}}.mobile-only{display:none}@media(max-width:768px){.brand{font-size:var(--text-xl)}.desktop-only{display:none}.mobile-only{display:inline-flex}.inner{padding:var(--space-4)}.actions{gap:var(--space-2)}}@media(max-width:360px){.brand .brand-name{display:none}}}