/* ============================================================================
   game-ricochet.css — visual layer owned exclusively by ricochet.
   Loaded only on ricochet pages, after site.css / themes.css / games.css, so rules
   here win without touching any shared stylesheet.
   TURBO POP facelift: sunlit toy-block demolition. The canvas owns almost all
   presentation; this layer handles the drag affordance and warms the frame.
   ========================================================================== */

/* the whole game is a drag gesture — advertise it */
[data-game=ricochet] #gamecanvas {
  cursor: grab;
  touch-action: none;
}
[data-game=ricochet] #gamecanvas:active {
  cursor: grabbing;
}

/* sunlit keyline around the stage so the canvas reads as a lit toy box.
   The canvas now renders a genuine daylight sky, so the frame carries a warm
   halo rather than only a drop shadow — the light has to look like it comes
   from inside the diorama. */
[data-game=ricochet] #stage {
  position: relative;
  border-radius: 10px;
  box-shadow:
    0 0 0 1px oklch(0.42 0.06 55 / .55),
    0 0 54px -6px oklch(0.82 0.13 78 / .38),
    0 14px 40px rgb(0 0 0 / .45);
}

/* a soft top-light on the frame: bright at the sky end, clear over the yard,
   so the edges never crush the new daylight scene */
[data-game=ricochet] #stage::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow:
    inset 0 20px 44px -24px oklch(0.95 0.09 85 / .5),
    inset 0 -30px 60px -30px rgb(8 16 10 / .55);
}

/* respect the site-wide fx kill-switch */
body[data-fx="off"][data-game=ricochet] #stage {
  box-shadow: 0 0 0 1px oklch(0.42 0.06 55 / .55), 0 14px 40px rgb(0 0 0 / .45);
}
body[data-fx="off"][data-game=ricochet] #stage::after { display: none; }