/* Keep the full-screen dialog on a stable, opaque surface on phones.
   Scaling a blurred top-layer dialog repaints the entire page on mobile GPUs. */
@media(max-width:700px),(pointer:coarse){
  #service-dialog[open]{animation:none;transform:none;border-radius:0}
  #service-dialog::backdrop{background:#fdfdfc;backdrop-filter:none;-webkit-backdrop-filter:none}
  #service-dialog[open] #service-content{animation:service-content-arrive .28s ease-out both}
  #photo-wheel{filter:none}
  .wheel-part:hover{opacity:1}
}
@keyframes service-content-arrive{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
@media(prefers-reduced-motion:reduce){
  #service-dialog[open] #service-content{animation:none}
}