/* A native cursor stays crisp, follows the pointer immediately, and never blocks taps. */
@media (any-hover:hover){
  html,body,body *,body *::before,body *::after{
    cursor:url('art/paw-cursor.svg?v=2') 16 8,auto;
  }
  html.paw-pressed,html.paw-pressed body,
  html.paw-pressed body *,html.paw-pressed body *::before,html.paw-pressed body *::after{
    cursor:url('art/paw-cursor-pressed.svg') 16 8,auto;
  }
}
.board-hotspot{
  position:absolute;
  z-index:2;
  transform:translate(-50%,-50%);
  width:8.5%;
  height:14%;
  min-width:44px;
  min-height:44px;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  opacity:1;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
.board-hotspot:hover,.board-hotspot:active,.board-hotspot:disabled{
  transform:translate(-50%,-50%);
  background:transparent;
  box-shadow:none;
  opacity:1;
}
.board-hotspot:focus-visible{outline:2px dashed #ffe0a1;outline-offset:3px;}
.pet-chest:focus,.pet-chest:focus-visible{outline:none;}
/* A tiny keyboard marker replaces the rectangle around the treasure. */
.pet-chest:focus-visible::after{
  content:'';position:absolute;left:calc(50% - 5px);top:-10px;
  width:10px;height:7px;background:#ffe0a1;pointer-events:none;
  clip-path:polygon(0 0,100% 0,100% 28%,80% 28%,80% 57%,60% 57%,60% 100%,40% 100%,40% 57%,20% 57%,20% 28%,0 28%);
}
.pet-ginger{left:9.7%;top:37.5%;width:7.5%;height:10%;}
.pet-terrace{left:86.7%;top:25%;width:7.5%;height:10%;}
.pet-guardian{left:84.17%;top:54.33%;}
.pet-sleepy{left:86.25%;top:79%;}
.pet-chest{left:73.54%;top:47.83%;width:12%;height:15%;}
.chest-hint{left:73.54%;top:35%;}
.board-hotspot:disabled{pointer-events:none;}
/* Movement and jumping share one compact, visually connected control group. */
.movement-controls{display:flex;flex-direction:column;align-items:center;flex:0 0 142px;width:142px;}
.movement .jump-button{display:none;width:100%;margin-top:12px;min-height:44px;padding:9px 10px;font-size:9px;background:#25395f;border-color:#83b7c4;color:#daeff0;box-shadow:3px 3px #0b1e37;text-shadow:none;gap:8px;}
.movement .jump-button:hover{background:#345375;box-shadow:4px 4px #0b1e37;}
.movement .jump-button:active{box-shadow:1px 1px #0b1e37;}
.movement .jump-button span{font-size:17px;line-height:1;}
.movement .jump-hint{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:12px 0 0;color:#b5c9e6;font-size:8px;line-height:1.5;white-space:nowrap;}
.movement .jump-hint kbd{display:inline-block;padding:6px 5px 5px;border:2px solid #6b7caf;background:#1b2a59;box-shadow:2px 2px #070e2b;color:#c8d6fa;font:inherit;}
@media(min-width:601px){.movement{align-items:flex-start;}.movement .movement-label{margin-top:36px;}}
@media(any-pointer:coarse){.movement .jump-button{display:inline-flex;}.movement .jump-hint{display:none;}}
@media(max-width:600px){.movement .jump-button{display:inline-flex;font-size:8px;margin-top:11px;padding:8px;}.movement .jump-hint{display:none;}}
