@import"https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&display=swap";*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{font-family:Inter,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--max-width: 100vw;--min-touch-target: 44px;--content-max-width: 1200px;--gutter: 1rem;--base-font-size: 16px}html{overflow-x:hidden;overflow-y:auto;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;height:100%;width:100%;scroll-behavior:smooth;touch-action:pan-y}body{margin:0;padding:0;min-width:320px;max-width:100vw;min-height:100vh;min-height:100dvh;overflow-x:hidden;overflow-y:auto;width:100%;height:100%;position:relative;-webkit-overflow-scrolling:touch;overscroll-behavior-x:none;overscroll-behavior-y:contain;-webkit-tap-highlight-color:transparent}#root{min-height:100vh;min-height:100dvh;max-width:100vw;width:100%;overflow-x:hidden;overflow-y:auto;position:relative;contain:layout style;isolation:isolate}button{font-family:inherit;min-height:44px;min-width:44px;touch-action:manipulation;-webkit-tap-highlight-color:transparent;cursor:pointer}button:focus-visible{outline:2px solid #667eea;outline-offset:2px}@media(max-width:480px){body{font-size:14px}.app{padding:.5rem}}@media(min-width:1025px){body{font-size:18px}.app{padding:1.5rem}}html{font-size:var(--base-font-size)}@media(max-width:1200px){:root{--base-font-size: 15px}}@media(max-width:800px){:root{--base-font-size: 14px}}@media(min-width:1600px){:root{--base-font-size: 18px}}.app{min-height:100vh;min-height:100dvh;height:100vh;height:100dvh;width:100%;max-width:100vw;font-family:Outfit,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#000;background:radial-gradient(ellipse at top left,rgba(138,43,226,.15) 0%,transparent 50%),radial-gradient(ellipse at top right,rgba(255,215,0,.1) 0%,transparent 50%),radial-gradient(ellipse at bottom,rgba(255,105,180,.1) 0%,transparent 50%),linear-gradient(135deg,#000,#0a0a0a,#1a1a1a,#0a0a0a,#000);background-size:100% 100%,100% 100%,100% 100%,400% 400%;animation:gradientMesh 15s ease infinite;display:flex;flex-direction:column;position:relative;overflow-x:hidden;overflow-y:auto;--welcome-offset: 0}@keyframes gradientMesh{0%,to{background-position:0% 0%,0% 0%,0% 0%,0% 50%}50%{background-position:0% 0%,0% 0%,0% 0%,100% 50%}}.app:before{content:"";position:absolute;inset:0;background-image:radial-gradient(1px 1px at 20px 30px,#ffffff,transparent),radial-gradient(1px 1px at 40px 70px,#ffffff,transparent),radial-gradient(1px 1px at 60px 10px,#ffffff,transparent),radial-gradient(2px 2px at 90px 40px,#ffffff,transparent),radial-gradient(2px 2px at 130px 80px,#ffffff,transparent),radial-gradient(1px 1px at 160px 120px,#ffffff,transparent);background-repeat:repeat;background-size:200px 200px;animation:starsMove 150s linear infinite;opacity:.8;z-index:1}.app:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 10% 20%,rgba(138,43,226,.2),transparent 40%),radial-gradient(circle at 90% 80%,rgba(255,215,0,.1),transparent 40%),conic-gradient(from 0deg at 50% 50%,rgba(75,0,130,.1) 0%,transparent 60%,rgba(0,255,255,.05) 100%);filter:blur(60px);animation:auroraFlow 20s ease-in-out infinite alternate;z-index:0;pointer-events:none}@keyframes auroraFlow{0%{transform:scale(1) rotate(0);opacity:.5}50%{transform:scale(1.1) rotate(2deg);opacity:.7}to{transform:scale(1) rotate(0);opacity:.5}}.shooting-star{position:absolute;top:-100px;left:-100px;width:2px;height:100px;background:linear-gradient(to bottom,#fff0,#fff);transform:rotate(45deg);animation:shoot 5s linear infinite;z-index:0}.shooting-star:nth-child(1){left:20%;animation-delay:2s}.shooting-star:nth-child(2){left:50%;animation-delay:7s}.shooting-star:nth-child(3){left:80%;animation-delay:4s}@keyframes shoot{0%{top:-100px;opacity:0;transform:translate(0) rotate(45deg)}10%{opacity:1}20%{top:100vh;opacity:0;transform:translate(100vh) rotate(45deg)}to{top:100vh;opacity:0;transform:translate(100vh) rotate(45deg)}}@keyframes starsShine{0%{opacity:.3}to{opacity:.8}}@keyframes starsMove{0%{transform:translateY(0)}to{transform:translateY(-200px)}}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes moveBackground{0%{transform:translate(0)}to{transform:translate(50px,50px)}}.app-header{text-align:center;padding:1rem 1.5rem;color:#fff;position:relative;z-index:10;flex-shrink:0;background:#667eea;box-shadow:0 2px 10px #0000001a;width:100%}.app-title{font-size:clamp(1.5rem,4vw,2rem);margin:0;font-weight:600;color:#fff;letter-spacing:.5px;line-height:1.3}.app-subtitle{font-size:clamp(.85rem,2vw,1rem);margin:.25rem 0 0;opacity:.9;font-weight:400;line-height:1.4}.welcome-screen{flex:1;display:flex;align-items:center;justify-content:center;padding:clamp(1rem,3vw,2rem);min-height:100vh;min-height:100dvh;position:relative;z-index:1}.welcome-screen::-webkit-scrollbar{display:none}.welcome-screen{-ms-overflow-style:none;scrollbar-width:none}.welcome-content{background:linear-gradient(135deg,#14141ee6,#1e1e28f2);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border:2px solid transparent;background-clip:padding-box,border-box;background-origin:padding-box,border-box;background-image:linear-gradient(135deg,#14141ee6,#1e1e28f2),linear-gradient(135deg,gold,#fdb931,#ffffac,#fdb931,gold);background-size:100% 100%,300% 300%;animation:goldShimmer 5s ease infinite alternate;box-shadow:0 0 50px #ffd70026,0 0 20px #fdb9311a,inset 0 0 30px #ffd7000d;padding:clamp(1.5rem,4vw,2.5rem);border-radius:clamp(20px,5vw,40px);max-width:min(550px,90vw);max-height:min(80vh,80dvh);width:100%;text-align:center;position:relative;transform-style:preserve-3d;z-index:2;margin:auto;align-self:center;transform:translateY(-5vh);animation:floatCard 6s ease-in-out infinite}@media(min-width:1920px)and (min-aspect-ratio:21/9){.welcome-content{max-width:clamp(500px,35vw,650px)}}@media(min-width:1280px)and (max-width:1919px){.welcome-content{max-width:clamp(450px,45vw,600px);max-height:clamp(400px,75vh,750px)}}@media(min-width:768px)and (max-width:1279px){.welcome-content{max-width:clamp(400px,70vw,550px);max-height:clamp(350px,75vh,700px)}}@media(max-width:767px)and (orientation:landscape){.welcome-content{max-width:clamp(350px,85vw,500px);max-height:clamp(300px,85vh,550px);padding:clamp(1rem,3vw,1.5rem)}}@media(max-width:767px)and (orientation:portrait){.welcome-content{max-width:clamp(300px,90vw,450px);max-height:clamp(400px,80vh,700px)}}.welcome-content::-webkit-scrollbar{display:none}.welcome-content:before{content:"";position:absolute;inset:-1px;border-radius:inherit;background:linear-gradient(45deg,transparent 30%,rgba(255,215,0,.4) 45%,rgba(255,255,255,.6) 50%,rgba(253,185,49,.4) 55%,transparent 70%);background-size:200% 200%;animation:prismShine 5s linear infinite;z-index:-1;opacity:.5}@keyframes floatCard{0%,to{transform:translateY(-5vh)}50%{transform:translateY(calc(-5vh - 10px))}}@keyframes prismShine{0%{background-position:0% 50%;opacity:.3}50%{opacity:.8}to{background-position:100% 50%;opacity:.3}}.welcome-content:after{background:radial-gradient(circle at 30% 20%,rgba(255,215,0,.12) 0%,transparent 50%),radial-gradient(circle at 70% 80%,rgba(255,215,0,.08) 0%,transparent 50%),linear-gradient(135deg,#141414f2,#1e1e1ef2);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1.25px solid rgba(255,215,0,.2);padding:clamp(.9rem,3.8vw,1.6rem);border-radius:16px;box-shadow:0 14px 40px #ffd7002e,inset 0 -3px 12px #ffd7000d;max-width:min(820px,96vw);width:100%;text-align:center;position:relative;overflow-y:auto;transform-style:preserve-3d;z-index:1;place-self:center;max-height:calc(100vh - var(--footer-h) - 1.5rem);box-sizing:border-box;font-size:2rem;text-shadow:0 0 20px rgba(255,215,0,.9),0 0 40px rgba(255,215,0,.6);animation:twinkle 3s ease-in-out infinite 1.5s;z-index:10;pointer-events:none}.welcome-icon{margin-bottom:clamp(1rem,3vw,1.5rem);animation:float 4s ease-in-out infinite;display:inline-block;filter:drop-shadow(0 0 20px rgba(255,215,0,.4));transition:all .5s cubic-bezier(.34,1.56,.64,1)}.mascot-image{width:clamp(70px,15vw,150px);height:auto;filter:drop-shadow(0 15px 40px rgba(255,215,0,.5)) drop-shadow(0 5px 20px rgba(138,43,226,.3));animation:float 3.5s ease-in-out infinite,mascotGlow 4.5s ease-in-out infinite;transition:all .5s cubic-bezier(.34,1.56,.64,1)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}@keyframes mascotGlow{0%,to{filter:drop-shadow(0 15px 40px rgba(255,215,0,.5)) drop-shadow(0 5px 20px rgba(138,43,226,.3))}50%{filter:drop-shadow(0 20px 50px rgba(255,215,0,.7)) drop-shadow(0 10px 30px rgba(138,43,226,.5))}}.mascot-image:hover{transform:scale(1.1) rotate(5deg);filter:drop-shadow(0 20px 50px rgba(255,215,0,.7)) drop-shadow(0 10px 30px rgba(138,43,226,.5))}@keyframes iconGlow{0%,to{filter:drop-shadow(0 10px 30px rgba(255,215,0,.8)) drop-shadow(0 0 50px rgba(138,43,226,.8)) drop-shadow(0 0 80px rgba(255,215,0,.4))}50%{filter:drop-shadow(0 10px 30px rgba(255,215,0,1)) drop-shadow(0 0 60px rgba(138,43,226,1)) drop-shadow(0 0 100px rgba(255,215,0,.6))}}@keyframes iconPulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.welcome-content h2{background:linear-gradient(to right,#fff,gold,#fff);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:clamp(1.8rem,4vw,2.5rem);margin:0 0 clamp(.75rem,2vw,1rem);font-weight:900;letter-spacing:-.5px;animation:shineTitle 4s ease-in-out infinite;transition:all .3s ease-in-out}@keyframes shineTitle{0%{background-position:0% center}50%{background-position:100% center}to{background-position:200% center}}.welcome-content h2:after{content:"✦";display:block;font-size:1.8rem;margin-top:.6rem;background:linear-gradient(135deg,gold,#ffed4e);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 15px rgba(255,215,0,.8));animation:twinkle 2.5s ease-in-out infinite}@keyframes twinkle{0%,to{opacity:.6;transform:scale(1) rotate(0)}25%{opacity:.8;transform:scale(1.1) rotate(90deg)}50%{opacity:1;transform:scale(1.2) rotate(180deg)}75%{opacity:.8;transform:scale(1.1) rotate(270deg)}}.welcome-content p{color:#fffffff2;font-size:clamp(1.05rem,2.5vw,1.2rem);margin:clamp(.4rem,1vw,.5rem) 0;text-shadow:0 2px 4px rgba(0,0,0,.6);line-height:1.7;font-weight:500;animation:contentFadeIn 1s cubic-bezier(.34,1.56,.64,1) .5s backwards;transition:all .3s ease-in-out}@keyframes contentFadeIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.welcome-description{font-size:clamp(1rem,2.2vw,1.15rem)!important;color:#e0e0e0!important;margin:clamp(1.25rem,3vw,1.75rem) 0 clamp(2rem,4vw,2.5rem)!important;line-height:1.7!important;max-width:90%;margin-left:auto!important;margin-right:auto!important}.start-button{background:linear-gradient(135deg,gold,#ffed4e,gold);background-size:200% 100%;color:#000;border:2px solid rgba(255,255,255,.3);padding:clamp(1.1rem,2.8vw,1.4rem) clamp(2.8rem,6.5vw,4rem);font-size:clamp(1.15rem,2.8vw,1.35rem);border-radius:clamp(35px,5vw,60px);cursor:pointer;font-weight:800;transition:all .4s cubic-bezier(.34,1.56,.64,1);box-shadow:0 15px 40px #ffd700b3,0 8px 20px #ffd70080,0 0 0 3px #ffd70033,inset 0 2px #fff9,inset 0 -2px #0003;position:relative;overflow:hidden;z-index:1;letter-spacing:1px;text-transform:uppercase;animation:buttonFadeIn .8s ease-out .7s backwards}@keyframes buttonFadeIn{0%{opacity:0;transform:translateY(25px) scale(.85)}60%{transform:translateY(-5px) scale(1.05)}to{opacity:1;transform:translateY(0) scale(1)}}.start-button:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff4d;transform:translate(-50%,-50%);transition:width .6s cubic-bezier(.34,1.56,.64,1),height .6s cubic-bezier(.34,1.56,.64,1)}.start-button:hover{transform:translateY(-5px) scale(1.08);background-position:100% 0;box-shadow:0 20px 50px #ffd700cc,0 10px 25px #ffd70099,0 0 0 4px #ffd7004d,0 0 60px #ffd70080,inset 0 2px #ffffffb3,inset 0 -2px #0003;border-color:#ffffff80}.start-button:hover:before{width:300px;height:300px}.start-button:active{transform:translateY(-2px) scale(1.05);box-shadow:0 10px 25px #ffd70099,0 5px 12px #ffd70066,inset 0 2px #ffffff80}.sparky-sitting-center{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:clamp(180px,35vw,250px);z-index:5;pointer-events:none;animation:popInCenter .6s ease-out;transition:all 1.2s ease-in-out}.sparky-sitting-center-img{width:100%;height:auto;display:block;filter:drop-shadow(0 8px 20px rgba(255,215,0,.6))}@keyframes popInCenter{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}60%{transform:translate(-50%,-50%) scale(1.1)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.sparky-sitting-container{position:fixed;bottom:clamp(10px,2vw,20px);left:clamp(10px,2vw,20px);width:clamp(120px,20vw,180px);z-index:5;pointer-events:none;transition:all 1.2s ease-in-out}.sparky-sitting-container.slide-in{animation:slideFromCenter 1.2s ease-in-out forwards}@keyframes slideFromCenter{0%{top:50%;left:50%;bottom:auto;transform:translate(-50%,-50%);width:clamp(180px,35vw,250px)}to{top:auto;left:clamp(10px,2vw,20px);bottom:clamp(10px,2vw,20px);transform:translate(0);width:clamp(120px,20vw,180px)}}.sparky-sitting-img{width:100%;height:auto;display:block;filter:drop-shadow(0 8px 20px rgba(255,215,0,.4));animation:sitAndBreathe 4s ease-in-out infinite 1s}@keyframes sitAndBreathe{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.02)}}.chat-container{flex:1;max-width:min(95%,1400px);width:100%;margin:0 auto;padding:clamp(.5rem,1.5vw,1rem) clamp(.5rem,2vw,1rem) clamp(1rem,3vw,1.5rem);display:flex;flex-direction:column;justify-content:center;animation:fadeIn .5s ease-out;overflow:hidden;position:relative;z-index:1;min-height:0}@media(min-width:720px){.chat-container{align-items:center}.chat-messages{width:100%;max-width:min(920px,92vw);box-sizing:border-box;margin-left:clamp(-40px,-2.5vw,-12px)}}@media(min-width:980px){.chat-container{align-items:flex-start}.chat-messages{max-width:min(1100px,95vw);margin-left:clamp(-80px,-6vw,-24px);box-sizing:border-box}}.chat-messages{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0;padding:clamp(.5rem,2vw,1rem) clamp(.25rem,1vw,.5rem);box-shadow:none;border:none;flex:1;overflow-y:auto;overflow-x:hidden;animation:fadeIn .6s ease-out;position:relative;display:flex;flex-direction:column;gap:clamp(1rem,3vw,1.5rem);scroll-behavior:smooth;min-height:0}.chat-messages::-webkit-scrollbar{width:8px}.chat-messages::-webkit-scrollbar-track{background:#ffd7001a;border-radius:10px}.chat-messages::-webkit-scrollbar-thumb{background:linear-gradient(180deg,gold,orange);border-radius:10px;border:2px solid rgba(26,0,51,.5)}.chat-messages::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#ffed4e,gold)}.chat-messages:before{display:none}@keyframes sparkle{0%,to{opacity:.3;transform:rotate(0) scale(1)}50%{opacity:.8;transform:rotate(180deg) scale(1.2)}}.app-footer{position:fixed;bottom:0;left:0;right:0;background:transparent;color:gold;padding:1rem;text-align:center;font-size:.9rem;border-top:none;z-index:0}::-webkit-scrollbar{width:0px;height:0px}.footer-content{display:flex;align-items:center;justify-content:center;gap:.5rem}.footer-mascot{width:30px;height:30px;object-fit:contain;animation:float 3s ease-in-out infinite;filter:drop-shadow(0 2px 8px rgba(102,126,234,.6))}.app-footer p{margin:0;display:flex;align-items:center;gap:.25rem}.app-footer strong{color:gold;text-shadow:0 0 15px rgba(255,215,0,.8);font-weight:700}.chat-messages::-webkit-scrollbar{width:10px}.chat-messages::-webkit-scrollbar-track{background:#f1f1f180;border-radius:10px;margin:10px 0}.chat-messages::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#667eea,#764ba2);border-radius:10px;border:2px solid rgba(255,255,255,.3)}.chat-messages::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#764ba2,#667eea);box-shadow:0 0 10px #667eea80}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media(max-width:768px){.app{--welcome-offset: -2vh}.app{height:100vh;height:100dvh}.app-header{padding:.75rem 1rem}.app-title{font-size:clamp(1.3rem,5vw,1.75rem)}.app-subtitle{font-size:clamp(.8rem,2.5vw,.95rem)}.welcome-screen{padding:1rem .75rem}.welcome-content{max-width:95vw;padding:clamp(1.75rem,5vw,2.5rem)}.welcome-content:after,.welcome-content>*:first-child:before{font-size:1.5rem;top:12px}.welcome-content:after{left:12px}.welcome-content>*:first-child:before{right:12px}.mascot-image{width:clamp(120px,35vw,200px)}.welcome-content h2{font-size:clamp(1.5rem,6vw,2rem);margin-bottom:clamp(.75rem,2vw,1rem)}.welcome-description{margin:1rem 0 1.5rem!important;font-size:clamp(.95rem,2.5vw,1.05rem)!important;max-width:100%}.start-button{font-size:clamp(1rem,3vw,1.15rem);padding:clamp(.9rem,3vw,1.1rem) clamp(2rem,7vw,3rem)}.start-button:hover{transform:translateY(-2px) scale(1.03)}.chat-container{max-width:100%;padding:clamp(.5rem,2vw,1rem) clamp(.5rem,2vw,.75rem)}.chat-messages{padding:clamp(.5rem,2vw,.75rem) clamp(.25rem,1vw,.5rem);gap:clamp(.75rem,2vw,1.25rem)}.app-footer{padding:.75rem;font-size:.8rem}.footer-mascot{width:25px;height:25px}}@media(max-width:480px){.app-header{padding:.65rem .75rem}.app-title{font-size:1.3rem}.app-subtitle{font-size:.8rem}.welcome-screen{padding:.75rem .5rem}.welcome-content{padding:1.5rem 1.25rem;max-width:96vw}.welcome-content:after,.welcome-content>*:first-child:before{font-size:1.25rem;top:10px}.mascot-image{width:clamp(100px,30vw,150px)}.welcome-content h2{font-size:1.5rem;margin-bottom:.65rem}.welcome-content h2:after{font-size:1.2rem;margin-top:.35rem}.welcome-description{margin:.85rem 0 1.25rem!important;font-size:.95rem!important}.start-button{padding:.85rem 1.75rem;font-size:1rem}.chat-container{padding:.5rem}.chat-messages{padding:.5rem .25rem;gap:.75rem}.app-footer{padding:.6rem;font-size:.75rem}.footer-mascot{width:22px;height:22px}.sparky-sitting-container{width:100px;bottom:8px;left:8px}}@media(min-width:1920px){.app-title{font-size:4rem}.app-subtitle{font-size:1.4rem}.welcome-content{max-width:650px;padding:3.5rem}.welcome-icon{font-size:8rem}.start-button{font-size:1.4rem;padding:1.3rem 3.5rem}}@media(min-width:1600px){.app{--welcome-offset: -4vh}}.app{display:block}.content-center{max-width:var(--content-max-width);margin-left:auto;margin-right:auto;padding-left:var(--gutter);padding-right:var(--gutter);box-sizing:border-box}.app.welcome-mode .welcome-screen{min-height:calc(100vh - var(--footer-h));display:flex;align-items:center;justify-content:center;padding:1.25rem 1rem .5rem}.app.welcome-mode .welcome-content{width:min(900px,96%);max-width:960px;box-sizing:border-box;padding:1.5rem;margin:0 auto}.app.welcome-mode .welcome-content{margin-bottom:calc(var(--footer-h) + .5rem)}.app.welcome-mode .app-footer{position:static;bottom:auto;left:auto;right:auto;width:100%;z-index:1;box-shadow:none}.app-footer{left:0;right:0;bottom:0;position:fixed;background:transparent;padding:.5rem 1rem;box-sizing:border-box}.personality-card{max-width:min(900px,92vw);width:100%;margin:1rem auto;box-sizing:border-box}@media(min-width:1600px){.welcome-content{max-width:1100px;padding:2rem 3rem}.personality-card{max-width:1100px}}@media(max-width:768px){.app.welcome-mode .welcome-content{padding:1rem;width:96%}.app-footer{font-size:.75rem;padding:.45rem .6rem}}.chat-bubble{display:flex;justify-content:center;margin:0;animation:cardDeal .5s ease-out}.chat-bubble.bot{justify-content:flex-start;padding-left:clamp(1rem,3vw,2rem)}.chat-bubble.user{justify-content:flex-end;padding-right:clamp(1rem,3vw,2rem)}@keyframes cardDeal{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.bubble-content{width:fit-content;padding:clamp(.6rem,1.6vw,.9rem) clamp(.8rem,2vw,1.1rem);position:relative;margin:0;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.chat-bubble.bot .bubble-content{background:radial-gradient(circle at 20% 30%,rgba(138,43,226,.15) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(255,215,0,.1) 0%,transparent 50%),linear-gradient(135deg,#14141ef2,#1e1e28fa);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:#fff;border:3px solid transparent;background-clip:padding-box,border-box;background-origin:padding-box,border-box;background-image:radial-gradient(circle at 20% 30%,rgba(138,43,226,.15),transparent 50%),radial-gradient(circle at 80% 70%,rgba(255,215,0,.1),transparent 50%),linear-gradient(135deg,#14141ef2,#1e1e28fa),linear-gradient(135deg,#8b5cf6,gold,#8b5cf6,gold);background-size:100% 100%,100% 100%,100% 100%,300% 300%;animation:borderShimmer 6s ease-in-out infinite,questionFloat 4s ease-in-out infinite;text-align:left;font-size:clamp(1.05rem,2.2vw,1.25rem);font-weight:600;line-height:1.65;letter-spacing:.3px;box-shadow:0 8px 32px #8a2be24d,0 4px 16px #ffd70033,inset 0 1px #ffffff1a;max-width:min(720px,84vw);border-radius:24px 24px 24px 6px;padding:clamp(1rem,2.2vw,1.4rem) clamp(1.2rem,2.8vw,1.8rem);position:relative}@keyframes borderShimmer{0%,to{background-position:0% 0%,0% 0%,0% 0%,0% 50%}50%{background-position:0% 0%,0% 0%,0% 0%,100% 50%}}@keyframes questionFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.chat-bubble.user .bubble-content{background:linear-gradient(135deg,gold,#ffed4e);color:#000;border:2px solid #ffa500;text-align:left;font-size:clamp(.92rem,2vw,1.02rem);font-weight:600;letter-spacing:0;box-shadow:0 4px 15px #ffd70066,0 2px 8px #0003;max-width:min(690px,74vw);border-radius:18px 18px 4px}.bubble-content p{margin:0;line-height:1.45;font-size:.95rem}@media(max-height:780px){.chat-bubble.bot{padding-left:1rem}.chat-bubble.user{padding-right:1rem}.bubble-content{padding:.6rem .85rem}.chat-bubble.bot .bubble-content,.chat-bubble.user .bubble-content{font-size:.92rem}}@media(max-height:700px){.bubble-content{padding:.55rem .8rem}.chat-bubble.bot .bubble-content,.chat-bubble.user .bubble-content{font-size:.9rem}}@media(max-width:360px){.chat-bubble.bot{padding-left:.75rem}.chat-bubble.user{padding-right:.75rem}.bubble-content{padding:.5rem .75rem}.chat-bubble.bot .bubble-content{max-width:90vw;font-size:.9rem}.chat-bubble.user .bubble-content{max-width:88vw;font-size:.9rem}.bubble-content p{font-size:.9rem}}.typing-indicator{display:flex;gap:4px;padding:4px 0}.typing-indicator span{width:8px;height:8px;border-radius:50%;background-color:gold;animation:bounce 1.4s infinite ease-in-out}.typing-indicator span:nth-child(1){animation-delay:-.32s}.typing-indicator span:nth-child(2){animation-delay:-.16s}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}@media(max-width:768px){.bubble-content{max-width:95vw}.bubble-content:before,.bubble-content:after{font-size:1.2rem;top:12px}.bubble-content:before{left:15px}.bubble-content:after{right:15px}}@media(max-width:480px){.bubble-content:before,.bubble-content:after{font-size:1rem;top:10px}.bubble-content{padding:.7rem .95rem}.chat-bubble{padding:.5rem}.bubble-content{font-size:.9rem;padding:.6rem}}@media(min-width:1366px){.chat-bubble.bot .bubble-content{max-width:750px;font-size:1.08rem;padding:.95rem 1.35rem}.chat-bubble.user .bubble-content{max-width:720px;font-size:1.08rem;padding:.95rem 1.35rem}}@media(min-width:1440px){.chat-bubble.bot .bubble-content{max-width:800px;font-size:1.12rem;padding:1rem 1.5rem}.chat-bubble.user .bubble-content{max-width:770px;font-size:1.12rem;padding:1rem 1.5rem}}@media(min-width:1536px){.chat-bubble.bot .bubble-content{max-width:850px;font-size:1.15rem;padding:1.05rem 1.6rem;line-height:1.65}.chat-bubble.user .bubble-content{max-width:820px;font-size:1.15rem;padding:1.05rem 1.6rem}}@media(min-width:1920px){.chat-bubble.bot .bubble-content{max-width:950px;font-size:1.2rem;padding:1.15rem 1.75rem;line-height:1.7}.chat-bubble.user .bubble-content{max-width:920px;font-size:1.2rem;padding:1.15rem 1.75rem}}@media(min-width:2560px){.chat-bubble.bot .bubble-content{max-width:1100px;font-size:1.3rem;padding:1.3rem 2rem;line-height:1.75}.chat-bubble.user .bubble-content{max-width:1050px;font-size:1.3rem;padding:1.3rem 2rem}}.chat-messages::-webkit-scrollbar{width:0px}@media(min-width:900px){:root{--sparky-width: clamp(120px, 20vw, 180px);--sparky-gap: 14px}.chat-container{padding-left:calc(var(--sparky-width) + var(--sparky-gap));box-sizing:border-box}.chat-messages{padding-left:calc(var(--sparky-gap))}.chat-bubble.bot .bubble-content,.chat-bubble.user .bubble-content{max-width:calc(100% - (var(--sparky-width) + var(--sparky-gap) + 48px))}}@media(max-width:899px){.sparky-sitting-container{display:none!important}}.question-options{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.2rem,.5vw,.3rem);margin:clamp(.2rem,.5vw,.4rem) auto;padding:0;animation:fadeIn .6s ease-out;max-width:min(600px,98vw);width:100%;perspective:1000px}@media(min-width:769px){.question-options .option-button:nth-child(4){grid-column:2 / 3}}@media(max-width:768px){.question-options{grid-template-columns:1fr;gap:.85rem;padding:.5rem;max-width:100%}.option-button{padding:1rem 1.2rem;min-height:70px;font-size:clamp(.95rem,2.5vw,1.05rem);border-radius:12px}.option-button:hover{transform:translateY(-3px) scale(1.02)}}@media(max-width:480px){.question-options{grid-template-columns:1fr;gap:.5rem;padding:.4rem}.option-button{font-size:.85rem;padding:.8rem}}@media(min-width:769px)and (max-width:1024px){.question-options{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.2rem}.option-button{padding:1.3rem 1.6rem;min-height:90px}}@media(max-width:360px){.question-options{gap:.7rem;padding:.35rem}.option-button{min-height:60px;font-size:.9rem;padding:.85rem 1rem;border-radius:12px}.option-text{padding:0 .75rem}}@media(min-width:1366px){.question-options{max-width:1050px;gap:1.75rem;grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}.option-button{min-height:115px;font-size:1.12rem;padding:1.6rem 2rem;border-radius:17px}}@media(min-width:1440px){.question-options{max-width:1120px;gap:1.85rem}.option-button{min-height:120px;font-size:1.16rem;padding:1.7rem 2.15rem}}@media(min-width:1536px){.question-options{max-width:1200px;gap:2rem}.option-button{min-height:125px;font-size:1.2rem;padding:1.8rem 2.3rem;border-radius:18px}}@media(min-width:1920px){.question-options{max-width:1300px;gap:2.25rem;grid-template-columns:repeat(auto-fit,minmax(380px,1fr))}.option-button{min-height:135px;font-size:1.28rem;padding:2rem 2.5rem;border-radius:19px}}@media(min-width:2560px){.question-options{max-width:1500px;gap:2.75rem;grid-template-columns:repeat(auto-fit,minmax(440px,1fr))}.option-button{min-height:155px;font-size:1.4rem;padding:2.3rem 3rem;border-radius:22px}.option-text{line-height:1.75}}.option-button{background:radial-gradient(circle at 20% 30%,rgba(138,43,226,.15) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(255,215,0,.1) 0%,transparent 50%),linear-gradient(135deg,#140f23f2,#1e1432fa,#191228f2);border:3px solid transparent;background-clip:padding-box,border-box;background-origin:padding-box,border-box;background-image:radial-gradient(circle at 20% 30%,rgba(138,43,226,.15),transparent 50%),radial-gradient(circle at 80% 70%,rgba(255,215,0,.1),transparent 50%),linear-gradient(135deg,#140f23f2,#1e1432fa,#191228f2),linear-gradient(135deg,gold,#fdb931,#ffffac,#fdb931,gold);background-size:100% 100%,100% 100%,100% 100%,300% 300%;animation:cardShimmer 6s ease-in-out infinite,cardFloat 4s ease-in-out infinite;border-radius:clamp(5px,1vw,8px);padding:clamp(.3rem,1vw,.5rem) clamp(.2rem,.8vw,.4rem);aspect-ratio:3 / 1;min-height:auto;height:auto;width:100%;font-size:clamp(.6rem,1.2vw,.75rem);color:#fff;font-weight:600;cursor:pointer;transition:all .5s cubic-bezier(.34,1.56,.64,1);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:relative;box-shadow:0 8px 32px #ffd70040,0 4px 16px #8a2be233,inset 0 0 40px #ffd7000d,inset 0 2px #ffffff1a;touch-action:manipulation;-webkit-tap-highlight-color:transparent;line-height:1.5;min-width:44px;transform-style:preserve-3d;perspective:1000px;animation:fadeIn .8s cubic-bezier(.34,1.56,.64,1) backwards,cardShimmer 6s ease-in-out infinite,cardFloat 4s ease-in-out infinite}.option-button:before{content:"✦";position:absolute;top:3px;left:3px;font-size:clamp(.6rem,1.4vw,.9rem);background:linear-gradient(135deg,gold,#ffffac);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 4px rgba(255,215,0,.6));animation:twinkleCorner 3s ease-in-out infinite;opacity:.8}.option-button:after{content:"✦";position:absolute;bottom:3px;right:3px;font-size:clamp(.6rem,1.4vw,.9rem);background:linear-gradient(135deg,gold,#ffffac);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 4px rgba(255,215,0,.6));animation:twinkleCorner 3s ease-in-out infinite 1.5s;opacity:.8}@keyframes cardShimmer{0%,to{background-position:0% 0%,0% 0%,0% 0%,0% 50%}50%{background-position:0% 0%,0% 0%,0% 0%,100% 50%}}@keyframes cardFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes twinkleCorner{0%,to{opacity:.6;transform:scale(1) rotate(0)}50%{opacity:1;transform:scale(1.2) rotate(180deg)}}@media(max-height:780px){.question-options{gap:.9rem;padding:.6rem}.option-button{min-height:78px;padding:.95rem 1.2rem;font-size:1rem}}@media(max-height:700px){.question-options{gap:.8rem;padding:.5rem}.option-button{min-height:70px;padding:.9rem 1.1rem;font-size:.95rem}}@keyframes cardAppear{0%{opacity:0;transform:perspective(1000px) rotateX(-15deg) translateY(20px)}to{opacity:1;transform:perspective(1000px) rotateX(0) translateY(0)}}.option-button:hover{transform:translateY(-6px) scale(1.03);box-shadow:0 12px 40px #ffd70080,0 6px 20px #8a2be266,0 0 40px #ffd7004d,inset 0 0 50px #ffd7001a,inset 0 2px #fff3;border-width:3px;animation:cardShimmer 3s ease-in-out infinite,cardFloat 4s ease-in-out infinite;z-index:10}.option-button:active{transform:translateY(-4px) scale(1.01);box-shadow:0 10px 35px #ffd70099,0 6px 20px #8a2be280,0 0 35px #ffd70066,inset 0 0 50px #ffd70026;background-image:radial-gradient(circle at 50% 50%,rgba(255,215,0,.2),transparent 70%),radial-gradient(circle at 20% 30%,rgba(138,43,226,.2),transparent 50%),radial-gradient(circle at 80% 70%,rgba(255,215,0,.15),transparent 50%),linear-gradient(135deg,#140f23f2,#1e1432fa,#191228f2),linear-gradient(135deg,gold,#fdb931,#ffffac,#fdb931,gold);z-index:10}.option-button:disabled{opacity:.5;cursor:not-allowed;transform:none}.option-button:disabled:hover{border-color:#e0e7ff;box-shadow:none}.option-text{background:linear-gradient(135deg,#fff,gold,#fff);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:600;line-height:1.6;margin:0;padding:0 clamp(1rem,3vw,1.5rem);word-wrap:break-word;overflow-wrap:break-word;text-shadow:0 0 20px rgba(255,215,0,.5);animation:textShine 4s ease-in-out infinite;position:relative;z-index:1}@keyframes textShine{0%,to{background-position:0% center}50%{background-position:100% center}}.option-button:hover .option-text{background:linear-gradient(135deg,gold,#ffffac,gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;text-shadow:0 0 30px rgba(255,215,0,.8);animation:textShine 2s ease-in-out infinite}.option-button:active .option-text{background:linear-gradient(135deg,#fff,gold,#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:800;text-shadow:0 0 40px rgba(255,215,0,1)}.option-arrow{display:none}@media(hover:none)and (pointer:coarse){.option-button:hover{transform:scale(.98)}.option-button:active{transform:scale(.95);box-shadow:0 8px 30px #ffd70080,0 0 50px #ffd70066,inset 0 0 40px #ffd70026}}.option-button:hover .option-arrow{transform:translate(4px)}@keyframes fadeIn{0%{opacity:0;transform:perspective(1000px) translateY(50px) translate(-30px) rotateX(-20deg) rotateY(15deg) scale(.8)}to{opacity:1;transform:perspective(1000px) translateY(0) translate(0) rotateX(0) rotateY(0) scale(1)}}.option-button:nth-child(1){animation-delay:.1s}.option-button:nth-child(2){animation-delay:.2s}.option-button:nth-child(3){animation-delay:.3s}.option-button:nth-child(4){animation-delay:.4s}.option-button:nth-child(5){animation-delay:.5s}.sparky-flying{position:absolute;top:15px;right:15px;width:clamp(80px,12vw,110px);height:auto;z-index:11002;animation:floatSparky 3s ease-in-out infinite,flyInSide 1s ease-out backwards;filter:drop-shadow(0 10px 25px rgba(255,215,0,.5));pointer-events:none;transition:all .3s ease}@keyframes flyInSide{0%{opacity:0;transform:translate(50px,-20px) rotate(15deg) scale(.8)}to{opacity:1;transform:translate(0) rotate(0) scale(1)}}@keyframes floatSparky{0%,to{transform:translateY(0) rotate(-3deg)}25%{transform:translateY(-12px) rotate(2deg)}50%{transform:translateY(-20px) rotate(3deg)}75%{transform:translateY(-12px) rotate(-2deg)}}.personality-result-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:11000;pointer-events:none}.personality-card{position:relative;pointer-events:auto;margin:0;max-width:min(720px,90vw);width:100%;overflow:hidden;border:2px solid transparent;background-clip:padding-box,border-box;background-origin:padding-box,border-box;background-image:linear-gradient(160deg,#1e1e23f2,#0a0a0ffc),linear-gradient(135deg,gold,#fdb931,#ffffac,#fdb931,gold);background-size:100% 100%,300% 300%;border-radius:24px;box-shadow:0 25px 50px -12px #000000e6,inset 0 1px 1px #ffffff26,inset 0 0 30px #00000080,0 0 40px #ffd70033;animation:modalPopIn .6s cubic-bezier(.175,.885,.32,1.275) both,goldShimmer 5s ease infinite alternate;z-index:11001;max-height:90vh;overflow-y:auto;scrollbar-width:none}@keyframes goldShimmer{0%{background-position:100% 100%,0% 50%}to{background-position:100% 100%,100% 50%}}.personality-card::-webkit-scrollbar{width:0px;display:none}.personality-card-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0009;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:10999;animation:fadeIn .4s ease-out;display:block}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalPopIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.card-header{padding:clamp(1.5rem,3vw,2rem);text-align:center;color:#fff;position:relative;overflow:visible;border-bottom:1px solid rgba(255,215,0,.15);background:linear-gradient(180deg,rgba(255,215,0,.05) 0%,transparent 100%);border-radius:24px 24px 0 0;margin-top:-2px}.card-header:before{display:none}.card-header h2{margin:0 0 .8rem;font-size:clamp(1.2rem,2.5vw,1.5rem);font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:3px;position:relative;z-index:1;text-shadow:0 0 20px rgba(255,215,0,.8),0 2px 4px rgba(0,0,0,.8)}.card-header h1{margin:0;font-size:clamp(2.5rem,6vw,3.5rem);font-weight:900;color:#fff;letter-spacing:.5px;text-shadow:0 0 25px rgba(255,215,0,.7),0 4px 12px rgba(0,0,0,.5),0 0 50px rgba(255,215,0,.4);position:relative;z-index:1;line-height:1.15}.card-body{padding:clamp(1.5rem,3vw,2.5rem)}.message-section{margin-bottom:1.5rem}.message-section h3,.traits-section h3{color:gold;margin-bottom:.8rem;font-size:1.1rem;font-weight:600;letter-spacing:.5px;text-shadow:0 0 10px rgba(255,215,0,.2)}.message{background:#ffffff08;padding:1.2rem;border-radius:16px;border:1px solid rgba(255,215,0,.15);font-size:1rem;line-height:1.6;color:#ffffffe6;box-shadow:inset 0 2px 10px #0003}.traits-section{margin-bottom:2rem}.traits-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.8rem}.traits-list li{background:#ffffff08;padding:.9rem 1.2rem;border-radius:12px;border:1px solid rgba(255,215,0,.1);color:#ffffffe6;font-size:1rem;line-height:1.4;transition:all .3s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.traits-list li:hover{transform:translate(5px);background:#ffd70026;border-color:#ffd70066;box-shadow:0 4px 15px #ffd70033}.restart-button{width:100%;padding:1rem;background:linear-gradient(135deg,gold,#ffb700);color:#000;border:none;border-radius:14px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 15px #ffd7004d;text-transform:uppercase;letter-spacing:1px;min-height:48px;position:relative;overflow:hidden}.restart-button:hover{background:linear-gradient(135deg,#ffb700,gold);box-shadow:0 8px 25px #ffd70080;transform:translateY(-2px)}.restart-button:active{transform:translateY(0);box-shadow:0 2px 8px #ffd70033}.card-actions{display:flex;flex-direction:column;gap:.75rem;margin-top:1.5rem}.download-button{width:100%;padding:1rem;background:linear-gradient(135deg,#4a90e2,#357abd);color:#fff;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #4a90e24d;min-height:48px;position:relative;overflow:hidden}.download-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.download-button:hover:not(:disabled):before{left:100%}.download-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #4a90e266;background:linear-gradient(135deg,#5aa0f2,#4580cd)}.download-button:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 8px #4a90e233}.download-button:disabled{opacity:.7;cursor:not-allowed;background:linear-gradient(135deg,#6b7280,#4b5563)}@media(max-width:768px){.sparky-flying{top:10px;right:10px;width:clamp(70px,10vw,90px)}.personality-card{max-width:min(650px,94vw);width:calc(100% - 1.5rem);max-height:85vh}.card-header h1{font-size:2rem}}@media(max-width:480px){.sparky-flying{top:8px;right:8px;width:clamp(55px,8vw,75px)}.personality-card{width:calc(100% - 1rem);border-radius:20px}.card-header,.card-body{padding:1.5rem}}.email-input{width:100%;padding:1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#fff;font-size:1rem;outline:none;transition:all .3s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);margin-bottom:.5rem;box-sizing:border-box}.email-input::placeholder{color:#fff6}.email-input:focus{background:#ffffff1a;border-color:#ffd70066;box-shadow:0 0 15px #ffd7001a}.send-status{margin:-.25rem 0 0;font-size:.9rem;text-align:center}.send-status-success{color:#4ade80}.send-status-error{color:#f87171}
