:root{--bg-desk: oklch(24% .02 55);--desk-pattern-tint: oklch(20% .02 55);--paper-cream: oklch(97.2% .018 86);--paper-warm: oklch(94.8% .025 82);--paper-aged: oklch(91.5% .032 78);--paper-border: oklch(86% .035 75);--paper-shadow: 0 16px 48px -12px oklch(15% .03 40 / .28), 0 4px 16px -4px oklch(15% .03 40 / .12);--paper-inner-vignette: inset 0 0 60px oklch(80% .04 70 / .2);--green-deep: oklch(38% .12 145);--green-forest: oklch(44% .13 144);--green-sage: oklch(68% .09 142);--green-soft: oklch(93% .04 140);--green-tint: oklch(96% .02 140);--sunflower-gold: oklch(79% .18 80);--sunflower-amber: oklch(64% .16 68);--sunflower-glow: oklch(88% .14 85);--sunflower-light: oklch(95% .07 88);--wax-seal: oklch(45% .17 28);--wax-seal-dark: oklch(32% .14 26);--wax-seal-light: oklch(58% .18 30);--wax-seal-shadow: 0 8px 24px -4px oklch(20% .1 28 / .45);--ink-primary: oklch(20% .015 55);--ink-secondary: oklch(36% .02 55);--ink-faded: oklch(55% .025 65);--ink-stamp: oklch(42% .08 145);--font-hand: "Caveat", "Kalam", cursive;--font-editorial: "Marcellus", "Castoro", serif;--font-body: "Ysabeau Office", system-ui, -apple-system, sans-serif;--mobile-width: 440px;--radius-organic: 12px;--transition-smooth: .4s cubic-bezier(.16, 1, .3, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html{font-size:16px;scroll-behavior:smooth;background-color:#fff;color:var(--ink-primary);font-family:var(--font-body);line-height:1.6;overflow-x:hidden;transition:background-color .8s ease}body{min-height:100vh;display:flex;justify-content:center;align-items:flex-start;background-color:#fff;background-image:none;overflow-x:hidden;user-select:none;-webkit-user-select:none;transition:background-color .9s ease,background-image .9s ease}body.carta-abierta{background-color:var(--bg-desk);background-image:radial-gradient(circle at 50% 20%,#32261ccc,#17100c);background-attachment:fixed}body.carta-abierta html{background-color:var(--bg-desk)}#app{width:100%;max-width:var(--mobile-width);min-height:100vh;background-color:#fff;position:relative;box-shadow:none;overflow-x:hidden;display:flex;flex-direction:column;transition:background-color .9s ease,box-shadow .9s ease}body.carta-abierta #app{background-color:var(--paper-cream);box-shadow:var(--paper-shadow)}@media(min-width:500px){#app{margin:24px auto;border-radius:18px}body.carta-abierta #app{box-shadow:0 24px 72px -16px #0a010080,0 0 0 1px #d5cdc04d;box-shadow:0 24px 72px -16px oklch(10% .04 45 / .5),0 0 0 1px #d5cdc04d}}h1,h2,h3,h4{font-family:var(--font-hand);color:var(--ink-primary);font-weight:700;line-height:1.25}p{font-size:clamp(1.05rem,3.8vw,1.2rem);color:var(--ink-secondary);line-height:1.65;max-width:65ch}a{color:var(--green-forest);text-decoration:none}button{cursor:pointer;border:none;background:none;font-family:inherit}.paper-grain-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:999;opacity:0;visibility:hidden;mix-blend-mode:multiply;transition:opacity 1.2s ease,visibility 1.2s ease}body.carta-abierta .paper-grain-overlay{opacity:.045;visibility:visible}#particles-canvas{position:fixed;top:0;left:50%;transform:translate(-50%);width:100%;max-width:var(--mobile-width);height:100vh;pointer-events:none;z-index:10;opacity:0;visibility:hidden;transition:opacity 1.5s ease,visibility 1.5s ease}body.carta-abierta #particles-canvas{opacity:1;visibility:visible}.paper-sheet{background-color:var(--paper-warm);background-image:radial-gradient(ellipse at 80% 10%,oklch(98% .02 90 / .8) 0%,transparent 60%),radial-gradient(ellipse at 20% 90%,oklch(93% .03 80 / .7) 0%,transparent 60%);border-radius:6px;box-shadow:0 4px 20px -2px #1e130e1f,0 1px 3px #1e130e14,inset 0 0 30px #e2d6c259;position:relative;transition:transform var(--transition-smooth),box-shadow var(--transition-smooth)}.paper-deckle{position:relative}.paper-deckle:before,.paper-deckle:after{content:"";position:absolute;left:0;right:0;height:4px;background-repeat:repeat-x;background-size:12px 4px;pointer-events:none;opacity:.7}.washi-tape{position:absolute;height:24px;width:90px;background-color:var(--washi-tape-color);background-image:repeating-linear-gradient(45deg,#e4f9e066,#e4f9e066 6px,#c7e1b966 6px,#c7e1b966 12px);box-shadow:0 1px 3px #1e130e26;z-index:5;border-left:2px dashed oklch(75% .06 135 / .4);border-right:2px dashed oklch(75% .06 135 / .4);-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}.washi-tape.top-center{top:-12px;left:50%;transform:translate(-50%) rotate(-1deg)}.washi-tape.top-left{top:-10px;left:14px;transform:rotate(-3.5deg)}.washi-tape.top-right{top:-10px;right:14px;transform:rotate(3deg)}.wax-seal-btn{width:72px;height:72px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--wax-seal-light) 0%,var(--wax-seal) 50%,var(--wax-seal-dark) 100%);box-shadow:var(--wax-seal-shadow),inset 0 2px 4px #ffd2ca66;box-shadow:var(--wax-seal-shadow),inset 0 2px 4px oklch(90% .1 30 / .4);position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;outline:none;transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease;-webkit-user-select:none;user-select:none}.wax-seal-btn:hover,.wax-seal-btn:active{transform:scale(1.08) rotate(2deg);box-shadow:0 12px 28px -4px #3500008c;box-shadow:0 12px 28px -4px oklch(20% .12 28 / .55)}.wax-seal-btn:before{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;border-radius:50%;border:1.5px dashed oklch(80% .1 30 / .35);pointer-events:none}.wax-seal-icon{width:36px;height:36px;color:#ffdcd0;color:oklch(92% .08 40);filter:drop-shadow(0 1px 2px oklch(20% .1 28 / .8))}.postage-stamp{width:64px;height:78px;background:var(--paper-warm);border:4px solid var(--paper-warm);box-shadow:0 2px 8px #1e130e26;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:4px;transform:rotate(2.5deg);outline:2px dashed oklch(60% .04 140 / .5);outline-offset:-2px}.stamp-illustration{width:100%;height:48px;background-color:var(--green-soft);border-radius:2px;display:flex;align-items:center;justify-content:center;overflow:hidden}.stamp-value{font-family:var(--font-editorial);font-size:.65rem;font-weight:700;color:var(--green-deep);letter-spacing:.05em;text-transform:uppercase}.postmark{position:absolute;width:70px;height:70px;border-radius:50%;border:1.5px solid var(--ink-faded);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ink-faded);font-family:var(--font-editorial);font-size:.55rem;letter-spacing:.1em;opacity:.7;pointer-events:none;transform:rotate(-15deg)}.postmark-lines{position:absolute;right:-30px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:3px}.postmark-line{width:35px;height:1px;background-color:var(--ink-faded);opacity:.6}.polaroid-card{background:#fff;padding:12px 12px 36px;border-radius:3px;box-shadow:0 10px 28px -6px #1e130e33,0 2px 8px -2px #1e130e1f;transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s ease;position:relative;cursor:pointer}.polaroid-card:hover{transform:translateY(-6px) scale(1.02)!important;box-shadow:0 20px 38px -8px #2112094d,0 6px 14px -2px #2112092e;z-index:10}.polaroid-img-wrapper{width:100%;aspect-ratio:4/3;overflow:hidden;border-radius:2px;background:var(--paper-warm)}.polaroid-img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.polaroid-card:hover .polaroid-img{transform:scale(1.05)}.polaroid-caption{position:absolute;bottom:8px;left:12px;right:12px;text-align:center;font-family:var(--font-hand);font-size:1.25rem;color:var(--ink-primary);line-height:1.1}.paperclip{position:absolute;top:-14px;right:28px;width:16px;height:38px;border:2.5px solid oklch(65% .03 70);border-radius:8px;background:transparent;box-shadow:1px 2px 4px #1e130e40;z-index:6;transform:rotate(5deg)}.paperclip:after{content:"";position:absolute;top:4px;left:2px;right:2px;bottom:8px;border:2px solid oklch(70% .03 70);border-radius:4px}.lined-paper{background-image:repeating-linear-gradient(transparent,transparent 27px,oklch(88% .02 85 / .6) 28px);line-height:28px}.floating-audio-bar{position:fixed;top:14px;right:14px;z-index:100;display:flex;align-items:center;gap:8px;background:var(--paper-warm);padding:6px 14px 6px 10px;border-radius:24px;border:1px solid var(--paper-border);box-shadow:0 4px 14px #1e130e2e;font-family:var(--font-editorial);font-size:.8rem;color:var(--green-deep);cursor:pointer;transition:transform .25s ease,opacity .3s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.floating-audio-bar.playing .sound-wave-bar{animation:soundBarPulse 1.2s infinite ease-in-out}.sound-wave-icon{display:flex;align-items:flex-end;gap:2px;height:14px}.sound-wave-bar{width:2.5px;height:4px;background-color:var(--green-deep);border-radius:1px}.sound-wave-bar:nth-child(2){animation-delay:.2s;height:10px}.sound-wave-bar:nth-child(3){animation-delay:.4s;height:14px}.sound-wave-bar:nth-child(4){animation-delay:.1s;height:7px}@keyframes soundBarPulse{0%,to{transform:scaleY(.4)}50%{transform:scaleY(1.2)}}.story-section{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(2.5rem,6vw,4rem) clamp(1.25rem,4vw,2rem)}.section-portada{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1.5rem;text-align:center;position:relative}.calendar-wrapper{margin:auto 0;display:flex;flex-direction:column;align-items:center}.calendar-card{width:230px;background:var(--paper-warm);border-radius:16px;box-shadow:0 16px 38px -8px #21120938,0 4px 14px -2px #2112091f;border:1px solid var(--paper-border);overflow:hidden;position:relative}.calendar-top-bar{background:var(--green-deep);color:var(--paper-cream);padding:12px 16px;display:flex;justify-content:space-between;align-items:center;font-family:var(--font-editorial);font-size:.95rem;letter-spacing:.1em}.calendar-rings{display:flex;gap:34px;position:absolute;top:36px;left:50%;transform:translate(-50%);z-index:5}.calendar-ring{width:10px;height:20px;background:#b8aba2;border-radius:4px;border:1.5px solid oklch(50% .02 60)}.calendar-body{padding:28px 16px 20px;background-color:#fff;display:flex;flex-direction:column;align-items:center;gap:4px;position:relative}.calendar-day-number{font-family:var(--font-editorial);font-size:4.8rem;font-weight:700;color:var(--ink-primary);line-height:1;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.calendar-day-number.highlight-birthday{color:var(--sunflower-amber);animation:pulseBirthday 2s infinite ease-in-out}@keyframes pulseBirthday{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.calendar-sunflower-badge{position:absolute;top:14px;right:14px;width:32px;height:32px;animation:rotateSunflower 12s linear infinite}@keyframes rotateSunflower{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.scroll-hint{position:absolute;bottom:2rem;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--ink-faded);font-family:var(--font-hand);font-size:1.25rem;animation:floatHint 2.4s infinite ease-in-out}.scroll-hint-arrow{width:24px;height:24px;stroke:var(--green-forest)}@keyframes floatHint{0%,to{transform:translateY(0);opacity:.8}50%{transform:translateY(8px);opacity:1}}.section-sobre{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;z-index:10;padding:3rem 1.5rem}.buzon-stage{width:100%;max-width:360px;display:flex;flex-direction:column;align-items:center;transition:opacity .6s ease,transform .6s cubic-bezier(.16,1,.3,1)}.buzon-stage.fade-out{opacity:0;transform:scale(.85);pointer-events:none;display:none}.speech-bubble-countdown{background:var(--paper-warm);border:1px solid var(--paper-border);padding:10px 18px;border-radius:22px;box-shadow:0 6px 20px #1e130e24;font-family:var(--font-hand);font-size:1.35rem;color:var(--green-deep);font-weight:700;position:relative;margin-bottom:1.2rem;text-align:center;animation:bubbleFloat 2.6s infinite ease-in-out}.speech-bubble-countdown:after{content:"";position:absolute;bottom:-9px;left:50%;transform:translate(-50%);border-width:9px 8px 0 8px;border-style:solid;border-color:var(--paper-warm) transparent transparent transparent}@keyframes bubbleFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.mailbox-clickable{width:250px;max-width:80%;height:290px;cursor:pointer;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.mailbox-clickable:hover,.mailbox-clickable:active{transform:scale(1.04)}.mailbox-idle-hint{margin-top:1rem;font-family:var(--font-hand);font-size:1.35rem;color:var(--green-forest);opacity:0;pointer-events:none;transition:opacity .8s ease;display:flex;align-items:center;gap:6px}.mailbox-idle-hint.show{opacity:1}.envelope-foreground-stage{width:100%;max-width:380px;perspective:1200px;display:none;opacity:0;transition:opacity .6s ease,transform .6s cubic-bezier(.16,1,.3,1)}.envelope-foreground-stage.active{display:block;opacity:1}.envelope-3d-card{width:100%;height:250px;position:relative;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.16,1,.3,1);cursor:pointer}.envelope-3d-card.flipped{transform:rotateY(180deg)}.envelope-face-back{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--paper-warm);border-radius:14px;box-shadow:var(--paper-shadow);border:1px solid var(--paper-border);padding:16px;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.envelope-face-back .envelope-stamp-top{position:absolute;top:14px;right:14px;z-index:5}.envelope-flip-prompt{text-align:center;font-family:var(--font-hand);font-size:1.25rem;color:var(--green-forest);margin-top:4px;opacity:0;pointer-events:none;transition:opacity .8s ease}.envelope-flip-prompt.show{opacity:1;animation:pulseBirthday 2s infinite ease-in-out}.envelope-face-front{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--paper-warm);border-radius:14px;box-shadow:var(--paper-shadow);border:1px solid var(--paper-border);backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:rotateY(180deg);overflow:visible}.wax-seal-btn.ready-to-open{animation:sealPulse 2.2s infinite ease-in-out}@keyframes sealPulse{0%,to{box-shadow:var(--wax-seal-shadow);transform:scale(1)}50%{box-shadow:0 8px 24px var(--sunflower-gold);transform:scale(1.06)}}.envelope-flap{position:absolute;top:0;left:0;width:100%;height:130px;background:linear-gradient(180deg,var(--paper-warm) 0%,var(--paper-aged) 100%);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top center;transition:transform .8s cubic-bezier(.4,0,.2,1);z-index:4;border-top-left-radius:14px;border-top-right-radius:14px;box-shadow:0 4px 12px #1e130e26}.envelope-flap.opened{transform:rotateX(180deg);z-index:1}.envelope-seal-positioner{position:absolute;top:92px;left:50%;transform:translate(-50%);z-index:5;transition:opacity .5s ease,transform .5s ease}.envelope-seal-positioner.broken{opacity:0;transform:translate(-50%) scale(1.4);pointer-events:none}.envelope-address{position:absolute;bottom:24px;left:24px;right:24px;font-family:var(--font-hand);font-size:1.45rem;color:var(--ink-secondary);line-height:1.3}.envelope-stamp-top{position:absolute;top:14px;right:14px}.letter-preview{position:absolute;top:15px;left:15px;right:15px;height:210px;background:var(--paper-cream);border-radius:8px;padding:16px;box-shadow:0 2px 10px #1e130e26;transform:translateY(0);transition:transform .8s cubic-bezier(.16,1,.3,1),opacity .4s ease;z-index:2;opacity:.9}.letter-preview.slide-up{transform:translateY(-80px);opacity:1}.tap-to-open-prompt{margin-top:1.5rem;font-family:var(--font-hand);font-size:1.4rem;color:var(--green-forest);text-align:center;display:flex;align-items:center;justify-content:center;gap:8px;transition:opacity .4s ease}.locked-until-opened{display:none;opacity:0;transition:opacity .6s ease}.locked-until-opened.is-unlocked{display:block;opacity:1}.section-carta-continua{width:100%;padding:0 0 3rem;display:flex;flex-direction:column;align-items:center}.single-continuous-paper{width:100%;background:var(--paper-cream);background-image:radial-gradient(ellipse at 85% 10%,oklch(98% .02 90 / .85) 0%,transparent 60%),radial-gradient(ellipse at 15% 50%,oklch(94% .028 82 / .7) 0%,transparent 60%),radial-gradient(ellipse at 85% 90%,oklch(93% .032 80 / .75) 0%,transparent 60%);border-radius:12px;box-shadow:var(--paper-shadow);border:1px solid var(--paper-border);position:relative;padding:clamp(2rem,5vw,3.2rem) clamp(1.25rem,4.5vw,2.25rem);display:flex;flex-direction:column;gap:2.5rem;overflow:hidden}.paper-postal-header{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px dashed var(--paper-border);padding-bottom:1rem;margin-bottom:.5rem}.paper-postal-date{font-family:var(--font-editorial);font-size:.95rem;color:var(--ink-faded);letter-spacing:.08em}.carta-svgs-container{width:100%;display:flex;flex-direction:column;align-items:center;position:relative;z-index:2}.carta-svg-block{width:100%;display:flex;justify-content:center;align-items:center;position:relative;transition:margin-bottom .3s ease}.carta-svg-block svg{width:100%;max-width:100%;height:auto;display:block;overflow:visible}.carta-svg-placeholder-notice{width:100%;padding:1.5rem;border:1px dashed var(--paper-border);border-radius:8px;text-align:center;font-family:var(--font-hand);font-size:1.1rem;color:var(--ink-faded)}.ultimo-mensaje-svg-container{width:100%;display:flex;justify-content:center;align-items:center;margin:1.5rem 0;position:relative}.ultimo-mensaje-svg-container svg{width:100%;max-width:600px;height:auto;display:block;overflow:visible}.svg-anim-scroll,.svg-anim-live,.svg-anim-inner{transform-box:fill-box;transform-origin:center;will-change:transform,opacity,filter}.svg-scroll-proxy{pointer-events:none;visibility:hidden;-webkit-user-select:none;user-select:none}#audio-break-loop-trigger{width:100%;height:2px;opacity:0;pointer-events:none}.section-video{min-height:80vh;padding-top:2rem;padding-bottom:3.5rem;width:100%}.video-frame-container{width:100%;background:var(--paper-warm);border-radius:14px;padding:18px 16px 14px;box-shadow:var(--paper-shadow);border:1px solid var(--paper-border);position:relative;display:flex;flex-direction:column;align-items:center;gap:12px}.video-screen-wrapper{width:100%;aspect-ratio:9/16;max-height:540px;background:#120905;border-radius:8px;overflow:hidden;position:relative;box-shadow:inset 0 0 20px #0009}.video-element{width:100%;height:100%;object-fit:cover;display:block}.video-custom-controls{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#07020166;transition:opacity .3s ease;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.video-custom-controls.hidden{opacity:0;pointer-events:none}.video-play-btn{width:76px;height:76px;border-radius:50%;background:var(--paper-warm);color:var(--green-deep);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px #0006;transition:transform .25s cubic-bezier(.34,1.56,.64,1)}.video-play-btn:hover{transform:scale(1.1)}.video-reactions-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:10}.floating-reaction{position:absolute;font-size:2.2rem;animation:reactionFloat 2.8s ease-out forwards}@keyframes reactionFloat{0%{transform:translateY(0) scale(.5);opacity:0}20%{opacity:1;transform:translateY(-20px) scale(1.2)}80%{opacity:1}to{transform:translateY(-160px) scale(1);opacity:0}}.section-playlist{min-height:80vh;padding-top:2rem;padding-bottom:3.5rem;width:100%}.cassette-sleeve{width:100%;background:var(--paper-warm);border-radius:14px;padding:24px 16px;box-shadow:var(--paper-shadow);border:1px solid var(--paper-border);position:relative;display:flex;flex-direction:column;gap:16px}.spotify-frame-wrapper{width:100%;min-height:380px;height:380px;border-radius:12px;overflow:hidden;box-shadow:0 4px 16px #1e130e26;background:#121212}.spotify-frame-wrapper iframe{width:100%;height:380px;display:block;border-radius:12px}.section-cierre{min-height:85vh;padding-top:2rem;padding-bottom:5rem;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:space-between}.cierre-card{width:100%;background:var(--paper-warm);border-radius:16px;padding:clamp(1.5rem,4vw,2.5rem);box-shadow:var(--paper-shadow);border:1px solid var(--paper-border);display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden}.ultimo-mensaje-svg-container{width:100%;display:flex;justify-content:center;align-items:center}.ultimo-mensaje-svg-container svg{width:100%;max-width:650px;height:auto;display:block;overflow:visible}