/* ═══════════════════════════════════════════════════════════════
   MOBILE PERFORMANCE
   Loaded ONLY on touch devices via media="(pointer:coarse)"
   Kills everything that causes phone freeze
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. Kill ambient layers ── */
#sakuraCanvas { display: none !important; }
#scanLines    { display: none !important; }
.orb          { display: none !important; }

/* ── 2. Kill ALL CSS animations and transitions ──
   neonPulse / statusBlink / tailSwing / eyeBlink / orb / shimmer
   all animate box-shadow, filter, or transform — GPU killers      */
*, *::before, *::after {
  animation:        none !important;
  transition-duration: 0.1s !important;
}

/* ── 3. Re-enable essential UX transitions — GPU-only ── */
.gold-spin { animation: spin 0.8s linear infinite !important; }
.sb        { transition: transform 0.28s cubic-bezier(0.22,1,0.36,1) !important; }
.overlay   { transition: opacity 0.18s ease !important; }
.modal     { transition: transform 0.28s cubic-bezier(0.22,1,0.36,1), opacity 0.18s ease !important; }
.toast     { transition: transform 0.28s cubic-bezier(0.34,1.56,0.64,1), opacity 0.18s ease !important; }
.bottom-nav { transition: none !important; }
.bn-item   { transition: color 0.12s ease !important; }
.bn-pip    { transition: opacity 0.12s ease, transform 0.18s cubic-bezier(0.22,1,0.36,1) !important; }
/* Re-enable pane entrance on mobile */
.pane.active { animation: paneIn 0.25s cubic-bezier(0.22,1,0.36,1) !important; }
/* Re-enable skeleton bone animations — transform-only, GPU safe */
/* transform-box + transform-origin must be !important to override SVG default (view-box) */
/* Explicit longhands added to each class so class specificity (0,1,0) beats the
   wildcard reduced-motion block in enterprise.css (0,0,0) on Android builds
   that mishandle shorthand vs longhand !important cascade.                      */
.sk-jaw {
  -webkit-animation: jawChatter 2.8s ease-in-out infinite !important;
          animation: jawChatter 2.8s ease-in-out infinite !important;
  animation-name: jawChatter !important;
  animation-duration: 2.8s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  animation-play-state: running !important;
  -webkit-transform-box: fill-box !important;
          transform-box: fill-box !important;
  -webkit-transform-origin: center top !important;
          transform-origin: center top !important;
}
.sk-rib {
  -webkit-animation: ribBreath 2.4s ease-in-out infinite !important;
          animation: ribBreath 2.4s ease-in-out infinite !important;
  animation-name: ribBreath !important;
  animation-duration: 2.4s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  animation-play-state: running !important;
  -webkit-transform-box: fill-box !important;
          transform-box: fill-box !important;
  -webkit-transform-origin: center center !important;
          transform-origin: center center !important;
}
.sk-arm-l {
  -webkit-animation: armSwing 3.5s ease-in-out infinite !important;
          animation: armSwing 3.5s ease-in-out infinite !important;
  animation-name: armSwing !important;
  animation-duration: 3.5s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  animation-play-state: running !important;
  -webkit-transform-box: fill-box !important;
          transform-box: fill-box !important;
  -webkit-transform-origin: 90% 0% !important;
          transform-origin: 90% 0% !important;
}
.sk-arm-r {
  -webkit-animation: armSwing 3.5s ease-in-out infinite !important;
          animation: armSwing 3.5s ease-in-out infinite !important;
  animation-name: armSwing !important;
  animation-duration: 3.5s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  animation-play-state: running !important;
  -webkit-animation-delay: 0.6s !important;
          animation-delay: 0.6s !important;
  -webkit-transform-box: fill-box !important;
          transform-box: fill-box !important;
  -webkit-transform-origin: 10% 0% !important;
          transform-origin: 10% 0% !important;
}
.sk-eye-l {
  -webkit-animation: eyeBlink 5s infinite !important;
          animation: eyeBlink 5s infinite !important;
  animation-name: eyeBlink !important;
  animation-duration: 5s !important;
  animation-iteration-count: infinite !important;
  animation-play-state: running !important;
  -webkit-transform-box: fill-box !important;
          transform-box: fill-box !important;
  -webkit-transform-origin: center center !important;
          transform-origin: center center !important;
}
.sk-eye-r {
  -webkit-animation: eyeBlink 5s infinite !important;
          animation: eyeBlink 5s infinite !important;
  animation-name: eyeBlink !important;
  animation-duration: 5s !important;
  animation-iteration-count: infinite !important;
  animation-play-state: running !important;
  -webkit-animation-delay: 0.07s !important;
          animation-delay: 0.07s !important;
  -webkit-transform-box: fill-box !important;
          transform-box: fill-box !important;
  -webkit-transform-origin: center center !important;
          transform-origin: center center !important;
}
/* Re-enable skeleton float — subtle vertical bounce, GPU-only */
.cat-svg, .ov-mini-cat {
  animation: floatSlow 4s ease-in-out infinite !important;
  animation-name: floatSlow !important;
  animation-duration: 4s !important;
  animation-iteration-count: infinite !important;
  animation-play-state: running !important;
}


