@keyframes neonPulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes glowPulse{0%,to{box-shadow:0 0 5px #00f0ff33}50%{box-shadow:0 0 20px #00f0ff66}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes countdownFlash{0%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}to{transform:scale(1);opacity:1}}@keyframes scanLine{0%{top:0}to{top:100%}}@keyframes borderFlow{0%{background-position:0% 50%}to{background-position:200% 50%}}@keyframes hitMarker{0%{transform:scale(.5);opacity:1}to{transform:scale(2);opacity:0}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@keyframes glitch{0%,to{transform:translate(0);text-shadow:-2px 0 #00f0ff,2px 0 #a855f7}20%{transform:translate(-2px,2px);text-shadow:2px -1px #00f0ff,-3px 1px #a855f7}40%{transform:translate(2px,-1px);text-shadow:-1px 2px #00f0ff,1px -2px #a855f7}60%{transform:translate(-1px,1px);text-shadow:3px 0 #00f0ff,-2px -1px #a855f7}80%{transform:translate(1px,-2px);text-shadow:-2px 1px #00f0ff,2px 2px #a855f7}}@keyframes glitchSlice{0%,to{clip-path:inset(0 0 0 0)}5%{clip-path:inset(20% 0 60% 0)}10%{clip-path:inset(0 0 0 0)}15%{clip-path:inset(60% 0 10% 0)}20%{clip-path:inset(0 0 0 0)}}@keyframes borderGradientFlow{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes scanLineVertical{0%{transform:translateY(-100%)}to{transform:translateY(100vh)}}@keyframes hexFloat{0%,to{transform:translateY(0) rotate(0);opacity:.03}50%{transform:translateY(-20px) rotate(30deg);opacity:.06}}@keyframes cornerPulse{0%,to{opacity:.6}50%{opacity:1}}@keyframes typewriter{0%{width:0}to{width:100%}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes dataStream{0%{transform:translateY(-100%);opacity:0}10%{opacity:.6}90%{opacity:.6}to{transform:translateY(100vh);opacity:0}}@keyframes revealScore{0%{transform:scale(.3);opacity:0;filter:blur(20px)}60%{transform:scale(1.1);opacity:1;filter:blur(0)}to{transform:scale(1);opacity:1;filter:blur(0)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-fade-in{animation:fadeIn .3s ease}.animate-fade-in-up{animation:fadeInUp .4s ease both}.animate-scale-in{animation:scaleIn .3s ease}.animate-pulse{animation:neonPulse 2s ease-in-out infinite}.animate-glitch{animation:glitch 3s ease-in-out infinite}.animate-reveal-score{animation:revealScore .6s cubic-bezier(.34,1.56,.64,1) both}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden}body{font-family:Inter,PingFang SC,Microsoft YaHei,sans-serif;font-size:16px;color:#f1f5f9;background:#0a0e17;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{width:100%;height:100%;position:relative}#app:before{content:"";position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");pointer-events:none;z-index:9999;opacity:.4}#app:after{content:"";position:fixed;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(0,240,255,.15),transparent);animation:scanLineVertical 8s linear infinite;pointer-events:none;z-index:9998}a{color:#00f0ff;text-decoration:none}.es-btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 32px;font-family:Inter,PingFang SC,Microsoft YaHei,sans-serif;font-size:18px;font-weight:600;color:#f1f5f9;background:linear-gradient(135deg,#00f0ff14,#a855f714);border:1px solid rgba(0,240,255,.25);border-radius:0;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));cursor:pointer;transition:all .3s ease;-webkit-user-select:none;user-select:none;letter-spacing:1px;position:relative;text-transform:uppercase;font-size:16px}.es-btn:hover{background:linear-gradient(135deg,#00f0ff26,#a855f726);box-shadow:0 0 20px #00f0ff26,inset 0 0 30px #00f0ff0d;transform:translateY(-1px);color:#00f0ff}.es-btn:active{transform:translateY(0);box-shadow:none}.es-btn--primary{background:linear-gradient(135deg,#00f0ff,#3b82f6);border-color:#00f0ff;color:#0a0e17;font-weight:700}.es-btn--primary:hover{box-shadow:0 0 30px #00f0ff4d,0 0 60px #00f0ff33;background:linear-gradient(135deg,#1affff,#3d8bff);color:#0a0e17}.es-btn--danger{border-color:#ef44444d;background:linear-gradient(135deg,#ef44441a,#ef44440d)}.es-btn--danger:hover{border-color:#ef4444;box-shadow:0 0 20px #ef44444d}.es-btn--success{border-color:#10b9814d;background:linear-gradient(135deg,#10b9811a,#10b9810d)}.es-btn--success:hover{border-color:#10b981;box-shadow:0 0 20px #10b9814d}.es-btn--lg{padding:16px 48px;font-size:18px;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}.es-btn--sm{padding:8px 20px;font-size:14px;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}.es-btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important;box-shadow:none!important}.es-card{background:#0f1923;border:1px solid rgba(255,255,255,.08);border-radius:4px;padding:24px;transition:border-color .3s ease,box-shadow .3s ease;position:relative}.es-card:before{content:"";position:absolute;top:-1px;left:-1px;width:20px;height:20px;border-top:2px solid #00f0ff;border-left:2px solid #00f0ff;opacity:.5;transition:opacity .15s ease}.es-card:after{content:"";position:absolute;bottom:-1px;right:-1px;width:20px;height:20px;border-bottom:2px solid #00f0ff;border-right:2px solid #00f0ff;opacity:.5;transition:opacity .15s ease}.es-card:hover{border-color:#00f0ff4d}.es-card:hover:before,.es-card:hover:after{opacity:1}.es-card--glow{border-color:#00f0ff4d;box-shadow:0 0 20px #00f0ff26}.es-timer{font-family:JetBrains Mono,Courier New,monospace;font-size:30px;color:#00f0ff;text-shadow:0 0 10px rgba(0,240,255,.5),0 0 40px rgba(0,240,255,.15);letter-spacing:2px}.es-score{font-family:Orbitron,Inter,sans-serif;font-size:48px;font-weight:900;background:linear-gradient(135deg,#00f0ff,#3b82f6,#a855f7);background-size:200% 200%;animation:borderGradientFlow 3s ease infinite;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 20px rgba(0,240,255,.3))}.es-progress{width:100%;height:4px;background:#1a2332;border-radius:9999px;overflow:hidden;position:relative}.es-progress__bar{height:100%;background:linear-gradient(90deg,#00f0ff,#a855f7);border-radius:9999px;transition:width .3s ease;position:relative}.es-progress__bar:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.3) 50%,transparent 100%);background-size:200% 100%;animation:shimmer 2s ease-in-out infinite}.es-tag{display:inline-flex;align-items:center;padding:4px 12px;font-size:12px;font-weight:600;border-radius:0;letter-spacing:.5px;text-transform:uppercase;clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,6px 100%,0 calc(100% - 6px))}.es-tag--cyan{color:#00f0ff;background:#00f0ff1f;border-left:2px solid #00f0ff}.es-tag--purple{color:#a855f7;background:#a855f71f;border-left:2px solid #a855f7}.es-tag--green{color:#10b981;background:#10b9811f;border-left:2px solid #10b981}.es-tag--red{color:#ef4444;background:#ef44441f;border-left:2px solid #ef4444}.es-tag--yellow{color:#f59e0b;background:#f59e0b1f;border-left:2px solid #f59e0b}.es-grid{display:grid;gap:4px}.es-grid__cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:#1a2332;border:1px solid rgba(255,255,255,.08);border-radius:4px;font-family:JetBrains Mono,Courier New,monospace;font-size:20px;font-weight:700;color:#f1f5f9;cursor:pointer;transition:all .15s ease;-webkit-user-select:none;user-select:none}.es-grid__cell:hover{border-color:#00f0ff4d;background:#00f0ff0d}.es-grid__cell--active{background:#00f0ff26;border-color:#00f0ff;box-shadow:inset 0 0 10px #00f0ff1a}.es-grid__cell--correct{background:#10b98133;border-color:#10b981;color:#10b981}.es-grid__cell--wrong{background:#ef444433;border-color:#ef4444;color:#ef4444;animation:shake .3s ease}.es-grid__cell--disabled{opacity:.3;cursor:not-allowed}.es-countdown{font-family:Orbitron,Inter,sans-serif;font-size:120px;font-weight:900;color:#00f0ff;text-shadow:0 0 40px rgba(0,240,255,.5),0 0 80px rgba(0,240,255,.2);animation:countdownFlash 1s ease}.es-overlay{position:fixed;inset:0;background:#0a0e17e6;display:flex;align-items:center;justify-content:center;z-index:100}.es-scanline{position:relative;overflow:hidden}.es-scanline:after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(0,240,255,.3),transparent);animation:scanLine 4s linear infinite;pointer-events:none}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#00f0ff26;border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:#00f0ff4d}::selection{background:#00f0ff33;color:#f1f5f9}
