/* Local Vietnamese fonts retain the source's serif, signature and typewriter rhythm. */
@font-face { font-family: 'DTC SW Lora'; src: url('../../fonts/orig/bh/8496af-lora.ttf') format('truetype'); font-display: swap; }
@font-face { font-family: 'DTC SW Signature'; src: url('../../fonts/orig/bh/9cd584-GastrolineSignature.otf') format('opentype'); font-display: swap; }
@font-face { font-family: 'DTC SW Serif'; src: url('../../fonts/orig/bh/c067eb-arnopro.otf') format('opentype'); font-display: swap; }
.sw-body .__className_7e1e0f { font-family: 'DTC SW Lora',serif; }
.sw-body .__className_a7e8a8 { font-family: 'DTC SW Signature',cursive; }
.sw-body .__className_84edc5 { font-family: 'Courier New',monospace; }
.sw-body [data-sw-date] { font-family: __subtitleFont_84edc5,__subtitleFont_Fallback_84edc5,monospace; }
.sw-body .__className_408211,.sw-body .sw-rsvp-dialog { font-family: 'DTC SW Serif',serif; }
.sw-body .sp-album-link { display: inline-block; padding: 12px 20px; border: 1px solid currentColor; border-radius: 999px; font-size: 16px; }
.sw-body .sw-native-quote { margin-top: 16px; font: 400 24px/1.5 'DTC SW Lora',serif; }
.sw-html { color-scheme: light; background: white; --sw-paper: #f4f2f3; --sw-title: #765e3a; --sw-accent: #d96f6f; --sw-text: #765e3a; --sw-border: #765e3a; --sw-button: #765e3a; --sw-cover: #dcd3c2; }
.sw-html.sw-locked { overflow: hidden; }
.sw-body { margin: 0; background: white; }
.sw-content { display: none; }
.sw-opened .sw-content,.sw-preview .sw-content { display: block; }
.sw-preview #sw-envelope,.sw-preview .sw-tools { display: none !important; }
.sw-preview [data-sw-reveal] { opacity: 1 !important; filter: none !important; }
.sw-preview * { animation: none !important; transition: none !important; }
.sw-background { opacity: 0 !important; pointer-events: none; transition: opacity 1.5s ease-in-out; }
.sw-opened .sw-background { opacity: .9 !important; }
#sw-envelope { cursor: pointer; touch-action: none; opacity: 1; }
#sw-envelope.sw-opening { position: absolute; inset: 0; z-index: 40; pointer-events: none; animation: sw-passport-open 1.5s ease-in-out both; }
@keyframes sw-passport-open { to { opacity: 0; } }
.sw-tools { position: fixed; z-index: 60; bottom: 16px; width: min(100%,448px); left: 50%; transform: translateX(-50%); display: flex; align-items: flex-end; flex-direction: column; gap: 16px; pointer-events: none; }
.sw-tools > button { border: 0; border-radius: 50%; width: 32px; height: 32px; padding: 4px; margin-right: 20px; color: white; background: #575757; display: grid; place-items: center; cursor: pointer; pointer-events: auto; }
.sw-tools > button[hidden] { display: none; }
#sw-music { padding: 0; }
.sw-locked .sw-tools,.sw-tools:has(#sw-music[hidden]) { bottom: 64px; }
.sw-scroll-hint { position: fixed; left: max(calc(50% - 204px),20px); bottom: 16px; z-index: 50; pointer-events: none; }
.sw-scroll-hint svg { animation: sw-scroll-hand 2s infinite; }
.sw-locked .sw-scroll-hint,.sw-preview .sw-scroll-hint,.iv-editing .sw-scroll-hint { display: none; }
@keyframes sw-scroll-hand { 0%,100% { transform: translateY(0) rotate(-25deg); } 50% { transform: translateY(-10px) rotate(-10deg); } }
#sw-swatches { position: absolute; right: 20px; bottom: 96px; padding: 8px; gap: 8px; background: white; box-shadow: 0 2px 12px #0003; border-radius: 6px; pointer-events: auto; }
#sw-swatches:not([hidden]) { display: flex; }
#sw-swatches button { border: 2px solid white; width: 28px; height: 28px; border-radius: 50%; outline: 1px solid #ddd; cursor: pointer; }
.sw-map-dialog,.sw-rsvp-dialog { position: fixed; border: 0; padding: 16px; border-radius: 4px; color: #000; background: #fff; z-index: 100; box-sizing: border-box; }
.sw-map-dialog::backdrop,.sw-rsvp-dialog::backdrop { background: #0005; }
.sw-rsvp-dialog { top: 16px; margin: 0 auto; width: calc(100% - 32px); max-width: 1024px; max-height: calc(100dvh - 32px); overflow-y: auto; font-family: __contentFont_408211,__contentFont_Fallback_408211,sans-serif; font-size: 16px; line-height: 24px; }
.sw-rsvp-header { padding-bottom: 8px; border-bottom: 1px solid #e2e8f0; position: relative; text-align: left; }
.sw-rsvp-header button { position: absolute; top: -3px; right: 0; font: 25px/25px Arial,sans-serif; cursor: pointer; }
#sw-rsvp .sw-rsvp-header .sw-rsvp-close { position: static; font: inherit; }
#sw-rsvp .sw-rsvp-submit svg { width: 20px; height: 20px; }
.sw-map-dialog { width: calc(100% - 32px); max-width: 880px; }
.sw-map-dialog iframe { border: 0; width: 100%; height: min(65dvh,550px); }
.sw-map-dialog [data-sw-close] { float: right; font-size: 28px; margin: -6px 0 8px; }
.sw-map-dialog a { display: block; padding: 8px 0; text-align: right; text-decoration: underline; }
.sw-body .iv-toast { position: fixed; bottom: 30px; left: 50%; transform: translateX(-50%) translateY(15px); opacity: 0; background: #252525; color: #fff; border-radius: 6px; padding: 10px 18px; font: 14px/1.5 Arial,sans-serif; pointer-events: none; z-index: 110; transition: .2s; }
.sw-body .iv-toast.is-show { opacity: 1; transform: translateX(-50%); }
.sw-body [data-sw-track] { transition: transform .45s ease-out; }
.sw-body [data-sw-viewport] { touch-action: pan-y; }
.sw-body [data-sw-viewport] img { -webkit-user-drag: none; user-select: none; }
.sw-body [data-sw-reveal].sw-wait { opacity: 0 !important; }
.sw-compass { animation: sw-compass-turn 45s linear infinite; }
@keyframes sw-compass-turn { to { rotate: 360deg; } }
.sw-dot-active { background: var(--sw-text); }
[data-editor-type="photoCarousel"] [data-sw-dot][aria-current="true"]::after { background-color: var(--sw-accent); transform: scale(1.25); }
[data-editor-type="photoCarousel"] [data-sw-dot][aria-current="false"]::after { background-color: #e5e7eb; transform: none; }
.sw-body.iv-editing #sw-envelope,.sw-body.iv-editing .sw-tools { display: none; }
.sw-body.iv-editing [data-sw-reveal] { opacity: 1 !important; filter: none !important; }
.sw-body.iv-editing #iv-content { display: block; }
.sw-body.iv-editing .iv-photo { cursor: pointer; }
.iv-editing img[data-sw-artwork] { pointer-events: none; }
/* Theme controls use the original three palettes; default geometry stays in source CSS. */
.sw-body [class~="text-[#765e3a]"] { color: var(--sw-title); }
.sw-body [class~="text-[#d96f6f]"] { color: var(--sw-accent); }
.sw-body .sw-content { color: var(--sw-text); background-color: var(--sw-paper); }
.sw-body [class~="bg-[#f4f2f3]"] { background-color: var(--sw-paper); }
.sw-body [class~="bg-[#765e3a]"] { background-color: var(--sw-button); }
.sw-body [class~="border-[#765e3a]"] { border-color: var(--sw-border); }
.sw-body [class~="text-[#dcd3c2]"] { color: var(--sw-cover); }
.sw-body [data-editor-field="we.marry"],.sw-body [data-editor-field="initial.quote.text.2"] { fill: var(--sw-title); }
@media (prefers-reduced-motion: reduce) { #sw-envelope.sw-opening { animation-duration: .01ms; } .sw-background,[data-sw-track] { transition: none; } .sw-body [data-sw-reveal].sw-wait { opacity: 1 !important; } .sw-compass,.sw-scroll-hint svg,.sw-body .animate-marquee,.sw-body .animate-spin,.sw-body .animate-lightbounce,.sw-body .animate-lightrotation,.sw-body .animate-lightbouncemiddle { animation: none !important; } }