*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;background:#faf7ef;color:#222}
.wrap{max-width:760px;margin:0 auto;padding:12px;min-height:100dvh}
header{text-align:center;margin-bottom:6px}
h1{margin:8px 0 4px;font-size:clamp(20px,3.8vw,34px)}
canvas{aspect-ratio:420/720;width:100%;height:auto;display:block;background:#f3efe6;border-radius:12px;box-shadow:0 6px 20px rgba(0,0,0,.08)}
.hud{display:flex;gap:10px;justify-content:center;align-items:center;margin:6px 0;font-weight:700;flex-wrap:wrap}