#app-header {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    padding: var(--space-3) var(--space-6);
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
}
#app-header .brand { display: flex; align-items: center; gap: var(--space-2); }
#app-header .brand-logo { height: 28px; width: auto; display: block; }
#app-header .org-name {
    margin-left: var(--space-3);
    color: var(--color-muted);
    font-size: 0.9em;
}
#app-header nav { display: flex; gap: var(--space-4); flex: 1; }
#app-header nav a { color: var(--color-text); font-weight: 500; }
#app-header .account {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}
/* Use the full width of the viewport with only a little breathing room. */
#app { padding: var(--space-4) var(--space-6); max-width: none; margin: 0; }

.auth-page { max-width: 380px; margin: 80px auto; }
.auth-logo { display: block; max-width: 200px; height: auto; margin: 0 auto var(--space-6); }
.auth-page h1 { margin-bottom: var(--space-6); }
.auth-actions { display: flex; justify-content: space-between; align-items: center; }