/*
 * The Ink Flow — styles.
 *
 * A fashion-editorial luxury paper invitation: no card, no room — one
 * continuous sheet of paper (fixed, shared by the gate and the
 * invitation) that a single flowing stream of ink writes into. The three
 * admin theme colors (--primary paper tone, --secondary ink tone, --accent
 * champagne-gold foil) tint every layer.
 *
 * Interaction sequence, driven by classes from script.js — note the ORDER
 * here is deliberately inverted from Digital Signature / The Message in
 * Light: the tap happens FIRST, on an almost-empty page, and the writing
 * happens automatically AFTER it (per the brief's own sequence: touch ->
 * ink begins -> ink writes the message -> complete invitation):
 *   (tap the ink drop) -> .is-opened (permanent — hides the "Touch to
 *           Begin" cue for good, but NOT the drop itself, which is still
 *           mid-animation)
 *        -> .is-landing (the drop deforms as it lands)
 *        -> .is-spreading (it spreads into an organic, non-circular blob)
 *        -> .is-drawn (the blob settles into a faint dried stain; the
 *           couple's names begin writing themselves, then "You Are
 *           Cordially Invited")
 *        -> .is-lit (settled: the gate fades away entirely; the paper
 *           continues underneath, unbroken, into the full invitation).
 */

