*{box-sizing:border-box;margin:0;padding:0}html,body{flex-direction:column;width:100%;height:100%;display:flex}body{color:#e8e8e8;background:url(../images/background.avif) 50%/cover no-repeat fixed;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif;line-height:1.6;position:relative;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:1;background:#0a0a0f8c;width:100%;height:100%;position:fixed;top:0;left:0}.app-container{z-index:2;justify-content:center;align-items:center;width:100%;height:100vh;padding:20px;display:flex;position:relative}.page{-webkit-backdrop-filter:blur(16px)saturate(180%);background:#19191ea6;border:1px solid #ffffff2e;border-radius:16px;flex-direction:column;width:100%;max-width:600px;height:90dvh;max-height:90dvh;margin-top:2dvh;animation:.3s ease-out slideIn;display:flex;overflow:hidden;box-shadow:0 20px 50px #0009,inset 0 0 15px #ffffff0d}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.content-wrapper{flex-direction:column;justify-content:start;height:100%;padding:40px 30px;display:flex;overflow-y:auto}.hero-section{text-align:center}.welcome-section{justify-content:top;flex-direction:column;align-items:center;width:100%;height:100%;display:flex}.app-title{background:linear-gradient(135deg,#e8e8e8 0%,#fff 50%,#d4d4d4 100%);-webkit-text-fill-color:transparent;text-shadow:0 4px 12px #ffffff1a;-webkit-background-clip:text;background-clip:text;margin-bottom:10px;font-size:48px;font-weight:700;animation:.5s ease-out fadeInDown}.app-subtitle{color:#b0b0b0;margin-bottom:30px;font-size:18px;animation:.6s ease-out fadeInDown}.welcome-page{aspect-ratio:1206/2430;-webkit-backdrop-filter:blur(16px)saturate(180%);border:1px solid #ffffff2e;border-radius:16px;flex-direction:column;width:100%;max-width:600px;max-height:90dvh;margin-top:2dvh;animation:.3s ease-out slideIn;display:flex;position:relative;overflow:hidden;box-shadow:0 20px 50px #0009,inset 0 0 15px #ffffff0d}.welcome-page:before{content:"";z-index:-1;background:url(../images/welcome-background.avif) top/cover no-repeat;width:100%;height:100%;position:absolute;top:0;left:0}.welcome-section-header{aspect-ratio:800/213;background:url(../images/welcome-header.png) 50%/contain no-repeat;width:60%;margin-bottom:24px}.welcome-section-image{aspect-ratio:1232/864;background:url(../images/welcome-image.jpg) 50%/contain no-repeat;border-radius:12px;width:100%}.welcome-title{margin-top:auto;margin-bottom:20px}.welcome-subtitle{margin-bottom:30px}.welcome-image{aspect-ratio:990/792;color:#555;background:url(../images/welcome-background.avif) 50%/contain no-repeat fixed;border:1px solid #ffffff1a;border-radius:12px;justify-content:center;align-items:center;width:100%;margin:50px 0;display:flex;overflow:hidden}.hero-image{color:#fff;filter:drop-shadow(0 0 20px #fff3);width:150px;height:150px;margin:0 auto 30px;animation:3s ease-in-out infinite float}.hero-image svg{width:100%;height:100%}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.intro-text{color:#a0a0a0;white-space:pre-line;text-align:left;margin:20px 0;font-size:18px;line-height:1.8}.disclaimer{color:#777;margin-top:20px;font-size:14px;font-style:italic}.btn{cursor:pointer;text-align:center;border:none;border-radius:8px;justify-content:center;align-items:center;min-width:44px;min-height:44px;padding:12px 24px;font-size:16px;font-weight:600;line-height:1;text-decoration:none;transition:all .3s;display:inline-flex}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{color:#1a1a1a;background:linear-gradient(135deg,#fff 0%,#f0f0f0 100%);border:1px solid #fff3;font-weight:700;box-shadow:0 4px 15px #ffffff4d}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#fff 0% 100%);transform:translateY(-2px);box-shadow:0 8px 25px #fff6}.btn-secondary{color:#e8e8e8;background:#ffffff1a;border:2px solid #fff3}.btn-secondary:hover:not(:disabled){background:#fff3;border-color:#fff6}.btn-back{align-self:center;margin-top:auto;margin-bottom:0;padding-top:15px}.btn-large{width:100%;margin-top:20px;padding:16px 48px;font-size:18px}.btn-share{color:#e8e8e8;background:#ffffff14;border:2px solid #fff3;flex:1;min-width:0}.btn-share:hover:not(:disabled){color:#fff;background:#ffffff26;border-color:#ffffff80}.btn-facebook{border-color:#1877f266}.btn-facebook:hover{color:#1877f2;background:#1877f226;border-color:#1877f2}.btn-twitter{border-color:#fff3}.btn-twitter:hover{color:#fff;background:#ffffff26}.btn-whatsapp{border-color:#25d36666}.btn-whatsapp:hover{color:#25d366;background:#25d36626;border-color:#25d366}.btn-copy{border-color:#fff3}.btn-copy:hover{color:#fff;background:#ffffff26}.share-icon{margin-right:6px;font-weight:700}.fade-in{animation:1s ease-out forwards fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.page-header{text-align:center;border-bottom:1px solid #ffffff1a;margin-bottom:15px;padding-bottom:10px}.page-brand-title{letter-spacing:2px;color:#e8e8e8;opacity:.85;font-size:20px;font-weight:700}.progress-container{z-index:10;margin-bottom:20px;padding:10px 0;position:sticky;top:0}.progress-bar{background:#ffffff1a;border:1px solid #ffffff26;border-radius:4px;width:100%;height:8px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#fff 0%,#e0e0e0 100%);height:100%;transition:width .4s;box-shadow:0 0 10px #ffffff80}.progress-text{color:#777;text-align:right;margin-top:8px;font-size:14px}.question-content{margin:20px 0}.question-image{color:#555;background:linear-gradient(135deg,#0000004d 0%,#0003 100%);border:1px solid #ffffff1a;border-radius:12px;justify-content:center;align-items:center;width:100%;height:250px;margin-bottom:25px;display:none;overflow:hidden}.question-image img{object-fit:cover;width:100%;height:100%}.question-image svg{opacity:.3;width:80px;height:80px}.question-title,.question-description,.question-text{opacity:0}.question-title{color:#fff;margin-bottom:12px;font-size:24px;font-weight:700}.question-description{color:#c8c8c8;white-space:pre-line;margin-bottom:50px;font-size:16px;font-style:italic;line-height:1.8}.question-text{color:#fff;background:#ffffff0f;border-left:4px solid #ffffff4d;border-radius:4px;margin-bottom:30px;padding:16px;font-size:20px;font-weight:600;line-height:1.6}.question-text.show{opacity:1;transition:opacity 3s ease-in}.question-text:after{content:"│";color:#f3e5ab;margin-left:2px;animation:.7s infinite blink;display:inline-block}.question-text.typing-done:after{display:none}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.options-container{opacity:0;flex-direction:column;gap:12px;margin-top:30px;display:flex}.option-btn{text-align:left;cursor:pointer;color:#e8e8e8;background:#ffffff14;border:2px solid #ffffff26;border-radius:8px;padding:16px 20px;font-size:16px;transition:all .3s}.option-btn:hover{background:#ffffff26;border-color:#fff6}.option-btn.selected{color:#1a1a1a;background:linear-gradient(135deg,#fff 0%,#f0f0f0 100%);border-color:#fff;font-weight:600;box-shadow:0 0 15px #ffffff4d}.option-btn.selected:before{content:"✓ ";font-weight:700}.option-btn.gold-refract{color:gold;background:linear-gradient(135deg,#3c301499 0%,#1e190fcc 100%);border-color:#ffd70080;position:relative;overflow:hidden;box-shadow:0 0 12px #ffd70026}.option-btn.gold-refract:before{content:"";background:linear-gradient(115deg,#0000 0% 35%,#ffdf73b3 48%,#ffffffe6 50%,#ffdf73b3 52%,#0000 65% 100%);width:100%;height:100%;animation:5s infinite goldShimmer;position:absolute;top:0;left:-150%}@keyframes goldShimmer{0%{left:-150%}30%,to{left:150%}}.result-wrapper{justify-content:flex-start;padding-top:30px}.result-content{width:100%}.result-title{text-align:center;color:#fff;margin-bottom:30px;font-size:32px;font-weight:700}.result-card{background:linear-gradient(135deg, var(--dynamic-color,#2d2416cc) 0%, #1e1e1ecc 100%);text-align:center;border:2px solid #ffffff26;border-radius:12px;margin-bottom:30px;padding:30px 20px;box-shadow:inset 0 1px #ffffff1a}.character-image{background:#ffffff1a;border:3px solid #fff6;border-radius:20px;justify-content:center;align-items:center;width:100%;height:auto;margin:0 auto 20px;display:flex;overflow:hidden;box-shadow:0 0 20px #fff3}.character-image img{object-fit:cover;width:100%;height:100%}.character-image svg{opacity:.3;width:80px;height:80px}.character-name{color:#fff;margin-bottom:8px;font-size:28px;font-weight:700}.character-type{color:#fff;letter-spacing:1px;margin-bottom:12px;font-size:16px;font-weight:600}.character-description{color:#a8a8a8;margin-bottom:0;font-size:15px;line-height:1.8}.share-section{margin:30px 0}.share-label{color:#777;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;font-size:14px;font-weight:600}.share-buttons{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px;display:grid}.share-buttons .btn-share{padding:10px;font-size:14px}.prize-rules-section{background:#ffffff0f;border:1px solid #ffffff1f;border-radius:8px;margin:30px 0;padding:20px}.rules-title{color:#fff;margin-bottom:15px;font-size:18px;font-weight:700}.rules-content{color:#c8c8c8;font-size:14px;line-height:1.8}.rules-content p{margin-bottom:12px}.rules-list{margin:15px 0;padding-left:10px;list-style:none}.rules-list li{color:#a8a8a8;margin-bottom:10px;position:relative}.rules-list li strong{color:#e8e8e8}.rules-note{color:#90c890;background:#ffffff08;border-left:3px solid #fff3;border-radius:4px;margin-top:15px;padding:12px;font-size:13px}.button-controls{gap:12px;margin-top:auto;display:flex}.button-controls .btn{flex:1}#back-btn{flex:none;width:100%;padding:12px 20px}.loading-screen{z-index:9999;background:#00000080;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.spinner{border:4px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:50px;height:50px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-screen p{color:#fff;margin-top:20px;font-size:16px}.toast{color:#fff;opacity:0;pointer-events:none;z-index:9998;text-align:center;background:#333;border-radius:8px;max-width:300px;padding:12px 24px;transition:opacity .3s;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.toast.show{opacity:1}.audio-toggle-btn{z-index:999;-webkit-backdrop-filter:blur(8px);color:#fff;cursor:pointer;background:#19191ea6;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;font-size:18px;transition:all .2s;display:flex;position:fixed;top:10px;right:10px;box-shadow:0 4px 12px #0000004d}.audio-toggle-btn:hover{background:#282832d9;border-color:#fff6;transform:scale(1.08)}.audio-toggle-btn:active{transform:scale(.95)}.audio-toggle-btn.muted{opacity:.7}.emoji-fall{z-index:9999;pointer-events:none;user-select:none;animation:linear forwards fallAnimation;position:fixed;top:-60px}@keyframes fallAnimation{0%{opacity:1;transform:translateY(0)rotate(0)}80%{opacity:1}to{opacity:0;transform:translateY(105vh)rotate(360deg)}}@keyframes text-glow{0%{opacity:.9;transform:scale(1)}to{opacity:1;transform:scale(1.02)}}@media (width>=768px){.page{max-width:700px}.welcome-page{max-width:600px}.welcome-title{margin-top:20px!important;margin-bottom:12px!important}.welcome-subtitle{margin-bottom:16px!important}.content-wrapper{-webkit-overflow-scrolling:touch;scroll-behavior:smooth;min-height:100%;padding:50px 40px}.content-wrapper::-webkit-scrollbar{width:6px}.content-wrapper::-webkit-scrollbar-track{background:#0000001a;border-radius:4px}.content-wrapper::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}.content-wrapper::-webkit-scrollbar-thumb:hover{background:#fff6}.question-wrapper{min-height:100%;position:relative}.question-image{height:300px}.app-title{font-size:56px}.share-buttons{grid-template-columns:1fr 1fr}}@media screen and (width>=768px) and (width<=1024px){.welcome-title{margin-top:20px!important;margin-bottom:12px!important}.welcome-subtitle{margin-bottom:16px!important}}@media (width<=480px){.app-container{padding:10px}.page,.welcome-page{border-radius:12px}.welcome-title{margin-top:auto;margin-bottom:10px}.welcome-subtitle{margin-bottom:15px}.disclaimer{margin-top:10px}.content-wrapper{justify-content:flex-start;height:100%;padding:25px 20px}.app-title{font-size:36px}.app-subtitle{font-size:16px}.hero-image{width:120px;height:120px}.intro-text{margin:0;padding:15px 0;font-size:16px}.question-title{font-size:20px}.question-image{height:180px;margin-bottom:20px}.option-btn{padding:14px 16px;font-size:15px}.options-container{gap:10px}.result-card{padding:20px 15px}.character-name{font-size:24px}.share-buttons{grid-template-columns:1fr 1fr}.button-controls{flex-direction:column;gap:10px}.button-controls .btn,#back-btn{width:100%}}@media (width<=320px){.app-title{font-size:28px}.question-title{font-size:18px}.hero-image{width:100px;height:100px}.content-wrapper{padding:20px 15px}.share-buttons{grid-template-columns:1fr}}@media (height<=600px) and (orientation:landscape){.content-wrapper{height:auto;padding:20px}.hero-image{width:100px;height:100px}.question-image{height:150px}.app-title{font-size:32px}}@media print{body,.app-container{background:#fff;padding:0}.page,.welcome-page{box-shadow:none;border-radius:0}.button-controls,.share-section{display:none}}