@font-face{font-family:Wedding;src:url('assets/wedding.woff2') format('woff2');font-display:swap}:root{color-scheme:dark;--green:#102b26;--gold:#d7b77a;--paper:#e9dbb7;--ink:#423c2a;--serif:Georgia,'Times New Roman',serif;--cn:'Songti SC','STSong',serif}*{box-sizing:border-box}body{margin:0;background:#091613;color:#eadbb6;font-family:var(--cn);-webkit-tap-highlight-color:transparent}button,input,textarea,select{font:inherit}button{cursor:pointer}button:focus-visible{outline:2px solid #edc780;outline-offset:5px}button{touch-action:manipulation}button:disabled{cursor:wait;opacity:.65}[hidden]{display:none!important}#app{max-width:520px;margin:auto;overflow:hidden;box-shadow:0 0 100px #0009}h1,h2,h3,p{margin:0}button{border:0}.arrival{min-height:850px;min-height:100svh;position:relative;isolation:isolate;background:#11241f;display:flex;align-items:center;flex-direction:column;overflow:hidden}.sky{position:absolute;inset:0;z-index:-3;background:linear-gradient(180deg,#06131166 5%,#07151105 40%,#06181355 65%,#091a16 100%),url('assets/castle.webp') center 49%/cover;animation:sky-in 3s both}.arrival:after{content:'';position:absolute;inset:12px;border:1px solid #d5b16e38;z-index:-1;pointer-events:none}.topline{width:100%;padding:30px 27px;display:flex;align-items:center;justify-content:space-between;font:9px var(--serif);letter-spacing:.16em}.topline>span:first-child{font-size:17px;letter-spacing:.07em}.topline button,.map-header button{color:var(--gold);background:none;font-size:21px;width:32px;height:32px}.topline button[aria-pressed=true]{text-shadow:0 0 12px #f8cf71}.hero-copy{padding-top:23px;text-align:center;text-shadow:0 3px 20px #000b}.eyebrow{font:10px var(--serif);letter-spacing:.2em;color:var(--gold)}h1{font:clamp(64px,18vw,93px)/.92 var(--serif);font-weight:400;letter-spacing:-.04em;margin:25px 0 18px;color:#f0e4c6}h1 em{font-weight:400;font-size:1.1em;color:#e1c795}.hero-cn{font-size:16px;letter-spacing:.22em}.hero-names{font:12px var(--serif);letter-spacing:.26em;margin-top:20px}.hero-names i{font-size:18px;padding:0 8px}.envelope{position:relative;display:block;width:226px;height:134px;margin-top:auto;margin-bottom:75px;background:linear-gradient(145deg,#eadbb7,#bca174);color:#50432c;box-shadow:0 16px 30px #0008,0 0 30px #d7b77a11;transform:rotate(-4deg);border:1px solid #cfb88b;animation:envelope-float 5s ease-in-out infinite;transition:scale .4s}.envelope:hover{scale:1.04}.envelope:before,.envelope:after{content:'';position:absolute;inset:0;pointer-events:none}.envelope:before{background:linear-gradient(31deg,transparent 49.6%,#baa47e 50%,transparent 50.4%) 0 100%/50% 100% no-repeat,linear-gradient(-31deg,transparent 49.6%,#baa47e 50%,transparent 50.4%) 100% 100%/50% 100% no-repeat}.envelope-flap{position:absolute;inset:0;clip-path:polygon(0 0,100% 0,50% 70%);background:linear-gradient(#ebdfbd,#cfb68b);filter:drop-shadow(0 2px 1px #0005)}.envelope-note{position:absolute;top:24px;left:0;right:0;font-size:12px;letter-spacing:.12em}.seal{display:flex;justify-content:center;align-items:center;position:absolute;left:calc(50% - 28px);top:65px;width:56px;height:56px;border-radius:43% 50% 45% 48%;background:radial-gradient(circle at 35% 24%,#b96140,#81351f 60%,#4e2319);color:#e2ab77;font:18px var(--serif);border:3px double #ae6541;box-shadow:1px 3px 6px #0007}.seal span{font-size:10px}.seal-caption{position:absolute;top:160px;left:-20px;right:-20px;font-size:11px;letter-spacing:.18em;transform:rotate(4deg);color:#dfc58f;text-shadow:0 2px 8px #000}.hero-foot{position:absolute;bottom:28px;left:27px;right:27px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.09em;color:#cbb383}.stars{position:absolute;inset:0;z-index:-1;pointer-events:none}.stars i{position:absolute;border-radius:50%;background:#ffe1a4;box-shadow:0 0 9px #eabf68;animation:drift var(--duration) ease-in-out infinite alternate;animation-delay:var(--delay)}.opening .envelope{animation:none;transform:rotate(0) translateY(-20px) scale(1.1);opacity:0;transition:transform .7s,opacity .7s}.opening .sky{scale:1.07;transition:scale .8s}.letter-page{min-height:100svh;background:radial-gradient(ellipse at 30% 10%,#365145,#122b25 65%);padding:35px 22px;text-align:center}.letter-paper{padding:47px 29px 28px;background:radial-gradient(ellipse at 30% 5%,#fff2d5aa,transparent 50%),linear-gradient(110deg,#d7c494,#f0e3be 14%,#e9dab0 86%,#c9b483);color:var(--ink);position:relative;box-shadow:0 20px 50px #0007;clip-path:polygon(0 0,97% 1%,100% 0,99% 33%,100% 66%,98% 100%,70% 99%,30% 100%,0 99%,1% 60%);animation:paper-in .75s both}.letter-paper:before{content:'';position:absolute;inset:14px;border:1px solid #8b74394d;pointer-events:none}.paper-corner{font-size:38px;line-height:1;display:block;margin-bottom:22px;color:#8b6d32}.letter-paper .eyebrow{color:#806738;font-size:9px}.letter-paper h2{font-size:29px;font-weight:400;line-height:1.5;margin:18px 0}.fine-rule{display:flex;gap:17px;align-items:center;justify-content:center;color:#aa8544;margin:22px 0}.fine-rule:before,.fine-rule:after{content:'';height:1px;background:#9a7a4355;width:45px}.letter-paper>p:not(.eyebrow):not(.signature):not(.letter-date):not(.small-note){font-size:14px;line-height:2.1;margin-bottom:18px}.letter-paper .salute{text-align:left;padding-left:6px}.signature{font:italic 28px var(--serif);margin-top:25px}.signature i{color:#a57e3b}.letter-date{font:11px var(--serif);letter-spacing:.12em;margin-top:11px}.ink-button{background:#233b2d;color:#f3e1b7;padding:16px 17px;width:100%;font-size:13px;letter-spacing:.05em;margin:32px 0 13px;box-shadow:0 3px 0 #12271c}.ink-button span{padding-left:8px}.small-note{font-size:10px;color:#88734d;letter-spacing:.04em}.quiet{background:none;color:#d7c38f;font-size:12px;padding:12px}.letter-page>.quiet{margin-top:15px}.map-page{background:radial-gradient(ellipse at 50% 0,#27473b,#102b26 50%);min-height:100svh;padding:12px 17px 35px}.map-header{display:flex;align-items:center;justify-content:space-between}.map-header .quiet{font-size:10px;width:auto;padding:10px 0}.map-header .map-sigil{font:13px var(--serif);letter-spacing:.1em}.map-intro{text-align:center;margin:32px 0 26px}.map-intro .eyebrow{font-size:8px;letter-spacing:.15em}.map-intro h2{font-weight:400;font-size:29px;letter-spacing:.16em;margin:13px 0}.map-intro>p:last-child{font-size:11px;color:#b8ba94;letter-spacing:.08em}.magic-map{position:relative;aspect-ratio:420/690;background:radial-gradient(ellipse at 40% 20%,#f4e8c8,#dfcda2 70%,#bca57a);color:#51432a;box-shadow:0 15px 35px #0006, inset 0 0 35px #79633b55;border:1px solid #c1a36c;clip-path:polygon(1% 0,40% 1%,70% 0,99% 1%,100% 44%,99% 70%,100% 99%,63% 100%,35% 99%,0 100%,1% 73%,0 37%)}.magic-map:before{content:'';position:absolute;inset:14px;border:1px solid #92774355;pointer-events:none}.magic-map:after{content:'';position:absolute;top:0;bottom:0;left:50%;width:1px;background:#80694022;box-shadow:2px 0 5px #fff4db77;pointer-events:none}.map-drawing{position:absolute;width:100%;height:100%;inset:0}.gold-route{stroke:#bc8f3c;stroke-width:2;stroke-dasharray:1000;stroke-dashoffset:1000;animation:route-reveal 7s 1s forwards}.map-stop{position:absolute;z-index:2;background:none;color:#4c3a20;text-align:center;padding:8px;min-height:62px;transition:transform .2s}.map-stop:hover{transform:translateY(-3px)}.map-stop b{display:block;font-size:15px;font-weight:500;letter-spacing:.07em;white-space:nowrap}.map-stop small{font:7px var(--serif);letter-spacing:.08em;display:block;margin-top:4px}.stop-dot{position:absolute;left:calc(50% - 12px);top:-18px;border:1px solid #a67f39;border-radius:50%;background:#e8d8af;color:#825f25;width:24px;height:24px;display:grid;place-items:center;font:9px var(--serif);box-shadow:0 0 10px #b5873033}.map-stop.visited .stop-dot{background:#2b4735;color:#f5dfad;border-color:#2b4735}.stop-one{left:32%;top:18%;}.stop-two{right:8%;top:40%}.stop-three{left:9%;top:60%}.stop-four{right:6%;top:78%}.stop-five{left:20%;top:91%}.map-bottom{text-align:center;padding:30px 6px 0}.map-bottom p{font-size:12px;color:#c3c3a2;line-height:1.9}.gold-button{width:100%;padding:17px 12px;border:1px solid #a48b50;color:#e9d4a4;background:linear-gradient(120deg,#b1924a22,#d4b46b11);font-size:13px;letter-spacing:.08em;margin-top:24px}.gold-button span{float:right;padding-right:4px}.mischief{font:italic 21px var(--serif);display:block;color:#c6b882;margin-top:35px}.room{background:radial-gradient(ellipse at 30% 5%,#fff2d5aa,transparent 50%),linear-gradient(110deg,#d7c494,#f0e3be 16%,#e9dab0 90%,#c9b483);color:var(--ink);border:1px solid #aa8a4a;max-width:440px;width:calc(100% - 36px);max-height:88svh;padding:43px 30px 30px;box-shadow:0 20px 80px #000b;overscroll-behavior:contain}.room::backdrop{background:#020d0bcd;backdrop-filter:blur(5px)}.room[open]{animation:paper-in .4s both}.room-close{position:absolute;top:9px;right:9px;width:34px;height:34px;background:none;color:#7f673c;font-size:27px}.room .eyebrow{text-align:center;color:#94733b;font-size:9px;letter-spacing:.17em}.room h2{font-weight:400;font-size:29px;text-align:center;line-height:1.4;margin:14px 0 20px}.room .room-icon{display:block;text-align:center;font-size:34px;color:#9a773c;margin-bottom:18px}.room p.copy{font-size:14px;line-height:2;text-align:center;margin:15px 0}.room .event-line{border-top:1px solid #9c804145;padding:18px 0;display:flex;gap:20px;align-items:baseline}.event-line small{color:#927d52;font:10px var(--serif);letter-spacing:.08em;min-width:45px}.event-line strong{font-weight:400;font-size:18px}.room .address-note{font-size:11px;line-height:1.8;color:#827250;margin:8px 0}.room .ink-button{margin:18px 0 0}.dress-options{padding:20px 0;border-top:1px solid #9c804145;border-bottom:1px solid #9c804145;display:flex;justify-content:center;gap:20px;text-align:center}.dress-options i{width:30px;height:30px;border-radius:50%;display:block;margin:0 auto 9px;border:2px solid #bda676;box-shadow:0 0 0 3px #4d3b2211}.dress-options span{font-size:11px}.room .small-note{text-align:center;line-height:1.8;margin-top:16px}.spell-orb{display:grid;place-items:center;width:145px;height:145px;margin:30px auto;background:radial-gradient(circle,#f7e6a6 0,#be9b4e44 35%,#d2bb6c11 65%,transparent 70%);border-radius:50%;font-size:50px;color:#8e702f;border:1px solid #b2996555;box-shadow:0 0 0 8px #b2996511,0 0 0 20px #b2996509;animation:orb-breathe 3s ease-in-out infinite}.spell-word{text-align:center;font:italic 28px var(--serif);color:#765821}.spell-description{min-height:60px}.field{display:block;margin:19px 0 7px;font-size:13px}.field small{font:9px var(--serif);color:#8b7650;margin-left:8px}input,textarea,select{border:1px solid #a3894e66;background:#fffbeb88;color:#423c2a;border-radius:0;width:100%;padding:13px;font-size:14px;outline-offset:3px}input:focus,textarea:focus,select:focus{outline:1px solid #89703e}textarea{resize:vertical}select{appearance:auto}.honey{position:absolute;left:-9999px}#feedback{font-size:12px;line-height:1.8;color:#8a4229;margin-top:12px}#success{text-align:center;padding:20px 0}#success .room-icon{font-size:60px}#success p{font-size:14px;line-height:2;margin:18px 0}.privacy{font-size:10px;color:#88754e;line-height:1.8;margin-top:15px}#sparkle-layer{position:fixed;inset:0;pointer-events:none;z-index:999;overflow:hidden}.spark{position:absolute;width:4px;height:4px;border-radius:50%;background:#ffe5a7;box-shadow:0 0 12px #edc05f;animation:spark-flight 900ms forwards}.step-enter{animation:paper-in .6s both}@keyframes paper-in{from{opacity:0;transform:translateY(22px) scale(.98)}to{opacity:1;transform:none}}@keyframes sky-in{from{opacity:0;scale:1.06}to{opacity:1;scale:1}}@keyframes envelope-float{0%,100%{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(-2deg) translateY(-7px)}}@keyframes drift{from{opacity:.1;transform:translate(0,0)}to{opacity:.85;transform:translate(12px,-40px)}}@keyframes route-reveal{to{stroke-dashoffset:0}}@keyframes orb-breathe{50%{box-shadow:0 0 0 8px #b2996522,0 0 0 24px #b2996511;filter:brightness(1.1)}}@keyframes spark-flight{to{transform:translate(var(--dx),var(--dy));opacity:0}}@media(min-width:600px){body{padding:22px 0}.arrival{min-height:900px}.hero-copy{padding-top:50px}.envelope{margin-top:260px}.letter-page{min-height:900px}.map-page{padding:16px 28px 40px}}@media(max-height:750px) and (max-width:599px){.arrival{min-height:720px}.hero-copy{padding-top:0}.topline{padding-top:23px}.envelope{margin-top:150px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}.gold-route{stroke-dashoffset:0}}
/* Engraved map art, with accessible live HTML destinations. */
.magic-map{background:#decb9e url('assets/map.webp') center/100% 100% no-repeat;clip-path:none;border:0;box-shadow:0 15px 35px #0006;aspect-ratio:980/1606}.magic-map:before,.magic-map:after,.map-drawing{display:none}.stop-one{left:36%;top:24%}.stop-two{right:6%;top:44%}.stop-three{left:12%;top:61%}.stop-four{right:8%;top:77%}.stop-five{left:25%;top:92%}.map-stop{padding:5px 8px;background:radial-gradient(ellipse,#e9d4a6cc,transparent 75%);text-shadow:0 1px 2px #f2dfb6}.map-stop small{font-size:7px}.stop-dot{background:#e6ce9d}
/* Wedding after party identity and original wedding album. */
.topline>span:first-child{font-size:16px;letter-spacing:0}.afterparty-title{font-size:clamp(52px,14.2vw,74px);line-height:1.04;letter-spacing:-.045em;margin:25px 0 20px}.afterparty-title em{font-size:.93em;white-space:nowrap}.hero-chinese-names{font-size:20px;letter-spacing:.12em;margin:0 0 13px;color:#f1e3c5}.hero-chinese-names span{font:italic 18px Georgia;padding:0 7px;color:#d4b27a}.hero-copy .hero-cn{font-size:12px;letter-spacing:.15em}.hero-names{font-size:10px;margin-top:15px}.seal-family{display:block;padding-top:8px;font:12px/.95 Georgia}.seal-caption{font-size:10px}.letter-chinese-names{font-size:12px!important;letter-spacing:.12em;margin:12px 0!important}.stop-photos{left:18%;top:35%;}.dress-options{gap:0;justify-content:space-between}.dress-options span{min-width:35px;font-size:11px}.dress-options i{width:29px;height:29px}.photo-album{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:22px -10px 8px;overscroll-behavior-x:contain}.photo-album::-webkit-scrollbar{display:none}.album-page{min-width:100%;width:100%;margin:0;padding:9px 10px 3px;scroll-snap-align:start;scroll-snap-stop:always}.album-frame{padding:8px;background:#f8efd7;box-shadow:0 3px 12px #58422644;transform:rotate(-1deg);border:1px solid #baa16b}.album-frame img{display:block;width:100%;height:clamp(230px,43svh,380px);object-fit:contain;background:#e7d9b6}.album-page:nth-child(even) .album-frame{transform:rotate(1deg)}.album-page figcaption{font:9px Georgia;letter-spacing:.1em;padding:16px 0;color:#80683c;display:flex;justify-content:space-between}.album-controls{display:flex;align-items:center;justify-content:space-between;padding:0 8px}.album-controls button{width:42px;height:40px;background:transparent;border:1px solid #a3894e66;color:#6f542d;font:22px Georgia}.album-controls button:disabled{opacity:.25;cursor:default}.album-controls>span{font:11px Georgia;letter-spacing:.15em;color:#80683c}
/* An album lives on the parchment itself, replacing the station destination. */
.map-inline-album{position:absolute;z-index:3;top:31%;right:3%;width:55%;padding:13px 9px 4px;background:radial-gradient(ellipse at 35% 15%,#f2e2bb,#e1ca96 90%);color:#503d22;box-shadow:0 3px 9px #6f4b2840,inset 0 0 15px #aa844a33;border:1px solid #aa854b77;text-align:center;transform:rotate(1deg)}.map-inline-album:before{content:'';position:absolute;inset:4px;border:1px solid #ab8b5344;pointer-events:none}.inline-album-number{display:grid;place-items:center;position:absolute;left:calc(50% - 12px);top:-16px;border:1px solid #9b773e;background:#e6ce9d;border-radius:50%;width:24px;height:24px;font:9px Georgia}.map-inline-album h3{font-size:13px;font-weight:500;letter-spacing:.03em;white-space:nowrap}.map-inline-album>p{font:6px Georgia;letter-spacing:.09em;margin:4px 0 10px;color:#8a6b3b}.map-photo-strip{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;box-shadow:0 2px 5px #74542b33;background:#f8edd1;border:4px solid #f9efd7}.map-photo-strip::-webkit-scrollbar{display:none}.map-photo{min-width:100%;width:100%;margin:0;scroll-snap-align:start;scroll-snap-stop:always;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center}.map-photo img{display:block;width:100%;height:100%;object-fit:contain}.map-photo-controls{display:flex;align-items:center;justify-content:space-between;position:relative;margin-top:2px}.map-photo-controls button{min-width:36px;min-height:36px;background:transparent;color:#76572c;font:20px Georgia}.map-photo-controls button:disabled{opacity:.25;cursor:default}.map-photo-controls>span{font:9px Georgia;letter-spacing:.1em}.spell-orb.casting{animation:spell-charge .35s linear infinite;filter:brightness(1.4);background:radial-gradient(circle,#fff5c7,#d0a44744 40%,transparent 70%)}.spell-word{font-size:24px;min-height:32px}.spell-description{min-height:62px}@keyframes spell-charge{50%{transform:scale(1.07) rotate(10deg);box-shadow:0 0 30px #d4a94799,0 0 0 12px #d8bc6522}}
/* Native radio semantics, custom champagne surfaces on every platform. */
.room{color-scheme:light}.attendance-choices{padding:0;border:0;margin:22px 0 0;min-width:0}.attendance-choices legend{font-size:13px;margin-bottom:10px}.attendance-choice{position:relative;display:flex;align-items:center;gap:12px;margin:9px 0;padding:14px 12px;background:#fff9eab8;border:1px solid #cdb47d;cursor:pointer;transition:background .2s,border-color .2s}.attendance-choice:has(input:checked){background:#f1dfb3;border-color:#ae8437;box-shadow:inset 3px 0 #b38b43}.attendance-choice input{position:absolute;opacity:0;width:1px;height:1px;padding:0;margin:0}.choice-dot{width:17px;height:17px;border-radius:50%;border:1px solid #b79858;background:#fff9eb;flex:none;display:grid;place-items:center}.attendance-choice input:checked+.choice-dot:after{content:'';width:9px;height:9px;border-radius:50%;background:#b18a40}.attendance-choice:has(input:focus-visible){outline:2px solid #a47b30;outline-offset:3px}.attendance-choice>span:last-child{font-size:13px}.attendance-choice small{display:block;font:8px Georgia;letter-spacing:.09em;color:#997e4a;margin-top:5px}.room input,.room textarea{color-scheme:light;background:#fff9eab8;box-shadow:none;-webkit-appearance:none;appearance:none}.room input[type=number]{-moz-appearance:textfield}.room input[type=number]::-webkit-inner-spin-button,.room input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.room input::placeholder,.room textarea::placeholder{color:#a08b64;opacity:1}.room .event-line strong{font-size:16px}