@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Roboto:wght@300;400;500;700&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--color-primary: #1a237e;--color-secondary: #ffd700;--color-accent: #00e5ff;--color-background: #0a0a0a;--color-surface: rgba(255, 255, 255, .05);--color-text: #ffffff;--color-text-secondary: #b0bec5;--color-success: #4caf50;--color-error: #f44336;--color-warning: #ff9800;--gradient-primary: linear-gradient(135deg, var(--color-primary) 0%, #3949ab 100%);--gradient-secondary: linear-gradient(135deg, var(--color-secondary) 0%, #ffb300 100%);--gradient-accent: linear-gradient(135deg, var(--color-accent) 0%, #18ffff 100%);--gradient-background: radial-gradient(ellipse at top, #1a237e 0%, #0a0a0a 70%);--glass-background: rgba(255, 255, 255, .05);--glass-border: rgba(255, 255, 255, .1);--glass-shadow: 0 8px 32px rgba(0, 0, 0, .3);--glass-backdrop: blur(10px);--font-primary: "Poppins", sans-serif;--font-secondary: "Roboto", sans-serif;--font-mono: "JetBrains Mono", monospace;--transition-fast: .2s ease-out;--transition-normal: .4s ease-out;--transition-slow: .8s ease-out;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .1);--shadow-md: 0 4px 16px rgba(0, 0, 0, .2);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .3);--shadow-xl: 0 16px 64px rgba(0, 0, 0, .4)}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-primary);font-weight:400;line-height:1.6;color:var(--color-text);background:var(--gradient-background);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#ffffff0d;border-radius:4px}::-webkit-scrollbar-thumb{background:var(--gradient-accent);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-accent)}::selection{background:var(--color-accent);color:var(--color-background)}.glass{background:var(--glass-background);backdrop-filter:var(--glass-backdrop);-webkit-backdrop-filter:var(--glass-backdrop);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow)}.glass-strong{background:#ffffff1a;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);box-shadow:0 8px 32px #0006}.animate-fade-in{animation:fadeIn .4s ease-out}.animate-slide-up{animation:slideUp .5s ease-out}.animate-slide-down{animation:slideDown .5s ease-out}.animate-scale-in{animation:scaleIn .4s ease-out}.animate-bounce{animation:bounce .6s ease-out}.animate-pulse{animation:none}.animate-shake{animation:shake .5s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes bounce{0%,20%,53%,80%,to{transform:translateZ(0)}40%,43%{transform:translate3d(0,-10px,0)}70%{transform:translate3d(0,-5px,0)}90%{transform:translate3d(0,-2px,0)}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.8}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-lg);border:none;border-radius:var(--radius-md);font-family:var(--font-primary);font-weight:500;font-size:1rem;cursor:pointer;transition:all var(--transition-fast);text-decoration:none;position:relative;overflow:hidden}.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn:active{transform:translateY(0)}.btn-primary{background:var(--gradient-primary);color:var(--color-text)}.btn-secondary{background:var(--gradient-secondary);color:var(--color-background)}.btn-accent{background:var(--gradient-accent);color:var(--color-background)}.btn-glass{background:var(--glass-background);backdrop-filter:var(--glass-backdrop);-webkit-backdrop-filter:var(--glass-backdrop);border:1px solid var(--glass-border);color:var(--color-text)}.btn-outline{background:transparent;border:2px solid var(--color-accent);color:var(--color-accent)}.btn-outline:hover{background:var(--color-accent);color:var(--color-background)}.text-gradient{background:var(--gradient-accent);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.text-glow{text-shadow:0 0 20px var(--color-accent)}.card{background:var(--glass-background);backdrop-filter:var(--glass-backdrop);-webkit-backdrop-filter:var(--glass-backdrop);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--glass-shadow);transition:all var(--transition-normal)}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl);border-color:#fff3}@media (max-width: 1200px){:root{font-size:15px}}@media (max-width: 768px){:root{font-size:14px}.btn{padding:var(--spacing-sm) var(--spacing-md);font-size:.9rem;min-height:48px}.card{padding:var(--spacing-md)}.quiz-game{padding:var(--spacing-sm)!important}.game-content{flex-direction:column!important;gap:var(--spacing-md)!important}.timer-section{order:-1!important}}@media (max-width: 480px){:root{font-size:13px}.btn{min-height:44px;font-size:.85rem;padding:var(--spacing-xs) var(--spacing-sm)}.card{padding:var(--spacing-sm);border-radius:var(--radius-md)}.quiz-game{padding:var(--spacing-xs)!important}.question-section{font-size:.9rem!important}}@media (max-width: 320px){:root{font-size:12px}.btn{min-height:40px;font-size:.8rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.btn:focus-visible,button:focus-visible,[role=button]:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}@media (prefers-contrast: high){:root{--color-text: #ffffff;--color-background: #000000;--glass-background: rgba(255, 255, 255, .2);--glass-border: rgba(255, 255, 255, .4)}}@media (prefers-color-scheme: dark){:root{--color-background: #0a0a0a;--color-surface: #1a1a1a;--color-text: #ffffff;--color-text-secondary: #a0a0a0}}
