/* Sopla un Deseo — hojas modales: "Todos los datos", formulario, prado de flores, aviso del demo y fotos. Papel de acuarela
   con orillas suaves (assets/papel.webp, border-image). */
.sd .hoja { position: absolute; inset: 0; z-index: 30; display: flex; align-items: flex-end; opacity: 0; transition: opacity .25s; }
.sd .hoja.is-in { opacity: 1; }
.sd .hoja.is-out { opacity: 0; }
.sd .hoja-fondo { position: absolute; inset: 0; background: rgba(90, 60, 120, .42); }
.sd .hoja .papel { position: relative; width: 100%; max-height: 88cqh; display: flex; flex-direction: column; margin: 0 6px calc(6px + var(--safe-b)); transform: translateY(20px); transition: transform .3s cubic-bezier(.2, 1.1, .3, 1); }
.sd .hoja.is-in .papel { transform: none; }
.sd .hoja.is-full .papel { max-height: calc(100cqh - 16px - var(--safe-t)); height: calc(100cqh - 16px - var(--safe-t)); margin-top: calc(8px + var(--safe-t)); }
.sd .hoja-cabeza { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 18px 18px 6px; flex: none; }
.sd .hoja-cabeza.is-solo { justify-content: flex-end; padding-bottom: 0; }
.sd .hoja-titulos { min-width: 0; }
.sd .hoja-k { margin: 0; font: 700 14px var(--f-body); color: var(--ink-2); }
.sd .hoja-cabeza h2 { margin: 0; font: 700 25px/1.12 var(--f-display); color: var(--ink); }
.sd .hoja-cuerpo { overflow: auto; padding: 4px 18px 16px; flex: 1 1 auto; min-height: 0; color: var(--ink); -webkit-overflow-scrolling: touch; }
.sd .hoja-x { flex: none; background: rgba(255, 255, 255, .7); }

