/* Layout guard — loaded by every page (right after the viewport meta, so the
   page's own styles still win on equal specificity).

   Phones zoom a page OUT when anything on it is wider than the screen (a long
   code line, a log line, a wide table). When that content changes — logs
   refreshing, typing in the editor — the browser re-fits and the page keeps
   getting smaller and bigger. These rules make that impossible site-wide. */

/* Never let the browser auto-enlarge text (Android font boosting, iOS
   landscape text inflation). */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* Nothing may widen the page past the screen. Set on <body> only: with <html>
   left at `visible`, the value is handed to the viewport itself, so body never
   becomes its own scroll container (position:sticky and window scrolling keep
   working, even on pages that set their own body overflow-x). */
body { overflow-x: hidden; }
@supports (overflow-x: clip) {
  body { overflow-x: clip; }
}

/* Pre-formatted blocks scroll inside themselves instead of stretching the page. */
pre { max-width: 100%; overflow-x: auto; }

/* iOS zooms in when a field with a font smaller than 16px gets focus and
   never zooms back out. Touch devices only — desktop keeps the designed size. */
@media (hover: none) and (pointer: coarse) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea {
    font-size: 16px !important;
  }
}