/* Full-page treatment for image-world mini-games added in the latest set. */
.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-backdrop,
.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-card::before,
.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-kicker,
.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-title,
.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-prompt,
.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-guidance-toggle,
.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-challenge-charm,
.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-brain,
.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-coach,
.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-board::after {
  display: none !important;
}

.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-card {
  padding: 0;
  overflow: hidden;
  background: #211642;
}

.mini-game-board:is(
    .bubbleWandPop,
    .bubble-wand-pop,
    .princessDressUp,
    .princess-dress-up,
    .crownRhythmTap,
    .crown-rhythm-tap,
    .braceletBuilder,
    .bracelet-builder-board,
    .swanBoatGlide,
    .swan-boat-glide,
    .secretGardenGrow,
    .secret-garden-grow,
    .constellationDraw,
    .constellation-draw,
    .royalKitchenCook,
    .royal-kitchen-cook,
    .royalMailRelay,
    .royal-mail-relay,
    .lanternSkyPatterns,
    .lantern-sky-patterns,
    .observatoryOrbitOrder,
    .observatory-orbit-order,
    .crystalEchoMatch,
    .crystal-echo-match,
    .royalQuiltWorkshop,
    .royal-quilt-workshop,
    .rainbowBridgeBuilder,
    .rainbow-bridge-builder,
    .clockTowerChimes,
    .clock-tower-chimes
  ) {
  width: 100%;
  height: 100dvh;
  min-height: 100dvh;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  display: block;
  overflow: hidden;
  box-shadow: none;
}

.bubble-wand-shell,
.dress-up-shell,
.crown-rhythm-shell,
.swan-boat-shell,
.secret-garden-shell,
.constellation-shell,
.royal-kitchen-shell,
.royal-mail-shell,
.lantern-sky-shell,
.observatory-orbit-shell,
.crystal-echo-shell,
.royal-quilt-shell,
.rainbow-bridge-shell,
.clock-chime-shell {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: 100dvh;
  min-height: 100dvh;
  margin: 0;
  padding: clamp(58px, 7dvh, 76px) 14px
    max(12px, env(safe-area-inset-bottom));
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 10px;
}

.bubble-wand-stage,
.dress-up-stage,
.crown-rhythm-stage,
.swan-boat-stage,
.secret-garden-stage,
.constellation-stage,
.royal-kitchen-stage,
.royal-mail-stage,
.lantern-sky-stage,
.observatory-orbit-stage,
.crystal-echo-stage,
.royal-quilt-stage,
.rainbow-bridge-stage,
.clock-chime-stage {
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  max-height: none;
  margin: 0;
  aspect-ratio: auto;
  border-radius: 0;
}

.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-close {
  position: fixed;
  left: max(12px, env(safe-area-inset-left));
  top: max(12px, env(safe-area-inset-top));
  z-index: 320;
  min-width: 72px;
  height: 44px;
  margin: 0;
  padding: 0 14px;
  border-width: 2px;
  background: rgba(107, 34, 71, 0.88);
  box-shadow: 0 8px 18px rgba(44, 26, 58, 0.18);
  font-size: 14px;
}

.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-progress {
  position: fixed;
  right: max(14px, env(safe-area-inset-right));
  top: max(14px, env(safe-area-inset-top));
  z-index: 320;
  max-width: min(410px, calc(100vw - 150px));
  min-height: 0;
  margin: 0;
  padding: 9px 14px;
  border: 2px solid rgba(255, 216, 107, 0.58);
  border-radius: 999px;
  background: rgba(255, 253, 238, 0.92);
  color: #6b2247;
  box-shadow: 0 8px 18px rgba(33, 20, 68, 0.2);
  font:
    900 15px/1.08 "Arial Rounded MT Bold",
    "Trebuchet MS",
    Arial,
    sans-serif;
  text-align: center;
  backdrop-filter: blur(8px);
}

