/* The auth wipe, ported from the CRM app's Motion 3 (directstay-app
   components/transition/AuthTransition.tsx, docs/MOTION.md § 3).

   Two hand-drawn strokes sweep across the screen, swelling from stroke-width
   200 to 700 until they overlap into a solid cover, then sweep off the far
   side to reveal what is underneath. The path data, viewBox, 1s duration,
   power1.inOut ease and the 200/700 widths are the app's, unchanged, so the
   marketing site's handoff into /crm is the same motion a host meets when they
   sign up. Only the colours are restated in this site's tokens.

   The tell is 700: below about 600 the page shows through the gaps mid-wipe
   and the effect reads as a bug rather than a cover. */

:root{
  --wipe-dur:1s;
  --wipe-width-covered:700;
  --wipe-width-rest:200;
  /* --cloud lifted toward the violet. A true neutral beside the brand purple
     reads as an unstyled default, which is the app's own finding. */
  --wipe-stroke-1:#e2dfe8;
  --wipe-stroke-2:var(--navy-2);
  --wipe-z:2000;
}

.crm-wipe{
  position:fixed;
  top:50%;
  left:50%;
  /* scale(1.5) keeps the strokes' round caps outside the viewport at every
     aspect ratio, so no uncovered band can appear at the edges. */
  transform:translate(-50%,-50%) scale(1.5);
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:var(--wipe-z);
}

/* While the cover draws in, the overlay stops being scenery and becomes a
   shield: a click landing on a link under a screen the visitor can no longer
   see would start a second navigation against the one already running. */
.crm-wipe[data-wiping="true"]{pointer-events:auto}

.crm-wipe svg{width:100%;height:100%;display:block}

.crm-wipe__path{
  fill:none;
  stroke-linecap:round;
  /* Parked at rest: fully undrawn, so nothing shows until a leg starts. */
  stroke-dasharray:99999;
  stroke-dashoffset:99999;
}

/* Arrival: /crm is painted COVERED on the first frame, so the reveal runs out
   of a real cover rather than flashing the destination first. The class is set
   synchronously by an inline script in crm.html's head, before paint. */
.crm-wipe[hidden]{display:none}
html.is-wipe-arriving .crm-wipe[hidden]{display:block}
html.is-wipe-arriving .crm-wipe__path{stroke-dashoffset:0;stroke-width:700}

/* The settled state immediately, never a faster animation. The settled state
   of a page transition is simply the page. */
@media (prefers-reduced-motion:reduce){
  .crm-wipe{display:none!important}
}