:root{--primary-color: #ff7e87;--secondary-color: #e94d58;--text-color: #333;--bg-color: #fdf2f2;--white-color: #fff;--font-title: "Pacifico", cursive;--font-body: "Quicksand", sans-serif}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;font-family:var(--font-body)}body{display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:var(--bg-color);perspective:1000px;transform-style:preserve-3d;transition:background-color .5s ease}body.gallery-active{background:#111}.page{position:absolute;width:100%;height:100%;top:0;left:0;display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transform:scale(1.1);transition:opacity .6s ease,visibility .6s,transform .6s ease}.page.active{opacity:1;visibility:visible;transform:scale(1)}#question-page .wrapper{display:flex;flex-direction:column;align-items:center;text-align:center;background:var(--white-color);padding:40px 50px;border-radius:20px;box-shadow:0 10px 30px #0000001a;max-width:90vw;width:100%;max-width:700px}.question{font-family:var(--font-title);font-size:clamp(1.5rem,4vw,2.5rem);color:var(--primary-color);margin-bottom:10px;line-height:1.2}.prompt{font-size:clamp(.9rem,3vw,1.1rem);color:var(--secondary-color);margin-bottom:25px}.gif{width:clamp(150px,40vw,200px);height:clamp(150px,40vw,200px);object-fit:cover;border-radius:10px}.btn-group{position:relative;display:flex;gap:clamp(10px,3vw,20px);margin-top:30px;justify-content:center;align-items:center;flex-wrap:wrap;width:100%}.btn-group button{width:clamp(120px,35vw,150px);height:clamp(40px,12vw,50px);color:var(--white-color);font-size:clamp(.9rem,3vw,1.2rem);font-weight:500;border-radius:30px;border:none;cursor:pointer;box-shadow:0 4px 8px #00000026;transition:all .3s ease;touch-action:manipulation;-webkit-user-select:none;user-select:none}.yes-btn{background:var(--secondary-color);position:relative;transition:all .3s ease;z-index:10;width:clamp(120px,35vw,150px);height:clamp(40px,12vw,50px)}.yes-btn.moving{pointer-events:none;opacity:.8;transition:all .3s ease}.no-btn{background:#000;color:var(--secondary-color);border:2px solid var(--secondary-color);position:static;z-index:1}@keyframes pulse{0%{transform:scale(1);box-shadow:0 0 20px #e94d58cc}50%{transform:scale(1.05);box-shadow:0 0 30px #e94d58}to{transform:scale(1);box-shadow:0 0 20px #e94d58cc}}.yes-btn{min-width:120px;min-height:40px;max-width:150px;max-height:50px;display:inline-block!important;visibility:visible!important}@media (max-width: 768px){.yes-btn{min-width:140px;min-height:48px}}.reset-btn{margin-top:20px;padding:clamp(8px,2vw,10px) clamp(16px,4vw,20px);background:var(--primary-color);color:var(--white-color);border:none;border-radius:20px;font-size:clamp(.8rem,2.5vw,1rem);cursor:pointer;transition:all .3s ease;touch-action:manipulation}.reset-btn:hover,.reset-btn:focus{background:var(--secondary-color);transform:translateY(-2px)}.yes-btn:hover,.yes-btn:focus{transform:translateY(-3px);box-shadow:0 6px 12px #0003}.no-btn:hover,.no-btn:focus{background:var(--secondary-color);color:var(--white-color);transform:translateY(-3px)}.answer-text{margin-top:20px;font-size:clamp(1rem,3vw,1.2rem);font-weight:700;color:var(--secondary-color);min-height:1.5em;transition:color .3s;text-align:center;line-height:1.4}#canvas{position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:1;pointer-events:none}#gallery-page{background:linear-gradient(135deg,#667eea,#764ba2);position:relative;display:flex;justify-content:center;align-items:center;height:100vh;overflow:hidden}#gallery-page:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(255,182,193,.3) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(255,105,180,.3) 0%,transparent 50%),radial-gradient(circle at 40% 60%,rgba(255,20,147,.2) 0%,transparent 50%);animation:gradientShift 10s ease-in-out infinite}@keyframes gradientShift{0%,to{transform:scale(1) rotate(0)}50%{transform:scale(1.1) rotate(180deg)}}.floating-hearts{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;z-index:2;pointer-events:none}.heart{position:absolute;font-size:20px;color:#ffb6c1cc;animation:float 6s ease-in-out infinite}.heart:nth-child(1){left:10%;animation-delay:0s;font-size:25px}.heart:nth-child(2){left:20%;animation-delay:1s;font-size:18px}.heart:nth-child(3){left:30%;animation-delay:2s;font-size:22px}.heart:nth-child(4){left:40%;animation-delay:3s;font-size:16px}.heart:nth-child(5){left:50%;animation-delay:4s;font-size:24px}.heart:nth-child(6){left:60%;animation-delay:5s;font-size:19px}.heart:nth-child(7){left:70%;animation-delay:.5s;font-size:21px}.heart:nth-child(8){left:80%;animation-delay:1.5s;font-size:17px}.heart:nth-child(9){left:90%;animation-delay:2.5s;font-size:23px}@keyframes float{0%{transform:translateY(100vh) rotate(0);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(-100px) rotate(360deg);opacity:0}}#drag-container{position:relative;display:flex;margin:auto;transform-style:preserve-3d;transform:rotateX(-10deg);z-index:100;width:140px;height:200px;filter:drop-shadow(0 20px 40px rgba(0,0,0,.3))}#spin-container{position:relative;display:flex;margin:auto;transform-style:preserve-3d;width:140px;height:200px}#drag-container img{transform-style:preserve-3d;position:absolute;left:0;top:0;width:140px;height:200px;object-fit:cover;border-radius:15px;box-shadow:0 0 20px #ffb6c199,0 0 40px #ff69b466,0 0 60px #ff149333;transition:all .3s ease;backface-visibility:hidden;border:3px solid rgba(255,255,255,.3)}#drag-container img:hover{box-shadow:0 0 30px #ffb6c1cc,0 0 60px #ff69b499,0 0 90px #ff149366}.gallery-title{font-family:var(--font-title);font-size:clamp(1.8rem,5vw,3rem);position:absolute;top:280px;left:50%;transform:translate(-50%);color:#fff;text-align:center;white-space:nowrap;z-index:200;margin:0;padding:0;text-shadow:0 0 10px rgba(255,182,193,.8),0 0 20px rgba(255,105,180,.6),0 0 30px rgba(255,20,147,.4);animation:textGlow 3s ease-in-out infinite,textEntrance 2s ease-out;pointer-events:none;opacity:0;animation-fill-mode:both;animation-delay:1s}@keyframes textEntrance{0%{opacity:0;transform:translate(-50%) translateY(50px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes textGlow{0%,to{text-shadow:0 0 10px rgba(255,182,193,.8),0 0 20px rgba(255,105,180,.6),0 0 30px rgba(255,20,147,.4)}50%{text-shadow:0 0 20px rgba(255,182,193,1),0 0 30px rgba(255,105,180,.8),0 0 40px rgba(255,20,147,.6)}}@media (max-width: 768px){.gallery-title{top:220px;font-size:1.5rem}#ground{top:270px;width:300px;height:300px}}@media (max-width: 480px){.gallery-title{top:200px;font-size:1.2rem}#ground{top:240px;width:250px;height:250px}}#canvas{position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:1;pointer-events:none;opacity:.8}.sparkles{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;z-index:3;pointer-events:none}.sparkle{position:absolute;width:4px;height:4px;background:#fff;border-radius:50%;animation:sparkle 2s linear infinite}@keyframes sparkle{0%{transform:scale(0) rotate(0);opacity:0}50%{transform:scale(1) rotate(180deg);opacity:1}to{transform:scale(0) rotate(360deg);opacity:0}}@media (max-width: 768px){#question-page .wrapper{padding:30px 20px;margin:20px}.btn-group{flex-direction:column;gap:15px}.btn-group button{width:100%;max-width:250px}.btn-group button{min-height:48px}button{font-size:16px}#drag-container,#spin-container,#drag-container img{width:110px;height:160px}#drag-container p{font-size:1.5rem}.heart{font-size:16px}.heart:nth-child(odd){font-size:18px}.heart:nth-child(2n){font-size:14px}#ground{width:300px;height:300px}.yes-btn{min-width:140px;min-height:48px}}@media (max-width: 480px){#question-page .wrapper{padding:20px 15px}.question{font-size:1.5rem}.prompt{font-size:1rem}.gif{width:120px;height:120px}#drag-container,#spin-container,#drag-container img{width:90px;height:130px}#drag-container p{font-size:1.2rem}.heart{font-size:14px}#ground{width:250px;height:250px}}@media (max-height: 500px) and (orientation: landscape){#question-page .wrapper{padding:15px 20px}.gif{width:100px;height:100px}}footer{position:fixed;bottom:10px;left:0;width:100%;text-align:center;font-size:clamp(.7rem,2vw,.9rem);color:#888;z-index:200;padding:0 20px}footer a{color:var(--primary-color);text-decoration:none;font-weight:700}footer a:hover{text-decoration:underline}body.gallery-active footer{color:#ccc}body.gallery-active footer a{color:#00c3ff}audio{display:none}@keyframes spin{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}@keyframes spinRevert{0%{transform:rotateY(360deg)}to{transform:rotateY(0)}}@keyframes autoSpin{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}#spin-container.auto-spinning{animation:autoSpin 20s linear infinite}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (prefers-contrast: high){:root{--primary-color: #d63384;--secondary-color: #dc3545}}#drag-container p,#ground{will-change:transform;transform-origin:center center}