/* Version 2 motion layer: source artwork and invitation copy stay in the HTML. */
#hero { isolation: isolate; }
.hero-video-crop { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
#hero-bg-video { inset: 0 auto auto 0; width: 100%; height: 114%; object-position: center top; opacity: .42; filter: brightness(.78) saturate(.95); }
body.light-theme #hero-bg-video { opacity: .56; filter: none; }
.ganesh-invocation { margin: 0 0 1.2rem; color: var(--terracotta); font-family: 'Noto Serif Devanagari', Georgia, serif; font-size: clamp(1rem, 3.4vw, 1.3rem); font-weight: 600; letter-spacing: .08em; }
#hero .couple-name { -webkit-text-fill-color: currentColor; background: none; color: #bd8139; text-shadow: 0 2px 0 rgba(255,247,220,.55), 0 8px 24px rgba(87,50,26,.22); }
body:not(.light-theme) #hero .couple-name { color: #eac489; }
#hero .ampersand-wrap { gap: 1.15rem; margin: 1.1rem 0; }
#hero .ampersand-line { width: clamp(42px, 12vw, 88px); background: linear-gradient(90deg, transparent, var(--gold), transparent); }
#hero .ampersand { position: relative; display: block; flex: 0 0 3.1rem; width: 3.1rem; height: 3.1rem; border: 1px solid rgba(196,145,75,.5); border-radius: 50%; background: radial-gradient(circle at 30% 25%,rgba(255,255,255,.66),rgba(255,238,208,.16)); box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 5px 17px rgba(103,65,40,.15); }
#hero .ampersand-glyph { position: absolute; left: 50%; top: 50%; transform: translate(-53%, -55%); color: var(--gold); font: italic 2.35rem/1 Georgia, serif; }
.hero-clouds { position: absolute; overflow: hidden; }
.hero-clouds { inset: 0 0 auto; height: min(38vh, 370px); z-index: 1; opacity: .5; background: radial-gradient(ellipse at 20% 42%, rgba(245,239,229,.28), transparent 31%), radial-gradient(ellipse at 75% 28%, rgba(245,239,229,.2), transparent 36%); -webkit-mask-image: linear-gradient(#000 0%, #000 52%, transparent 100%); mask-image: linear-gradient(#000 0%, #000 52%, transparent 100%); }
.hero-clouds { pointer-events: none; }
body.light-theme .hero-clouds { opacity: .7; }
.hero-clouds canvas { width: 100%; height: 100%; display: block; }
#hero .hero-card { z-index: 3; }
#hero .hero-frame { z-index: 4; }
#hero .scroll-cue { z-index: 5; }

/* One viewport-sized paper panel remains behind the entire section while it scrolls.
   It moves away only at the section boundary, so stacked cards share a continuous motif. */
#events-section, #wardrobe-section, #rsvp-section, #memories-section { isolation: isolate; }
#events-section > :not(.section-texture), #wardrobe-section > :not(.section-texture), #rsvp-section > :not(.section-texture), #memories-section > :not(.section-texture) { position: relative; z-index: 1; }
.section-texture { position: sticky; top: 0; z-index: 0; width: calc(100% + 3rem); height: 100vh; margin: -5rem -1.5rem calc(-100vh + 5rem); pointer-events: none; background-repeat: no-repeat; background-position: center; background-size: 100% 100%; }
@supports (height: 100dvh) { .section-texture { height: 100dvh; margin-bottom: calc(-100dvh + 5rem); } }
@media (max-width: 700px) { .section-texture { width: calc(100% + 2rem); margin-left: -1rem; margin-right: -1rem; } }
.section-texture--events { background-image: linear-gradient(rgba(255,250,243,.1),rgba(255,250,243,.1)), url("events-parchment-v2.png"); }
.section-texture--wardrobe { background-image: linear-gradient(rgba(255,246,238,.1),rgba(255,246,238,.1)), url("wardrobe-silk-v2.png"); }
.section-texture--rsvp { background-image: linear-gradient(rgba(255,246,239,.1), rgba(255,246,239,.1)), url("rsvp-floral-parchment-v1.jpg"); }
.section-texture--memories { background-image: linear-gradient(rgba(255,248,241,.06),rgba(255,248,241,.06)), url("memories-floral-parchment-v2.jpg"); }
#memories-section .section-texture--memories { width: calc(100% + 3rem); margin-left: -1.5rem; margin-right: -1.5rem; background-size: cover; background-position: center top; }
body:not(.light-theme) .section-texture--events { background-image: linear-gradient(rgba(28,21,28,.58),rgba(28,21,28,.58)), url("events-parchment-v2.png"); }
body:not(.light-theme) .section-texture--wardrobe { background-image: linear-gradient(rgba(33,24,33,.58),rgba(33,24,33,.58)), url("wardrobe-silk-v2.png"); }
body:not(.light-theme) .section-texture--rsvp { background-image: linear-gradient(rgba(29,20,33,.55), rgba(29,20,33,.55)), url("rsvp-floral-parchment-v1.jpg"); }
body:not(.light-theme) .section-texture--memories { background-image: linear-gradient(rgba(29,20,33,.55),rgba(29,20,33,.55)), url("memories-floral-parchment-v2.jpg"); }
#memories-section .text-center.reveal { max-width: 760px; margin-inline: auto; padding: .5rem 1rem 1rem; background: radial-gradient(ellipse at 50% 44%,rgba(255,250,244,.78),rgba(255,250,244,.35) 62%,transparent 78%); }
body:not(.light-theme) #memories-section .text-center.reveal { background: radial-gradient(ellipse at 50% 44%,rgba(33,24,33,.7),rgba(33,24,33,.3) 62%,transparent 78%); }

/* Generated section artwork stays at the edges so headings, hearts and forms remain readable. */
body.light-theme #scratch-reveal-section {
  background: linear-gradient(rgba(255,250,245,.06), rgba(255,250,245,.06)), url("scratch-section-parchment-v1.jpg") center / cover no-repeat;
}
body:not(.light-theme) #scratch-reveal-section {
  background: linear-gradient(rgba(23,16,28,.55), rgba(23,16,28,.55)), url("scratch-section-parchment-v1.jpg") center / cover no-repeat;
}
body #footer-section {
  background: linear-gradient(rgba(38,12,25,.4), rgba(20,6,12,.82)), url("footer-burgundy-floral-v1.jpg") center top / cover no-repeat;
  padding-top: clamp(2rem, 5vw, 3rem);
  padding-bottom: clamp(2.5rem, 6vw, 3.8rem);
  min-height: auto;
}
#footer-section .footer-content { padding-top: 0; }

