/* Single navigation shell shared by every authenticated page. */
body.app-shell { display: block; padding: 0 0 0 256px; min-height: 100vh; }
body.app-shell > .main-content, body.app-shell > .main, body.app-shell > .main-container { margin-left: 0; width: 100%; min-width: 0; max-width: none; }
.app-sidebar { position: fixed; inset: 0 auto 0 0; width: 256px; display: flex; flex-direction: column; gap: 0; padding: 24px 16px 16px; background: #fff; border-right: 1px solid #dfe4dc; z-index: 1040; overflow-y: auto; font-family: 'Inter', 'Segoe UI', sans-serif; color: #243b34; text-align: left; }
.app-brand { display: flex; align-items: center; gap: 12px; padding-bottom: 24px; margin-bottom: 16px; border-bottom: 1px solid #dfe4dc; color: #243b34; font-size: 16px; font-weight: 650; line-height: 1.3; text-decoration: none; }
.app-brand:hover { color: #23483e; }
.app-logo { display: grid; place-items: center; flex-shrink: 0; width: 42px; height: 42px; border-radius: 12px; background: #23483e; color: #fff; font-size: 18px; font-weight: 700; }
.app-brand small { display: block; margin-top: 4px; color: #68766f; font-size: 9px; font-weight: 500; text-transform: uppercase; letter-spacing: 1.3px; }
.app-nav { display: flex; flex-direction: column; gap: 4px; }
.app-nav-label { padding: 12px 12px 6px; color: #788475; font-size: 10px; font-weight: 650; text-transform: uppercase; letter-spacing: 1.2px; }
.app-nav a { display: flex; align-items: center; gap: 12px; min-height: 43px; padding: 10px 12px; border-radius: 8px; color: #52665c; font-size: 13px; font-weight: 500; line-height: 1.4; text-decoration: none; }
.app-nav a i { width: 20px; font-size: 17px; text-align: center; }
.app-nav a:hover { color: #23483e; background: #f3f5ef; }
.app-nav a[aria-current="page"] { background: #e9f0e9; color: #23483e; font-weight: 650; }
.app-user { display: flex; align-items: center; gap: 10px; margin-top: auto; padding: 14px 8px 0; border-top: 1px solid #dfe4dc; }
.app-nav { padding-bottom: 24px; }
.app-avatar { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%; background: #eee3cc; color: #59451f; font-size: 13px; font-weight: 700; }
.app-user > div { min-width: 0; flex: 1; }
.app-user strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; font-weight: 600; }
.app-user small { display: block; color: #68766f; font-size: 10px; }
.app-user form { margin: 0; }
.app-user button { border: 0; background: none; padding: 8px; color: #68766f; }
.app-mobile-bar, .app-sidebar-close { display: none; }
.app-sidebar-overlay[hidden] { display: none; }
.app-sidebar-overlay { position: fixed; inset: 0; z-index: 1035; border: 0; background: #18392f66; }
@media (max-width: 1100px) {
    body.app-shell { padding-left: 0; }
    .app-sidebar { transform: translateX(-100%); visibility: hidden; transition: transform .2s ease, visibility .2s; }
    .app-sidebar.is-open { transform: translateX(0); visibility: visible; }
    .app-mobile-bar { position: sticky; top: 0; z-index: 101; display: flex; align-items: center; gap: 14px; min-height: 60px; padding: 10px 16px; background: #fff; border-bottom: 1px solid #dfe4dc; color: #23483e; font-size: 15px; font-weight: 650; }
    .app-mobile-bar button, .app-sidebar-close { border: 1px solid #dfe4dc; border-radius: 6px; background: white; padding: 4px 8px; color: #23483e; font-size: 20px; }
    .app-sidebar-close { display: block; align-self: flex-end; margin-bottom: 8px; }
    body.app-shell .topbar { position: static; }
    body.app-shell > .main-content, body.app-shell > .main { margin-left: 0; }
}