.hero{position:relative;background:var(--gradient-hero);padding:66px 24px 44px;text-align:center;overflow:hidden}.hero__title{margin:0 auto;max-width:9ch;font-size:clamp(52px,15vw,84px);font-weight:600;line-height:.9;letter-spacing:-.04em;color:#fff}.hero__subtitle{margin:24px auto 0;max-width:360px;font-family:var(--font-hand);font-size:27px;line-height:1.32;color:#fffffff5;transform:rotate(-.6deg)}.hero__mailbox{margin:30px auto 0;max-width:440px;animation:floaty 6s ease-in-out infinite}.hero__mailbox img{width:100%;height:auto;display:block;filter:drop-shadow(var(--shadow-mailbox))}.archive-row{cursor:pointer;display:flex;gap:16px;align-items:flex-start;padding:16px 4px;border-bottom:1px solid var(--color-card-border);transition:padding-left .35s ease}.archive-row:hover{padding-left:12px}.archive-row__date{flex:none;text-align:center;width:44px}.archive-row__day{font-size:22px;font-weight:600;color:var(--color-heading);line-height:1;letter-spacing:-.03em}.archive-row__mon{font-family:var(--font-label);font-size:10px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--color-slate);margin-top:3px}.archive-row__body{flex:1;min-width:0}.archive-row__title-line{display:flex;align-items:center;gap:8px}.archive-row__title{margin:0;font-size:16.5px;font-weight:600;letter-spacing:-.02em;color:var(--color-heading)}.archive-row__unread-dot{flex:none;width:6px;height:6px;border-radius:50%;background:var(--color-accent)}.archive-row__location{margin:4px 0 0;font-size:13.5px;color:var(--color-slate);letter-spacing:-.01em}.archive-row__arrow{flex:none;color:var(--color-chevron);font-size:18px;align-self:center}.archive-month{margin-top:44px}.archive-month__label-row{display:flex;align-items:center;gap:14px;margin-bottom:18px}.archive-month__label{font-family:var(--font-hand);font-size:22px;color:var(--color-charcoal)}.archive-month__line{flex:1;height:1px;background:var(--color-divider-soft)}.archive-timeline{max-width:560px;margin:0 auto;padding:40px 24px}.archive-timeline__heading{text-align:center;margin-bottom:8px}.archive-timeline__eyebrow{font-family:var(--font-label);font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--color-slate)}.archive-timeline__title{margin:10px 0 0;font-size:28px;font-weight:600;letter-spacing:-.04em;color:var(--color-heading)}.easter-egg{text-align:center;padding:56px 0 12px}.easter-egg__trigger{font-family:var(--font-hand);font-size:19px;color:var(--color-taupe);cursor:default;transition:color .4s ease}.easter-egg:hover .easter-egg__trigger{color:var(--color-rust)}.easter-egg__reveal{opacity:0;transition:opacity .6s ease;margin:10px 0 0;font-family:var(--font-hand);font-size:17px;color:var(--color-rust)}.easter-egg:hover .easter-egg__reveal{opacity:1}.home{animation:softIn .7s ease both}.home__empty{text-align:center;color:var(--color-ink-soft, #7b8794);font-style:italic;padding:3rem 1.5rem}.letter-topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:13px 20px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:var(--color-topbar-bg);border-bottom:1px solid var(--color-topbar-border)}.letter-topbar__back{cursor:pointer;display:flex;align-items:center;gap:7px}.letter-topbar__arrow{color:var(--color-charcoal);font-size:15px}.letter-topbar__label{font-family:var(--font-label);font-size:11.5px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--color-charcoal)}.letter-topbar__no{font-family:var(--font-label);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--color-taupe-strong)}.letter-header{text-align:center;padding:52px 0 8px;animation:fadeUp .8s ease both}.letter-header__date{margin:0 0 18px;font-family:var(--font-label);font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--color-slate)}.letter-header__title{margin:0;font-size:clamp(34px,9vw,46px);font-weight:600;line-height:1.06;letter-spacing:-.04em;color:var(--color-heading)}.letter-header__location{display:inline-flex;align-items:center;gap:6px;margin-top:20px;font-size:14px;font-weight:500;color:var(--color-charcoal);letter-spacing:-.01em}.flower-divider{display:flex;align-items:center;gap:16px;padding:34px 8px 30px}.flower-divider__line{flex:1;height:1px;background:var(--color-divider)}.letter-paragraph{margin:0 0 26px;font-size:19px;line-height:1.75;letter-spacing:-.005em;color:var(--color-body-copy)}.margin-note{text-align:right;margin:-8px 0 26px;font-family:var(--font-hand);font-size:19px;color:var(--color-honey);transform:rotate(-1.2deg)}.polaroid-wrap{display:flex;justify-content:center;margin:14px 0 34px}.polaroid{margin:0;background:var(--color-card-bg);padding:12px 12px 0;border-radius:var(--radius-polaroid);box-shadow:var(--shadow-polaroid);transform:rotate(-2.4deg)}.polaroid__photo{width:230px;height:230px;border-radius:2px;background:var(--pattern-polaroid);display:flex;align-items:flex-end;justify-content:center;padding:12px}.polaroid__placeholder-tag{font-family:var(--font-label);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--color-placeholder-label-text);background:var(--color-placeholder-label-bg);padding:3px 8px;border-radius:20px}.polaroid__caption{font-family:var(--font-hand);font-size:20px;color:var(--color-figcaption);text-align:center;padding:12px 6px 16px}.polaroid__img{width:100%;height:100%;object-fit:cover;display:block}.memory-card-wrap{margin:8px 0 34px}.memory-card{position:relative;background:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-card);padding:22px 24px;box-shadow:var(--shadow-card)}.memory-card__label-row{display:flex;align-items:center;gap:7px;margin-bottom:12px}.memory-card__label{font-family:var(--font-label);font-size:10.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--color-accent)}.memory-card__note{margin:0;font-size:17px;line-height:1.55;color:var(--color-signature-secondary);letter-spacing:-.01em}.captioned-photo-wrap{margin:0 -26px 34px}.captioned-photo{margin:0;position:relative;overflow:hidden;cursor:default}.captioned-photo__placeholder{height:280px;background:var(--pattern-fullbleed);display:flex;align-items:center;justify-content:center}.captioned-photo__tag{font-family:var(--font-label);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--color-placeholder-label-text);background:#fffdf9b8;padding:4px 10px;border-radius:20px}.captioned-photo__caption{opacity:0;transition:opacity .5s ease;position:absolute;left:0;right:0;bottom:0;padding:34px 26px 18px;background:linear-gradient(180deg,transparent,rgba(20,16,10,.62));color:#fbf7ef;font-family:var(--font-hand);font-size:20px}.captioned-photo:hover .captioned-photo__caption,.captioned-photo:focus-within .captioned-photo__caption{opacity:1}.captioned-photo__img{width:100%;height:100%;object-fit:cover;display:block}.letter-quote{margin:26px 0 36px;text-align:center;padding:0 6px}.letter-quote p{margin:0;font-size:27px;font-weight:500;line-height:1.3;letter-spacing:-.03em;color:var(--color-heading)}.voice-player-wrap{margin:0 0 22px}.voice-player{background:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-card);padding:16px 18px;display:flex;align-items:center;gap:16px;box-shadow:var(--shadow-subtle)}.voice-player__button{cursor:pointer;flex:none;padding:0;background:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:44px;height:44px;border-radius:50%;border:1.6px solid var(--color-accent);display:flex;align-items:center;justify-content:center;color:var(--color-accent);transition:background .3s ease,color .3s ease}.voice-player__button:hover{background:var(--color-accent);color:#fff}.voice-player__icon--pause{font-size:13px;letter-spacing:1px}.voice-player__icon--play{font-size:13px;margin-left:2px}.voice-player__body{flex:1;min-width:0}.voice-player__bars{display:flex;align-items:flex-end;gap:2.5px;height:30px}.voice-player__bar{flex:1;background:var(--color-accent);border-radius:3px;opacity:.85}.voice-player__label{margin:8px 0 0;font-family:var(--font-hand);font-size:17px;color:var(--color-slate)}.voice-player__time{flex:none;font-family:var(--font-label);font-size:12px;color:var(--color-slate)}.song-card-wrap{margin:0 0 34px}.song-card{background:var(--color-card-bg);border:1px solid var(--color-card-border);border-radius:var(--radius-card);padding:16px 18px;display:flex;align-items:center;gap:14px;box-shadow:var(--shadow-subtle)}.song-card__art{flex:none;width:52px;height:52px;border-radius:10px;background:var(--gradient-song-icon);display:flex;align-items:center;justify-content:center}.song-card__body{flex:1;min-width:0}.song-card__label{font-family:var(--font-label);font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--color-accent)}.song-card__title{margin:3px 0 0;font-size:15.5px;font-weight:600;letter-spacing:-.01em;color:var(--color-heading);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-card__artist{margin:1px 0 0;font-size:13px;color:var(--color-slate)}.song-card__play{flex:none;color:var(--color-accent);font-size:20px}.countdown-wrap{margin:8px 0 32px}.countdown{background:var(--gradient-countdown);border:1px solid #d3e2f0;border-radius:var(--radius-countdown);padding:26px 18px;box-shadow:var(--shadow-countdown)}.countdown__eyebrow-row{text-align:center;margin-bottom:18px}.countdown__eyebrow{font-family:var(--font-label);font-size:10.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--color-accent)}.countdown__grid{display:flex;align-items:stretch;text-align:center}.countdown__cell{flex:1;display:flex;flex-direction:column;gap:6px;padding:0 8px}.countdown__number{font-size:clamp(46px,14vw,62px);font-weight:700;letter-spacing:-.05em;color:var(--color-heading);line-height:.92}.countdown__caption{font-family:var(--font-label);font-size:11px;font-weight:500;letter-spacing:.03em;text-transform:uppercase;color:var(--color-charcoal);line-height:1.35}.countdown__date{font-size:13px;color:var(--color-slate)}.countdown__divider{width:1px;background:linear-gradient(180deg,transparent,#c3d6ea 28%,#c3d6ea 72%,transparent);margin:2px 0}.signature{padding:24px 0 22px;text-align:center}.signature__text{margin:0;font-family:var(--font-hand);font-size:34px;font-weight:600;line-height:1;color:var(--color-heading)}.signature__prefix{font-weight:400;font-size:26px;color:var(--color-signature-secondary)}.signature__heart{font-size:20px}.section-divider{display:flex;align-items:center;gap:16px;padding:24px 8px 30px}.section-divider__line{flex:1;height:1px;background:var(--color-divider)}.section-divider__dot{width:5px;height:5px;border-radius:50%;background:var(--color-chevron)}.prev-next-nav{display:flex;gap:10px;padding-top:6px}.prev-next-nav__item{flex:1;cursor:pointer;padding:6px 2px;transition:transform .35s ease,box-shadow .35s ease}.prev-next-nav__item:hover{transform:translateY(-3px);box-shadow:#1037840d 0 14px 30px}.prev-next-nav__item--right{text-align:right}.prev-next-nav__label{font-family:var(--font-label);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--color-taupe)}.prev-next-nav__title{margin:4px 0 0;font-size:13px;font-weight:600;letter-spacing:-.02em;color:var(--color-signature-secondary);line-height:1.2}.letter-page{background:var(--color-page-bg);min-height:100vh}.letter-page__article{max-width:588px;margin:0 auto;padding:0 26px 40px}.letter-page__opening{position:relative}.paper-texture{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:60;opacity:.5;mix-blend-mode:multiply;background-image:radial-gradient(rgba(120,110,95,.05) 1px,transparent 1px),radial-gradient(rgba(120,110,95,.04) 1px,transparent 1px);background-size:3px 3px,4px 4px;background-position:0 0,1px 2px}.envelope-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;display:flex;align-items:center;justify-content:center;background:var(--gradient-envelope-overlay);animation:overlayFade 1.5s ease forwards}.envelope-overlay__scene{position:relative;width:200px;height:140px;perspective:900px}.envelope-overlay__box{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color-envelope-box-bg);border:1px solid var(--color-envelope-box-border);border-radius:10px;box-shadow:var(--shadow-envelope)}.envelope-overlay__paper{position:absolute;left:14px;right:14px;top:16px;bottom:12px;background:var(--color-card-bg);border-radius:4px;box-shadow:var(--shadow-paper);animation:paperRise 1.15s cubic-bezier(.4,.1,.2,1) forwards}.envelope-overlay__flap{position:absolute;top:0;left:0;right:0;height:0;border-left:100px solid transparent;border-right:100px solid transparent;border-top:76px solid var(--color-envelope-flap);transform-origin:top;animation:flapOpen 1.15s ease forwards;z-index:3}:root{--font-body: "Manrope", ui-sans-serif, system-ui, -apple-system, sans-serif;--font-label: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;--font-hand: "Caveat", cursive;--color-page-bg: #f2ece2;--color-text: #070709;--color-heading: #151515;--color-body-copy: #2c2a28;--color-charcoal: #60606c;--color-slate: #8b8b8b;--color-taupe: #a89e8c;--color-taupe-strong: #b3a998;--color-accent: #2597d0;--color-accent-hover: #1c7bab;--color-rust: #c0563f;--color-honey: #b08968;--color-card-bg: #fffdf9;--color-card-border: #ece6da;--color-divider: #ddd4c4;--color-divider-soft: #e0d8c9;--color-chevron: #c8c0b1;--color-signature-secondary: #3a3733;--color-figcaption: #4a453d;--gradient-hero: linear-gradient(180deg, #779bc1 0%, #9abfda 46%, #cbdcec 74%, #f2ece2 100%);--gradient-envelope-overlay: linear-gradient(180deg, #9abfda, #cbdcec 60%, #f2ece2);--gradient-countdown: linear-gradient(135deg, #eaf2fb 0%, #dce8f5 100%);--gradient-song-icon: linear-gradient(135deg, #9abfda, #cbdcec);--pattern-polaroid: repeating-linear-gradient(135deg, #e7dfd0 0 11px, #efe8db 11px 22px);--pattern-fullbleed: repeating-linear-gradient(45deg, #dcd3c2, #dcd3c2 12px, #e4ddce 12px 24px);--color-placeholder-label-bg: rgba(255, 253, 249, .7);--color-placeholder-label-text: #a89e8c;--shadow-mailbox: 0 16px 26px rgba(20, 50, 90, .14);--shadow-polaroid: 0 14px 30px rgba(40, 35, 25, .14);--shadow-card: rgba(16, 55, 132, .03) 0px 12px 30px 0px;--shadow-subtle: rgba(228, 229, 231, .24) 0px 1px 2px 0px;--shadow-countdown: rgba(16, 55, 132, .04) 0px 12px 30px 0px;--shadow-envelope: 0 20px 50px rgba(30, 50, 80, .25);--shadow-paper: 0 6px 14px rgba(0, 0, 0, .08);--radius-card: 16px;--radius-countdown: 20px;--radius-polaroid: 4px;--radius-pill: 20px;--color-selection-bg: #d7e6f5;--color-topbar-bg: rgba(242, 236, 226, .62);--color-topbar-border: rgba(220, 212, 198, .6);--color-envelope-box-bg: #f4eee3;--color-envelope-box-border: #e2d9c8;--color-envelope-flap: #ece3d2}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--color-page-bg);color:var(--color-text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a{color:var(--color-accent);text-decoration:none}a:hover{color:var(--color-accent-hover)}::selection{background:var(--color-selection-bg)}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}@keyframes softIn{0%{opacity:0}to{opacity:1}}@keyframes flapOpen{0%{transform:rotateX(0)}40%{transform:rotateX(0)}to{transform:rotateX(-172deg)}}@keyframes paperRise{0%{transform:translateY(28px) scale(.96);opacity:0}38%{opacity:1}to{transform:translateY(-118%) scale(1);opacity:1}}@keyframes overlayFade{0%{opacity:0}8%{opacity:1}60%{opacity:1}to{opacity:0}}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.reveal{opacity:0;transform:translateY(20px);transition:opacity 1s ease,transform 1s ease}.reveal--fade-only{transform:none;transition:opacity 1.1s ease}.reveal.is-visible{opacity:1;transform:none}