/* no blue flash when tapping a link or button on phones (Android Chrome's tap highlight) */
*,*::before,*::after{-webkit-tap-highlight-color:transparent}
/* Dil Se Invite — demo kit base (each demo sets --kit-* tokens) */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,canvas{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
input,select,textarea{font:inherit;color:inherit}
a{color:inherit}
[hidden]{display:none!important}
.locked{overflow:hidden}
.rv{opacity:0;transform:translateY(26px);transition:opacity 1s cubic-bezier(.2,.7,.1,1),transform 1s cubic-bezier(.2,.7,.1,1)}
.rv.in{opacity:1;transform:none}

.kit-badge{position:fixed;left:12px;top:12px;z-index:60;font:700 10px/1 Manrope,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:9px 11px;border-radius:999px;
  background:rgba(12,10,10,.62);color:#fff;text-decoration:none;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);white-space:nowrap}

.kit-dock{position:fixed;left:50%;bottom:14px;z-index:55;display:flex;gap:6px;padding:6px;border-radius:999px;transform:translate(-50%,150%);
  background:var(--kit-dock-bg,rgba(15,12,12,.8));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 18px 40px -14px rgba(0,0,0,.55);
  transition:transform .7s cubic-bezier(.2,.7,.1,1);margin-bottom:env(safe-area-inset-bottom);font-family:Manrope,system-ui,sans-serif}
.kit-dock.on{transform:translate(-50%,0)}
.kit-dock a,.kit-dock button{min-height:46px;padding:0 15px;border-radius:999px;display:inline-flex;align-items:center;gap:8px;color:var(--kit-dock-fg,#fff);font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap}
.kit-dock .pri{background:var(--kit-accent,#C71928);color:var(--kit-accent-fg,#fff)}
.kit-dock svg{width:17px;height:17px;flex:none;max-width:none}
.kit-eq{display:flex;gap:2px;align-items:flex-end;height:14px}
.kit-eq i{width:3px;height:30%;background:currentColor;border-radius:2px}
.playing .kit-eq i{animation:kitEq .9s ease-in-out infinite}
.kit-eq i:nth-child(2){animation-delay:-.3s}.kit-eq i:nth-child(3){animation-delay:-.6s}
@keyframes kitEq{50%{height:100%}}

.kit-toast{position:fixed;left:50%;bottom:84px;z-index:90;transform:translate(-50%,16px);opacity:0;background:#141010;color:#fff;font:600 13px/1.3 Manrope,system-ui,sans-serif;padding:10px 16px;border-radius:999px;transition:all .4s;pointer-events:none;white-space:nowrap}
.kit-toast.show{opacity:1;transform:translate(-50%,0)}

.kit-credit{background:#120C0C;color:rgba(255,255,255,.78);text-align:center;padding:40px 22px 120px;font:14px/1.6 Manrope,system-ui,sans-serif}
.kit-credit img{width:46px;margin:0 auto 12px}
.kit-credit a{color:#fff;font-weight:700}
.kit-credit .kit-cta{display:inline-flex;margin-top:18px;min-height:50px;align-items:center;padding:0 24px;border-radius:999px;background:#C71928;color:#fff;text-decoration:none}
.kit-credit small{display:block;margin-top:14px;opacity:.6;font-size:12px}
.kit-skip{position:absolute;right:16px;bottom:18px;z-index:5;font:600 12px Manrope,system-ui,sans-serif;opacity:.7;text-decoration:underline;color:inherit}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.rv{opacity:1;transform:none}}
.kit-wa{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:14px;min-height:46px;padding:0 20px;border-radius:999px;background:#25D366;color:#fff !important;font:700 14px Manrope,system-ui,sans-serif;text-decoration:none}
.kit-wa-auto{animation:kitWaPulse 1.6s ease-in-out infinite}
@keyframes kitWaPulse{0%,100%{box-shadow:0 0 0 0 rgba(37,211,102,.5)}50%{box-shadow:0 0 0 10px rgba(37,211,102,0)}}
.kit-wa-note{display:block;margin-top:8px;font:600 12.5px Manrope,system-ui,sans-serif;opacity:.75}

/* ---------------- scratch-to-reveal date (Wed.scratchDate) ---------------- */
/* A design themes it with --sd-* tokens; the markup is built by the runtime. */
.sd{
  /* the card dresses itself in the design's own tokens, whichever naming it uses */
  --sd-card:var(--card,var(--bg,#fff));
  --sd-ink:var(--ink,currentColor);
  --sd-accent:var(--accent-2,var(--gold,var(--accent,#C9A36A)));
  --sd-radius:var(--rad,var(--radius,18px));
  --sd-font:var(--f-d,var(--display,Georgia,serif));
  --sd-sans:var(--f-b,var(--sans,system-ui));
  display:grid;justify-items:center;gap:22px;margin:26px auto 0;
  /* a definite width, so the card still has a size inside a shrink-to-fit parent */
  width:min(520px,100%);max-width:520px}
.sd-card{position:relative;width:100%;aspect-ratio:16/9;min-height:190px;border-radius:var(--sd-radius);overflow:hidden;
  background:var(--sd-card);box-shadow:0 26px 60px -30px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.06);touch-action:none;isolation:isolate}
.sd-under{position:absolute;inset:0;display:grid;align-content:center;justify-items:center;gap:6px;padding:18px;text-align:center;color:var(--sd-ink)}
.sd-day{font:700 11px/1 var(--sd-sans,var(--sans,system-ui));letter-spacing:.34em;text-transform:uppercase;opacity:.62}
.sd-date{font-family:var(--sd-font,var(--display,Georgia,serif));font-size:clamp(28px,7.4vw,44px);line-height:1.1;letter-spacing:.02em}
.sd-time{font:600 12.5px/1.5 var(--sd-sans,var(--sans,system-ui));letter-spacing:.14em;text-transform:uppercase;opacity:.72}
.sd-rule{width:54px;height:1px;background:var(--sd-accent);opacity:.7;margin:2px 0}
.sd-foil,.sd-dust{position:absolute;inset:0;width:100%;height:100%}
.sd-foil{cursor:crosshair;transition:opacity .7s ease,filter .7s ease}
.sd-dust{pointer-events:none}
.sd-hint{position:absolute;left:0;right:0;bottom:12px;text-align:center;pointer-events:none;
  font:700 10.5px/1 var(--sd-sans,var(--sans,system-ui));letter-spacing:.22em;text-transform:uppercase;
  color:var(--sd-hint,rgba(255,255,255,.92));text-shadow:var(--sd-hint-shadow,0 1px 6px rgba(0,0,0,.4));transition:opacity .4s}
.sd-tool{position:absolute;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;pointer-events:none;opacity:0;transition:opacity .25s;
  background:radial-gradient(circle at 34% 30%,#FBEFCB,#D7B269 46%,#8E6A2C);box-shadow:0 6px 16px -4px rgba(0,0,0,.5),inset 0 0 0 2px rgba(255,255,255,.35);
  display:grid;place-items:center;font:800 15px/1 var(--sd-sans,var(--sans,system-ui));color:#6B4E1E}
.sd-card.touching .sd-tool{opacity:1}
.sd-card.done .sd-foil{opacity:0!important;filter:blur(6px);pointer-events:none}
.sd-card.done .sd-hint{opacity:0!important}
.sd-card.done .sd-under{animation:sdIn .9s cubic-bezier(.2,.7,.1,1) both}
@keyframes sdIn{from{opacity:.2;transform:scale(.94)}to{opacity:1;transform:none}}
.sd-reveal{font:600 12px/1 var(--sd-sans,var(--sans,system-ui));text-decoration:underline;opacity:.62;letter-spacing:.04em}
.sd-reveal:hover{opacity:1}
.sd .sd-count{opacity:0;transform:translateY(14px);max-height:0;overflow:hidden;margin-top:0;
  transition:opacity .8s var(--ease,ease),transform .8s var(--ease,ease),max-height .8s var(--ease,ease)}
.sd.open .sd-count{opacity:1!important;transform:none!important;max-height:420px!important;visibility:visible!important}
@media (prefers-reduced-motion:reduce){.sd-card.done .sd-under{animation:none}.sd .sd-count{opacity:1;transform:none}}
.sd-secret{letter-spacing:.42em;opacity:.55;transition:opacity .6s}

/* the words on the foil, tuned to each material */
.sd-card[data-mat="gold"]{--sd-hint:rgba(58,38,12,.74);--sd-hint-shadow:0 1px 4px rgba(255,248,226,.5)}
.sd-card[data-mat="haldi"]{--sd-hint:rgba(58,42,5,.8);--sd-hint-shadow:0 1px 4px rgba(255,240,184,.55)}
.sd-card[data-mat="rangoli"]{--sd-hint:#fff;--sd-hint-shadow:0 1px 6px rgba(0,0,0,.55)}
.sd-card[data-mat="frost"]{--sd-hint:rgba(24,48,68,.72);--sd-hint-shadow:0 1px 4px rgba(255,255,255,.7)}
.sd-card[data-mat="confetti"]{--sd-hint:rgba(40,20,60,.8);--sd-hint-shadow:0 1px 5px rgba(255,255,255,.65)}
.sd-card[data-mat="gulal"]{--sd-hint:rgba(74,40,92,.85);--sd-hint-shadow:0 1px 5px rgba(255,255,255,.8)}
.sd-card[data-mat="kumkum"]{--sd-hint:#FFF4D6;--sd-hint-shadow:0 1px 6px rgba(60,0,8,.6)}
.sd-card[data-mat="petals"]{--sd-hint:#FFF8EE;--sd-hint-shadow:0 1px 6px rgba(70,0,14,.75)}
.sd-card[data-mat="giftwrap"]{--sd-hint:#F7E6B5;--sd-hint-shadow:0 1px 6px rgba(0,20,14,.85)}
.sd-card[data-mat="salt"]{--sd-hint:#1B2A4A;--sd-hint-shadow:0 1px 6px rgba(255,255,255,.95)}
.sd-card[data-mat="stamps"]{--sd-hint:#FFF6E2;--sd-hint-shadow:0 1px 6px rgba(50,10,10,.9)}
.sd-card.done .sd-under{opacity:1!important}
/* ---- photo gallery (K.gallery) — small thumbnails, full-screen viewer ---- */
.kg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kg-gap,6px);max-width:var(--kg-max,880px);margin:0 auto;padding:0 var(--kg-pad,16px)}
@media (min-width:700px){.kg{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--kg-gap-l,10px)}}
.kg-i{position:relative;display:block;padding:0;margin:0;border:0;background:var(--kg-bg,rgba(0,0,0,.06));aspect-ratio:1/1;overflow:hidden;border-radius:var(--kg-radius,10px);cursor:zoom-in;box-shadow:var(--kg-shadow,none);-webkit-tap-highlight-color:transparent}
.kg-i img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.kg-i:hover img{transform:scale(1.05)}
.kg-i span{position:absolute;left:0;right:0;bottom:0;padding:18px 8px 6px;font:600 11px/1.3 Manrope,system-ui,sans-serif;color:#fff;text-align:left;background:linear-gradient(transparent,rgba(0,0,0,.6));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kg-i:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.kg-lb{position:fixed;inset:0;z-index:2147483000;background:rgba(10,8,8,.94);display:grid;place-items:center;opacity:0;transition:opacity .2s;touch-action:pan-y}
.kg-lb.on{opacity:1}
.kg-stage{position:absolute;inset:56px 12px 84px;display:grid;place-items:center}
.kg-stage img{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.kg-x,.kg-p,.kg-n{position:absolute;border:0;background:rgba(255,255,255,.12);color:#fff;border-radius:50%;width:44px;height:44px;font:300 30px/1 system-ui,sans-serif;display:grid;place-items:center;cursor:pointer;-webkit-tap-highlight-color:transparent}
.kg-x{top:10px;right:10px}
.kg-p{left:10px;top:50%;margin-top:-22px}.kg-n{right:10px;top:50%;margin-top:-22px}
.kg-p[hidden],.kg-n[hidden]{display:none}
.kg-cap{position:absolute;left:16px;right:16px;bottom:18px;text-align:center;color:#fff;font:600 14px/1.4 Manrope,system-ui,sans-serif}
.kg-cap small{display:block;margin-top:4px;opacity:.65;font-size:12px;letter-spacing:.08em}
@media (max-width:600px){.kg-p,.kg-n{top:auto;bottom:14px;margin:0}.kg-cap{left:64px;right:64px}}
/* ---- signature gallery (K.showcase) — big framed photos arriving one by one ---- */
.sg{display:grid;gap:var(--sg-gap,64px);max-width:var(--sg-max,470px);margin:0 auto;padding:10px var(--sg-pad,22px) 20px}
.sg-i{margin:0;width:var(--sg-w,92%);opacity:0;transform:translateY(80px) scale(.9) rotate(var(--sg-from,-4deg));transition:opacity 1s ease,transform 1.3s cubic-bezier(.16,.84,.24,1)}
.sg-i:nth-child(odd){justify-self:start}.sg-i:nth-child(even){justify-self:end;--sg-from:4deg}
.sg-i.on{opacity:1;transform:translateY(0) scale(1) rotate(var(--sg-rest,-1.2deg))}
.sg-i.on:nth-child(even){--sg-rest:1.2deg}
.sg-f{position:relative;display:block;width:100%;padding:var(--sg-frame-pad,0);margin:0;border:0;background:var(--sg-frame-bg,transparent);cursor:zoom-in;box-shadow:var(--sg-shadow,0 30px 60px -28px rgba(0,0,0,.55));border-radius:var(--sg-frame-radius,0);-webkit-tap-highlight-color:transparent;transition:transform .5s ease}
.sg-f:hover{transform:translateY(-4px)}
.sg-f:focus-visible{outline:2px solid currentColor;outline-offset:6px}
.sg-p{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:var(--sg-mat-bg,#111);border:var(--sg-mat,0 solid transparent);border-radius:var(--sg-photo-radius,0);box-shadow:var(--sg-inner,none)}
.sg-p img{position:absolute;left:0;top:-9%;width:100%;height:118%;object-fit:cover;display:block;clip-path:var(--sg-clip-from,inset(0 50% 0 50%));transform:translateY(var(--py,0)) scale(1.12);filter:var(--sg-filter-from,none);transition:clip-path 1.5s .2s cubic-bezier(.7,0,.2,1),transform 2.4s .2s cubic-bezier(.16,.84,.24,1),filter 2s .5s ease}
.sg-i.on .sg-p img{clip-path:var(--sg-clip-to,inset(0));transform:translateY(var(--py,0)) scale(1);filter:var(--sg-filter,none)}
.sg-i figcaption{display:flex;align-items:baseline;gap:12px;justify-content:center;margin-top:var(--sg-cap-gap,20px);font:var(--sg-cap-font,italic 500 19px/1.3 Georgia,serif);color:var(--sg-cap-color,inherit);opacity:0;transform:translateY(12px);transition:opacity .9s 1.1s ease,transform .9s 1.1s ease;text-align:center}
.sg-i figcaption b{white-space:nowrap;flex:none;font:var(--sg-num-font,700 11px/1 Manrope,system-ui,sans-serif);letter-spacing:.24em;color:var(--sg-num-color,currentColor);opacity:.75}
.sg-i.on figcaption{opacity:1;transform:none}
.sg-c1,.sg-c2{position:absolute;pointer-events:none;display:var(--sg-corners,none)}
/* frame artwork: a 4:5 frame image laid over the photo; --fr-in is its opening (top/bottom, left/right) */
.sg-art .sg-f{padding:0;background:none;box-shadow:none;aspect-ratio:4/5}
.sg-art .sg-p{position:absolute;inset:var(--fr-in,11% 12%);aspect-ratio:auto;border:0;box-shadow:none}
.sg-art .sg-fr{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none;filter:drop-shadow(0 24px 30px rgba(0,0,0,.35))}
@media (min-width:900px){
  .sg{max-width:var(--sg-max-l,960px);grid-template-columns:1fr 1fr;column-gap:var(--sg-col-gap,70px);row-gap:var(--sg-gap-l,40px)}
  .sg-i,.sg-i:nth-child(even){width:100%;justify-self:stretch}
  .sg-i:nth-child(even){margin-top:var(--sg-stagger,150px)}
}
@media (prefers-reduced-motion:reduce){.sg-i,.sg-i figcaption,.sg-p img{transition:none!important}}
/* demo pages — "I want this design" */
.kit-want{position:fixed;right:14px;bottom:calc(92px + env(safe-area-inset-bottom));z-index:2147482000;display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 18px;border-radius:999px;background:#C71928;color:#fff!important;font:800 13.5px/1 Manrope,system-ui,sans-serif;letter-spacing:.02em;text-decoration:none;box-shadow:0 14px 34px -10px rgba(199,25,40,.65),0 0 0 3px rgba(255,255,255,.22);opacity:0;transform:translateY(16px) scale(.96);pointer-events:none;transition:opacity .4s ease,transform .5s cubic-bezier(.2,.9,.3,1.3)}
.kit-want.on{opacity:1;transform:none;pointer-events:auto}
.kit-want span{font-size:16px;animation:kitBeat 1.6s ease-in-out infinite}
@keyframes kitBeat{0%,100%{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(1)}45%{transform:scale(1.18)}}
@media (min-width:900px){.kit-want{bottom:28px;right:28px;min-height:52px;padding:0 24px;font-size:14.5px}}
@media (prefers-reduced-motion:reduce){.kit-want span{animation:none}}

/* ---- personal guest invitation (opened from a guest's own link) ---- */
.kit-hello{position:fixed;inset:0;z-index:2147481000;display:grid;place-items:center;padding:20px;background:rgba(14,10,8,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  animation:khIn .7s ease both;transition:opacity .8s ease,visibility .8s}
.kit-hello.out{opacity:0;visibility:hidden}
.kit-hello.out .kh-card{transform:translateY(-14px) scale(.97)}
@keyframes khIn{from{opacity:0}}
.kh-card{position:relative;width:min(100%,400px);padding:34px 26px 26px;text-align:center;color:#2A211C;border-radius:4px;
  background:radial-gradient(120% 90% at 50% 0%,#FFFDF8,#F6EEDF 70%,#EFE3CC);
  box-shadow:0 30px 70px -20px rgba(0,0,0,.65),inset 0 0 0 1px rgba(176,138,68,.55),inset 0 0 0 7px #FBF5EA,inset 0 0 0 8px rgba(176,138,68,.4);
  transition:transform .8s cubic-bezier(.3,.8,.3,1);animation:khCard .9s cubic-bezier(.2,.8,.2,1) .1s both}
@keyframes khCard{from{opacity:0;transform:translateY(24px) scale(.96)}}
.kh-card small{display:block;font:700 10.5px/1.4 Manrope,system-ui,sans-serif;letter-spacing:.26em;text-transform:uppercase;color:#A07D3B}
.kh-card em{display:block;margin-top:14px;font-family:var(--f-s,"Pinyon Script"),cursive;font-style:normal;font-size:32px;line-height:1;color:#A07D3B}
.kh-card b{display:block;margin-top:4px;font-family:var(--f-d,Georgia),Georgia,serif;font-weight:500;font-size:clamp(30px,8.4vw,40px);line-height:1.12;color:var(--accent,#7A1F24);overflow-wrap:anywhere}
.kh-rule{display:block;width:120px;height:1px;margin:16px auto 12px;background:linear-gradient(90deg,transparent,#B08A44,transparent)}
.kh-card p{margin:0;font-family:var(--f-b,Georgia),Georgia,serif;font-style:italic;font-size:19px;line-height:1.35;color:#4A3D33}
.kh-names{display:block;margin-top:8px;font:600 12px/1.4 Manrope,system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#6E6058}
.kh-card button{margin-top:22px;min-height:48px;padding:0 26px;border:0;border-radius:999px;cursor:pointer;font:700 13px Manrope,system-ui,sans-serif;letter-spacing:.06em;color:#fff;
  background:var(--accent,#7A1F24);box-shadow:0 12px 24px -10px rgba(0,0,0,.5)}
.kh-card button:focus-visible{outline:3px solid #B08A44;outline-offset:3px}
.kit-dear{margin:0 0 8px;font-family:var(--f-s,"Pinyon Script"),var(--f-d,Georgia),cursive;font-size:clamp(22px,5.4vw,30px);line-height:1.2;opacity:.95;text-transform:none;letter-spacing:0}
.kit-dear-op{font-size:clamp(20px,5vw,26px);margin-bottom:4px}
.kit-seat{max-width:520px;margin:18px auto 0;text-align:center;font-size:17px;line-height:1.5}
.kit-seat b{font-weight:700}
@media (prefers-reduced-motion:reduce){.kit-hello,.kh-card{animation:none}}