/* ═══════════════════════════════════════════════════════════════════════════
   RESPONSIVE ENGINE · responsive.css  (isolated module — no core file edits)
   MARVELOUS · MARVIX LABS · MCDITS · MGIT — all 14 domains
   Pairs with responsive.js (which maintains --vh/--svh/--vvw custom props,
   caps devicePixelRatio and emits normalized z-scroll deltas).
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1 · dynamic viewport units (JS keeps these current via visualViewport) ── */
:root {
  --vh: 1vh;            /* 1% of the *visual* viewport height   */
  --svh: 100vh;         /* full stable viewport height in px    */
  --vvw: 100vw;         /* visual viewport width in px          */
  --rc-safe-b: env(safe-area-inset-bottom, 0px);
  --rc-safe-r: env(safe-area-inset-right, 0px);
  --rc-safe-l: env(safe-area-inset-left, 0px);
  --rc-safe-t: env(safe-area-inset-top, 0px);
}

/* opt-in full-height that never clips under mobile URL bars:
   add .rc-fullheight to any section that was min-height:100vh */
.rc-fullheight { min-height: 100vh; min-height: calc(var(--vh, 1vh) * 100); }
.rc-fullheight-fixed { height: 100vh; height: var(--svh, 100vh); }

/* ── 2 · pull-to-refresh + overscroll neutralization ── */
html, body {
  overscroll-behavior-y: none;        /* kills native pull-to-refresh + glow  */
  overscroll-behavior-x: none;
}
/* WebGL / z-scroll stages own their gestures — no browser panning inside   */
[data-z-scroll], .rc-canvas-stage, canvas.rc-owned {
  touch-action: none;
  -webkit-user-select: none; user-select: none;
  -webkit-tap-highlight-color: transparent;
}
/* normal content keeps natural vertical panning (pinch-zoom preserved off) */
[data-z-scroll-page], .rc-scroll-normal { touch-action: pan-y; }

/* ── 3 · URL-bar resize protection ──
   Fixed stages sized by --svh don't re-layout when only the address bar
   collapses; responsive.js additionally suppresses height-only resize noise. */
.rc-stage-lock {
  position: fixed; inset: 0;
  height: 100vh; height: var(--svh, 100vh);
  width: 100vw;
}
html.rc-vv-settling .rc-stage-lock canvas { transition: none !important; }

/* ── 4 · hardware-accelerated compositing for moving panels ── */
[data-gpu], .rc-gpu,
.gx-dock, .ai-trigger, .ai-panel, .gx-top, .mx-sound, .notif-toast {
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
}
/* card grids keep plain compositing hints only — promoting dozens of layers
   costs GPU memory and causes the very lag it was meant to prevent          */
.gx-curve-card, .gx-depth-card, .gx-orbit-card, .dev-card, .mx-eco-card {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
@media (prefers-reduced-motion: reduce) {
  [data-gpu], .rc-gpu { will-change: auto; }
}

/* ── 5 · mobile UI cleanup (≤768px) ──
   Hide every left-hand floating rail/icon; keep ONLY the AI assistant,
   anchored bottom-right above the home indicator. responsive.js also tags
   unknown left-floating fixed controls with .rc-mobile-hidden generically.  */
@media (max-width: 768px) {
  .gx-dock, .mcd-dock,
  .rc-mobile-hidden,
  [data-mobile-hide] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  .mx-sound {                                        /* sound stays on every viewport */
    display: grid !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  .ai-trigger, [data-ai-bot] {
    display: grid !important;
    position: fixed !important;
    left: auto !important; top: auto !important;
    right: calc(16px + var(--rc-safe-r)) !important;
    bottom: calc(16px + var(--rc-safe-b)) !important;
    z-index: 2147483200 !important;
  }
  .ai-panel {
    right: calc(10px + var(--rc-safe-r)) !important;
    bottom: calc(84px + var(--rc-safe-b)) !important;
    max-height: calc(var(--vh, 1vh) * 100 - 120px);
  }
  /* anything the site must keep on mobile opts out with data-keep-mobile */
  [data-keep-mobile] {
    display: revert !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
}

/* ── 6 · orientation-change smoothing ── */
html.rc-orienting * { transition: none !important; animation-play-state: paused !important; }