:root{--navy:#071a45;--blue:#1455c5;--orange:#ff7900;--ink:#101828;--muted:#667085;--line:#e8edf5;--white:#fff}*{box-sizing:border-box}html{min-height:100%;background:#f5f8ff}body{margin:0;min-height:100vh;font-family:'DM Sans',sans-serif;color:var(--ink);display:flex;flex-direction:column;overflow-x:hidden;background:radial-gradient(ellipse at 12% 15%,rgba(33,103,219,.11),transparent 34%),radial-gradient(ellipse at 90% 82%,rgba(255,126,0,.12),transparent 35%),#f8faff}.grid-bg{position:fixed;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(rgba(16,48,100,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(16,48,100,.045) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,black,transparent 85%)}.ambient{position:fixed;border-radius:50%;filter:blur(2px);pointer-events:none}.a1{width:230px;height:230px;background:#dceaff;top:22%;left:-130px}.a2{width:260px;height:260px;background:#ffead8;right:-150px;bottom:5%}.topbar{height:78px;width:min(1100px,calc(100% - 40px));margin:auto;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}.brand img{width:142px;height:54px;object-fit:contain}.top-pill{font-size:10px;letter-spacing:1.6px;font-weight:800;color:#1b438a;background:#eaf1ff;border:1px solid #d9e5ff;border-radius:30px;padding:9px 13px;display:flex;align-items:center;gap:8px}.live-dot{width:7px;height:7px;background:#ff8500;border-radius:50%;box-shadow:0 0 0 4px #ffead8}.shell{width:100%;flex:1;display:flex;justify-content:center;align-items:center;padding:28px 18px 48px;position:relative;z-index:1}.card{width:min(100%,570px);background:rgba(255,255,255,.92);border:1px solid rgba(220,229,244,.9);border-radius:28px;padding:38px 48px 34px;box-shadow:0 24px 80px rgba(22,54,105,.10),0 3px 12px rgba(22,54,105,.04);text-align:center;position:relative;overflow:hidden;backdrop-filter:blur(12px)}.card:before{content:"";position:absolute;top:0;left:12%;right:12%;height:3px;background:linear-gradient(90deg,#1455c5,#793caa,#ff7900);border-radius:0 0 8px 8px}.screen{display:none;animation:enter .48s cubic-bezier(.2,.8,.2,1)}.screen.active{display:block}@keyframes enter{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.8px;color:#31538b}.eyebrow span{color:var(--orange)}.hero-icon{height:132px;display:grid;place-items:center;position:relative;margin:12px auto 8px}.question-orb{width:94px;height:94px;border-radius:28px;display:grid;place-items:center;font:800 58px 'Outfit';color:white;background:linear-gradient(140deg,#1455c5 10%,#4939a6 58%,#ff7900);box-shadow:0 14px 28px #224a9a40;transform:rotate(-7deg);animation:float 3s ease-in-out infinite}.spark{position:absolute;color:#ff8a00;font-size:25px;animation:twinkle 2s infinite}.s1{left:29%;top:13%}.s2{right:28%;bottom:14%;animation-delay:.8s}@keyframes float{50%{transform:translateY(-8px) rotate(2deg)}}@keyframes twinkle{50%{transform:scale(.55) rotate(35deg);opacity:.45}}.kicker{font-size:11px;letter-spacing:1.4px;font-weight:800;color:#8290a6;margin:15px 0 10px}h1,h2,h3{font-family:'Outfit',sans-serif;letter-spacing:-1.1px}h1{font-size:clamp(38px,7vw,53px);line-height:1.04;margin:0 0 15px;color:#101c38}h2{font-size:clamp(29px,5vw,39px);line-height:1.12;margin:12px 0 12px;color:#101c38}.gradient-text{background:linear-gradient(100deg,#1455c5 10%,#673eaa 54%,#ff7900 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.subcopy{font-size:14px;line-height:1.75;color:#68758b;margin:0 auto 22px}.welcome-question{font-size:15px;font-weight:800;color:#14264a;background:#f4f7ff;border:1px solid #e6edfc;padding:15px 12px;border-radius:14px;margin:20px 0 17px}.actions{display:flex;gap:10px;justify-content:center}.actions.stacked{flex-direction:column;max-width:310px;margin:24px auto 0}.btn{min-height:49px;padding:0 20px;border:0;border-radius:13px;font:700 13px 'DM Sans';display:inline-flex;align-items:center;justify-content:center;gap:17px;text-decoration:none;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s}.btn:hover{transform:translateY(-2px)}.btn:active{transform:scale(.98)}.btn-primary{color:#fff;background:linear-gradient(105deg,#1455c5,#2446a5 65%,#ff7900);box-shadow:0 9px 20px #1c4ea52e}.btn-primary:hover{box-shadow:0 12px 25px #1c4ea54a}.btn-primary span{font-size:19px}.btn-ghost{color:#28416d;background:#f1f5fc;border:1px solid #e3eaf6}.tiny-note{font-size:10px;color:#9aa5b6;margin:17px 0 0}.emoji-big{font-size:66px;margin:12px 0 16px;animation:float 3s ease-in-out infinite}.soft-box{background:linear-gradient(110deg,#f1f5ff,#fff5eb);border:1px solid #e9eaf3;padding:15px;border-radius:14px;font-size:13px;font-weight:700;color:#33476c}.quiz-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.counter{font-size:9px;letter-spacing:1px;font-weight:800;color:#8b96a9;background:#f2f5fa;border-radius:30px;padding:8px 10px}.progress{height:5px;background:#edf1f7;border-radius:10px;margin:17px 0 5px;overflow:hidden}.progress span{height:100%;width:100%;display:block;background:linear-gradient(90deg,#1455c5,#ff7900);border-radius:10px;transition:width .4s}.quiz-art{font-size:52px;margin:23px auto 8px;width:92px;height:82px;border-radius:24px;background:linear-gradient(140deg,#e9f0ff,#fff1e4);display:grid;place-items:center;position:relative}.quiz-art span{position:absolute;font-size:19px;right:9px;top:7px;color:#ff8b00}.bonus-art{background:linear-gradient(140deg,#fff0df,#eaf1ff)}.answer-form{text-align:left;margin:25px auto 0;max-width:390px}.answer-form label{font-size:9px;font-weight:800;letter-spacing:1.5px;color:#71809a;display:block;margin:0 0 8px 3px}.input-wrap{display:flex;gap:7px;padding:6px;background:#f7f9fd;border:1.5px solid #e2e9f4;border-radius:14px;transition:border .2s,box-shadow .2s}.input-wrap:focus-within{border-color:#4775d1;box-shadow:0 0 0 4px #4775d11c}.input-wrap input{min-width:0;flex:1;border:0;outline:0;background:transparent;padding:0 10px;font:600 14px 'DM Sans';color:#17294d}.input-wrap input::placeholder{color:#a6afbd;font-weight:400}.send-btn{width:42px;height:42px;border:0;border-radius:10px;color:#fff;font-size:22px;background:linear-gradient(135deg,#1455c5,#ff7900);cursor:pointer}.error{height:15px;margin:6px 3px 0;font-size:11px;color:#e04d3d}.text-button{border:0;background:none;color:#8793a7;font:600 11px 'DM Sans';margin-top:15px;cursor:pointer}.success-check{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;margin:12px auto 20px;background:linear-gradient(135deg,#1455c5,#ff7900);color:white;font-size:38px;box-shadow:0 12px 25px #174fa13d;animation:pop .55s cubic-bezier(.2,1.5,.5,1)}@keyframes pop{from{transform:scale(.2)}to{transform:scale(1)}}.celebration-box{line-height:1.8;font-size:16px}.celebration-box span{font-size:11px;font-weight:500;color:#76839a}footer{width:min(1100px,calc(100% - 40px));margin:0 auto;padding:0 0 22px;display:flex;justify-content:space-between;color:#98a3b5;font-size:10px;position:relative;z-index:1}footer b{color:#ff7900}.modal-backdrop{position:fixed;inset:0;background:#0817359c;backdrop-filter:blur(7px);z-index:10;display:none;place-items:center;padding:20px}.modal-backdrop.show{display:grid;animation:fade .2s}@keyframes fade{from{opacity:0}to{opacity:1}}.modal{background:#fff;border-radius:24px;width:min(100%,360px);padding:30px 25px;text-align:center;box-shadow:0 25px 80px #0003;animation:pop .35s}.modal-emoji{font-size:49px}.modal h3{font-size:28px;margin:12px 0 7px}.modal p{font-size:13px;color:#718096;line-height:1.6;margin:0 0 20px}.modal .btn{width:100%}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,20px);opacity:0;z-index:20;background:#12254b;color:#fff;padding:11px 17px;border-radius:12px;font-size:12px;transition:.25s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}#confetti{position:fixed;inset:0;pointer-events:none;z-index:15;width:100%;height:100%}
@media(max-width:600px){.topbar{height:68px;width:calc(100% - 30px)}.brand img{width:119px;height:47px}.top-pill{font-size:9px;padding:8px 10px}.shell{padding:18px 14px 34px;align-items:center}.card{padding:30px 22px 27px;border-radius:23px}.hero-icon{height:112px}.question-orb{width:82px;height:82px;font-size:50px;border-radius:25px}.s1{left:22%}.s2{right:21%}.subcopy{font-size:13px}.welcome-question{font-size:13px;padding:14px 8px}.actions:not(.stacked){flex-direction:column}.actions:not(.stacked) .btn{width:100%}.desktop-only{display:none}.quiz-art{margin-top:20px}h2{font-size:32px}.quiz-head{align-items:flex-start}.counter{font-size:8px}.answer-form{margin-top:22px}footer{font-size:9px;width:calc(100% - 30px)} }
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}