/* HRK PWA app-shell — global rules that make the standalone-installed * site feel like a native iOS app. Loaded on every page via the head * block managed by scripts/inject_pwa_head.py. * * Only the rules that ALWAYS apply (regardless of standalone) live in * the :root block. Rules that activate only when running as installed * PWA are scoped inside @media (display-mode: standalone) and the * supports-based standalone selector for older iOS Safari (which * never updated to support display-mode: standalone in the matcher * sense — uses navigator.standalone via JS to add .pwa-standalone). */ :root { /* iPhone X+ safe-area insets. Pages opt in by padding with these. */ --hrk-safe-top: env(safe-area-inset-top, 0px); --hrk-safe-right: env(safe-area-inset-right, 0px); --hrk-safe-bottom: env(safe-area-inset-bottom, 0px); --hrk-safe-left: env(safe-area-inset-left, 0px); /* Bottom tab bar height — used by pages to reserve scroll room. */ --hrk-tabbar-h: 50px; } html, body { /* Block iOS's pull-to-refresh + overscroll bounce on the document. Inner scrollable elements (tables, dialogs) keep their own scroll. */ overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; /* ─── iOS SCROLL FREEZE FIX — DO NOT REMOVE ─────────────────────── `background-attachment: fixed` on HARD-FREEZES scrolling on iOS WebKit (Safari AND iOS Chrome — both are WebKit). The page becomes completely unscrollable on iPhone. Several HRK pages set it on html,body for a subtle fixed top glow; this global !important override neutralizes it everywhere app-shell.css is loaded (all 45 /app/*.html pages) without having to touch each page's