#events-section .event-card-copy { inset: 15% 17% 16%; }
.event-venue { display: flex; flex-direction: column; gap: .25rem; margin: 3cqw 0 0; }
.event-venue-label { color: var(--event-gold); font: 700 clamp(.55rem,2.25cqw,.8rem)/1.2 Georgia, serif; letter-spacing: .2em; text-transform: uppercase; }
.event-venue-name { font: 400 clamp(1rem,4.1cqw,1.55rem)/1.1 'Invitation Serif',Georgia,serif; }
.event-map-link { display: inline-flex; align-items: center; justify-content: center; margin-top: 2.4cqw; padding: .5em 1.15em; border: 1px solid color-mix(in srgb,var(--event-gold) 55%,transparent); border-radius: 999px; background: rgba(255,252,246,.58); color: var(--event-ink); font: 700 clamp(.53rem,2.05cqw,.73rem)/1.2 Georgia,serif; letter-spacing: .09em; text-decoration: none; text-transform: uppercase; -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px); }
.event-map-link { gap: .4em; }
.event-map-link svg { display: block; flex: none; width: 1em; height: 1em; stroke: currentColor; }
.event-map-link:hover,.event-map-link:focus-visible { background: rgba(255,252,246,.92); text-decoration: underline; }

.calendar-button { display: inline-flex; align-items: center; gap: .7rem; justify-content: center; margin: 1.4rem auto 0; padding: .85rem 1.45rem; border: 1px solid rgba(255,255,255,.8); border-radius: 999px; background: linear-gradient(145deg,rgba(255,255,255,.58),rgba(255,229,213,.3)); color: var(--terracotta); box-shadow: 0 10px 25px rgba(98,55,52,.12),inset 0 1px 0 rgba(255,255,255,.9); font: 700 .78rem/1.2 'Invitation Serif',Georgia,serif; letter-spacing: .14em; text-decoration: none; text-transform: uppercase; -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.calendar-button:hover,.calendar-button:focus-visible { transform: translateY(-2px); background: rgba(255,255,255,.84); }
.calendar-button span { font-size: 1.2rem; line-height: .8; }
body:not(.light-theme) .calendar-button { color: #f5d5a4; background: rgba(255,255,255,.12); }
#scratch-reveal-section .cd-item span.tick { animation: countdownSoftBlur .55s cubic-bezier(.16,1,.3,1) both; }
@keyframes countdownSoftBlur { 0% { opacity: .35; filter: blur(7px); transform: translateY(8px) scale(1.07); } 65% { opacity: .94; filter: blur(1px); } 100% { opacity: 1; filter: blur(0); transform: none; } }
@media (prefers-reduced-motion: reduce) { #scratch-reveal-section .cd-item span.tick { animation: none; } }

/* The RSVP is a set of translucent glass panes over the floral paper. */
#rsvp-section .form-card {
  position: relative; isolation: isolate; overflow: hidden;
  border: 1px solid rgba(255,240,222,.48);
  background: linear-gradient(145deg, rgba(255,255,255,.18), rgba(255,255,255,.07) 46%, rgba(136,76,78,.15));
  box-shadow: 0 22px 54px rgba(18,10,22,.28), inset 0 1px 0 rgba(255,255,255,.53), inset 0 -1px 0 rgba(255,255,255,.12);
  -webkit-backdrop-filter: blur(30px) saturate(165%); backdrop-filter: blur(30px) saturate(165%);
  transition: opacity 1.2s ease-out, transform 1.2s ease-out, box-shadow .3s ease, border-color .3s ease;
}
#rsvp-section .form-card.reveal-delay-1 { transition-delay: .1s; }
#rsvp-section .form-card.reveal-delay-2 { transition-delay: .2s; }
body.light-theme #rsvp-section .form-card {
  border-color: rgba(255,255,255,.82);
  background: linear-gradient(145deg, rgba(255,255,255,.66), rgba(255,250,246,.34) 55%, rgba(255,225,211,.25));
  box-shadow: 0 20px 48px rgba(113,69,66,.16), inset 0 1px 0 rgba(255,255,255,.95), inset 0 -1px 0 rgba(255,255,255,.48);
}
#rsvp-section .form-card::before {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .45;
  background: radial-gradient(circle 260px at var(--glass-x, 25%) var(--glass-y, 0%), rgba(255,255,255,.48), transparent 72%);
  transition: opacity .3s ease;
}
#rsvp-section .form-card:hover::before, #rsvp-section .form-card:focus-within::before { opacity: .85; }
#rsvp-section .form-card > * { position: relative; z-index: 1; }
#rsvp-section .field-input, #rsvp-section .text-area {
  border: 1px solid rgba(255,242,225,.34); border-radius: 13px;
  background: rgba(26,18,33,.31); padding: .78rem .9rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 8px 21px rgba(19,11,22,.08);
  -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%);
}
body.light-theme #rsvp-section .field-input, body.light-theme #rsvp-section .text-area {
  background: rgba(255,255,255,.43); border-color: rgba(190,133,117,.3);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.91), 0 8px 20px rgba(112,63,66,.06);
}
#rsvp-section .field-input:focus, #rsvp-section .text-area:focus {
  border-color: var(--terracotta); box-shadow: 0 0 0 3px rgba(201,150,62,.13), inset 0 1px 0 rgba(255,255,255,.52);
}
#rsvp-section .checkbox-pill, #rsvp-section .circle-face {
  border: 1px solid rgba(255,242,225,.4); background: rgba(255,255,255,.11);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 8px 22px rgba(23,12,27,.09);
  -webkit-backdrop-filter: blur(17px); backdrop-filter: blur(17px);
}
body.light-theme #rsvp-section .checkbox-pill, body.light-theme #rsvp-section .circle-face {
  background: rgba(255,255,255,.43); border-color: rgba(255,255,255,.75);
}
#rsvp-section .checkbox-pill:has(input:checked), #rsvp-section .circle-opt:has(input:checked) .circle-face {
  background: color-mix(in srgb, var(--terracotta) 75%, transparent);
  border-color: rgba(255,255,255,.57); color: #fff;
}
#rsvp-section .submit-btn { border: 1px solid rgba(255,255,255,.75); -webkit-backdrop-filter: blur(22px) saturate(155%); backdrop-filter: blur(22px) saturate(155%); }
#rsvp-section #submit-btn, body.light-theme #rsvp-section #submit-btn { color: #fff9f3; background: linear-gradient(145deg, #c86a54, #a5483a 65%, #8e392f); border: 1px solid rgba(255,232,220,.78); box-shadow: 0 12px 30px rgba(148,57,47,.34), inset 0 1px 0 rgba(255,255,255,.31); }
#rsvp-section #submit-btn:hover, body.light-theme #rsvp-section #submit-btn:hover { background: linear-gradient(145deg, #d1755d, #a84435 65%, #852e28); box-shadow: 0 16px 34px rgba(148,57,47,.4), inset 0 1px 0 rgba(255,255,255,.36); }
#rsvp-section .circle-opt { display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 76px; }
#rsvp-section .circle-face { display: grid; place-items: center; line-height: 1; }
#rsvp-section .circle-face > span { display: block; transform: translateY(-.04em); }

