/* GENERATED COPY — DO NOT EDIT.
   Source: shared-patterns/auth-loading-overlay/overlay.css
   Regenerate with: node scripts/check-shared-patterns.mjs
   Edits here are discarded by the next sync and fail the drift check meanwhile. */

/* overlay.css — the auth-loading-overlay pattern's canonical stylesheet.

   This is the SOURCE. Every consuming app gets a byte-for-byte copy (behind a
   "GENERATED COPY" header), written by `node scripts/check-shared-patterns.mjs`. Edit
   this file, never a copy — see README.md in this folder for the full explanation and
   scripts/check-shared-patterns.mjs for how drift is caught.

   WHAT THIS IS: a full-viewport curtain, above everything else on the page, for the
   window between first paint and whatever your app's own first definitive decision is
   (signed in, signed out, ready, whatever that means for you). It has no idea what that
   decision is — see overlay.js.

   z-index 999999 is deliberately far above any stacking scale a consuming app already
   has (this repo's tools top out in the low thousands) so it always wins without this
   file needing to know any of them. If a consumer nests this element inside its own
   already-fixed overlay wrapper (Verb Matching 40 does, see its own copy's header),
   that wrapper's z-index becomes irrelevant — this element re-establishes its own fixed
   position and stacking regardless of where it sits in the DOM. */

.blw-auth-loading-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
}

/* The class selector above sets `display: flex` unconditionally, which out-specifies
   the browser's own `[hidden] { display: none }` (same specificity, author beats UA) —
   without this rule a "hidden" curtain stays on screen, opaque and blocking every
   click. Bonny Web has paid for this exact mistake before (Verb Matching 40's
   `.vm-overlay[hidden]`, and its forfeit banner a second time) — see
   public/games/verb-matching-40/CLAUDE.md's "Gotchas already paid for". Any element
   that sets `display` here needs its own `[hidden]` rule; this is that rule. */
.blw-auth-loading-overlay[hidden] { display: none; }

.blw-auth-loading-overlay__spinner {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 3px solid rgba(255, 255, 255, 0.25);
  border-top-color: #fff;
  animation: blw-auth-loading-spin 0.8s linear infinite;
}

@keyframes blw-auth-loading-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .blw-auth-loading-overlay__spinner { animation: none; }
}

/* Optional caption slot. Left empty by the canonical markup on purpose — baking text
   in here would force every consumer to share one language/brand voice, which this
   repo's own tools already deliberately don't (Verb Matching 40 is English-only,
   MyUniverse is Spanish-facing). A consumer that wants a caption sets this element's
   textContent from its OWN code, never from a copy of this file. */
.blw-auth-loading-overlay__label {
  color: #fff;
  font: 600 13px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  letter-spacing: 0.04em;
  text-align: center;
}
