.ann{flex-wrap:wrap;gap:2px 14px}
.ann a[data-waitlist]{display:inline-flex;align-items:center;min-height:32px}
.bb-stock{flex-wrap:wrap}
.bb-stock .waitlist-stock-link{color:var(--green);font-weight:700;text-underline-offset:4px;min-height:36px;display:inline-flex;align-items:center}
.waitlist-dialog{box-sizing:border-box;width:calc(100% - 32px);max-width:480px;max-height:calc(100dvh - 32px);margin:auto;padding:36px;border:1px solid #DCE7E4;border-radius:24px;background:#FCF5CF;color:#1A433C;box-shadow:0 24px 100px #102b2640;overflow:auto}
.waitlist-dialog::backdrop{background:#102b2680;backdrop-filter:blur(4px)}
.waitlist-dialog .waitlist-logo{width:96px;height:auto;margin:0 0 28px}
.waitlist-dialog .waitlist-close{position:absolute;z-index:10;right:12px;top:12px;display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;color:#1A433C;border-radius:50%;cursor:pointer;font:30px/1 Arial,sans-serif}
.waitlist-dialog .waitlist-close:hover{background:#1a433c0c}
.waitlist-dialog h2{font:700 clamp(26px,6vw,32px)/1.15 Roboto,system-ui,sans-serif;text-transform:none;letter-spacing:-.02em;margin:0 0 12px;color:#1A433C}
.waitlist-dialog p{font:400 16px/1.5 Roboto,system-ui,sans-serif;margin:0 0 22px}
.waitlist-dialog label{display:block;font:700 14px/1.5 Roboto,system-ui,sans-serif;margin-bottom:8px}
.waitlist-dialog input[type=email]{display:block;box-sizing:border-box;width:100%;min-height:52px;border:1px solid #4C7C73;border-radius:12px;padding:12px 14px;background:#fff;color:#1A433C;font:400 16px/1.5 Roboto,system-ui,sans-serif}
.waitlist-dialog .waitlist-submit{display:block;width:100%;margin-top:14px;min-height:52px;padding:12px;border:0;border-radius:12px;background:#1A433C;color:#fff;font:700 16px/1.4 Roboto,system-ui,sans-serif;cursor:pointer}
.waitlist-dialog .waitlist-submit:hover{background:#102B26}
.waitlist-dialog .waitlist-submit:disabled{opacity:.65;cursor:wait}
.waitlist-dialog .waitlist-consent{margin:16px 0 0;font-size:13px;line-height:1.5;color:#4C7C73}
.waitlist-dialog .waitlist-consent a{color:#1A433C;text-underline-offset:3px}
.waitlist-dialog .waitlist-status{margin:16px 0 0;font-weight:500}
.waitlist-dialog .waitlist-status:empty{display:none}
.waitlist-dialog .waitlist-status[data-error=true]{color:#8E2828}
.waitlist-dialog .waitlist-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
html.waitlist-open{overflow:hidden}
@media(max-width:480px){.waitlist-dialog{padding:30px 24px}.nav .navcta [data-waitlist]{font-size:13px;padding:11px 14px}}

/* Form pieces pack themselves into a Trepo grocery bag. All motion is local;
   the success flourish waits for the real server acknowledgement. */
.waitlist-content{position:relative;z-index:3}
.waitlist-dialog[data-phase]{overflow:hidden}
.waitlist-dialog[data-phase] .waitlist-content{pointer-events:none}
.waitlist-dialog[data-phase=success] .waitlist-content{visibility:hidden}
.waitlist-celebration[hidden]{display:none!important}
.waitlist-celebration{position:absolute;z-index:2;inset:92px 24px 24px;display:grid;grid-template-rows:minmax(120px,1fr) auto;gap:6px;text-align:center}
.waitlist-scene{min-height:0;display:flex;justify-content:center;align-items:center}
.waitlist-bag-art{width:100%;height:100%;max-width:360px;max-height:290px;overflow:visible;animation:waitlist-bag-arrive 480ms 140ms cubic-bezier(.16,1,.3,1) both}
.bag-bounce{transform-origin:180px 258px;animation:waitlist-bag-breathe 2400ms 1600ms ease-in-out infinite}
.grocery-drop{transform-box:fill-box;transform-origin:center bottom;animation:waitlist-grocery-drop 820ms var(--drop) cubic-bezier(.2,.75,.3,1) both}
.grocery-bread{--drop:380ms}
.grocery-greens{--drop:560ms}
.grocery-carton{--drop:730ms}
.grocery-lemon{--drop:890ms}
.grocery-note{--drop:1040ms}
.bag-check{opacity:0;transform-origin:252px 148px;transform:scale(.2)}
.bag-sparkles{opacity:0;transform-origin:180px 160px}
.waitlist-result{visibility:hidden;opacity:0;transform:translateY(10px)}
.waitlist-dialog .waitlist-result h2{font-size:clamp(26px,6vw,32px);margin:0 0 8px}
.waitlist-dialog .waitlist-result p{font-size:15px;margin:0 auto 16px;max-width:290px;text-wrap:balance}
.waitlist-done{min-height:44px;padding:10px 22px;border:1px solid #1A433C;border-radius:999px;background:#1A433C;color:#FCF5CF;font:500 14px/1.4 Roboto,system-ui,sans-serif;cursor:pointer;transition:transform 180ms,background 180ms}
.waitlist-done:hover{transform:translateY(-2px);background:#102B26}
.waitlist-dialog button:focus-visible{outline:3px solid #57BEDB;outline-offset:4px}
.waitlist-dialog .waitlist-saving{position:absolute;bottom:35px;left:0;right:0;margin:0;font-size:14px;opacity:0;transition:opacity 200ms}
.waitlist-dialog[data-slow=true][data-phase=packing] .waitlist-saving{opacity:1}
.waitlist-dialog[data-phase] .waitlist-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.waitlist-dialog[data-phase=success] .bag-bounce{animation:waitlist-bag-finish 700ms cubic-bezier(.2,.8,.2,1) both}
.waitlist-dialog[data-phase=success] .bag-shadow{transform-origin:180px 268px;animation:waitlist-shadow-finish 700ms ease-out both}
.waitlist-dialog[data-phase=success] .bag-check{animation:waitlist-check-pop 600ms 140ms cubic-bezier(.16,1.5,.5,1) both}
.waitlist-dialog[data-phase=success] .bag-check-stroke{stroke-dasharray:36;stroke-dashoffset:36;animation:waitlist-check-draw 300ms 440ms ease-out forwards}
.waitlist-dialog[data-phase=success] .bag-sparkles{animation:waitlist-sparkles 800ms 100ms ease-out both}
.waitlist-dialog[data-phase=success] .waitlist-result{visibility:visible;opacity:1;transform:none;transition:opacity 350ms 150ms,transform 450ms 150ms cubic-bezier(.16,1,.3,1)}
@keyframes waitlist-bag-arrive{from{opacity:0;transform:translateY(50px) scale(.82)}to{opacity:1;transform:none}}
@keyframes waitlist-grocery-drop{0%{opacity:0;transform:translateY(-150px) rotate(-22deg) scale(.65)}15%{opacity:1}68%{transform:translateY(8px) rotate(5deg) scale(1.03,.96)}85%{transform:translateY(-6px) rotate(-2deg)}100%{opacity:1;transform:none}}
@keyframes waitlist-bag-breathe{0%,100%{transform:rotate(-1deg) translateY(0)}50%{transform:rotate(1deg) translateY(-3px)}}
@keyframes waitlist-bag-finish{0%{transform:scale(1)}25%{transform:translateY(3px) scale(1.04,.95)}55%{transform:translateY(-10px) scale(.98,1.03) rotate(-3deg)}78%{transform:translateY(0) rotate(2deg)}100%{transform:none}}
@keyframes waitlist-shadow-finish{40%{transform:scale(.85);opacity:.08}100%{transform:scale(1);opacity:.12}}
@keyframes waitlist-check-pop{from{opacity:0;transform:scale(.2) rotate(-25deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes waitlist-check-draw{to{stroke-dashoffset:0}}
@keyframes waitlist-sparkles{0%{opacity:0;transform:scale(.6) rotate(-10deg)}40%{opacity:1}100%{opacity:1;transform:scale(1) rotate(0)}}
@media(max-height:650px){.waitlist-celebration{inset:76px 20px 20px}.waitlist-bag-art{max-height:240px}.waitlist-dialog .waitlist-result p{margin-bottom:10px}}
@media(prefers-reduced-motion:reduce){
  .waitlist-dialog[data-phase] .waitlist-content{visibility:hidden}
  .waitlist-bag-art,.bag-bounce,.grocery-drop,.waitlist-dialog[data-phase=success] .bag-bounce,.waitlist-dialog[data-phase=success] .bag-shadow,.waitlist-dialog[data-phase=success] .bag-check,.waitlist-dialog[data-phase=success] .bag-check-stroke,.waitlist-dialog[data-phase=success] .bag-sparkles{animation:none;transform:none}
  .waitlist-dialog[data-phase=success] .bag-check,.waitlist-dialog[data-phase=success] .bag-sparkles{opacity:1}
  .waitlist-dialog[data-phase=success] .bag-check-stroke{stroke-dashoffset:0}
  .waitlist-dialog[data-phase=success] .waitlist-result,.waitlist-done{transition:none}
}
