:root{--cream:#fff8e7;--ink:#5d482e;--sun:#f6c945;--butter:#fde992;--gold:#d99c24;--peach:#f7c9ad;--pink:#f3bcc2;--sky:#cfe8f0;--mint:#b7d8c4;--shadow:0 10px 28px rgba(119,82,27,.14);font-family:ui-rounded,"Avenir Next",Avenir,system-ui,sans-serif;color:var(--ink);background:var(--cream)}*{box-sizing:border-box}html,body,#app{margin:0;min-height:100%;min-height:100dvh}body{overflow:hidden;background:var(--cream)}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.scene{position:absolute;inset:0;display:none;min-height:100dvh;overflow:hidden}.scene.is-active{display:flex;animation:sceneIn .55s both}.intro-scene{align-items:center;justify-content:center;padding:calc(28px + env(safe-area-inset-top)) 28px calc(26px + env(safe-area-inset-bottom));background:var(--cream);text-align:center}.paper-speckles,.intro-scene:before{position:absolute;inset:0;pointer-events:none}.paper-speckles{opacity:.32;background-image:radial-gradient(#d7b879 0.6px,transparent .7px);background-size:13px 13px}.intro-scene:before{content:"";background:radial-gradient(circle at 6% 15%,#f7d6cf 0 3px,transparent 4px),radial-gradient(circle at 94% 77%,#f9df80 0 4px,transparent 5px);opacity:.75}.intro-copy{position:relative;z-index:1;max-width:450px}.eyebrow,.garden-label,.letter-top{margin:0 0 12px;font-size:.79rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:#a57632}.intro-scene h1{margin:0;font-size:clamp(2rem,8.2vw,3.5rem);line-height:1.08;letter-spacing:-.055em;font-weight:650}.intro-scene h1 span,.finale-copy h2 span{font-family:"Bradley Hand","Segoe Print",cursive;font-weight:500;color:#c98e24}.intro-last{margin:25px auto 27px;max-width:275px;line-height:1.5;font-size:1rem}.primary-button{position:relative;border:0;border-radius:18px;background:var(--sun);min-height:52px;padding:13px 19px;box-shadow:0 5px 0 #cf9927,0 12px 18px rgba(161,111,26,.12);font-weight:800;font-size:.96rem;transition:transform .2s,box-shadow .2s}.primary-button:active{transform:translateY(4px);box-shadow:0 1px 0 #cf9927}.button-flower{margin-left:8px;font-size:1.2rem}.little-note{position:absolute;bottom:calc(17px + env(safe-area-inset-bottom));margin:0;font-size:.72rem;opacity:.56}.intro-flower{position:absolute;right:8%;top:12%;width:62px;height:78px;transform:rotate(18deg);animation:sway 4s ease-in-out infinite}.intro-flower span{position:absolute;width:5px;height:61px;background:#82a673;left:28px;top:26px;border-radius:9px}.intro-flower i,.intro-flower b,.intro-flower em{position:absolute;border-radius:50%;width:31px;height:31px;background:#f7ce43;top:0;left:15px;transform-origin:center 34px}.intro-flower i{transform:rotate(72deg)}.intro-flower b{transform:rotate(144deg)}.intro-flower em{transform:rotate(216deg)}.intro-flower:after{content:"";position:absolute;width:15px;height:15px;background:#a5712c;border-radius:50%;top:16px;left:23px}.reveal{opacity:0;animation:rise .7s cubic-bezier(.2,.7,.2,1) forwards}.reveal-1{animation-delay:.4s}.reveal-2{animation-delay:1.25s}.reveal-3{animation-delay:2.25s}.reveal-4{animation-delay:3.05s}.garden-scene{flex-direction:column;background:var(--sky);padding:calc(17px + env(safe-area-inset-top)) 16px calc(17px + env(safe-area-inset-bottom))}.garden-header{z-index:5;display:flex;justify-content:space-between;align-items:start}.garden-header h2{font-family:"Bradley Hand","Segoe Print",cursive;font-size:1.65rem;margin:0;line-height:1}.garden-label{margin-bottom:4px;font-size:.65rem}.sound-button{border:1.5px solid rgba(93,72,46,.35);background:#fff9ed80;border-radius:50%;width:44px;height:44px;display:grid;place-items:center}.sound-button svg{width:20px;fill:var(--ink)}.sound-button.is-on{background:var(--sun);border-color:var(--sun)}.sky{position:absolute;left:0;right:0;top:0;height:55%;transition:background .7s}.sky.is-evening{background:#c8c7e3}.cloud{position:absolute;border:0;background:#fffdf3d9;width:65px;height:21px;border-radius:30px;transition:transform .35s}.cloud:after,.cloud:before{content:"";position:absolute;border-radius:50%;background:inherit}.cloud:before{width:31px;height:31px;left:11px;bottom:6px}.cloud:after{width:24px;height:24px;right:10px;bottom:5px}.cloud-one{top:20%;left:5%;transform:rotate(-4deg)}.cloud-two{top:33%;right:5%;transform:scale(.68) rotate(5deg)}.cloud.puffed{transform:scale(1.15,1.34) rotate(3deg)}.sun-doodle{position:absolute;right:19%;top:13%;font-size:2.3rem;color:#f4c63e;transform:rotate(15deg)}.stars{position:absolute;inset:0;opacity:0;transition:opacity .6s;background-image:radial-gradient(#fff5bd 1.3px,transparent 1.8px),radial-gradient(#fff5bd 1px,transparent 1.5px);background-position:30% 28%,70% 36%;background-size:71px 66px,57px 57px}.is-evening .stars{opacity:1}.garden-wrap{position:relative;z-index:2;flex:1;min-height:330px;margin:-3px -10px -16px;transform-origin:center 57%;transition:transform 1.2s cubic-bezier(.22,.72,.22,1)}.garden-wrap.show-heart{transform:scale(.79) translateY(-3%)}.garden-heart{position:absolute;inset:5% 2% 0}.ground{position:absolute;bottom:-11%;left:-10%;width:120%;height:31%;border-radius:50% 50% 0 0;background:#a7c99b;border-top:4px solid #87af7c;transform:rotate(-2deg)}.ground:after{content:"";position:absolute;inset:9px 0;background:repeating-linear-gradient(105deg,transparent 0 17px,rgba(87,129,82,.13) 18px 19px)}.planted-flower{position:absolute;z-index:3;width:58px;height:89px;border:0;background:transparent;padding:0;transform:translate(-50%,-83%) rotate(var(--rotation)) scale(var(--scale));transform-origin:50% 100%}.stem{position:absolute;bottom:0;left:27px;width:5px;height:58px;border-radius:10px;background:#739b68;transform-origin:bottom;animation:stemGrow .38s ease-out both}.leaf{position:absolute;width:19px;height:10px;border-radius:100% 0 100% 0;background:#89af77;bottom:27px;opacity:0;animation:leafIn .2s .25s forwards}.leaf-a{left:11px;transform:rotate(-19deg)}.leaf-b{left:28px;bottom:37px;transform:scaleX(-1) rotate(-18deg)}.bloom{position:absolute;left:5px;top:0;width:45px;height:45px;opacity:0;transform:scale(.3);animation:bloomIn .32s .34s cubic-bezier(.15,.9,.35,1.25) forwards}.bloom i{position:absolute;width:22px;height:22px;border-radius:55% 45% 55% 45%;background:#f7ce43;left:11px;top:0;transform-origin:11px 22px}.bloom i:nth-child(2){transform:rotate(72deg)}.bloom i:nth-child(3){transform:rotate(144deg)}.bloom i:nth-child(4){transform:rotate(216deg)}.bloom i:nth-child(5){transform:rotate(288deg)}.bloom b{position:absolute;z-index:1;width:14px;height:14px;border-radius:50%;background:#a8752a;top:15px;left:15px}.bloom.sun i{background:#f2b82e}.bloom.sun b{background:#825d2e}.planted-flower.is-grown .stem,.planted-flower.is-grown .leaf,.planted-flower.is-grown .bloom{animation:none;opacity:1}.planted-flower.is-grown .bloom{transform:scale(1)}.planted-flower.wiggle{animation:flowerWiggle .7s ease}.garden-controls{z-index:6;display:grid;justify-items:center;gap:11px;transition:opacity .35s,transform .35s}.garden-controls.is-hidden{opacity:0;transform:translateY(20px);pointer-events:none}.progress-card{display:flex;align-items:baseline;gap:8px;padding:7px 12px;border:1px dashed rgba(93,72,46,.36);border-radius:11px;background:#fff8e2b5;transform:rotate(-1deg);font-size:.74rem}.progress-card strong{font-size:1.13rem}.progress-card small{font-size:.76rem;font-weight:600}.plant-button{width:min(100%,340px);background:#f6c945}.garden-hint{margin:0;font-size:.72rem;opacity:.7}.modal-layer{position:fixed;z-index:20;inset:0;display:grid;place-items:center;padding:28px;background:rgba(66,48,25,.24);opacity:0;pointer-events:none;transition:opacity .25s}.modal-layer.is-open{opacity:1;pointer-events:auto}.modal-card{position:relative;width:min(100%,360px);text-align:center;animation:paperIn .38s both}.note-card{background:#ffe482;padding:43px 30px 24px;box-shadow:var(--shadow);transform:rotate(-2deg);clip-path:polygon(1% 2%,99% 0,98% 98%,3% 100%,0 45%)}.sticker-pin{position:absolute;top:12px;left:50%;color:#d79c21;font-size:1.4rem}.hand-note{font-family:"Bradley Hand","Segoe Print",cursive;font-size:1.52rem;line-height:1.35;margin:5px 0 23px}.mini-close{border:0;border-bottom:2px solid var(--ink);background:transparent;padding:8px;font-size:.83rem;font-weight:800}.memory-card{background:#f6c7c6;padding:22px;box-shadow:var(--shadow);transform:rotate(1.5deg)}.polaroid{background:#fffdf5;padding:10px 10px 18px;box-shadow:0 4px 12px #8b6b5030}.polaroid img,.photo-placeholder{display:block;width:100%;height:205px;object-fit:cover;background:#f6dcab}.photo-placeholder{display:grid;place-items:center;background:linear-gradient(135deg,#f5cf83,#eeb7ae);color:#795f42;font-family:"Bradley Hand","Segoe Print",cursive;font-size:1.35rem;line-height:1.15}.polaroid span{display:block;padding:14px 4px 0;font-family:"Bradley Hand","Segoe Print",cursive;font-size:1.06rem}.polaroid.scrapbook{transform:rotate(-2deg);position:relative}.polaroid.scrapbook:after{content:"";position:absolute;width:90px;height:19px;top:-8px;right:10px;background:#b8d6caab;transform:rotate(8deg)}.message-card{overflow:hidden;background:#fff2cf;padding:38px 29px 24px;text-align:left;box-shadow:var(--shadow);transform:rotate(1deg)}.folded-corner{position:absolute;right:0;top:0;border-left:38px solid transparent;border-bottom:38px solid #efd894}.letter-note{font-family:"Bradley Hand","Segoe Print",cursive;font-size:1.35rem;line-height:1.4;margin:0 0 20px}.surprise-card{background:transparent;box-shadow:none;color:#fffdf2}.big-small-note{font-family:"Bradley Hand","Segoe Print",cursive;font-size:3rem;text-shadow:0 2px 6px #4b436366}.surprise-card .mini-close{color:white;border-color:white}.question-card{background:#ffeaa1;padding:30px 22px 24px;box-shadow:var(--shadow);transform:rotate(-1deg)}.question{font-family:"Bradley Hand","Segoe Print",cursive;font-size:1.43rem;line-height:1.25;margin:0 0 20px}.answer-list{display:grid;gap:9px}.answer-list button{border:1.5px solid #bc913e;border-radius:12px;background:#fff8e4;padding:11px;font-size:.9rem;font-weight:700}.answer-list.is-answered{opacity:.48;pointer-events:none}.answer-reveal{margin:16px 0 0;font-family:"Bradley Hand","Segoe Print",cursive;font-size:2.4rem;color:#b77b25;opacity:0;transform:translateY(8px);transition:.3s}.answer-reveal.is-visible{opacity:1;transform:translateY(0)}.petal-layer{position:fixed;z-index:40;inset:0;pointer-events:none;overflow:hidden}.petal-layer i{position:absolute;width:13px;height:9px;border-radius:100% 0 100% 0;background:#f4cb44;animation:petalFall 2.5s var(--delay) ease-in forwards}.finale-scene{align-items:center;justify-content:center;padding:calc(32px + env(safe-area-inset-top)) 29px calc(28px + env(safe-area-inset-bottom));background:radial-gradient(circle at 50% 20%,#fffbe9 0 7%,transparent 46%),#f5d674;text-align:center}.finale-copy{position:relative;z-index:2;max-width:390px}.finale-copy h2{margin:10px 0 18px;font-size:clamp(2rem,8.5vw,3.2rem);line-height:1.04;letter-spacing:-.06em}.finale-copy>p:not(.eyebrow){font-size:1rem;margin:0 0 28px}.finale-petals:after{content:"✦  ·  ✧    ·  ✦";position:absolute;top:15%;left:0;right:0;color:#d29a29;letter-spacing:17px;font-size:1.2rem;transform:rotate(-4deg)}.letter-scene{align-items:center;justify-content:center;flex-direction:column;padding:calc(24px + env(safe-area-inset-top)) 23px calc(21px + env(safe-area-inset-bottom));background:#f6d8b3}.envelope{position:relative;width:226px;height:151px;border:0;background:#f0bd70;filter:drop-shadow(0 12px 8px #80552f38);transition:transform .4s}.envelope:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,transparent 49%,#e6aa5e 50%) left,linear-gradient(215deg,transparent 49%,#e6aa5e 50%) right;background-size:50% 100%;background-repeat:no-repeat}.envelope-front{position:absolute;inset:0;clip-path:polygon(0 0,50% 55%,100% 0,100% 100%,0 100%);background:#f5ca86}.envelope-flap{position:absolute;z-index:3;top:0;left:0;width:100%;height:82px;background:#f9d38d;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;transition:transform .55s}.envelope-seal{position:absolute;z-index:4;top:57px;left:calc(50% - 17px);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#f4cd42;color:#9b7225;transition:opacity .2s}.envelope.is-open{transform:translateY(16px)}.envelope.is-open .envelope-flap{transform:rotateX(180deg)}.envelope.is-open .envelope-seal{opacity:0}.envelope-prompt{margin:28px 0 0;font-family:"Bradley Hand","Segoe Print",cursive;font-size:1.12rem;transition:.3s}.envelope-prompt.is-hidden{opacity:0}.letter-card{position:absolute;z-index:4;width:min(calc(100% - 38px),390px);max-height:calc(100dvh - 42px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;background:#fff9e9;padding:29px 26px 22px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transform:translateY(80px) scale(.93);transition:opacity .4s,transform .55s}.letter-card:before{content:"";position:absolute;inset:7px;border:1px dashed #e0bf83;pointer-events:none}.letter-card.is-visible{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}.letter-top{font-size:.59rem;margin-bottom:9px}.letter-card h2{font-family:"Bradley Hand","Segoe Print",cursive;font-size:2rem;margin:0 0 17px}.letter-text{position:relative;font-size:.93rem;line-height:1.5}.letter-text p{margin:0 0 12px}.letter-ending{font-family:"Bradley Hand","Segoe Print",cursive;font-size:1.3rem;margin:20px 0 2px}.signature{font-family:"Bradley Hand","Segoe Print",cursive;font-size:1.35rem;margin:0}.restart-button{position:relative;margin-top:18px;border:0;background:transparent;text-decoration:underline;font-size:.74rem;opacity:.7;padding:8px}.restart-button:active{opacity:1}@keyframes rise{to{opacity:1;transform:translateY(0)}}@keyframes sceneIn{from{opacity:0}to{opacity:1}}@keyframes sway{50%{transform:rotate(12deg) translateY(-3px)}}@keyframes stemGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes leafIn{to{opacity:1}}@keyframes bloomIn{to{opacity:1;transform:scale(1)}}@keyframes flowerWiggle{30%{transform:translate(-50%,-83%) rotate(calc(var(--rotation) - 8deg)) scale(var(--scale))}65%{transform:translate(-50%,-83%) rotate(calc(var(--rotation) + 5deg)) scale(var(--scale))}}@keyframes paperIn{from{opacity:0;transform:translateY(18px) scale(.92)}to{opacity:1}}@keyframes petalFall{to{transform:translate(var(--drift),110dvh) rotate(430deg);opacity:0}}@media(min-width:700px){.garden-scene{max-width:480px;margin:auto;box-shadow:0 0 60px #68522526}.scene:not(.garden-scene){max-width:680px;margin:auto}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.reveal{opacity:1}.intro-flower{animation:none}}
/* Los tallos se prolongan hasta el montículo para que el jardín tenga raíces. */
.stem-tail{position:absolute;z-index:-1;left:28px;top:89px;width:3px;height:var(--tail-length);border-radius:0 0 8px 8px;background:#729765;transform-origin:top;animation:stemGrow .42s ease-out both}.planted-flower.is-grown .stem-tail{animation:none;opacity:1}
/* Una loma alta sostiene el macizo de flores. */
.ground{height:55%}