@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap";
:root{--background:#09090b;--surface:#ffffff0a;--surface-hover:#ffffff12;--border:#ffffff17;--border-hover:#fff3;--text-primary:#fff;--text-secondary:#a1a1aa;--accent-girl:#ff2a5f;--accent-boy:#08f;--gradient-girl:linear-gradient(135deg, #ff2a5f, #ff7b00);--gradient-boy:linear-gradient(135deg, #08f, #00d4ff);--font-main:"Outfit", sans-serif;--radius-sm:12px;--radius-md:20px;--radius-lg:28px;--radius-full:100px;--space-xs:8px;--space-sm:16px;--space-md:24px;--space-lg:40px;--space-xl:64px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-main);background-color:var(--background);color:var(--text-primary);background-image:radial-gradient(at 10% 40%,#ff2a5f14,#0000 45%),radial-gradient(at 90% 20%,#0088ff14,#0000 45%),radial-gradient(at 50% 100%,#0088ff0a,#0000 50%);background-attachment:fixed;min-height:100vh;overflow-x:hidden}h1{letter-spacing:-.03em;font-size:clamp(2.2rem,5vw,4rem);font-weight:800;line-height:1.1}h2{letter-spacing:-.02em;font-size:clamp(1.6rem,3vw,2.4rem);font-weight:700;line-height:1.2}h3{font-size:1.2rem;font-weight:600}p{color:var(--text-secondary);font-size:1.05rem;line-height:1.7}.container{width:100%;max-width:1100px;padding:0 var(--space-md);margin:0 auto}.min-h-screen{min-height:100vh}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.text-center{text-align:center}.text-left{text-align:left}.w-full{width:100%}.mt-auto{margin-top:auto}.relative{position:relative}.overflow-hidden{overflow:hidden}.gap-2{gap:8px}.gap-4{gap:16px}.gap-5{gap:20px}.gap-6{gap:24px}.gap-8{gap:32px}.grid{display:grid}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.mb-2{margin-bottom:8px}.mb-4{margin-bottom:16px}.mb-6{margin-bottom:24px}.mb-8{margin-bottom:32px}.mb-12{margin-bottom:48px}.mt-2{margin-top:8px}.mt-4{margin-top:16px}.p-6{padding:24px}.p-8{padding:32px}.py-12{padding-top:48px;padding-bottom:48px}.py-16{padding-top:64px;padding-bottom:64px}.px-4{padding-left:16px;padding-right:16px}.text-sm{font-size:.875rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}.font-bold{font-weight:700}.font-black{font-weight:900}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-white{color:#fff}.text-secondary{color:var(--text-secondary)}.text-gray-300{color:#d1d5db}.text-gray-400{color:#9ca3af}.tracking-widest{letter-spacing:.2em}.leading-relaxed{line-height:1.75}.rounded-2xl{border-radius:16px}.border{border:1px solid var(--border)}.z-10{z-index:10;position:relative}.hidden{display:none}.max-w-md{max-width:28rem}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.glass-panel{background:var(--surface);-webkit-backdrop-filter:blur(24px);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:0 8px 48px #0000004d,inset 0 1px #ffffff0f}.glass-button{border:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--text-primary);border-radius:var(--radius-full);font-size:1rem;font-family:var(--font-main);cursor:pointer;letter-spacing:-.01em;background:#ffffff12;justify-content:center;align-items:center;gap:10px;padding:14px 28px;font-weight:600;text-decoration:none;transition:all .35s cubic-bezier(.16,1,.3,1);display:inline-flex}.glass-button:hover{border-color:var(--border-hover);background:#ffffff1f;transform:translateY(-3px);box-shadow:0 10px 28px #00000040}.glass-button.girl{background:linear-gradient(135deg,#ff2a5f40,#ff7b0026);border-color:#ff2a5f59}.glass-button.girl:hover{background:linear-gradient(135deg,#ff2a5f59,#ff7b0040);border-color:#ff2a5f99;box-shadow:0 10px 32px #ff2a5f40}.glass-button.boy{background:linear-gradient(135deg,#0088ff40,#00d4ff26);border-color:#0088ff59}.glass-button.boy:hover{background:linear-gradient(135deg,#0088ff59,#00d4ff40);border-color:#08f9;box-shadow:0 10px 32px #0088ff40}.text-gradient-girl{background:var(--gradient-girl);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.text-gradient-boy{background:var(--gradient-boy);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.input-glass{border:1px solid var(--border);color:var(--text-primary);border-radius:var(--radius-sm);background:#00000059;outline:none;width:100%;padding:14px 18px;font-family:inherit;font-size:1rem;transition:all .3s}.input-glass:focus{background:#00000080;border-color:#ffffff40;box-shadow:0 0 0 3px #ffffff0a}.input-glass::placeholder{color:#a1a1aa80}.label-glass{color:var(--text-secondary);letter-spacing:.01em;text-transform:uppercase;margin-bottom:10px;font-size:.9rem;font-weight:500;display:block}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes slideUpFade{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-ring{0%{box-shadow:0 0 #ffffff1a}70%{box-shadow:0 0 0 20px #fff0}to{box-shadow:0 0 #fff0}}.animate-float{animation:5s ease-in-out infinite float}.animate-slide-up{opacity:0;animation:.7s cubic-bezier(.16,1,.3,1) forwards slideUpFade}.delay-100{animation-delay:80ms}.delay-200{animation-delay:.16s}.delay-300{animation-delay:.24s}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#fff3}.radio-group{flex-direction:column;gap:10px;display:flex}.radio-label{border-radius:var(--radius-md);border:1px solid var(--border);cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--text-secondary);background:#ffffff05;align-items:center;gap:14px;padding:14px 18px;font-size:.97rem;line-height:1.5;transition:all .25s;display:flex}.radio-label:hover{color:var(--text-primary);background:#ffffff0d;border-color:#ffffff29}.radio-input{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.radio-label.selected-girl{color:#fff;background:#ff2a5f1a;border-color:#ff2a5f8c}.radio-label.selected-boy{color:#fff;background:#0088ff1a;border-color:#0088ff8c}.radio-circle{background:0 0;border:2px solid #a1a1aa80;border-radius:50%;flex-shrink:0;width:20px;height:20px;transition:all .25s;position:relative}.radio-label.selected-girl .radio-circle{border-color:var(--accent-girl)}.radio-label.selected-boy .radio-circle{border-color:var(--accent-boy)}.radio-label.selected-girl .radio-circle:after,.radio-label.selected-boy .radio-circle:after{content:"";border-radius:50%;width:8px;height:8px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.radio-label.selected-girl .radio-circle:after{background:var(--accent-girl)}.radio-label.selected-boy .radio-circle:after{background:var(--accent-boy)}.question-card{border-radius:var(--radius-md);background:#ffffff06;border:1px solid #ffffff0f;margin-bottom:20px;padding:24px}.question-number{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;margin-right:10px;font-size:.8rem;font-weight:700;display:inline-flex}.question-number-girl{color:var(--accent-girl);background:#ff2a5f26}.question-number-boy{color:var(--accent-boy);background:#0088ff26}.question-text{color:#e4e4e7;align-items:flex-start;gap:0;margin-bottom:16px;font-size:1rem;font-weight:600;line-height:1.5;display:flex}.progress-bar-track{background:#ffffff0f;border-radius:2px;width:100%;height:4px;margin-bottom:32px;overflow:hidden}.progress-bar-fill{border-radius:2px;height:100%;transition:width .4s}.progress-bar-fill-girl{background:var(--gradient-girl)}.progress-bar-fill-boy{background:var(--gradient-boy)}@media (max-width:768px){.grid-cols-2{grid-template-columns:1fr}.container{padding:0 16px}.glass-panel{border-radius:var(--radius-md)}h1{font-size:2rem}}