:root{--primary-red: #ff4757;--primary-blue: #2ed573;--comic-yellow: #ffa502;--dark: #2f3542;--white: #ffffff}body{margin:0;padding:0;font-family:Roboto,sans-serif;background:radial-gradient(circle,var(--white) 0%,#dcdde1 100%);overflow-x:hidden;min-height:100vh;display:flex;justify-content:center;align-items:center}h1,h2,h3{font-family:Bangers,cursive;letter-spacing:2px;text-shadow:3px 3px 0px rgba(0,0,0,.1)}.comic-bg{background-image:radial-gradient(#ff4757 15%,transparent 16%),radial-gradient(#2f3542 15%,transparent 16%);background-size:60px 60px;background-position:0 0,30px 30px;background-color:#fff;position:absolute;inset:0;opacity:.1;z-index:-1}.container{text-align:center;position:relative;z-index:1;padding:2rem;max-width:600px;width:90%}.card{background:#fff;border:4px solid var(--dark);border-radius:15px;box-shadow:10px 10px 0 var(--dark);padding:2rem;position:relative;transition:transform .3s ease}.card:hover{transform:translate(-2px,-2px);box-shadow:12px 12px 0 var(--dark)}.logo{width:120px;margin-bottom:1rem;animation:float 3s ease-in-out infinite}@keyframes float{0%{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(5deg)}to{transform:translateY(0) rotate(0)}}.recipient{font-family:Bangers,cursive;font-size:2rem;color:var(--dark);margin:0;letter-spacing:1.5px}.title{font-size:3.5rem;color:var(--primary-red);margin-bottom:.5rem;line-height:1.1;-webkit-text-stroke:1.5px var(--dark)}.subtitle{font-size:1.5rem;margin-bottom:2rem;color:var(--dark)}.details{background:#f1f2f6;border:2px dashed var(--dark);padding:1.5rem;margin-bottom:2rem;border-radius:10px}.detail-item{font-size:1.2rem;margin:.5rem 0;font-weight:700}.btn-group{display:flex;justify-content:center;gap:2rem;margin-top:2rem;position:relative;min-height:80px}.btn{font-family:Bangers,cursive;font-size:1.8rem;padding:.8rem 2.5rem;border:3px solid var(--dark);border-radius:50px;cursor:pointer;transition:all .2s;text-transform:uppercase;position:relative}.btn-yes{background-color:var(--primary-blue);color:#fff;box-shadow:5px 5px 0 var(--dark)}.btn-yes:active{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--dark)}.btn-no{background-color:var(--primary-red);color:#fff;box-shadow:5px 5px 0 var(--dark)}.celebration{animation:popIn .5s cubic-bezier(.175,.885,.32,1.275)}@keyframes popIn{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.hidden{display:none}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease-out}.modal-content{background:#fff;padding:2rem;border-radius:1rem;width:90%;max-width:400px;border:4px solid var(--primary-dark);box-shadow:8px 8px 0 var(--primary-dark);text-align:center;position:relative;font-family:Bangers,cursive}.modal-content h3{font-size:2rem;color:var(--primary-red);margin-bottom:1rem;text-transform:uppercase}.modal-content textarea{width:100%;height:100px;padding:.8rem;border:2px solid var(--primary-dark);border-radius:.5rem;margin-bottom:1rem;font-family:Comic Neue,cursive;font-size:1.2rem;resize:none}.modal-content textarea:focus{outline:none;border-color:var(--primary-blue)}.modal-actions{display:flex;gap:1rem;justify-content:center}.btn-submit{background-color:var(--primary-blue);color:#fff}.btn-cancel{background-color:var(--comic-yellow);color:var(--primary-dark)}.btn-submit:hover,.btn-cancel:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--primary-dark)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}
