/* psst waitlist modal, built from lemon's own parts: the rough lime button, DIN + Source Code Pro,
   and the cut-paper card edge from lemon's "resistance is futile" popup. */
:root{
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --wl-lime:#dcff02; --wl-lav:#c58fff; --wl-cyan:#5cffe4;
}
/* every CTA on the page: press feedback, and no more `transition: all .5s` from lemon's css */
.btn,.btn--image,#mc-embedded-subscribe{transition:transform 160ms var(--ease-out),background-color 200ms ease!important}
.btn:active,.btn--image:active,#mc-embedded-subscribe:active{transform:scale(.97)}
.wl-lock, .wl-lock body{overflow:hidden}
.wl{position:fixed;inset:0;z-index:2147483000;isolation:isolate;display:grid;place-items:center;padding:16px}
.wl[hidden]{display:none}

.wl__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.82);opacity:0;
  transition:opacity 180ms var(--ease-out)}
.wl__box{position:relative;width:min(36rem,100%);padding:3rem 3.25rem 2.75rem;color:#000;
  background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 700 560' preserveAspectRatio='none' fill='%23c58fff'%3E%3Cpath fill-rule='evenodd' d='M75.538 0L38.952 5.578l-35.51-1.13L0 45.655l1.067 42.627.139 42.623.958 42.622.055 42.621 1.594 42.62.076 42.615-3.866 42.615 2.07 42.62-1.48 42.62 1.883 42.617 2.364 42.617-3.152 43.484 37.257-1.557 36.597-.24 36.593-1.314 36.595 1.764 36.593 2.34L221.896 560h.049l36.578-4.106 36.591 4.079 36.593-3.305 36.593.493 36.59-2.205 36.59-.532 36.589 4.776 36.59-4.28 36.588 1.694 36.591-2.806 36.588 4.248 36.587.331 37.925.467L700 514.405l-.944-42.572.765-42.622-2.469-42.625 2.333-42.619-.814-42.618-.123-42.618-.179-42.613-3.141-42.621 1.102-42.619 3.35-42.617.085-42.617-1.255-44.083L661.001.305l-36.599 2.804-36.593 3.358-36.594-.167-36.593-.081-36.592-2.152-36.588-1.763-36.591.332-36.593-1.405-36.593 4.215-36.59-4.184-36.589 2.956-36.59-.407-36.59-.87L148.718.127 112.126 5.74z'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat;
  opacity:0;transform:scale(.96);transform-origin:center;
  transition:opacity 180ms var(--ease-out),transform 180ms var(--ease-out)}   /* exit: quick */
.wl--open .wl__backdrop{opacity:1;transition-duration:250ms}
.wl--open .wl__box{opacity:1;transform:none;transition-duration:250ms}        /* enter: a touch slower */
/* form -> success: fade the form out before the stamp lands, no teleport */
.wl__form{transition:opacity 160ms var(--ease-out),transform 160ms var(--ease-out),filter 160ms var(--ease-out)}
.wl__form--out{opacity:0;transform:scale(.98);filter:blur(2px)}

.wl__x{position:absolute;top:1rem;right:1.25rem;width:2.5rem;height:2.5rem;border:0;background:none;
  font:400 2rem/1 SourceCodePro,monospace;color:#000;cursor:pointer;transition:transform 160ms var(--ease-out)}
.wl__x:active{transform:scale(.9)}
.wl__title{font-family:DINEngschriftStd,sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.08em;
  font-size:2.6rem;line-height:1.05;margin:0 0 .75rem;color:#000}
.wl__sub{font:500 .95rem/1.6 SourceCodePro,monospace;text-transform:lowercase;margin:0 0 1.75rem;color:#000}
.wl__field{display:block;margin-bottom:1rem}
.wl__field span{display:block;font:500 .8rem SourceCodePro,monospace;margin-bottom:.4rem;color:#000}
.wl__field input{width:100%;box-sizing:border-box;border:0;background:#fff;color:#000;
  font:500 1rem SourceCodePro,monospace;padding:1rem 1.1rem;border-radius:0;outline:none;
  box-shadow:inset 0 0 0 2px transparent;transition:box-shadow 150ms var(--ease-out)}
.wl__field input:focus{box-shadow:inset 0 0 0 2px #000}
.wl__err{min-height:1.4em;margin:.25rem 0 .75rem;font:600 .85rem SourceCodePro,monospace;color:#000;opacity:0;transition:opacity 150ms var(--ease-out)}
.wl__err--on{opacity:1}
.wl__submit{display:block;width:100%;margin-top:.25rem;border:0;cursor:pointer;
  font:600 1rem SourceCodePro,monospace;text-transform:lowercase;color:#000;
  transition:transform 140ms var(--ease-out),filter 200ms ease,opacity 200ms ease}
.wl__submit:active{transform:scale(.97)}
.wl__submit:disabled{cursor:progress}
.wl__submit--busy{filter:blur(2px);opacity:.7}   /* blur masks the label swap */

/* success: a stamp slaps on, then the lines arrive 60ms apart */
.wl__done{text-align:left;padding-top:.5rem}
.wl__stamp{display:inline-block;margin-bottom:1.25rem;padding:.5rem 1rem .35rem;background:var(--wl-lime);
  border:3px solid #000;font:400 2rem/1 DINEngschriftStd,sans-serif;letter-spacing:.1em;color:#000;
  transform:rotate(-8deg)}
.wl__done--in .wl__stamp{animation:wl-stamp 420ms var(--ease-out) both}
.wl__done--in .wl__line{animation:wl-rise 300ms var(--ease-out) both}
.wl__done--in .wl__line:nth-of-type(1){animation-delay:140ms}
.wl__done--in .wl__line:nth-of-type(2){animation-delay:200ms}
.wl__done--in .wl__line:nth-of-type(3){animation-delay:260ms}
.wl__site{background:#000;color:var(--wl-lime);padding:0 .3em}
@keyframes wl-stamp{
  0%{opacity:0;transform:rotate(-14deg) scale(1.35)}
  60%{opacity:1;transform:rotate(-6deg) scale(.97)}
  100%{opacity:1;transform:rotate(-8deg) scale(1)}
}
@keyframes wl-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion: reduce){
  .wl__box,.wl--open .wl__box{transform:none;transition:opacity 200ms ease}
  .wl__form--out{transform:none;filter:none}
  .wl__done--in .wl__stamp,.wl__done--in .wl__line{animation:wl-fade 200ms ease both}
  @keyframes wl-fade{from{opacity:0}to{opacity:1}}
}
@media screen and (max-width:600px){
  .wl{place-items:end center;padding:0}
  /* bottom sheet: in from off-screen on the drawer curve, out the same way, faster */
  .wl__box{width:100%;padding:2.5rem 1.25rem 2rem;opacity:1;transform:translateY(100%);
    transition:transform 250ms var(--ease-drawer)}
  .wl--open .wl__box{transform:none;transition-duration:400ms}
  .wl__title{font-size:2rem}
  .wl__field input{font-size:16px}   /* stops iOS zooming into the field */
}
.wl__field input::placeholder{color:#9a9a9a;opacity:1}
@media (prefers-reduced-motion: reduce) and (max-width:600px){.wl__box,.wl--open .wl__box{transform:none}}
