*{box-sizing:border-box;margin:0;padding:0}
html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;}
body{min-height:100vh;background-color:var(--clr-base);}
body:has(dialog[open]){overflow:hidden;}
svg{display:block;}/*otherwise they default inline-block, creating unintented gaps*/
img{max-width:100%;height:auto}

/* The Pixi WebGL canvas is the entire game — backgrounds, entities, player,
   HUD all live here. Fixed full-viewport so input lands on it directly. */
#pixiCanvas {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100dvh;
  display: block;
  background: transparent;
}

#pixiCanvas.over-clickable {
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'><text x='30' y='50' text-anchor='middle' font-size='50'>%F0%9F%91%86</text></svg>") 30 10, pointer;
}

#fsBtn {
  position: fixed;
  top: max(12px, env(safe-area-inset-top));
  right: max(12px, env(safe-area-inset-right));
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  z-index: 10;
}
#fsBtn[hidden] { display: none; }
body.is-fullscreen #fsBtn { display: none; }