:root{--paper:#fffaf2;--cream:#f7eee4;--ink:#3b302e;--muted:#88746d;--rose:#c95369;--rose2:#f0b8b6;--gold:#b88b49;--line:#eadbca;--shadow:0 18px 50px #68453816}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',sans-serif}button,input{font:inherit}button{cursor:pointer}.paper-texture{background-image:radial-gradient(#a9876810 .7px,transparent .7px);background-size:8px 8px}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:12px clamp(16px,5vw,64px);background:#fffaf2eF;border-bottom:1px solid #eadbca;backdrop-filter:blur(12px)}.brand{font:600 1.35rem 'Caveat',cursive;color:var(--rose)}.nav{display:flex;gap:20px;align-items:center}.nav a{color:var(--ink);text-decoration:none;font-size:.83rem}.nav a:hover{color:var(--rose)}.music-btn,.small-btn{border:1px solid var(--line);border-radius:99px;background:#fffaf2;padding:10px 14px;color:var(--ink);font-size:.82rem}.music-btn.active{background:#f7e1df;border-color:var(--rose2)}.hero{min-height:calc(100svh - 60px);display:grid;place-items:center;padding:54px 20px;position:relative;overflow:hidden;background:linear-gradient(135deg,#f7e7d8,#f9f0e8 55%,#f4d9d7)}.hero:before,.hero:after{content:'♡';position:absolute;font:clamp(90px,17vw,220px) 'Caveat';color:#c9536918;transform:rotate(-15deg)}.hero:before{left:-25px;top:4%}.hero:after{right:-20px;bottom:-5%;transform:rotate(15deg)}.hero-card{position:relative;z-index:1;text-align:center;width:min(760px,100%);padding:clamp(28px,6vw,66px);background:#fffaf2d9;border:1px solid #fff;border-radius:5px;box-shadow:var(--shadow);outline:1px solid #dfc9b2;outline-offset:8px}.eyebrow{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--rose);font-weight:700}.hero h1{font:500 clamp(3.3rem,10vw,7.6rem)/.95 'Caveat',cursive;margin:18px 0 8px;color:#553d3a}.hero h1 span{color:var(--rose)}.hero .subtitle{font:italic clamp(1rem,2vw,1.25rem) 'Playfair Display',serif;color:#78625c}.hero .names{font:1.65rem 'Caveat',cursive;margin:20px 0 30px}.primary{border:0;border-radius:999px;background:var(--rose);color:white;padding:14px 23px;box-shadow:0 8px 20px #c9536930;transition:.2s}.primary:hover{transform:translateY(-2px);background:#b74359}.hero-foot{font-size:.76rem;color:var(--muted);margin-top:22px}.floating-heart{position:absolute;color:#c9536970;animation:float 5s ease-in-out infinite}.h1{top:18%;right:15%;font-size:28px}.h2{bottom:22%;left:12%;font-size:22px;animation-delay:1s}@keyframes float{50%{transform:translateY(-14px) rotate(8deg)}}section.content{padding:78px clamp(18px,6vw,84px);max-width:1250px;margin:auto}.section-head{text-align:center;margin-bottom:36px}.section-head .script{font:2rem 'Caveat',cursive;color:var(--rose)}h2{font:500 clamp(2rem,4vw,3.2rem) 'Playfair Display',serif;margin:5px 0 10px}.section-head p{color:var(--muted);margin:0}.letter-wrap{max-width:850px;margin:auto;display:grid;grid-template-columns:1fr 190px;gap:20px;align-items:center}.letter{padding:clamp(25px,5vw,55px);background:#fffaf2;border:1px solid #e6d2ba;box-shadow:var(--shadow);transform:rotate(-.5deg);position:relative}.letter:before{content:'FOR MY FAVOURITE PERSON';font-size:.63rem;letter-spacing:.15em;color:#b78c78}.letter h3{font:2.2rem 'Caveat',cursive;margin:20px 0 12px}.letter p{font:1.02rem/1.9 'Playfair Display',serif;color:#67544d}.signature{font:2rem 'Caveat',cursive;color:var(--rose);text-align:right}.side-note{font:1.7rem/1.2 'Caveat',cursive;color:var(--rose);padding:18px;transform:rotate(5deg);text-align:center}.tape{position:absolute;width:100px;height:25px;background:#dfc5a780;top:-10px;left:40%;transform:rotate(-4deg)}.gallery-tools{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:20px 0 28px}.filter{background:transparent;border:1px solid var(--line);padding:8px 15px;border-radius:99px;color:var(--muted)}.filter.active{background:#f4d9d7;color:#713f45;border-color:#e8b3b4}.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.polaroid{background:#fffdf8;padding:12px 12px 42px;box-shadow:0 9px 24px #5b3a2b17;transform:rotate(var(--r,-2deg));transition:.25s;position:relative;min-width:0}.polaroid:nth-child(2n){--r:2deg}.polaroid:hover{transform:rotate(0) translateY(-5px)}.photo-frame{aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#edc7bd,#f3e1c9 55%,#d9b9ad);color:#795b54;text-align:center;position:relative}.photo-frame img{width:100%;height:100%;object-fit:contain;position:absolute;inset:0}.photo-frame .placeholder{padding:15px;font:1.45rem 'Caveat',cursive}.caption{font:1.4rem 'Caveat',cursive;text-align:center;margin-top:10px}.upload-row{text-align:center;margin-top:24px}.upload-row label{display:inline-flex;gap:8px;align-items:center;border:1px dashed #cba99a;border-radius:99px;padding:11px 16px;color:#805c53;cursor:pointer}.upload-row input{display:none}.hint{font-size:.78rem;color:var(--muted);margin-top:9px}.timeline{max-width:800px;margin:auto;position:relative}.timeline:before{content:'';position:absolute;left:19px;top:10px;bottom:15px;width:2px;background:#e7b9b0}.moment{display:grid;grid-template-columns:40px 1fr;gap:18px;position:relative;margin:22px 0}.dot{width:16px;height:16px;border-radius:50%;background:var(--rose);border:4px solid #f9e4df;margin:6px 0 0 12px;z-index:1}.moment-card{background:#fffaf2;border:1px solid var(--line);padding:22px 24px;border-radius:4px;box-shadow:0 7px 20px #6845380b}.moment-card .date{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--rose);font-weight:700}.moment-card h3{font:1.7rem 'Caveat',cursive;margin:5px 0}.moment-card p{margin:0;color:var(--muted);line-height:1.7}.quiz-box{max-width:700px;margin:auto;background:#fffaf2;border:1px solid var(--line);padding:clamp(24px,5vw,45px);box-shadow:var(--shadow);text-align:center}.quiz-progress{font-size:.78rem;color:var(--rose);letter-spacing:.12em}.quiz-question{font:2rem 'Caveat',cursive;margin:18px 0}.answers{display:grid;gap:10px;text-align:left}.answer{padding:13px 16px;border:1px solid var(--line);background:#fffdf9;border-radius:10px;color:var(--ink);text-align:left;transition:.2s}.answer:hover,.answer.chosen{border-color:var(--rose);background:#fceceb}.quiz-feedback{min-height:30px;margin:14px 0;color:var(--rose);font-size:.9rem}.quiz-actions{display:flex;justify-content:center;gap:10px}.countdown-section{background:#312729;color:#fff6eb;max-width:none!important;text-align:center;position:relative;overflow:hidden}.countdown-section h2{color:#fff0dc}.countdown-section .section-head p{color:#d7c3bb}.countdown{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:32px auto}.time-box{width:100px;padding:17px 8px;border:1px solid #b98e7066;background:#ffffff09;border-radius:8px}.time-box strong{font:2.2rem 'Playfair Display',serif;display:block;color:#f5c8bd}.time-box span{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#d7c3bb}.count-note{font:1.5rem 'Caveat',cursive;color:#f5c8bd}.reveal-card{max-width:780px;margin:auto;text-align:center;padding:clamp(30px,6vw,70px);background:#fffaf2;border:1px solid #e6d2ba;box-shadow:var(--shadow);position:relative}.gift{font-size:4rem;display:block;animation:float 3s ease-in-out infinite}.hidden-message{display:none;margin-top:25px;animation:fadein .8s ease}.hidden-message.show{display:block}.hidden-message h3{font:clamp(2.3rem,6vw,4.5rem) 'Caveat',cursive;color:var(--rose);margin:12px}.hidden-message p{font:1.1rem/1.8 'Playfair Display',serif;color:#67544d}.final-sign{font:2rem 'Caveat',cursive;color:var(--rose)}@keyframes fadein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}footer{text-align:center;padding:30px 15px 42px;color:var(--muted);font:1.4rem 'Caveat',cursive}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,20px);background:#332729;color:white;padding:12px 18px;border-radius:99px;font-size:.85rem;opacity:0;pointer-events:none;transition:.25s;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}.confetti{position:fixed;top:-15px;width:9px;height:13px;z-index:50;pointer-events:none;animation:fall linear forwards}@keyframes fall{to{transform:translateY(110vh) rotate(700deg);opacity:.1}}.divider{color:#c98e82;text-align:center;font-size:1.3rem;letter-spacing:.6em;margin:10px 0 0}
@media(max-width:760px){.nav{display:none}.topbar{padding:12px 16px}.hero{min-height:calc(90svh - 55px)}.hero-card{padding:34px 22px}.letter-wrap{grid-template-columns:1fr}.side-note{display:none}.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.polaroid{padding:8px 8px 34px}.caption{font-size:1.15rem}.photo-frame .placeholder{font-size:1.2rem}.content{padding-top:58px!important;padding-bottom:58px!important}.moment-card{padding:17px}.time-box{width:76px}.time-box strong{font-size:1.8rem}}@media(max-width:400px){.photo-grid{grid-template-columns:1fr 1fr;gap:10px}.polaroid{padding:6px 6px 29px}.caption{font-size:1.05rem}.hero h1{font-size:3.6rem}}

/* Multi-song music player */
.music-player{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}.music-player select{max-width:150px;min-width:90px;border:1px solid var(--line);border-radius:99px;background:#fffaf2;padding:10px 11px;color:var(--ink);font: .78rem 'DM Sans',sans-serif}.song-upload-label{border:1px dashed #cba99a;border-radius:99px;padding:9px 11px;color:#805c53;cursor:pointer;font-size:.78rem;white-space:nowrap}.music-player input[type=file]{display:none}.music-btn{white-space:nowrap}
@media(max-width:760px){.music-player{gap:5px}.music-player select{max-width:112px;padding:9px 8px}.song-upload-label,.music-btn{padding:9px 10px;font-size:.75rem}}