/* sidebar.css — Barra lateral fixa à esquerda, sempre visível: logo da marca e menu (.nav, ícone + nome), sem decoração. A identificação do
   usuário e "Sair" ficam na faixa superior (.topbar, css/header.css), não aqui. Oculta só nas telas de acesso e de conclusão (regras em layout.css).
   A largura vem de --sidebar-w; até 960 px vira uma faixa só com ícones (responsive.css). */

.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar-w);background:var(--side-bg);color:#fff;display:flex;flex-direction:column;padding:1.5rem .9rem 1rem;z-index:30;overflow-y:auto;overflow-x:hidden}
.sidebar>*{position:relative}
.sidebar .brandmark{display:block;width:54px;height:auto;margin:0 auto 1.8rem}
.menu{display:flex;flex-direction:column;gap:.25rem}
.nav{display:flex;align-items:center;gap:.9rem;width:100%;padding:.8rem 1rem;border-radius:12px;font-size:.98rem;line-height:1.2;color:var(--on-dark);text-align:left}
.nav .i{width:22px;height:22px}
.nav:hover{background:var(--nav-hover)}
.nav.active{background:var(--nav-active);color:#fff;font-weight:700}
.nav:focus-visible{outline:3px solid var(--on-dark-soft);outline-offset:-3px}