/* Approved C02 desktop artwork and hotspots share the existing 1600x900 canvas.
   Layered important rules take priority over legacy unlayered Studio offsets. */
@layer fc-arcade-c02 {
  @media (min-width: 761px) {
    #arcade-scene {
      background-image: url("assets/arcade-main-c04-c02-v100.webp") !important;
      background-size: 100% 100% !important;
      background-position: center !important;
      background-repeat: no-repeat !important;
    }
    #arcade-scene > .machine-hotspot {
      position: absolute !important;
      box-sizing: border-box !important;
      translate: none !important;
      transform: none !important;
      scale: none !important;
      padding: 0 !important;
      border-radius: 12px !important;
      touch-action: manipulation;
    }
    /* x=10 y=190 w=250 h=525 */
    #arcade-scene > .machine-hotspot--prism {
      left: .625% !important; top: 21.111111% !important;
      width: 15.625% !important; height: 58.333333% !important;
    }
    /* x=620 y=190 w=490 h=400 */
    #arcade-scene > .machine-hotspot--rhythm {
      left: 38.75% !important; top: 21.111111% !important;
      width: 30.625% !important; height: 44.444444% !important;
    }
    /* x=1264 y=250 w=336 h=425 */
    #arcade-scene > .machine-hotspot--coop {
      left: 79% !important; top: 27.777778% !important;
      width: 21% !important; height: 47.222222% !important;
    }
    #arcade-scene > .machine-hotspot::before {
      inset: 1px !important;
      border-radius: 10px !important;
    }
    #arcade-scene > .machine-hotspot:focus-visible {
      outline: 3px solid #ffdd80 !important;
      outline-offset: -3px !important;
    }
    /* One placement in normal and fullscreen modes; no viewport-specific nudge. */
    #arcade-scene > .scene-nav {
      top: 77.222222% !important; width: 30% !important;
      height: 17.777778% !important; translate: none !important;
      transform: none !important; scale: none !important;
    }
    #arcade-scene > .scene-nav--ticket { left: 3.75% !important; }
    #arcade-scene > .scene-nav--karaoke { left: 66.25% !important; opacity: 1 !important; }
    #arcade-scene > button.scene-nav:focus-visible {
      outline: 3px solid #ffdd80 !important;
      outline-offset: -4px !important;
      border-radius: 14px;
    }
    #arcade-scene > .scene-nav--karaoke:hover,
    #arcade-scene.show-targets > .scene-nav--karaoke {
      filter: brightness(1.15) drop-shadow(0 0 12px #f7cf7377);
    }
  }
  @media (max-width: 760px) {
    #arcade-scene > .machine-hotspot--coop {
      display: none !important;
    }
  }
}