.gate{position:relative;isolation:isolate;display:grid;grid-template-rows:1fr auto;min-height:100svh;overflow:hidden;background:var(--ink-900)}.gate-art{position:absolute;inset:0;z-index:-1}.gate-art img{width:100%;height:100%;object-fit:cover;object-position:50% 72%}.gate-art__dusk,.gate-art__shade{position:absolute;inset:0}.gate-art__dusk{background:linear-gradient(to bottom,color-mix(in srgb,var(--paper) 60%,transparent),color-mix(in srgb,var(--orange-400) 40%,transparent));opacity:0}.gate-art__shade{background:radial-gradient(70% 60% at 50% 46%,transparent 30%,color-mix(in srgb,var(--ink-950) 46%,transparent) 100%),linear-gradient(to bottom,color-mix(in srgb,var(--ink-950) 28%,transparent),transparent 22%,transparent 70%,color-mix(in srgb,var(--ink-950) 70%,transparent))}@media (prefers-reduced-motion:no-preference){.gate-art__dusk{animation:gate-dusk 1.4s var(--ease-out) both}.gate-art img{animation:gate-settle 2.4s var(--ease-out) both}}@keyframes gate-dusk{0%{opacity:1}to{opacity:0}}@keyframes gate-settle{0%{transform:scale(1.05)}to{transform:none}}.gate-stage{display:grid;place-items:center;padding:clamp(96px,19svh,184px) var(--gutter) clamp(32px,6svh,64px)}.gate-tilt{--tx:0;--ty:0;width:min(520px,100%);container-type:inline-size;transform:perspective(1500px) rotateX(calc(var(--ty) * -4deg)) rotateY(calc(var(--tx) * 5deg))}.gate-env{--flap-h:40cqi;--lining:repeating-linear-gradient(45deg,color-mix(in srgb,var(--orange-400) 32%,transparent) 0 1px,transparent 1px 11px),repeating-linear-gradient(-45deg,color-mix(in srgb,var(--orange-400) 32%,transparent) 0 1px,transparent 1px 11px),radial-gradient(90% 70% at 50% 0,var(--royal-600),var(--royal-800) 70%);--stripes:repeating-linear-gradient(-45deg,var(--orange-500) 0 12px,var(--paper-white) 12px 18px,var(--royal-700) 18px 30px,var(--paper-white) 30px 36px);--focus:var(--royal-700);position:relative;rotate:1.5deg;color:var(--text-ink);transition:translate var(--dur-3) var(--ease-out)}@media (prefers-reduced-motion:no-preference){.gate-env{animation:gate-rise .9s var(--ease-out) .25s backwards}}@keyframes gate-rise{0%{opacity:0;translate:0 64px}to{opacity:1;translate:0 0}}.gate-env__shadow{box-shadow:0 2px 4px rgb(7 11 31/.25),0 30px 80px rgb(7 11 31/.55);transition:opacity var(--dur-3) var(--ease-out)}.gate-env__back,.gate-env__shadow{position:absolute;inset:0;border-radius:var(--radius-xs)}.gate-env__back{z-index:0;background:var(--lining)}.gate-env__letter{position:absolute;z-index:2;left:6%;right:6%;top:4cqi;height:70%;display:grid;align-content:start;justify-items:center;gap:2.4cqi;padding-top:6cqi;border-radius:var(--radius-xs);background:var(--paper-white);box-shadow:0 1px 0 var(--paper-3) inset,0 10px 30px rgb(7 11 31/.28);transition:translate .76s var(--ease-out) .26s}.gate-env__letter:before{content:"";position:absolute;inset:3cqi;border:1px solid color-mix(in srgb,var(--orange-500) 45%,transparent);border-radius:1px;pointer-events:none}.gate-env__letter-line{color:var(--royal-700);font-family:var(--font-serif);font-style:italic;font-weight:420;font-size:max(18px,6.2cqi);line-height:1.1}.gate-env__pocketwrap{position:relative;z-index:3;filter:drop-shadow(0 -1px 0 rgb(7 11 31/.1)) drop-shadow(0 -4px 6px rgb(7 11 31/.14))}.gate-env__pocket{position:relative;padding:calc(var(--flap-h) + 58px) clamp(20px,8cqi,44px) clamp(22px,6cqi,36px);border:9px solid transparent;border-radius:var(--radius-xs);background:linear-gradient(var(--paper-white),var(--paper-white)) padding-box,var(--stripes) border-box;clip-path:polygon(0 0,50% calc(var(--flap-h) * .72),100% 0,100% 100%,0 100%)}.gate-env__title{color:var(--text-ink);font-family:var(--font-serif);font-style:italic;font-weight:400;font-stretch:100%;font-size:clamp(2.25rem,9.6cqi,3.125rem);line-height:1.02;letter-spacing:-.01em;text-align:center}.gate-env__lede{max-width:34ch;text-wrap:balance;margin:12px auto 0;color:var(--text-ink-2);font-size:1.0625rem;line-height:1.55;text-align:center}.gate-form{display:grid;margin-top:clamp(20px,5cqi,28px)}.gate-form__label{margin-bottom:8px;color:var(--text-ink);font-family:var(--font-display);font-stretch:var(--label-stretch);font-weight:720;font-size:var(--label);letter-spacing:var(--track-caps);text-transform:uppercase}.gate-form__input{width:100%;min-height:56px;padding:0 18px;border:1.5px solid var(--paper-3);border-radius:var(--radius-s);background:var(--paper);color:var(--text-ink);font-size:1.125rem;letter-spacing:.08em;transition:border-color var(--dur-1) var(--ease-out),background-color var(--dur-1) var(--ease-out)}.gate-form__input:hover{border-color:color-mix(in srgb,var(--text-ink) 40%,var(--paper-3))}.gate-form__input:focus-visible{outline:3px solid var(--royal-700);outline-offset:2px;border-color:var(--royal-700);background:var(--paper-white)}.gate-form__input[aria-invalid=true]{border-color:var(--error)}.gate-form__msg{display:flex;align-items:center;gap:8px;min-height:12px;margin:6px 0 4px;color:var(--error);font-size:1rem;font-weight:600}.gate-form__msg:empty{min-height:10px;margin:0}.gate-form__submit{width:100%;margin-top:6px}.gate-env__flapwrap{position:absolute;z-index:4;inset:0 0 auto 0;height:var(--flap-h);perspective:1400px;filter:drop-shadow(0 3px 2.5px rgb(7 11 31/.2));pointer-events:none;transition:z-index 0s linear}.gate-env__flap{position:absolute;inset:0;transform-origin:50% 0;transform-style:preserve-3d;transition:transform .56s var(--ease-in-out)}.gate-env__flap-back,.gate-env__flap-front{position:absolute;inset:0;clip-path:polygon(0 0,100% 0,50% 100%);backface-visibility:hidden}.gate-env__flap-front{display:grid;justify-items:center;align-content:start;padding-top:calc(var(--flap-h) * .2);border-top:9px solid transparent;background:linear-gradient(to bottom,var(--paper-2),color-mix(in srgb,var(--paper-2) 45%,var(--paper-3))) padding-box,var(--stripes) border-box}.gate-env__flap-back{transform:rotateX(180deg);background:var(--lining)}.gate-env__seal{position:absolute;z-index:5;left:50%;top:var(--flap-h);width:23cqi;translate:-50% -52%;pointer-events:none;transition:opacity .18s var(--ease-out)}.gate-env__seal .ui-postmark{width:100%;height:auto;overflow:visible}.gate-env[data-phase=sending] .gate-env__flap{transform:rotateX(14deg)}.gate-env[data-phase=sending]{translate:0 -6px}.gate-env[data-phase=open] .gate-env__seal{opacity:0}.gate-env[data-phase=open] .gate-env__flap{transform:rotateX(180deg);transition-delay:80ms}.gate-env[data-phase=open] .gate-env__flapwrap{z-index:1;transition-delay:.36s}.gate-env[data-phase=open] .gate-env__letter{translate:0 calc(-1 * (var(--flap-h) * .64))}.gate-env[data-phase=open]{translate:0 10px}.gate-env[data-shake=a]{animation:gate-shake-a .44s var(--ease-out)}.gate-env[data-shake=b]{animation:gate-shake-b .44s var(--ease-out)}@keyframes gate-shake-a{0%,to{transform:none}20%{transform:translateX(-10px)}40%{transform:translateX(9px)}60%{transform:translateX(-6px)}80%{transform:translateX(4px)}}@keyframes gate-shake-b{0%,to{transform:none}20%{transform:translateX(-10px)}40%{transform:translateX(9px)}60%{transform:translateX(-6px)}80%{transform:translateX(4px)}}.gate-credit{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:0 4px;padding:0 var(--gutter) calc(20px + env(safe-area-inset-bottom));color:var(--text-cream-2);font-size:var(--step--1);text-align:center;text-shadow:0 1px 2px rgb(7 11 31/.6)}@media (min-width:700px) and (max-height:820px){.gate-stage{padding-top:max(72px,calc(100svh - 680px));padding-bottom:24px}.gate-env{--flap-h:30cqi}.gate-env__title{font-size:clamp(2rem,8cqi,2.75rem)}}@media (min-width:1100px){.gate-stage{justify-items:end;padding-right:max(var(--gutter),9vw)}.gate-credit{justify-content:flex-start;text-align:left}}@media (max-width:699.98px){.gate-art{bottom:auto;height:36svh}.gate-art img{object-position:50% 80%}.gate-art__shade{background:linear-gradient(to bottom,color-mix(in srgb,var(--ink-950) 20%,transparent),transparent 30%,transparent 62%,var(--ink-900))}.gate-stage{padding-top:calc(36svh - 40px)}.gate-env{--flap-h:34cqi}}@media (max-width:479.98px){.gate-env{rotate:.8deg}.gate-env__lede{font-size:1.0625rem}.gate-credit span[aria-hidden]{display:none}.gate-credit{flex-direction:column}}@media (max-width:379.98px){.gate-form__submit{--btn-px:16px}.gate-form__submit .ui-btn__icon{display:none}}