/* Performance layer — loaded after portfolio.css.
   1) Fixes that apply on every device (no visible change).
   2) "perf-lite" tier for weak devices / slow networks (set by the inline head
      script and by assets/perf-tier.js after measuring real frame rate). */

/* ---------- every device ---------- */
/* Full-screen grain with mix-blend-mode was repainted 12x/second: keep it, but static. */
#grain{animation:none!important}
/* Moving elements with a blurred backdrop re-blur the page every frame. Their
   backgrounds are already ~80-90% opaque, so the blur adds almost nothing. */
.hero-float-card,.status-pill{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.hero-float-card,.status-pill,.portrait img{will-change:transform}

/* ---------- weak devices / slow networks ---------- */
html.perf-lite *,html.perf-lite *::before,html.perf-lite *::after{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
/* without blur, make the bars a little more opaque — keeping each bar's own colour */
html.perf-lite nav.on-light:not(.glass),html.perf-lite nav.on-hero.scrolled:not(.glass){background-color:rgba(250,250,250,.97)}
html.perf-lite nav.glass{background-color:rgba(10,10,12,.96)}
html.perf-lite .am-overlay{background:rgba(6,6,8,.82)}
/* purely decorative loops */
html.perf-lite .star,
html.perf-lite .hero-rings span,
html.perf-lite .ach-orb::before,
html.perf-lite .ach-orb::after,
html.perf-lite .orb-img-wrap,
html.perf-lite .cf-seal-ring,
html.perf-lite .portrait img{animation:none!important}
html.perf-lite #grain{display:none}