@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap');

:root{--background:#fff8fa;--paper:#fffdfd;--ink:#4c2837;--muted:#856775;--pink:#bd3f70;--pink-hover:#a42e5c;--pink-light:#fbe7ef;--border:#edd5df;--green:#426b55;--serif:'Playfair Display',Georgia,serif;--sans:'DM Sans',Arial,sans-serif;--shadow:0 9px 24px #67304b09}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--background);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}body.modal-open{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:default}a{color:inherit;text-decoration:none}button, a, input{outline-offset:5px}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--pink)}button{color:inherit}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-family:var(--serif);font-weight:500}h2{font-size:clamp(2rem,3.5vw,2.8rem);line-height:1.3;letter-spacing:-1.2px}h2 em{font-weight:400;color:var(--pink)}[hidden]{display:none!important}.section-width{max-width:1180px;margin-inline:auto;width:calc(100% - 112px)}.eyebrow{display:block;font-size:.75rem;font-weight:650;letter-spacing:2px;color:var(--pink);line-height:1.6}.skip-link{position:fixed;left:20px;top:-100px;z-index:100;background:var(--ink);color:white;padding:12px 20px;border-radius:8px}.skip-link:focus{top:15px}.site-header{height:90px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding-inline:max(56px,calc((100vw - 1180px)/2));gap:20px;background:var(--background)}.brand{display:flex;align-items:center;gap:5px;font-family:var(--serif);font-size:1.4rem;white-space:nowrap;letter-spacing:-.6px}.brand-symbol{font-family:Georgia,serif;font-size:2.2rem;color:var(--pink);margin-right:8px;line-height:1}.brand-dot{color:var(--pink);margin-left:-4px}.header-progress{display:flex;align-items:center;gap:15px;font-size:.8rem;color:var(--muted)}progress{appearance:none;width:90px;height:5px;border:none;border-radius:10px;background:var(--pink-light);overflow:hidden}progress::-webkit-progress-bar{background:var(--pink-light)}progress::-webkit-progress-value{background:var(--pink);border-radius:10px;transition:width .4s}progress::-moz-progress-bar{background:var(--pink);border-radius:10px}.small-heart{color:var(--pink);font-size:1.7rem}.hero{min-height:680px;display:grid;grid-template-columns:1.05fr 1fr;gap:28px;align-items:center;padding-block:72px 88px}.tiny-star{font-size:1rem;margin-right:8px}.hero h1{position:relative;font-size:clamp(3.6rem,5.8vw,5.4rem);line-height:1.12;letter-spacing:-3px;margin:22px 0 26px;max-width:590px}.hero h1 em{font-weight:400;color:var(--pink)}.title-spark{font-size:3.2rem;font-family:Georgia,serif;color:var(--pink);position:absolute;transform:rotate(-12deg);margin-left:26px;bottom:4px}.hero-description{font-size:1.13rem;line-height:1.8}.hero-invitation{font-size:.95rem;color:var(--muted);line-height:1.85;margin-top:14px}.button{border:1px solid transparent;border-radius:7px;padding:14px 23px;min-height:50px;display:inline-flex;justify-content:center;align-items:center;gap:25px;font-size:.9rem;font-weight:550;transition:background .2s,transform .2s,box-shadow .2s}.button:not(:disabled):hover{transform:translateY(-2px)}.button-primary{background:var(--pink);color:white;box-shadow:0 4px 10px #bd3f7014}.button-primary:not(:disabled):hover{background:var(--pink-hover);box-shadow:0 6px 18px #bd3f7020}.button-primary:disabled{background:#edd9e2;color:#7d5b6a;box-shadow:none}.button span[aria-hidden]{font-size:1.3rem}.button-secondary{background:white;border-color:var(--border);color:var(--pink)}#start-button{margin-top:28px}.hero-footnote{display:flex;gap:8px;align-items:center;margin-top:17px;font-size:.75rem;color:var(--muted)}.hero-footnote span{font-size:1.2rem;color:var(--pink)}.hero-collage{height:475px;position:relative;min-width:0;margin-top:5px}.polaroid{padding:12px 12px 0;background:var(--paper);box-shadow:0 4px 8px #532d3910,0 12px 32px #532d3910;border:1px solid #f0e3e8;position:relative}.polaroid figcaption{font-family:var(--serif);font-size:1.02rem;font-style:italic;text-align:center;padding:13px 0 16px;line-height:1.3}.photo-placeholder,.photo-image{width:100%;aspect-ratio:1/1.06;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;background:#f4dce6;color:#ab728b;object-fit:cover}.photo-placeholder svg{width:30px;height:30px;stroke-width:1.1;opacity:.85}.photo-placeholder span{font-size:.65rem;letter-spacing:2px}.hero-photo{position:absolute;width:215px}.photo-one{top:41px;left:12px;transform:rotate(-9deg);z-index:1}.photo-two{top:11px;right:4px;transform:rotate(9deg);z-index:2}.photo-two .photo-placeholder{background:#f1e7e7;color:#ac858c}.photo-three{top:213px;left:125px;transform:rotate(-2deg);z-index:3}.photo-three .photo-placeholder{background:#edcedc;color:#a36883}.photo-one:before,.photo-three:before,.memory-photo:nth-child(odd):before{content:'';position:absolute;width:82px;height:26px;background:#eeb1cc80;z-index:2;left:calc(50% - 41px);top:-12px;transform:rotate(3deg);border-left:2px dashed #fff6;border-right:2px dashed #fff6}.photo-three:before{background:#ecda9e80;transform:rotate(-6deg)}.collage-note{position:absolute;top:-30px;left:14px;z-index:4;font-family:var(--serif);font-style:italic;font-size:1rem;line-height:1.4;transform:rotate(-8deg);color:var(--muted)}.collage-note span{position:absolute;right:-42px;top:17px;font-size:2.5rem;transform:rotate(-15deg)}.love-stamp{position:absolute;width:108px;height:108px;border:1px solid #c27191;border-radius:50%;right:-7px;bottom:24px;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f9e4ed;color:#a8446d;font-size:.57rem;letter-spacing:1.6px;line-height:1.3;transform:rotate(12deg);outline:1px dashed #c27191;outline-offset:-6px}.love-stamp span{font-size:2.35rem;line-height:1;margin-bottom:-12px}.collage-spark{position:absolute;left:15px;bottom:60px;font-size:3.7rem;color:#d888a7;font-family:Georgia,serif;transform:rotate(18deg)}.ribbon{border-block:1px solid var(--border);background:#fbeaf1;display:flex;justify-content:space-around;align-items:center;gap:37px;white-space:nowrap;overflow:hidden;height:55px;color:#9a546f;font-size:.69rem;letter-spacing:2px;font-weight:500}.ribbon i{font-size:1rem;font-style:normal}.journey-section{padding-block:84px 64px}.section-heading{text-align:center}.section-heading h2{margin-top:10px}.section-heading p{color:var(--muted);font-size:.95rem;margin-top:15px}.journey{max-width:920px;margin:50px auto 0;position:relative;padding-bottom:36px}.path-line{position:absolute;left:50%;top:25px;bottom:21px;border-left:2px dashed #dfb5c8;transform:translateX(-1px)}.stage{position:relative;display:grid;grid-template-columns:1fr 90px 1fr;align-items:center;min-height:251px}.stage-card{grid-column:1;grid-row:1;border:1px solid var(--border);border-radius:13px;padding:25px 28px 22px;background:var(--paper);box-shadow:var(--shadow);position:relative;transition:border .25s,box-shadow .25s}.stage-pin{grid-column:2;grid-row:1;justify-self:center;z-index:1;border:1px solid #dec0ce;border-radius:50%;width:42px;height:42px;background:var(--background);display:flex;align-items:center;justify-content:center;color:#936f7f;font-size:.78rem;font-weight:600}.stage-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px}.stage-icon{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--pink-light);color:var(--pink);font-family:Georgia,serif;font-size:1.6rem}.stage-status{font-size:.62rem;letter-spacing:1.2px;color:var(--muted);font-weight:550}.stage h3{font-size:1.42rem;letter-spacing:-.3px;line-height:1.35;margin-bottom:10px}.stage p{font-size:.875rem;line-height:1.8;color:var(--muted);max-width:320px}.stage-button{border:0;background:transparent;padding:14px 0 0;display:flex;width:100%;align-items:center;justify-content:space-between;text-align:left;gap:12px;font-size:.82rem;color:var(--pink);font-weight:550;min-height:43px}.stage-button span[aria-hidden]{font-size:1.3rem}.stage-button:not(:disabled):hover{text-decoration:underline;text-underline-offset:4px}.stage-button:disabled{color:#937381}.stage-button svg{width:15px;height:15px;display:block}.path-note{grid-column:3;grid-row:1;margin-left:43px;font-family:var(--serif);font-style:italic;font-size:1.25rem;line-height:1.6;color:#ae788f;transform:rotate(-5deg);max-width:230px;justify-self:start}.path-note span{display:block;font-size:1.75rem;line-height:1.2;margin-left:70px}.stage:nth-of-type(even) .stage-card{grid-column:3}.stage:nth-of-type(even) .path-note{grid-column:1;justify-self:end;margin-right:43px;margin-left:0;text-align:right;transform:rotate(4deg)}.stage:nth-of-type(even) .path-note span{margin-right:70px;margin-left:0}.is-current .stage-card{border-color:#d68aa9;box-shadow:0 5px 30px #bd3f700b}.is-current .stage-pin{background:var(--pink);color:white;border-color:var(--pink);box-shadow:0 0 0 7px var(--background)}.is-current .stage-status{color:var(--pink)}.is-locked .stage-card{background:#fff9fb}.is-locked .stage-icon{background:#f3e9ee;color:#967482}.is-complete .stage-pin{background:#e9f1eb;color:var(--green);border-color:#adc9b6}.is-complete .stage-status{color:var(--green)}.is-complete .stage-card{border-color:#cadbcf}.path-finish{position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-size:1.85rem;color:#b76386;line-height:1.2;background:var(--background);padding:0 8px}.journey-reassurance{text-align:center;color:var(--muted);font-size:.8rem;margin-top:27px}.memories-section{padding-block:66px 50px;background:#f9eaf0;border-block:1px solid #f1dbe4;overflow:hidden}.memories-heading{display:flex;justify-content:space-between;align-items:end;gap:30px}.memories-heading h2{margin-top:9px;font-size:2.3rem}.memories-heading>p{font-size:.85rem;line-height:1.8;color:var(--muted);margin-bottom:4px}.memory-collage{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;align-items:start;margin:48px 0 35px;padding:0 5px}.memory-photo{padding:9px 9px 0;transform:rotate(-5deg)}.memory-photo:nth-child(2){transform:rotate(4deg);margin-top:16px}.memory-photo:nth-child(3){transform:rotate(-3deg);margin-top:-7px}.memory-photo:nth-child(4){transform:rotate(5deg);margin-top:17px}.memory-photo:nth-child(5){transform:rotate(-4deg)}.memory-photo figcaption{font-size:.85rem;padding:14px 0 16px}.memory-photo .photo-placeholder{background:#ecd5df}.memory-photo:nth-child(2n) .photo-placeholder{background:#f1e3e0}.memory-photo:nth-child(3n) .photo-placeholder{background:#e4c6d6}.memory-signoff{font-family:var(--serif);font-style:italic;text-align:center;font-size:1.13rem;color:#a7617f}.memory-signoff span{display:inline-block;margin-left:10px;font-size:1.5rem;vertical-align:middle}.surprise-section{padding-block:82px}.surprise-box{text-align:center;padding:44px 24px 42px;position:relative;border:1px solid var(--border);border-radius:15px;background:radial-gradient(ellipse at center top,#f9e5ef 0,transparent 60%)}.surprise-icon{display:flex;margin:0 auto 17px;width:53px;height:53px;border-radius:50%;background:#f5dbe7;align-items:center;justify-content:center;color:#b86b8d;font-size:2rem}.surprise-box h2{margin-top:12px}.surprise-box>p{margin-top:19px;color:var(--muted);font-size:.95rem;line-height:1.9}.surprise-box .button{margin-top:27px;gap:12px}.button svg{display:block;width:16px;height:16px}.surprise-count{display:block;font-size:.75rem;color:var(--muted);margin-top:14px}.surprise-box.is-ready{border-color:#c77399;background:radial-gradient(ellipse at center top,#f7d2e3 0,transparent 75%)}.gift-reveal{text-align:center;max-width:760px;margin:auto;animation:appear .65s ease}.gift-reveal h2{font-size:clamp(2.8rem,5vw,4.6rem);line-height:1.2;margin-block:18px 26px}.gift-message{max-width:640px;margin:auto;font-size:1rem;line-height:1.95;color:var(--muted);white-space:pre-line}.clue-card{background:var(--paper);border:1px solid #d995b4;border-radius:12px;padding:35px;max-width:580px;margin:34px auto 0;box-shadow:var(--shadow)}.clue-card h3{font-size:1.7rem;margin:12px 0}.clue-card>p{font-size:1.03rem;line-height:1.85;white-space:pre-line}.clue-card .text-button{margin-top:18px}.clue-card #extra-clue{background:var(--pink-light);border-radius:6px;padding:14px;margin-top:15px;font-size:.9rem}.gift-signature{font-family:var(--serif);font-style:italic;color:var(--pink);font-size:1.25rem;margin:25px 0}.site-footer{border-top:1px solid var(--border);padding-block:28px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--muted);font-size:.75rem}.site-footer>span:last-child>span{color:var(--pink);margin-left:5px;font-size:1rem}.noscript-note{position:fixed;bottom:0;left:0;right:0;padding:18px;background:var(--ink);color:white;text-align:center;z-index:20}

dialog{color:var(--ink);background:var(--background);border:1px solid var(--border);border-radius:20px;padding:0;width:min(530px,calc(100% - 32px));max-height:calc(100dvh - 40px);box-shadow:0 30px 100px #3e192f33;overflow:auto}dialog::backdrop{background:#36202d75;backdrop-filter:blur(5px)}dialog[open]{animation:appear .22s ease}.dialog-inner{position:relative;padding:40px 34px 24px;text-align:center}.close-dialog{position:absolute;right:12px;top:10px}.icon-button{border:0;background:transparent;width:42px;height:42px;border-radius:50%;font-size:1.8rem;line-height:1;color:var(--muted)}.icon-button:hover{background:var(--pink-light)}.dialog-inner h2{font-size:2rem;line-height:1.3;margin:16px 0 13px;letter-spacing:-.8px}.dialog-inner>p:not(.game-feedback){font-size:.9rem;line-height:1.8;color:var(--muted)}.dialog-dots{display:flex;gap:6px;justify-content:center;margin-top:12px}.dialog-dots span{width:21px;height:4px;border-radius:4px;background:#ead4df}.dialog-dots .filled{background:var(--pink)}#challenge-content{margin-top:23px}.game-grid{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(0,1fr))}.heart-tile,.memory-tile{border:1px solid var(--border);border-radius:10px;background:var(--paper);color:var(--pink);aspect-ratio:1;min-height:48px;display:flex;align-items:center;justify-content:center;font-size:2rem;transition:transform .2s,background .2s}.heart-tile:not(:disabled):hover,.memory-tile:not(:disabled):hover{background:var(--pink-light);transform:translateY(-2px)}.heart-tile.found{background:#e9f1eb;border-color:#bdcfbf;color:var(--green);font-size:1.4rem}.heart-tile.decoy{color:#b78d4d;background:#fff8e9}.game-counter{font-size:.8rem;color:var(--muted);margin-top:15px}.memory-tile{background:#f3d8e5;color:var(--pink);font-family:var(--serif);font-size:1.7rem}.memory-tile.flipped{background:white;font-family:var(--sans)}.memory-tile.matched{background:#e9f1eb;border-color:#bdcfbf}.game-feedback{font-size:.9rem;line-height:1.7;min-height:3.4em;margin-top:18px;display:flex;justify-content:center;align-items:center;color:var(--pink)}.dialog-actions{border-top:1px solid var(--border);padding-top:12px;display:flex;justify-content:space-between;gap:15px}.text-button{background:transparent;border:0;padding:8px 0;color:var(--pink);font-size:.82rem;min-height:42px;text-underline-offset:4px}.text-button:hover{text-decoration:underline}.muted-button{color:var(--muted)}.riddle{background:#f9e8f0;padding:23px;border-radius:12px;font-family:var(--serif);font-style:italic;font-size:1.2rem;line-height:1.85;white-space:pre-line}.answer-form{display:flex;flex-direction:column;text-align:left;gap:9px;margin-top:22px}.answer-form label{font-size:.85rem}.answer-form input{width:100%;padding:13px 15px;border:1px solid #d6b2c3;border-radius:7px;background:white;color:var(--ink);font-size:1rem;min-height:50px}.answer-form .button{margin-top:4px}.word-answer{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;border:1px dashed #d4a1b7;border-radius:10px;background:#fffefe;min-height:85px;padding:15px}.word-empty{color:var(--muted);font-size:.88rem}.word-bank{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin-top:17px}.word-chip{border:1px solid #e3b9cc;background:var(--pink-light);color:var(--ink);border-radius:7px;padding:11px 17px;font-size:.95rem;min-height:46px}.word-chip:disabled{opacity:.3}.word-chip:not(:disabled):hover{background:#f1d0df}.word-answer .word-chip{background:#fbeef4}.word-reset{margin-top:9px}.win-icon{width:74px;height:74px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#e9f1eb;color:var(--green);font-size:2rem;margin:10px auto 20px}.win-message{font-family:var(--serif);font-size:1.6rem;line-height:1.5;margin-bottom:15px}.win-subtitle{font-size:.95rem;color:var(--muted);line-height:1.8;margin-bottom:23px}.win-state .button{width:100%}.win-state{animation:appear .35s ease}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);width:max-content;z-index:100;padding:14px 22px;border-radius:10px;background:var(--ink);color:white;box-shadow:0 6px 24px #3c172b30;text-align:center;font-size:.87rem}.confetti-layer{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:110}.confetti{position:absolute;top:-20px;width:8px;height:14px;background:var(--confetti-color);left:var(--x);animation:confetti-fall var(--duration) linear var(--delay) forwards}.celebration-static{position:absolute;inset:15%;display:flex;align-items:center;justify-content:center;color:var(--pink);font-size:3rem;opacity:.35}.confetti:nth-child(3n){border-radius:50%;width:9px;height:9px}@keyframes confetti-fall{to{transform:translate(var(--drift),110vh) rotate(660deg)}}@keyframes appear{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

@media(min-width:1450px){.hero{min-height:720px}.hero-collage{margin-left:25px}.hero-photo{width:232px}.photo-three{top:220px;left:130px}.love-stamp{right:-10px;bottom:0}.hero h1{font-size:5.5rem}}
@media(max-width:1100px){.section-width{width:calc(100% - 64px)}.site-header{padding-inline:32px}.hero{gap:10px;min-height:620px;padding-block:60px 70px}.hero-collage{height:410px}.hero-photo{width:180px}.photo-one{left:4px;top:40px}.photo-two{right:0;top:25px}.photo-three{left:95px;top:190px}.love-stamp{width:90px;height:90px;right:-2px;bottom:2px;font-size:.5rem}.collage-note{left:10px}.collage-spark{font-size:2.7rem;bottom:40px}.hero h1{font-size:4rem}.title-spark{font-size:2.2rem;margin-left:20px}.hero-footnote{font-size:.7rem}.stage{grid-template-columns:1fr 76px 1fr}.stage-card{padding:23px}.stage h3{font-size:1.25rem}.memories-heading h2{font-size:2rem}.memory-collage{gap:12px}.memory-photo figcaption{font-size:.75rem}.memory-photo .photo-placeholder span{font-size:.58rem}}
@media(max-width:800px){.hero{grid-template-columns:1fr;gap:15px;padding-block:48px 60px}.hero-copy{text-align:center}.hero h1{font-size:4.6rem;max-width:none}.hero-invitation br{display:none}.hero-invitation{max-width:420px;margin-inline:auto}.hero-footnote{justify-content:center;font-size:.75rem}.hero-collage{width:440px;max-width:100%;margin:35px auto 0;height:440px}.hero-photo{width:200px}.photo-one{left:12px;top:36px}.photo-two{right:6px;top:20px}.photo-three{left:120px;top:205px}.love-stamp{right:-1px;bottom:14px}.collage-note{left:24px;top:-23px}.collage-spark{left:20px;bottom:50px}.section-heading h2{font-size:2.5rem}.journey-section{padding-top:62px}.stage{grid-template-columns:1fr 60px 1fr;min-height:285px}.stage-card{padding:21px 18px}.stage-status{font-size:.56rem;letter-spacing:.8px}.stage h3{font-size:1.28rem}.stage-icon{width:33px;height:33px}.path-note{font-size:1.07rem;margin-left:20px}.stage:nth-of-type(even) .path-note{margin-right:20px}.memories-heading{display:block;text-align:center}.memories-heading h2{font-size:2.2rem}.memories-heading>p{margin-top:17px}.memory-collage{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:30px;max-width:620px;margin-inline:auto;margin-top:42px}.memory-photo figcaption{font-size:.86rem}.memory-photo:nth-child(4){grid-column:1;margin-top:0;left:45%}.memory-photo:nth-child(5){grid-column:2;left:55%;margin-top:8px}.site-footer{flex-direction:column;gap:7px;text-align:center}.surprise-section{padding-block:60px}}
@media(max-width:540px){.section-width{width:calc(100% - 40px)}.site-header{height:76px;padding-inline:20px;gap:10px}.brand{font-size:1.14rem;gap:4px}.brand-symbol{font-size:1.8rem;margin-right:5px}.header-progress{gap:8px;font-size:.72rem}.header-progress progress{width:46px}.small-heart{display:none}.eyebrow{font-size:.65rem;letter-spacing:1.6px}.hero{padding-top:39px;gap:8px}.hero h1{font-size:3.7rem;line-height:1.15;letter-spacing:-2px;margin-block:21px}.title-spark{font-size:2.2rem;margin-left:14px;bottom:8px}.hero-description{font-size:1.03rem}.hero-invitation{font-size:.9rem;max-width:315px}.hero-footnote{font-size:.65rem;gap:5px;flex-wrap:wrap}.hero-collage{height:363px;max-width:350px;margin-top:40px}.hero-photo{width:164px;padding:9px 9px 0}.hero-photo figcaption{font-size:.85rem;padding:12px 0 13px}.photo-one{left:5px;top:28px}.photo-two{right:3px;top:18px}.photo-three{left:95px;top:168px}.collage-note{font-size:.88rem;left:16px;top:-24px}.collage-note span{font-size:2rem;right:-31px}.love-stamp{width:77px;height:77px;right:-2px;bottom:15px;font-size:.42rem;letter-spacing:1px}.love-stamp span{font-size:1.8rem;margin-bottom:-10px}.collage-spark{font-size:2.5rem;left:15px;bottom:43px}.ribbon{height:47px;font-size:.6rem;gap:24px;justify-content:flex-start;padding-inline:25px}.journey-section{padding-block:54px 40px}.section-heading h2{font-size:2rem;letter-spacing:-.8px}.section-heading p{font-size:.84rem;margin-top:10px}.journey{margin-top:35px;padding-bottom:30px}.path-line{left:21px;top:30px;bottom:15px}.stage{display:grid;grid-template-columns:43px minmax(0,1fr);gap:16px;min-height:0;margin-bottom:22px;align-items:start}.stage-pin{grid-column:1;width:36px;height:36px;margin-top:27px;font-size:.7rem}.stage .stage-card,.stage:nth-of-type(even) .stage-card{grid-column:2;padding:21px}.stage h3{font-size:1.25rem}.stage p{font-size:.85rem}.stage-status{font-size:.57rem}.stage-button{font-size:.79rem;min-height:44px}.path-note{display:none}.path-finish{left:21px;font-size:1.6rem;bottom:0}.journey-reassurance{font-size:.75rem;margin-top:17px;padding-inline:18px}.memories-section{padding-block:44px 35px}.memories-heading h2{font-size:1.95rem}.memories-heading>p{font-size:.83rem}.memory-collage{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px;margin-top:35px;margin-bottom:27px}.memory-photo{padding:8px 8px 0}.memory-photo:nth-child(3){margin-top:0}.memory-photo:nth-child(4){left:auto;grid-column:2;margin-top:12px}.memory-photo:nth-child(5){grid-column:1;left:55%;margin-top:0}.memory-photo figcaption{font-size:.8rem}.memory-signoff{font-size:.95rem}.surprise-section{padding-block:44px}.surprise-box{padding:32px 19px}.surprise-box h2{font-size:1.95rem}.surprise-box>p{font-size:.86rem}.surprise-box>p br{display:none}.surprise-box .eyebrow{font-size:.6rem}.button{font-size:.86rem;padding:13px 20px}.surprise-count{font-size:.7rem}.site-footer{font-size:.69rem;padding-block:22px}.dialog-inner{padding:36px 22px 20px}.dialog-inner h2{font-size:1.75rem}.dialog-inner>p:not(.game-feedback){font-size:.85rem}.game-grid{gap:8px}.heart-tile,.memory-tile{font-size:1.65rem}.riddle{font-size:1.1rem;padding:18px}.clue-card{padding:25px 20px}.gift-message{font-size:.94rem}.gift-signature{font-size:1.05rem}.word-chip{padding:10px 13px}.toast{font-size:.8rem;padding:13px 18px}}
@media(max-width:360px){.section-width{width:calc(100% - 30px)}.site-header{padding-inline:15px}.header-progress progress{display:none}.hero h1{font-size:3.2rem}.hero-collage{max-width:300px;height:340px}.hero-photo{width:150px}.photo-three{left:82px;top:155px}.love-stamp{right:0;bottom:9px}.stage{gap:10px;grid-template-columns:36px minmax(0,1fr)}.stage .stage-card,.stage:nth-of-type(even) .stage-card{padding:18px}.path-line,.path-finish{left:18px}.brand{font-size:1.08rem}.hero-footnote{font-size:.62rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.confetti{display:none}}
/* Tamaños mínimos de lectura, también en pantallas pequeñas. */
.hero-invitation,.stage p,.section-heading p,.memories-heading>p,.surprise-box>p,.gift-message,.dialog-inner>p:not(.game-feedback){font-size:1rem}
.eyebrow,.stage-status,.photo-placeholder span,.memory-photo .photo-placeholder span,.surprise-box .eyebrow,.ribbon,.hero-footnote,.surprise-count,.site-footer{font-size:.75rem}
.header-progress,.stage-button,.text-button,.game-counter,.journey-reassurance{font-size:.875rem}
.love-stamp{font-size:.75rem;width:130px;height:130px;letter-spacing:.4px;right:-10px;bottom:5px}
.love-stamp span{font-size:2rem;margin-bottom:-12px}
@media(max-width:540px){.love-stamp{width:107px;height:107px;right:-5px;bottom:0;font-size:.75rem;letter-spacing:-.3px;line-height:1.05}.love-stamp span{font-size:1.8rem;margin-bottom:-12px}.stage{margin-bottom:24px}.stage-status{letter-spacing:.35px}.hero-footnote{max-width:300px;margin-inline:auto}.stage-top{gap:7px}.memories-heading h2{font-size:2rem}}

/* Un capítulo visible a la vez. Los futuros no ocupan espacio ni reciben foco. */
body { min-height: 100svh; display: flex; flex-direction: column; }
main { flex: 1; }
main > section[data-screen]:not([hidden]) { animation: chapter-arrive .55s ease both; }
@keyframes chapter-arrive {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
.chapter-track {
  display: flex; justify-content: center; list-style: none;
  max-width: 520px; margin: 30px auto 0; padding: 0;
}
.chapter-track li { flex: 1; position: relative; text-align: center; color: var(--muted); }
.chapter-track li:not(:last-child)::after {
  content: ""; position: absolute; top: 19px; left: calc(50% + 25px);
  width: calc(100% - 50px); border-top: 1px dashed #d5a6ba;
}
.chapter-number {
  display: flex; align-items: center; justify-content: center; margin: 0 auto 8px;
  width: 40px; height: 40px; border: 1px solid var(--border); border-radius: 50%;
  background: var(--paper); font-size: .875rem;
}
.chapter-state { font-size: .875rem; }
.chapter-track .is-current .chapter-number { background: var(--pink); border-color: var(--pink); color: white; box-shadow: 0 0 0 5px var(--pink-light); }
.chapter-track .is-current .chapter-state { color: var(--pink); font-weight: 600; }
.chapter-track .is-complete .chapter-number { background: #e9f1eb; color: var(--green); border-color: #adc9b6; }
.chapter-track .is-locked .chapter-number { background: transparent; }
#camino { padding-block: 42px 30px; }
#camino .journey { max-width: 560px; margin: 30px auto 0; padding: 0; }
#camino .path-line, #camino .path-finish, #camino .stage-pin, #camino .path-note { display: none; }
#camino .stage { display: block; min-height: 0; margin: 0; }
#camino .stage-card { padding: 28px 36px; text-align: center; border-radius: 20px; }
#camino .stage-top { justify-content: center; gap: 14px; margin-bottom: 16px; }
#camino .stage-icon { width: 46px; height: 46px; font-size: 2rem; }
#camino .stage-status { font-size: .875rem; letter-spacing: .8px; }
#camino .stage h3 { font-size: 1.8rem; }
#camino .stage p { max-width: 420px; margin-inline: auto; }
#camino .stage-button {
  background: var(--pink); color: white; border-radius: 8px; padding: 14px 20px;
  margin-top: 24px; min-height: 52px; font-size: 1rem; transition: background .2s, transform .2s;
}
#camino .stage-button:hover { background: var(--pink-hover); text-decoration: none; transform: translateY(-2px); }
.screen-actions { display: flex; flex-direction: column; align-items: center; gap: 14px; margin-top: 28px; text-align: center; }
#camino .screen-actions { margin-top: 8px; }
.unlock-caption { font-size: .875rem; color: var(--muted); }
.reward-section { max-width: 960px; padding-block: 44px 38px; }
.reward-keepsake { max-width: 760px; margin: 30px auto 0; }
.memory-seal {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px;
  width: min(100%, 440px); min-height: 285px; margin: auto; padding: 32px 22px;
  background: radial-gradient(ellipse at top, #f8dce9, var(--paper) 80%);
  border: 1px solid #d895b3; border-radius: 18px; box-shadow: 0 14px 45px #9c44691a;
  transition: transform .25s, box-shadow .25s;
}
.memory-seal:hover { transform: translateY(-5px) rotate(-1deg); box-shadow: 0 20px 50px #9c44692b; }
.seal-symbol { color: var(--pink); font-family: var(--serif); font-size: 3.6rem; line-height: 1; }
.seal-title { font-family: var(--serif); font-size: 1.7rem; }
.seal-action { color: var(--pink); font-size: .875rem; }
.unwrapped-memory { display: grid; grid-template-columns: minmax(0, 280px) 1fr; gap: 44px; align-items: center; animation: chapter-arrive .5s ease both; padding: 8px 14px; }
.reward-photo { transform: rotate(-4deg); }
.reward-photo figcaption { padding-block: 18px; }
.reward-note { font-family: var(--serif); font-size: 1.45rem; font-style: italic; line-height: 1.85; color: var(--pink); white-space: pre-line; }
.reward-section .screen-actions { margin-top: 32px; }
.reward-section .button:disabled { background: #f1e4ea; }
.memories-section .screen-actions { margin-top: 26px; }
.memory-note-button { display: block; width: 100%; padding: 8px 4px 12px; line-height: 1.6; }
.album-note { font-size: 1rem; line-height: 1.75; color: var(--muted); padding: 6px 10px 18px; white-space: pre-line; animation: chapter-arrive .25s ease; }
.memory-photo { transition: transform .25s, box-shadow .25s; }
.memory-photo.is-reading { transform: rotate(0); z-index: 5; box-shadow: 0 16px 35px #75364e24; }
.surprise-section { padding-block: 44px; }
.surprise-box { max-width: 800px; margin-inline: auto; }
.surprise-box.is-ready .surprise-icon { color: var(--pink); background: #f4c9dc; }
body[data-scene="surprise"] .surprise-box { padding-block: 54px; }
@media (max-width: 800px) {
  .unwrapped-memory { gap: 28px; grid-template-columns: minmax(0, 230px) 1fr; }
  .reward-note { font-size: 1.2rem; }
}
@media (max-width: 540px) {
  #camino { padding-top: 30px; }
  #camino .stage-card { padding: 24px 20px; }
  #camino .stage h3 { font-size: 1.5rem; }
  #camino .stage-top { gap: 10px; }
  #camino .stage-status { font-size: .875rem; letter-spacing: 0; }
  .chapter-track { margin-top: 24px; }
  .chapter-state { font-size: .75rem; }
  .chapter-number { width: 36px; height: 36px; }
  .chapter-track li:not(:last-child)::after { top: 17px; }
  .reward-section { padding-block: 32px; }
  .reward-keepsake { margin-top: 24px; }
  .memory-seal { min-height: 255px; }
  .unwrapped-memory { grid-template-columns: 1fr; justify-items: center; gap: 24px; padding-inline: 6px; }
  .reward-photo { width: min(100%, 235px); }
  .reward-note { text-align: center; font-size: 1.125rem; }
  .screen-actions .button { max-width: 100%; gap: 12px; }
  .memory-note-button { font-size: .875rem; }
  .album-note { padding-inline: 5px; }
  .site-header .header-progress { gap: 7px; flex-wrap: wrap; justify-content: flex-end; }
  .header-progress #progress-label { white-space: nowrap; font-size: .75rem; }
  body[data-scene="surprise"] .surprise-box { padding-block: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-screen], .unwrapped-memory, .album-note { animation: none; }
  .memory-seal:hover, #camino .stage-button:hover { transform: none; }
}

/* Burbujas interactivas, ligeras y separadas de los controles del recorrido. */
.bubble-layer, .burst-layer, .transition-sparkles { position: fixed; inset: 0; overflow: hidden; pointer-events: none; }
.bubble-layer { z-index: 0; opacity: .72; }
/* Solo las burbujas del fondo flotan; las fichas del reto conservan su celda. */
.floating-bubble.heart-bubble {
  position: absolute; top: 0; left: 0; width: var(--size); height: var(--size);
  padding: 0; border: 0; border-radius: 0; background: transparent;
  display: block; opacity: var(--bubble-opacity, .9);
  pointer-events: auto; touch-action: manipulation; user-select: none; will-change: transform;
  transition: opacity .2s; cursor: pointer;
}
.floating-bubble.heart-bubble > img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; filter: brightness(var(--rhythm-glow, 1)) drop-shadow(0 4px 5px #c74b872b); transition: filter .2s; }
.floating-bubble.heart-bubble:hover > img, .floating-bubble.heart-bubble:focus-visible > img { filter: drop-shadow(0 0 6px #f290c7a0) drop-shadow(0 7px 10px #ce498140); }
.floating-bubble.heart-bubble.over-control { opacity: .16; }
.floating-bubble.heart-bubble.is-popping { pointer-events: none; animation: bubble-pop .42s ease-out forwards; opacity: 0; }
.burst-layer { z-index: 115; }
.transition-sparkles { z-index: 112; }
.pop-ring { position: absolute; width: 45px; height: 45px; border: 2px solid #f073a8; border-radius: 50%; animation: pop-ring .65s ease-out forwards; }
.pop-particle { position: absolute; font-size: 20px; line-height: 1; animation: pop-scatter .9s cubic-bezier(.16,.7,.35,1) forwards; }
.confetti.confetti-symbol { width: auto; height: auto; background: none; color: var(--confetti-color); font-size: 23px; font-style: normal; line-height: 1; }
.confetti.pop-confetti { width: 8px; height: 12px; border-radius: 2px; animation: pop-confetti-fall var(--duration) linear both; }
.confetti.pop-confetti:nth-child(3n) { width: 7px; height: 7px; border-radius: 50%; }
.confetti.pop-confetti:nth-child(4n) { width: 5px; height: 15px; }
.flying-symbol { position: absolute; left: var(--x); bottom: -70px; color: #df6c9d; font-size: clamp(30px, 5vw, 56px); animation: symbol-flight 2.1s ease-out var(--delay) both; }
.flying-symbol.is-grand { font-size: clamp(40px, 6vw, 76px); animation-duration: 4.2s; }
.home-return { position: fixed; bottom: 16px; right: 18px; z-index: 30; display: inline-flex; align-items: center; gap: 9px; min-height: 46px; padding: 11px 17px; border: 1px solid #dcacc1; border-radius: 999px; background: #fffafdf5; color: var(--pink); box-shadow: 0 5px 20px #9c446924; font-size: .875rem; transition: background .2s, transform .2s; }
.home-return:hover { background: var(--pink-light); transform: translateY(-2px); }
.welcome-options { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; max-width: 450px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); }
.welcome-options .button { gap: 10px; font-size: .875rem; }
.welcome-options .button:disabled { opacity: .5; }
.welcome-progress-note { flex-basis: 100%; font-size: .875rem; color: var(--muted); }
.review-section { max-width: 820px; padding-block: 42px; }
.review-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-block: 28px; }
.review-tab { min-height: 46px; border: 1px solid var(--border); border-radius: 9px; background: var(--paper); color: var(--pink); padding: 9px 8px; font-size: .875rem; }
.review-tab[aria-current] { color: white; background: var(--pink); border-color: var(--pink); }
.review-tab:disabled { color: var(--muted); background: #f2e8ed; }
.review-card { padding: 28px; border: 1px solid #dfa5c0; border-radius: 20px; background: var(--paper); text-align: center; box-shadow: var(--shadow); }
.review-prompt { white-space: pre-line; color: var(--muted); line-height: 1.85; }
.review-answer { margin-top: 24px; padding-top: 24px; border-top: 1px dashed var(--border); }
.review-answer-title { margin: 14px 0 18px; font-family: var(--serif); color: var(--pink); font-size: clamp(1.4rem, 3vw, 2rem); line-height: 1.5; }
.review-answer-note { font-size: 1rem; color: var(--muted); max-width: 550px; margin: 18px auto 0; }
.review-heart-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; max-width: 310px; margin: auto; }
.review-heart { display: grid; place-items: center; aspect-ratio: 1; border-radius: 12px; background: #faf0f5; color: #b7a2ab; font-size: 1.8rem; }
.review-heart.found { background: #fbd7e9; color: var(--pink); box-shadow: inset 0 0 0 1px #e8a4c5; }
.review-pairs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; max-width: 420px; margin: auto; }
.review-pair { display: flex; flex-direction: column; padding: 16px 10px; border-radius: 12px; background: var(--pink-light); }
.review-pair > span:first-child { font-size: 1.7rem; }
.review-pair-label { font-size: .875rem; color: var(--muted); margin-top: 5px; }
.review-navigation { display: flex; justify-content: space-between; gap: 14px; margin-top: 24px; }
.review-navigation .button:disabled { opacity: .45; }
.reset-actions { display: grid; gap: 12px; margin-top: 26px; }
@media (max-width: 800px) { .welcome-options { justify-content: center; margin-inline: auto; } }
@media (max-width: 540px) { .review-section { padding-top: 30px; } .review-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); } .review-card { padding: 22px 18px; } .review-navigation .button { flex: 1; gap: 7px; padding: 12px; font-size: .875rem; } }
.dialog-home { margin-top: 8px; }
body:not([data-scene="welcome"]) .site-footer { padding-bottom: 78px; }
.modal-open .bubble-layer, .modal-open .home-return { visibility: hidden; }
.seal-symbol { animation: bubble-heartbeat 2.7s ease-in-out infinite; }
/* La compañera tiene su propio espacio: camina sin cubrir el reto. */
.mascot-dock { width: calc(100% - 32px); max-width: 1180px; margin: 8px auto 0; }
.mascot-companion {
  position: relative; display: flex; align-items: center; gap: 8px;
  width: 264px; max-width: 100%; min-height: 100px; pointer-events: none;
  transform: translateX(var(--mascot-x, 0px)); transition: transform 1.45s ease-in-out;
}
.mascot-sprite {
  display: block; flex: 0 0 96px; width: 96px; height: 96px;
  background: url('assets/mascot-girl.png') 100% 0 / 300% 200% no-repeat;
  transform-origin: 50% 92%; animation: mascot-wave 3s ease-in-out infinite;
}
.mascot-message {
  position: relative; padding: 10px 12px; border: 1px solid #e8bbcf; border-radius: 16px 16px 16px 4px;
  background: #fffafdeF; color: #91435f; font-size: .875rem; line-height: 1.5; text-align: left;
  box-shadow: 0 4px 14px #ae4d7710; overflow-wrap: anywhere;
}
.mascot-companion[data-gesture="walk"] .mascot-sprite { animation: mascot-walk .44s steps(1, end) infinite, mascot-step .44s ease-in-out infinite; }
.mascot-companion[data-gesture="think"] .mascot-sprite { background-position: 0 100%; animation: mascot-think 3.4s ease-in-out infinite; }
.mascot-companion[data-gesture="cheer"] .mascot-sprite { background-position: 50% 100%; animation: mascot-cheer .85s ease-in-out 3, mascot-wave 3s 2.55s ease-in-out infinite; }
.mascot-companion[data-gesture="point"] .mascot-sprite { background-position: 100% 100%; animation: mascot-wave 3.5s ease-in-out infinite; }
.dialog-mascot-slot { margin: 12px 0 0; }
.mascot-companion[data-context="dialog"] { width: 255px; min-height: 72px; margin-inline: auto; }
.mascot-companion[data-context="dialog"] .mascot-sprite { flex-basis: 72px; width: 72px; height: 72px; }
.dialog-mascot-slot + #challenge-content { margin-top: 16px; }
.hero { min-height: 590px; padding-block: 28px 56px; }
#camino { padding-top: 24px; }
.reward-section, .review-section { padding-top: 28px; }
@keyframes mascot-walk { 0%, 49% { background-position: 0 0; } 50%, 100% { background-position: 50% 0; } }
@keyframes mascot-step { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-4px) rotate(2deg); } }
@keyframes mascot-wave { 0%, 45%, 100% { transform: rotate(0); } 60% { transform: rotate(-3deg); } 75% { transform: rotate(3deg); } }
@keyframes mascot-think { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg) translateY(-2px); } }
@keyframes mascot-cheer { 0%, 100% { transform: translateY(0); } 45% { transform: translateY(-10px) rotate(-4deg); } 70% { transform: translateY(0) scaleY(.97); } }
@media (max-width: 800px) { .hero { min-height: 0; padding-top: 24px; } }
@media (max-width: 540px) {
  .mascot-dock { margin-top: 4px; }
  .mascot-companion { min-height: 84px; }
  .mascot-sprite { flex-basis: 76px; width: 76px; height: 76px; }
  .hero { padding-block: 18px 40px; }
  #camino { padding-top: 18px; }
}
.win-icon { animation: victory-bounce .65s cubic-bezier(.2,1.6,.5,1) both; }
.memory-tile.flipped { animation: card-turn .3s ease-out; }
.memory-tile.matched, .heart-tile.found { animation: victory-bounce .4s ease; }
#surprise-icon { width: 132px; height: 132px; margin: 0; font-size: 6.8rem; line-height: 1; background: transparent; filter: drop-shadow(0 12px 10px #bd3f7030); }
.gift-trigger:not(:disabled) #surprise-icon { animation: present-wiggle 2.6s ease-in-out infinite; }
.surprise-box.is-ready #surprise-icon { background: transparent; }
.surprise-box.is-ready { box-shadow: 0 14px 65px #de639f21; }
.surprise-box.is-opening #surprise-icon { animation: unwrap-present 1.35s ease-in both; }
.surprise-box.is-opening { animation: gift-glow 1.35s ease-in both; }
.is-finale { background: radial-gradient(ellipse at 50% 20%, #ffe2ef, transparent 60%), var(--background); }
.is-finale .gift-reveal { position: relative; animation: finale-arrive .9s cubic-bezier(.2,.85,.25,1) both; }
.finale-parade { display: flex; align-items: center; justify-content: center; gap: clamp(12px, 3vw, 26px); padding: 10px 0 20px; }
.finale-parade span { display: inline-block; font-size: clamp(2rem, 5vw, 3.5rem); animation: finale-float 3s ease-in-out infinite; filter: drop-shadow(0 8px 12px #d1678c25); }
.finale-parade span:nth-child(2n) { animation-delay: -.8s; font-size: clamp(2.5rem, 6vw, 4.5rem); }
.finale-parade span:nth-child(3) { animation-delay: -1.5s; font-size: clamp(3.5rem, 8vw, 6rem); }
.is-finale .gift-reveal h2 { font-size: clamp(3rem, 6vw, 5.4rem); }
.is-finale .gift-reveal h2 em { background: linear-gradient(100deg, #af265f 10%, #db5893 38%, #b17920 52%, #bd3f70 72%); background-size: 250% auto; background-clip: text; -webkit-background-clip: text; color: transparent; animation: birthday-shimmer 6s ease-in-out infinite; }
.is-finale .gift-message { animation: chapter-arrive .7s .2s both; }
.is-finale .clue-card { animation: chapter-arrive .8s .45s both; background: linear-gradient(135deg, #fffdfd, #fff0f7); border-color: #ce8b39; box-shadow: 0 16px 50px #c6468024, 0 0 0 5px #fff5f9; }
.is-finale .gift-signature { animation: chapter-arrive .7s .7s both; }
.is-finale #celebrate-button { animation: chapter-arrive .7s .9s both, action-glow 2.6s ease-in-out infinite; }
/* Seis corazones concéntricos, cada vez más transparentes, laten dos veces. */
.path-action { position: relative; isolation: isolate; overflow: visible; transform-origin: center; }
.path-action:not(:disabled) { animation: button-breathe 2.8s ease-in-out infinite; }
.path-action:not(:disabled)::after {
  content: ""; position: absolute; inset: -6px; z-index: -1; pointer-events: none;
  border: 1px solid currentColor; border-radius: inherit; opacity: 0;
  animation: button-ring 2.8s ease-out infinite;
}
.path-action:not(:disabled) > span[aria-hidden="true"]:last-child { animation: action-arrow 2.4s ease-in-out infinite; }
.path-action:not(:disabled):hover, .path-action:not(:disabled):focus-visible { animation: button-nudge 1.6s ease-in-out infinite; transform: translateY(-3px) scale(1.015); }
.path-action:not(:disabled):hover::after, .path-action:not(:disabled):focus-visible::after { animation: none; opacity: .35; }
.path-action:active { transform: translateY(1px) scale(.97); transition: transform .1s ease; }
.gift-trigger.button {
  flex-direction: column; gap: 18px; width: max-content; max-width: 100%; padding: 12px 14px 8px;
  border: 0; border-radius: 20px; color: var(--pink); background: transparent; box-shadow: none;
}
.gift-trigger.path-action:not(:disabled) { animation: button-breathe 2.8s ease-in-out infinite; }
.gift-trigger-caption {
  display: flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 18px;
  min-height: 48px; max-width: 100%; border-radius: 999px; background: var(--pink); color: white;
  font-size: 1rem; line-height: 1.5; transition: background .2s;
}
.gift-trigger:not(:disabled) .gift-trigger-caption { animation: action-glow 2.6s ease-in-out infinite; }
.gift-trigger:not(:disabled):hover .gift-trigger-caption { background: var(--pink-hover); }
.gift-trigger:disabled .gift-trigger-caption { background: var(--pink-light); color: var(--muted); }
.gift-trigger:focus-visible { outline: 3px solid var(--pink); outline-offset: 8px; }
body.modal-open main .path-action, body.modal-open main .path-action > span { animation: none; }
body.modal-open main .path-action::after { display: none; }
@keyframes button-breathe {
  0%, 100% { box-shadow: 0 4px 12px #bd3f701a; }
  50% { box-shadow: 0 8px 25px #d64d8640; }
}
@keyframes button-ring {
  0%, 48%, 100% { opacity: 0; transform: scale(.94); }
  18% { opacity: .28; transform: scale(1.015); }
}
@keyframes button-nudge {
  0%, 100% { box-shadow: 0 8px 22px #d64d8640; }
  50% { box-shadow: 0 11px 30px #d64d8660; }
}
@keyframes action-glow {
  0%, 18%, 52%, 100% { box-shadow: 0 4px 12px #bd3f701a; }
  10%, 28% { box-shadow: 0 6px 24px #d64d8640; }
}
@keyframes action-arrow { 0%, 65%, 100% { translate: 0 0; } 35% { translate: 3px -3px; } }
@media (prefers-reduced-motion: reduce) {
  .path-action:not(:disabled), .path-action:not(:disabled) > span[aria-hidden="true"]:last-child { animation: none; }
  .path-action::after { display: none; }
}
@keyframes bubble-heartbeat { 0%, 100% { scale: .94; } 45% { scale: 1.08; } 65% { scale: 1; } }
@keyframes bubble-pop { 0% { scale: 1; opacity: 1; } 40% { scale: 1.35; opacity: .9; } 100% { scale: 1.65; opacity: 0; } }
@keyframes pop-ring { from { transform: translate(-50%, -50%) scale(.3); opacity: .9; } to { transform: translate(-50%, -50%) scale(3.8); opacity: 0; } }
@keyframes pop-scatter { from { transform: translate(-50%, -50%) scale(.5); opacity: 1; } to { transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) rotate(var(--turn)) scale(.25); opacity: 0; } }
@keyframes pop-confetti-fall { 0% { transform: translate(-50%, -50%) rotate(0) scale(.4); opacity: 1; animation-timing-function: ease-out; } 35% { transform: translate(var(--mid-x), var(--lift)) rotate(160deg) scale(1); opacity: 1; animation-timing-function: ease-in; } 100% { transform: translate(var(--dx), var(--fall)) rotate(var(--turn)) scale(.7); opacity: 0; } }
@keyframes symbol-flight { 0% { transform: translate(0, 0) rotate(0); opacity: 0; } 12% { opacity: .85; } 80% { opacity: .65; } 100% { transform: translate(var(--drift), -105vh) rotate(var(--turn)); opacity: 0; } }
@keyframes victory-bounce { 0% { transform: scale(.65); } 65% { transform: scale(1.1); } 100% { transform: scale(1); } }
@keyframes card-turn { from { transform: perspective(500px) rotateY(-75deg); } to { transform: perspective(500px) rotateY(0); } }
@keyframes present-wiggle { 0%, 60%, 100% { transform: translateY(0) rotate(0); } 70% { transform: translateY(-10px) rotate(-10deg); } 80% { transform: translateY(-7px) rotate(9deg); } 90% { transform: translateY(-4px) rotate(-6deg); } }
@keyframes unwrap-present { 0% { transform: scale(1); } 25% { transform: scale(1.15) rotate(-12deg); } 45% { transform: scale(1.25) rotate(12deg); } 65% { transform: scale(1.4) rotate(-10deg); opacity: 1; } 100% { transform: translateY(-90px) scale(1.9) rotate(15deg); opacity: 0; } }
@keyframes gift-glow { from { box-shadow: 0 0 0 #ed8dbe00; } to { box-shadow: 0 0 100px #ed8dbe80; } }
@keyframes finale-arrive { from { opacity: 0; transform: translateY(30px) scale(.9); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes finale-float { 0%, 100% { transform: translateY(0) rotate(-6deg); } 50% { transform: translateY(-13px) rotate(6deg); } }
@keyframes birthday-shimmer { 0%, 100% { background-position: 0% center; } 50% { background-position: 100% center; } }
body[data-motion="paused"] *, body[data-motion="paused"] *::before, body[data-motion="paused"] *::after { animation: none !important; transition: none !important; }
@media (max-width: 540px) { .finale-parade { padding-top: 0; } .pop-particle { font-size: 17px; } }
@media (prefers-reduced-motion: reduce) { .confetti-layer, .burst-layer, .transition-sparkles { display: none; } }

/* El primer reto mezcla tres tipos de burbuja: corazones, estrellas y regalos. */
.heart-tile.star-bubble { color: #b78d4d; background: #fff8e9; border-color: #ecdca7; border-radius: 50%; box-shadow: inset 0 0 0 5px #fffdf580; }
.heart-tile.gift-bubble { color: #985eac; background: #f5e8fa; border-color: #dcc1e7; border-radius: 14px 14px 19px 19px; box-shadow: inset 0 0 0 5px #fffdf580; }
.heart-tile.star-bubble:hover { background: #fff3d4; }
.heart-tile.gift-bubble:hover { background: #f0dcf7; }
.heart-tile.decoy { animation: decoy-shake .28s ease; }
@keyframes decoy-shake { 0%, 100% { transform: translateX(0); } 35% { transform: translateX(-3px) rotate(-3deg); } 70% { transform: translateX(3px) rotate(3deg); } }

/* Burbujas decorativas adicionales: estrellas y regalos comparten el movimiento de los corazones. */
.floating-bubble {
  position: absolute; top: 0; left: 0; width: var(--size); height: var(--size); padding: 0;
  border: 0; display: flex; align-items: center; justify-content: center;
  pointer-events: auto; touch-action: manipulation; user-select: none; will-change: transform;
  transition: opacity .2s; cursor: pointer; font-size: clamp(28px, 5vw, 54px);
  line-height: 1; background: transparent; color: var(--pink);
  text-shadow: 0 4px 7px #c74b8730; scale: var(--rhythm-scale, .93);
}
.floating-bubble.star-bubble { color: #d39b28; filter: drop-shadow(0 5px 7px #d39b2840); }
.floating-bubble.gift-bubble { color: #9956ad; filter: drop-shadow(0 5px 7px #9956ad40); }
.round-bubble-shape {
  display: block; width: 100%; height: 100%; border-radius: 50%;
  filter: brightness(var(--rhythm-glow, 1));
  border: 2px solid #ffffff99;
  background:
    radial-gradient(circle at 28% 23%, #ffffffee 0 7%, #ffffff70 8% 14%, transparent 15%),
    radial-gradient(circle at 37% 30%, #ffffff80 0 10%, transparent 28%),
    var(--round-color);
  box-shadow: inset -7px -9px 13px #7f3a5e3b, inset 8px 7px 11px #ffffff75, 0 5px 11px #7b38522e;
}
.floating-bubble > img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; transition: filter .2s; }
.floating-bubble.star-bubble > img { filter: brightness(var(--rhythm-glow, 1)) drop-shadow(0 5px 7px #d39b2840); }
.floating-bubble.gift-bubble > img { filter: brightness(var(--rhythm-glow, 1)) drop-shadow(0 5px 7px #9956ad40); }
.floating-bubble.star-bubble:hover, .floating-bubble.star-bubble:focus-visible { filter: drop-shadow(0 0 8px #f4c95f) drop-shadow(0 6px 10px #d39b2860); }
.floating-bubble.gift-bubble:hover, .floating-bubble.gift-bubble:focus-visible { filter: drop-shadow(0 0 8px #d497e8) drop-shadow(0 6px 10px #9956ad60); }
.floating-bubble.over-control { opacity: .16; }
.floating-bubble.is-popping { pointer-events: none; animation: bubble-pop .42s ease-out forwards; opacity: 0; }
@media (max-width: 540px) { .floating-bubble { font-size: clamp(27px, 8vw, 46px); } }

/* Las burbujas viven en el fondo y la interfaz conserva una capa de lectura encima. */
.site-header, main, .mascot-dock, .site-footer { position: relative; z-index: 2; }

/* El cierre transforma los recuerdos en un viaje de cumpleaños de treinta segundos. */
.birthday-wish { max-width: 660px; margin: 34px auto 0; padding: clamp(28px, 5vw, 48px); border: 1px solid #dca2be; border-radius: 24px; background: radial-gradient(circle at 50% 0, #fff7d9, #fff0f7 65%, #fffafd); box-shadow: 0 18px 55px #b8457522, inset 0 0 0 5px #ffffff8c; }
.birthday-wish p { margin-top: 16px; color: #8d315c; font-family: var(--serif); font-size: clamp(1.45rem, 2.4vw, 2rem); line-height: 1.65; text-wrap: pretty; }
.is-finale .birthday-wish { animation: chapter-arrive .8s .45s both; }
.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; }
body.tunnel-active { overflow: hidden; }
body.tunnel-active .bubble-layer { visibility: hidden; }
.birthday-tunnel { position: fixed; inset: 0; z-index: 200; overflow: hidden; color: #fffaf7; background: radial-gradient(circle at 50% 48%, #a43272 0, #6e245d 28%, #361b4d 65%, #160f32 100%); }
.tunnel-depth, .tunnel-rings, .tunnel-photo-field { position: absolute; inset: 0; pointer-events: none; }
.tunnel-depth { perspective: 900px; perspective-origin: 50% 50%; overflow: hidden; }
.tunnel-rings, .tunnel-photo-field { transform-style: preserve-3d; }
.tunnel-depth::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at center, transparent 15%, #2b17395c 72%, #150f31c4 100%); pointer-events: none; }
.tunnel-rays { position: absolute; inset: -60vmax; background: repeating-conic-gradient(from 0deg at 50% 50%, #ffdb9724 0deg 4deg, transparent 5deg 24deg); mask-image: radial-gradient(circle, transparent 0 7%, #000 38%, transparent 76%); animation: tunnel-rays-turn 24s linear infinite; }
.tunnel-ring { position: absolute; top: 50%; left: 50%; width: min(42vw, 540px); aspect-ratio: 1; border: 2px solid #ffeacaa8; border-radius: 28%; box-shadow: 0 0 28px #ffe0a880, inset 0 0 24px #ffb5d980; opacity: 0; animation: tunnel-ring-flight 5s linear var(--ring-delay) infinite; will-change: transform, opacity; }
.tunnel-photo { position: absolute; top: 50%; left: 50%; width: clamp(94px, 12vw, 160px); aspect-ratio: 1; padding: 5px; border: 3px solid #fff8e4d9; border-radius: 50%; background: #fff8f0a1; box-shadow: 0 0 0 8px #ffcfec36, 0 16px 40px #1b0d34a8, inset 0 0 18px #fff9; opacity: 0; overflow: hidden; animation: tunnel-photo-flight 7.5s cubic-bezier(.15,.45,.35,1) var(--flight-delay) both; will-change: transform, opacity; }
.tunnel-photo::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: linear-gradient(145deg, #ffffffa6, transparent 36%, transparent 65%, #ee9cc566); pointer-events: none; }
.tunnel-photo img { display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.tunnel-content { position: relative; z-index: 3; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 18px; padding: clamp(24px, 5vh, 54px) 18px 26px; text-align: center; }
.tunnel-content .eyebrow { color: #ffe1a9; text-shadow: 0 2px 14px #210c2d; }
.tunnel-content h2 { max-width: 850px; color: #fffaf7; font-size: clamp(2rem, 5vw, 4.6rem); line-height: 1.15; text-shadow: 0 5px 28px #190c37; text-wrap: balance; }
.tunnel-content h2 em { color: #ffe39d; text-shadow: 0 0 28px #ffd2928c; }
.tunnel-phrases { position: relative; display: grid; place-items: center; width: min(780px, 94vw); min-height: 250px; }
.tunnel-phrase { grid-area: 1 / 1; width: 100%; max-width: 760px; padding: clamp(22px, 4vw, 38px); border: 1px solid #ffefdab3; border-radius: 26px; background: linear-gradient(135deg, #3f174cb8, #8d31639c); box-shadow: 0 16px 55px #190b3399, inset 0 0 30px #ffd6e02a; backdrop-filter: blur(12px); color: #fffaf5; font-family: var(--serif); font-size: clamp(1.5rem, 3.3vw, 2.8rem); line-height: 1.35; text-wrap: balance; opacity: 0; animation: tunnel-words var(--phrase-duration) ease-in-out var(--phrase-delay) both; }
.tunnel-phrase.is-final { font-size: clamp(1.3rem, 2.5vw, 2.1rem); line-height: 1.5; border-color: #ffdea2; background: linear-gradient(135deg, #792555e8, #54234dbd); }
.tunnel-progress { width: min(420px, 72vw); height: 4px; overflow: hidden; border-radius: 99px; background: #fff8ee54; }
.tunnel-progress span { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, #ffd999, #fff4cf, #ffc1df); box-shadow: 0 0 12px #ffe4b8; transform-origin: left; animation: tunnel-progress 30s linear forwards; }
.tunnel-skip { min-height: 46px; padding: 10px 20px; border: 1px solid #fff6dfad; border-radius: 999px; background: #331a4aa8; color: #fffaf4; font-size: .875rem; box-shadow: 0 8px 25px #170d2f7a; }
.tunnel-skip:hover, .tunnel-skip:focus-visible { background: #7d2e65; }
@keyframes tunnel-rays-turn { to { transform: rotate(360deg); } }
@keyframes tunnel-ring-flight { 0% { transform: translate(-50%, -50%) translateZ(-1000px) rotate(45deg) scale(.2); opacity: 0; } 18% { opacity: .7; } 75% { opacity: .55; } 100% { transform: translate(-50%, -50%) translateZ(500px) rotate(55deg) scale(2); opacity: 0; } }
@keyframes tunnel-photo-flight { 0% { transform: translate(-50%, -50%) translate3d(0, 0, -850px) scale(.2) rotate(-22deg); opacity: 0; } 18% { opacity: .95; } 72% { opacity: 1; } 100% { transform: translate(-50%, -50%) translate3d(var(--flight-x), var(--flight-y), 220px) scale(1.35) rotate(18deg); opacity: 0; } }
@keyframes tunnel-words { 0%, 100% { opacity: 0; transform: translateY(24px) rotateX(18deg) scale(.88); } 16%, 78% { opacity: 1; transform: translateY(0) rotateX(0) scale(1); } }
@keyframes tunnel-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (max-width: 540px) { .birthday-wish { padding: 25px 20px; } .tunnel-content { gap: 8px; padding-block: 20px; } .tunnel-content h2 { font-size: clamp(1.9rem, 7vw, 2.8rem); } .tunnel-phrases { min-height: 280px; } .tunnel-photo { width: 96px; } .tunnel-phrase { font-size: 1.55rem; padding: 24px 18px; } .tunnel-phrase.is-final { font-size: 1.32rem; } }
@media (max-height: 650px) { .birthday-tunnel { overflow-y: auto; } .tunnel-content { gap: 8px; padding-block: 16px; } .tunnel-content h2 { font-size: clamp(1.7rem, 4vw, 2.5rem); } .tunnel-phrases { min-height: 0; } .tunnel-phrase { padding: 17px; font-size: clamp(1.25rem, 2.5vw, 1.8rem); } .tunnel-phrase.is-final { font-size: clamp(1.1rem, 2.2vw, 1.5rem); line-height: 1.35; } }
@media (prefers-reduced-motion: reduce) { .tunnel-rays, .tunnel-ring { display: none; } .tunnel-photo { transform: translate(-50%, -50%) translate(var(--flight-x), var(--flight-y)) scale(.7); opacity: .5; } .tunnel-photo:nth-child(n+7), .tunnel-phrase:not(.is-final) { display: none; } .tunnel-phrase.is-final { opacity: 1; transform: none; } .tunnel-progress span { transform: scaleX(1); } }
@keyframes tunnel-photo-mobile { 0% { transform: translate(-50%, -50%) translate3d(0, 0, -350px) scale(.45); opacity: 0; } 22%, 76% { opacity: .9; } 100% { transform: translate(-50%, -50%) translate3d(var(--flight-x), var(--flight-y), 90px) scale(.9); opacity: 0; } }
@media (max-width: 600px) {
  .birthday-tunnel { overflow: hidden; }
  .tunnel-rays { display: none; }
  .tunnel-depth::after { background: radial-gradient(circle at center, transparent 15%, #1d1235a8 100%); }
  .tunnel-ring { width: min(50vw, 220px); box-shadow: 0 0 14px #ffe0a85c; }
  .tunnel-photo { width: 76px; padding: 3px; border-width: 2px; box-shadow: 0 0 0 4px #ffcfec26, 0 7px 18px #1b0d348c; animation: tunnel-photo-mobile 6.1s ease-out var(--flight-delay) both; }
  .tunnel-content { height: 100dvh; min-height: 0; display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto auto; justify-items: center; gap: clamp(6px, 1.5vh, 12px); padding: max(14px, env(safe-area-inset-top)) 14px max(14px, env(safe-area-inset-bottom)); }
  .tunnel-content .eyebrow { font-size: .65rem; letter-spacing: 1.3px; }
  .tunnel-content h2 { font-size: clamp(1.4rem, 5.4vw, 2rem); line-height: 1.12; }
  .tunnel-phrases { width: min(78vw, 310px); height: 100%; min-height: 0; }
  .tunnel-phrase { align-self: center; max-height: 100%; overflow-y: auto; padding: 18px 16px; border-radius: 18px; background: #4e1d5aed; box-shadow: 0 10px 28px #190b3380; backdrop-filter: none; font-size: clamp(1.08rem, 4.5vw, 1.42rem); line-height: 1.34; }
  .tunnel-phrase.is-final { font-size: clamp(1.02rem, 4.2vw, 1.28rem); line-height: 1.38; background: #66244feb; }
  .tunnel-progress { width: min(280px, 72vw); }
  .tunnel-skip { min-height: 44px; padding: 8px 16px; }
}

/* Música opcional y entrada del regalo. */
.sound-toggle { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 46px; min-height: 44px; padding: 8px 13px; border: 1px solid #dfb4c7; border-radius: 999px; background: #fff9fc; color: var(--pink); font-size: .875rem; box-shadow: 0 4px 14px #9c446916; }
.bubble-layer { opacity: .55; }
@media (max-width: 600px) { .bubble-layer { opacity: .42; } }
@media (max-width: 600px) { .floating-bubble.over-control { opacity: 0; } }
.sound-toggle span[aria-hidden] { font-size: 1.3rem; line-height: 1; }
.sound-toggle[aria-pressed="false"] { color: var(--muted); background: #f6edf1; }
.sound-toggle:hover { background: var(--pink-light); }
@media (max-width: 800px) { .sound-label { display: none; } .sound-toggle { padding-inline: 9px; } }
@media (max-width: 540px) { .header-progress progress { display: none; } .header-progress { margin-left: auto; } }
.birthday-preloader { position: fixed; inset: 0; z-index: 300; overflow: hidden; background: radial-gradient(circle at 50% 46%, #fff4d9 0, #fce7ef 44%, #f5d7e8 100%); }
.preloader-stage { position: absolute; inset: 0; }
.preloader-gift { position: absolute; top: 50%; left: 50%; z-index: 2; width: clamp(105px, 18vw, 160px); aspect-ratio: 1; filter: drop-shadow(0 18px 22px #ab4c8155); animation: preloader-drop 1.5s cubic-bezier(.22,.8,.35,1) both; }
.preloader-gift img { display: block; width: 100%; height: 100%; object-fit: contain; }
.preloader-splash { position: absolute; top: 50%; left: 50%; width: 100px; aspect-ratio: 1; border: 3px solid #e377a2; border-radius: 50%; box-shadow: 0 0 0 12px #ffd5e755, 0 0 35px #e777aa8c; animation: preloader-splash .9s ease-out .86s both; }
.preloader-splash.second { border-color: #e4b44d; animation-delay: 1.04s; }
.preloader-confetti i { position: absolute; top: 50%; left: 50%; display: block; width: 8px; height: 15px; border-radius: 3px; background: var(--splash-color); box-shadow: 0 0 9px #fff9; animation: preloader-confetti 1.1s cubic-bezier(.2,.75,.3,1) .88s both; }
.preloader-confetti i:nth-child(3n) { width: 9px; height: 9px; border-radius: 50%; }
.birthday-preloader p { position: absolute; top: calc(50% + 118px); left: 0; right: 0; padding-inline: 18px; color: #9d426e; font-family: var(--serif); font-size: clamp(1rem, 2.5vw, 1.3rem); font-style: italic; text-align: center; animation: preloader-caption .65s ease 1.25s both; }
.preloader-gift, .preloader-splash, .preloader-confetti i, .birthday-preloader p { animation-play-state: paused; }
.birthday-preloader.is-playing .preloader-gift, .birthday-preloader.is-playing .preloader-splash, .birthday-preloader.is-playing .preloader-confetti i, .birthday-preloader.is-playing p { animation-play-state: running; }
.birthday-preloader:not(.is-playing) p { top: calc(50% + 82px); animation: none; }
.preloader-start { position: absolute; top: 50%; left: 50%; z-index: 4; transform: translate(-50%, -50%); min-height: 54px; width: max-content; max-width: calc(100vw - 40px); padding: 12px 24px; border: 1px solid #d78cad; border-radius: 999px; background: #fffafc; color: #a33e70; font-weight: 650; text-align: center; box-shadow: 0 12px 32px #9d426e30; }
.preloader-start:hover { background: #ffeaf3; }
.birthday-preloader.is-leaving { animation: preloader-leave .45s ease forwards; pointer-events: none; }
@keyframes preloader-drop { 0% { transform: translate(-50%, -50%) translateY(-110vh) rotate(-18deg) scale(.65); } 55% { transform: translate(-50%, -50%) translateY(0) rotate(5deg) scale(1.17,.76); } 70% { transform: translate(-50%, -50%) translateY(-62px) rotate(-5deg) scale(.92,1.08); } 83% { transform: translate(-50%, -50%) translateY(0) rotate(2deg) scale(1.05,.9); } 91% { transform: translate(-50%, -50%) translateY(-16px) rotate(-1deg); } 100% { transform: translate(-50%, -50%) translateY(0) rotate(0); } }
@keyframes preloader-splash { 0% { transform: translate(-50%, -50%) scale(.15); opacity: 0; } 18% { opacity: .9; } 100% { transform: translate(-50%, -50%) scale(3.8); opacity: 0; } }
@keyframes preloader-confetti { 0% { transform: translate(-50%, -50%) scale(.2); opacity: 0; } 14% { opacity: 1; } 100% { transform: translate(calc(-50% + var(--splash-x)), calc(-50% + var(--splash-y))) rotate(var(--splash-turn)); opacity: 0; } }
@keyframes preloader-caption { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes preloader-leave { to { opacity: 0; visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { .preloader-gift { transform: translate(-50%, -50%); } .preloader-splash, .preloader-confetti { display: none; } .birthday-preloader p { opacity: 1; } }