:root{
  --navy:#061a3a;
  --navy2:#020b1d;
  --purple:#ae4cff;
  --violet:#6f2cff;
  --white:#fff;
  --gold:#f6c44c;
  --ink:#07152e;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:radial-gradient(circle at 50% 10%,#0c2d61 0,#061a3a 42%,#020b1d 100%);font-family:Arial,Helvetica,sans-serif;color:#fff}
body.modal-open{overflow:hidden}
.page-shell{min-height:100%;display:flex;justify-content:center;padding:0 16px}
.invitation-stage{width:min(100%,862px);display:flex;justify-content:center}
.art-wrap{width:100%;position:relative;line-height:0;filter:drop-shadow(0 20px 45px rgba(0,0,0,.38))}
.invitation-art{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}

/* Exact overlay region for the RSVP button in the cropped 862×1696 artwork.
   Coordinates remain tied to the original button pixels so the hotspot scales with the artwork. */
.rsvp-hotspot{position:absolute;left:12.645%;top:77.03%;width:74.594%;height:7.665%;border:0;background:transparent;padding:0;cursor:pointer;border-radius:999px;z-index:6;outline:none;animation:attentionBounce 4.8s ease-in-out infinite;isolation:isolate}
.rsvp-hotspot::before{content:"";position:absolute;inset:5%;border-radius:999px;box-shadow:0 0 12px rgba(224,162,255,.78),0 0 26px rgba(180,72,255,.58),0 0 44px rgba(126,42,255,.34);animation:haloPulse 2.2s ease-in-out infinite;pointer-events:none}
.rsvp-hotspot:focus-visible{outline:4px solid #fff;outline-offset:5px}
.cta-sheen{position:absolute;inset:8% 5%;overflow:hidden;border-radius:999px;pointer-events:none}
.cta-sheen::after{content:"";position:absolute;top:-30%;left:-30%;width:18%;height:160%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-22deg);animation:sheen 3.5s ease-in-out infinite}

.orbit{position:absolute;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 7px #fff,0 0 14px #cf75ff,0 0 24px #9b42ff;pointer-events:none;offset-path:inset(7% 1.5% round 999px);offset-rotate:0deg;animation:orbit 3.8s linear infinite}
.orbit-b{animation-delay:-.95s;background:#e6c8ff}
.orbit-c{animation-delay:-1.9s;width:9px;height:9px;background:#c260ff}
.orbit-d{animation-delay:-2.85s;width:8px;height:8px;background:#fff}

/* The arrows are already part of the approved artwork.
   Instead of moving duplicate image crops (which can create visible blocks),
   small neon glints move toward the RSVP button so the original arrows appear animated. */
.arrow-cue{position:absolute;z-index:5;width:15px;height:15px;border-radius:50%;pointer-events:none;opacity:.9;filter:blur(.2px);background:radial-gradient(circle,#fff 0 18%,#f6b6ff 24%,#c34cff 48%,rgba(195,76,255,0) 72%);box-shadow:0 0 8px #fff,0 0 16px #d15cff,0 0 28px #8b2cff}
.arrow-cue-left{left:8.7%;top:81.6%;animation:leftArrowGlint 1.65s ease-in-out infinite}
.arrow-cue-right{right:8.4%;top:81.2%;animation:rightArrowGlint 1.65s ease-in-out infinite -.82s}

@keyframes orbit{to{offset-distance:100%}}
@keyframes haloPulse{0%,100%{opacity:.45;transform:scale(.99)}50%{opacity:1;transform:scale(1.018)}}
@keyframes attentionBounce{0%,72%,100%{transform:translateY(0) scale(1)}78%{transform:translateY(-4px) scale(1.008)}84%{transform:translateY(1px) scale(1)}}
@keyframes leftArrowGlint{0%,100%{transform:translate(0,0) scale(.75);opacity:.25}50%{transform:translate(34px,-2px) scale(1.25);opacity:1}}
@keyframes rightArrowGlint{0%,100%{transform:translate(0,0) scale(.75);opacity:.25}50%{transform:translate(-34px,-2px) scale(1.25);opacity:1}}
@keyframes sheen{0%,55%{left:-30%;opacity:0}60%{opacity:1}80%{left:120%;opacity:0}100%{left:120%;opacity:0}}

.modal-backdrop{position:fixed;inset:0;z-index:50;background:rgba(1,8,23,.78);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:grid;place-items:center;padding:18px;overflow:auto}
.modal-backdrop[hidden]{display:none}
.modal{position:relative;width:min(100%,620px);max-height:calc(100vh - 36px);overflow:auto;background:linear-gradient(180deg,#0d2651 0,#071933 100%);border:1px solid rgba(186,102,255,.55);border-radius:26px;padding:30px;box-shadow:0 24px 80px rgba(0,0,0,.55),0 0 40px rgba(139,56,255,.22);animation:modalIn .28s ease-out}
@keyframes modalIn{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
.close-button{position:absolute;right:14px;top:12px;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.11);color:#fff;font-size:30px;cursor:pointer}
.eyebrow{margin:0 0 8px;color:#f9cb48;font-size:13px;font-weight:800;letter-spacing:.12em;text-align:center}
h1,h2{margin:0;text-align:center;line-height:1.08}h1{font-size:clamp(27px,6vw,40px)}h2{font-size:clamp(26px,5vw,36px)}
.modal-subtitle,.result-view>p{text-align:center;color:#dbe7ff;font-size:17px;line-height:1.5}
#rsvpForm{display:grid;gap:16px;margin-top:25px}
.field{display:grid;gap:7px;font-size:14px;font-weight:700;color:#eaf1ff}
.field input,.field textarea{width:100%;border:1px solid rgba(151,186,235,.42);border-radius:13px;background:#fff;color:#10182a;font:inherit;font-size:16px;padding:14px 15px;outline:none}
.field input:focus,.field textarea:focus{border-color:#bd66ff;box-shadow:0 0 0 3px rgba(174,76,255,.22)}
.optional{font-weight:400;color:#9fb1d0}
.choice-group{border:0;padding:0;margin:0;display:grid;gap:10px}.choice-group legend{font-size:14px;font-weight:800;margin-bottom:9px}.choice{display:block;position:relative}.choice input{position:absolute;opacity:0;pointer-events:none}.choice span{display:flex;align-items:center;justify-content:center;min-height:52px;padding:11px;border-radius:13px;border:2px solid rgba(255,255,255,.18);font-size:15px;font-weight:900;cursor:pointer;transition:.2s}.choice input:focus-visible+span{outline:3px solid #fff;outline-offset:2px}.yes-choice input:checked+span{background:#318d1e;border-color:#7df45d;box-shadow:0 0 18px rgba(84,239,56,.25)}.no-choice input:checked+span{background:#eee7dd;color:#1e2130;border-color:#fff}
.admission-note{margin:2px 0 0;padding:13px 15px;border-radius:14px;background:rgba(248,195,62,.11);border:1px solid rgba(248,195,62,.3);font-size:13px;line-height:1.45;color:#ffeab6}
.submit-button{min-height:54px;border:0;border-radius:15px;background:linear-gradient(90deg,#8b35f3,#c957ff);color:#fff;font-size:16px;font-weight:900;letter-spacing:.02em;cursor:pointer;box-shadow:0 9px 25px rgba(141,55,244,.28)}.submit-button:disabled{opacity:.6;cursor:wait}.submit-button span{font-size:21px}.form-status{min-height:18px;margin:0;text-align:center;font-size:13px;color:#ffd98a}
.honeypot{position:absolute;left:-9999px}
.result-view{text-align:center}.confetti{font-size:24px;letter-spacing:8px;color:#ffe466;margin-bottom:12px}.ticket-ready{font-weight:900;color:#ffd65f!important;letter-spacing:.08em;font-size:14px!important;margin:24px 0 12px!important}
.golden-ticket{position:relative;overflow:hidden;margin:0 auto;padding:24px 22px 20px;color:#2a1800;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.8),transparent 28%),linear-gradient(135deg,#f5cf65,#f8e4a2 45%,#d99c27 100%);border:3px solid #9f6312;border-radius:18px;box-shadow:0 15px 45px rgba(0,0,0,.35),inset 0 0 0 2px rgba(255,255,255,.45);animation:ticketReveal .7s cubic-bezier(.2,.9,.3,1.2)}
@keyframes ticketReveal{from{opacity:0;transform:translateY(35px) rotateX(10deg) scale(.92)}to{opacity:1;transform:none}}
.golden-ticket::before{content:"";position:absolute;inset:8px;border:1px dashed rgba(104,58,3,.45);border-radius:12px;pointer-events:none}.ticket-kicker{font-size:14px;font-weight:1000;letter-spacing:.18em;margin:0}.golden-ticket h3{font-size:28px;line-height:.95;margin:3px 0 10px;color:#5c2600}.golden-ticket h3 span{color:#b12d0a}.admit-two{font-size:19px;font-weight:1000;margin:7px 0}.admit-strip{display:inline-block;background:#0b3c92;color:#fff;padding:7px 12px;border-radius:5px;font-size:12px;font-weight:900}.ticket-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:left;margin:18px 0}.ticket-grid p{margin:0;padding:9px;border-top:1px solid rgba(81,46,3,.24)}.ticket-grid b{display:block;font-size:9px;letter-spacing:.12em;color:#7a4b09}.ticket-grid span{display:block;font-size:12px;font-weight:700;line-height:1.35;margin-top:3px}.explore-line{font-size:10px!important;color:#573200!important;font-weight:900;letter-spacing:.06em;margin:12px 0 8px!important}.ticket-number{font-family:monospace;font-size:11px!important;color:#573200!important;margin:0!important}.ticket-actions{display:flex;gap:10px;margin-top:16px}.ticket-button{flex:1;min-height:48px;border:0;border-radius:12px;color:#fff;font-weight:900;cursor:pointer}.ticket-button.save{background:#278e30}.ticket-button.print{background:#164999}.miss-icon{font-size:54px;margin-bottom:10px}

@media(max-width:600px){.page-shell{padding:0}.invitation-stage{width:100%}.art-wrap{filter:none}.modal-backdrop{padding:8px}.modal{width:100%;max-height:calc(100vh - 16px);border-radius:20px;padding:25px 18px}.ticket-grid{grid-template-columns:1fr}.ticket-actions{flex-direction:column}.orbit{width:8px;height:8px}.arrow-cue{display:block}}
@media(min-width:900px){.page-shell{padding-top:24px;padding-bottom:24px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}.rsvp-hotspot::before{opacity:.75}.arrow-cue{display:none}}
@media print{body{background:#fff}.page-shell,.modal-backdrop .close-button,.ticket-actions,.result-view>p,.result-view>.eyebrow,.result-view>h2,.confetti,.ticket-ready{display:none!important}.modal-backdrop{position:static;display:block!important;background:#fff;padding:0}.modal{box-shadow:none;border:0;background:#fff;padding:0;width:100%;max-height:none;overflow:visible}.golden-ticket{width:690px;max-width:100%;margin:20px auto;box-shadow:none}}