/* The invitation is a separate first screen. Its layers create depth without a 3D runtime. */
.entry-screen{--ticket-width:min(350px,calc(100vw - 78px),calc((100svh - 180px)*.6));position:relative;isolation:isolate;min-height:100svh;display:grid;place-items:center;overflow:hidden;background:#07090c;color:#f6f5ef;padding:76px 24px 64px;perspective:1200px}
.entry-screen[hidden]{display:none}
.entry-screen::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 42% 42%,#17333235,transparent 39%),radial-gradient(ellipse at 61% 60%,#44213e2e,transparent 38%)}
.entry-header{position:absolute;top:30px;left:40px;right:40px;display:flex;justify-content:space-between;align-items:center;gap:24px;z-index:2}
.entry-wordmark{font-size:20px;font-weight:800;letter-spacing:-1.2px}.entry-wordmark span{color:#d1eadb;padding:0 3px}
.entry-motion{color:#b9bfcc;background:transparent;font-size:10px;letter-spacing:.04em;padding:12px 0;min-height:44px}
.entry-motion:hover{color:#fff}
.entry-stage{position:relative;perspective:1200px;padding:8px 0 22px}
.entry-glow{position:absolute;width:155%;height:120%;left:-27%;top:-10%;border-radius:50%;background:radial-gradient(ellipse at 25% 35%,#78eed71a,transparent 55%),radial-gradient(ellipse at 75% 65%,#db7df222,transparent 55%);filter:blur(24px);animation:entry-halo 11s ease-in-out infinite;pointer-events:none}
.ticket-float{position:relative;transform-style:preserve-3d;animation:ticket-drift 9s ease-in-out infinite}
.glass-ticket{width:var(--ticket-width);aspect-ratio:350/583;position:relative;transform-style:preserve-3d;transform:rotateX(var(--tilt-x,6deg)) rotateY(var(--tilt-y,-12deg)) rotateZ(-7deg);transition:transform 750ms cubic-bezier(.2,.7,.2,1);filter:drop-shadow(16px 36px 30px #0009);container-type:inline-size}
.ticket-depth{position:absolute;inset:0;transform:translateZ(-9px) translate(5px,4px);border-radius:22px;background:linear-gradient(145deg,#d7ffdfb3,#314c5966 18%,#d6b9eda6 48%,#f1e1cbb3 70%,#4c6f86cc);box-shadow:inset 0 0 0 1px #fff4,4px 4px 0 #a6cccf29;mask-image:radial-gradient(circle 10px at 0 76.5%,transparent 98%,#000 100%),radial-gradient(circle 10px at 100% 76.5%,transparent 98%,#000 100%);mask-composite:intersect;-webkit-mask-composite:source-in}
.glass-surface{position:absolute;inset:0;border-radius:22px;padding:2px;background:conic-gradient(from 205deg,#9acfc1,#f4d9c5,#c6b7f6,#66a6ce,#d3f7dc,#fff1dd,#b6cbf2,#9acfc1);box-shadow:0 0 19px #c5b6f223,inset 0 0 0 1px #fff9;mask-image:radial-gradient(circle 10px at 0 76.5%,transparent 98%,#000 100%),radial-gradient(circle 10px at 100% 76.5%,transparent 98%,#000 100%);mask-composite:intersect;-webkit-mask-composite:source-in}
.glass-inside{position:relative;width:100%;height:100%;overflow:hidden;border-radius:20px;background:radial-gradient(ellipse at 3% 3%,#6e9189b3,transparent 52%),radial-gradient(ellipse at 100% 100%,#865680b3,transparent 52%),linear-gradient(135deg,#172631f0,#111622f2 48%,#2c2434f0);box-shadow:inset 0 1px 1px #fff9,inset 1px 0 1px #c4fced5c,inset -1px -1px 1px #efc4f57a;backdrop-filter:blur(16px) saturate(1.4)}
.glass-film{position:absolute;inset:0;background:conic-gradient(from 40deg at var(--shine-x,30%) var(--shine-y,30%),#b1f3d500,#71c9ed57,#f9a4e537,#fbd39735,#a094ef42,#b1f3d500);mix-blend-mode:screen;pointer-events:none;opacity:.85}
.glass-reflection{position:absolute;width:250%;height:43%;left:-100%;top:-40%;background:linear-gradient(180deg,transparent,#e9fff605 28%,#fcf2fa30 49%,#e7fcfb08 51%,transparent 72%);transform:rotate(-38deg);animation:glass-sweep 12s ease-in-out infinite;pointer-events:none}
.glass-rings{position:absolute;inset:0;width:100%;height:100%;opacity:.28;fill:none;stroke-width:.7;pointer-events:none}
.glass-grain{position:absolute;inset:0;background:url('assets/grain.svg');opacity:.055;pointer-events:none}
.glass-content{position:relative;height:100%;padding:8cqw 9cqw 0;display:flex;flex-direction:column;align-items:center;text-align:center;text-shadow:0 1px 10px #ffffff18}
.glass-invited{font-size:2.5cqw;letter-spacing:.29em;font-weight:800;line-height:1.4;color:#d9e3e9;display:flex;align-items:center;gap:12px}
.glass-invited::before,.glass-invited::after{content:"";height:1px;width:19px;background:#d9e3e955}
.glass-title{font-family:var(--display);font-weight:400;line-height:.94;letter-spacing:-.02em;margin-top:6cqw;width:100%;position:relative;filter:drop-shadow(0 0 13px #e8dcfc1c)}
.glass-title .glass-the{font:700 2.5cqw/1 var(--body);letter-spacing:.32em;display:block;margin-bottom:3cqw;color:#e6e7ec}
.glass-title .glass-little{font-size:26cqw;display:block;background:linear-gradient(125deg,#f2f5da,#fff 45%,#c0c3ef 90%);-webkit-background-clip:text;background-clip:text;color:transparent}
.glass-title .glass-big{font-size:35cqw;display:block;background:linear-gradient(120deg,#d6f9e8,#faf8ee 45%,#d8c3ed 87%);-webkit-background-clip:text;background-clip:text;color:transparent}
.glass-title .glass-christmas{display:block;font-size:7.5cqw;letter-spacing:.055em;margin-top:3cqw;color:#eeedf4}
.glass-stars{font:400 4cqw/1 var(--body);letter-spacing:.45em;color:#d9e9e5;margin:4cqw 0 3cqw;padding-left:.45em}
.glass-description{font-size:2.6cqw;font-weight:700;letter-spacing:.11em;line-height:1.8;color:#e0e4e8}
.glass-detail{margin-top:4cqw;color:#bec9d8;font-size:2.3cqw;line-height:1.5;letter-spacing:.03em}
.glass-barcode{margin-top:3.5cqw;height:5.7cqw;width:42cqw;background:repeating-linear-gradient(90deg,#e1e8e5 0 1px,transparent 1px 3px,#e1e8e5 3px 5px,transparent 5px 6px,#e1e8e5 6px 7px,transparent 7px 10px,#e1e8e5 10px 13px,transparent 13px 15px);opacity:.8}
.glass-entry-bottom{position:absolute;top:76.5%;left:0;right:0;bottom:0;border-top:1px dashed #d5cfea6b;padding:5.5cqw 9cqw 4cqw;display:flex;flex-direction:column;justify-content:center;gap:3cqw}
.enter-party{width:100%;min-height:44px;border-radius:50px;padding:3.4cqw 5.5cqw;display:flex;align-items:center;justify-content:center;gap:7cqw;background:linear-gradient(110deg,#d5f4e0,#ddd0fc 50%,#f4c4dc);color:#1a1b29;border:1px solid #ffffffa6;box-shadow:inset 0 1px 1px #fff,0 0 24px #dabfec26;font-size:3.1cqw;font-weight:800;letter-spacing:.025em;transition:box-shadow .25s,transform .25s,filter .25s;position:relative;z-index:2}
.enter-party:hover{box-shadow:inset 0 1px 1px #fff,0 0 30px #d5cdfa5c;filter:brightness(1.06);transform:translateY(-2px)}
.enter-party:focus-visible{outline:3px solid #fff;outline-offset:5px}
.enter-party>span:last-child{font-size:5cqw;font-weight:400;line-height:1}
.glass-entry-bottom>p{font-size:2cqw;letter-spacing:.2em;color:#b5bed0;line-height:1.5}
.entry-star{position:absolute;line-height:1;color:#d2e9e6;font-size:30px;pointer-events:none;animation:entry-twinkle 6s ease-in-out infinite;text-shadow:0 0 20px #b9eef98c}
.entry-star-one{left:-65px;top:15%}.entry-star-two{right:-70px;bottom:25%;font-size:17px;animation-delay:-3s;color:#e6c8eb}.entry-star-three{right:20px;top:-35px;font-size:9px;animation-delay:-1.5s}
.entry-floor{position:absolute;bottom:-24px;left:5%;width:90%;height:10px;background:#bdb6d0;filter:blur(28px);opacity:.18;transform:rotate(-7deg)}
.entry-footer{position:absolute;bottom:23px;left:32px;right:32px;display:flex;justify-content:space-between;gap:20px;font-size:8px;letter-spacing:.16em;color:#9da8b6;line-height:1.7;font-weight:600}
.entry-open{overflow:hidden}.entry-open .skip-link{display:none}
.entry-leaving{animation:entry-out .75s cubic-bezier(.3,0,.2,1) both;pointer-events:none}
.entry-leaving .ticket-float{animation:ticket-enter .65s cubic-bezier(.3,0,.2,1) both}
.party-arriving{animation:party-arrive .75s var(--ease) both}
.motion-paused .glass-ticket{transform:rotateX(5deg) rotateY(-9deg) rotateZ(-7deg)!important}
@keyframes ticket-drift{0%,100%{transform:translateY(0) rotateZ(-1deg)}50%{transform:translateY(-10px) rotateZ(1deg)}}
@keyframes glass-sweep{0%,12%{transform:translate(0,0) rotate(-38deg)}60%,100%{transform:translate(20%,420%) rotate(-38deg)}}
@keyframes entry-halo{0%,100%{opacity:.55;transform:rotate(-10deg)}50%{opacity:1;transform:rotate(10deg)}}
@keyframes entry-twinkle{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:.9;transform:scale(1.05)}}
@keyframes entry-out{to{opacity:0;filter:blur(8px)}}
@keyframes ticket-enter{to{transform:translateY(-35px) translateZ(130px) rotateZ(5deg) scale(1.12);opacity:0}}
@keyframes party-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(max-width:600px){.entry-header{top:15px;left:24px;right:24px}.entry-wordmark{font-size:18px}.entry-footer{left:24px;right:24px;bottom:20px;font-size:7px;gap:24px}.entry-footer span{max-width:145px}.entry-footer span:last-child{text-align:right}.entry-star-one{left:-27px;font-size:20px}.entry-star-two{right:-28px;font-size:12px}.entry-motion{font-size:9px}.entry-screen{padding-top:68px;padding-bottom:54px}.glass-ticket{transform:rotateX(5deg) rotateY(-8deg) rotateZ(-6deg)}}
@media(max-height:580px) and (orientation:landscape){.entry-screen{--ticket-width:calc((100svh - 94px)*.6);min-height:100svh;padding-block:38px}.entry-stage{padding:0}.entry-header{top:5px}.entry-footer{bottom:10px}}
@media(prefers-reduced-motion:reduce){.glass-ticket{transform:rotateX(5deg) rotateY(-9deg) rotateZ(-7deg)!important}.entry-leaving{opacity:0}}
@media(max-width:600px){.entry-screen{--ticket-width:min(350px,calc(100vw - 92px),calc((100svh - 180px)*.6))}.enter-party{font-size:max(10px,3.1cqw)}}
@media(max-height:580px) and (orientation:landscape){.entry-screen{--ticket-width:calc((100svh - 94px)*.6)}}