/* ── 4. Remove every box-shadow (most expensive mobile repaint op) ── */
* { box-shadow: none !important; }

/* ── 5. Remove text-shadow glow ── */
* { text-shadow: none !important; }

/* ── 6. Kill SVG feGaussianBlur filters (animated = freeze) ── */
svg, svg * { filter: none !important; }
.cat-svg, .ov-mini-cat { filter: none !important; }

/* ── 7. Simplify backgrounds ── */
body { background: #06000f !important; }
.setup-card {
  background: rgba(20, 0, 28, 0.97) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.overlay {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
#sbOverlay {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: rgba(0,0,0,0.75) !important;
}

/* ── 8. Flatten shimmer text (shimmer animation = repaint) ── */
.tb-gl, .gold-grad {
  background: none !important;
  color: #ff2d78 !important;
  -webkit-text-fill-color: #ff2d78 !important;
}
.gold-word {
  background: none !important;
  color: #ff6b9d !important;
  -webkit-text-fill-color: #ff6b9d !important;
}

/* ── 9. Simplify live dot and status indicators ── */
.live-dot { background: #00e5a0 !important; border-radius: 50% !important; }
.ld       { background: #00e5a0 !important; }

/* ── 10. Remove will-change hints (increases memory on mobile) ── */
* { will-change: auto !important; }

/* ── 11. Promote scrollable containers to own layer ── */
.tab-body,
.sb-list,
#amWrap,
#msgList,
.bulk-list { -webkit-overflow-scrolling: touch; }

/* ── 11a. Force message list items visible — animation:none can leave elements at opacity:0
   if core.js adds them with the .nm (new message) class before the transition fires ── */
.msg-bub,
.am-card   { opacity: 1 !important; visibility: visible !important; }
/* core.js sets #msgList height via inline style; override so tab-body scrolls instead */
#msgList   { display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; overflow-y: visible !important; min-height: 0 !important; }

/* ── 12. GPU-accelerated sidebar slide ── */
/* Sidebar hidden by default — only shows when panel open AND not collapsed */
.sb { transform: translateZ(0) translateX(-100%); }
#panel.open:not(.sb-collapsed) .sb { transform: translateZ(0) translateX(0); }
#panel.sb-collapsed .sb { transform: translateZ(0) translateX(-100%) !important; }

/* ── 13. Prevent pull-to-refresh and bounce scroll (enterprise requirement) ── */
html, body {
  overscroll-behavior: none;
  overscroll-behavior-y: none;
  -webkit-overflow-scrolling: auto;
}
#setup, #panel { overscroll-behavior: contain; }

/* ── 14. Contain removed — contain:layout makes #panel a fixed-positioning context,
   which breaks sidebar/bottom-nav positioning on iOS Safari ── */

/* ── 15. Optimise touch latency — 300ms tap delay fix ── */
html { touch-action: manipulation; }
a, button, [onclick], .tab, .dev-item, .msg-bub, .am-card {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

/* ── 16. Kill will-change already promoted in desktop layout ── */
.cat-wrap { will-change: auto !important; contain: none !important; }

/* ── 17. Multi-send elements — ensure visible, no animation stall ── */
.smode-btn, #sMultiInp, #sMultiBtn, #sMultiRes, #sSingleWrap, #sMultiWrap {
  opacity: 1 !important;
  visibility: visible !important;
}
/* Kill the sc2 shimmer top bar on mobile (background-position animation = repaint) */
.sc2::before { animation: none !important; background: var(--mint) !important; background-size: auto !important; }

/* ── 18. Larger touch targets for mode toggle ── */
.smode-btn { min-height: 44px !important; }
.sms-mode-tog { gap: 6px !important; }

/* ── 19. Remove border radius blur on send form (expensive GPU op on phones) ── */
.sc2 { border-radius: 16px !important; }
.smode-btn { border-radius: 9px !important; }
