:root{--primary-50: #eff6ff;--primary-100: #dbeafe;--primary-500: #3b82f6;--primary-600: #2563eb;--primary-700: #1d4ed8;--success-50: #f0fdf4;--success-500: #22c55e;--success-600: #16a34a;--warning-50: #fffbeb;--warning-500: #f59e0b;--danger-50: #fef2f2;--danger-500: #ef4444;--danger-600: #dc2626;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .2s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1)}.custom-scrollbar::-webkit-scrollbar{width:6px;height:6px}.custom-scrollbar::-webkit-scrollbar-track{background:#f1f5f9;border-radius:10px}.custom-scrollbar::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#3b82f6,#8b5cf6);border-radius:10px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#2563eb,#7c3aed)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes confetti{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(-100vh) rotate(720deg);opacity:0}}.animate-fade-in{animation:fadeIn .3s ease-out}.animate-slide-up{animation:slideUp .4s ease-out}.animate-slide-down{animation:slideDown .4s ease-out}.animate-scale-in{animation:scaleIn .3s ease-out}.animate-pulse-slow{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.animate-bounce-slow{animation:bounce 2s ease-in-out infinite}.glass{background:#ffffffb3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3)}.glass-dark{background:#1e293bcc;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1)}.gradient-primary{background:linear-gradient(135deg,#3b82f6,#8b5cf6)}.gradient-success{background:linear-gradient(135deg,#22c55e,#10b981)}.gradient-warning{background:linear-gradient(135deg,#f59e0b,#f97316)}.gradient-danger{background:linear-gradient(135deg,#ef4444,#f97316)}.gradient-rainbow{background:linear-gradient(135deg,#f43f5e,#ec4899,#8b5cf6,#3b82f6,#22c55e);background-size:200% 200%;animation:shimmer 3s linear infinite}.text-gradient{background:linear-gradient(135deg,#3b82f6,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.625rem 1.25rem;font-weight:600;border-radius:.75rem;transition:all var(--transition-normal);cursor:pointer;border:none;outline:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;box-shadow:0 4px 14px #3b82f666}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #3b82f680}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-success{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;box-shadow:0 4px 14px #22c55e66}.btn-success:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #22c55e80}.btn-danger{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;box-shadow:0 4px 14px #ef444466}.btn-danger:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #ef444480}.btn-ghost{background:transparent;color:#64748b}.btn-ghost:hover:not(:disabled){background:#f1f5f9;color:#334155}.input{width:100%;padding:.75rem 1rem;border:2px solid #e2e8f0;border-radius:.75rem;font-size:1rem;transition:all var(--transition-normal);background:#fff}.input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.input:hover:not(:focus){border-color:#cbd5e1}.input-icon{position:relative}.input-icon .icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:#94a3b8;pointer-events:none}.input-icon .input{padding-left:2.75rem}.card{background:#fff;border-radius:1rem;box-shadow:var(--shadow-md);transition:all var(--transition-normal);overflow:hidden}.card:hover{box-shadow:var(--shadow-xl);transform:translateY(-2px)}.card-gradient-border{position:relative;background:#fff;border-radius:1rem}.card-gradient-border:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:1.125rem;background:linear-gradient(135deg,#3b82f6,#8b5cf6,#ec4899);z-index:-1;opacity:0;transition:opacity var(--transition-normal)}.card-gradient-border:hover:before{opacity:1}.table-modern{width:100%;border-collapse:separate;border-spacing:0}.table-modern thead th{background:linear-gradient(135deg,#f8fafc,#f1f5f9);padding:1rem 1.5rem;text-align:left;font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:#64748b;border-bottom:2px solid #e2e8f0}.table-modern tbody tr{transition:background var(--transition-fast)}.table-modern tbody tr:hover{background:#f8fafc}.table-modern tbody td{padding:1rem 1.5rem;border-bottom:1px solid #f1f5f9}.tabs{display:flex;gap:.25rem;background:#f1f5f9;padding:.25rem;border-radius:1rem}.tab{flex:1;padding:.75rem 1.5rem;font-weight:600;color:#64748b;border-radius:.75rem;transition:all var(--transition-normal);cursor:pointer;text-align:center;border:none;background:transparent}.tab:hover:not(.tab-active){color:#334155;background:#ffffff80}.tab-active{background:#fff;color:#3b82f6;box-shadow:var(--shadow-sm)}.badge{display:inline-flex;align-items:center;padding:.25rem .75rem;font-size:.75rem;font-weight:600;border-radius:9999px}.badge-primary{background:#dbeafe;color:#1d4ed8}.badge-success{background:#dcfce7;color:#15803d}.badge-warning{background:#fef3c7;color:#b45309}.badge-danger{background:#fee2e2;color:#b91c1c}.progress{width:100%;height:.5rem;background:#e2e8f0;border-radius:9999px;overflow:hidden}.progress-bar{height:100%;background:linear-gradient(90deg,#3b82f6,#8b5cf6);border-radius:9999px;transition:width .5s ease-out}.progress-bar-animated{background-size:200% 100%;animation:shimmer 2s linear infinite}.skeleton{background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0,#f1f5f9 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:.5rem}[data-tooltip]{position:relative}[data-tooltip]:after{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(-.5rem);padding:.5rem .75rem;background:#1e293b;color:#fff;font-size:.75rem;font-weight:500;border-radius:.5rem;white-space:nowrap;opacity:0;visibility:hidden;transition:all var(--transition-fast);z-index:50}[data-tooltip]:hover:after{opacity:1;visibility:visible}.confetti-container{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:100}.confetti{position:absolute;width:10px;height:10px;border-radius:50%;animation:confetti 3s ease-out forwards}.stat-card{padding:1.5rem;border-radius:1rem;background:#fff;border:1px solid #e2e8f0;transition:all var(--transition-normal)}.stat-card:hover{border-color:transparent;box-shadow:var(--shadow-lg)}.stat-card-primary:hover{background:linear-gradient(135deg,#eff6ff,#dbeafe)}.stat-card-success:hover{background:linear-gradient(135deg,#f0fdf4,#dcfce7)}.stat-card-warning:hover{background:linear-gradient(135deg,#fffbeb,#fef3c7)}.hero-section{position:relative;min-height:70vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2,#f97316);background-size:400% 400%;animation:gradientShift 15s ease infinite;overflow:hidden}.hero-section:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.1'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");opacity:.5}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.hero-content{position:relative;z-index:10;text-align:center;color:#fff;padding:2rem}.hero-title{font-size:3.5rem;font-weight:800;text-shadow:2px 4px 20px rgba(0,0,0,.3);margin-bottom:1rem;animation:slideUp .8s ease-out}.hero-subtitle{font-size:1.5rem;font-weight:400;opacity:.95;margin-bottom:2rem;animation:slideUp .8s ease-out .2s backwards}.hero-cta{display:inline-flex;gap:1rem;animation:slideUp .8s ease-out .4s backwards}.floating-shape{position:absolute;border-radius:50%;opacity:.15;animation:float 6s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-30px) rotate(180deg)}}.progress-enhanced{position:relative;width:100%;height:1rem;background:linear-gradient(135deg,#e2e8f0,#f1f5f9);border-radius:.75rem;overflow:hidden;box-shadow:inset 0 2px 4px #0000001a}.progress-bar-enhanced{height:100%;background:linear-gradient(90deg,#22c55e,#10b981,#06b6d4,#3b82f6);background-size:300% 100%;animation:progressGradient 3s ease infinite;border-radius:.75rem;transition:width .8s cubic-bezier(.4,0,.2,1);position:relative}.progress-bar-enhanced:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:progressShine 2s ease-in-out infinite}@keyframes progressGradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes progressShine{0%{transform:translate(-100%)}to{transform:translate(100%)}}.progress-label{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);font-size:.625rem;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3)}@keyframes celebratePulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes starBurst{0%{transform:scale(0) rotate(0);opacity:1}to{transform:scale(1.5) rotate(180deg);opacity:0}}@keyframes scoreReveal{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}@keyframes trophyBounce{0%,to{transform:translateY(0)}25%{transform:translateY(-15px) rotate(-5deg)}75%{transform:translateY(-15px) rotate(5deg)}}.celebrate-pulse{animation:celebratePulse .6s ease-in-out 3}.score-reveal{animation:scoreReveal .8s cubic-bezier(.34,1.56,.64,1)}.trophy-bounce{animation:trophyBounce 1s ease-in-out infinite}.result-card-success{background:linear-gradient(135deg,#dcfce7,#bbf7d0,#86efac);border:2px solid #22c55e}.result-card-fail{background:linear-gradient(135deg,#fee2e2,#fecaca,#fca5a5);border:2px solid #ef4444}.text-display{font-size:4rem;font-weight:800;line-height:1.1;letter-spacing:-.02em}.text-heading-1{font-size:2.5rem;font-weight:700;line-height:1.2}.text-heading-2{font-size:2rem;font-weight:600;line-height:1.3}.text-heading-3{font-size:1.5rem;font-weight:600;line-height:1.4}.text-body-lg{font-size:1.125rem;line-height:1.75}.text-body{font-size:1rem;line-height:1.6}.text-small{font-size:.875rem;line-height:1.5}.text-caption{font-size:.75rem;line-height:1.4;color:#64748b}.glass-card{background:#ffffffd9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.5);border-radius:1.5rem;box-shadow:0 8px 32px #1f268726,inset 0 1px #fffc}.glass-card-colored{background:linear-gradient(135deg,#ffffffe6,#f0f9ffe6);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(59,130,246,.2);border-radius:1.5rem;box-shadow:0 8px 32px #3b82f61a,inset 0 1px #ffffffe6}.question-card{background:#fff;border-radius:1.25rem;padding:1.5rem;box-shadow:0 4px 20px #00000014;border:2px solid transparent;transition:all .3s ease;position:relative;overflow:hidden}.question-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#3b82f6,#8b5cf6,#ec4899);opacity:0;transition:opacity .3s ease}.question-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px #0000001f;border-color:#e2e8f0}.question-card:hover:before{opacity:1}.question-number{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;font-weight:700;border-radius:.75rem;font-size:.875rem;box-shadow:0 4px 12px #3b82f64d}.option-btn{display:flex;align-items:center;gap:1rem;width:100%;padding:1rem 1.25rem;background:linear-gradient(135deg,#f8fafc,#fff);border:2px solid #e2e8f0;border-radius:1rem;cursor:pointer;transition:all .2s ease;text-align:left}.option-btn:hover{border-color:#3b82f6;background:linear-gradient(135deg,#eff6ff,#fff);transform:translate(4px)}.option-btn.selected{border-color:#3b82f6;background:linear-gradient(135deg,#dbeafe,#eff6ff);box-shadow:0 4px 12px #3b82f633}.option-label{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;background:#e2e8f0;color:#64748b;border-radius:.5rem;font-weight:700;font-size:.875rem;flex-shrink:0;transition:all .2s ease}.option-btn:hover .option-label,.option-btn.selected .option-label{background:#3b82f6;color:#fff}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}.stat-card-enhanced{padding:1.5rem;border-radius:1.25rem;background:#fff;border:1px solid #e2e8f0;transition:all .3s ease;position:relative;overflow:hidden}.stat-card-enhanced:before{content:"";position:absolute;top:0;left:0;width:100%;height:4px}.stat-card-enhanced.blue:before{background:linear-gradient(90deg,#3b82f6,#06b6d4)}.stat-card-enhanced.green:before{background:linear-gradient(90deg,#22c55e,#10b981)}.stat-card-enhanced.orange:before{background:linear-gradient(90deg,#f59e0b,#f97316)}.stat-card-enhanced.purple:before{background:linear-gradient(90deg,#8b5cf6,#ec4899)}.stat-card-enhanced:hover{transform:translateY(-4px);box-shadow:0 12px 40px #0000001a}.stat-value{font-size:2.5rem;font-weight:800;line-height:1;margin-bottom:.5rem}.stat-value.blue{color:#3b82f6}.stat-value.green{color:#22c55e}.stat-value.orange{color:#f59e0b}.stat-value.purple{color:#8b5cf6}.stat-label{font-size:.875rem;color:#64748b;font-weight:500}.chart-container{background:#fff;border-radius:1.25rem;padding:1.5rem;box-shadow:0 4px 20px #00000014}.chart-title{font-size:1.125rem;font-weight:700;color:#1e293b;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}@media(max-width:768px){.hero-title{font-size:2rem}.hero-subtitle{font-size:1rem}.text-display{font-size:2.5rem}.text-heading-1{font-size:1.75rem}.stats-grid{grid-template-columns:repeat(2,1fr)}.question-card{padding:1rem}}@media(max-width:480px){.stats-grid{grid-template-columns:1fr}.hero-cta{flex-direction:column}}.hover-lift{transition:transform .3s ease,box-shadow .3s ease}.hover-lift:hover{transform:translateY(-6px);box-shadow:0 20px 40px #00000026}.hover-glow{transition:box-shadow .3s ease}.hover-glow:hover{box-shadow:0 0 30px #3b82f666}.hover-scale{transition:transform .2s ease}.hover-scale:hover{transform:scale(1.02)}.press-effect{transition:transform .1s ease}.press-effect:active{transform:scale(.98)}
