/* Velké obrazovky: celá aplikace se zvětší najednou — písmo, rozestupy,
   postranní menu, horní lišta, ikony i grafy, jako by byl zapnutý zoom
   prohlížeče. Na 4K monitoru bez škálování systému (3840 px v CSS) měl
   dashboard text 13–14 px, menu 288 px a obsah zastropovaný na 1536 px
   uprostřed se širokým prázdným pruhem po stranách.

   Stejné stupně jako Revelor Main (revelor-autodeploy, app/globals.css).
   Prahy jsou ve skutečných px okna — media queries zoom nevidí.

   Proč `zoom`, a ne větší kořenové písmo: Tailwind má rozestupy v rem, ale
   přes 240 tříd drobného písma je v px (text-[10px] …) a grafy kreslí v px,
   takže by zůstaly malé. `zoom` zvětší vše stejně.

   Daň za `zoom` (standardizovaný v Chrome 128+ a Firefox 126+):
   - jednotky vh/vw se pod zoomem násobí taky (100vh = 1,5 × okno), proto
     se všude dělí `--ui-zoom`: `calc(100vh / var(--ui-zoom))`.
     Hlídá tests/js/ui-zoom.test.js.
   - getBoundingClientRect() a souřadnice myši jsou ve zvětšených px,
     clientWidth, style.left a ResizeObserver v lokálních. Kód, který je
     míchá, převádí přes frontend/ui-zoom.js (window.RevelorUiZoom).

   Do 2200 px šířky se nic nemění — 1080p, notebooky i Mac s Retinou
   (škálovaný na 1920 px a méně) mají přesně dosavadní vzhled. Výška
   v podmínce hlídá ultrawide monitory, kterým by zvětšení ukrojilo
   příliš řádků. */
:root { --ui-zoom: 1; }
@media (min-width: 2200px) and (min-height: 1000px) { :root { --ui-zoom: 1.15; } }
@media (min-width: 2800px) and (min-height: 1250px) { :root { --ui-zoom: 1.3; } }
@media (min-width: 3400px) and (min-height: 1500px) { :root { --ui-zoom: 1.5; } }
@media (min-width: 4400px) and (min-height: 2000px) { :root { --ui-zoom: 1.8; } }
html { zoom: var(--ui-zoom); }

/* Strop šířky obsahu dashboardu (hlavička i stránka). Do prvního stupně
   zoomu platí dosavadních 1536 px (max-w-screen-2xl). Pod zoomem jsou to
   efektivní px, takže na 4K (zoom 1,5) obsah vyplní šířku vedle menu
   a okraj zůstane jen na ještě širších displejích. */
.rv-content-cap { max-width: 1536px; }
@media (min-width: 2200px) and (min-height: 1000px) { .rv-content-cap { max-width: 2200px; } }

/* Tažení v seznamech (Sortable s forceFallback): „duch" pod kurzorem dostává
   polohu a rozměr z getBoundingClientRect() a posun z clientX — obojí ve
   zvětšených px — a zapisuje je do style.top/left/width. Vlastní zoom
   1 / --ui-zoom ho vrátí do stejných px; obsah uvnitř se zvětší zpět. */
.sortable-fallback { zoom: calc(1 / var(--ui-zoom)); }
.sortable-fallback > * { zoom: var(--ui-zoom); }