/* A glass guest counter with the supplied vertical 3D number-flip motion. */
#rsvp-section .guest-stepper { display: grid; grid-template-columns: 56px minmax(0,1fr) 56px; align-items: stretch; gap: 12px; max-width: 330px; margin: 1rem auto .2rem; }
#rsvp-section .guest-stepper-button, #rsvp-section .guest-number-card {
  border: 1px solid rgba(255,239,222,.52); border-radius: 18px;
  background: linear-gradient(145deg,rgba(255,255,255,.26),rgba(255,255,255,.07));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.56), 0 9px 22px rgba(27,13,28,.13);
  -webkit-backdrop-filter: blur(18px) saturate(155%); backdrop-filter: blur(18px) saturate(155%);
}
body.light-theme #rsvp-section .guest-stepper-button, body.light-theme #rsvp-section .guest-number-card {
  background: linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,241,232,.39)); border-color: rgba(255,255,255,.88);
}
#rsvp-section .guest-stepper-button { min-height: 92px; padding: 0; color: var(--terracotta); font: 400 2rem/1 'Invitation Serif', Georgia, serif; cursor: pointer; transition: transform .2s ease, background .2s ease, opacity .2s ease; }
#rsvp-section .guest-stepper-button:hover:not(:disabled) { transform: translateY(-3px); background: rgba(255,255,255,.32); }
#rsvp-section .guest-stepper-button:active:not(:disabled) { transform: scale(.94); }
#rsvp-section .guest-stepper-button:disabled { opacity: .38; cursor: not-allowed; }
#rsvp-section .guest-number-card { min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 9px; }
#rsvp-section .guest-number-window { position: relative; display: block; overflow: hidden; width: 2.4ch; height: 1.18em; perspective: 340px; color: var(--terracotta); font: 400 clamp(2.2rem,7vw,2.9rem)/1.18 'Invitation Serif', Georgia, serif; text-align: center; }
#rsvp-section .guest-number-window span { position: absolute; inset: 0; display: grid; place-items: center; transform-origin: 50% 50%; backface-visibility: hidden; }
#rsvp-section .guest-number-window .guest-number-entering { animation: guestFlipIn .3s ease-out both; }
#rsvp-section .guest-number-window .guest-number-leaving { animation: guestFlipOut .3s ease-in both; }
#rsvp-section .guest-count-hint { color: var(--text-light); font: 600 .62rem/1.2 'Invitation Serif',Georgia,serif; letter-spacing: .08em; text-transform: uppercase; text-align: center; }
@keyframes guestFlipIn { from { opacity: 0; transform: translateY(-40px) rotateX(-90deg); } to { opacity: 1; transform: translateY(0) rotateX(0); } }
@keyframes guestFlipOut { from { opacity: 1; transform: translateY(0) rotateX(0); } to { opacity: 0; transform: translateY(40px) rotateX(90deg); } }
@media (max-width: 400px) { #rsvp-section .guest-stepper { grid-template-columns: 48px minmax(0,1fr) 48px; gap: 7px; } #rsvp-section .guest-stepper-button { min-height: 84px; } #rsvp-section .guest-count-hint { font-size: .54rem; } }
@media (prefers-reduced-motion: reduce) { #rsvp-section .guest-number-window .guest-number-entering, #rsvp-section .guest-number-window .guest-number-leaving { animation: none; } }

/* Scratch lens follows the finger or mouse above the generated foil surface. */
.heart-container .scratch-lens { position: absolute; z-index: 3; width: 54px; height: 54px; left: 0; top: 0; border-radius: 50%; pointer-events: none; opacity: 0; transform: translate(-50%,-50%); border: 1px solid rgba(255,255,255,.83); background: radial-gradient(circle at 35% 30%,rgba(255,255,255,.6),rgba(255,255,255,.05) 55%,rgba(115,68,52,.16)); box-shadow: inset 0 1px 3px rgba(255,255,255,.9),0 0 14px rgba(255,244,228,.75); -webkit-backdrop-filter: blur(5px) contrast(1.16); backdrop-filter: blur(5px) contrast(1.16); transition: opacity .18s ease; }
.heart-container.is-scratching .scratch-lens { opacity: 1; }

/* Circular glass reveal over the original couple portraits. */
.memories-inner { isolation: isolate; }
.memory-arrow { position: absolute; top: 50%; z-index: 15; display: grid; place-items: center; width: 46px; height: 46px; padding: 0; transform: translateY(-50%); border: 1px solid rgba(255,255,255,.84); border-radius: 50%; background: linear-gradient(145deg,rgba(255,255,255,.72),rgba(255,236,224,.34)); color: #713d39; box-shadow: 0 8px 24px rgba(50,29,37,.2), inset 0 1px 0 rgba(255,255,255,.9); -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%); cursor: pointer; transition: background .2s ease, scale .2s ease; }
.memory-arrow:hover { scale: 1.1; background: rgba(255,251,246,.88); }
.memory-arrow:focus-visible { outline: 2px solid #b85940; outline-offset: 3px; }
.memory-arrow[hidden] { display: none; }
.memory-arrow--prev { left: 12px; }
.memory-arrow--next { right: 12px; }
.memory-arrow span { display: block; font: 400 2.3rem/1 Georgia, serif; transform: translateY(-.08em); }
.memory-glass-rim { position: absolute; inset: 0; z-index: 5; pointer-events: none; opacity: 0; background: radial-gradient(circle at center, transparent 35%, rgba(255,255,255,.16) 45%, transparent 60%); mix-blend-mode: screen; }
.memory-glass-rim.is-active { opacity: 1; animation: memoryGlassRim 1.6s ease-in-out both; }
.memory-slide.is-entering { z-index: 3; visibility: visible; opacity: 1; animation: memoryGlassReveal 1.6s cubic-bezier(.22,.7,.2,1) both; }
@keyframes memoryGlassReveal { from { clip-path: circle(0% at 50% 50%); filter: blur(9px) brightness(1.3); transform: scale(1.035); } 55% { filter: blur(2px) brightness(1.08); } to { clip-path: circle(150% at 50% 50%); filter: none; transform: scale(1); } }
@keyframes memoryGlassRim { from { transform: scale(.15); opacity: .2; } 48% { opacity: .85; } to { transform: scale(2.5); opacity: 0; } }
.memory-nav { position: relative; z-index: 3; display: flex; justify-content: center; gap: .5rem; margin-top: 1.2rem; }
.memory-nav button { position: relative; width: 46px; height: 22px; padding: 0; border: 0; background: none; cursor: pointer; }
.memory-nav button::before { content: ''; position: absolute; top: 9px; inset-inline: 0; height: 3px; border-radius: 4px; background: rgba(201,150,62,.3); }
.memory-nav button::after { content: ''; position: absolute; top: 9px; left: 0; height: 3px; width: 0; border-radius: 4px; background: var(--gold); }
.memory-nav button.is-active::after { animation: memoryProgress 5s linear forwards; }
@keyframes memoryProgress { to { width: 100%; } }
.memory-nav button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

/* Character glow runs once as each invitation or wardrobe card enters view. */
.glow-word { display: inline-block; white-space: nowrap; }
.glow-char { display: inline-block; opacity: 0; color: inherit; }
.glow-active .glow-char { animation: glowingCharReveal var(--glow-duration, .5s) ease-out var(--glow-delay, 0s) both; }
@keyframes glowingCharReveal {
  0% { opacity: 0; filter: blur(4px); text-shadow: none; transform: translateY(6px); }
  55% { opacity: 1; filter: blur(0); text-shadow: 0 0 7px currentColor, 0 0 18px currentColor, 0 0 34px currentColor; transform: translateY(0); }
  100% { opacity: 1; filter: blur(0); text-shadow: none; transform: none; }
}

/* Approved family-message snap carousel. */
.message-limit { display: block; margin-top: 7px; text-align: right; color: var(--text-light); font: 600 .72rem 'Invitation Serif',Georgia,serif; }
#family-messages-section { padding: clamp(2rem, 5vw, 2.8rem) 1.5rem clamp(2.2rem, 5vw, 3rem); background: url("memories-floral-parchment-v2.jpg") center / cover no-repeat; }
.family-msg-shell { width: min(100%,520px); margin: 1.4rem auto 0; padding: 22px 20px 20px; border: 1px solid rgba(255,255,255,.7); border-radius: 20px; background: linear-gradient(145deg,rgba(255,255,255,.5),rgba(247,223,210,.25)); box-shadow: 0 16px 36px rgba(81,45,51,.1),inset 0 1px rgba(255,255,255,.88); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); text-align: center; }
.family-msg-empty { margin: 0; color: var(--text-mid); font: italic clamp(.9rem, 2.5vw, 1.05rem)/1.55 'Invitation Serif',Georgia,serif; }
body:not(.light-theme) .family-msg-shell { background: linear-gradient(145deg,rgba(255,255,255,.13),rgba(49,29,48,.35)); border-color: rgba(255,255,255,.2); }
.family-messages-intro { max-width: 34ch; margin: 1rem auto 0; font: italic 1.08rem/1.5 'Invitation Serif',Georgia,serif; color: var(--text-light); }
.message-carousel-shell { width: min(100%,610px); margin: 2.5rem auto 0; padding: 20px 0 18px; overflow: hidden; border: 1px solid rgba(255,255,255,.7); border-radius: 25px; background: linear-gradient(145deg,rgba(255,255,255,.46),rgba(247,223,210,.24)); box-shadow: 0 25px 55px rgba(81,45,51,.14),inset 0 1px rgba(255,255,255,.88); -webkit-backdrop-filter: blur(22px) saturate(150%); backdrop-filter: blur(22px) saturate(150%); }
body:not(.light-theme) .message-carousel-shell,body:not(.light-theme) .visit-stat { background: linear-gradient(145deg,rgba(255,255,255,.13),rgba(49,29,48,.35)); border-color: rgba(255,255,255,.2); }
.message-carousel-empty { padding: 35px 22px; margin: 0; text-align: center; color: var(--text-mid); font: italic 1rem/1.6 'Invitation Serif',Georgia,serif; }
.message-carousel { overflow: hidden; outline: none; touch-action: pan-y; }
.message-carousel[hidden],.message-carousel-controls[hidden],.message-carousel-empty[hidden] { display: none; }
.message-carousel:focus-visible { box-shadow: inset 0 0 0 2px var(--gold); }
.message-carousel-track { display: flex; align-items: stretch; gap: 12px; padding: 4px 28px; transform: translateX(0); transition: transform .55s cubic-bezier(.18,.75,.22,1); will-change: transform; }
.message-card { flex: 0 0 calc(100% - 56px); min-height: 190px; margin: 0; padding: clamp(20px,5vw,30px); border: 1px solid rgba(255,255,255,.76); border-radius: 18px; background: linear-gradient(155deg,rgba(255,255,255,.65),rgba(255,249,243,.37)); box-shadow: 0 8px 24px rgba(78,43,49,.09),inset 0 1px rgba(255,255,255,.9); color: var(--text-dark); opacity: .55; transform: scale(.96); transition: opacity .35s,transform .35s; display: flex; flex-direction: column; justify-content: center; }
.message-card.is-current { opacity: 1; transform: scale(1); }
body:not(.light-theme) .message-card { background: linear-gradient(155deg,rgba(255,255,255,.17),rgba(43,27,45,.35)); border-color: rgba(255,255,255,.23); }
.message-quote { margin: 0; font: italic clamp(1.2rem,3.6vw,1.55rem)/1.5 'Invitation Serif',Georgia,serif; text-wrap: pretty; overflow-wrap: anywhere; }
.message-author { margin: 17px 0 0; color: var(--terracotta); font: 600 .85rem 'Invitation Serif',Georgia,serif; letter-spacing: .1em; text-transform: uppercase; }
.message-carousel-controls { display: flex; align-items: center; justify-content: space-between; padding: 10px 28px 0; gap: 12px; }
.message-carousel-dots,.message-carousel-arrows { display: flex; align-items: center; gap: 5px; }
.message-carousel-controls button { cursor: pointer; border: 1px solid rgba(255,255,255,.68); background: rgba(255,255,255,.38); color: var(--terracotta); box-shadow: inset 0 1px rgba(255,255,255,.8),0 4px 12px rgba(83,45,50,.1); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.message-carousel-controls button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.message-carousel-dots button { width: 16px; height: 20px; padding: 0; border: 0; background: transparent; box-shadow: none; position: relative; }
.message-carousel-dots button::after { content:''; position:absolute; left:1px; right:1px; top:8px; height:4px; border-radius:5px; background:var(--terracotta); opacity:.3; transform:scaleX(.55); transition:transform .25s,opacity .25s; }
.message-carousel-dots button[aria-current="true"]::after { opacity:1; transform:scaleX(1); }
.message-carousel-arrows button { display: grid; place-items:center; width:34px; height:34px; padding:0; border-radius:10px; font: 1.5rem/1 Georgia,serif; }
.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; }
@media (max-width:500px) { .message-carousel-track { padding-inline:18px; } .message-card { flex-basis:calc(100% - 36px); } .message-carousel-controls { padding-inline:18px; } }
@media (prefers-reduced-motion: reduce) { .message-carousel-track,.message-card { transition:none; } }

/* Invitation navigation: an expanded top pill that folds into the lower-right control stack. */
.v2-animated-nav {
  position: fixed; z-index: 1200; top: max(17px, env(safe-area-inset-top)); left: 50%;
  translate: -50% 0; display: flex; align-items: center; gap: 6px;
  width: max-content; max-width: calc(100vw - 24px); min-height: 52px; padding: 5px 9px;
  color: #fff9f1; border: 1px solid rgba(255,255,255,.5); border-radius: 999px;
  background: linear-gradient(150deg, rgba(66,35,49,.76), rgba(39,25,39,.65));
  box-shadow: 0 12px 36px rgba(31,15,27,.28), inset 0 1px 0 rgba(255,255,255,.38);
  -webkit-backdrop-filter: blur(25px) saturate(155%); backdrop-filter: blur(25px) saturate(155%);
  transform-origin: center center;
}
.v2-animated-nav::before {
  content: ''; position: absolute; inset: 1px 12px auto; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.7), transparent);
  pointer-events: none;
}
.v2-nav-links { display: flex; align-items: center; gap: 2px; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.v2-nav-links::-webkit-scrollbar { display: none; }
.v2-nav-links a, .v2-nav-theme {
  flex: 0 0 auto; display: grid; place-items: center; min-height: 36px; padding: 0 10px;
  border: 0; border-radius: 999px; background: transparent; color: inherit;
  font: 700 .84rem/1 'Invitation Serif', Georgia, serif; letter-spacing: .025em;
  text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.v2-theme-text { display: none; }
.v2-nav-links a:hover, .v2-nav-links a:focus-visible, .v2-nav-links a[aria-current="location"],
.v2-nav-theme:hover, .v2-nav-theme:focus-visible { color: #ffe0ac; background: rgba(255,255,255,.13); }
.v2-nav-links a:active, .v2-nav-theme:active { transform: scale(.95); }
.v2-nav-theme { width: 36px; padding: 0; margin-left: 3px; border: 1px solid rgba(255,255,255,.2); }
.v2-nav-theme svg { width: 18px; height: 18px; }
.v2-nav-compact { display: none; border: 0; background: transparent; color: inherit; cursor: pointer; }
.v2-nav-compact svg { width: 24px; height: 24px; }
.v2-animated-nav.is-collapsed {
  top: auto; left: auto; right: max(18px, env(safe-area-inset-right));
  bottom: calc(max(18px, env(safe-area-inset-bottom)) + 67px);
  translate: 0 0; width: 54px; height: 54px; min-height: 0; padding: 0;
  justify-content: center; cursor: pointer;
}
.v2-animated-nav.is-collapsed .v2-nav-links { display: none; }
.v2-animated-nav.is-collapsed.is-menu-open .v2-nav-links { position: absolute; right: 0; bottom: calc(100% + 12px); display: flex; flex-direction: column; align-items: stretch; width: min(240px,calc(100vw - 32px)); max-height: min(70vh,470px); padding: 10px; gap: 3px; overflow-y: auto; border: 1px solid rgba(255,255,255,.74); border-radius: 20px; background: linear-gradient(155deg,rgba(255,251,247,.95),rgba(249,222,209,.91)); box-shadow: 0 18px 44px rgba(52,27,38,.26),inset 0 1px 0 rgba(255,255,255,.96); color: #573337; -webkit-backdrop-filter: blur(24px) saturate(160%); backdrop-filter: blur(24px) saturate(160%); }
.v2-animated-nav.is-collapsed.is-menu-open .v2-nav-links a { display: flex; justify-content: flex-start; min-height: 43px; width: 100%; padding-inline: 14px; font-size: .9rem; }
.v2-animated-nav.is-collapsed.is-menu-open .v2-nav-theme { display: flex; align-items: center; justify-content: flex-start; gap: 10px; width: 100%; min-height: 43px; margin: 3px 0 0; padding-inline: 14px; font-size: .9rem; border-top: 1px solid rgba(141,81,69,.16); border-radius: 9px; }
.v2-animated-nav.is-collapsed.is-menu-open .v2-theme-text { display: inline; }
.v2-animated-nav.is-collapsed.is-menu-open .v2-nav-links a[aria-current="location"] { background: rgba(180,86,69,.15); color: #9c4b3d; }
body:not(.light-theme) .v2-animated-nav.is-collapsed.is-menu-open .v2-nav-links { color: #fff5eb; background: linear-gradient(155deg,rgba(73,42,57,.96),rgba(42,28,45,.95)); border-color: rgba(255,245,230,.3); }
.v2-animated-nav.is-collapsed .v2-nav-compact { display: grid; place-items: center; width: 100%; height: 100%; border-radius: 50%; }
.v2-animated-nav.is-collapsed:hover { box-shadow: 0 13px 34px rgba(31,15,27,.37), inset 0 1px 0 rgba(255,255,255,.55); }
.v2-auto-scroll {
  position: fixed; z-index: 1201; right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom)); display: grid; place-items: center;
  width: 54px; height: 54px; padding: 0; border: 1px solid rgba(255,255,255,.7);
  border-radius: 50%; color: #fff8ed;
  background: linear-gradient(145deg, rgba(136,75,73,.72), rgba(78,45,66,.74));
  box-shadow: 0 10px 30px rgba(31,15,27,.28), inset 0 1px 0 rgba(255,255,255,.45);
  -webkit-backdrop-filter: blur(22px) saturate(155%); backdrop-filter: blur(22px) saturate(155%);
  cursor: pointer; transition: transform .2s ease, box-shadow .2s ease;
}
.v2-auto-scroll:hover, .v2-animated-nav.is-collapsed .v2-nav-compact:hover { transform: scale(1.07); }
.v2-auto-scroll svg { width: 22px; height: 22px; }
.v2-auto-state { position: absolute; top: 9px; right: 9px; width: 7px; height: 8px; border-left: 2px solid currentColor; border-right: 2px solid currentColor; opacity: 0; }
.v2-auto-scroll.is-playing .v2-auto-state { opacity: 1; }
body #audio-btn {
  display: flex; left: max(18px, env(safe-area-inset-left)); right: auto;
  bottom: max(18px, env(safe-area-inset-bottom)); width: 54px; height: 54px; z-index: 1201;
}
#language-toggle { position: fixed; z-index: 1201; left: max(18px,env(safe-area-inset-left)); bottom: calc(max(18px,env(safe-area-inset-bottom)) + 68px); display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 2px; width: 64px; height: 48px; padding: 4px; border: 1px solid rgba(255,255,255,.8); border-radius: 16px; background: linear-gradient(145deg,rgba(255,255,255,.76),rgba(255,229,214,.48)); color: #713e3a; box-shadow: 0 9px 27px rgba(73,38,50,.17),inset 0 1px 0 rgba(255,255,255,.88); -webkit-backdrop-filter: blur(20px) saturate(160%); backdrop-filter: blur(20px) saturate(160%); cursor: pointer; }
#language-toggle span { display: grid; place-items: center; height: 100%; min-width: 0; border-radius: 11px; font: 700 .72rem/1 system-ui,sans-serif; }
#language-toggle span.is-active { background: #ad5949; color: #fffaf5; box-shadow: 0 2px 9px rgba(90,39,39,.22); }
body:not(.light-theme) #language-toggle { color: #ffe8d8; background: rgba(61,35,51,.78); }
body:not(.v2-nav-ready) #language-toggle { display: none; }
body.v2-nav-ready #theme-btn { display: none; }
body.light-theme .v2-animated-nav {
  color: #563235; border-color: rgba(255,255,255,.9);
  background: linear-gradient(145deg, rgba(255,251,247,.84), rgba(243,216,201,.72));
  box-shadow: 0 12px 30px rgba(100,55,69,.16), inset 0 1px 0 rgba(255,255,255,.85);
}
body.light-theme .v2-nav-links a:hover, body.light-theme .v2-nav-links a:focus-visible,
body.light-theme .v2-nav-links a[aria-current="location"], body.light-theme .v2-nav-theme:hover {
  color: #a45440; background: rgba(162,80,72,.11);
}
body.light-theme .v2-auto-scroll {
  color: #8b483d; background: linear-gradient(145deg, rgba(255,252,248,.82), rgba(242,214,194,.7));
  border-color: rgba(255,255,255,.9); box-shadow: 0 10px 26px rgba(100,55,69,.17), inset 0 1px 0 rgba(255,255,255,.9);
}
body:not(.v2-nav-ready) .v2-animated-nav, body:not(.v2-nav-ready) .v2-auto-scroll { display: none; }
body.v2-nav-ready #main-content { padding-bottom: 0; }
.v2-animated-nav a:focus-visible, .v2-animated-nav button:focus-visible, .v2-auto-scroll:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 3px; }
@media (max-width: 650px) {
  .v2-animated-nav:not(.is-collapsed) { left: max(12px, env(safe-area-inset-left)); right: max(12px, env(safe-area-inset-right)); width: auto; max-width: none; translate: none; justify-content: center; }
  .v2-nav-links { flex: 0 1 auto; justify-content: safe center; }
  .v2-nav-links a { padding-inline: 8px; font-size: .78rem; }
}
@media (prefers-reduced-motion: reduce) {
  .glow-char, .glow-active .glow-char { opacity: 1; filter: none; animation: none; }
  .memory-glass-rim { animation: none; }
  .v2-auto-scroll, .v2-animated-nav { transition: none; }
}