html, body, #root {
  margin: 0;
  height: 100%;
  width: 100%;
  overflow: hidden;
  background: #131927;
  font-family: Vazirmatn, "Noto Sans Arabic", Tahoma, sans-serif;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}

canvas { display: block; }

.helix-hud {
  pointer-events: none;
  direction: rtl;
}
.helix-hud button { pointer-events: auto; }

/* SAZITO_PLATFORM_CONTAINER_FIX_SCRUM_4531 */
/* No author .container rule found; Tailwind's built-in .container
   utility never had a phone gutter in EITHER preview or a real build
   (width:100% + breakpoint max-width, no padding/margin, ever) — see
   platformContainerFix.ts for the full mechanism, verified both ways.
   Scoped to @layer components (not unlayered) so a REAL utility class the
   author DID apply — e.g. class="container px-8" — still wins: Tailwind's
   own @layer utilities (publish) and its unlayered runtime injection
   (preview) both outrank @layer components; this default only applies
   when nothing else sets padding/margin at all. */
@layer components {
  .container {
    margin-inline: auto;
    padding-inline: 1rem;
  }
  @media (min-width: 640px) {
    .container {
      padding-inline: 1.5rem;
    }
  }
}