:root{--paper: #f4f1ea;--paper-2: #ece4d4;--ink: #4a4540;--ink-soft: #6f6a62;--ink-faint: #a59c8c;--gold: #b9975b;--gold-soft: #c2a878;--green: #8a9a7b;--rose: #cf9aa6;--lav: #a194bd;--serif: "Cormorant Garamond", Georgia, serif;--display: "Cinzel", "Cormorant Garamond", serif;--script: "Pinyon Script", cursive;--vibes: "Great Vibes", cursive;--arabic: "Amiri", serif;--card-w: 414px;--ease: cubic-bezier(.22, .61, .36, 1)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--serif);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overscroll-behavior:none}.stage{width:100%;min-height:100vh;min-height:100dvh;display:grid;place-items:stretch}.card{position:relative;width:100vw;height:100vh;height:100dvh;overflow:hidden;background:var(--paper);isolation:isolate;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}@media (min-width: 600px){body{background:radial-gradient(120% 80% at 50% 0%,#2b2722,#181613 70%)}.stage{place-items:center;padding:clamp(0px,3vh,32px)}.card{width:auto;height:min(900px,calc(100dvh - 48px));aspect-ratio:576 / 1024;max-width:100vw;border-radius:26px;box-shadow:0 30px 80px #0000008c,0 0 0 1px #ffffff0f}}.card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(140% 100% at 50% 50%,transparent 60%,rgba(120,105,80,.14) 100%);z-index:6}.scenes{position:absolute;top:0;right:0;bottom:0;left:0;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;scroll-behavior:smooth;overscroll-behavior-y:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}.scenes::-webkit-scrollbar{display:none}.scenes--locked{overflow:hidden}.scene-layer{position:relative;height:100%;display:flex;flex-direction:column;scroll-snap-align:start;scroll-snap-stop:always}.scene{position:relative;flex:1;width:100%;overflow:hidden;background:url(/wedding_other_pages.webp) center / cover no-repeat;--ink: #f0ebe2;--ink-soft: #c4bfb4;--ink-faint: #928d83;--gold: #d4aa6a;--gold-soft: #c8a268}.scene--cover{background:url(/wedding_first_page.webp) center / cover no-repeat}.anim{opacity:0}.scene-layer--inview .anim{animation:rise 1.4s var(--d, 0s) var(--ease) both}@keyframes rise{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}.petals{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;pointer-events:none}.petal{position:absolute;top:-8%;width:13px;height:13px;border-radius:60% 0;background:linear-gradient(135deg,#fbeef0,var(--rose));filter:blur(.2px);animation:drift linear infinite}.petal:nth-child(3n){background:linear-gradient(135deg,#fff,#e6dfce)}.petal:nth-child(3n+1){background:linear-gradient(135deg,#d7e0cb,var(--green))}@keyframes drift{0%{transform:translateY(-10%) translate(0) rotate(0)}to{transform:translateY(115vh) translate(40px) rotate(420deg)}}.dots{position:absolute;right:calc(10px + env(safe-area-inset-right));top:50%;transform:translateY(-50%);z-index:7;display:flex;flex-direction:column;gap:14px}.dot{position:relative;width:9px;height:9px;padding:0;border:0;border-radius:50%;background:#78695052;cursor:pointer;transition:background .4s var(--ease),height .4s var(--ease)}.dot:before{content:"";position:absolute;top:-11px;right:-11px;bottom:-11px;left:-11px}.dot--on{background:var(--gold);height:22px;border-radius:5px}.bismillah{font-family:var(--arabic);font-size:26px;color:var(--ink);text-align:center;direction:rtl}.section-title{font-family:var(--display);font-weight:500;font-size:clamp(22px,6.5vw,27px);letter-spacing:.05em;text-align:center;color:var(--ink)}.soon{display:grid;place-items:center;background:radial-gradient(120% 90% at 50% 0%,var(--paper),var(--paper-2))}.soon-glow{position:absolute;width:130%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(185,151,91,.22),transparent 62%);filter:blur(6px);animation:soon-breathe 7s var(--ease) infinite;pointer-events:none}.soon-inner{position:relative;text-align:center;padding:24px}.soon-inner>*{animation:rise 1.2s var(--ease) both}.soon-flourish{animation-delay:.15s}.soon-title{animation-delay:.3s}.soon-tag{animation-delay:.45s}.soon-brand{font-family:var(--script);font-size:clamp(34px,12vw,52px);background:linear-gradient(100deg,var(--gold-soft),var(--gold) 45%,#e7cf9c 60%,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:4px}.soon-flourish{display:block;width:180px;max-width:60%;height:auto;margin:8px auto 14px;color:var(--gold)}.soon-title{font-family:var(--display);font-weight:500;font-size:clamp(20px,6vw,28px);letter-spacing:.08em;color:var(--ink)}.soon-tag{margin-top:20px;font-family:var(--serif);font-size:clamp(13px,4vw,16px);letter-spacing:.35em;text-transform:uppercase;color:var(--ink-faint)}@keyframes soon-breathe{0%,to{transform:scale(.92);opacity:.7}50%{transform:scale(1.06);opacity:1}}.soon-footer{position:absolute;bottom:calc(20px + env(safe-area-inset-bottom));left:0;right:0;text-align:center;font-family:var(--serif);font-style:italic;font-size:14px;color:var(--ink-faint)}@media (prefers-reduced-motion: reduce){.scenes{scroll-behavior:auto}.petal{animation:none}.anim{opacity:1}.scene-layer--inview .anim,.soon-glow{animation:none}.soon-inner>*{animation:none}}.cover__center{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 12%}.cover__eyebrow{position:absolute;bottom:calc(50% + 172px);left:0;right:0;font-family:var(--display);font-size:13px;font-weight:500;letter-spacing:.4em;text-indent:.4em;text-transform:uppercase;color:var(--gold)}.cover__hint{position:absolute;bottom:calc(80px + env(safe-area-inset-bottom));left:0;right:0;margin:0 auto;width:fit-content;font-size:12px;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;color:var(--ink-faint);animation:pulse 2.4s ease-in-out infinite;background:none;border:none;font-family:inherit;cursor:pointer}@keyframes pulse{0%,to{opacity:.4}50%{opacity:.85}}.cover__names{font-family:var(--vibes);font-size:clamp(48px,14vw,68px);color:var(--ink);line-height:1.15;text-shadow:0 2px 12px rgba(0,0,0,.3)}.cover__amp{font-style:normal;color:var(--gold)}.cover__hashtag{position:absolute;top:calc(50% + 192px);left:0;right:0;font-style:italic;font-size:17px;letter-spacing:.04em;color:var(--ink-soft)}.mono-amp{font-family:var(--script);font-style:normal;color:var(--gold)}.monogram{position:relative;display:grid;place-items:center;filter:drop-shadow(0 6px 14px rgba(120,105,80,.25))}.monogram svg{position:absolute;top:0;right:0;bottom:0;left:0}.monogram__letters{position:relative;display:flex;align-items:baseline;gap:2px;font-family:var(--display);font-size:34px;color:#4a4540}.monogram__letters .mono-amp{font-size:26px;color:#b9975b}.couple__content{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 11%}.couple__kicker{font-family:var(--display);font-size:clamp(13px,3.6vw,15px);font-weight:500;letter-spacing:.42em;text-indent:.42em;color:var(--gold)}.couple__flourish{width:132px;height:auto;color:var(--gold-soft);margin:16px 0 22px}.couple__names{display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--ink)}.couple__name{font-family:var(--serif);font-weight:500;font-size:clamp(40px,14vw,58px);line-height:1.04;letter-spacing:.01em;text-transform:capitalize}.couple__amp{font-family:var(--script);font-size:clamp(38px,12vw,52px);line-height:.7;color:var(--gold);margin:-2px 0}.couple__date{display:flex;align-items:center;gap:14px;margin-top:30px;font-size:clamp(12px,3.3vw,13.5px);letter-spacing:.26em;text-indent:.26em;text-transform:uppercase;color:var(--ink-soft)}.couple__rule{width:28px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-soft))}.couple__rule:last-child{background:linear-gradient(90deg,var(--gold-soft),transparent)}.couple__hashtag{margin-top:16px;font-style:italic;font-size:13px;letter-spacing:.04em;color:var(--ink-faint)}.jemputan__inner{position:relative;z-index:2;height:100%;overflow-y:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:9% 11% 52px;gap:4px}.jemputan__salam{font-size:15px;letter-spacing:.06em;color:var(--ink-soft);margin-bottom:14px}.jemputan__waris{display:flex;flex-direction:column;gap:2px;font-size:20px;line-height:1.2;color:var(--ink);margin-bottom:16px}.jemputan__waris strong{font-weight:600;letter-spacing:.02em}.jemputan__waris .amp{font-family:var(--script);font-size:22px;color:var(--gold);font-weight:400}.jemputan__intro,.jemputan__body{font-size:15px;color:var(--ink-soft);line-height:1.5;max-width:30ch}.jemputan__honorifics{font-size:12.5px;font-weight:600;letter-spacing:.01em;color:var(--ink);margin:6px 0;line-height:1.6}.jemputan__name{font-family:var(--display);font-weight:500;font-size:21px;letter-spacing:.04em;line-height:1.3;color:var(--ink);margin:14px 0 4px;max-width:24ch}.jemputan__connector{font-family:var(--script);font-size:26px;color:var(--gold)}.butiran__inner{position:relative;z-index:2;height:100%;overflow-y:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:9% 12% 52px}.butiran__block{margin-bottom:13px;width:100%}.butiran__block .label{font-style:italic;font-size:15px;color:var(--ink-soft);margin-bottom:4px}.butiran__block .emph{font-family:var(--display);font-size:18px;letter-spacing:.04em;color:var(--ink)}.butiran__block .emph--sm{font-size:15px;font-family:var(--serif);font-weight:600}.butiran__block .emph--sm .muted{font-weight:400;color:var(--ink-soft)}.butiran__block .sub{font-size:13.5px;color:var(--ink-soft);font-style:italic}.butiran__block .venue{font-family:var(--script);font-size:30px;color:var(--gold);line-height:1;margin:4px 0 8px}.contacts{list-style:none;max-width:26ch;margin:4px auto 0}.contacts li{display:flex;align-items:baseline;font-size:14px;color:var(--ink);gap:6px;padding:2px 0}.contacts .dotfill{flex:1;border-bottom:1px dotted var(--ink-faint);transform:translateY(-3px)}.contacts a{color:var(--ink-soft);text-decoration:none;font-variant-numeric:tabular-nums}.doa__inner{position:relative;z-index:2;height:100%;overflow-y:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:10% 13% 52px}.doa__logo{width:180px;height:auto;mix-blend-mode:screen;margin-bottom:6px}.doa__monogram .mono-amp{font-size:26px;margin:0 4px}.doa__lines{margin:12px 0}.doa__lines p{font-size:13.5px;line-height:1.55;color:var(--ink)}.doa__amin{font-family:var(--display);font-size:16px;letter-spacing:.05em;color:var(--ink);margin-top:8px}.doa__closing{margin-top:12px;font-style:italic;font-size:13.5px;line-height:1.6;color:var(--ink-soft);max-width:32ch;padding-top:10px;border-top:1px solid rgba(201,184,156,.5)}.ucapan__inner{position:relative;z-index:2;height:100%;overflow-y:auto;display:flex;flex-direction:column;align-items:center;text-align:center;padding:12% 11% 52px}.ucapan__flourish{width:130px;height:auto;color:var(--gold-soft);margin:14px 0 6px}.ucapan__empty{font-style:italic;font-size:15px;color:var(--ink-soft);margin-top:24px}.ucapan__list{list-style:none;width:100%;margin:10px 0 0;padding:0}.ucapan__item{padding:14px 0;border-bottom:1px solid rgba(201,184,156,.35)}.ucapan__item:last-child{border-bottom:none}.ucapan__msg{font-family:var(--serif);font-size:16px;line-height:1.5;color:var(--ink);font-style:italic}.ucapan__name{font-family:var(--script);font-size:22px;color:var(--gold);line-height:1.1;margin-top:6px}.ucapan__inner{scrollbar-width:none;overflow-x:hidden}.ucapan__inner::-webkit-scrollbar{display:none}.cover__hint:after{content:"⌄";display:block;font-size:22px;line-height:1;margin-top:2px;animation:nudge 1.8s ease-in-out infinite}@keyframes nudge{0%,to{transform:translateY(0)}50%{transform:translateY(4px)}}.envelope{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center}.env-half{position:absolute;top:0;bottom:0;width:50.5%;overflow:hidden;background-image:url(/wedding_envelope.webp);background-repeat:no-repeat;background-size:198.02% 100%;transition:transform 1.2s var(--ease)}.env-half--l{left:0;background-position:left center;box-shadow:inset -16px 0 30px -16px #96805066}.env-half--r{right:0;background-position:right center;box-shadow:inset 16px 0 30px -16px #96805066}.envelope--opening .env-half--l{transform:translate(-101%)}.envelope--opening .env-half--r{transform:translate(101%)}.env-seal{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:14px;padding:0;border:0;background:none;cursor:pointer;transition:opacity .5s var(--ease),transform .6s var(--ease)}.envelope--opening .env-seal{opacity:0;transform:scale(.7);pointer-events:none}.env-stamp{width:168px;height:168px;object-fit:contain;mix-blend-mode:multiply;filter:drop-shadow(0 6px 14px rgba(0,60,30,.35))}.env-hint{font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:#3d3830;background:#f5f0e6eb;padding:7px 20px;border-radius:999px;border:1px solid rgba(120,105,80,.45);animation:env-hint-pulse 2.4s ease-in-out infinite}@keyframes env-hint-pulse{0%,to{opacity:.72}50%{opacity:1}}.wax{position:relative;display:grid;place-items:center;filter:drop-shadow(0 6px 12px rgba(80,60,20,.4))}.wax svg{position:absolute;top:0;right:0;bottom:0;left:0}.wax__letters{position:relative;font-family:var(--display);font-size:30px;letter-spacing:.02em;color:#f6eccb;text-shadow:0 1px 1px rgba(80,60,20,.7)}.wax__letters .mono-amp{color:#f6eccb;font-size:20px;opacity:.9;margin:0 3px}.countdown__inner{position:relative;z-index:2;height:100%;overflow-y:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:12% 10% 80px;gap:8px}.countdown__date{font-size:clamp(13px,4vw,16px);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft)}.countdown__grid{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin-top:18px;max-width:100%}.cd-box{display:flex;flex-direction:column;align-items:center;gap:3px;width:58px;padding:13px 0;background:#fbfaf6;border:1px solid rgba(201,184,156,.6);border-radius:12px;box-shadow:0 8px 18px #78695029}.cd-num{font-family:var(--display);font-size:26px;line-height:1;color:#4a4540;font-variant-numeric:tabular-nums}.cd-label{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#6f6a62}.countdown__past{margin-top:16px;font-style:italic;font-size:15px;line-height:1.6;color:var(--ink-soft);max-width:26ch}.btn-row{display:flex;gap:10px;width:100%;max-width:300px;margin-top:10px}.btn{flex:1;text-align:center;padding:11px 12px;border-radius:999px;font-family:var(--serif);font-size:14px;font-weight:600;letter-spacing:.03em;text-decoration:none;color:#4a4540;background:#fbfaf6;border:1px solid var(--gold-soft);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}.btn:hover{transform:translateY(-1px);box-shadow:0 6px 14px #78695033}.btn--ghost{background:#fbfaf6;color:#4a4540}.btn--gold{background:#fbfaf6;border-color:var(--gold-soft);color:#4a4540}.music{position:absolute;top:calc(12px + env(safe-area-inset-top));left:calc(12px + env(safe-area-inset-left));z-index:8;width:38px;height:38px;border-radius:50%;border:1px solid rgba(120,105,80,.4);background:#fbfaf68c;color:var(--ink-soft);font-size:15px;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.jemputan__inner,.butiran__inner,.doa__inner,.countdown__inner{scrollbar-width:none;overflow-x:hidden}.jemputan__inner::-webkit-scrollbar,.butiran__inner::-webkit-scrollbar,.doa__inner::-webkit-scrollbar,.countdown__inner::-webkit-scrollbar{display:none}.card.rsvp{display:flex;align-items:center;justify-content:center;overflow-y:auto;-webkit-user-select:auto;user-select:auto}.rsvp__form,.rsvp__thanks{width:100%;max-width:348px;padding:38px 30px;text-align:center;border:1px solid var(--gold-soft);border-radius:14px;background:linear-gradient(180deg,#ffffff73,#fff0);box-shadow:0 18px 40px -28px #7862328c}.rsvp__title{font-family:var(--display);font-size:22px;letter-spacing:.34em;text-indent:.34em;text-transform:uppercase;color:var(--gold)}.rsvp__flourish{width:120px;height:auto;color:var(--gold-soft);margin:12px auto 4px;display:block}.rsvp__sub,.rsvp__thanks p{font-size:16px;color:var(--ink-soft);margin:8px 0 24px;line-height:1.5}.rsvp__couple{font-family:var(--script);font-size:32px;color:var(--gold);line-height:1.1;margin:6px 0 0}.rsvp__couple .rsvp__amp{font-family:var(--script)}.rsvp__field{display:block;text-align:left;margin-bottom:18px}.rsvp__field span{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:7px}.rsvp__field input,.rsvp__field textarea{width:100%;box-sizing:border-box;padding:11px 13px;font-family:var(--serif);font-size:16px;color:var(--ink);background:#fbfaf6;border:1px solid var(--gold-soft);border-radius:10px;outline:none;resize:vertical;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}.rsvp__field input:focus,.rsvp__field textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px #b9975b29}.rsvp .btn{width:100%;margin-top:10px;letter-spacing:.16em;cursor:pointer}.rsvp .btn:disabled{opacity:.6;cursor:default}.rsvp__error{color:#b4524a;font-size:14px;margin:0 0 12px}.list__form{max-width:480px;border:none;box-shadow:none;background:none}.list__total{font-size:17px;color:var(--ink-soft);margin:0 0 14px}.list__total strong{color:var(--gold)}.list__bysource{list-style:none;margin:0 0 20px;padding:12px 16px;border-radius:10px;background:#b9975b14;font-size:14px;color:var(--ink-soft)}.list__bysource li{display:flex;justify-content:space-between;padding:3px 0}.list__attendees{list-style:none;margin:0;padding:0;max-height:50vh;overflow-y:auto;text-align:left}.list__attendees li{display:flex;justify-content:space-between;gap:12px;padding:11px 4px;border-bottom:1px solid rgba(185,151,91,.2);transition:background .2s var(--ease)}.list__attendees li:hover{background:#b9975b0f}.list__name{color:var(--ink)}.list__source{color:var(--ink-soft);font-size:13px}.list__pax{color:var(--gold);white-space:nowrap;font-weight:600}.spinner{width:30px;height:30px;margin:24px auto;border:3px solid rgba(185,151,91,.2);border-top-color:var(--gold);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.spinner{animation-duration:1.6s}}
