/* El Viaje en Carruaje — base: tokens del tema (_shared/realeza/js/themes.js → applyThemeCss: --rz-*), marco de
   teléfono (≤ 430 px) con un escritorio de papel alrededor, botones dorados y de pergamino, avisos, velo del fundido.
   Todo vive bajo .vc (clase de <html> de esta invitación): nada global que afecte a otras páginas.
   Fuentes: Great Vibes (sólo el nombre de la portada), Playfair Display 600/700 (títulos), Mulish 400/600/800 (textos).
   Textos de datos ≥ 16 px sobre papel o pergamino. */
.vc {
  --rz-enamel: #F6EDEA; --rz-pearl: #FFE9F0; --rz-primary: #E8B4BC; --rz-primary-rgb: 232, 180, 188; --rz-primary-hi: #F2D0D6; --rz-primary-lo: #AE8189;
  --rz-secondary: #B98AA6; --rz-velvet: #8E4E6A; --rz-ivory: #FFF8F0; --rz-ink: #4A2E3C; --rz-on-primary: #3A2230; --rz-gold: #D9B35C; --rz-gold-rgb: 217, 179, 92; --rz-night: #1E1216;
  --gold-grad: linear-gradient(180deg, #FBE9B4 0%, #E2BE6A 48%, #C99A48 100%);
  --parch: radial-gradient(120% 90% at 30% 10%, #FFFBF3 0%, #FBF0DE 55%, #F2E0C4 100%);
  --font-script: "Great Vibes", "Playfair Display", cursive;
  --font-head: "Playfair Display", Georgia, serif;
  --font-text: "Mulish", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ease-soft: cubic-bezier(.3, .7, .2, 1);
  --safe-t: env(safe-area-inset-top, 0px); --safe-b: env(safe-area-inset-bottom, 0px);
}
.vc *, .vc *::before, .vc *::after { box-sizing: border-box; }
.vc, .vc body { margin: 0; height: 100%; overflow: hidden; background: #F3E4D2; color: var(--rz-ink); font-family: var(--font-text); -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; overscroll-behavior: none; }
:where(.vc) button { font: inherit; color: inherit; }
.vc, .vc * { scrollbar-width: none; }
.vc ::-webkit-scrollbar { display: none; }
.vc .sr-only { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.vc .noscript { position: fixed; inset: auto 16px 16px; padding: 16px; border-radius: 16px; background: #FFF8F0; font-size: 16px; }
.vc :focus-visible { outline: 3px solid #C99A48; outline-offset: 3px; }

/* ---------- Escritorio: mesa de papel con flores pintadas alrededor del teléfono ---------- */
.vc .room { position: fixed; inset: 0; z-index: 0; overflow: hidden; background:
  radial-gradient(28% 22% at 12% 18%, rgba(244, 182, 198, .35), transparent 70%), radial-gradient(24% 20% at 88% 80%, rgba(201, 179, 236, .3), transparent 70%),
  radial-gradient(30% 24% at 86% 14%, rgba(169, 220, 198, .28), transparent 70%), radial-gradient(90% 80% at 50% 45%, #FBF2E6 0%, #F1E0CB 70%, #E8D2B8 100%); }
.vc .app { position: fixed; inset: 0; z-index: 1; overflow: hidden; background: #F3E4D2; isolation: isolate; touch-action: none; user-select: none; -webkit-user-select: none; }
@media (min-width: 560px) and (min-height: 560px) {
  .vc .app { inset: auto; left: 50%; top: 50%; width: min(430px, 100vw - 32px); height: min(932px, 100dvh - 40px); transform: translate(-50%, -50%);
    border-radius: 36px; box-shadow: 0 0 0 10px #E9D3BC, 0 0 0 12px rgba(var(--rz-gold-rgb), .55), 0 30px 80px rgba(90, 60, 50, .35); }
}
.vc.is-showcase .app { inset: 0 !important; width: auto !important; height: auto !important; transform: none !important; border-radius: 0 !important; box-shadow: none !important; }
.vc.is-showcase .ui { display: none !important; }
.vc .stage { position: absolute; inset: 0; overflow: hidden; }
/* velo del fundido (movimiento reducido, "Viajar otra vez", vitrina): papel cálido sobre la escena, nunca sobre la interfaz */
.vc .veil { position: absolute; inset: 0; z-index: 20; background: #F6E9D8; opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.vc .veil.is-on { opacity: 1; }
.vc .ui { position: absolute; inset: 0; z-index: 30; pointer-events: none; }
.vc .ui > * { pointer-events: auto; }

/* ---------- Botones ---------- */
.vc .gbtn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border: 1px solid rgba(255, 244, 214, .8); border-radius: 999px;
  background: var(--gold-grad); color: #3A2618; font: 700 17px/1.1 var(--font-head); letter-spacing: .01em; text-decoration: none; cursor: pointer;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .6) inset, 0 -2px 0 rgba(120, 80, 20, .22) inset, 0 6px 16px rgba(90, 60, 40, .25); transition: transform .12s ease; }
.vc .gbtn:active { transform: translateY(1px) scale(.98); }
.vc .gbtn.is-soft { background: rgba(255, 251, 243, .96); color: var(--rz-ink); border-color: rgba(var(--rz-gold-rgb), .75); box-shadow: 0 3px 10px rgba(90, 60, 40, .15); }
.vc .gbtn.is-primary { background: linear-gradient(180deg, var(--rz-primary-hi), var(--rz-primary)); color: var(--rz-on-primary); border-color: rgba(var(--rz-gold-rgb), .9); box-shadow: 0 0 0 2px rgba(var(--rz-gold-rgb), .5), 0 8px 20px rgba(90, 60, 40, .28); }
.vc .gbtn.is-small { min-height: 44px; padding: 0 16px; font: 700 16px/1 var(--font-text); }
.vc .gbtn.is-big { min-height: 56px; padding: 0 28px; font-size: 19px; }
.vc .gbtn svg { flex: none; }
.vc .round-btn { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(var(--rz-gold-rgb), .8); border-radius: 50%; background: rgba(255, 250, 242, .92); color: #8C6526; cursor: pointer; box-shadow: 0 3px 10px rgba(90, 60, 40, .18); }
.vc .round-btn[hidden] { display: none; }
.vc .link-btn { min-height: 44px; padding: 0 12px; border: 0; background: none; color: #6A4A58; font: 700 16px/1 var(--font-text); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

/* ---------- Avisos ---------- */
.vc .toast { position: absolute; z-index: 70; left: 50%; top: calc(76px + var(--safe-t)); width: max-content; max-width: calc(100% - 32px); padding: 12px 20px; border: 1px solid rgba(var(--rz-gold-rgb), .8); border-radius: 999px; background: rgba(255, 250, 242, .97); color: var(--rz-ink); font: 700 17px/1.25 var(--font-head); text-align: center; transform: translate(-50%, -10px); opacity: 0; transition: opacity .35s, transform .35s var(--ease-soft); box-shadow: 0 10px 30px rgba(90, 60, 40, .3); }
.vc .toast.is-on { opacity: 1; transform: translate(-50%, 0); }
.vc .notice { position: absolute; inset: 0; z-index: 80; display: grid; place-items: center; padding: 16px; background: rgba(70, 44, 52, .45); opacity: 0; transition: opacity .3s; }
.vc .notice.is-on { opacity: 1; }
.vc .notice-card { width: min(360px, 100%); padding: 24px 20px 20px; border-radius: 22px; text-align: center; color: var(--rz-ink); }
.vc .notice-card h2 { margin: 8px 0 6px; font: 700 22px/1.2 var(--font-head); }
.vc .notice-card p { margin: 0 0 10px; font-size: 16px; line-height: 1.45; }
.vc .notice-ic { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #25D366; color: #0B2E17; }
.vc .notice-msg { margin: 0 0 14px; padding: 12px; max-height: 38vh; overflow: auto; border-radius: 12px; background: rgba(255, 255, 255, .7); border: 1px solid rgba(var(--rz-gold-rgb), .5); color: var(--rz-ink); font: 600 16px/1.45 var(--font-text); text-align: left; white-space: pre-wrap; word-break: break-word; }
.vc .notice-card .gbtn { width: 100%; }

/* ---------- Papel / pergamino con filete dorado ---------- */
.vc .paper { position: relative; color: var(--rz-ink); background: var(--parch); border-radius: 18px;
  box-shadow: 0 0 0 1px rgba(var(--rz-gold-rgb), .85), 0 0 0 5px #FFF8EE, 0 0 0 6px rgba(var(--rz-gold-rgb), .5), 0 12px 28px rgba(90, 60, 40, .3); }
.vc .paper::before { /* manchas de acuarela en las orillas del papel */
  content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
  background: radial-gradient(40% 30% at 0% 0%, rgba(var(--rz-primary-rgb), .14), transparent 70%), radial-gradient(35% 30% at 100% 100%, rgba(169, 220, 198, .16), transparent 70%), radial-gradient(30% 25% at 100% 0%, rgba(246, 217, 138, .14), transparent 70%); }
.vc .paper > * { position: relative; }
/* (Great Vibes se reserva al nombre de la portada: en tarjetas y hojas, Playfair itálica) */
.vc .script { margin: 0; font: italic 600 19px/1.2 var(--font-head); color: #A0687E; }