> ## Documentation Index
> Fetch the complete documentation index at: https://docs.telepatia.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Tamano Responsivo del Panel

> Ajusta automaticamente el panel en pantallas mas pequenas, reduciendo ancho, padding y zoom para ocupar menos espacio del EMR.

Ajusta automaticamente el panel en pantallas mas pequenas, reduciendo ancho, padding y zoom para ocupar menos espacio del EMR.

The panel resolves a viewport size tier with `usePanelScale`. Viewports at or below the configured width threshold enter size S, applying `zoom: 0.85`, a narrower shell, and tighter insets/paddings.

In the loaded-session view, size S uses a 280px shell instead of the regular 400px shell. The appointment card also tightens its radius, padding, and vertical gaps. Positioning and drag bounds account for the scaled width so the panel stays inside the viewport after resize or restore.

The prototype includes Regular and Compact size controls to preview both layouts without changing browser size.