Elevation

Shadows are tinted with the brand navy at low alpha, never pure black. This makes elevated surfaces feel cohesive on light backgrounds and subtle on dark ones.

Elevation serves Verdade: it signals an honest hierarchy (what’s in focus, what’s behind it) without faking depth the interaction doesn’t have.

Token	Tailwind utility	Use
`shadow.xs`	`shadow-vln-xs`	Hairline lift. inline inputs at rest
`shadow.sm`	`shadow-vln-sm`	Cards at rest
`shadow.md`	`shadow-vln-md`	Dropdowns, popovers
`shadow.lg`	`shadow-vln-lg`	Sheets, drawers
`shadow.xl`	`shadow-vln-xl`	Dialogs
`shadow.focus`	`shadow-vln-focus`	Focus ring (Azul Ação at 40% alpha)

shadow.xs

shadow.sm

shadow.md

shadow.lg

shadow.xl

shadow.focus

Don’t

Don’t use shadow-md from default Tailwind. it’s pure black, off-brand.
Don’t combine multiple shadows on the same element. Pick one.

Border radius Motion