# F-159 — Diseño

## Arquitectura
El estado vive en `DashboardShell`, única composición del layout autenticado:

- `desktopCollapsed`: preferencia persistida en `localStorage` bajo `mdv.admin.sidebar.collapsed`.
- `mobileOpen`: estado efímero del drawer.

`Sidebar` y `NavItemRow` siguen consumiendo la misma lista `visibleNavItems(role)`. No se crean menús alternativos.

## Responsive
- Sidebar base: drawer `fixed`, 240px y desplazado fuera de viewport cuando está cerrado.
- `lg+`: pasa a `sticky`, siempre visible, ancho 240px/80px según preferencia.
- Etiquetas usan `lg:hidden` solo durante collapse, por lo que el drawer móvil siempre conserva texto.
- Backdrop solo se renderiza con drawer abierto.

## Accesibilidad
- Toggle es `<button>` nativo con `aria-expanded`, `aria-controls` y etiqueta dinámica.
- Escape cierra drawer.
- Drawer móvil cerrado usa `invisible` para excluir enlaces del foco.
- Enlaces tienen `aria-label`; modo icon-only añade `title`.

## Transiciones
`transition-[width,transform] duration-300 ease-in-out`, respetando las utilidades existentes de Tailwind.