:root{
  --ink:#745160;
  --rose:#b07b8e;
  --rose-deep:#8f596e;
  --rose-light:#d6a7b8;
  --gold:#b39865;
  --white:#fffdfa;
  --paper:url('assets/paper-ivory.jpg');
  --paper-rose:url('assets/paper-rose.jpg');
  --script:'Pinyon Script','Brush Script MT',cursive;
  --serif:'Cormorant Garamond',Georgia,serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#eeebeb;color:var(--ink);font-family:var(--serif);font-weight:400}
.app-shell{max-width:505px;margin:auto;background:#fffdfa;min-height:100vh;overflow:hidden;position:relative;box-shadow:0 0 1px #d8cbd0}
button,input{font:inherit}button{cursor:pointer}img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
.script{font-family:var(--script);font-weight:400}
.paper{background-image:linear-gradient(120deg,rgba(255,255,255,.04),rgba(255,255,255,0)),var(--paper);background-size:100% 100%;background-repeat:no-repeat}

/* PANTALLA DE APERTURA */
.opening{position:fixed;z-index:90;inset:0;background:var(--paper);background-size:cover;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;overflow:hidden;color:#755268;text-align:center;transition:opacity .75s ease,visibility .75s ease}
.opening.is-gone{opacity:0;visibility:hidden;pointer-events:none}
.cover-cross{height:75px;width:5px;background:linear-gradient(90deg,#a78e67,#c9b085,#aa8963);position:relative;flex:none;margin-top:-9px;box-shadow:1px 2px 2px #5f45361f}
.cover-cross:after{content:"";position:absolute;height:5px;width:53px;top:28px;left:50%;transform:translateX(-50%);background:linear-gradient(180deg,#c7a97d,#a4865f)}
.cover-title{font-size:clamp(24px,6.3vw,30px);letter-spacing:.15em;margin-top:18px;line-height:1.12}
.cover-title span{display:block;font-size:clamp(15px,4.2vw,18px);letter-spacing:.22em;margin-top:6px}
.cover-name{font-size:clamp(57px,14vw,82px);line-height:1.02;margin:16px 14px 0;white-space:nowrap}
.cover-envelope{position:relative;flex:none;border:0;background:transparent;width:min(84vw,402px);aspect-ratio:400/265;padding:0;margin-top:8px;isolation:isolate;filter:drop-shadow(0 9px 8px #9e637329)}
.cover-env-back,.cover-env-front,.cover-env-left,.cover-env-right,.cover-env-flap,.cover-letter{position:absolute;inset:0}
.cover-env-back{background-image:var(--paper-rose);border:1px solid #bf8b9f}
.cover-letter{left:10%;right:10%;top:6%;bottom:5%;background:var(--paper);background-size:cover;display:flex;justify-content:center;align-items:center;flex-direction:column;z-index:1;transition:transform .85s cubic-bezier(.18,.7,.15,1);font-family:var(--script);font-size:39px;color:var(--rose-deep)}
.letter-crown{font-family:Georgia,serif;font-size:30px;color:var(--gold)}
.cover-env-front{z-index:2;background-image:var(--paper-rose);clip-path:polygon(0 0,50% 54%,100% 0,100% 100%,0 100%)}
.cover-env-left{z-index:3;background-image:var(--paper-rose);clip-path:polygon(0 0,52% 54%,0 100%);filter:brightness(.96)}
.cover-env-right{z-index:3;background-image:var(--paper-rose);clip-path:polygon(100% 0,48% 54%,100% 100%);filter:brightness(.97)}
.cover-env-flap{z-index:4;background-image:var(--paper-rose);clip-path:polygon(0 0,100% 0,50% 55%);filter:brightness(1.07);transform-origin:top;transition:transform .85s ease;filter:drop-shadow(0 1px 1px #7f536033)}
.cover-env-flap:after{content:"";position:absolute;inset:0;clip-path:polygon(0 0,50% 55%,100% 0);border-bottom:1px solid #ac7b90}
.wax-circle{z-index:5;position:absolute;left:50%;top:63%;width:20%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:48% 50% 45% 49%;display:grid;place-items:center;background:radial-gradient(circle at 28% 22%,#f3c6d0 0,#c98ea6 19%,#a3667f 70%,#7a465c 100%);box-shadow:0 4px 8px #6e3e596e,inset 0 0 0 3px #b77990,inset 0 0 0 6px #dcafbe;transition:opacity .4s,transform .4s}
.wax-circle:after{content:"";position:absolute;inset:10%;border:2px solid #e2b3c3;border-radius:50%;box-shadow:inset 0 0 5px #80465880}
.wax-letter{position:relative;z-index:2;color:#fbe6d2;font-family:var(--script);font-size:clamp(27px,7vw,36px);text-shadow:1px 1px 1px #69354b85}
.opening.opening-now .cover-env-flap{transform:rotateX(175deg);z-index:0}
.opening.opening-now .cover-letter{transform:translateY(-25%)}
.opening.opening-now .wax-circle{opacity:0;transform:translate(-50%,-65%) scale(.6)}
.open-hint{position:absolute;left:max(calc(50% - 200px),7%);bottom:clamp(47px,10vh,105px);text-align:left;font-size:13px;letter-spacing:.06em;line-height:1.35;z-index:2}
.cover-message{position:absolute;right:max(calc(50% - 223px),5%);bottom:-14px;width:46%;min-height:143px;padding:22px 15px 18px;box-shadow:0 6px 14px #b393a833;transform:rotate(-2deg);z-index:3}
.cover-message p{margin:16px 0 0;font-size:clamp(14px,3.6vw,19px);line-height:1.25}
.corner-art{position:absolute;width:78px;pointer-events:none}
.corner-tl{top:0;left:0}.corner-tr{top:0;right:0;transform:scaleX(-1)}.corner-br{bottom:0;right:0;transform:rotate(180deg)}

/* CUERPO: SIN TARJETAS, COMPOSICIÓN SOBRE BLANCO */
.invitation{opacity:0;pointer-events:none;transition:opacity 1s ease;background:#fffdfa}
body.entered .invitation{opacity:1;pointer-events:auto}
.music-top{height:95px;display:flex;align-items:center;justify-content:center;gap:24px;font-style:italic;font-size:20px;color:var(--rose-deep);position:relative;z-index:4}
.music-top button{width:45px;height:45px;border-radius:50%;background:transparent;border:1px solid var(--rose);color:var(--rose-deep);display:grid;place-items:center;font-size:20px}
.story-opening{height:1040px;position:relative;background:#fffdfa}
.bunting{position:absolute;pointer-events:none;opacity:.95;z-index:4}
.bunting-top{top:74px;right:-50px;width:335px;transform:rotate(6deg)}
.large-envelope{position:absolute;left:7%;top:155px;width:66%;height:455px;filter:drop-shadow(0 8px 8px #876c7930)}
.large-env-back{position:absolute;inset:0;background-image:var(--paper-rose);clip-path:polygon(0 20%,50% 0,100% 20%,100% 100%,0 100%);background-size:cover}
.large-env-inner{position:absolute;top:18%;left:6%;right:6%;height:34%;background:#f6e4e8;clip-path:polygon(0 30%,50% 0,100% 30%,100% 100%,0 100%)}
.large-env-branch{position:absolute;width:88px;left:14%;top:20%;transform:rotate(-7deg);opacity:.85}
.large-env-front{position:absolute;left:0;right:0;bottom:0;height:57%;background-image:var(--paper-rose);clip-path:polygon(0 0,50% 45%,100% 0,100% 100%,0 100%)}
.story-paper{position:absolute;right:6%;top:360px;width:61%;min-height:555px;z-index:5;box-shadow:0 8px 16px #7a606c36;text-align:center;padding:49px 15px 40px}
.paper-cross{height:54px;width:3px;margin:0 auto 12px;background:#b8a078;position:relative}
.paper-cross:after{content:"";position:absolute;left:50%;top:19px;width:38px;height:3px;background:#b8a078;transform:translateX(-50%)}
.story-script{font-size:48px;line-height:.94;margin:0 0 6px}
.story-eyebrow{letter-spacing:.095em;font-size:15px;margin:4px 0 14px}
.story-paper h2{font-weight:500;font-size:37px;letter-spacing:.035em;margin:0;line-height:1.1}
.story-subtitle{font-size:14px;letter-spacing:.1em;margin:8px 0 10px}
.story-name{font-size:54px;line-height:.87;margin:11px auto 12px;overflow-wrap:anywhere;max-width:250px}
.story-date{font-size:22px;line-height:1.1;margin:10px auto 0}
.story-city{font-size:32px;line-height:1;margin:2px auto 0}
.verse-note{position:absolute;top:610px;left:5%;width:32%;min-height:245px;border-radius:48% 48% 42% 47%;box-shadow:0 0 0 1px #dbbfc5;text-align:center;padding:27px 12px 18px;transform:rotate(-7deg);z-index:6}
.verse-note p{font-size:clamp(13px,3.5vw,19px);line-height:1.25;margin:0}
.verse-note .verse-last{font-style:italic;margin-top:18px}
.princess-sticker{position:absolute;top:100px;left:7%;height:165px;width:115px;object-fit:contain;z-index:6;filter:drop-shadow(0 3px 3px #9d738a2b)}

.family-scene{height:1060px;position:relative;background:#fffdfa;padding-top:58px}
.family-paper{position:relative;margin:15px 10% 0 auto;width:71%;min-height:610px;box-shadow:0 7px 17px #6d545a29;padding:78px 20px 45px;text-align:center}
.paper-wax{position:absolute;top:-32px;left:calc(50% - 42px);width:84px;height:84px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,#e5afc0,#b37b94 50%,#825069 100%);box-shadow:0 5px 8px #6c425c6d,inset 0 0 0 5px #b07790,inset 0 0 0 8px #d29db1;color:#f8deca;font:38px var(--script);transform:rotate(-9deg)}
.paper-wax span{border:2px solid #edc3cb;border-radius:50%;height:68%;width:68%;display:grid;place-items:center}
.family-eyebrow{font-size:17px;letter-spacing:.09em;margin:0 0 15px}
.family-paper h2{font-size:59px;line-height:1;margin:0 0 24px}
.family-names{font-size:26px;line-height:1.43;margin:0 auto}
.family-flourish{color:#c39fb0;font-size:27px;margin:18px 0}
.family-paper .godparent-title{margin-top:0}
.family-corner{position:absolute;bottom:255px;left:8%;width:112px;transform:rotate(180deg)}
.family-bunting{bottom:60px;left:-45px;width:93%;transform:rotate(7deg)}

.events-scene{position:relative;padding:8px 0 40px;background:#fffdfa}
.side-flora{position:absolute;top:15px;bottom:0;width:49px;background-image:url('assets/floral-side.png');background-repeat:repeat-y;background-size:49px auto;opacity:.85;pointer-events:none}
.side-left{left:12px}.side-right{right:12px;transform:scaleX(-1)}
.event-block{min-height:475px;padding:5px 69px 37px;text-align:center;position:relative}
.event-icon{width:64px;height:74px;margin:0 auto 11px;object-fit:contain}
.event-block h2{font-size:66px;line-height:1;margin:0 0 15px}
.event-time{font-size:24px;margin:5px 0 0}
.event-place{font-size:31px;line-height:1.04;margin:4px auto 0;max-width:345px}
.event-address{font-size:18px;line-height:1.2;margin:10px auto 16px;max-width:300px}
.event-caption{font-size:15px;letter-spacing:.11em;margin:0 0 18px}
.event-link{display:inline-flex;align-items:center;justify-content:center;border:1px solid #b28395;padding:8px 23px;border-radius:50px;min-height:43px;font-size:23px;line-height:1;position:relative;z-index:2;background:#fffdfae8}
.event-link:focus-visible{outline:2px solid #ad708b;outline-offset:3px}
.reception{margin-top:30px}

.gift-scene{height:510px;position:relative;background:#fffdfa}
.gift-bunting{top:-105px;right:-40px;width:57%;transform:rotate(-3deg)}
.gift-envelope{position:absolute;width:47%;height:330px;left:12%;top:95px;background-image:var(--paper-rose);background-size:100% 100%;box-shadow:0 9px 15px #9b78843f;transform:rotate(-5deg)}
.gift-seal{position:absolute;z-index:3;top:202px;left:29%;width:76px;height:76px;display:grid;place-items:center;border-radius:48%;background:radial-gradient(circle at 30% 20%,#f1c1cc,#c78a9f 56%,#915d72);box-shadow:0 3px 8px #8c5a7170,inset 0 0 0 5px #bd8199,inset 0 0 0 8px #e2b4c3;font:34px var(--script);color:#f8e4da;transform:rotate(-9deg)}
.gift-letter{position:absolute;right:7%;top:264px;width:62%;min-height:190px;box-shadow:0 8px 16px #8d718033;padding:25px 24px 22px;text-align:center;z-index:4;transform:rotate(2deg)}
.gift-letter h2{font-size:59px;line-height:1;margin:0 0 5px}
.gift-text{font-size:27px;line-height:1.08;margin:0 0 8px}
.gift-small{font-size:13px;letter-spacing:.06em;line-height:1.2}
.gift-bird{position:absolute;right:7%;top:107px;width:78px;transform:rotate(9deg)}

.countdown-section{height:264px;background:#efe5e6;text-align:center;padding:34px 14px 25px}
.countdown-section>p{font-size:25px;letter-spacing:.18em;margin:0 0 18px}
.countdown{display:flex;align-items:flex-start;justify-content:center;gap:8px}
.countdown div{display:flex;flex-direction:column;min-width:44px}
.countdown strong{font-size:clamp(35px,9vw,54px);font-weight:400;line-height:1.05;letter-spacing:.04em}
.countdown b{font-weight:400;font-size:38px;line-height:1}
.countdown small{font-size:16px;letter-spacing:.07em;white-space:nowrap;margin-top:8px}
.countdown-section>.script{font-size:49px;display:block;line-height:1;margin-top:14px}

.end-scene{min-height:735px;background:#fffdfa;padding:45px 18px 25px;position:relative}
.end-top-ornament{position:absolute;top:-22px;left:50%;transform:translateX(-50%);font-size:42px;color:#b18598}
.day-info{text-align:center;margin:0 0 70px}
.day-info h2{font-size:67px;line-height:1;margin:0 0 12px}
.day-info p{font-size:17px;letter-spacing:.09em;margin:0}
.rsvp-paper{position:relative;padding:61px 34px 50px;max-width:442px;margin:0 auto;box-shadow:0 2px 11px #8c718024}
.rsvp-paper h2{font-size:69px;line-height:1;margin:0 0 18px;text-align:center}
.rsvp-paper>p{font-size:23px;line-height:1.2;text-align:center;margin:0 0 8px}
.rsvp-paper .pases-line{font-size:18px}
.rsvp-paper form{margin-top:22px;display:flex;flex-direction:column;align-items:stretch;gap:11px;font-size:23px}
.rsvp-paper input[type=text]{min-height:50px;border:1px solid #bfa2ab;background:#fffefc;padding:10px 13px;border-radius:0;width:100%;font-size:21px;color:var(--ink);outline-color:#bc8d9e}
.rsvp-paper fieldset{border:0;margin:13px 0 0;padding:0;display:flex;gap:13px;flex-wrap:wrap}
.rsvp-paper legend{margin-bottom:10px}
.radio-label{font-size:21px;white-space:nowrap;display:flex;align-items:center;gap:6px}
.radio-label input{accent-color:#8f6175;width:17px;height:17px;margin:0}
.confirm-button{border:1px solid #a96b85;background:#b88498;color:white;font-size:21px;padding:14px 10px;margin-top:13px;cursor:pointer}
.end-footer{padding:66px 16px 44px;min-height:410px;text-align:center;background:#fffdfa}
.footer-heading{font-size:59px;margin:0 0 17px;line-height:1}
.footer-name{font-size:32px;letter-spacing:.18em;text-transform:uppercase;margin:0 0 12px}
.footer-date{font-size:18px;letter-spacing:.13em;margin:0 0 42px}
.end-footer a{font-size:20px;text-decoration:underline;text-underline-offset:6px}
.footer-credit{font-size:15px;letter-spacing:.06em;margin:70px 0 0}
.watermark{position:fixed;z-index:60;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-28deg);pointer-events:none;color:#a3718247;letter-spacing:.22em;font:bold clamp(44px,13vw,76px) Montserrat,Arial,sans-serif}.watermark[hidden]{display:none}

@media (max-width:430px){
 .opening .cover-name{font-size:clamp(53px,13vw,72px)}
 .cover-envelope{width:84vw;margin-top:12px}
 .cover-message{width:48%}
 .music-top{font-size:17px;gap:18px}
 .story-opening{height:900px}
 .large-envelope{top:153px;height:386px}
 .story-paper{top:322px;min-height:484px;padding:37px 12px 31px;width:62%}
 .paper-cross{height:47px;margin-bottom:9px}
 .story-script{font-size:42px}.story-eyebrow{font-size:12px;margin-bottom:9px}.story-paper h2{font-size:31px}.story-subtitle{font-size:12px}.story-name{font-size:45px}.story-date{font-size:19px}.story-city{font-size:28px}
 .verse-note{top:565px;width:31%;min-height:210px;padding:23px 9px}
 .verse-note p{font-size:14px}
 .family-scene{height:920px}.family-paper{min-height:550px;padding:76px 13px 35px}.family-paper h2{font-size:51px}.family-names{font-size:22px}.family-corner{bottom:220px}.family-bunting{bottom:40px}
 .event-block{min-height:445px;padding-left:58px;padding-right:58px}.event-block h2{font-size:58px}.event-place{font-size:27px}.event-address{font-size:16px}
 .gift-scene{height:450px}.gift-envelope{height:285px}.gift-letter{top:235px}.gift-letter h2{font-size:50px}.gift-text{font-size:23px}.gift-seal{top:176px}
 .countdown-section>p{font-size:20px}.countdown{gap:6px}.countdown small{font-size:13px}.countdown-section>.script{font-size:44px}
 .end-scene{min-height:675px}.day-info h2{font-size:58px}.rsvp-paper h2{font-size:58px}.rsvp-paper>p{font-size:20px}.rsvp-paper form{font-size:21px}
}
@media (max-width:365px){
 .open-hint{font-size:10px}.cover-message{right:3%;bottom:3px;padding:16px 10px;min-height:120px}.cover-message p{font-size:13px}
 .story-paper{width:64%;right:3%;padding:36px 9px 25px}.story-paper h2{font-size:28px}.story-name{font-size:39px}.story-date{font-size:16px}.story-city{font-size:24px}
 .verse-note{width:32%;left:3%;padding:18px 6px;top:565px}.verse-note p{font-size:12px}
 .family-paper{width:76%;margin-right:8%}.family-names{font-size:20px}
 .event-block{padding-left:55px;padding-right:55px}.event-block h2{font-size:51px}.event-place{font-size:24px}.event-address{font-size:15px}
 .countdown{gap:3px}.countdown strong{font-size:32px}.countdown small{font-size:11px}.countdown b{font-size:31px}.countdown div{min-width:38px}
 .rsvp-paper{padding-left:19px;padding-right:19px}.rsvp-paper h2{font-size:50px}.radio-label{font-size:18px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* Ajustes de encuadre: el mensaje se cruza con el borde del sobre, como en la demo. */
.cover-title{margin-top:13px}
.cover-name{margin-top:10px}
.cover-envelope{margin-top:2px}
.cover-message{top:calc(56vw + 175px);bottom:auto;min-height:137px;padding:21px 15px 16px}
.cover-message .corner-art{width:47px;opacity:.7}
.cover-message p{margin-top:12px}
.open-hint{top:calc(56vw + 226px);bottom:auto}
.gift-letter .corner-art{width:45px;opacity:.55}
.gift-small{display:block;max-width:178px;margin:0 auto;font-size:12px}
@media (min-width:650px){.cover-message{top:450px}.open-hint{top:498px}}
@media (max-width:365px){.cover-message{min-height:133px;padding:15px 9px 13px}.cover-message .corner-art{width:35px}.cover-message p{margin-top:11px;font-size:13px}.open-hint{font-size:10px}}
.open-hint{width:148px;font-size:clamp(10px,2.8vw,13px);white-space:normal;letter-spacing:.04em;line-height:1.25}

/* REVISIÓN DE PRINCESAS BEBÉ Y SOBRE DE PAPEL FOTOGRÁFICO — 14 NOV 2026 */
:root { --envelope-texture: url('assets/paper-rose.jpg'); --envelope-interior: url('assets/paper-pinklight.jpg'); }

/* Sobre rectangular con costuras diagonales, trama visible, tarjeta arqueada y sello real. */
.cover-envelope{
 width:min(87vw,408px);
 aspect-ratio:400 / 270;
 margin-top:10px;
 overflow:visible;
 perspective:850px;
 filter:drop-shadow(0 13px 9px rgba(115,72,89,.25));
}
.cover-env-back,.cover-env-front,.cover-env-left,.cover-env-right,.cover-env-flap,.cover-env-openflap,.cover-letter { backface-visibility:hidden; }
.cover-env-back{
 background:linear-gradient(150deg,rgba(255,255,255,.3),transparent 47%),var(--envelope-texture);
 background-size:cover;
 border:1px solid #cb91a8;
 box-shadow:inset 0 0 0 1px rgba(255,239,245,.35),inset 0 8px 14px rgba(142,78,108,.07);
}
.cover-env-openflap{
 position:absolute;
 left:0;
 width:100%;
 height:90%;
 top:-63%;
 z-index:0;
 background:linear-gradient(150deg,rgba(254,245,248,.64),rgba(242,199,216,.8)),var(--envelope-texture);
 background-size:cover;
 clip-path:polygon(0 100%,50% 0,100% 100%);
 box-shadow:0 0 0 1px rgba(168,96,122,.2);
 opacity:0;
 transform:scaleY(.35);
 transform-origin:center bottom;
 transition:opacity .1s ease .15s, transform .65s cubic-bezier(.16,.78,.25,1) .1s;
}
.cover-letter{
 left:9%;right:9%;top:3%;bottom:4%;
 display:flex;flex-direction:column;justify-content:center;align-items:center;
 padding:22px 11px 20px;
 border:1px solid #e2c5c5;
 border-bottom:3px solid #d1b4ae;
 border-radius:47% 47% 1% 1% / 26% 26% 1% 1%;
 background:linear-gradient(120deg,rgba(255,255,255,.15),rgba(255,255,255,0)),var(--paper);
 background-size:100% 100%;
 color:var(--ink);
 transform:translateY(9%);
 box-shadow:0 6px 12px rgba(123,82,91,.18);
 z-index:1;
 transition:transform 1.05s cubic-bezier(.17,.68,.17,1) .23s;
}
.cover-letter:before{content:"";position:absolute;inset:9px 8px 7px;pointer-events:none;border:1px solid rgba(177,142,101,.32);border-radius:47% 47% 0 0 / 25% 25% 0 0;}
.cover-letter .letter-crown{font-family:Georgia,serif;font-size:26px;line-height:1;color:#c4a16d;margin-bottom:3px}
.cover-letter .letter-small{font-family:var(--serif);font-size:clamp(11px,2.8vw,14px);letter-spacing:.08em;line-height:1}
.cover-letter .letter-person{font-family:var(--script);font-size:clamp(35px,10vw,49px);line-height:1.12;margin:4px auto;white-space:nowrap;color:var(--rose-deep)}
.cover-letter .letter-date{font-family:var(--serif);font-size:clamp(10px,2.8vw,13px);letter-spacing:.1em;line-height:1.1}
.cover-env-front{
 z-index:2;
 background:linear-gradient(0deg,rgba(194,115,151,.08),rgba(255,236,245,.16)),var(--envelope-texture);
 background-size:100% 100%;
 clip-path:polygon(0 0,50% 54%,100% 0,100% 100%,0 100%);
 box-shadow:inset 0 -2px 6px rgba(116,64,88,.1);
}
.cover-env-left{z-index:3;background:linear-gradient(70deg,rgba(175,100,128,.13),transparent),var(--envelope-texture);background-size:cover;clip-path:polygon(0 0,52% 54%,0 100%);filter:brightness(.985) drop-shadow(1px 0 1px #a46c82);}
.cover-env-right{z-index:3;background:linear-gradient(290deg,rgba(175,100,128,.12),transparent),var(--envelope-texture);background-size:cover;clip-path:polygon(100% 0,48% 54%,100% 100%);filter:brightness(.985) drop-shadow(-1px 0 1px #a46c82);}
.cover-env-flap{
 z-index:4;background:linear-gradient(180deg,rgba(255,239,245,.38),rgba(190,102,140,.07)),var(--envelope-texture);
 background-size:cover;
 clip-path:polygon(0 0,100% 0,50% 54%);
 transform-origin:50% 0;
 transform:rotateX(0deg);
 filter:drop-shadow(0 2px 1px rgba(130,78,101,.32));
 transition:transform .78s cubic-bezier(.2,.6,.3,1),opacity .65s ease;
}
.cover-env-flap:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 49.6%,rgba(126,74,91,.15) 50%,transparent 50.6%);}
.wax-circle{
 width:24%;
 top:59%;
 background:url('assets/sello-cera-SA.png') center/contain no-repeat;
 border-radius:50%;
 box-shadow:none;
 filter:drop-shadow(0 4px 3px rgba(122,69,83,.34));
 transition:transform .38s ease,opacity .3s ease;
}
.wax-circle:after{display:none}
.wax-circle:hover{transform:translate(-50%,-50%) scale(1.045)}
.opening.opening-now .cover-env-openflap{opacity:1;transform:scaleY(1)}
.opening.opening-now .cover-env-flap{transform:rotateX(175deg);z-index:0;opacity:0}
.opening.opening-now .cover-letter{transform:translateY(-66%)}
.opening.opening-now .wax-circle{opacity:0;transform:translate(-50%,-80%) scale(.65)}

/* Actualización de papeles secundarios: misma rosa empolvada y sello que la portada. */
.large-env-back,.large-env-front,.gift-envelope{background-image:var(--envelope-texture)}
.large-env-back,.large-env-front{filter:drop-shadow(0 1px 1px rgba(99,59,76,.16))}
.large-env-inner{background-image:linear-gradient(160deg,rgba(255,255,255,.18),rgba(229,180,205,.36)),var(--envelope-interior);background-size:cover}
.paper-wax,.gift-seal{
 background:url('assets/sello-cera-SA.png') center/contain no-repeat;
 border-radius:50%;
 box-shadow:none;
 color:transparent;
 filter:drop-shadow(0 4px 4px rgba(118,65,88,.29));
}
.paper-wax span{visibility:hidden}

/* Detalles de princesa con la misma composición por capas del ejemplo. */
.story-princess-ornament{font-family:Georgia,serif;color:var(--gold);font-size:35px;line-height:1;display:block;margin:0 auto 8px}
.story-eyebrow{margin-top:8px}
.princess-sticker{
 top:108px;left:2%;width:190px;height:272px;
 object-fit:contain;object-position:top center;
 z-index:6;
 filter:drop-shadow(0 5px 7px rgba(142,90,114,.24));
}
.story-bow{position:absolute;z-index:6;top:278px;left:13%;color:#c99aaa;font-size:22px;text-shadow:0 1px #fff;transform:rotate(-10deg);pointer-events:none}
.story-bow span{color:#c1a16a;font-size:16px}
.story-sparkles{position:absolute;z-index:6;top:375px;right:2%;font-size:26px;color:#cfb482;pointer-events:none}
.family-crown{position:absolute;right:8%;bottom:164px;color:#c8ac82;font-size:28px;opacity:.8}
.cover-cross{background:linear-gradient(90deg,#b89a6b,#d0b47e,#a7885e)}

/* La portada debe conservar un dibujo claro a 320, 390 y 430 px. */
@media(max-width:430px){
  .cover-envelope{width:87vw;max-width:404px}
  .princess-sticker{width:168px;height:253px;left:1%;top:106px}
  .story-bow{top:275px;left:11%}
  .story-paper{padding-top:45px}
  .story-princess-ornament{font-size:27px;margin-bottom:7px}
}
@media(max-width:365px){
  .cover-envelope{width:88vw}
  .princess-sticker{width:150px;height:233px;left:1%;top:119px}
  .story-bow{top:277px;left:10%}
  .story-paper{padding-top:41px}
  .story-princess-ornament{font-size:25px}
}

/* La tarjeta es protagonista mientras sale del sobre. */
.opening .cover-title,.opening .cover-name{transition:opacity .45s ease,transform .5s ease}
.opening.opening-now .cover-title,.opening.opening-now .cover-name{opacity:.18;transform:translateY(-8px)}
.cover-message:after{content:"♛";position:absolute;bottom:2px;right:7px;color:rgba(184,148,98,.7);font-size:16px}