.app-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 30; width: var(--sidebar-width); display: flex; flex-direction: column; padding: 24px 18px; color: #edf3f1; background: #173b35; transition: transform var(--transition); }
.app-sidebar__brand { display: flex; align-items: center; gap: 12px; padding: 4px 8px 28px; }
.app-sidebar__brand > span:last-child { display: grid; gap: 3px; }
.app-sidebar__brand small { color: #a9bcb8; font-size: .65rem; }
.app-sidebar__mark { display: grid; width: 42px; height: 42px; overflow: hidden; place-items: center; border-radius: 11px;  }
.app-sidebar__mark img { width: 100%; height: 100%; object-fit: cover; }
.app-sidebar__nav { display: grid; gap: 6px; }
.app-sidebar__section { padding: 22px 12px 6px; color: #829d97; font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.app-sidebar__link { display: flex; align-items: center; gap: 11px; min-height: 44px; padding: 0 12px; border-radius: 10px; color: #dbe6e3; font-size: .88rem; font-weight: 500; }
a.app-sidebar__link:hover, .app-sidebar__link.is-active { color: #fff; background: rgb(255 255 255 / 10%); }
.app-sidebar__link.is-disabled { color: #76908a; cursor: not-allowed; }
.app-sidebar__icon { width: 20px; text-align: center; font-size: 1.1rem; }
.app-sidebar__version { margin-top: auto; padding: 14px 10px 0; border-top: 1px solid rgb(255 255 255 / 10%); color: #829d97; font-size: .7rem; }