.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-feedback {
  position: fixed;
  left: 50%;
  bottom: max(14px, calc(env(safe-area-inset-bottom) + 14px));
  z-index: 315;
  width: min(560px, calc(100vw - 32px));
  min-height: 0;
  margin: 0;
  padding: 10px 14px;
  transform: translateX(-50%);
  border: 2px solid rgba(255, 216, 107, 0.62);
  border-radius: 8px;
  background: rgba(255, 253, 238, 0.93);
  color: #23633a;
  box-shadow: 0 8px 18px rgba(33, 20, 68, 0.18);
  font:
    900 14px/1.18 "Arial Rounded MT Bold",
    "Trebuchet MS",
    Arial,
    sans-serif;
  text-align: center;
  backdrop-filter: blur(8px);
}

.mini-game-modal:has(
    .mini-game-board:is(
        .bubbleWandPop,
        .bubble-wand-pop,
        .princessDressUp,
        .princess-dress-up,
        .crownRhythmTap,
        .crown-rhythm-tap,
        .braceletBuilder,
        .bracelet-builder-board,
        .drawbridgePuzzle,
        .drawbridge-puzzle-board,
        .swanBoatGlide,
        .swan-boat-glide,
        .secretGardenGrow,
        .secret-garden-grow,
        .constellationDraw,
        .constellation-draw,
        .royalKitchenCook,
        .royal-kitchen-cook,
        .royalMailRelay,
        .royal-mail-relay,
        .lanternSkyPatterns,
        .lantern-sky-patterns,
        .observatoryOrbitOrder,
        .observatory-orbit-order,
        .crystalEchoMatch,
        .crystal-echo-match,
        .royalQuiltWorkshop,
        .royal-quilt-workshop,
        .rainbowBridgeBuilder,
        .rainbow-bridge-builder,
        .clockTowerChimes,
        .clock-tower-chimes
      )
  )
  .mini-game-feedback:empty {
  display: none;
}

.mini-game-board.bracelet-builder-board {
  height: 100dvh;
  min-height: 100dvh;
  padding: 0;
  display: block;
  overflow: hidden;
}
.bracelet-stage {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: 100dvh;
  min-height: 100dvh;
  padding: clamp(58px, 7dvh, 76px) 14px
    max(12px, env(safe-area-inset-bottom));
  align-content: center;
}
.bracelet-string {
  width: min(100%, 900px);
  min-height: clamp(260px, 42dvh, 460px);
}
.bracelet-palette,
.bracelet-actions,
.bracelet-saved-row,
.bracelet-pattern-proof {
  width: min(100%, 900px);
}

.mini-game-board.drawbridge-puzzle-board {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-height: 100dvh;
  overflow-x: clip;
}
.drawbridge-stage {
  width: min(88vw, 620px) !important;
  height: clamp(170px, 30dvh, 280px) !important;
  margin: 0 auto clamp(4px, 1vh, 10px) !important;
}
.drawbridge-gate {
  width: clamp(110px, 18vw, 170px) !important;
  height: clamp(128px, 24dvh, 220px) !important;
  border-width: clamp(5px, 0.7vw, 8px) !important;
  font-size: clamp(34px, 7vw, 62px) !important;
}
.drawbridge-plank {
  bottom: 0 !important;
  width: clamp(58px, 10vw, 96px) !important;
  height: clamp(24px, 4vw, 38px) !important;
  border-width: clamp(2px, 0.4vw, 4px) !important;
}
.drawbridge-plank-0 {
  left: calc(50% - clamp(116px, 20vw, 192px)) !important;
}
.drawbridge-plank-1 {
  left: calc(50% - clamp(58px, 10vw, 96px)) !important;
}
.drawbridge-plank-2 {
  left: 50% !important;
}
.drawbridge-plank-3 {
  left: calc(50% + clamp(58px, 10vw, 96px)) !important;
}
.drawbridge-visitor {
  font-size: clamp(24px, 5vw, 46px) !important;
}
.drawbridge-hint,
.drawbridge-strategy,
.drawbridge-feedback {
  box-sizing: border-box;
  width: min(100%, 720px) !important;
  max-width: min(100%, 720px) !important;
  font-size: clamp(14px, 2.2vw, 20px) !important;
  line-height: 1.25 !important;
}
.drawbridge-levers {
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: clamp(14px, 3vw, 34px) !important;
  max-width: min(100%, 920px);
}
.drawbridge-lever {
  gap: 7px !important;
}
.drawbridge-lever-stem {
  width: clamp(12px, 1.6vw, 20px) !important;
  height: clamp(72px, 12dvh, 128px) !important;
}
.drawbridge-lever-knob {
  width: clamp(28px, 4.5vw, 48px) !important;
  height: clamp(28px, 4.5vw, 48px) !important;
}
.drawbridge-lever-label,
.drawbridge-lever-state {
  font-size: clamp(12px, 1.8vw, 16px) !important;
}
.drawbridge-check {
  min-height: 52px !important;
  padding: 12px 26px !important;
  font-size: clamp(15px, 2vw, 20px) !important;
}

