* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; overscroll-behavior: none; background: #162642; }
#garden { position: relative; width: 100%; height: 100dvh; overflow: hidden; }
#garden-canvas { display: block; width: 100%; height: 100%; image-rendering: pixelated; touch-action: none; cursor: grab; outline: none; }
#garden-canvas.is-dragging { cursor: grabbing; }
.world-control { position: absolute; padding: 0; border: 0; background: transparent; cursor: pointer; touch-action: manipulation; }
.world-control:focus-visible { outline: 2px dashed #fff8c8; outline-offset: 4px; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; pointer-events: none; }
.fallback { position: absolute; top: 40%; left: 10%; right: 10%; color: white; font: 14px sans-serif; text-align: center; }
.fallback a { color: inherit; }