:root{--christmas-red: #c41e3a;--christmas-green: #228b22;--watermelon-pink: #ff6b6b;--watermelon-green: #4ecdc4;--gold: #ffd700;--snow-white: #fffafa;--card-cream: #fef9e7}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden}body{font-family:Quicksand,system-ui,sans-serif;background:linear-gradient(135deg,#1a472a,#2d5a3d,#1a472a);min-height:100vh;display:flex;align-items:center;justify-content:center;color:var(--snow-white)}#root{width:100%;height:100%;display:flex;align-items:center;justify-content:center;perspective:1500px}h1,h2,h3{font-family:Mountains of Christmas,cursive}.card-scene{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative}.snowflakes{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:1}.snowflake{position:absolute;top:-20px;color:#fff;font-size:1rem;opacity:.8;animation:fall linear infinite;text-shadow:0 0 5px rgba(255,255,255,.5)}@keyframes fall{0%{transform:translateY(-20px) rotate(0);opacity:0}10%{opacity:.8}90%{opacity:.8}to{transform:translateY(100vh) rotate(360deg);opacity:0}}.card-wrapper{position:relative;width:380px;height:520px;cursor:pointer;transform-style:preserve-3d;z-index:10}.card-front{position:absolute;width:100%;height:100%;backface-visibility:hidden;background:linear-gradient(145deg,#c41e3a,#8b0000);border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 20px 60px #0006,inset 0 2px #fff3;border:4px solid var(--gold);overflow:hidden}.card-front:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(255,215,0,.1) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(255,215,0,.1) 0%,transparent 50%);pointer-events:none}.envelope-flap{position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,#a01830,#c41e3a);clip-path:polygon(0 0,100% 0,50% 70%);border-bottom:3px solid var(--gold)}.card-front-content{display:flex;flex-direction:column;align-items:center;gap:15px;margin-top:60px;z-index:2}.melon-eye-preview{font-size:4rem;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}.click-hint{font-family:Quicksand,sans-serif;font-size:1rem;color:var(--snow-white);opacity:.9;margin-top:20px;text-shadow:0 2px 4px rgba(0,0,0,.3)}.holly-decoration{font-size:2rem;margin-top:10px}.card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;background:linear-gradient(145deg,var(--card-cream) 0%,#fff8dc 100%);border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;box-shadow:0 20px 60px #0006,inset 0 0 30px #0000000d;border:4px solid var(--gold);transform:rotateY(180deg);color:#333}.card-back-content{display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}.merry-christmas{font-family:Mountains of Christmas,cursive;font-size:2.8rem;color:var(--christmas-red);text-shadow:2px 2px 0 var(--christmas-green);line-height:1.2}.melon-eye-main{display:flex;flex-direction:column;align-items:center;gap:5px}.melon-eye-emojis{font-size:4rem;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2))}.melon-eye-text{font-family:Mountains of Christmas,cursive;font-size:2rem;color:var(--watermelon-pink);text-shadow:1px 1px 0 var(--watermelon-green)}.santa-hat{position:absolute;font-size:2.5rem;top:-25px;left:50%;transform:translate(-50%) rotate(-15deg)}.personal-message{font-family:Quicksand,sans-serif;font-size:1.2rem;color:#555;line-height:1.6;max-width:280px}.melanie-name{font-family:Mountains of Christmas,cursive;font-size:1.5rem;color:var(--christmas-green)}.sign-off{font-family:Quicksand,sans-serif;font-size:1.1rem;color:#666;margin-top:10px}.kisses{display:inline-block;position:relative;cursor:default;font-weight:600;color:var(--christmas-red)}.kisses-content{display:inline-block}.corner-decoration{position:absolute;font-size:1.5rem;opacity:.6}.corner-decoration.top-left{top:15px;left:15px}.corner-decoration.top-right{top:15px;right:15px;transform:scaleX(-1)}.corner-decoration.bottom-left{bottom:15px;left:15px;transform:scaleY(-1)}.corner-decoration.bottom-right{bottom:15px;right:15px;transform:scale(-1)}@keyframes sparkle{0%,to{opacity:0;transform:scale(0)}50%{opacity:1;transform:scale(1)}}.sparkle{position:absolute;font-size:1rem;animation:sparkle 2s ease-in-out infinite}@media(max-width:480px){.card-wrapper{width:320px;height:450px}.merry-christmas{font-size:2.2rem}.melon-eye-emojis{font-size:3rem}.personal-message{font-size:1rem}}