Safe area

Padding utilities that respect env(safe-area-inset-*) on notched phones, plus breakpoint helpers for mobile-only and desktop-only blocks.

Safe-area padding

Each class uses max(var(--velin-space-4, 1rem), env(safe-area-inset-*)) so content clears system UI without hard-coded device offsets.

Class	Effect
`.velin-pt-safe`	Padding block-start (status bar / notch)
`.velin-pb-safe`	Padding block-end (home indicator)
`.velin-px-safe`	Padding inline (left/right insets)
`.velin-p-safe`	All sides

<velin-bottom-nav class="velin-pb-safe">…</velin-bottom-nav>
<header class="velin-pt-safe">…</header>

Complements responsive display utilities. The layout audit flags velin-hidden without a matching show class at md.

Class	Default (< 48rem)	≥ 48rem
`.velin-mobile-only`	visible	hidden
`.velin-desktop-only`	hidden	visible