@media (max-width: 620px) {
  .bubble-wand-shell,
  .dress-up-shell,
  .crown-rhythm-shell,
  .swan-boat-shell,
  .secret-garden-shell,
  .constellation-shell,
  .royal-kitchen-shell,
  .royal-mail-shell,
  .lantern-sky-shell,
  .observatory-orbit-shell,
  .crystal-echo-shell,
  .royal-quilt-shell,
  .rainbow-bridge-shell,
  .clock-chime-shell,
  .bracelet-stage {
    gap: 8px;
    padding: 62px 8px max(10px, env(safe-area-inset-bottom));
  }

  .mini-game-modal:has(
      .mini-game-board:is(
          .bubbleWandPop,
          .bubble-wand-pop,
          .princessDressUp,
          .princess-dress-up,
          .crownRhythmTap,
          .crown-rhythm-tap,
          .braceletBuilder,
          .bracelet-builder-board,
          .drawbridgePuzzle,
          .drawbridge-puzzle-board,
          .swanBoatGlide,
          .swan-boat-glide,
          .secretGardenGrow,
          .secret-garden-grow,
          .constellationDraw,
          .constellation-draw,
          .royalKitchenCook,
          .royal-kitchen-cook,
          .royalMailRelay,
          .royal-mail-relay,
          .lanternSkyPatterns,
          .lantern-sky-patterns,
          .observatoryOrbitOrder,
          .observatory-orbit-order,
          .crystalEchoMatch,
          .crystal-echo-match,
          .royalQuiltWorkshop,
          .royal-quilt-workshop,
          .rainbowBridgeBuilder,
          .rainbow-bridge-builder,
          .clockTowerChimes,
          .clock-tower-chimes
        )
    )
    .mini-game-progress {
    max-width: calc(100vw - 118px);
    padding: 8px 10px;
    font-size: 12px;
  }

  .mini-game-modal:has(
      .mini-game-board:is(
          .bubbleWandPop,
          .bubble-wand-pop,
          .princessDressUp,
          .princess-dress-up,
          .crownRhythmTap,
          .crown-rhythm-tap,
          .braceletBuilder,
          .bracelet-builder-board,
          .drawbridgePuzzle,
          .drawbridge-puzzle-board,
          .swanBoatGlide,
          .swan-boat-glide,
          .secretGardenGrow,
          .secret-garden-grow,
          .constellationDraw,
          .constellation-draw,
          .royalKitchenCook,
          .royal-kitchen-cook,
          .royalMailRelay,
          .royal-mail-relay,
          .lanternSkyPatterns,
          .lantern-sky-patterns,
          .observatoryOrbitOrder,
          .observatory-orbit-order,
          .crystalEchoMatch,
          .crystal-echo-match,
          .royalQuiltWorkshop,
          .royal-quilt-workshop,
          .rainbowBridgeBuilder,
          .rainbow-bridge-builder,
          .clockTowerChimes,
          .clock-tower-chimes
        )
    )
    .mini-game-feedback {
    bottom: max(10px, calc(env(safe-area-inset-bottom) + 10px));
    width: calc(100vw - 20px);
    padding: 8px 10px;
    font-size: 12px;
  }

  .mini-game-modal:has(.mini-game-board.crown-rhythm-tap) .mini-game-feedback {
    box-sizing: border-box;
    bottom: max(14px, calc(env(safe-area-inset-bottom) + 14px));
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
  }

  .drawbridge-stage {
    width: min(96vw, 430px) !important;
    height: clamp(136px, 24dvh, 210px) !important;
  }
  .drawbridge-levers {
    gap: 12px !important;
  }
}

