@font-face{font-family:Great Vibes;src:url('../fonts/GreatVibes-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{color-scheme:dark;--ink:#080807;--paper:#f2ebdf;--fade:650ms}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;background:var(--ink);color:var(--paper)}
body{overflow:hidden;font-family:Georgia,'Times New Roman',serif}
button{font:inherit;color:inherit;border:0;padding:0;background:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;cursor:pointer}
button:focus-visible{outline:1px solid var(--paper);outline-offset:-7px}
[hidden]{display:none!important}
#access{position:fixed;z-index:20;inset:0;display:grid;place-items:center;background:#080807;color:var(--paper)}
#access-form{width:min(88vw,390px);display:flex;flex-direction:column;align-items:center;text-align:center}
.access-kicker{margin:0 0 34px;font-family:Great Vibes,cursive;font-size:clamp(29px,4vw,48px);font-weight:400}
#access-form label{font-family:Georgia,'Times New Roman',serif;font-size:12px;letter-spacing:.18em;text-transform:uppercase;opacity:.72}
#access-token{width:min(100%,260px);margin:18px 0 22px;padding:10px 8px;border:0;border-bottom:1px solid #f2ebdf99;border-radius:0;background:transparent;color:var(--paper);font:18px Georgia,'Times New Roman',serif;text-align:center;outline:none}
#access-token:focus{border-bottom-color:var(--paper)}
#access-form button{min-height:44px;padding:6px 14px;font:12px Georgia,'Times New Roman',serif;letter-spacing:.22em;text-transform:uppercase;opacity:.82}
#access-form button:hover{opacity:1}
#access-error{min-height:22px;margin:18px 0 0;color:#d8b8a9;font-size:12px}
#privacy-notice{position:fixed;z-index:19;inset:0;display:grid;place-items:center;background:#080807e8;color:var(--paper);padding:24px}
.privacy-card{width:min(88vw,430px);padding:36px 30px 30px;border:1px solid #f2ebdf33;background:#0d0c0bd9;text-align:center;box-shadow:0 16px 60px #0008}
.privacy-copy{margin:0 auto 28px;max-width:340px;font:16px/1.8 Georgia,'Times New Roman',serif;color:#eee6d6}
.privacy-copy-zh{margin-bottom:12px;font-family:Wedding Chinese,'Kaiti SC',KaiTi,STKaiti,serif;font-size:17px;line-height:1.75}
#privacy-ack{min-height:44px;padding:7px 14px;font:12px Georgia,'Times New Roman',serif;letter-spacing:.2em;text-transform:uppercase;opacity:.84}
#privacy-ack:hover{opacity:1}
#experience,#gate,#gallery,#photo-stage{position:absolute;inset:0;width:100%;height:100%;height:100dvh}
#gate{overflow:hidden;isolation:isolate;opacity:1;transition:opacity var(--fade) ease;user-select:none}
.gate-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:53% 58%;animation:drift 26s ease-in-out infinite alternate;z-index:-2}
.gate-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.18),transparent 65%,rgba(0,0,0,.24));z-index:-1}
.invitation{position:absolute;top:15%;left:5%;width:90%;font-family:Great Vibes,'Snell Roundhand','Apple Chancery',cursive;font-size:clamp(38px,5.7vw,88px);font-weight:400;line-height:1.2;text-align:center;text-shadow:0 2px 18px #0005}
.enter{position:absolute;bottom:max(7%,40px);left:0;right:0;text-align:center;font-size:12px;letter-spacing:.26em;text-transform:uppercase}
.enter span{display:block;margin-top:12px;font-size:18px;opacity:.65}
#photo-stage{display:flex;align-items:center;justify-content:center;touch-action:pan-y;user-select:none}
#photo{display:block;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity var(--fade) ease}
#photo.visible{opacity:1}
#counter{position:absolute;bottom:max(19px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);margin:0;padding:9px 13px;font-size:12px;letter-spacing:.2em;white-space:nowrap;pointer-events:none;color:#eee6d6;text-shadow:0 1px 5px #000,0 0 12px #000;background:#08080766;border-radius:2px}
#sound{position:fixed;z-index:5;right:max(20px,env(safe-area-inset-right));bottom:max(17px,env(safe-area-inset-bottom));width:44px;height:44px;display:grid;place-items:center;opacity:.8;background:#08080766;border-radius:50%}
#sound svg{width:21px;height:21px}.sound-waves{display:none}#sound[aria-pressed=true] .sound-waves{display:initial}#sound[aria-pressed=true] .sound-slash{display:none}
#status{position:fixed;z-index:6;bottom:80px;left:10%;width:80%;text-align:center;font-size:14px;line-height:1.6;text-shadow:0 1px 5px #000;pointer-events:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.no-script{position:fixed;bottom:20px;width:100%;text-align:center}
@keyframes drift{from{transform:scale(1.015) translateY(0)}to{transform:scale(1.065) translateY(-.5%)}}
@media(max-width:600px){.invitation{top:17%;left:7%;width:86%;font-size:clamp(36px,9vw,54px);line-height:1.3}.gate-photo{object-position:54% 55%}.enter{bottom:9%}}
@media(max-height:500px) and (orientation:landscape){.invitation{top:10%;font-size:40px}.enter{bottom:7%;font-size:10px}.enter span{margin-top:3px}}
@media(prefers-reduced-motion:reduce){:root{--fade:0ms}.gate-photo{animation:none}#gate,#photo{transition:none}}

#back{position:absolute;z-index:4;top:max(20px,env(safe-area-inset-top));left:max(20px,env(safe-area-inset-left));min-height:44px;padding:0 14px;font-size:12px;letter-spacing:.12em;background:#08080780;border-radius:2px;color:var(--paper)}
#back span{margin-right:8px}

@font-face{font-family:Wedding Chinese;src:url('../fonts/wedding-chinese.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Wedding Calligraphy;src:url('../fonts/wedding-chinese.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
#ending{position:absolute;inset:0;width:100%;height:100%;height:100dvh;display:grid;place-items:center;background:var(--ink);transition:opacity var(--fade) ease;user-select:none}
#poem{font-family:Wedding Chinese,'Kaiti SC',KaiTi,STKaiti,serif;font-size:clamp(30px,5.4vw,72px);line-height:1.9;font-weight:400;letter-spacing:.18em;padding-left:.18em;color:var(--paper)}
.poem-line{display:block;white-space:nowrap}
.poem-letter{display:inline-block;opacity:0;animation:poem-reveal 900ms ease forwards;animation-delay:calc(200ms + var(--order) * 420ms)}
@keyframes poem-reveal{to{opacity:1}}
@media(prefers-reduced-motion:reduce){#ending{transition:none}.poem-letter{animation:none;opacity:1}}

@font-face{font-family:Wedding Thin;src:url('../fonts/wedding-chinese.woff2') format('woff2');font-weight:200;font-style:normal;font-display:swap}
#albums{position:absolute;left:6%;right:6%;bottom:max(9%,72px);display:flex;justify-content:center;gap:clamp(24px,5vw,88px)}
.album-entry{font-family:Georgia,'Times New Roman',serif;font-style:normal;font-weight:400;font-size:clamp(20px,1.65vw,26px);letter-spacing:.16em;line-height:1.4;min-height:44px;padding:6px 10px;white-space:nowrap;text-shadow:0 1px 8px #000,0 0 24px #000;transition:opacity .3s ease}
.album-entry:hover{opacity:.75}
.gate-shade{background:linear-gradient(180deg,rgba(0,0,0,.18),transparent 45%,rgba(0,0,0,.68))}
@media(max-width:800px){#albums{display:grid;grid-template-columns:repeat(2,max-content);column-gap:28px;row-gap:12px;bottom:max(10%,76px)}.album-entry{font-size:clamp(17px,3.8vw,22px);letter-spacing:.12em}}
@media(max-width:350px){#albums{column-gap:14px}.album-entry{font-size:17px}}
@media(max-height:500px) and (orientation:landscape){#albums{display:flex;gap:18px;left:4%;right:4%;bottom:54px}.album-entry{font-size:20px;letter-spacing:.08em}}
@media(prefers-reduced-motion:reduce){.album-entry{transition:none}}