:root{
	--ink-paper:var(--primary);
	--ink-ink:var(--secondary);
	--ink-ink-dim:color-mix(in srgb, var(--ink-ink) 66%, transparent);

	--ink-gold:var(--accent);
	--ink-gold-soft:color-mix(in srgb, var(--accent) 55%, #fff 45%);
	--ink-gold-deep:color-mix(in srgb, var(--accent) 68%, #3a2a0c 32%);

	--ink-rose:#c98a95;

	--ink-ease:cubic-bezier(.22,.61,.36,1);
	--ink-ease-luxe:cubic-bezier(.16,.68,.28,1);
}

*{ box-sizing:border-box; }
html,body{ margin:0; }

.ink-body{
	background:var(--ink-paper);
	color:var(--ink-ink);
	font-family:var(--ink-font-sans);
	font-size:16px; line-height:1.75;
	-webkit-tap-highlight-color:transparent;
	overflow-x:hidden;
}
.ink-body.ink-locked{ overflow:hidden; height:100vh; }

/* ===================== The paper (continuous, fixed) ===================== */
.ink-paper{ position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; background:var(--ink-paper); }
.ink-paper-grain{ position:absolute; inset:0; filter:url(#inkPaperGrain); mix-blend-mode:overlay; opacity:0.7; }
.ink-paper-fiber{ position:absolute; inset:0; filter:url(#inkFiberGrain); mix-blend-mode:multiply; opacity:0.4; }
.ink-paper-vignette{ position:absolute; inset:0; box-shadow:inset 0 0 22vw color-mix(in srgb, var(--ink-ink) 10%, transparent); }

.ink-petals{ position:fixed; inset:0; z-index:6; pointer-events:none; overflow:hidden; }
.ink-petal{ position:absolute; top:-4%; width:8px; height:12px; border-radius:70% 10% 70% 10%; background:var(--ink-rose); opacity:0; }
@keyframes inkPetalFall{ 0%{ transform:translate(0,0) rotate(0deg); opacity:0; } 8%{ opacity:var(--op,0.4); } 100%{ transform:translate(var(--drift,0), 112vh) rotate(var(--spin,140deg)); opacity:0; } }

/* ===================== The gate ===================== */
.ink-gate{ position:fixed; inset:0; z-index:20; display:flex; align-items:center; justify-content:center; overflow:hidden; transition:opacity 1s ease; }
.ink-body.is-lit .ink-gate{ opacity:0; pointer-events:none; }

.ink-gate-inner{ position:relative; z-index:2; width:min(560px,92vw); display:flex; flex-direction:column; align-items:center; text-align:center; }

.ink-gate-sub{ font-family:var(--ink-font-sans); font-size:11px; letter-spacing:0.3em; text-transform:uppercase; color:var(--ink-ink-dim); opacity:0; transform:translateY(8px); animation:inkFadeUp 1s var(--ink-ease) forwards; animation-delay:0.2s; }
@keyframes inkFadeUp{ to{ opacity:1; transform:none; } }

/* The ink drop / blob — the ONE interaction target. */
.ink-drop-btn{ position:relative; z-index:2; display:block; width:104px; height:104px; margin:22px auto 0; padding:0; border:0; background:transparent; cursor:pointer; touch-action:manipulation; }
.ink-drop-svg{ width:100%; height:100%; overflow:visible; }
.ink-drop-shape{ fill:var(--ink-ink); transform-box:fill-box; transform-origin:center; transition:opacity 0.35s ease, transform 0.3s ease; }
.ink-blob-shape{ fill:var(--ink-ink); opacity:0; transform-box:fill-box; transform-origin:center; transform:scale(0.55); filter:url(#inkBlobEdge); transition:opacity 0.7s ease, transform 1s var(--ink-ease-luxe); }
.ink-body.is-landing .ink-drop-shape{ transform:scale(1.18,0.72); }
.ink-body.is-spreading .ink-drop-shape,.ink-body.is-drawn .ink-drop-shape{ opacity:0; }
.ink-body.is-spreading .ink-blob-shape,.ink-body.is-drawn .ink-blob-shape{ opacity:1; transform:scale(1); }
.ink-body.is-drawn .ink-blob-shape{ opacity:0.07; transform:scale(1.1); transition:opacity 1.4s ease, transform 1.4s var(--ink-ease-luxe); }
.ink-body.is-drawn .ink-drop-btn{ pointer-events:none; }

.ink-drop-halo{ position:absolute; inset:-16%; border-radius:50%; border:1px solid color-mix(in srgb, var(--ink-gold) 55%, transparent); opacity:0.5; animation:inkHaloPulse 2.4s ease-in-out infinite; animation-delay:1s; pointer-events:none; }
@keyframes inkHaloPulse{ 0%,100%{ transform:scale(1); opacity:0.5; } 50%{ transform:scale(1.14); opacity:0.05; } }
.ink-drop-btn:focus-visible{ outline:2px solid var(--ink-gold); outline-offset:8px; border-radius:50%; }

.ink-touch-hint{ margin-top:14px; font-family:var(--ink-font-sans); font-size:11px; letter-spacing:0.24em; text-transform:uppercase; color:var(--ink-gold-deep); opacity:0; animation:inkFadeUp 1s var(--ink-ease) 1s forwards; }
.ink-body.is-opened .ink-touch-hint, .ink-body.is-opened .ink-drop-halo{ opacity:0 !important; pointer-events:none; transition:opacity 0.4s ease; animation:none; }

.ink-gate-writing{ margin-top:8px; display:flex; flex-direction:column; align-items:center; text-align:center; width:100%; }

/* ===================== "Written in ink" (shared: gate + closing) ===================== */
.ink-write{ position:relative; display:inline-block; margin-top:14px; }
.ink-write-text{ position:relative; z-index:1; display:block; color:var(--ink-ink); white-space:nowrap; }
.ink-write-veil{ position:absolute; top:0; bottom:0; right:-2%; z-index:2; width:104%; background:var(--ink-paper); transition:width 1.6s var(--ink-ease-luxe); }
.ink-write-point{ position:absolute; top:10%; left:0; z-index:3; width:8px; height:8px; margin-left:-4px; border-radius:50%; background:radial-gradient(circle at 35% 30%, rgba(255,255,255,0.7), var(--ink-ink) 62%); box-shadow:0 1px 3px rgba(0,0,0,0.35); opacity:0; transition:left 1.6s var(--ink-ease-luxe), opacity 0.25s ease; }
.ink-write.is-writing .ink-write-veil{ width:0%; }
.ink-write.is-writing .ink-write-point{ left:100%; opacity:1; }
.ink-write.is-written .ink-write-point{ opacity:0; transition:opacity 0.4s ease; }

.ink-gate-names .ink-write-text{ font-family:var(--ink-font-script); font-size:clamp(30px,7vw,48px); }
.ink-gate-invited{ margin-top:20px; }
.ink-gate-invited .ink-write-text{ font-family:var(--ink-font-display); font-weight:600; letter-spacing:0.08em; font-size:clamp(16px,3.6vw,22px); text-transform:uppercase; }
.ink-gate-celebrate{ margin-top:4px; }
.ink-gate-celebrate .ink-write-text{ font-family:var(--ink-font-sans); font-style:italic; font-size:14px; letter-spacing:0.05em; color:var(--ink-ink-dim); }

.ink-close-love .ink-write-text{ font-family:var(--ink-font-sans); font-style:italic; font-size:15px; text-transform:uppercase; letter-spacing:0.18em; color:var(--ink-ink-dim); }
.ink-close-names{ margin-top:10px; }
.ink-close-names .ink-write-text{ font-family:var(--ink-font-script); font-size:clamp(28px,6vw,42px); }

/* ===================== Ink stroke primitive (bleed + crisp) ===================== */
.ink-stroke-bleed{ fill:none; stroke:var(--ink-ink); stroke-width:5; stroke-linecap:round; stroke-linejoin:round; opacity:0.1; filter:blur(1.3px); }
.ink-stroke-crisp{ fill:none; stroke:var(--ink-ink); stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }

/* The name flourish is the one stroke that draws itself on cue (right
   after the names finish writing) — everything else is pre-drawn. */
.ink-flourish{ display:block; width:min(180px,66%); height:20px; margin:2px auto 0; overflow:visible; }
.ink-flourish .ink-stroke-bleed, .ink-flourish .ink-stroke-crisp{ stroke-dasharray:340; stroke-dashoffset:340; transition:stroke-dashoffset 0.9s ease-out; }
.ink-flourish .ink-stroke-crisp{ transition-delay:0.05s; }
#ink-gate-names.is-written + .ink-gate-flourish .ink-stroke-bleed, #ink-gate-names.is-written + .ink-gate-flourish .ink-stroke-crisp,
#ink-close-names.is-written + .ink-close-flourish .ink-stroke-bleed, #ink-close-names.is-written + .ink-close-flourish .ink-stroke-crisp{ stroke-dashoffset:0; }

/* ===================== The invitation ===================== */
.ink-invite{ position:relative; z-index:10; opacity:0; transform:scale(0.98); transform-origin:top center; transition:opacity 1s ease, transform 1.1s var(--ink-ease); }
.ink-body.is-lit .ink-invite{ opacity:1; transform:scale(1); }

.ink-reveal{ opacity:0; transform:translateY(24px); transition:opacity 0.9s ease, transform 0.9s var(--ink-ease); }
.ink-reveal.is-visible{ opacity:1; transform:none; }

.ink-section{ position:relative; z-index:1; padding:70px 22px; display:flex; flex-direction:column; align-items:center; text-align:center; }
.ink-section-hero{ min-height:100vh; justify-content:center; padding-top:12vh; }
.ink-section-final{ padding:70px 22px 22vh; }

.ink-eyebrow{ font-family:var(--ink-font-sans); font-size:11px; letter-spacing:0.34em; text-transform:uppercase; color:var(--ink-gold-deep); }
.ink-subline{ margin-top:8px; font-size:14px; color:var(--ink-ink-dim); }
.ink-actions{ margin-top:20px; }

/* Hero */
.ink-hero-names{ margin-top:14px; font-family:var(--ink-font-display); font-weight:700; line-height:1.05; }
.ink-hn-line{ display:block; font-size:clamp(38px,9vw,66px); letter-spacing:0.03em; color:var(--ink-ink); }
.ink-hn-amp{ display:block; font-family:var(--ink-font-script); font-size:clamp(24px,5.4vw,34px); color:var(--ink-gold-deep); margin:2px 0; }
.ink-hero-rule{ display:block; width:min(200px,54vw); height:16px; margin:16px auto 0; overflow:visible; }
.ink-hero-request{ margin-top:20px; font-size:12px; letter-spacing:0.2em; text-transform:uppercase; color:var(--ink-ink-dim); }
.ink-hero-tagline{ margin-top:14px; max-width:420px; color:var(--ink-ink-dim); font-style:italic; font-size:15px; }
.ink-scroll-cue{ margin-top:32px; font-size:10.5px; letter-spacing:0.22em; text-transform:uppercase; color:var(--ink-gold-deep); }
.ink-scroll-cue span{ display:block; width:1px; height:28px; margin:0 auto 10px; background:linear-gradient(180deg, var(--ink-gold), transparent); animation:inkCueLine 2.6s ease-in-out infinite; }
@keyframes inkCueLine{ 0%,100%{ opacity:0.4; transform:scaleY(0.7); } 50%{ opacity:1; transform:scaleY(1); } }

/* Sealed stroke (scratch reveal) — circular to match the shared module's
   canvas clip (0.65 clear threshold), framed by two small ink botanicals. */
.ink-seal-frame{ position:relative; display:flex; align-items:center; justify-content:center; gap:14px; margin-top:8px; }
.ink-seal-botanical{ width:28px; height:44px; flex:0 0 auto; opacity:0.65; }
.ink-seal-botanical-l{ transform:scaleX(-1); }
.ink-seal-wrap{ position:relative; width:min(190px,58vw); aspect-ratio:1/1; border-radius:50%; flex:0 0 auto; }
.ink-seal-wrap.is-glowing{ box-shadow:0 0 44px -4px color-mix(in srgb, var(--ink-gold) 55%, transparent); }
.ink-seal-prize{ position:absolute; inset:0; border-radius:50%; overflow:hidden; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; text-align:center; padding:14px; border:1.5px solid var(--ink-gold-deep); box-shadow:0 0 0 5px color-mix(in srgb, var(--ink-gold) 10%, transparent); background:color-mix(in srgb, var(--primary) 96%, var(--secondary) 4%); color:var(--ink-ink); }
.ink-seal-label{ font-size:10px; letter-spacing:0.2em; text-transform:uppercase; color:var(--ink-gold-deep); opacity:0; transition:opacity 0.9s ease; }
.ink-seal-date{ font-family:var(--ink-font-display); font-weight:600; font-size:clamp(16px,4vw,20px); color:var(--ink-ink); opacity:0; transition:opacity 0.9s ease; }
.ink-seal-day{ font-size:11px; color:var(--ink-ink-dim); opacity:0; transition:opacity 0.9s ease; }
.ink-seal-wrap.ink-revealed .ink-seal-label, .ink-seal-wrap.ink-revealed .ink-seal-date, .ink-seal-wrap.ink-revealed .ink-seal-day{ opacity:1; }
.ink-seal-shimmer{ position:absolute; inset:0; border-radius:50%; z-index:3; pointer-events:none; background:linear-gradient(105deg, transparent 42%, rgba(255,255,255,0.5) 50%, transparent 58%); background-size:250% 100%; animation:inkShimmer 3.8s ease-in-out infinite; }
.ink-seal-shimmer.is-hidden{ opacity:0; }
@keyframes inkShimmer{ 0%{ background-position:120% 0; } 100%{ background-position:-120% 0; } }
.ink-seal-canvas{ position:absolute; inset:0; z-index:4; border-radius:50%; cursor:pointer; touch-action:none; transition:opacity 0.6s ease; }
.ink-seal-canvas.is-cleared{ opacity:0; pointer-events:none; }
.ink-hint{ margin-top:12px; font-size:11px; letter-spacing:0.2em; text-transform:uppercase; color:var(--ink-gold-deep); }

/* Save the Date — inside a hand-drawn gold ink ring, not a box */
.ink-date-block{ position:relative; width:200px; height:200px; max-width:80vw; max-height:80vw; margin:18px auto 0; display:flex; align-items:center; justify-content:center; }
.ink-date-ring{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.ink-date-ring .ink-stroke-bleed, .ink-date-ring .ink-stroke-crisp{ stroke:var(--ink-gold-deep); }
.ink-date-inner{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; }
.ink-date-day{ font-family:var(--ink-font-display); font-weight:700; font-size:clamp(52px,12vw,72px); line-height:0.9; color:var(--ink-ink); }
.ink-date-month{ margin-top:4px; font-size:12px; letter-spacing:0.3em; text-transform:uppercase; color:var(--ink-gold-deep); }
.ink-date-year{ margin-top:2px; font-family:var(--ink-font-display); font-style:italic; font-size:16px; color:var(--ink-ink-dim); }

/* Countdown — typographic only, thin gold dividers */
.ink-countdown{ display:flex; align-items:baseline; justify-content:center; gap:clamp(10px,3vw,20px); margin-top:26px; flex-wrap:wrap; }
.ink-cd{ display:flex; flex-direction:column; align-items:center; gap:2px; }
.ink-cd-num{ font-family:var(--ink-font-display); font-weight:700; font-size:clamp(22px,5vw,30px); color:var(--ink-ink); transition:transform 0.2s ease; }
.ink-cd-label{ font-size:9px; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-ink-dim); }
.ink-cd-div{ display:block; width:1px; height:24px; background:linear-gradient(180deg, transparent, var(--ink-gold-deep), transparent); }
.ink-countdown-passed{ margin-top:16px; font-family:var(--ink-font-display); font-style:italic; font-size:19px; color:var(--ink-gold-deep); }
.ink-countdown-passed[hidden]{ display:none; }

/* Venue */
.ink-venue-mark{ width:78px; height:60px; margin:6px 0 12px; }
.ink-venue-name{ font-family:var(--ink-font-display); font-weight:600; font-size:clamp(22px,5vw,28px); color:var(--ink-ink); }

/* Itinerary — one continuous hand-drawn ink stroke, not event cards */
.ink-timeline{ position:relative; display:flex; flex-direction:column; align-items:center; margin-top:8px; }
.ink-tl-stroke{ position:absolute; left:50%; top:0; bottom:0; width:20px; z-index:0; transform:translateX(-50%); overflow:visible; }
.ink-tl-item{ position:relative; z-index:1; padding:16px 0; }
.ink-tl-dot{ display:block; width:6px; height:6px; margin:0 auto 8px; border-radius:50%; background:var(--ink-ink); }
.ink-tl-name{ font-family:var(--ink-font-display); font-weight:600; font-size:19px; letter-spacing:0.05em; text-transform:uppercase; color:var(--ink-ink); }
.ink-tl-time{ margin-top:2px; font-size:13px; color:var(--ink-gold-deep); }
.ink-tl-venue{ margin-top:1px; font-size:12.5px; color:var(--ink-ink-dim); }

/* Our Story — a small hand-inked sprig, no card */
.ink-story{ position:relative; max-width:520px; margin-top:8px; padding-left:8px; text-align:left; }
.ink-story-botanical{ position:absolute; left:-38px; top:-4px; width:28px; height:44px; opacity:0.65; }
.ink-story-note{ display:block; margin-bottom:6px; font-family:var(--ink-font-script); font-size:16px; color:var(--ink-gold-deep); }
.ink-story-text{ color:var(--ink-ink-dim); font-size:15.5px; }
.ink-story-text + .ink-story-text{ margin-top:12px; }

/* Photographs — printed on paper, corner-inked rather than boxed */
.ink-photos{ display:flex; flex-wrap:wrap; gap:32px; justify-content:center; margin-top:8px; }
.ink-photo{ position:relative; margin:0; width:min(230px,80vw); transform:rotate(var(--tilt,0deg)); }
.ink-photo-corner{ position:absolute; left:-4px; top:-4px; width:26px; height:26px; border-left:1.5px solid var(--ink-ink); border-top:1.5px solid var(--ink-ink); opacity:0.65; }
.ink-photo img{ display:block; width:100%; aspect-ratio:4/5; object-fit:cover; box-shadow:0 16px 32px -20px rgba(0,0,0,0.3); filter:sepia(0.06) contrast(1.02); }
.ink-photo figcaption{ margin-top:10px; text-align:center; font-family:var(--ink-font-script); font-size:19px; color:var(--ink-gold-deep); }

/* RSVP */
.ink-rsvp-block{ width:min(420px,92vw); margin-top:8px; padding:26px 24px; border:1px solid color-mix(in srgb, var(--ink-gold-deep) 50%, transparent); }
.ink-rsvp-form{ text-align:left; }
.ink-rsvp-toggle{ display:flex; gap:8px; margin-bottom:14px; }
.ink-rsvp-choice{ flex:1; appearance:none; cursor:pointer; padding:11px 8px; border-radius:2px; border:1px solid color-mix(in srgb, var(--ink-gold-deep) 45%, transparent); background:transparent; color:var(--ink-ink-dim); font-family:var(--ink-font-sans); font-size:12px; letter-spacing:0.04em; transition:all 0.25s ease; }
.ink-rsvp-choice.is-active{ border-color:var(--ink-gold-deep); color:var(--ink-ink); background:color-mix(in srgb, var(--ink-gold) 12%, transparent); }
.ink-rsvp-field{ display:block; margin-bottom:12px; }
.ink-rsvp-field span{ display:block; font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-ink-dim); margin-bottom:5px; }
.ink-rsvp-field input,.ink-rsvp-field textarea{ width:100%; padding:10px 12px; border-radius:2px; font-family:var(--ink-font-sans); font-size:15px; color:var(--ink-ink); background:color-mix(in srgb, var(--primary) 92%, var(--secondary) 8%); border:1px solid color-mix(in srgb, var(--ink-gold-deep) 35%, transparent); transition:border-color 0.25s, box-shadow 0.25s; }
.ink-rsvp-field input:focus,.ink-rsvp-field textarea:focus{ outline:none; border-color:var(--ink-gold-deep); box-shadow:0 0 0 3px color-mix(in srgb, var(--ink-gold) 16%, transparent); }
.ink-rsvp-field textarea{ resize:vertical; min-height:64px; }
.ink-rsvp-status{ margin-top:12px; text-align:center; font-size:14px; min-height:20px; }
.ink-rsvp-status.is-success{ color:#4f8f5f; }
.ink-rsvp-status.is-error{ color:#b3564f; }
.ink-hashtag{ margin-top:18px; font-family:var(--ink-font-script); font-size:22px; color:var(--ink-gold-deep); }

/* Buttons — thin gold outline, an ink underline draws in on hover */
.ink-btn{ position:relative; display:inline-block; padding:12px 30px; border:1px solid var(--ink-gold-deep); background:transparent; color:var(--ink-ink); font-family:var(--ink-font-sans); font-size:11.5px; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; text-decoration:none; cursor:pointer; transition:background 0.3s ease; }
.ink-btn::after{ content:''; position:absolute; left:16px; right:16px; bottom:7px; height:1px; background:var(--ink-ink); transform:scaleX(0); transform-origin:left; transition:transform 0.4s var(--ink-ease); }
.ink-btn:hover::after{ transform:scaleX(1); }
.ink-btn:hover{ background:color-mix(in srgb, var(--ink-gold) 8%, transparent); }
.ink-btn-outline{ color:var(--ink-ink-dim); }
.ink-btn-lg{ padding:14px 36px; }
.ink-btn-block{ display:block; width:100%; text-align:center; }

/* Music button — bottom right, spins only while playing */
.ink-music-btn{ position:fixed; right:18px; bottom:18px; z-index:60; width:46px; height:46px; border-radius:50%; border:1px solid var(--ink-gold-deep); background:var(--ink-paper); color:var(--ink-gold-deep); display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:0; transform:translateY(12px); pointer-events:none; transition:opacity 0.5s ease, transform 0.5s ease, color 0.3s ease; box-shadow:0 8px 22px -12px rgba(0,0,0,0.25); }
.ink-music-btn.is-shown{ opacity:1; transform:none; pointer-events:auto; }
.ink-music-btn.is-playing{ color:var(--ink-gold); }
.ink-music-btn.is-playing svg{ animation:inkMusicSpin 6s linear infinite; }
@keyframes inkMusicSpin{ to{ transform:rotate(360deg); } }

/* Shared celebration — champagne gold + a few dusty-rose petals, no confetti */
.wcard-shared-spark{ position:fixed; z-index:1200; width:6px; height:6px; border-radius:50%; pointer-events:none; background:radial-gradient(circle, #fff 0 30%, var(--ink-gold) 75%, transparent); box-shadow:0 0 8px 2px color-mix(in srgb, var(--ink-gold) 60%, transparent); animation:inkSpark 0.9s ease-out forwards; }
@keyframes inkSpark{ 0%{ transform:translate(0,0) scale(1); opacity:1; } 100%{ transform:translate(var(--dx), var(--dy)) scale(0.2); opacity:0; } }
.wcard-shared-confetti{ position:fixed; z-index:1200; border-radius:50% !important; pointer-events:none; width:4px !important; height:4px !important; background:radial-gradient(circle, #fff 0 30%, var(--ink-gold) 75%, transparent) !important; box-shadow:0 0 6px 1px color-mix(in srgb, var(--ink-gold) 50%, transparent); animation-name:inkGoldFall; animation-timing-function:ease-out; animation-fill-mode:forwards; }
.wcard-shared-petal-burst{ position:fixed; z-index:1200; pointer-events:none; width:7px !important; height:10px !important; border-radius:70% 10% 70% 10% !important; background:var(--ink-rose) !important; opacity:0.75; animation-name:inkGoldFall; animation-timing-function:ease-out; animation-fill-mode:forwards; }
@keyframes inkGoldFall{ 0%{ transform:translate(0,0); opacity:0; } 12%{ opacity:0.9; } 100%{ transform:translate(var(--drift,0), calc(var(--fall,90vh) * -0.5)); opacity:0; } }

/* ===================== Responsive ===================== */
@media (max-width:760px){
	.ink-photos{ gap:22px; }
	.ink-date-block{ width:170px; height:170px; }
}
@media (max-width:480px){
	.ink-story-botanical{ display:none; }
	.ink-story{ padding-left:0; }
}
@media (max-width:420px){
	.ink-rsvp-block{ padding:22px 18px; }
	.ink-countdown{ gap:8px; }
	.ink-cd-num{ font-size:20px; }
}

@media (prefers-reduced-motion: reduce){
	*, *::before, *::after{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; animation-delay:0s !important; transition-duration:0.001ms !important; }
	.ink-reveal{ opacity:1; transform:none; }
	.ink-invite{ opacity:1; transform:none; }
	.ink-write-veil{ width:0 !important; }
	.ink-write-point{ opacity:0 !important; }
	.ink-flourish .ink-stroke-bleed, .ink-flourish .ink-stroke-crisp{ stroke-dashoffset:0 !important; }
}