[data-style=luxury]{--c-bg:oklch(16% .03 345);--c-surface:oklch(20.5% .038 345);--c-ink:oklch(93% .022 85);--c-accent:oklch(79% .11 82);--c-accent-2:oklch(42% .13 18);--c-on-accent:oklch(18% .03 345);--c-accent-text:oklch(81% .1 84);--radius:2px;--gold:var(--c-accent);--gold-deep:oklch(63% .11 72);--gold-glow:oklch(86% .09 88);--maroon:var(--c-accent-2);--maroon-deep:oklch(28% .09 15);--timber:oklch(21% .035 40);--timber-2:oklch(25% .04 42);--night:oklch(11% .025 345);--shadow:oklch(8% .02 345/.7);--ease-out:cubic-bezier(.2,.7,.2,1);--ease-inout:cubic-bezier(.4,0,.2,1);--ease-in:cubic-bezier(.55,0,1,.45);--dur-quick:.2s;--dur-base:.6s;--dur-slow:.9s;--dur-draw:1.6s;--stagger:80ms;--rise-y:18px;--rail:30px}@media (width<=640px){[data-style=luxury]{--rail:12px}}@layer components{.font-jawi{font-family:var(--ff-jawi), serif}.font-arab{font-family:var(--ff-arab), serif}.tnum{font-variant-numeric:tabular-nums lining-nums}.gold{color:var(--gold)}html,body{overflow-x:clip}body{background:var(--c-bg)}::selection{background:var(--gold);color:var(--c-on-accent)}@keyframes rise{0%{opacity:0;transform:translateY(var(--rise-y))}to{opacity:1;transform:none}}@keyframes fade{0%{opacity:0}to{opacity:1}}@keyframes draw{to{stroke-dashoffset:0}}.draw path{stroke-dasharray:1;stroke-dashoffset:1px}.go .draw path,.go.draw path{animation:draw var(--dur-draw) var(--ease-inout) both}@media (prefers-reduced-motion:reduce){.draw path{stroke-dashoffset:0}}.js .reveal{opacity:0;transform:translateY(var(--rise-y));transition:opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out)}.js .reveal.go{opacity:1;transform:none}@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none}}.pintu{z-index:60;background:url(/pintu-wall.jpg) center / cover, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cpath d='M28 6 L50 28 L28 50 L6 28 Z M28 18 L38 28 L28 38 L18 28 Z' fill='none' stroke='%23D6B56B' stroke-width='.8' opacity='.22'/%3E%3Ccircle cx='28' cy='28' r='1.6' fill='%23D6B56B' opacity='.35'/%3E%3C/svg%3E") center / 56px 56px, radial-gradient(80% 70% at 50% 50%, var(--maroon-deep), var(--night));position:fixed;inset:0}.pintu .doorway{perspective:1900px;background:radial-gradient(60% 55% at 50% 48%, var(--gold-glow), var(--gold-deep) 30%, var(--maroon-deep) 70%, var(--night));width:min(100%,100dvh);box-shadow:0 0 0 1px var(--gold-deep), 0 0 0 10px var(--timber), 0 0 0 11px var(--gold-deep), 0 0 80px 20px var(--shadow);position:absolute;top:0;bottom:0;left:50%;translate:-50%}@media (scripting:none){.pintu{display:none}}.pintu[hidden]{display:none}.pintu .leaf{width:50.1%;color:var(--gold);background:repeating-linear-gradient(90deg, transparent 0 7px, oklch(30% .04 42/.35) 7px 8px, transparent 8px 19px), linear-gradient(180deg, var(--timber-2), var(--timber) 40%, var(--timber-2));transform-style:preserve-3d;backface-visibility:hidden;box-shadow:inset 0 0 120px var(--shadow);transition:transform 1.9s cubic-bezier(.6,.02,.18,1);position:absolute;top:0;bottom:0}.pintu .leaf:after{content:"";background:var(--night);opacity:0;transition:opacity 1.9s var(--ease-inout);position:absolute;inset:0}.pintu .leaf-l{transform-origin:0;left:0}.pintu .leaf-r{transform-origin:100%;right:0}.pintu .leaf picture,.pintu .leaf-img{width:100%;height:100%;position:absolute;inset:0}.pintu .leaf-img{object-fit:cover;animation:lamplit 1.6s var(--ease-out) .1s both}.pintu .leaf-l .leaf-img{object-position:right center}.pintu .leaf-r .leaf-img{object-position:left center}@keyframes lamplit{0%{filter:brightness(.18)saturate(.6)}to{filter:none}}.pintu .face{z-index:2;text-align:center;width:min(460px,100% - 32px);color:var(--c-ink);background:radial-gradient(closest-side,oklch(13% .03 345/.92),oklch(13% .03 345/.75) 70%,#0000);justify-items:center;gap:14px;padding:26px 22px 24px;display:grid;position:absolute;bottom:max(7vh,48px);left:50%;translate:-50%}.pintu .face>*{pointer-events:auto;animation:rise var(--dur-slow) var(--ease-out) both}.pintu .face>:first-child{animation-delay:1.4s}.pintu .face>:nth-child(2){animation-delay:1.6s}.pintu .face>:nth-child(3){animation-delay:1.85s}.pintu .names{font-family:var(--ff-display), serif;text-shadow:0 2px 18px var(--shadow);font-size:clamp(30px,6.4vw,56px);line-height:1}.pintu .names b{color:var(--gold);font-weight:400}.pintu .when{letter-spacing:.18em;text-transform:uppercase;color:color-mix(in oklab, var(--c-ink) 78%, var(--gold));font-size:13px}.btn-buka{background:var(--gold);min-height:52px;color:var(--c-on-accent);letter-spacing:.04em;box-shadow:0 0 0 1px var(--gold-glow) inset, 0 10px 30px var(--shadow);transition:transform var(--dur-quick) var(--ease-out), background var(--dur-quick) var(--ease-out);border-radius:999px;align-items:center;gap:12px;padding:0 26px;font-weight:700;display:inline-flex}.btn-buka:hover{background:var(--gold-glow)}.btn-buka:active{transform:translateY(1px)scale(.98)}.btn-buka:focus-visible{outline:2px solid var(--c-ink);outline-offset:4px}.btn-buka svg{width:18px;height:18px}.pintu.open .leaf-l{transform:rotateY(-112deg)}.pintu.open .leaf-r{transform:rotateY(112deg)}.pintu.open .leaf:after{opacity:.55}.pintu.open .face{opacity:0;transition:opacity .35s var(--ease-in)}.pintu.open{animation:pintu-out .8s var(--ease-inout) 1.5s both}@keyframes pintu-out{to{opacity:0;visibility:hidden}}.pintu canvas{z-index:3;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}@media (prefers-reduced-motion:reduce){.pintu .leaf{transition:none}.pintu.open{opacity:0;animation:.15s linear reverse both fade}}html.pintu-lock,html.pintu-lock body{overflow:hidden}.band{background:url(/songket-band.jpg) 50%/auto 100% repeat-x;width:100%;height:30px;display:block}.h2{font-family:var(--ff-display), serif;letter-spacing:-.005em;font-size:clamp(30px,9.4cqw,46px);font-weight:400;line-height:1.05}.lede{color:color-mix(in oklab, var(--c-ink) 86%, var(--c-bg));font-size:clamp(16px,4.3cqw,19px);line-height:1.6}.muted{color:var(--c-muted)}.small{font-size:14px;line-height:1.5}.person{font-family:var(--ff-display), serif;font-size:clamp(22px,6.4cqw,28px);line-height:1.15}.bismillah{font-family:var(--ff-arab), serif;color:var(--gold);font-size:clamp(22px,7cqw,32px);line-height:1.6}.walimah{font-family:var(--ff-jawi), serif;color:var(--gold);font-size:clamp(54px,20cqw,96px);line-height:1.05}.names-xl{font-family:var(--ff-display), serif;letter-spacing:-.02em;font-size:clamp(64px,21cqw,110px);font-weight:400;line-height:.9}.names-xl .amp{color:var(--gold);vertical-align:.24em;margin-inline:.08em;font-size:.56em;display:inline-block}.names-xl:focus,.scene h2:focus,.scene [tabindex="-1"]:focus{outline:none}.album{container-type:inline-size}html.is-story body{background:url(/pintu-wall.jpg) center / cover no-repeat fixed, var(--night)}html.is-story .album{--card-radius:3px;--card-shadow:0 0 0 1px var(--gold-deep), 0 40px 120px oklch(5% .02 345/.8);perspective:2400px;container-type:size}@media (width>=720px){html.is-story .album{overflow:visible}}.page{isolation:isolate;background:radial-gradient(120% 70% at 80% 0%, oklch(23% .05 345), var(--c-bg) 62%);position:relative}.page-in{flex-direction:column;justify-content:center;gap:14px;min-height:100%;padding:30px 24px 112px 34px;display:flex;position:relative}html:not(.is-story) .page-in{max-width:640px;min-height:0;margin-inline:auto;padding-block:72px}#s-aturcara .page-in,#s-rsvp .page-in,#s-ucapan .page-in,#s-wakil .page-in{justify-content:flex-start;padding-top:40px}.page-photo{z-index:-1;position:absolute;inset:0;overflow:clip}.page-photo picture,.page-photo img{object-fit:cover;width:100%;height:100%;display:block}.page-photo img{opacity:.42;-webkit-mask-image:linear-gradient(#000 30%,#0000 92%);mask-image:linear-gradient(#000 30%,#0000 92%)}.page--cover .page-photo img{opacity:.55;object-position:50% 30%}.page--quiet .page-photo img{opacity:.3}.scene.is-current .page-photo img{animation:kenburns 14s var(--ease-inout) both}@keyframes kenburns{0%{transform:scale(1.08)}to{transform:none}}.spine{display:none}html.is-story .spine{z-index:9;background:var(--maroon-deep);width:14px;box-shadow:inset -1px 0 var(--gold-deep), 2px 0 8px oklch(5% .02 345/.6);border-radius:var(--card-radius) 0 0 var(--card-radius);display:block;position:absolute;top:0;bottom:0;left:0}.spine .woven{clip-path:inset(0 0 calc((1 - var(--progress,0)) * 92%) 0);transition:clip-path 1.2s var(--ease-inout);background:url(/songket-rail.jpg) top/100% repeat-y;position:absolute;inset:0}html.is-story .album>.scene{visibility:hidden;backface-visibility:hidden;transform-origin:0;border-radius:var(--card-radius)}html.is-story .album>.scene.is-current,html.is-story .album>.scene.leaving{visibility:visible}html.is-story .album>.scene:after{content:"";pointer-events:none;opacity:0;background:linear-gradient(90deg,oklch(5% .02 345/.1),oklch(5% .02 345/.75));position:absolute;inset:0}.album[data-dir=fwd]>.scene.leaving{z-index:5;animation:1.4s cubic-bezier(.42,0,.3,1) both page-out}.album[data-dir=fwd]>.scene.leaving:after{animation:1.4s ease-in both page-shade}.album[data-dir=fwd]>.scene.is-current{z-index:4;animation:page-under 1.4s var(--ease-out) both}.album[data-dir=back]>.scene.is-current{z-index:5;animation:1.05s cubic-bezier(.25,.7,.2,1) both page-in}.album[data-dir=back]>.scene.is-current:after{animation:1.05s ease-out reverse both page-shade}.album[data-dir=back]>.scene.leaving{z-index:4}@keyframes page-out{0%{transform:none}to{transform:rotateY(-100deg)}}@keyframes page-in{0%{transform:rotateY(-100deg)}to{transform:none}}@keyframes page-shade{0%{opacity:0}to{opacity:1}}@keyframes page-under{0%{filter:brightness(.5)}to{filter:none}}.album .scene{--scene-lag:.7s}html.is-story .album>.scene.leaving .in{opacity:1;animation:none}.scene.leaving .page-photo img{transform:none}.album[data-dir=back] .scene{--scene-lag:.3s}@media (prefers-reduced-motion:reduce){.album[data-dir]>.scene.leaving,.album[data-dir]>.scene.is-current{animation:.15s linear both fade}.album>.scene:after{display:none}.scene.is-current .page-photo img{animation:none}}.cover-in{justify-content:flex-end;gap:6px}.cover-date{margin-top:18px;font-size:18px}.cover-date span{color:var(--c-muted)}.cover-place{color:var(--gold);letter-spacing:.04em}.hint{letter-spacing:.12em;text-transform:uppercase;color:var(--c-muted);margin-top:26px;font-size:13px}.hint:after{content:" →";animation:nudge 1.6s var(--ease-inout) infinite;display:inline-block}@keyframes nudge{50%{transform:translate(6px)}}.navigated [data-hint],html:not(.is-story) [data-hint]{display:none}.parents{border-top:1px solid color-mix(in oklab, var(--gold) 30%, transparent);gap:2px;margin-top:18px;padding-top:18px;display:grid}.jawi-amp{font-family:var(--ff-jawi), serif;color:var(--gold);font-size:30px;line-height:1.4}.couple{gap:10px;margin-top:8px;display:grid}.couple-name{font-family:var(--ff-display), serif;margin-top:2px;font-size:clamp(32px,10cqw,46px);line-height:1.02}.couple-amp{font-family:var(--ff-display), serif;color:var(--gold);font-size:40px;line-height:1}.big-day{font-family:var(--ff-display), serif;color:var(--gold);font-size:clamp(130px,46cqw,220px);line-height:.78}.count{border:1px solid color-mix(in oklab, var(--gold) 35%, transparent);grid-template-columns:repeat(4,minmax(0,1fr));margin-top:6px;display:grid}.count>div{text-align:center;border-left:1px solid color-mix(in oklab, var(--gold) 22%, transparent);padding:14px 4px}.count>div:first-child{border-left:0}.count b{font-family:var(--ff-display), serif;font-size:clamp(28px,8.6cqw,40px);font-weight:400;line-height:1;display:block}.count span{letter-spacing:.14em;text-transform:uppercase;color:var(--c-muted);font-size:11px}.thread{margin-top:6px;display:grid;position:relative}.thread:before{content:"";background:linear-gradient(var(--gold), color-mix(in oklab, var(--gold) 20%, transparent));transform-origin:top;width:1px;position:absolute;top:10px;bottom:10px;left:6px}.scene.is-current .thread:before{animation:thread-grow 1.6s var(--ease-inout) .4s both}@keyframes thread-grow{0%{transform:scaleY(0)}to{transform:none}}.knot{border-top:1px solid color-mix(in oklab, var(--gold) 12%, transparent);grid-template-columns:76px minmax(0,1fr);gap:0 12px;padding:11px 0 11px 26px;display:grid;position:relative}.knot:before{content:"";background:var(--c-bg);border:1px solid var(--gold);width:10px;height:10px;position:absolute;top:17px;left:1px;rotate:45deg}.knot.key:before{background:var(--gold)}.knot time{font-variant-numeric:tabular-nums;color:var(--gold);padding-top:3px;font-size:14px;font-weight:700}.knot h3{font-family:var(--ff-display), serif;font-size:20px;font-weight:400;line-height:1.2}.knot p{color:var(--c-muted);grid-column:2;font-size:14px;line-height:1.45}.map{border:1px solid color-mix(in oklab, var(--gold) 30%, transparent);background:var(--c-surface);margin:0}.map img{width:100%;height:auto;display:block}.map figcaption{color:var(--c-muted);padding:8px 12px;font-size:13px}.pantun-in{justify-content:center}.pantun p{font-family:var(--ff-display), serif;font-size:clamp(26px,8cqw,38px);line-height:1.22}.btns{flex-wrap:wrap;gap:10px;display:flex}.btn{white-space:nowrap;min-height:46px;transition:background var(--dur-quick) var(--ease-out), transform var(--dur-quick) var(--ease-out);border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 18px;font-weight:700;display:inline-flex}.btn:active{transform:translateY(1px)}.btn-gold{background:var(--gold);color:var(--c-on-accent)}.btn-gold:hover{background:var(--gold-glow)}.btn-line{border:1px solid color-mix(in oklab, var(--gold) 55%, transparent);color:var(--c-ink)}.btn-line:hover{background:color-mix(in oklab, var(--gold) 12%, transparent)}.form{gap:14px;display:grid}.field{gap:6px;display:grid}.field label,.legend{font-size:14px;font-weight:700}.input{background:var(--night);width:100%;min-height:48px;color:var(--c-ink);border:1px solid color-mix(in oklab, var(--gold) 28%, transparent);border-radius:var(--radius);padding:10px 14px}.input:focus-visible{outline:2px solid var(--gold);outline-offset:1px}textarea.input{resize:vertical;min-height:84px}.choice{flex-wrap:wrap;gap:8px;display:flex}.choice label{position:relative}.choice input{opacity:0;position:absolute;inset:0}.choice span{border:1px solid color-mix(in oklab, var(--gold) 34%, transparent);cursor:pointer;border-radius:999px;align-items:center;min-height:44px;padding:0 16px;display:inline-flex}.choice input:checked+span{background:var(--gold);color:var(--c-on-accent);border-color:var(--gold)}.choice input:focus-visible+span{outline:2px solid var(--gold);outline-offset:3px}.wishes{display:grid}.wish{border-top:1px solid color-mix(in oklab, var(--gold) 14%, transparent);padding:14px 0}.wish .who{align-items:center;gap:10px;margin-bottom:6px;display:flex}.wish .ini{border:1px solid var(--gold);width:36px;height:36px;color:var(--gold);font-family:var(--ff-display), serif;border-radius:50%;flex:none;place-items:center;font-size:14px;display:grid}.wish blockquote{font-size:16px;line-height:1.55}.wakil{display:grid}.wakil li{border-top:1px solid color-mix(in oklab, var(--gold) 16%, transparent);gap:6px;padding:16px 0;display:grid}.salam-in{align-items:flex-start}.qr{background:var(--c-ink);border:1px solid var(--gold);outline:1px solid color-mix(in oklab, var(--gold) 40%, transparent);outline-offset:5px;width:min(200px,56cqw);padding:14px}.qr svg{width:100%;height:auto;color:var(--night);display:block}.dl{width:100%;display:grid}.dl>div{border-top:1px solid color-mix(in oklab, var(--gold) 16%, transparent);grid-template-columns:70px minmax(0,1fr);gap:12px;padding:10px 0;display:grid}.dl dt{font-family:var(--ff-display), serif;color:var(--gold)}.close-in{text-align:center;align-items:center}.doa{font-family:var(--ff-arab), serif;color:var(--gold);font-size:clamp(22px,6.6cqw,30px);line-height:1.9}.jawi-close{font-family:var(--ff-jawi), serif;color:var(--gold);margin-top:10px;font-size:clamp(44px,15cqw,70px);line-height:1.3}.thanks{font-family:var(--ff-display), serif;font-size:clamp(24px,7cqw,32px)}.album-bar{z-index:10;padding:26px 12px calc(12px + env(safe-area-inset-bottom,0px));border-radius:0 0 var(--card-radius) 0;background:linear-gradient(#0000,oklch(11% .025 345/.92) 45%);align-items:center;gap:8px;position:absolute;bottom:0;left:14px;right:0}.bar-btn{border:1px solid color-mix(in oklab, var(--gold) 45%, transparent);width:44px;height:44px;color:var(--gold);transition:background var(--dur-quick) var(--ease-out);border-radius:50%;flex:none;place-items:center;display:grid}.bar-btn:hover{background:color-mix(in oklab, var(--gold) 14%, transparent)}.bar-btn:disabled{opacity:.3}.bar-btn svg{width:20px;height:20px}.bar-count{text-align:center;letter-spacing:.12em;color:var(--c-muted);flex:auto;font-size:13px}.bar-rsvp{background:var(--gold);min-height:44px;color:var(--c-on-accent);border-radius:999px;align-items:center;padding:0 16px;font-size:14px;font-weight:700;display:inline-flex}.eq{align-items:end;gap:2px;height:18px;display:inline-flex}.eq i{background:currentColor;border-radius:1px;width:3px;height:30%}.music[aria-pressed=true] .eq i{animation:eq .9s var(--ease-inout) infinite alternate}.music[aria-pressed=true] .eq i:nth-child(2){animation-duration:.7s;animation-delay:-300ms}.music[aria-pressed=true] .eq i:nth-child(3){animation-duration:1.1s;animation-delay:-600ms}.music[aria-pressed=true] .eq i:nth-child(4){animation-delay:-150ms}@keyframes eq{0%{height:20%}to{height:100%}}@media (prefers-reduced-motion:reduce){.music .eq i{height:60%;animation:none!important}}.scene--footer{background:var(--c-bg)}.scene--footer>footer{padding:40px 18px 110px 30px}.studio{gap:12px;padding:0 0 24px;display:grid}html:not(.is-story) .studio{max-width:640px;margin-inline:auto;padding:48px 20px}.studio-name{font-family:var(--ff-display), serif;color:var(--gold);font-size:28px}.scene--footer [data-demo-footer]{margin-top:12px}.scene--footer footer>div>div{max-width:none;padding-bottom:24px!important}}
