.gate-body{background:var(--ink) url(/art/ground.webp) 62% 62% / 2200px auto;min-height:100dvh;image-rendering:pixelated}.js .gate-body{background:radial-gradient(ellipse 80% 70% at 68% 58%, #1c3414, var(--ink))}.js .gate-body.no-town{background:var(--ink) url(/art/ground.webp) 62% 62% / 2200px auto}.gate-body .top{position:absolute}.town{z-index:0;width:100%;height:100vh;pointer-events:none;height:100lvh;position:fixed;top:0;left:0;overflow:hidden}.town canvas{opacity:0;width:100%;height:100%;transition:opacity .9s var(--out-cubic), transform 1.6s var(--out-expo);display:block;transform:scale(1.06)}.town canvas.on{opacity:1;transform:none}.town:after{content:"";background:linear-gradient(90deg,#0b0f099e,#0b0f092e 44%,#0b0f0900 68%),radial-gradient(110% 95% at 64% 52%,#0b0f0900 58%,#0b0f0980),linear-gradient(#0b0f0973,#0b0f0900 120px);position:absolute;inset:0}.gate-main{z-index:1;grid-template-columns:minmax(0,460px) minmax(0,1fr);align-items:center;gap:24px clamp(20px,5vw,80px);min-height:100dvh;padding:84px clamp(16px,6vw,100px) 40px;display:grid;position:relative;overflow-x:clip}.ticket{background:var(--text);color:var(--ink);box-shadow:0 0 0 4px var(--ink), 0 12px 0 0 var(--ink);animation:ticket-in var(--spring-time) var(--spring) both;padding:26px 26px 22px;position:relative}@keyframes ticket-in{0%{opacity:0;transform:translateY(34px)rotate(-1.5deg)}}.ticket h1{font-size:calc(36px + min(var(--step), 2) * 9px);margin-bottom:8px}.ticket .lede{margin-bottom:18px;font-size:16px}.test-note{background:var(--sun);margin-bottom:14px;padding:6px 10px;font-size:14px;line-height:1.3}.row{gap:3px;margin-bottom:13px;display:grid}.row label{font-family:var(--pixel);font-size:18px;font-weight:400}.row input[type=text],.row input[type=email],.row input[type=password]{width:100%;height:44px;box-shadow:0 0 0 2px var(--ink);image-rendering:auto;transition:box-shadow var(--small) var(--out-cubic);background:#fff;border:0;padding:0 12px;font-size:17px}.row input:focus{box-shadow:0 0 0 2px var(--ink), 0 0 0 5px var(--leaf-deep);outline:none}.pass{position:relative}.pass input{padding-right:46px!important}.eye{cursor:pointer;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' shape-rendering='crispEdges'%3E%3Cpath fill='%230b0f09' d='M3 1h6v1H3zM1 2h2v1H1zM9 2h2v1H9zM0 3h1v2H0zM11 3h1v2h-1zM1 5h2v1H1zM9 5h2v1H9zM3 6h6v1H3zM5 3h2v2H5z'/%3E%3C/svg%3E") 50%/22px no-repeat;border:0;width:36px;height:36px;position:absolute;top:4px;right:4px}.eye.on{opacity:.5}.note{color:#55604a;min-height:20px;font-size:14px;line-height:1.4}.note.bad{color:#a32a1c}.note.good{color:#3f6a12}.check{cursor:pointer;align-items:center;gap:10px;margin-bottom:14px;font-size:16px;display:flex}.check input{width:22px;height:22px;accent-color:var(--leaf-deep);margin:0}.ticket .btn{width:100%;margin-top:4px}.busy .btn{filter:saturate(.5)}#status{color:#a32a1c;min-height:22px;margin-top:14px;font-size:15px;font-weight:600}#status.good{color:#3f6a12}#status.shake{animation:shake .3s var(--out-cubic)}@keyframes shake{25%{transform:translate(-6px)}50%{transform:translate(5px)}75%{transform:translate(-3px)}}.alt{margin-top:10px;font-size:15px}.alt a{color:#3f6a12;font-weight:600}@media (pointer:coarse){.eye{width:44px;height:44px;top:0;right:0}.pass input{padding-right:50px!important}.check{min-height:44px;margin-bottom:6px}.alt{margin-top:2px}.alt a{padding:13px 0;display:inline-block}}.yard{--art-w:170;--art-h:123;--feet:122;--road-x:-36;--below:calc(var(--px,0px) * (var(--feet) + 34 - var(--art-h)));bottom:calc(3vh + var(--below));margin-bottom:calc(4vh + var(--below));pointer-events:none;place-self:end center;position:sticky}.yard:has(>img){--art-w:74;--art-h:96;--feet:95;--road-x:-71}.yard:has(.yard-van,>img):before{content:"";z-index:-1;left:calc(var(--px,0px) * var(--road-x));top:calc(var(--px,0px) * (var(--feet) - 40));width:calc(var(--px,0px) * 216);height:calc(var(--px,0px) * 74);image-rendering:pixelated;background:url(/art/yard-road.webp) 0 0/100% 100% no-repeat;position:absolute}.yard:has(>img):after{content:"";z-index:-1;left:calc(var(--px,0px) * 8);top:calc(var(--px,0px) * (var(--feet) - 3));width:calc(var(--px,0px) * 58);height:calc(var(--px,0px) * 7);background:#0000003d;border-radius:50%;position:absolute}.yard-van:after{content:"";z-index:-1;background:#0000003d;border-radius:50%;width:82%;height:9%;position:absolute;bottom:-2%;left:10%}.gate-body .btn-big{max-width:100%;font-size:calc(27px + min(var(--step), 1) * 9px);white-space:normal;text-wrap:balance;padding-inline:clamp(16px,4vw,44px)}.yard-van{isolation:isolate;width:100%;animation:van-in .9s var(--out-expo) both;position:relative}@keyframes van-in{0%{transform:translate(46vw)}}.yard-van{width:-moz-fit-content;width:fit-content}.panel{transform-origin:0 0;pointer-events:none;width:38.2%;height:21.1%;padding-left:1.2%;position:absolute;top:44.7%;left:10.6%;transform:skewY(2.6deg)}.plate{color:#1d4f91;font-family:var(--pixel);white-space:pre;text-transform:uppercase;opacity:.62;transition:opacity var(--small) var(--out-cubic);font-size:18px;font-weight:400;line-height:1}.plate.typed{opacity:1}.plate.dab{animation:dab .24s var(--out-back,var(--out-cubic))}@keyframes dab{0%{transform:translateY(3px)skew(-6deg)}}.plate-sub{color:#d23b2e;text-transform:uppercase;font-family:var(--pixel);white-space:nowrap;font-size:12px;font-weight:400;line-height:1}.yard-jack{width:0;height:0;position:absolute;bottom:-8%;left:0}.yard-jack .sprite{position:absolute;bottom:0;left:0;transform:translate(-62.5%)}.won .ticket{animation:ticket-out .62s var(--in-out) forwards}@keyframes ticket-out{to{transform:translate(-120%)rotate(-7deg)}}.won .yard-van{animation:.8s cubic-bezier(.5,0,.75,0) .2s forwards van-off}@keyframes van-off{to{transform:translate(120vw)}}.sent{grid-template-columns:minmax(0,1fr);gap:10px;display:grid}.sent .btn{white-space:normal;text-align:center;margin:0;line-height:1.15}.sign-out{color:#3f6a12;cursor:pointer;background:0 0;border:0;margin-top:12px;font-weight:600;text-decoration:underline}.gate-small .ticket{text-align:center}@media (max-width:860px){.town:after{background:linear-gradient(#0b0f098c,#0b0f0914 140px 60%,#0b0f0980),radial-gradient(120% 90% at 50% 45%,#0b0f0900 60%,#0b0f0966)}.gate-main{grid-template-columns:minmax(0,1fr);align-content:start;padding-top:70px}.yard{width:-moz-fit-content;width:fit-content;max-width:100%;margin:0 auto calc(var(--below) - 2px);translate:calc(var(--px,0px) * (var(--art-w) / 2 - var(--road-x) - 108)) 0;order:-1}.yard-jack{bottom:-6%}}@media (max-width:860px) and (min-width:560px) and (orientation:landscape){.town:after{background:linear-gradient(90deg,#0b0f098c,#0b0f091a 55%,#0b0f0900),linear-gradient(#0b0f0980,#0b0f0900 90px)}.gate-main{padding:64px max(16px, env(safe-area-inset-right)) 24px max(16px, env(safe-area-inset-left));grid-template-columns:minmax(0,1fr) minmax(0,.8fr);align-items:start}.ticket{padding:20px 20px 18px}.ticket h1{font-size:36px}.yard{order:0;align-self:start;margin:12px auto 0;position:sticky;top:84px}}.resend{justify-items:start;gap:8px;margin-top:12px;display:grid}.resend[hidden]{display:none}.btn:disabled{cursor:default}
