/* Stage 3 — picture look-around games. Hotspots are calibrated to the full 3:2 source artwork and scale with the image. */
.find-picture{position:relative;overflow:hidden;border-radius:inherit}
.find-picture>img{display:block;width:100%;height:auto}
.find-target{position:absolute;transform:translate(-50%,-50%);width:clamp(46px,4.5vw,64px);height:clamp(46px,4.5vw,64px);border:0;border-radius:50%;background:transparent;cursor:pointer;padding:0;-webkit-tap-highlight-color:transparent}
.find-target::before{content:"";position:absolute;inset:4px;border:3px solid transparent;border-radius:50%;transition:.2s ease}
.find-target:hover::before,.find-target:focus-visible::before{border-color:#fff7dd;box-shadow:0 0 0 3px #704480,0 3px 10px #2a153b55;outline:0}
.find-target.found::before{border-color:#fff7dd;background:#fff7dd44;box-shadow:0 0 0 3px #704480,0 0 18px #ffd85e}
.find-target.found::after{content:"✓";position:absolute;right:-5px;top:-7px;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#fff7dd;color:#4d2765;border:2px solid #704480;font-weight:900;font-size:15px}
.find-game-note{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;margin:14px 0 0;padding:12px 16px;border-radius:16px;background:#fff7dd;color:#5b4560;font-weight:700;text-align:center}
.find-game-note .find-count{white-space:nowrap;background:#fff;border:1px solid #d9c6a2;border-radius:999px;padding:5px 10px}
.find-live{min-height:1.5em;margin:8px 0 0;text-align:center;font-weight:800;color:#5b3c68}
@media(max-width:600px){.find-target{width:48px;height:48px}.find-game-note{font-size:14px}}
@media(prefers-reduced-motion:reduce){.find-target::before{transition:none}}


/* Stage 4 UX refinement — make every picture-hunt instruction unmistakable. */
.find-task{
  margin:18px 0 22px;
  padding:20px 22px;
  border:3px solid #e5ad4f;
  border-radius:22px;
  background:linear-gradient(135deg,#fff7d8,#fffdf6);
  box-shadow:0 8px 22px #50385d18;
  text-align:center;
}
.find-task-label{
  display:inline-block;
  margin-bottom:5px;
  padding:5px 11px;
  border-radius:999px;
  background:#4b2968;
  color:#fff;
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
}
.find-task p{
  margin:6px auto 5px;
  max-width:820px;
  color:#4b2968;
  font-family:'Baloo 2',sans-serif;
  font-size:clamp(25px,3.2vw,38px);
  font-weight:900;
  line-height:1.15;
}
.find-task-hint{
  display:block;
  color:#6d5c70;
  font-size:15px;
  font-weight:800;
}
@media(max-width:600px){
  .find-task{padding:17px 15px;margin:14px 0 18px}
  .find-task p{font-size:clamp(24px,7vw,31px)}
}


/* iPad/tablet reliability: preserve the full finding-mission card treatment. */
@media (min-width:601px) and (max-width:1180px){
  .find-task{
    display:block !important;
    margin:18px 0 22px !important;
    padding:20px 22px !important;
    border:3px solid #e5ad4f !important;
    border-radius:22px !important;
    background:linear-gradient(135deg,#fff7d8,#fffdf6) !important;
    box-shadow:0 8px 22px #50385d18 !important;
    text-align:center !important;
  }
  .find-task-label{
    display:inline-block !important;
    margin-bottom:5px !important;
    padding:5px 11px !important;
    border-radius:999px !important;
    background:#4b2968 !important;
    color:#fff !important;
    font-size:12px !important;
    font-weight:950 !important;
    letter-spacing:.08em !important;
  }
  .find-task p{
    display:block !important;
    margin:8px auto 6px !important;
    max-width:820px !important;
    color:#4b2968 !important;
    font-family:'Baloo 2',sans-serif !important;
    font-size:clamp(28px,4.2vw,38px) !important;
    font-weight:900 !important;
    line-height:1.15 !important;
  }
  .find-task-hint{
    display:block !important;
    color:#6d5c70 !important;
    font-size:15px !important;
    font-weight:800 !important;
  }
}

/* Wobble Shop interior hunt: keep the four tappable targets visibly discoverable. */
.shop-scene-inside .find-target::before{
  content:"★";
  inset:0;
  display:grid;
  place-items:center;
  border:3px solid #704480;
  border-radius:50%;
  background:#ffd85e;
  color:#704480;
  box-shadow:0 3px 10px rgba(42,21,59,.28),0 0 0 3px rgba(255,247,221,.9);
  font-size:clamp(24px,2.5vw,34px);
  line-height:1;
  opacity:.96;
}
.shop-scene-inside .find-target:hover::before,
.shop-scene-inside .find-target:focus-visible::before{
  transform:scale(1.08);
  background:#fff1a8;
  box-shadow:0 4px 14px rgba(42,21,59,.34),0 0 0 4px #fff7dd;
}
.shop-scene-inside .find-target.found::before{
  content:"★";
  border-color:#704480;
  background:#fff7dd;
  color:#704480;
  box-shadow:0 0 0 3px #704480,0 0 18px #ffd85e;
}
