:root{--navy: #16304f;--blue: #2b5f96;--blue-mid: #4d84b8;--blue-soft: #7ba6cd;--gold: #d3a63c;--gold-deep: #a67c17;--grey: #5c6874;--grey-soft: #8b96a2;--ink: #1d2b3a;--paper: #ffffff;--bg-1: #f4f8fc;--bg-2: #e3ebf4;--line: rgba(43, 95, 150, .16);--line-gold: rgba(211, 166, 60, .45);--shadow-card: 0 32px 70px -30px rgba(22, 48, 79, .42);--shadow-soft: 0 14px 32px -18px rgba(22, 48, 79, .5);--serif: "Playfair Display", "Times New Roman", serif;--sans: "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", sans-serif;--script: "Dancing Script", "Playfair Display", cursive}*{box-sizing:border-box}html,body,#root{height:100%}html{-webkit-text-size-adjust:100%}body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--bg-2);-webkit-font-smoothing:antialiased;overflow-x:hidden}.app{position:relative;min-height:100%;overflow-x:hidden;background:radial-gradient(900px 520px at 50% -8%,#ffffff 0%,transparent 60%),linear-gradient(180deg,var(--bg-1) 0%,var(--bg-2) 100%);background-attachment:fixed}img{max-width:100%}.kicker{margin:0;font-family:var(--serif);font-size:clamp(.7rem,2.9vw,.85rem);font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--grey)}.btn{font-family:var(--sans);font-size:clamp(.86rem,3.4vw,.95rem);font-weight:500;letter-spacing:.02em;padding:.85rem 1.7rem;border-radius:999px;border:1px solid transparent;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease,background .25s ease,color .25s ease,opacity .25s ease}.btn:disabled{opacity:.55;cursor:default}.btn:not(:disabled):hover{transform:translateY(-2px)}.btn:not(:disabled):active{transform:translateY(0)}.btn-primary{background:linear-gradient(135deg,#e3bb58,var(--gold));color:#3b2c07;box-shadow:0 12px 26px -12px #a67c17bf}.btn-ghost{background:transparent;color:var(--blue);border-color:var(--line)}.btn-ghost:not(:disabled):hover{background:#2b5f9614}.btn-outline{display:inline-block;text-decoration:none;background:var(--paper);color:var(--blue);border-color:#2b5f9659;box-shadow:var(--shadow-soft)}.btn-outline:hover{background:#2b5f960f}.hero-art{display:grid;grid-template-columns:1fr;width:min(23rem,92%);margin:0 auto}.hero-art img{grid-area:1 / 1;height:auto;align-self:start;filter:drop-shadow(0 10px 18px rgba(22,48,79,.16))}.hero-cap{width:78%;justify-self:end;margin:7% 4.5% 0 0;animation:floatCap 6.5s ease-in-out infinite}.hero-flower{width:53%;justify-self:start;margin-left:3.5%;animation:floatFlower 6.5s ease-in-out infinite .7s}.hero-bow{width:35%;justify-self:start;margin:39% 0 0 26%;animation:floatBow 6.5s ease-in-out infinite 1.2s}@keyframes floatCap{0%,to{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(-5deg) translateY(-7px)}}@keyframes floatFlower{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes floatBow{0%,to{transform:rotate(2deg) translateY(0)}50%{transform:rotate(2deg) translateY(-4px)}}.petals{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:0}.petal{position:absolute;top:-6vh;width:9px;height:9px;border-radius:60% 0;background:linear-gradient(135deg,#7ba6cdbf,#d3a63c80);opacity:0;animation-name:fall;animation-iteration-count:infinite;animation-timing-function:linear}@keyframes fall{0%{opacity:0;transform:translate(0) rotate(0) scale(var(--scale))}10%{opacity:.65}90%{opacity:.4}to{opacity:0;transform:translate(var(--drift),108vh) rotate(420deg) scale(var(--scale))}}.reveal{opacity:0;animation:rise .9s cubic-bezier(.22,1,.36,1) forwards}.d1{animation-delay:.1s}.d2{animation-delay:.4s}.d3{animation-delay:.7s}.d4{animation-delay:1s}.d5{animation-delay:1.35s}@keyframes rise{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}.welcome{position:relative;z-index:1;min-height:100svh;display:grid;place-items:center;padding:2rem 1.25rem;text-align:center}.welcome-inner{width:min(34rem,100%)}.welcome .kicker{margin-bottom:.7rem}.welcome-title{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,11vw,3.9rem);line-height:1.1;color:var(--navy)}.welcome-from{display:block;margin-top:.1rem;font-family:var(--script);font-weight:600;font-size:clamp(2.4rem,11.5vw,3.9rem);line-height:1.28;color:var(--blue-soft)}.rule{width:clamp(70px,22vw,100px);height:1px;margin:1.5rem auto;background:linear-gradient(90deg,transparent,var(--gold),transparent)}.welcome-sub{margin:0 auto 2rem;max-width:24rem;font-size:clamp(.9rem,3.6vw,1rem);font-weight:300;line-height:1.7;color:var(--grey)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;display:grid;place-items:center;padding:1.25rem;background:#16304f6b;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);animation:fade .4s ease forwards;overflow-y:auto}@keyframes fade{0%{opacity:0}to{opacity:1}}.dialog{position:relative;width:min(25rem,100%);padding:2.9rem 1.6rem 2rem;text-align:center;background:var(--paper);border-radius:18px;box-shadow:var(--shadow-card);animation:pop .55s cubic-bezier(.22,1,.36,1) forwards}@keyframes pop{0%{opacity:0;transform:translateY(26px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}.dialog:after{content:"";position:absolute;top:9px;right:9px;bottom:9px;left:9px;border:1px solid var(--line-gold);border-radius:11px;pointer-events:none}.dialog-seal{position:absolute;top:-25px;left:50%;transform:translate(-50%);width:50px;height:50px;display:grid;place-items:center;font-size:1.3rem;color:#fffaf0;background:linear-gradient(135deg,#e3bb58,var(--gold-deep));border-radius:50%;box-shadow:0 8px 18px -8px #a67c17e6}.dialog-title{margin:0 0 .45rem;font-family:var(--serif);font-weight:500;font-size:clamp(1.5rem,6vw,1.75rem);color:var(--navy)}.dialog-desc{margin:0 0 1.5rem;font-size:clamp(.86rem,3.4vw,.92rem);font-weight:300;line-height:1.6;color:var(--grey)}.dialog-input{width:100%;padding:.9rem 1rem;font-family:var(--sans);font-size:1rem;color:var(--ink);text-align:center;background:#fbfdff;border:1px solid var(--line);border-radius:12px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.dialog-input:focus{border-color:var(--blue-mid);box-shadow:0 0 0 4px #4d84b82e}.dialog-input.has-error{border-color:#c0563f}.dialog-error{margin:.55rem 0 0;font-size:.82rem;color:#c0563f}.dialog-btn{width:100%;margin-top:1.25rem}.envelope-stage{position:relative;z-index:1;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(1.8rem,7vw,2.6rem);padding:2rem 1.25rem;animation:fade .7s ease forwards}.envelope-greeting{margin:0;font-family:var(--serif);font-size:clamp(1rem,4.2vw,1.2rem);font-weight:400;color:var(--grey);transition:opacity .5s ease}.envelope-greeting strong{font-weight:500;color:var(--blue)}.envelope{position:relative;width:min(330px,82vw);height:calc(min(330px,82vw)*.66);cursor:pointer;perspective:1400px;filter:drop-shadow(0 22px 34px rgba(22,48,79,.3));animation:float 4.5s ease-in-out infinite}.envelope:focus-visible{outline:2px solid var(--gold);outline-offset:14px}.envelope.phase-flap,.envelope.phase-slide,.envelope.phase-zoom{animation:none;cursor:default}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-9px)}}.env-back{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:linear-gradient(160deg,#2f5c8a,#1d3d61);border-radius:8px}.env-letter{position:absolute;left:7%;right:7%;top:7%;height:82%;z-index:2;display:grid;place-items:center;padding:.75rem;background:linear-gradient(180deg,#fff,#f2f6fa);border-radius:4px;box-shadow:0 6px 18px -8px #16304f73;transform:translateY(0);transition:transform 1.05s cubic-bezier(.32,1.02,.4,1),opacity .6s ease}.env-letter-inner{display:flex;flex-direction:column;align-items:center;gap:.3rem;text-align:center}.env-letter-mono{font-family:var(--serif);font-size:.58rem;letter-spacing:.34em;text-transform:uppercase;color:var(--gold-deep)}.env-letter-name{font-family:var(--script);font-weight:600;font-size:clamp(1.2rem,6vw,1.6rem);line-height:1.2;color:var(--blue)}.env-letter-line{width:50px;height:1px;background:var(--line-gold)}.env-letter-sub{font-family:var(--serif);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}.phase-slide .env-letter,.phase-zoom .env-letter{transform:translateY(-118%)}.phase-zoom .env-letter{transform:translateY(-118%) scale(1.55);opacity:0;transition:transform .75s ease-in,opacity .55s ease-in}.env-front{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;background:linear-gradient(160deg,#3a6ea3,#24486f);border-radius:8px;overflow:hidden}.env-front:before,.env-front:after{content:"";position:absolute;bottom:0;width:62%;height:100%;background:linear-gradient(180deg,#ffffff17,#00000024)}.env-front:before{left:0;transform-origin:bottom left;transform:skew(28deg)}.env-front:after{right:0;transform-origin:bottom right;transform:skew(-28deg)}.env-flap{position:absolute;top:0;left:0;right:0;height:62%;z-index:5;background:linear-gradient(180deg,#4877ac,#2c5581);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top center;transform:rotateX(0);transition:transform .85s cubic-bezier(.6,0,.3,1),z-index 0s linear .42s;backface-visibility:hidden}.phase-flap .env-flap,.phase-slide .env-flap,.phase-zoom .env-flap{transform:rotateX(-172deg);z-index:1}.env-seal{position:absolute;top:50%;left:50%;z-index:6;width:52px;height:52px;display:grid;place-items:center;font-family:var(--serif);font-size:1rem;letter-spacing:.06em;color:#4a3708;background:radial-gradient(circle at 32% 28%,#efce7d,var(--gold-deep));border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 6px 16px -6px #4a3708b3,inset 0 0 0 3px #fffbeb66;transition:opacity .35s ease,transform .5s ease}.phase-flap .env-seal,.phase-slide .env-seal,.phase-zoom .env-seal{opacity:0;transform:translate(-50%,-50%) scale(.6) rotate(-25deg)}.envelope-hint{display:flex;align-items:center;gap:.55rem;margin:0;font-size:clamp(.8rem,3.4vw,.86rem);font-weight:300;letter-spacing:.06em;color:var(--grey-soft);transition:opacity .4s ease}.tap-dot{width:8px;height:8px;border-radius:50%;background:var(--gold);animation:ping 1.8s ease-out infinite}@keyframes ping{0%{box-shadow:0 0 #d3a63c8c}70%{box-shadow:0 0 0 12px #d3a63c00}to{box-shadow:0 0 #d3a63c00}}.fade-out{opacity:0!important}.letter-stage{position:relative;z-index:1;display:grid;place-items:center;padding:clamp(1rem,5vw,3.5rem) clamp(.7rem,3vw,1.5rem)}.letter{position:relative;width:min(37rem,100%);padding:clamp(1.6rem,5.5vw,3rem) clamp(1.1rem,5vw,3rem) clamp(2rem,6vw,2.6rem);text-align:center;background:var(--paper);border-radius:4px;box-shadow:var(--shadow-card);animation:letterIn 1.1s cubic-bezier(.22,1,.36,1) forwards}@keyframes letterIn{0%{opacity:0;transform:translateY(-40px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}.letter:before{content:"";position:absolute;inset:clamp(7px,2vw,12px);border:1px solid var(--line-gold);pointer-events:none}.letter .hero-art{margin-bottom:clamp(.5rem,2vw,1rem)}.guest-name{margin:.3rem 0 0;font-family:var(--script);font-weight:600;font-size:clamp(1.9rem,8.5vw,2.8rem);line-height:1.25;color:var(--blue)}.attend{margin:.15rem 0 0;font-family:var(--serif);font-size:clamp(.9rem,3.8vw,1.1rem);font-weight:400;font-style:italic;color:var(--grey)}.card-head .kicker{color:var(--grey)}.headline{margin:.35rem 0 0;font-family:var(--serif);font-weight:400;font-size:clamp(2.5rem,13vw,4.7rem);line-height:1.06;letter-spacing:-.01em;color:var(--navy)}.subhead{margin:.15rem 0 0;font-family:var(--serif);font-weight:500;font-size:clamp(.95rem,4.2vw,1.45rem);letter-spacing:.12em;line-height:1.45;text-transform:uppercase;color:var(--navy)}.in-honor{margin-top:clamp(1.2rem,4vw,1.7rem)}.honoree{margin:.2rem 0 0;font-family:var(--script);font-weight:600;font-size:clamp(2.3rem,11vw,3.6rem);line-height:1.2;color:var(--blue-soft)}.school{margin:clamp(.8rem,3vw,1.2rem) 0 0;font-family:var(--serif);font-size:clamp(.85rem,3.6vw,1.1rem);font-weight:500;letter-spacing:.08em;line-height:1.5;text-transform:uppercase;color:var(--navy)}.when{margin:clamp(1.5rem,5vw,2.2rem) 0 0}.when-day{margin:0;font-family:var(--serif);font-size:clamp(.82rem,3.4vw,1rem);font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--navy)}.date-row{display:flex;align-items:center;justify-content:center;gap:clamp(.6rem,3vw,1.3rem);margin-top:.5rem}.date-month,.date-year{font-family:var(--serif);font-size:clamp(1.05rem,5vw,1.65rem);font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:var(--navy)}.date-day{font-family:var(--serif);font-size:clamp(2.5rem,13vw,4rem);font-weight:700;line-height:1;color:var(--navy)}.date-bar{width:1px;height:clamp(2.4rem,11vw,3.6rem);background:var(--gold);opacity:.7}.where{margin:clamp(1.4rem,5vw,2rem) 0 0}.venue{margin:0;font-family:var(--serif);font-size:clamp(1.05rem,4.4vw,1.35rem);font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--navy)}.address{margin:.3rem 0 0;font-family:var(--serif);font-size:clamp(.8rem,3.4vw,.95rem);font-weight:400;line-height:1.6;color:var(--grey)}.message{margin:clamp(1.6rem,5vw,2.2rem) auto 0;max-width:27rem;font-size:clamp(.88rem,3.6vw,.97rem);font-weight:300;line-height:1.85;color:var(--grey)}.map-link{display:flex;align-items:center;justify-content:center;gap:.55rem;width:100%;margin-top:clamp(1.4rem,5vw,2rem);padding:.9rem 1rem;font-family:var(--sans);font-size:clamp(.86rem,3.6vw,.95rem);font-weight:500;color:var(--blue);background:#2b5f960d;border:1px dashed var(--gold);border-radius:12px;cursor:pointer;transition:background .25s ease,transform .25s ease}.map-link:hover{background:#2b5f961a;transform:translateY(-2px)}.map-link-icon{font-size:1rem;color:var(--gold-deep)}.map-link-arrow{animation:nudge 1.6s ease-in-out infinite}@keyframes nudge{0%,to{transform:translateY(0)}50%{transform:translateY(4px)}}.rsvp{margin:clamp(1.8rem,6vw,2.4rem) 0 0;padding-top:clamp(1.5rem,5vw,2rem);border-top:1px solid var(--line-gold)}.rsvp-title{margin:.35rem 0 1.1rem;font-family:var(--serif);font-weight:500;font-size:clamp(1.3rem,5.6vw,1.65rem);color:var(--navy)}.rsvp-note{width:100%;padding:.8rem 1rem;font-family:var(--sans);font-size:1rem;font-weight:300;color:var(--ink);background:#fbfdff;border:1px solid var(--line);border-radius:12px;resize:vertical;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.rsvp-note:focus{border-color:var(--blue-mid);box-shadow:0 0 0 4px #4d84b829}.rsvp-actions{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-top:1rem}.rsvp-done{animation:rise .6s ease forwards}.rsvp-done-text{margin:0 0 1rem;font-size:clamp(.9rem,3.6vw,.98rem);font-weight:300;line-height:1.7;color:var(--grey)}.rsvp-change{font-family:var(--sans);font-size:.82rem;color:var(--blue);background:none;border:none;border-bottom:1px solid var(--line);padding:0 0 2px;cursor:pointer}.rsvp-change:hover{color:var(--navy)}.card-foot{margin-top:clamp(1.8rem,6vw,2.4rem);padding-top:clamp(1.3rem,5vw,1.8rem);border-top:1px solid var(--line-gold)}.foot-phone{display:inline-block;margin-top:.4rem;font-family:var(--serif);font-size:clamp(1.2rem,5.2vw,1.45rem);letter-spacing:.06em;color:var(--navy);text-decoration:none;border-bottom:1px solid var(--line-gold)}.foot-phone:hover{border-color:var(--gold)}.foot-sign{margin:1.2rem 0 0;font-family:var(--script);font-weight:600;font-size:clamp(1.5rem,7vw,1.9rem);color:var(--blue-soft)}.map-stage{position:relative;z-index:1;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(.8rem,3vw,1.2rem);padding:clamp(2.5rem,9vw,5rem) clamp(.7rem,3vw,1.5rem);text-align:center}.map-title{margin:.3rem 0 0;font-family:var(--serif);font-weight:400;font-size:clamp(2.1rem,10vw,3.3rem);color:var(--navy)}.map-sub{margin:0;font-family:var(--serif);font-size:clamp(.85rem,3.6vw,1rem);font-weight:400;line-height:1.7;color:var(--grey)}.map-address{font-size:clamp(.78rem,3.2vw,.88rem);color:var(--grey-soft)}.map-frame{width:min(46rem,100%);padding:clamp(6px,2vw,10px);background:var(--paper);border-radius:8px;box-shadow:var(--shadow-card);overflow:auto;-webkit-overflow-scrolling:touch}.map-frame img{display:block;width:100%;height:auto;border-radius:3px;cursor:zoom-in;transition:width .35s ease}.map-frame img.zoomed{width:220%;max-width:none;cursor:zoom-out}.map-tip{margin:0;font-size:clamp(.75rem,3.2vw,.82rem);font-weight:300;color:var(--grey-soft)}.map-placeholder{display:grid;place-items:center;gap:.8rem;padding:clamp(2.5rem,10vw,3.5rem) 1.25rem;border:1px dashed var(--line-gold);border-radius:6px;font-size:.88rem;font-weight:300;line-height:1.7;color:var(--grey)}.map-placeholder-icon{font-size:2rem;color:var(--gold-deep)}.map-placeholder code{padding:.12rem .4rem;margin:0 .2rem;font-size:.82rem;background:#2b5f961a;border-radius:4px}@media (max-width: 420px){.rsvp-actions{flex-direction:column}.rsvp-actions .btn{width:100%}.date-row{gap:.55rem}.letter{border-radius:3px}}@media (max-width: 340px){.school{letter-spacing:.05em}.subhead,.venue{letter-spacing:.1em}.kicker{letter-spacing:.22em}}@media (max-height: 520px) and (orientation: landscape){.welcome,.envelope-stage,.map-stage{min-height:auto;padding-top:3rem;padding-bottom:3rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1}}