:root{--white:#fff;--ink:#141414;--ink-hover:#2e2e2e;--ink-soft:#55534f;--grey-dark:#9c9c9c;--grey-fill:#f2f2f2;--page:#faf9f7;--red:#e63950;--peach:#f7c3a0;--rose:#efa3b7;--lavender:#d8c6ee;--accent:linear-gradient(90deg, var(--peach), var(--rose), var(--lavender));--ease:cubic-bezier(.6, 0, .2, 1);--font:"Quicksand", system-ui, sans-serif;--card-radius:32px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}[hidden]{display:none!important}html,body,h1,h2,p{margin:0}body{background:var(--page);color:var(--ink);font:500 16px/1.4 var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}.stage{justify-content:center;align-items:center;min-height:100svh;padding:48px 24px;display:flex;position:relative;overflow:clip}.scene{background:#111 url(/scene/scene.jpg) 35%/cover no-repeat;position:absolute;inset:0}.scene canvas{opacity:0;width:100%;height:100%;display:block;position:absolute;inset:0}.scene canvas.ready{opacity:1}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.card{border-radius:var(--card-radius);-webkit-backdrop-filter:blur(4px)saturate(1.2);backdrop-filter:blur(4px)saturate(1.2);width:100%;max-width:440px;animation:card-in 1s var(--ease) .5s both;background:linear-gradient(170deg,#f7c3a07a 0%,#efa3b752 24%,#d8c6ee47 44%,#faf9f7ad 64%);flex-direction:column;align-items:center;gap:24px;padding:40px 32px 32px;display:flex;position:relative;box-shadow:0 .78px .78px -.54px #0000001c,0 1.92px 1.92px -1.07px #0000001c,0 3.64px 3.64px -1.61px #0000001c,0 6.35px 6.35px -2.14px #0000001a,0 11.05px 11.05px -2.68px #00000017,0 20.24px 20.24px -3.21px #00000012,0 40px 40px -3.75px #0000000a}.card:after{content:"";border:1px solid var(--white);border-radius:inherit;pointer-events:none;position:absolute;inset:0}.metal{flex:none;width:96px;height:96px;margin-bottom:-8px;position:relative}.metal canvas{opacity:0;width:100%;height:100%;transition:opacity .2s ease-in-out;display:block;position:absolute;inset:0}.metal canvas.ready{opacity:1}.metal:before{content:"";background:linear-gradient(160deg, #ffffffb3 10%, transparent 40%, #0003 62%, transparent 85%), linear-gradient(45deg, var(--peach), var(--rose), var(--lavender));transition:opacity .2s ease-in-out;position:absolute;inset:0;-webkit-mask:url(/logo-mask.png) 50%/contain no-repeat;mask:url(/logo-mask.png) 50%/contain no-repeat}.metal:has(canvas.ready):before{opacity:0}.texts{text-align:center;flex-direction:column;align-items:center;gap:10px;width:100%;display:flex}.eyebrow{font:700 22px/1 var(--font);letter-spacing:-.03em;color:var(--ink);margin:-2px 0 14px}h1{font:700 44px/1.05 var(--font);letter-spacing:-.04em;color:#33302d;text-wrap:balance}.lede{max-width:360px;color:var(--ink-soft);font:500 16px/1.45 var(--font);text-wrap:balance}.form{width:100%}.pill{border:1.5px solid var(--white);background:#ffffffd9;border-radius:999px;align-items:center;gap:6px;padding:6px;transition:border-color .2s,box-shadow .2s,background-color .2s;display:flex;box-shadow:0 8px 24px -12px #14141440}.pill:focus-within{border-color:var(--rose);background:var(--white);box-shadow:0 0 0 4px #efa3b740}.pill input{min-width:0;font:600 16px/1.2 var(--font);color:var(--ink);background:0 0;border:0;outline:none;flex:1;margin:0;padding:12px 8px 12px 16px}.pill input::placeholder{color:var(--grey-dark);opacity:1}.submit{background:var(--ink);font:700 15px/1.2 var(--font);color:var(--white);white-space:nowrap;border-radius:999px;flex:none;padding:13px 20px;transition:background-color .2s,transform .4s cubic-bezier(.3,1.3,.5,1),opacity .2s}.submit:not(:disabled):active{transform:scale(.97)}.submit:disabled{opacity:.5;cursor:default}.submit.error{color:var(--red);background:#e639501f}@media (hover:hover){.submit:not(:disabled):not(.error):hover{background:var(--ink-hover)}.channel:hover{background:var(--white)}}.submit:focus-visible,.channel:focus-visible{outline:2px solid var(--rose);outline-offset:2px}.status{text-align:center;width:100%;font:600 14px/1.3 var(--font);color:var(--ink-soft);margin-top:-12px}.status:empty,.joined .lede{display:none}.done{text-align:center;flex-direction:column;gap:14px;width:100%;display:flex}.ticket{background:#ffffffbf;border-radius:24px;flex-direction:column;align-items:center;gap:2px;padding:18px 16px 14px;display:flex}.ticket span{font:700 12px/1.2 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}.ticket strong{font:700 48px/1.1 var(--font);letter-spacing:-.04em;background:var(--accent) 0 86% / 100% .3em no-repeat;padding:0 6px}.hint{color:var(--ink-soft);text-wrap:balance;font-size:14px}.share{background:#ffffffd9;border-radius:999px;gap:6px;padding:6px;display:flex}.share input{min-width:0;font:600 14px/1.2 var(--font);color:var(--ink);text-overflow:ellipsis;background:0 0;border:0;outline:none;flex:1;margin:0;padding:0 8px 0 14px}.channels{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.channel{font:700 13px/1.2 var(--font);color:var(--ink);background:#fff9;border-radius:999px;padding:8px 14px;text-decoration:none;transition:background-color .2s}.proof{align-items:center;gap:12px;display:flex}.faces{display:flex}.faces span{flex:none;width:16px;height:28px;position:relative}.faces img{border:2px solid var(--white);object-fit:cover;border-radius:999px;width:28px;max-width:none;height:28px;position:absolute;top:0;left:-6px}#count{font:600 14px/1.3 var(--font);color:var(--ink-soft);white-space:nowrap}.reveal{animation:reveal .7s var(--ease) var(--delay,0s) both}.pop{animation:pop .6s var(--ease) both}@keyframes card-in{0%{opacity:0;transform:translateY(30px)}}@keyframes reveal{0%{opacity:0;filter:blur(10px);transform:translateY(6px)}}@keyframes pop{0%{opacity:0;transform:scale(.94)}}@media (prefers-reduced-motion:reduce){.card,.reveal,.pop{animation:none}}@media (width<=809.98px){.stage{padding:16px}.card{gap:20px;padding:32px 20px 24px}h1{font-size:38px}}@media (width<=379.98px){.pill{border-radius:24px;flex-direction:column;align-items:stretch}.pill input{text-align:center;padding:12px}}
