@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--primary: #00f0ff;--primary-dim: #00b8c4;--primary-glow: rgba(0, 240, 255, .3);--primary-bg: rgba(0, 240, 255, .08);--secondary: #a855f7;--secondary-dim: #7c3aed;--secondary-glow: rgba(168, 85, 247, .3);--accent: #f43f5e;--accent-dim: #e11d48;--accent-glow: rgba(244, 63, 94, .3);--success: #10b981;--success-bg: rgba(16, 185, 129, .12);--success-glow: rgba(16, 185, 129, .3);--warning: #f59e0b;--warning-bg: rgba(245, 158, 11, .12);--danger: #ef4444;--danger-bg: rgba(239, 68, 68, .12);--danger-glow: rgba(239, 68, 68, .3);--bg-primary: #0a0a1a;--bg-secondary: #0f0f2e;--bg-tertiary: #151538;--bg-card: rgba(15, 15, 46, .7);--bg-card-hover: rgba(20, 20, 60, .85);--bg-glass: rgba(15, 15, 46, .5);--bg-overlay: rgba(0, 0, 0, .6);--text-primary: #e8e8f0;--text-secondary: #9898b8;--text-muted: #5a5a80;--text-inverse: #0a0a1a;--border-color: rgba(100, 100, 180, .15);--border-glow: rgba(0, 240, 255, .2);--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--space-3xl: 64px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 4px 16px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px var(--primary-glow);--shadow-glow-lg: 0 0 40px var(--primary-glow);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Cascadia Code", "Fira Code", monospace;--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--transition-spring: .5s cubic-bezier(.34, 1.56, .64, 1);--z-base: 1;--z-dropdown: 100;--z-sticky: 200;--z-modal: 1000;--z-toast: 2000}[data-theme=high-contrast]{--bg-primary: #000000;--bg-secondary: #0a0a0a;--bg-tertiary: #1a1a1a;--bg-card: rgba(20, 20, 20, .95);--bg-card-hover: rgba(30, 30, 30, .95);--bg-glass: rgba(20, 20, 20, .9);--text-primary: #ffffff;--text-secondary: #d0d0d0;--text-muted: #a0a0a0;--primary: #00ffff;--secondary: #c084fc;--accent: #ff6b6b;--border-color: rgba(255, 255, 255, .3);--border-glow: rgba(0, 255, 255, .4)}[data-theme=high-contrast] *{font-weight:500!important}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(ellipse at 20% 0%,rgba(0,240,255,.05) 0%,transparent 50%),radial-gradient(ellipse at 80% 100%,rgba(168,85,247,.05) 0%,transparent 50%);pointer-events:none;z-index:0}#root{position:relative;z-index:var(--z-base);min-height:100vh}a{color:var(--primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--primary-dim)}button{cursor:pointer;font-family:var(--font-sans);border:none;outline:none}button:focus-visible,a:focus-visible{outline:2px solid var(--primary);outline-offset:2px}img{max-width:100%;display:block}.glass{background:var(--bg-glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-color)}.glow-border{border:1px solid var(--border-glow);box-shadow:var(--shadow-glow)}.gradient-text{background:linear-gradient(135deg,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.container{max-width:1200px;margin:0 auto;padding:0 var(--space-lg)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--text-muted);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes glow{0%,to{box-shadow:0 0 10px var(--primary-glow)}50%{box-shadow:0 0 25px var(--primary-glow),0 0 50px var(--primary-glow)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-fadeIn{animation:fadeIn .5s ease forwards}.animate-fadeInUp{animation:fadeInUp .5s ease forwards}.animate-scaleIn{animation:scaleIn .4s ease forwards}.animate-float{animation:float 3s ease-in-out infinite}.animate-glow{animation:glow 2s ease-in-out infinite}.stagger>*{animation:fadeInUp .5s ease forwards;opacity:0}.stagger>*:nth-child(1){animation-delay:.05s}.stagger>*:nth-child(2){animation-delay:.1s}.stagger>*:nth-child(3){animation-delay:.15s}.stagger>*:nth-child(4){animation-delay:.2s}.stagger>*:nth-child(5){animation-delay:.25s}.stagger>*:nth-child(6){animation-delay:.3s}.stagger>*:nth-child(7){animation-delay:.35s}.stagger>*:nth-child(8){animation-delay:.4s}.stagger>*:nth-child(9){animation-delay:.45s}.stagger>*:nth-child(10){animation-delay:.5s}@media(max-width:768px){html{font-size:14px}.container{padding:0 var(--space-md)}}.navbar{position:sticky;top:0;z-index:var(--z-sticky);display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) var(--space-lg);background:#0a0a1ad9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border-color)}.navbar-brand{display:flex;align-items:center;gap:var(--space-sm);font-size:1.3rem;font-weight:800;letter-spacing:-.5px;color:var(--text-primary);text-decoration:none}.navbar-brand svg{color:var(--primary);filter:drop-shadow(0 0 6px var(--primary-glow))}.navbar-brand span{background:linear-gradient(135deg,var(--primary),var(--secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.navbar-links{display:flex;align-items:center;gap:var(--space-xs);list-style:none}.navbar-links a{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);color:var(--text-secondary);font-size:.875rem;font-weight:500;transition:all var(--transition-fast);text-decoration:none}.navbar-links a:hover{color:var(--text-primary);background:var(--primary-bg)}.navbar-links a.active{color:var(--primary);background:var(--primary-bg)}.navbar-right{display:flex;align-items:center;gap:var(--space-md)}.score-pill{display:flex;align-items:center;gap:var(--space-xs);padding:6px 14px;border-radius:var(--radius-full);background:var(--primary-bg);border:1px solid var(--border-glow);font-size:.8rem;font-weight:600;color:var(--primary);white-space:nowrap}.score-pill svg{width:14px;height:14px}.mobile-menu-btn{display:none;background:none;color:var(--text-secondary);padding:var(--space-sm)}@media(max-width:768px){.navbar-links{display:none}.mobile-menu-btn{display:flex}.navbar-links.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--bg-secondary);border-bottom:1px solid var(--border-color);padding:var(--space-md)}}.home{overflow:hidden}.hero{position:relative;min-height:85vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--space-3xl) var(--space-lg);overflow:hidden}.hero-bg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0}.hero-grid{position:absolute;width:200%;height:200%;top:-50%;left:-50%;background-image:linear-gradient(rgba(0,240,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,240,255,.03) 1px,transparent 1px);background-size:60px 60px;animation:gridMove 20s linear infinite;transform:perspective(500px) rotateX(60deg)}@keyframes gridMove{0%{transform:perspective(500px) rotateX(60deg) translateY(0)}to{transform:perspective(500px) rotateX(60deg) translateY(60px)}}.hero-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.4}.hero-orb.orb1{width:400px;height:400px;background:var(--primary);top:10%;left:15%;animation:float 8s ease-in-out infinite}.hero-orb.orb2{width:350px;height:350px;background:var(--secondary);bottom:10%;right:15%;animation:float 10s ease-in-out infinite reverse}.hero-orb.orb3{width:250px;height:250px;background:var(--accent);top:40%;right:30%;animation:float 12s ease-in-out infinite}.hero-content{position:relative;z-index:1;max-width:800px;animation:fadeInUp .8s ease}.hero-badge{display:inline-flex;align-items:center;gap:var(--space-sm);padding:6px 18px;border-radius:var(--radius-full);background:var(--primary-bg);border:1px solid var(--border-glow);color:var(--primary);font-size:.8rem;font-weight:600;margin-bottom:var(--space-lg);animation:glow 3s ease-in-out infinite}.hero-title{font-size:4rem;font-weight:900;line-height:1.1;margin-bottom:var(--space-lg);letter-spacing:-2px}.hero-title .gradient-text{display:inline}.hero-subtitle{font-size:1.2rem;color:var(--text-secondary);line-height:1.6;margin-bottom:var(--space-2xl);max-width:600px;margin-left:auto;margin-right:auto}.hero-actions{display:flex;align-items:center;justify-content:center;gap:var(--space-md);flex-wrap:wrap}.btn-primary{display:inline-flex;align-items:center;gap:var(--space-sm);padding:14px 32px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--primary-dim),var(--primary));color:var(--text-inverse);font-size:1rem;font-weight:700;border:none;cursor:pointer;transition:all var(--transition-base);text-decoration:none}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px var(--primary-glow);color:var(--text-inverse)}.btn-outline{display:inline-flex;align-items:center;gap:var(--space-sm);padding:14px 32px;border-radius:var(--radius-md);background:transparent;color:var(--text-primary);font-size:1rem;font-weight:600;border:1px solid var(--border-color);cursor:pointer;transition:all var(--transition-base);text-decoration:none}.btn-outline:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-bg)}.features{padding:var(--space-3xl) var(--space-lg);background:var(--bg-secondary)}.section-header{text-align:center;margin-bottom:var(--space-2xl)}.section-tag{display:inline-block;padding:4px 14px;border-radius:var(--radius-full);background:var(--primary-bg);color:var(--primary);font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:var(--space-md)}.section-title{font-size:2.2rem;font-weight:800;letter-spacing:-1px;margin-bottom:var(--space-sm)}.section-desc{font-size:1rem;color:var(--text-secondary);max-width:600px;margin:0 auto}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-lg);max-width:1100px;margin:0 auto}.feature-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--space-lg);transition:all var(--transition-base)}.feature-card:hover{border-color:var(--border-glow);transform:translateY(-4px);box-shadow:var(--shadow-lg)}.feature-icon{width:52px;height:52px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;margin-bottom:var(--space-md);font-size:1.4rem}.feature-icon.cyan{background:var(--primary-bg);color:var(--primary)}.feature-icon.purple{background:#a855f71f;color:var(--secondary)}.feature-icon.green{background:var(--success-bg);color:var(--success)}.feature-icon.pink{background:#f43f5e1f;color:var(--accent)}.feature-card h3{font-size:1.1rem;font-weight:700;margin-bottom:var(--space-sm)}.feature-card p{font-size:.85rem;color:var(--text-secondary);line-height:1.5}.how-it-works{padding:var(--space-3xl) var(--space-lg)}.steps-container{display:flex;flex-direction:column;gap:var(--space-lg);max-width:700px;margin:0 auto}.step-item{display:flex;gap:var(--space-lg);align-items:flex-start}.step-number{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--primary-bg);border:2px solid var(--primary);color:var(--primary);font-weight:800;font-size:1.2rem;flex-shrink:0}.step-content h3{font-size:1.1rem;font-weight:700;margin-bottom:4px}.step-content p{font-size:.9rem;color:var(--text-secondary);line-height:1.5}.cta-section{padding:var(--space-3xl) var(--space-lg);text-align:center;background:var(--bg-secondary)}.cta-box{max-width:600px;margin:0 auto;background:var(--bg-card);border:1px solid var(--border-glow);border-radius:var(--radius-xl);padding:var(--space-3xl) var(--space-2xl);box-shadow:var(--shadow-glow-lg)}.cta-box h2{font-size:2rem;font-weight:800;margin-bottom:var(--space-md)}.cta-box p{font-size:1rem;color:var(--text-secondary);margin-bottom:var(--space-xl)}.home-footer{padding:var(--space-xl) var(--space-lg);text-align:center;color:var(--text-muted);font-size:.8rem;border-top:1px solid var(--border-color)}@media(max-width:768px){.hero-title{font-size:2.5rem;letter-spacing:-1px}.hero-subtitle{font-size:1rem}.section-title{font-size:1.8rem}}.login-page{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 80px);padding:2rem;background:radial-gradient(circle at top,rgba(0,255,204,.05) 0%,transparent 60%)}.login-container{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:2.5rem;width:100%;max-width:440px;box-shadow:var(--shadow-xl);animation:fadeUp .4s ease-out}.login-header{text-align:center;margin-bottom:2rem}.login-logo{display:inline-flex;align-items:center;justify-content:center;width:60px;height:60px;background:#00ffcc1a;color:var(--primary);border-radius:var(--radius-round);margin-bottom:1rem;border:1px solid rgba(0,255,204,.2)}.login-header h2{color:var(--text-primary);font-size:1.5rem;margin-bottom:.5rem}.login-header p{color:var(--text-secondary);font-size:.95rem}.login-error{background:#ff3b301a;color:#ff5252;padding:.75rem;border-radius:var(--radius-md);border:1px solid rgba(255,59,48,.2);margin-bottom:1.5rem;text-align:center;font-size:.9rem}.login-success{background:#00ff881a;color:#0f8;padding:.75rem;border-radius:var(--radius-md);border:1px solid rgba(0,255,136,.2);margin-bottom:1.5rem;text-align:center;font-size:.9rem}.form-group{margin-bottom:1.25rem}.form-group label{display:block;margin-bottom:.5rem;color:var(--text-primary);font-size:.9rem;font-weight:500}.input-with-icon{position:relative;display:flex;align-items:center}.input-with-icon svg{position:absolute;left:1rem;color:var(--text-muted)}.input-with-icon input{width:100%;padding:.75rem 1rem .75rem 2.75rem;border-radius:var(--radius-md);background:var(--bg-hover);border:1px solid var(--border-color);color:var(--text-primary);font-size:1rem;transition:all .2s ease}.input-with-icon input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px #0fc3}.input-with-icon input::placeholder{color:var(--text-muted)}.login-btn{width:100%;margin-top:1rem;justify-content:center}.login-divider{display:flex;align-items:center;margin:1.5rem 0;color:var(--text-muted);font-size:.85rem}.login-divider:before,.login-divider:after{content:"";flex:1;height:1px;background:var(--border-color)}.login-divider span{padding:0 1rem}.google-btn{width:100%;justify-content:center;background:var(--bg-hover)}.login-toggle{margin-top:2rem;text-align:center;color:var(--text-secondary);font-size:.9rem}.toggle-btn{background:none;border:none;color:var(--primary);cursor:pointer;font-weight:500;padding:0;font-size:inherit}.toggle-btn:hover{text-decoration:underline}.otp-popup-overlay{position:fixed;inset:0;background:#0a0a0fd9;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .2s ease-out}.otp-popup{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:2.5rem;width:90%;max-width:400px;text-align:center;position:relative;box-shadow:0 20px 40px #0006;animation:scaleUp .3s cubic-bezier(.175,.885,.32,1.275)}.otp-popup-close{position:absolute;top:1rem;right:1rem;background:none;border:none;color:var(--text-muted);cursor:pointer;padding:.25rem;transition:color .2s}.otp-popup-close:hover{color:var(--text-primary)}.otp-popup-icon{font-size:3rem;margin-bottom:1rem}.otp-popup h3{font-size:1.4rem;color:var(--text-primary);margin-bottom:.5rem}.otp-popup p{color:var(--text-secondary);font-size:.9rem;margin-bottom:.75rem;line-height:1.4}.otp-popup strong{color:var(--primary)}.otp-code-display{font-size:2.5rem;font-weight:700;letter-spacing:.75rem;color:var(--primary);background:#00ffcc14;border:2px dashed rgba(0,255,204,.3);border-radius:var(--radius-md);padding:1rem 1.5rem;margin:1.25rem 0;font-family:Courier New,monospace;text-shadow:0 0 20px rgba(0,255,204,.4)}.otp-popup-hint{color:var(--text-muted)!important;font-size:.8rem!important;margin-bottom:1.25rem!important}.otp-popup .btn-primary{width:100%;justify-content:center}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleUp{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.score-ring-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm)}.score-ring{position:relative;display:flex;align-items:center;justify-content:center}.score-ring svg{transform:rotate(-90deg);filter:drop-shadow(0 0 8px var(--primary-glow))}.score-ring-bg{stroke:var(--border-color)}.score-ring-progress{stroke:var(--primary);stroke-linecap:round;transition:stroke-dashoffset 1.5s cubic-bezier(.4,0,.2,1)}.score-ring-value{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center}.score-ring-number{font-size:2.5rem;font-weight:800;line-height:1;color:var(--primary)}.score-ring-label{font-size:.75rem;color:var(--text-secondary);font-weight:500;text-transform:uppercase;letter-spacing:1px;margin-top:4px}.score-ring-container.small .score-ring-number{font-size:1.4rem}.score-ring-container.small .score-ring-label{font-size:.65rem}.stat-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--space-lg);display:flex;align-items:flex-start;gap:var(--space-md);transition:all var(--transition-base)}.stat-card:hover{border-color:var(--border-glow);transform:translateY(-2px);box-shadow:var(--shadow-md)}.stat-card-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:var(--radius-md);flex-shrink:0}.stat-card-icon.cyan{background:var(--primary-bg);color:var(--primary)}.stat-card-icon.purple{background:#a855f71f;color:var(--secondary)}.stat-card-icon.green{background:var(--success-bg);color:var(--success)}.stat-card-icon.yellow{background:var(--warning-bg);color:var(--warning)}.stat-card-info{flex:1}.stat-card-label{font-size:.8rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-weight:500;margin-bottom:4px}.stat-card-value{font-size:1.75rem;font-weight:800;color:var(--text-primary);line-height:1.2}.stat-card-sub{font-size:.75rem;color:var(--text-secondary);margin-top:2px}.scenario-card{position:relative;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--space-lg);cursor:pointer;transition:all var(--transition-base);overflow:hidden}.scenario-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--primary),var(--secondary));opacity:0;transition:opacity var(--transition-base)}.scenario-card:hover{background:var(--bg-card-hover);border-color:var(--border-glow);transform:translateY(-4px);box-shadow:var(--shadow-lg),0 0 20px #00f0ff1a}.scenario-card:hover:before{opacity:1}.scenario-card-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--space-md)}.scenario-card-icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);background:var(--primary-bg);color:var(--primary)}.scenario-card-badge{display:flex;align-items:center;gap:4px;padding:3px 10px;border-radius:var(--radius-full);font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.scenario-card-badge.phishing{background:#f43f5e1f;color:var(--accent)}.scenario-card-badge.scam-calls{background:#f59e0b1f;color:var(--warning)}.scenario-card-badge.malware{background:#ef44441f;color:var(--danger)}.scenario-card-badge.social-engineering{background:#a855f71f;color:var(--secondary)}.scenario-card-title{font-size:1.1rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--space-sm)}.scenario-card-desc{font-size:.85rem;color:var(--text-secondary);line-height:1.5;margin-bottom:var(--space-md)}.scenario-card-footer{display:flex;align-items:center;justify-content:space-between}.scenario-card-difficulty{display:flex;gap:3px}.difficulty-dot{width:8px;height:8px;border-radius:50%;background:var(--border-color)}.difficulty-dot.active{background:var(--primary);box-shadow:0 0 6px var(--primary-glow)}.scenario-card-status{display:flex;align-items:center;gap:4px;font-size:.75rem;font-weight:500}.scenario-card-status.completed{color:var(--success)}.scenario-card-status.new{color:var(--text-muted)}.dashboard{padding:var(--space-2xl) var(--space-lg);max-width:1200px;margin:0 auto}.dashboard-header{margin-bottom:var(--space-2xl);animation:fadeInUp .5s ease}.dashboard-header h1{font-size:2rem;font-weight:800;letter-spacing:-1px;margin-bottom:var(--space-xs)}.dashboard-header p{color:var(--text-secondary);font-size:.95rem}.dashboard-grid{display:grid;grid-template-columns:300px 1fr;gap:var(--space-xl);margin-bottom:var(--space-2xl)}.dashboard-score-panel{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-xl);padding:var(--space-xl);display:flex;flex-direction:column;align-items:center;gap:var(--space-lg);animation:fadeInUp .5s ease .1s both}.score-panel-label{font-size:.8rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;font-weight:600}.level-display{text-align:center}.level-number{font-size:1.4rem;font-weight:800;color:var(--secondary)}.level-label{font-size:.75rem;color:var(--text-muted)}.xp-bar-container{width:100%}.xp-bar-label{display:flex;justify-content:space-between;font-size:.75rem;color:var(--text-muted);margin-bottom:6px}.xp-bar{width:100%;height:8px;background:var(--border-color);border-radius:var(--radius-full);overflow:hidden}.xp-bar-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--secondary));border-radius:var(--radius-full);transition:width 1s ease}.stats-column{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-md);align-content:start;animation:fadeInUp .5s ease .2s both}.category-section{margin-bottom:var(--space-2xl);animation:fadeInUp .5s ease .3s both}.category-section h2{font-size:1.3rem;font-weight:700;margin-bottom:var(--space-lg)}.category-bars{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-md)}.category-bar-item{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:var(--space-md)}.category-bar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm)}.category-bar-name{font-size:.85rem;font-weight:600;display:flex;align-items:center;gap:var(--space-sm)}.category-bar-name svg{opacity:.7}.category-bar-value{font-size:.85rem;font-weight:700;color:var(--primary)}.category-progress{width:100%;height:6px;background:var(--border-color);border-radius:var(--radius-full);overflow:hidden}.category-progress-fill{height:100%;border-radius:var(--radius-full);transition:width 1.5s ease}.category-progress-fill.high{background:var(--success)}.category-progress-fill.medium{background:var(--warning)}.category-progress-fill.low{background:var(--danger)}.recommended{animation:fadeInUp .5s ease .4s both}.recommended h2{font-size:1.3rem;font-weight:700;margin-bottom:var(--space-lg)}.recommended-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-md)}.empty-dashboard{text-align:center;padding:var(--space-3xl);animation:fadeInUp .5s ease}.empty-dashboard svg{color:var(--text-muted);margin-bottom:var(--space-lg)}.empty-dashboard h2{font-size:1.5rem;font-weight:700;margin-bottom:var(--space-sm)}.empty-dashboard p{color:var(--text-secondary);margin-bottom:var(--space-xl)}@media(max-width:768px){.dashboard-grid,.stats-column{grid-template-columns:1fr}}.scenarios-page{padding:var(--space-2xl) var(--space-lg);max-width:1200px;margin:0 auto}.scenarios-header{margin-bottom:var(--space-xl);animation:fadeInUp .5s ease}.scenarios-header h1{font-size:2rem;font-weight:800;letter-spacing:-1px;margin-bottom:var(--space-xs)}.scenarios-header p{color:var(--text-secondary)}.scenarios-filters{display:flex;gap:var(--space-sm);flex-wrap:wrap;margin-bottom:var(--space-xl);animation:fadeInUp .5s ease .1s both}.filter-btn{padding:8px 18px;border-radius:var(--radius-full);background:var(--bg-card);border:1px solid var(--border-color);color:var(--text-secondary);font-size:.82rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;gap:6px}.filter-btn:hover{border-color:var(--primary);color:var(--primary)}.filter-btn.active{background:var(--primary-bg);border-color:var(--primary);color:var(--primary)}.scenarios-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--space-lg)}.scenarios-empty{grid-column:1 / -1;text-align:center;padding:var(--space-3xl);color:var(--text-muted)}@media(max-width:768px){.scenarios-grid{grid-template-columns:1fr}}.feedback-overlay{position:fixed;inset:0;background:var(--bg-overlay);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:var(--space-lg);animation:fadeIn .3s ease}.feedback-modal{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-xl);max-width:520px;width:100%;padding:var(--space-2xl);animation:scaleIn .4s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}.feedback-modal:before{content:"";position:absolute;top:0;left:0;right:0;height:4px}.feedback-modal.correct:before{background:linear-gradient(90deg,var(--success),#34d399)}.feedback-modal.incorrect:before{background:linear-gradient(90deg,var(--danger),var(--warning))}.feedback-icon-wrapper{display:flex;justify-content:center;margin-bottom:var(--space-lg)}.feedback-icon{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center}.feedback-icon.correct{background:var(--success-bg);color:var(--success);box-shadow:0 0 24px var(--success-glow)}.feedback-icon.incorrect{background:var(--danger-bg);color:var(--danger);box-shadow:0 0 24px var(--danger-glow)}.feedback-result{text-align:center;font-size:1.2rem;font-weight:700;margin-bottom:var(--space-sm)}.feedback-result.correct{color:var(--success)}.feedback-result.incorrect{color:var(--danger)}.feedback-text{font-size:.9rem;color:var(--text-secondary);line-height:1.6;text-align:center;margin-bottom:var(--space-lg)}.feedback-tip{background:var(--primary-bg);border:1px solid var(--border-glow);border-radius:var(--radius-md);padding:var(--space-md);margin-bottom:var(--space-lg)}.feedback-tip-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--primary);margin-bottom:var(--space-xs)}.feedback-tip-text{font-size:.85rem;color:var(--text-secondary);line-height:1.5}.feedback-xp{text-align:center;font-size:.85rem;color:var(--warning);font-weight:600;margin-bottom:var(--space-lg)}.feedback-btn{display:block;width:100%;padding:14px;border-radius:var(--radius-md);font-size:.95rem;font-weight:600;border:none;cursor:pointer;transition:all var(--transition-fast)}.feedback-btn.correct{background:var(--success);color:#fff}.feedback-btn.correct:hover{background:#0ea572;box-shadow:0 4px 16px var(--success-glow)}.feedback-btn.incorrect{background:linear-gradient(135deg,var(--primary-dim),var(--primary));color:var(--text-inverse)}.feedback-btn.incorrect:hover{box-shadow:0 4px 16px var(--primary-glow)}.character-panel{display:flex;align-items:flex-start;gap:var(--space-lg);padding:var(--space-lg);background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-xl);margin-bottom:var(--space-lg);animation:slideInLeft .6s ease;position:relative;overflow:hidden}.character-panel:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(180deg,var(--primary),var(--secondary));border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.character-avatar-section{display:flex;flex-direction:column;align-items:center;flex-shrink:0;min-width:120px}.character-avatar-wrapper{position:relative;width:100px;height:100px;margin-bottom:var(--space-sm)}.character-avatar-bg{position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,var(--primary-bg),rgba(168,85,247,.1));border:2px solid var(--border-color);transition:all var(--transition-base)}.character-panel.reaction-relief .character-avatar-bg,.character-panel.reaction-confident .character-avatar-bg{border-color:var(--success);box-shadow:0 0 20px var(--success-glow)}.character-panel.reaction-panic .character-avatar-bg{border-color:var(--danger);box-shadow:0 0 20px var(--danger-glow);animation:avatarShake .5s ease}.character-panel.reaction-confused .character-avatar-bg{border-color:var(--warning);box-shadow:0 0 16px #f59e0b33}@keyframes avatarShake{0%,to{transform:translate(0)}20%{transform:translate(-3px) rotate(-2deg)}40%{transform:translate(3px) rotate(2deg)}60%{transform:translate(-2px) rotate(-1deg)}80%{transform:translate(2px) rotate(1deg)}}.character-avatar-svg{position:relative;z-index:1;width:100px;height:100px}.character-name{font-size:.9rem;font-weight:700;color:var(--text-primary);text-align:center}.character-role{font-size:.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-weight:500;text-align:center}.character-device-icon{display:flex;align-items:center;gap:4px;margin-top:var(--space-xs);font-size:.7rem;color:var(--text-muted)}.character-device-icon svg{opacity:.6}.character-dialogue{flex:1;position:relative;min-height:60px}.dialogue-bubble{position:relative;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:var(--space-md) var(--space-lg);font-size:.9rem;color:var(--text-secondary);line-height:1.6;font-style:italic;animation:dialogueFadeIn .5s ease;transition:all var(--transition-base)}.dialogue-bubble:before{content:"";position:absolute;left:-10px;top:20px;width:0;height:0;border-style:solid;border-width:8px 10px 8px 0;border-color:transparent var(--bg-tertiary) transparent transparent}.dialogue-bubble:after{content:"";position:absolute;left:-12px;top:19px;width:0;height:0;border-style:solid;border-width:9px 11px 9px 0;border-color:transparent var(--border-color) transparent transparent;z-index:-1}@keyframes dialogueFadeIn{0%{opacity:0;transform:translate(10px)}to{opacity:1;transform:translate(0)}}.character-panel.reaction-panic .dialogue-bubble{border-color:#ef44444d;background:#ef44440f}.character-panel.reaction-panic .dialogue-bubble:before{border-color:transparent rgba(239,68,68,.06) transparent transparent}.character-panel.reaction-relief .dialogue-bubble,.character-panel.reaction-confident .dialogue-bubble{border-color:#10b9814d;background:#10b9810f}.character-panel.reaction-relief .dialogue-bubble:before,.character-panel.reaction-confident .dialogue-bubble:before{border-color:transparent rgba(16,185,129,.06) transparent transparent}.character-panel.reaction-confused .dialogue-bubble{border-color:#f59e0b4d;background:#f59e0b0f}.character-panel.reaction-confused .dialogue-bubble:before{border-color:transparent rgba(245,158,11,.06) transparent transparent}.emotion-indicator{display:inline-flex;align-items:center;gap:4px;margin-top:var(--space-sm);padding:3px 10px;border-radius:var(--radius-full);font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;font-style:normal}.emotion-indicator.idle{background:var(--primary-bg);color:var(--primary)}.emotion-indicator.thinking{background:#a855f71f;color:var(--secondary)}.emotion-indicator.confused{background:var(--warning-bg);color:var(--warning)}.emotion-indicator.panic{background:var(--danger-bg);color:var(--danger);animation:pulse 1.5s ease-in-out infinite}.emotion-indicator.relief,.emotion-indicator.confident{background:var(--success-bg);color:var(--success)}@media(max-width:768px){.character-panel{flex-direction:column;align-items:center;text-align:center}.dialogue-bubble:before,.dialogue-bubble:after{display:none}.character-avatar-section{min-width:unset}}.scenario-play{max-width:800px;margin:0 auto;padding:var(--space-2xl) var(--space-lg)}.scenario-play-header{margin-bottom:var(--space-xl);animation:fadeInDown .5s ease}.scenario-play-header .back-link{display:inline-flex;align-items:center;gap:var(--space-xs);color:var(--text-muted);font-size:.85rem;margin-bottom:var(--space-md);cursor:pointer;background:none;border:none;padding:0;transition:color var(--transition-fast)}.scenario-play-header .back-link:hover{color:var(--primary)}.scenario-play-meta{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-sm)}.scenario-play-header h1{font-size:1.7rem;font-weight:800;letter-spacing:-.5px}.scenario-play-progress{display:flex;align-items:center;gap:var(--space-sm);margin-top:var(--space-md)}.progress-bar{flex:1;height:6px;background:var(--border-color);border-radius:var(--radius-full);overflow:hidden}.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--secondary));border-radius:var(--radius-full);transition:width .5s ease}.progress-text{font-size:.75rem;color:var(--text-muted);font-weight:500;white-space:nowrap}.scenario-visual{margin-bottom:var(--space-xl);animation:fadeInUp .5s ease .1s both}.email-visual{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden}.email-toolbar{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:#14143280;border-bottom:1px solid var(--border-color)}.email-dot{width:10px;height:10px;border-radius:50%}.email-dot.red{background:#ff5f57}.email-dot.yellow{background:#febc2e}.email-dot.green{background:#28c840}.email-header-info{padding:var(--space-md);border-bottom:1px solid var(--border-color)}.email-field{display:flex;gap:var(--space-sm);font-size:.82rem;margin-bottom:6px}.email-field-label{color:var(--text-muted);font-weight:500;min-width:55px}.email-field-value{color:var(--text-secondary);word-break:break-all}.email-field-value.suspicious{color:var(--accent)}.email-subject{font-size:1.05rem;font-weight:700;padding:var(--space-md);border-bottom:1px solid var(--border-color)}.email-body{padding:var(--space-lg);font-size:.9rem;color:var(--text-secondary);line-height:1.7;white-space:pre-wrap}.email-fake-btn{display:inline-block;margin-top:var(--space-md);padding:10px 24px;background:var(--danger);color:#fff;border-radius:var(--radius-sm);font-weight:600;font-size:.85rem;cursor:default;opacity:.8}.phone-visual{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-xl);padding:var(--space-xl);text-align:center;max-width:380px;margin:0 auto}.phone-icon-wrapper{width:80px;height:80px;border-radius:50%;background:var(--success-bg);display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-md);animation:pulse 2s ease-in-out infinite}.phone-icon-wrapper svg{color:var(--success)}.phone-caller{font-size:1.2rem;font-weight:700;margin-bottom:4px}.phone-number{font-size:.85rem;color:var(--text-muted);font-family:var(--font-mono);margin-bottom:var(--space-md)}.phone-duration{font-size:.8rem;color:var(--text-muted);margin-bottom:var(--space-lg)}.phone-transcript{background:var(--bg-tertiary);border-radius:var(--radius-md);padding:var(--space-md);font-size:.9rem;color:var(--text-secondary);line-height:1.6;text-align:left;font-style:italic}.chat-visual{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden}.chat-header{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md);background:#14143280;border-bottom:1px solid var(--border-color)}.chat-avatar{width:40px;height:40px;border-radius:50%;background:var(--secondary-glow);display:flex;align-items:center;justify-content:center;color:var(--secondary);font-weight:700;font-size:1rem}.chat-sender-name{font-weight:600;font-size:.9rem}.chat-messages{padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-sm)}.chat-bubble{background:var(--bg-tertiary);border-radius:var(--radius-md);border-top-left-radius:4px;padding:var(--space-sm) var(--space-md);font-size:.88rem;color:var(--text-secondary);line-height:1.5;max-width:85%;animation:fadeInUp .3s ease both}.chat-bubble:nth-child(2){animation-delay:.3s}.chat-bubble:nth-child(3){animation-delay:.6s}.chat-bubble:nth-child(4){animation-delay:.9s}.popup-visual{background:var(--bg-card);border:2px solid var(--danger);border-radius:var(--radius-lg);overflow:hidden;animation:scaleIn .3s ease;box-shadow:0 0 30px var(--danger-glow)}.popup-top-bar{display:flex;align-items:center;justify-content:space-between;padding:var(--space-sm) var(--space-md);background:var(--danger);color:#fff;font-weight:700;font-size:.85rem}.popup-body{padding:var(--space-xl);text-align:center}.popup-body h3{color:var(--danger);font-size:1.3rem;margin-bottom:var(--space-md)}.popup-body p{font-size:.9rem;color:var(--text-secondary);line-height:1.6;margin-bottom:var(--space-md);white-space:pre-wrap}.popup-fake-btn{display:inline-block;padding:12px 32px;background:var(--danger);color:#fff;border-radius:var(--radius-sm);font-weight:700;font-size:.95rem;cursor:default;margin-bottom:var(--space-sm)}.popup-phone{font-size:.85rem;color:var(--text-muted);font-family:var(--font-mono)}.decision-visual{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--space-xl)}.decision-prompt{font-size:.95rem;color:var(--text-secondary);line-height:1.7;white-space:pre-wrap}.scenario-options{display:flex;flex-direction:column;gap:var(--space-md);animation:fadeInUp .5s ease .2s both}.scenario-options h3{font-size:.9rem;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px}.option-btn{display:block;width:100%;text-align:left;padding:var(--space-md) var(--space-lg);background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);font-size:.9rem;line-height:1.5;transition:all var(--transition-fast);cursor:pointer}.option-btn:hover{border-color:var(--primary);background:var(--primary-bg);transform:translate(4px)}.option-btn:active{transform:translate(2px)}.option-btn.selected-correct{border-color:var(--success);background:var(--success-bg);color:var(--success)}.option-btn.selected-incorrect{border-color:var(--danger);background:var(--danger-bg);color:var(--danger)}.option-btn:disabled{cursor:default;opacity:.6}.scenario-summary{text-align:center;animation:fadeInUp .5s ease}.summary-card{background:var(--bg-card);border:1px solid var(--border-glow);border-radius:var(--radius-xl);padding:var(--space-2xl);margin-bottom:var(--space-xl)}.summary-icon{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-lg)}.summary-icon.great{background:var(--success-bg);color:var(--success);box-shadow:0 0 30px var(--success-glow)}.summary-icon.ok{background:var(--warning-bg);color:var(--warning)}.summary-icon.poor{background:var(--danger-bg);color:var(--danger)}.summary-title{font-size:1.5rem;font-weight:800;margin-bottom:var(--space-sm)}.summary-accuracy{font-size:2.5rem;font-weight:900;margin-bottom:var(--space-xs)}.summary-accuracy.great{color:var(--success)}.summary-accuracy.ok{color:var(--warning)}.summary-accuracy.poor{color:var(--danger)}.summary-sub{color:var(--text-secondary);font-size:.9rem;margin-bottom:var(--space-lg)}.summary-stats{display:flex;justify-content:center;gap:var(--space-xl)}.summary-stat{text-align:center}.summary-stat-value{font-size:1.3rem;font-weight:700}.summary-stat-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase}.summary-actions{display:flex;gap:var(--space-md);justify-content:center;flex-wrap:wrap}.sim-cursor{color:var(--primary);font-weight:300;animation:cursorBlink .6s step-end infinite}@keyframes cursorBlink{0%,to{opacity:1}50%{opacity:0}}.sim-entrance{animation:simEntranceFade .6s ease both}@keyframes simEntranceFade{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.sim-field-reveal{animation:simFieldSlide .45s ease both}@keyframes simFieldSlide{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.sim-btn-appear{animation:simBtnPop .4s cubic-bezier(.34,1.56,.64,1) both}@keyframes simBtnPop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.email-toolbar-label{display:inline-flex;align-items:center;gap:4px;margin-left:auto;font-size:.75rem;color:var(--text-muted);opacity:.6}.email-subject-icon{display:inline;vertical-align:middle;margin-right:4px;opacity:.5}.phone-ringing{animation:phoneRing .5s ease-in-out infinite alternate;background:var(--success-bg)!important}@keyframes phoneRing{0%{transform:rotate(-8deg) scale(1)}to{transform:rotate(8deg) scale(1.05)}}.phone-connected{animation:phoneConnectPulse 1.5s ease-in-out infinite;background:var(--primary-bg)!important}.phone-connected svg{color:var(--primary)!important}@keyframes phoneConnectPulse{0%,to{box-shadow:0 0 #00f0ff4d}50%{box-shadow:0 0 0 12px #00f0ff00}}.phone-status-text{font-size:.82rem;font-weight:500;margin-top:var(--space-xs);margin-bottom:var(--space-md)}.phone-ring-text{color:var(--success);animation:pulse 1.2s ease-in-out infinite}.phone-connected-text{color:var(--primary);display:flex;align-items:center;justify-content:center;gap:6px}.connected-dot{width:8px;height:8px;border-radius:50%;background:var(--success);display:inline-block;animation:connectedDotPulse 1.5s ease-in-out infinite}@keyframes connectedDotPulse{0%,to{opacity:1}50%{opacity:.4}}.phone-ring-waves{display:flex;justify-content:center;margin-top:var(--space-sm);position:relative;height:30px}.ring-wave{position:absolute;width:20px;height:20px;border-radius:50%;border:2px solid var(--success);animation:ringWaveExpand 1.5s ease-out infinite}@keyframes ringWaveExpand{0%{width:20px;height:20px;opacity:.8}to{width:80px;height:80px;opacity:0}}.chat-status-online{font-size:.72rem;color:var(--success);display:flex;align-items:center;gap:4px}.online-dot{width:6px;height:6px;border-radius:50%;background:var(--success);display:inline-block}.chat-typing-indicator{display:flex;align-items:center;gap:4px;padding:var(--space-sm) var(--space-md);background:var(--bg-tertiary);border-radius:var(--radius-md);border-top-left-radius:4px;max-width:60px;animation:simFieldSlide .3s ease both}.chat-typing-indicator span{width:6px;height:6px;border-radius:50%;background:var(--text-muted);animation:typingBounce 1.2s ease-in-out infinite}.chat-typing-indicator span:nth-child(2){animation-delay:.15s}.chat-typing-indicator span:nth-child(3){animation-delay:.3s}@keyframes typingBounce{0%,60%,to{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}.sim-bubble-enter{animation:simBubbleSlide .4s ease both!important}@keyframes simBubbleSlide{0%{opacity:0;transform:translateY(8px) translate(-5px)}to{opacity:1;transform:translateY(0) translate(0)}}.sim-popup-entrance{animation:simPopupEntrance .5s cubic-bezier(.34,1.56,.64,1) both}@keyframes simPopupEntrance{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.popup-flash{animation:popupFlashAnim .7s ease-in-out 3}@keyframes popupFlashAnim{0%,to{background:var(--danger)}50%{background:red;box-shadow:0 0 20px #ff000080}}.chat-bubble:nth-child(2){animation-delay:.8s}.chat-bubble:nth-child(3){animation-delay:1.6s}.chat-bubble:nth-child(4){animation-delay:2.4s}.badge-item{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--space-lg);border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-color);transition:all var(--transition-base);position:relative;overflow:hidden}.badge-item.earned{border-color:var(--border-glow);background:var(--bg-card-hover)}.badge-item.earned:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,var(--primary-glow),transparent 70%);opacity:0;animation:badgeGlowPulse 3s ease-in-out infinite}@keyframes badgeGlowPulse{0%,to{opacity:0}50%{opacity:.15}}.badge-item:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}.badge-icon{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:var(--space-md);position:relative;z-index:1}.badge-icon.earned{background:linear-gradient(135deg,var(--primary-bg),rgba(168,85,247,.15));color:var(--primary);box-shadow:0 0 20px var(--primary-glow)}.badge-icon.locked{background:#5a5a8026;color:var(--text-muted)}.badge-name{font-size:.95rem;font-weight:700;color:var(--text-primary);margin-bottom:4px;position:relative;z-index:1}.badge-item.locked .badge-name{color:var(--text-muted)}.badge-desc{font-size:.78rem;color:var(--text-secondary);line-height:1.4;position:relative;z-index:1}.badge-item.locked .badge-desc{color:var(--text-muted)}.badge-earned-tag{display:inline-block;margin-top:var(--space-sm);padding:2px 10px;border-radius:var(--radius-full);background:var(--success-bg);color:var(--success);font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;position:relative;z-index:1}.badge-locked-tag{display:inline-block;margin-top:var(--space-sm);padding:2px 10px;border-radius:var(--radius-full);background:#5a5a801a;color:var(--text-muted);font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;position:relative;z-index:1}.achievements-page{padding:var(--space-2xl) var(--space-lg);max-width:1200px;margin:0 auto}.achievements-header{margin-bottom:var(--space-xl);animation:fadeInUp .5s ease}.achievements-header h1{font-size:2rem;font-weight:800;letter-spacing:-1px;margin-bottom:var(--space-xs)}.achievements-header p{color:var(--text-secondary)}.achievements-summary{display:flex;align-items:center;gap:var(--space-xl);margin-bottom:var(--space-2xl);padding:var(--space-xl);background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);animation:fadeInUp .5s ease .1s both}.achievements-progress-ring{flex-shrink:0}.achievements-progress-info h2{font-size:1.2rem;font-weight:700;margin-bottom:4px}.achievements-progress-info p{font-size:.9rem;color:var(--text-secondary)}.level-section{margin-bottom:var(--space-2xl);animation:fadeInUp .5s ease .15s both}.level-section h2{font-size:1.3rem;font-weight:700;margin-bottom:var(--space-md)}.level-bar-container{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--space-lg)}.level-bar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-md)}.level-bar-current{font-size:1.3rem;font-weight:800;color:var(--secondary)}.level-bar-xp{font-size:.85rem;color:var(--text-muted)}.level-bar{height:12px;background:var(--border-color);border-radius:var(--radius-full);overflow:hidden}.level-bar-fill{height:100%;background:linear-gradient(90deg,var(--secondary-dim),var(--secondary),var(--primary));border-radius:var(--radius-full);transition:width 1.5s ease}.badges-section h2{font-size:1.3rem;font-weight:700;margin-bottom:var(--space-lg)}.badges-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--space-md)}@media(max-width:768px){.achievements-summary{flex-direction:column;text-align:center}.badges-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}}.profile-page{max-width:1200px;margin:0 auto;padding:2rem;animation:fadeUp .4s ease-out}.profile-header{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:2rem;box-shadow:var(--shadow-xl)}.profile-cover{height:150px;background:linear-gradient(135deg,#0fc3,#1e1e1e);position:relative;border-bottom:1px solid var(--border-color)}.profile-info-container{display:flex;padding:0 2rem 2rem;align-items:flex-end;margin-top:-50px;gap:1.5rem;position:relative;z-index:10}.profile-avatar{width:100px;height:100px;background:var(--bg-hover);border:4px solid var(--bg-card);border-radius:var(--radius-round);display:flex;justify-content:center;align-items:center;overflow:hidden;color:var(--primary);box-shadow:0 4px 12px #0003;z-index:10;position:relative}.avatar-edit-overlay{position:absolute;bottom:0;left:0;right:0;background:#000000b3;color:#fff;display:flex;align-items:center;justify-content:center;padding:.4rem}.profile-avatar img{width:100%;height:100%;object-fit:cover}.profile-details{padding-bottom:.5rem;flex:1;position:relative;z-index:11}.profile-details h1{font-size:2rem;color:var(--text-primary);margin-bottom:.5rem;text-transform:capitalize}.profile-meta{display:flex;gap:1.5rem;color:var(--text-secondary);font-size:.95rem;align-items:center}.profile-email,.profile-rank{display:flex;align-items:center;gap:8px}.profile-rank{font-weight:600;padding:.2rem .6rem;border-radius:var(--radius-md);border:1px solid;background:#0003}.profile-grid{display:grid;grid-template-columns:1fr 2fr;gap:2rem}.profile-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1.5rem;margin-bottom:2rem;box-shadow:var(--shadow-sm)}.profile-card h3{font-size:1.25rem;color:var(--text-primary);margin-bottom:1.5rem;border-bottom:1px solid var(--border-color);padding-bottom:.75rem}.card-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-color);margin-bottom:1.5rem}.card-header h3{border-bottom:none;margin-bottom:0;padding-bottom:.75rem}.view-all{color:var(--primary);font-size:.9rem;display:flex;align-items:center;gap:4px;padding-bottom:.75rem}.view-all:hover{text-decoration:underline}.stat-row,.detail-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem 0;border-bottom:1px dashed rgba(255,255,255,.05)}.stat-row:last-child,.detail-item:last-child{border-bottom:none}.stat-label,.detail-label{color:var(--text-secondary);font-size:.95rem}.stat-value{color:var(--text-primary);font-weight:600;font-size:1.1rem}.stat-value.highlight{color:var(--primary)}.detail-value{color:var(--text-primary);font-size:.95rem}.profile-action{margin-top:1.5rem}.profile-action .btn-outline{width:100%;justify-content:center}.activity-list{display:flex;flex-direction:column;gap:1rem}.activity-item{display:flex;align-items:center;gap:1rem;background:var(--bg-hover);padding:1rem;border-radius:var(--radius-md);border:1px solid transparent;transition:var(--transition-colors)}.activity-item:hover{border-color:#0fc3;transform:translateY(-2px)}.activity-icon{background:#00ffcc1a;color:var(--primary);padding:.75rem;border-radius:var(--radius-md)}.activity-content{flex:1}.activity-content h4{margin:0 0 .25rem;color:var(--text-primary);font-size:1rem;text-transform:capitalize}.activity-category{font-size:.85rem;color:var(--text-muted);background:#ffffff0d;padding:.15rem .5rem;border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.5px}.activity-result{text-align:right}.accuracy{font-weight:600;font-size:.95rem;margin-bottom:.2rem;color:var(--text-secondary)}.date{font-size:.8rem;color:var(--text-muted)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;text-align:center;color:var(--text-muted);background:#ffffff05;border-radius:var(--radius-md);border:1px dashed rgba(255,255,255,.1)}.empty-state svg{margin-bottom:1rem;opacity:.5}.badges-grid-small{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.badge-item-small{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-align:center}.badge-icon-small{width:60px;height:60px;background:#ff00ff1a;color:var(--accent-pink);border:1px solid rgba(255,0,255,.2);border-radius:var(--radius-round);display:flex;align-items:center;justify-content:center}.badge-name{font-size:.75rem;color:var(--text-secondary);text-transform:capitalize}@media(max-width:768px){.profile-grid{grid-template-columns:1fr}.profile-info-container{flex-direction:column;align-items:center;text-align:center;padding:0 1.5rem 1.5rem;margin-top:-60px}.profile-meta{flex-direction:column;gap:.5rem}.badges-grid-small{grid-template-columns:repeat(2,1fr)}.profile-name-row{flex-direction:column;gap:.5rem}.profile-edit-form{align-items:center}}.profile-name-row{display:flex;align-items:center;gap:1rem;margin-bottom:.5rem}.edit-profile-btn{display:flex;align-items:center;gap:.4rem;background:#00ffcc1a;color:var(--primary);border:1px solid rgba(0,255,204,.3);border-radius:var(--radius-md);padding:.4rem .8rem;font-size:.85rem;cursor:pointer;transition:all .2s ease;white-space:nowrap}.edit-profile-btn:hover{background:#0fc3;border-color:var(--primary)}.profile-edit-form{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:400px}.edit-field label{display:block;font-size:.8rem;color:var(--text-muted);margin-bottom:.3rem;text-transform:uppercase;letter-spacing:.5px}.edit-field input{width:100%;padding:.6rem .8rem;background:var(--bg-hover);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-primary);font-size:.95rem;transition:all .2s ease}.edit-field input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px #0fc3}.edit-field input::placeholder{color:var(--text-muted)}.edit-actions{display:flex;gap:.75rem;margin-top:.25rem}.save-btn,.cancel-btn{display:flex;align-items:center;gap:.4rem;padding:.5rem 1rem;font-size:.9rem;cursor:pointer}.save-status{font-size:.85rem;padding:.4rem .8rem;border-radius:var(--radius-md);margin-top:.25rem}.save-status.success{color:#0f8;background:#00ff881a;border:1px solid rgba(0,255,136,.2)}.save-status.error{color:#ff5252;background:#ff3b301a;border:1px solid rgba(255,59,48,.2)}.leaderboard-page{max-width:1000px;margin:0 auto;padding:2rem;animation:fadeUp .4s ease-out}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.leaderboard-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:40vh;color:var(--primary);gap:1rem}.leaderboard-loading p{color:var(--text-secondary);font-size:1.1rem}.leaderboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.leaderboard-title{display:flex;align-items:center;gap:1rem;color:var(--primary)}.leaderboard-title h1{font-size:2rem;color:var(--text-primary);margin:0}.leaderboard-title p{color:var(--text-secondary);font-size:.9rem;margin:0}.refresh-btn{padding:.5rem 1rem;font-size:.85rem}.leaderboard-error{background:#ffb3001a;border:1px solid rgba(255,179,0,.3);border-radius:var(--radius-md);padding:1rem;margin-bottom:1.5rem;text-align:center}.leaderboard-error p{color:#ffb300;margin:0 0 .25rem;font-weight:500}.leaderboard-error small{color:var(--text-muted);font-size:.8rem}.rules-fix{margin-top:.75rem;text-align:left}.rules-fix pre{background:#0006;border:1px solid var(--border-color);border-radius:var(--radius-md);padding:.75rem 1rem;margin:.5rem 0;font-size:.8rem;color:var(--primary);overflow-x:auto;white-space:pre}.rules-fix strong{color:var(--text-primary)}.podium{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-bottom:2.5rem}.podium-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1.5rem;text-align:center;position:relative;transition:all .3s ease;box-shadow:var(--shadow-sm)}.podium-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl)}.podium-card.rank-gold{border-color:#ffd70066;background:linear-gradient(135deg,var(--bg-card) 0%,rgba(255,215,0,.06) 100%)}.podium-card.rank-silver{border-color:#c0c0c066;background:linear-gradient(135deg,var(--bg-card) 0%,rgba(192,192,192,.06) 100%)}.podium-card.rank-bronze{border-color:#cd7f3266;background:linear-gradient(135deg,var(--bg-card) 0%,rgba(205,127,50,.06) 100%)}.podium-card.is-you{box-shadow:0 0 20px #00ffcc26;border-color:#0fc6}.podium-rank{margin-bottom:.75rem}.rank-icon.gold{color:gold}.rank-icon.silver{color:silver}.rank-icon.bronze{color:#cd7f32}.podium-avatar{width:64px;height:64px;border-radius:var(--radius-round);background:var(--bg-hover);display:flex;align-items:center;justify-content:center;margin:0 auto .75rem;overflow:hidden;color:var(--primary);border:2px solid var(--border-color)}.podium-avatar img{width:100%;height:100%;object-fit:cover}.podium-name{font-size:1.1rem;color:var(--text-primary);margin:0 0 .5rem;text-transform:capitalize}.podium-score{display:flex;align-items:center;justify-content:center;gap:.4rem;color:var(--primary);font-weight:700;font-size:1.2rem;margin-bottom:.3rem}.podium-stats{display:flex;align-items:center;justify-content:center;gap:.5rem;color:var(--text-muted);font-size:.8rem}.you-badge{position:absolute;top:.75rem;right:.75rem;background:var(--primary);color:var(--bg-primary);font-size:.7rem;font-weight:700;padding:.2rem .5rem;border-radius:var(--radius-sm);text-transform:uppercase}.leaderboard-table-container{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm)}.leaderboard-table{width:100%;border-collapse:collapse}.leaderboard-table th{background:#00ffcc0d;color:var(--text-secondary);font-size:.8rem;text-transform:uppercase;letter-spacing:.5px;padding:.75rem 1rem;text-align:left;border-bottom:1px solid var(--border-color)}.leaderboard-table td{padding:.85rem 1rem;color:var(--text-primary);font-size:.95rem;border-bottom:1px solid rgba(255,255,255,.04)}.leaderboard-table tbody tr{transition:background .2s}.leaderboard-table tbody tr:hover{background:#00ffcc08}.leaderboard-table tbody tr.is-you{background:#00ffcc0f}.leaderboard-table tbody tr.rank-gold .score-cell{color:gold;font-weight:700}.leaderboard-table tbody tr.rank-silver .score-cell{color:silver;font-weight:700}.leaderboard-table tbody tr.rank-bronze .score-cell{color:#cd7f32;font-weight:700}.rank-cell{width:60px;text-align:center}.rank-number{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;background:var(--bg-hover);border-radius:var(--radius-round);font-size:.85rem;font-weight:600;color:var(--text-secondary)}.player-cell{min-width:200px}.player-info{display:flex;align-items:center;gap:.6rem}.player-avatar-small{width:32px;height:32px;border-radius:var(--radius-round);background:var(--bg-hover);display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--primary);flex-shrink:0}.player-avatar-small img{width:100%;height:100%;object-fit:cover}.you-tag{background:var(--primary);color:var(--bg-primary);font-size:.65rem;font-weight:700;padding:.15rem .4rem;border-radius:var(--radius-sm);text-transform:uppercase}.score-cell{color:var(--primary);font-weight:600}.leaderboard-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:40vh;text-align:center;color:var(--text-muted);gap:.5rem}.leaderboard-empty h3{color:var(--text-primary);font-size:1.5rem;margin:0}.leaderboard-empty p{color:var(--text-secondary)}@media(max-width:768px){.podium{grid-template-columns:1fr}.leaderboard-header{flex-direction:column;gap:1rem;align-items:flex-start}.leaderboard-table-container{overflow-x:auto}}.settings-page{padding:var(--space-2xl) var(--space-lg);max-width:700px;margin:0 auto}.settings-header{margin-bottom:var(--space-xl);animation:fadeInUp .5s ease}.settings-header h1{font-size:2rem;font-weight:800;letter-spacing:-1px;margin-bottom:var(--space-xs)}.settings-header p{color:var(--text-secondary)}.settings-section{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--space-xl);margin-bottom:var(--space-lg);animation:fadeInUp .5s ease .1s both}.settings-section h2{font-size:1.1rem;font-weight:700;margin-bottom:var(--space-lg);display:flex;align-items:center;gap:var(--space-sm);color:var(--text-primary)}.settings-section h2 svg{color:var(--primary)}.setting-item{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) 0;border-bottom:1px solid var(--border-color)}.setting-item:last-child{border-bottom:none}.setting-info{flex:1}.setting-label{font-size:.95rem;font-weight:600;margin-bottom:2px}.setting-desc{font-size:.8rem;color:var(--text-muted)}.toggle-switch{position:relative;width:52px;height:28px;flex-shrink:0;margin-left:var(--space-md)}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;inset:0;background:var(--border-color);border-radius:var(--radius-full);transition:all var(--transition-base)}.toggle-slider:before{content:"";position:absolute;height:22px;width:22px;left:3px;bottom:3px;background:var(--text-primary);border-radius:50%;transition:all var(--transition-base)}.toggle-switch input:checked+.toggle-slider{background:var(--primary);box-shadow:0 0 10px var(--primary-glow)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(24px);background:var(--text-inverse)}.toggle-switch input:focus-visible+.toggle-slider{outline:2px solid var(--primary);outline-offset:2px}.danger-section{border-color:#ef444433}.danger-section h2{color:var(--danger)}.danger-section h2 svg{color:var(--danger)}.reset-btn{padding:10px 24px;border-radius:var(--radius-md);background:transparent;border:1px solid var(--danger);color:var(--danger);font-size:.85rem;font-weight:600;cursor:pointer;transition:all var(--transition-fast);flex-shrink:0}.reset-btn:hover{background:var(--danger-bg)}.about-section p{font-size:.85rem;color:var(--text-secondary);line-height:1.6;margin-bottom:var(--space-sm)}.about-version{font-family:var(--font-mono);font-size:.8rem;color:var(--text-muted)}.app{min-height:100vh;display:flex;flex-direction:column}.app-main{flex:1}