/* Adventure action upgrades */
.bubble-wand-mission,
.secret-garden-guardian-status,
.royal-kitchen-order {
  position: absolute;
  z-index: 7;
  display: grid;
  gap: 3px;
  padding: 9px 12px;
  border: 2px solid rgba(255, 255, 255, 0.82);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 9px 20px rgba(44, 51, 92, 0.18);
  font:
    900 13px/1.22 "Arial Rounded MT Bold",
    "Trebuchet MS",
    Arial,
    sans-serif;
}
.bubble-wand-mission {
  right: 14px;
  top: 14px;
  width: min(320px, calc(100% - 460px));
  color: #433168;
}
.bubble-wand-beacon-layer,
.secret-garden-guardian-layer,
.royal-kitchen-token-layer {
  position: absolute;
  inset: 0;
  z-index: 6;
  pointer-events: none;
}
.bubble-wand-beacon,
.secret-garden-shadow,
.royal-kitchen-token {
  position: absolute;
  display: grid;
  place-items: center;
  min-width: 48px;
  min-height: 48px;
  transform: translate(-50%, -50%) scale(var(--beacon-scale, 1));
  border: 3px solid rgba(255, 255, 255, 0.86);
  border-radius: 50%;
  color: #fff;
  font:
    900 13px/1 "Arial Rounded MT Bold",
    "Trebuchet MS",
    Arial,
    sans-serif;
  cursor: crosshair;
  pointer-events: auto;
  touch-action: manipulation;
  box-shadow:
    0 0 0 5px rgba(255, 255, 255, 0.22),
    0 12px 24px rgba(56, 43, 100, 0.24),
    inset 0 0 18px rgba(255, 255, 255, 0.34);
  transition:
    opacity 0.18s ease,
    scale 0.18s ease,
    transform 0.18s ease;
}
.bubble-wand-beacon {
  width: var(--beacon-size, 64px);
  height: var(--beacon-size, 64px);
  background:
    radial-gradient(circle at 34% 25%, rgba(255, 255, 255, 0.98), transparent 22%),
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.3), transparent 45%),
    #7bcfff;
}
.bubble-wand-beacon.pink {
  background:
    radial-gradient(circle at 34% 25%, rgba(255, 255, 255, 0.98), transparent 22%),
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.3), transparent 45%),
    #ff75b6;
}
.bubble-wand-beacon.gold {
  background:
    radial-gradient(circle at 34% 25%, rgba(255, 255, 255, 0.98), transparent 22%),
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.3), transparent 45%),
    #ffd86b;
  color: #5a3c0d;
}
.bubble-wand-beacon.helper-path {
  z-index: 7;
  box-shadow:
    0 0 0 8px rgba(255, 255, 255, 0.34),
    0 0 0 14px rgba(123, 224, 200, 0.34),
    0 16px 28px rgba(56, 43, 100, 0.26),
    inset 0 0 18px rgba(255, 255, 255, 0.42);
  animation: bubble-helper-path 1.25s ease-in-out infinite;
}
.bubble-wand-beacon.helper-path::after {
  content: "helper path";
  position: absolute;
  left: 50%;
  top: calc(100% + 6px);
  min-width: max-content;
  padding: 3px 8px;
  border: 2px solid rgba(123, 224, 200, 0.72);
  border-radius: 999px;
  background: rgba(255, 253, 238, 0.94);
  color: #235c51;
  font:
    900 10px/1 "Arial Rounded MT Bold",
    "Trebuchet MS",
    Arial,
    sans-serif;
  text-transform: uppercase;
  transform: translateX(-50%);
  box-shadow: 0 6px 12px rgba(56, 43, 100, 0.18);
}
.bubble-wand-beacon.rescued,
.secret-garden-shadow.cleared,
.royal-kitchen-token.caught {
  opacity: 0;
  scale: 1.34;
}
.bubble-wand-reticle,
.secret-garden-reticle,
.royal-kitchen-reticle {
  position: absolute;
  z-index: 8;
  left: 50%;
  top: 50%;
  width: 58px;
  height: 58px;
  transform: translate(-50%, -50%);
  border: 3px solid rgba(255, 255, 255, 0.94);
  border-radius: 50%;
  pointer-events: none;
  filter: drop-shadow(0 3px 7px rgba(35, 32, 74, 0.32));
}
.bubble-wand-reticle::before,
.bubble-wand-reticle::after,
.secret-garden-reticle::before,
.secret-garden-reticle::after,
.royal-kitchen-reticle::before,
.royal-kitchen-reticle::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: rgba(255, 255, 255, 0.96);
  transform: translate(-50%, -50%);
}
.bubble-wand-reticle::before,
.secret-garden-reticle::before,
.royal-kitchen-reticle::before {
  width: 4px;
  height: 70px;
}
.bubble-wand-reticle::after,
.secret-garden-reticle::after,
.royal-kitchen-reticle::after {
  width: 70px;
  height: 4px;
}
.bubble-wand-ray,
.secret-garden-ray,
.royal-kitchen-ray {
  position: absolute;
  z-index: 7;
  left: 0;
  top: 0;
  height: 7px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.1), #fff4a7, #9ee7ff);
  opacity: 0;
  pointer-events: none;
  transform-origin: left center;
  box-shadow:
    0 0 14px rgba(255, 244, 167, 0.82),
    0 0 24px rgba(158, 231, 255, 0.42);
}
.bubble-wand-ray.casting,
.secret-garden-ray.casting,
.royal-kitchen-ray.casting {
  opacity: 0.9;
}
@keyframes bubble-helper-path {
  50% {
    transform: translate(-50%, -50%) scale(calc(var(--beacon-scale, 1) * 1.08));
  }
}
.bubble-wand-anticipation {
  position: absolute;
  z-index: 8;
  left: 14px;
  bottom: 178px;
  display: grid;
  gap: 2px;
  width: min(290px, calc(100% - 150px));
  padding: 9px 12px;
  border: 2px solid rgba(255, 255, 255, 0.84);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255, 251, 235, 0.94), rgba(245, 225, 255, 0.9));
  color: #4e2d6f;
  box-shadow: 0 12px 24px rgba(65, 40, 100, 0.2);
  pointer-events: none;
}
.bubble-wand-anticipation span,
.bubble-wand-anticipation strong,
.bubble-wand-anticipation small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bubble-wand-anticipation span {
  color: #9a3973;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.bubble-wand-anticipation strong {
  font: 900 14px/1.15 "Arial Rounded MT Bold", "Trebuchet MS", Arial, sans-serif;
}
.bubble-wand-anticipation small {
  font-size: 11px;
  font-weight: 800;
}
.bubble-wand-anticipation[data-tone="charging"],
.bubble-wand-anticipation[data-tone="gold"] {
  border-color: rgba(255, 220, 108, 0.92);
  background: linear-gradient(135deg, rgba(255, 253, 223, 0.96), rgba(255, 228, 170, 0.92));
}
.bubble-wand-anticipation[data-tone="helper"] {
  border-color: rgba(123, 224, 200, 0.9);
  background: linear-gradient(135deg, rgba(238, 255, 249, 0.96), rgba(215, 248, 255, 0.92));
}
.bubble-wand-crown {
  position: absolute;
  z-index: 8;
  right: 18px;
  bottom: 178px;
  display: flex;
  align-items: end;
  gap: 5px;
  min-height: 42px;
  padding: 8px 10px;
  border: 2px solid rgba(255, 255, 255, 0.78);
  border-radius: 999px;
  background: rgba(68, 43, 108, 0.72);
  box-shadow: 0 10px 22px rgba(55, 30, 91, 0.22);
  pointer-events: none;
}
.bubble-wand-crown i {
  width: 14px;
  height: 20px;
  border: 2px solid rgba(255, 255, 255, 0.66);
  border-radius: 50% 50% 42% 42%;
  background: rgba(255, 255, 255, 0.18);
  transform: rotate(calc((var(--light-index, 0) - 2) * 4deg));
  transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.bubble-wand-crown i.lit {
  background: linear-gradient(180deg, #fffbd0, #ffd46f 50%, #ff91c7);
  box-shadow: 0 0 12px rgba(255, 231, 122, 0.92);
  transform: translateY(-3px) scale(1.08);
}
.bubble-wand-finale {
  position: absolute;
  z-index: 12;
  left: 50%;
  top: 50%;
  display: grid;
  gap: 5px;
  width: min(440px, calc(100% - 32px));
  padding: 24px 26px;
  border: 3px solid rgba(255, 255, 255, 0.92);
  border-radius: 22px 22px 40px 40px;
  background:
    radial-gradient(circle at 50% 0, rgba(255, 255, 255, 0.95), transparent 30%),
    linear-gradient(145deg, rgba(255, 243, 183, 0.97), rgba(255, 196, 231, 0.96) 48%, rgba(200, 239, 255, 0.96));
  color: #54255c;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -44%) scale(0.82);
  box-shadow: 0 24px 60px rgba(61, 35, 101, 0.36);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.bubble-wand-finale span {
  color: #a33c75;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.bubble-wand-finale strong {
  font: 900 clamp(19px, 3vw, 28px)/1.12 "Arial Rounded MT Bold", "Trebuchet MS", Arial, sans-serif;
}
.bubble-wand-finale small {
  font-size: 13px;
  font-weight: 800;
}
.bubble-wand-finale[aria-hidden="false"] {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}
.bubble-wand-stage[data-bubble-phase="coronation"]::after {
  content: "";
  position: absolute;
  z-index: 11;
  inset: 0;
  background:
    radial-gradient(circle at 20% 22%, #fff7ae 0 4px, transparent 5px),
    radial-gradient(circle at 78% 28%, #ffb8df 0 5px, transparent 6px),
    radial-gradient(circle at 38% 72%, #b8f4ff 0 5px, transparent 6px),
    rgba(75, 36, 106, 0.22);
  pointer-events: none;
}
.secret-garden-guardian-status {
  right: 12px;
  top: 12px;
  width: min(340px, calc(100% - 400px));
  color: #285b35;
}
.secret-garden-shadow {
  width: 64px;
  height: 64px;
  background:
    radial-gradient(circle at 35% 28%, rgba(255, 255, 255, 0.72), transparent 24%),
    linear-gradient(145deg, #6d5a9f, #2f7456);
}
.secret-garden-shadow::after {
  content: "";
  position: absolute;
  inset: -10px;
  border-radius: 50%;
  border: 2px dashed rgba(255, 255, 255, 0.35);
  animation: garden-shadow-orbit 1.5s linear infinite;
}
@keyframes garden-shadow-orbit {
  to {
    transform: rotate(360deg);
  }
}
.royal-kitchen-order {
  left: 12px;
  top: 82px;
  width: min(300px, calc(100% - 24px));
  color: #5a2f28;
}
.royal-kitchen-stage {
  touch-action: none;
}
.royal-kitchen-token {
  min-width: 78px;
  min-height: 50px;
  padding: 0 10px;
  border-radius: 999px;
  color: #5a2f28;
  /* --kx/--ky: per-frame position from royal-kitchen-cook.js (perf sweep 2026-09-24).
     Individual `translate` is applied outside the .caught `scale` pop and is not in the
     transition list, so the drift never lags and the pop stays centred on the token. */
  translate: var(--kx, 0px) var(--ky, 0px);
}
.royal-kitchen-token.flour {
  background: #fff8e7;
}
.royal-kitchen-token.berries {
  background: #ffe0ee;
  color: #7b1e52;
}
.royal-kitchen-token.honey {
  background: #ffefb8;
  color: #76501a;
}