/**
 * Mobile / tablet paint performance.
 * Scope: touch devices or viewport <= 1024px.
 * Goal: cut GPU cost of backdrop-filter during scroll without changing layout or JS behavior.
 * Desktop (wide + fine pointer) keeps the original glass look.
 */
@media (max-width: 1024px), ((hover: none) and (pointer: coarse)) {
    /* Backdrop blur is the main freeze cause on mid-range mobile GPUs. */
    [class*="backdrop-blur"] {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    /*
     * Slightly raise opacity so panels stay readable after blur is removed.
     * Targets common Mana glass utility combinations only.
     */




    /*[class*="backdrop-blur"][class*="bg-white/40"],
    [class*="backdrop-blur"][class*="bg-white/50"],
    [class*="backdrop-blur"][class*="bg-white/20"] {*/
       /* background-color: rgb(255 255 255 / 0.94) !important;*/
    /*}

    [class*="backdrop-blur"][class*="bg-white/80"],
    [class*="backdrop-blur"][class*="bg-white/90"] {*/
  /*      background-color: rgb(255 255 255 / 0.96) !important;*/
    /*}

    [class*="backdrop-blur"][class*="bg-gray-200/60"],
    [class*="backdrop-blur"][class*="bg-gray-100"] {*/
      /*  background-color: rgb(243 244 246 / 0.96) !important;*/
    /*}

    .dark [class*="backdrop-blur"][class*="dark:bg-white/5"],
    .dark [class*="backdrop-blur"][class*="dark:bg-white/10"],
    .dark [class*="backdrop-blur"][class*="dark:bg-gray-950/40"],
    .dark [class*="backdrop-blur"][class*="dark:bg-[var(--color-primary-950)]/60"],
    .dark [class*="backdrop-blur"][class*="dark:bg-[var(--color-primary-950)]/90"] {
        background-color: rgb(5 5 5 / 0.94) !important;
    }*/




    /* Continuous shimmer forces constant repaints; hover still works without the loop. */
    [class*="animate-[shimmer"] {
        animation: none !important;
    }

    /*
     * Skip layout/paint work for far off-screen footer only.
     * Avoid overlays/drawers so open/close behavior stays identical.
     */
    footer {
        content-visibility: auto;
        contain-intrinsic-size: 1px 600px;
    }

    /* Prefer compositor-friendly scrolling on touch. */
    html {
        -webkit-overflow-scrolling: touch;
    }
}
