/* Shared Bigstep canvas — inspired by the Flappy Shirt atmosphere. */
html {
  background-color: #070817;
}

body:not(.bigstep-ai-standalone-editor):not(.bigstep-ai-editor-active) {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath d='M20 24h1.2M20.6 23.4v1.2' fill='none' stroke='%23c4b5fd' stroke-opacity='.18' stroke-width='.4'/%3E%3C/svg%3E") 0 0 / 64px 64px repeat fixed,
    radial-gradient(75% 58% at 0% 72%, rgba(31, 81, 126, .15), transparent 70%) center / cover no-repeat fixed,
    radial-gradient(70% 45% at 50% 0%, rgba(93, 61, 180, .14), transparent 65%) center top / cover no-repeat fixed,
    linear-gradient(145deg, #0b0b1d 0%, #080917 58%, #081120 100%) center / cover no-repeat fixed !important;
}

/* The theme injects this loader after wp_head, so these selectors deliberately
   outrank its inline style and keep the transition canvas consistent. */
html body #bs-loader,
html body #haru-site-preloader {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath d='M20 24h1.2M20.6 23.4v1.2' fill='none' stroke='%23c4b5fd' stroke-opacity='.18' stroke-width='.4'/%3E%3C/svg%3E") 0 0 / 64px 64px repeat fixed,
    radial-gradient(75% 58% at 0% 72%, rgba(31, 81, 126, .15), transparent 70%) center / cover no-repeat fixed,
    radial-gradient(70% 45% at 50% 0%, rgba(93, 61, 180, .14), transparent 65%) center top / cover no-repeat fixed,
    linear-gradient(145deg, #0b0b1d 0%, #080917 58%, #081120 100%) center / cover no-repeat fixed !important;
}

html body #bs-loader .bs-loader-grid {
  background: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}

@media (max-width: 760px) {
  body:not(.bigstep-ai-standalone-editor):not(.bigstep-ai-editor-active) {
    background-attachment: scroll !important;
  }

  html body #bs-loader,
  html body #haru-site-preloader {
    background-attachment: scroll !important;
  }
}