:root{--bg-gradient-start:#ffeaef;--bg-gradient-end:#ffccd8;--primary-pink:#ff5e97;--primary-pink-hover:#e0487d;--deep-rose:#d6336c;--pastel-pink-light:#fff0f3;--accent-gold:#ffd275;--text-primary:#4a1525;--text-secondary:#7c3a4f;--glass-bg:#ffffff73;--glass-border:#fff6;--glass-shadow:0 10px 30px #d6336c1f;--card-glow:0 0 20px #ff5e9733;--font-title:"Great Vibes", cursive;--font-heading:"Playfair Display", serif;--font-body:"Quicksand", sans-serif;--font-ui:"Outfit", sans-serif}[data-theme=dark]{--bg-gradient-start:#1c0a0f;--bg-gradient-end:#0c0205;--primary-pink:#ff75a6;--primary-pink-hover:#ff9cbd;--deep-rose:#f06292;--pastel-pink-light:#291016;--accent-gold:#ffe082;--text-primary:#ffe6ed;--text-secondary:#c9b1b7;--glass-bg:#140a0da6;--glass-border:#ff75a626;--glass-shadow:0 10px 35px #00000080;--card-glow:0 0 25px #ff75a626}*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--primary-pink) var(--bg-gradient-start);margin:0;padding:0}html,body{width:100%;min-height:100vh;font-family:var(--font-body);background:linear-gradient(135deg, var(--bg-gradient-start), var(--bg-gradient-end));color:var(--text-primary);transition:background .5s,color .3s;overflow-x:hidden}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-gradient-start)}::-webkit-scrollbar-thumb{background:var(--primary-pink);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--deep-rose)}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:24px;transition:transform .3s,box-shadow .3s,border-color .3s}.glass-panel:hover{box-shadow:var(--glass-shadow), var(--card-glow)}.glass-button{background:linear-gradient(135deg, var(--primary-pink), var(--deep-rose));color:#fff;font-family:var(--font-ui);cursor:pointer;border:none;border-radius:30px;justify-content:center;align-items:center;padding:12px 28px;font-size:1rem;font-weight:600;text-decoration:none;transition:transform .2s,box-shadow .2s,filter .2s;display:inline-flex;box-shadow:0 4px 15px #d6336c4d}.glass-button:hover{filter:brightness(1.05);transform:translateY(-2px);box-shadow:0 6px 20px #d6336c73}.glass-button:active{transform:translateY(1px)}@keyframes heartBeat{0%{transform:scale(1)}14%{transform:scale(1.12)}28%{transform:scale(1)}42%{transform:scale(1.12)}70%{transform:scale(1)}}@keyframes pulseGlow{0%{box-shadow:0 0 #ff5e9766}70%{box-shadow:0 0 0 15px #ff5e9700}to{box-shadow:0 0 #ff5e9700}}@keyframes float{0%{transform:translateY(0)rotate(0)}50%{transform:translateY(-10px)rotate(3deg)}to{transform:translateY(0)rotate(0)}}@keyframes softFloat{0%{opacity:0;transform:translateY(0)scale(1)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(-100vh)scale(.6)}}@keyframes textGlow{0%{text-shadow:0 0 10px #ff75a633}50%{text-shadow:0 0 20px #ff75a680,0 0 30px #ff75a64d}to{text-shadow:0 0 10px #ff75a633}}@keyframes ribbonRoll{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.heartbeat-animation{animation:2s ease-in-out infinite heartBeat}.float-animation{animation:4s ease-in-out infinite float}.glow-text{animation:3s ease-in-out infinite textGlow}.entrance-overlay{z-index:9999;background:radial-gradient(circle, var(--pastel-pink-light) 0%, var(--bg-gradient-end) 100%);flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity 1s cubic-bezier(.77,0,.175,1),visibility 1s;display:flex;position:fixed;top:0;left:0}.entrance-overlay.fade-out{opacity:0;visibility:hidden;pointer-events:none}.entrance-card{text-align:center;width:90%;max-width:450px;padding:40px;animation:5s ease-in-out infinite float;box-shadow:0 20px 50px #d6336c40}.entrance-heart{color:var(--primary-pink);cursor:pointer;filter:drop-shadow(0 4px 10px #ff5e974d);margin-bottom:20px;font-size:5rem;transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.entrance-heart:hover{transform:scale(1.15)rotate(-5deg)}.hearts-container{pointer-events:none;z-index:1;width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.main-wrapper{z-index:10;grid-template-columns:1fr;gap:30px;max-width:1200px;margin:0 auto;padding:20px;display:grid;position:relative}header{text-align:center;padding:40px 0 20px}.title-sana{font-family:var(--font-title);color:var(--deep-rose);filter:drop-shadow(0 2px 4px #d6336c26);margin-bottom:10px;font-size:5.5rem;line-height:1.1}.subtitle{font-family:var(--font-heading);color:var(--text-secondary);font-size:1.6rem;font-style:italic;font-weight:500}.cards-grid{grid-template-columns:1fr;gap:30px;display:grid}@media (min-width:768px){.cards-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.main-wrapper{grid-template-columns:350px 1fr;padding:40px}header{grid-column:1/-1}}.sidebar-panel{flex-direction:column;gap:24px;display:flex}.profile-card{text-align:center;flex-direction:column;align-items:center;padding:30px;display:flex}.profile-avatar-container{border:4px solid var(--pastel-pink-light);background:var(--pastel-pink-light);border-radius:50%;justify-content:center;align-items:center;width:130px;height:130px;margin-bottom:20px;display:flex;position:relative;overflow:hidden;box-shadow:0 0 20px #ff5e9740}.profile-avatar-heart{color:var(--primary-pink);font-size:3.5rem;animation:1.5s ease-in-out infinite heartBeat}.profile-name{font-family:var(--font-heading);color:var(--text-primary);margin-bottom:5px;font-size:1.8rem}.profile-status{font-size:.9rem;font-family:var(--font-ui);text-transform:uppercase;letter-spacing:2px;color:var(--deep-rose);margin-bottom:15px;font-weight:700}.profile-bio{color:var(--text-secondary);font-size:.95rem;line-height:1.5}.player-card{flex-direction:column;gap:15px;padding:24px;display:flex}.player-header{align-items:center;gap:12px;display:flex}.player-icon{color:var(--primary-pink);font-size:1.5rem;animation:2.5s infinite heartBeat}.player-title{font-family:var(--font-ui);text-transform:uppercase;letter-spacing:1px;font-size:1rem;font-weight:700}.track-info{flex-direction:column;display:flex}.track-name{font-family:var(--font-heading);color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:1.1rem;font-weight:700;overflow:hidden}.track-artist{color:var(--text-secondary);font-size:.85rem}.player-controls{justify-content:center;align-items:center;gap:20px;margin:5px 0;display:flex}.control-btn{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;outline:none;font-size:1.3rem;transition:color .2s,transform .1s}.control-btn:hover{color:var(--primary-pink);transform:scale(1.1)}.play-pause-btn{background:linear-gradient(135deg, var(--primary-pink), var(--deep-rose));color:#fff;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;font-size:1.5rem;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 4px 10px #d6336c40}.play-pause-btn:hover{color:#fff;transform:scale(1.08);box-shadow:0 6px 15px #d6336c59}.progress-container{flex-direction:column;gap:5px;display:flex}.progress-bar-wrapper{cursor:pointer;background:#d6336c1f;border-radius:3px;width:100%;height:6px;position:relative}.progress-bar-fill{background:linear-gradient(90deg, var(--primary-pink), var(--deep-rose));border-radius:3px;width:0%;height:100%;position:relative}.progress-time{font-size:.75rem;font-family:var(--font-ui);color:var(--text-secondary);justify-content:space-between;display:flex}.volume-container{align-items:center;gap:10px;display:flex}.volume-icon{color:var(--text-secondary);font-size:1rem}.volume-slider{-webkit-appearance:none;background:#d6336c1f;border-radius:2px;outline:none;flex:1;width:100%;height:4px}.volume-slider::-webkit-slider-thumb{appearance:none;background:var(--primary-pink);cursor:pointer;border-radius:50%;width:12px;height:12px;transition:transform .1s;box-shadow:0 2px 5px #0000001a}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.content-panel{flex-direction:column;gap:30px;display:flex}.love-letter-card{padding:40px;position:relative;overflow:hidden}.love-letter-card:before{content:"";background:linear-gradient(90deg, var(--primary-pink), var(--accent-gold), var(--deep-rose), var(--primary-pink));background-size:200%;width:100%;height:6px;animation:4s linear infinite ribbonRoll;position:absolute;top:0;left:0}.letter-header{justify-content:space-between;align-items:center;margin-bottom:25px;display:flex}.letter-stamp{border:2px dashed var(--primary-pink);width:50px;height:50px;color:var(--primary-pink);border-radius:50%;justify-content:center;align-items:center;font-size:1.4rem;display:flex;transform:rotate(12deg)}.letter-title{font-family:var(--font-heading);color:var(--text-primary);font-size:2rem}.letter-body{color:var(--text-primary);text-align:justify;margin-bottom:25px;font-size:1.1rem;line-height:1.8}.letter-signature{font-family:var(--font-title);color:var(--deep-rose);text-align:right;margin-top:15px;font-size:3rem}.generator-card{text-align:center;flex-direction:column;align-items:center;gap:20px;padding:30px;display:flex}.heart-emitter-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#ff85a6,#e91e63);border:none;border-radius:50%;outline:none;justify-content:center;align-items:center;width:80px;height:80px;font-size:2.2rem;transition:transform .2s,box-shadow .2s;display:flex;position:relative;box-shadow:0 8px 25px #e91e6359}.heart-emitter-btn:before{content:"";border-radius:50%;animation:2s infinite pulseGlow;position:absolute;inset:0;box-shadow:0 0 #e91e6366}.heart-emitter-btn:hover{transform:scale(1.1);box-shadow:0 10px 30px #e91e6380}.heart-emitter-btn:active{transform:scale(.95)}.emitter-caption{color:var(--text-primary);margin-top:5px;font-size:1.1rem;font-weight:600}.emitter-subcaption{color:var(--text-secondary);font-size:.9rem}.memories-section{flex-direction:column;gap:20px;display:flex}.memories-title{font-family:var(--font-heading);color:var(--text-primary);text-align:center;margin-bottom:5px;font-size:1.8rem}.memory-flip-card{perspective:1000px;cursor:pointer;height:220px}.flip-card-inner{text-align:center;width:100%;height:100%;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.175,.885,.32,1.275);position:relative}.memory-flip-card:hover .flip-card-inner,.memory-flip-card.flipped .flip-card-inner{transform:rotateY(180deg)}.flip-card-front,.flip-card-back{backface-visibility:hidden;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:24px;display:flex;position:absolute}.flip-card-front{background:var(--glass-bg);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);color:var(--text-primary);border-radius:24px}.flip-card-back{background:linear-gradient(135deg, var(--pastel-pink-light), #ffe3ea);box-shadow:var(--glass-shadow), var(--card-glow);color:var(--text-primary);border:1px solid #ff5e9733;border-radius:24px;transform:rotateY(180deg)}.card-icon{color:var(--primary-pink);margin-bottom:12px;font-size:2.2rem}.card-title{font-family:var(--font-heading);margin-bottom:8px;font-size:1.3rem}.card-text{color:var(--text-secondary);font-size:.95rem;line-height:1.5}.theme-toggle-container{z-index:100;position:absolute;top:20px;right:20px}.theme-btn{background:var(--glass-bg);border:1px solid var(--glass-border);width:44px;height:44px;color:var(--text-primary);cursor:pointer;box-shadow:var(--glass-shadow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:50%;justify-content:center;align-items:center;font-size:1.2rem;transition:transform .2s,background .2s;display:flex}.theme-btn:hover{background:#fff9;transform:scale(1.1)}footer{text-align:center;font-family:var(--font-ui);color:var(--text-secondary);border-top:1px solid #ff5e971a;flex-direction:column;grid-column:1/-1;align-items:center;gap:10px;margin-top:50px;padding:40px 0 20px;font-size:.85rem;display:flex}.footer-heart{color:var(--primary-pink);font-size:1rem;animation:1.5s infinite heartBeat;display:inline-block}