/* ===========================================================================
 * cryo-ergo.css — CRYO-ERGO: the shared ergonomics baseline.
 * Master doc PART 3 §6c, §0.2 rule 20.
 * ---------------------------------------------------------------------------
 * Loaded on EVERY page by mobile_menu_styles() (assets/shared_mobile/mobile_nav.php),
 * which shared_desk/header.php and shared_mobile/topbar.php both call — so this is
 * one edit for the whole portfolio.
 *
 * Deliberately CONSERVATIVE: only rules that cannot reflow an app's own layout
 * live here (form-control type size, shared-chrome tap targets, focus ring,
 * reduced motion, tap latency). Per-app target sizing is a per-app job — use the
 * .cryo-tap utility at the bottom rather than adding blanket rules here.
 * ======================================================================== */

:root{
  --cryo-tap:44px;              /* the §6c floor: 48dp native / 44px web */
  --cryo-tap-gap:8px;
  --cryo-focus:#0077B6;         /* the suite's action blue */
}

/* ── 1. Form controls never sit below the iOS zoom threshold ───────────────
   Anything under 16px makes Safari zoom the page on focus, and the user then
   has to pinch back out — the single most common ergonomic defect on the
   suite's forms. max() keeps a larger app-set size intact. */
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=hidden]),
select,
textarea{ font-size:max(16px, 1em); }

/* ── 2. Shared chrome meets the tap floor ──────────────────────────────────
   min-* always beats the width/height those components set (including inside
   their narrow-width media queries, where share/menu drop to 34px). */
.topbar .df-share-full.df-share-icon,
.topbar .mobile-menu-trigger,
.mobile-menu-trigger,
.cryo-share-full,          /* the cryo-unified.css variant of the share square */
.mobile-menu-close,        /* the legacy slide-in panel's close button (40x40) */
.cryo-fullmenu-ic{
  min-width:var(--cryo-tap);
  min-height:var(--cryo-tap);
}
/* The skip-to-content link (cryo-theme.css) — an a11y affordance, so it of all
   things must clear the floor. It measured 42px, 2px short, on every page. */
.cryo-skip-link{ min-height:var(--cryo-tap); display:inline-flex; align-items:center; }
.df-actions{ gap:max(var(--cryo-tap-gap), .5rem); }

/* The shared button component (cryo-unified.css `.cryo-btn`) computed to ~38px
   from padding alone. min-height only ever grows the box, so this cannot break a
   layout horizontally — but a genuinely dense row (a data table's inline action)
   can opt out with .cryo-tap-exempt rather than the rule being watered down. */
.cryo-btn{ min-height:var(--cryo-tap); }
.cryo-btn.cryo-tap-exempt, .cryo-tap-exempt{ min-height:0; min-width:0; }

/* ── 3. Fixed bottom chrome clears the home indicator ──────────────────────
   Opt-in by class/attribute so we never pad a bar that is not actually fixed. */
.cryo-bottomnav,
.cryo-fixed-bottom,
[data-cryo-fixed-bottom]{
  padding-bottom:max(8px, env(safe-area-inset-bottom));
}

/* ── 4. Keyboard focus is always visible ───────────────────────────────────
   :focus-visible only — pointer users see nothing change. */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:2px solid var(--cryo-focus);
  outline-offset:2px;
  border-radius:6px;
}

/* ── 5. Reduced motion is honoured suite-wide ──────────────────────────────
   The animation pass is decoration; it is never the only cue. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* ── 6. Tap latency + highlight ────────────────────────────────────────────
   touch-action:manipulation removes the ~300ms double-tap-zoom wait, so every
   tap answers inside the §6c 100ms budget. No layout effect. */
a,button,[role="button"],input,select,textarea,label,summary{
  touch-action:manipulation;
  -webkit-tap-highlight-color:rgba(0,119,182,.14);
}

/* ── 7. Utility: opt a control up to the tap floor ─────────────────────────
   Per-app fix for an undersized control — add the class, don't write a new
   blanket rule. .cryo-tap-inline keeps it inline-level. */
.cryo-tap{ min-width:var(--cryo-tap); min-height:var(--cryo-tap); }
.cryo-tap-inline{ min-height:var(--cryo-tap); display:inline-flex; align-items:center; }
/* Screen-reader-only label text (for naming an icon-only control in place). */
.cryo-sr{ position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0; }