/* ---------- Todos los datos ---------- */
.sd .dt-lead { margin: 0 0 8px; font: 700 18px/1.25 var(--f-body); text-align: center; }
.sd .dt-sec { margin-top: 14px; padding-top: 12px; border-top: 1.5px dashed rgba(190, 140, 200, .6); display: flex; flex-direction: column; gap: 8px; }
.sd .dt-sec h3 { display: flex; align-items: center; gap: 7px; margin: 0; font: 700 21px/1.2 var(--f-display); color: var(--ink); }
.sd .dt-ic { color: var(--rosa); display: inline-flex; }
.sd .dt-sec p { margin: 0; font: 600 15.5px/1.35 var(--f-body); }
.sd .dt-big { font: 700 21px/1.2 var(--f-body) !important; text-align: center; }
.sd .dt-faq { padding: 8px 0; }
.sd .dt-faq summary { min-height: 34px; font: 700 15.5px/1.3 var(--f-body); cursor: pointer; }
.sd .dt-faq p { padding-top: 4px; }
.sd .dt-cta { margin-top: 16px; display: flex; flex-direction: column; gap: 6px; }
.sd .limite { margin: 0; text-align: center; font: 700 14.5px var(--f-body); color: var(--ink-2); }
.sd .dt-anfitriones { margin: 12px 0 2px; text-align: center; font: 700 15px var(--f-body); color: var(--ink-2); }
.sd .regalos { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.sd .regalos li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; border-radius: 14px; background: rgba(255, 255, 255, .55); }
.sd .regalos li.is-destacado { background: #FFF2C4; }
.sd .rg-txt { display: flex; flex-direction: column; min-width: 0; font: 700 15.5px/1.2 var(--f-body); }
.sd .rg-txt small { font: 600 14px/1.25 var(--f-body); color: var(--ink-2); }
.sd .fotos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.sd .foto { position: relative; padding: 0; border: 0; border-radius: 14px; overflow: hidden; cursor: pointer; background: #fff; aspect-ratio: 4 / 3; }
.sd .foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sd .foto span { position: absolute; left: 6px; bottom: 6px; padding: 3px 8px; border-radius: 9px; background: rgba(255, 248, 238, .92); font: 700 13px var(--f-body); color: var(--ink); }

/* ---------- formulario ---------- */
.sd .fm { display: flex; flex-direction: column; gap: 10px; }
.sd .fm-vista { display: grid; place-items: center; min-height: 118px; }
.sd .fm-l { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin: 0; font: 700 15.5px/1.2 var(--f-body); }
.sd .fm-cuenta { font: 600 13px var(--f-body); color: var(--ink-2); }
.sd .fm input[type="text"], .sd .fm textarea { width: 100%; min-height: 48px; padding: 10px 14px; border: 2px solid #D9B9E0; border-radius: 16px; background: #FFFDF9; color: var(--ink); font: 700 16px/1.25 var(--f-body); resize: vertical; }
.sd .fm input::placeholder { color: #7B6890; font-weight: 600; }
.sd .fm-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.sd .fm-seg-b { min-height: 50px; padding: 0 8px; border: 2px solid #D9B9E0; border-radius: 18px; background: #FFFDF9; font: 700 15.5px var(--f-body); color: var(--ink); cursor: pointer; }
.sd .fm-seg-b[aria-checked="true"] { background: #A81F6B; border-color: #A81F6B; color: #fff; }
.sd .fm-personas { display: flex; flex-wrap: wrap; gap: 8px; }
.sd .fm-paso { flex: 1 1 42%; display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 4px 6px 4px 12px; border-radius: 18px; background: rgba(255, 255, 255, .55); }
.sd .fm-paso-l { font: 700 15.5px var(--f-body); }
.sd .fm-paso-c { display: flex; align-items: center; gap: 4px; }
.sd .fm-paso-c output { min-width: 26px; text-align: center; font: 700 20px var(--f-body); }
.sd .fm-mas { width: 44px; height: 44px; }
.sd .fm-bloque { display: flex; flex-direction: column; gap: 6px; }
.sd .fm-colores { display: flex; justify-content: space-between; gap: 2px; }
.sd .fm-flor { width: 50px; height: 50px; display: grid; place-items: center; padding: 0; border: 0; background: none; border-radius: 50%; cursor: pointer; }
.sd .fm-flor[aria-checked="true"] { box-shadow: 0 0 0 3px #8E5FB5; background: rgba(255, 255, 255, .7); }
.sd .fm-error { margin: 0; min-height: 1em; font: 700 15px var(--f-body); color: #A3132E; text-align: center; }

/* ---------- el prado de las flores ---------- */
.sd .pr-sub { margin: 0 0 8px; font: 700 15.5px/1.3 var(--f-body); text-align: center; }
.sd .pr-prado { position: relative; height: min(52cqh, 400px); border-radius: 22px; overflow: hidden; background: radial-gradient(70% 34% at 72% 32%, rgba(255, 244, 200, .9), rgba(255, 244, 200, 0) 72%), linear-gradient(180deg, #B6C4F2 0%, #F7CFE5 34%, #FFE8C4 46%, #BEE3A5 46.4%, #A3D78F 66%, #8ECD80 100%); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .5); }
.sd .pr-prado::before { content: ""; position: absolute; inset: 0; background: radial-gradient(44% 12% at 18% 47%, #A3D78F 0, transparent 100%), radial-gradient(50% 14% at 86% 49%, #B5DEA0 0, transparent 100%), radial-gradient(60% 18% at 40% 96%, rgba(120, 190, 100, .5) 0, transparent 100%); }
.sd .pr-flores { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; }
.sd .fp { position: absolute; left: var(--x); top: var(--y); transform: translate(-50%, -62%) scale(var(--p)); }
.sd .fp-flor { display: block; animation: sd-mece 4.2s ease-in-out infinite; animation-delay: var(--d); transform-origin: 50% 80%; }
@keyframes sd-mece { 0%, 100% { transform: rotate(-2.5deg); } 50% { transform: rotate(2.5deg); } }
.sd .fp.is-mia .fp-flor { filter: drop-shadow(0 0 10px rgba(255, 250, 200, .95)); }
.sd .fp.is-espera .fp-flor { opacity: 0; transform: scale(.1); }
.sd .fp.is-brota .fp-flor { animation: sd-brota .8s cubic-bezier(.2, 1.5, .4, 1) both, sd-mece 4.2s ease-in-out .8s infinite; }
.sd .fp.is-sin-vuelo .fp-flor { animation: none; }
@keyframes sd-brota { 0% { transform: scale(.1) rotate(-30deg); opacity: 0; } 60% { transform: scale(1.18) rotate(6deg); opacity: 1; } 100% { transform: scale(1) rotate(0); opacity: 1; } }
.sd .pr-semilla { position: absolute; left: 0; top: 0; width: 70px; height: 70px; transform: translate(-26px, 300px); filter: drop-shadow(0 0 6px #fff); z-index: 200; }
.sd .pr-semilla.is-vuela { animation: sd-semilla 1.5s cubic-bezier(.35, 0, .2, 1) forwards; }
@keyframes sd-semilla { 0% { transform: translate(-26px, 300px) rotate(-16deg); } 55% { transform: translate(calc(var(--dx) * .55), calc(var(--dy) * .4)) rotate(12deg); } 100% { transform: translate(var(--dx), var(--dy)) rotate(0deg); } }
.sd .pr-cuenta { margin: 10px 0; text-align: center; font: 700 16px var(--f-body); }
.sd .pr-cuenta strong { font: 700 28px var(--f-display); color: var(--rosa); }
.sd .pr-lista { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.sd .pr-lista li { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border-radius: 14px; background: rgba(255, 255, 255, .55); }
.sd .pl-f { flex: none; display: inline-flex; }
.sd .pl-nombre { flex: 1 1 auto; min-width: 0; font: 700 15.5px/1.15 var(--f-body); }
.sd .pl-meta { flex: none; font: 600 14px var(--f-body); color: var(--ink-2); }
.sd .pr-vacio { margin: 8px; text-align: center; font: 700 16px var(--f-body); }
.sd .pr-h3 { display: flex; align-items: center; gap: 6px; margin: 14px 0 6px; font: 700 20px var(--f-display); }
.sd .pr-msgs { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.sd .pr-msgs li { padding: 8px 12px; border-radius: 16px; background: #E9FBEA; display: flex; flex-direction: column; font: 600 15px/1.3 var(--f-body); }
.sd .pr-msgs strong { font-weight: 700; }
.sd .pr-acciones { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.sd .pr-acciones .flor-btn { flex: 1 1 42%; }

/* ---------- aviso del demo y fotos ---------- */
.sd .demo-nota .hoja-cuerpo { display: flex; flex-direction: column; gap: 12px; align-items: center; text-align: center; padding-bottom: 20px; font: 700 16px/1.35 var(--f-body); }
.sd .demo-ic { margin: 0; color: var(--rosa); }
.sd .visor .hoja-cuerpo { display: grid; place-items: center; position: relative; }
.sd .visor-fig { margin: 0; text-align: center; }
.sd .visor-img { max-width: 100%; max-height: 62cqh; border-radius: 16px; }
.sd .visor-pie { margin: 8px 0 0; font: 700 16px var(--f-body); }
.sd .visor-ant, .sd .visor-sig { position: absolute; top: 50%; margin-top: -25px; }
.sd .visor-ant { left: 6px; transform: scaleX(-1); }
.sd .visor-sig { right: 6px; }
@media (prefers-reduced-motion: reduce) {
  .sd .fp-flor { animation: none; }
  .sd .fp.is-brota .fp-flor { animation: none; opacity: 1; }
  .sd .pr-semilla.is-vuela { animation: none; }
}
.sd.rm .fp-flor { animation: none; }