*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
input { font: inherit; }
img { max-width: 100%; display: block; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, p { margin: 0; }
a { color: inherit; }

/* Several screens/modals set an explicit `display: flex` in game.css/ui.css
   so they're centered while visible. Without this rule, that explicit
   display would out-specificity the UA default for [hidden] and the
   element would stay visible (and keep intercepting clicks) even while
   hidden — caught via Playwright, not just code review, when the tutorial
   overlay silently blocked every click on the menu behind it. */
[hidden] { display: none !important; }
