/* App shell: fixed header, left nav (drawer under 768px), main content. */
.site-header {
    position: sticky; top: 0; z-index: var(--net-z-nav);
    display: flex; align-items: center; gap: var(--net-spacing-md);
    height: var(--net-header-height); padding: 0 var(--net-spacing-lg);
    background: var(--net-bg-header); color: var(--net-text-on-header);
    box-shadow: var(--net-shadow-base);
}
.site-header a { color: inherit; }
.site-brand { font-weight: 700; letter-spacing: 0.02em; white-space: nowrap; }
.site-brand .icon { margin-right: 0.35rem; }
.site-claim { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--net-font-size-sm); opacity: 0.9; }
.site-user { font-size: var(--net-font-size-sm); white-space: nowrap; display: flex; gap: var(--net-spacing-sm); align-items: center; }
.nav-toggle { display: none; background: none; border: 1px solid rgba(255,255,255,0.35); color: inherit; border-radius: var(--net-border-radius-base); padding: 0.3rem 0.55rem; font-size: 1.1rem; cursor: pointer; }

.site-body { display: flex; min-height: calc(100vh - var(--net-header-height)); }
.site-nav {
    flex: 0 0 var(--net-nav-width); width: var(--net-nav-width);
    background: var(--net-bg-primary); border-right: 1px solid var(--net-border);
    padding: var(--net-spacing-md) 0;
}
.site-nav a {
    display: flex; align-items: center; gap: 0.6rem;
    padding: 0.55rem var(--net-spacing-lg); color: var(--net-text-primary);
    border-left: 3px solid transparent;
}
.site-nav a:hover { background: var(--net-bg-accent); text-decoration: none; }
.site-nav a.is-active { border-left-color: var(--net-color-primary); background: var(--net-bg-accent); font-weight: 600; }
.site-nav .nav-section { padding: 0.75rem var(--net-spacing-lg) 0.25rem; font-size: var(--net-font-size-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--net-text-muted); }
.site-main { flex: 1 1 auto; min-width: 0; padding: var(--net-spacing-lg); }
.nav-scrim { display: none; }
.page-head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--net-spacing-md); margin-bottom: var(--net-spacing-lg); }
.page-head h1 { margin: 0; flex: 1 1 auto; }
.page-head .actions { display: flex; flex-wrap: wrap; gap: var(--net-spacing-sm); }