/* Phone performance layer. Loaded after the locked design CSS; changes cost, not look.
   - film grain: a 2x-viewport layer re-composited 4x per second -> static grain
   - ambient glows: 70vmax layers with blur(60px); they are already radial gradients, so the blur is dropped
   - frosted panels: backdrop-filter over an animated canvas is re-blurred every frame -> solid tint */
@media (hover: none) and (pointer: coarse), (max-width: 760px) {
  .scene-layer::after { animation: none; inset: 0; }
  .glow { filter: none; transition: none; }
  [data-scene] .intro-aside { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(12, 12, 10, .9); }
  .site-menu { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(12, 12, 10, .99); }
}
.perf-lite .scene-layer canvas { display: none; }
.perf-lite .scene-fallback { display: block; }

/* footer social icons */
.footer-bottom { align-items: center; flex-wrap: wrap; }
.footer-social { display: flex; gap: 10px; order: -1; width: 100%; margin-bottom: 4px; }
.footer-social a { display: inline-grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line-soft, #2c2a26); border-radius: 50%; color: #c9c1b4; transition: color .2s, border-color .2s, background .2s; }
.footer-social a:hover, .footer-social a:focus-visible { color: var(--amber, #e4ad4f); border-color: var(--amber, #e4ad4f); background: rgba(228, 173, 79, .06); }
.footer-social svg { width: 17px; height: 17px; }