/* ============================================================================
   Shared touch policy — loaded by EVERY document the player can reach.

   This file exists because the rule below used to live in `mobile.css`, and
   `mobile.css` is loaded by `index.html` alone. Moon Foundry, the storybook
   viewer and the landing page each ship their own document, so on those screens
   double-tap-to-zoom was never suppressed — reported as "almost all screens
   break if I randomly zoom by double tapping or whatever".

   Anything here must be true of every screen without exception. Screen-specific
   touch rules belong with that screen's stylesheet, not in this file.
   `tests/unit/styles/touchPolicyParity.test.js` keeps every document linked.
   ========================================================================== */

@media (any-pointer: coarse), (max-width: 1024px) {

  /* NO ZOOM BY ANY GESTURE — EXCEPT A PINCH THAT TOUCHES A CARD.

     Product decision, 2026-09-19, in exactly these terms: "on mobile, allow
     zooming on cards, just for purpose of enlarging text/assets, especially
     without reordering elements when it happens in any way." It narrows the
     2026-07-29 decision ("i wanted zoom blocked everywhere regardless of
     triggering gesture"), which this rule used to express as `pan-x pan-y`.

     `manipulation` is `pan-x pan-y pinch-zoom`: scrolling still works
     everywhere, double-tap zoom is gone everywhere, and the pinch is left to
     `public/scripts/zoom-policy.js`, which cancels every pinch whose fingers
     both missed a card. CSS cannot express "only on cards": touch-action
     composes by RESTRICTION down the ancestor chain, and for a pinch that
     chain runs all the way to the viewport, so the root MUST allow it for any
     descendant to have it. A surface that must never pinch (a paid drag
     canvas) says so itself with `none`; a scroll owner that contains cards
     says `pan-y pinch-zoom`, because bare `pan-y` would take the pinch away
     from every card inside it.

     This must sit on the ROOT for the same reason the old lock did: an early
     attempt listed card surfaces, fixed double-tap on cards and nowhere else,
     and the report came straight back as "double tapping still zooms".

     CSS alone is not enough on iOS: Safari treats pinch as a system gesture and
     raises its own `gesturestart`/`gesturechange` events, which no touch-action
     value suppresses. `zoom-policy.js` cancels those off cards, and is linked
     by every document for the same reason this file is. It also shields layout
     code from the `resize` a pinch fires on iOS, which is how zooming used to
     re-lay screens out. Accessibility note: the browser's magnification is
     back on the one thing worth reading closely; tap-to-inspect remains the
     in-product enlargement. */
  html,
  body {
    touch-action: manipulation;
  }

  /* iOS re-scales text on rotate unless this is pinned. That inflation is a
     second, quieter way a screen that fit its page box stops fitting it: every
     measured layout is suddenly laid out around larger glyphs. */
  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  /* Rubber-band scrolling detaches fixed chrome from the content it belongs to
     for the length of the bounce — the "block swimming" in the report — and on
     a page that already fits there is nothing to scroll to anyway. Surfaces
     that own a real scroll re-enable their own axis locally. */
  body {
    overscroll-behavior: none;
  }

  /* Safari auto-zooms focused fields whose computed type is below 16px. That
     is independent of pinch/double-tap policy, and one late compact rule is
     enough to magnify the whole game and strand pointer state. This shared,
     deliberately-important floor covers every player document and dynamic
     prompt/search field, including touch-capable hybrids whose primary pointer
     happens to be a mouse. Non-text input types are excluded. */
  input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]):not([type="image"]):not([type="hidden"]),
  textarea,
  select,
  [contenteditable="true"],
  [contenteditable="plaintext-only"] {
    font-size: 16px !important;
    -webkit-user-select: text !important;
    user-select: text !important;
  }
}