:root{--primary-color: #667eea;--secondary-color: #764ba2;--accent-color: #f093fb;--success-color: #4ade80;--warning-color: #fbbf24;--error-color: #f87171;--text-color: #ffffff;--text-secondary: rgba(255, 255, 255, .8);--panel-bg: rgba(20, 20, 35, .85);--panel-glass: rgba(255, 255, 255, .05);--border-color: rgba(139, 92, 246, .3);--border-glow: rgba(139, 92, 246, .6);--shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--shadow-md: 0 4px 16px rgba(0, 0, 0, .2);--shadow-lg: 0 10px 40px rgba(0, 0, 0, .3);--shadow-glow: 0 0 30px rgba(139, 92, 246, .4);--transition-fast: .2s;--transition-base: .3s;--transition-slow: .5s}*{box-sizing:border-box}body{margin:0;padding:0;background:linear-gradient(135deg,#0f0c29,#302b63,#24243e);font-family:Microsoft YaHei,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--text-color);overflow:hidden;position:relative}body:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 80%,rgba(139,92,246,.15) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(244,114,182,.15) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(59,130,246,.1) 0%,transparent 50%);animation:backgroundPulse 20s ease-in-out infinite;pointer-events:none}@keyframes backgroundPulse{0%,to{opacity:1}50%{opacity:.7}}#app{position:relative;width:100vw;height:100vh}#three-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}#controls{position:absolute;top:20px;left:20px;z-index:10;display:flex;flex-direction:column;gap:20px}.control-panel,.info-panel{background:linear-gradient(135deg,var(--panel-bg),var(--panel-glass));border:1px solid var(--border-color);border-radius:20px;padding:24px;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:var(--shadow-lg),inset 0 1px #ffffff1a;min-width:280px;position:relative;overflow:hidden;animation:panelFadeIn .5s ease-out}.control-panel:before,.info-panel:before{content:"";position:absolute;inset:-2px;background:linear-gradient(45deg,var(--primary-color),var(--secondary-color),var(--accent-color));border-radius:20px;opacity:0;z-index:-1;transition:opacity var(--transition-base)}.control-panel:hover:before,.info-panel:hover:before{opacity:.3;animation:borderGlow 3s linear infinite}@keyframes panelFadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes borderGlow{0%,to{opacity:.3}50%{opacity:.6}}.control-panel h2,.info-panel h3{margin:0 0 20px;background:linear-gradient(135deg,var(--primary-color),var(--accent-color));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:20px;font-weight:700;letter-spacing:.5px;position:relative;display:inline-block}.control-panel h2:after,.info-panel h3:after{content:"";position:absolute;bottom:-8px;left:0;width:100%;height:2px;background:linear-gradient(90deg,var(--primary-color),var(--accent-color));border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform var(--transition-base)}.control-panel:hover h2:after,.info-panel:hover h3:after{transform:scaleX(1)}.control-btn{width:100%;padding:14px 20px;margin:10px 0;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;border:none;border-radius:12px;font-size:15px;font-weight:600;cursor:pointer;transition:all var(--transition-base) cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:.5px;box-shadow:var(--shadow-md)}.control-btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff80;transform:translate(-50%,-50%);transition:width .6s,height .6s}.control-btn:active:before{width:300px;height:300px}.control-btn:after{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,.1) 50%,transparent 70%);transform:rotate(45deg);transition:transform .6s}.control-btn:hover:not(:disabled){transform:translateY(-3px) scale(1.02);box-shadow:0 10px 30px #8b5cf666,var(--shadow-glow)}.control-btn:hover:not(:disabled):after{transform:rotate(45deg) translate(100%,100%)}.control-btn:disabled{background:linear-gradient(135deg,#6464784d,#5050644d);cursor:not-allowed;transform:none;opacity:.6}.control-btn:active:not(:disabled){transform:translateY(-1px) scale(1.01)}#status-display{background:linear-gradient(135deg,#ffffff0d,#ffffff05);padding:16px;border-radius:12px;border-left:4px solid;border-image:linear-gradient(135deg,var(--primary-color),var(--accent-color)) 1;font-size:14px;line-height:1.6;min-height:70px;position:relative;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 2px 10px #0000001a;animation:statusPulse 2s ease-in-out infinite}@keyframes statusPulse{0%,to{box-shadow:inset 0 2px 10px #0000001a}50%{box-shadow:inset 0 2px 10px #0000001a,inset 0 0 20px #8b5cf61a}}.status-indicator{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:10px;position:relative;box-shadow:0 0 10px currentColor}.status-indicator:before{content:"";position:absolute;inset:-4px;border-radius:50%;background:inherit;opacity:.4;animation:statusRipple 2s ease-out infinite}.status-idle{background:var(--warning-color);animation:statusBlink 3s ease-in-out infinite}.status-working{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));animation:statusRotate 2s linear infinite}.status-error{background:var(--error-color);animation:statusShake .5s ease-in-out infinite}.status-success{background:var(--success-color);animation:statusBounce 1s ease-in-out}@keyframes statusRipple{0%{transform:scale(1);opacity:.4}to{transform:scale(2);opacity:0}}@keyframes statusBlink{0%,to{opacity:1}50%{opacity:.3}}@keyframes statusRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes statusShake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}@keyframes statusBounce{0%,to{transform:translateY(0)}25%{transform:translateY(-4px)}50%{transform:translateY(0)}75%{transform:translateY(-2px)}}@media (max-width: 768px){#controls{top:10px;left:10px;right:10px}.control-panel,.info-panel{min-width:auto;padding:15px}}.help-btn{background:linear-gradient(135deg,#10b981,#34d399)!important;margin-top:15px;position:relative}.help-btn:before{content:"?";position:absolute;right:15px;top:50%;transform:translateY(-50%);font-size:18px;font-weight:700;opacity:.8}.help-btn:hover:not(:disabled){background:linear-gradient(135deg,#059669,#10b981)!important;box-shadow:0 10px 30px #10b98166,0 0 40px #10b9814d}#inject-error:not(:disabled){background:linear-gradient(135deg,#ef4444,#f87171)!important;animation:dangerPulse 2s ease-in-out infinite}#inject-error:hover:not(:disabled){background:linear-gradient(135deg,#dc2626,#ef4444)!important;box-shadow:0 10px 30px #ef444466,0 0 40px #ef44444d}@keyframes dangerPulse{0%,to{box-shadow:var(--shadow-md)}50%{box-shadow:var(--shadow-md),0 0 20px #ef44444d}}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(ellipse at center,#000000e6,#000000f2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1000;display:flex;justify-content:center;align-items:center;transition:all var(--transition-base) cubic-bezier(.4,0,.2,1)}.modal.hidden{opacity:0;visibility:hidden;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}.modal-content{background:linear-gradient(135deg,var(--panel-bg),rgba(30,30,50,.95));border:1px solid var(--border-glow);border-radius:24px;-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);box-shadow:0 25px 70px #000000b3,0 0 80px #8b5cf633,inset 0 1px #ffffff1a;max-width:650px;max-height:85vh;width:90%;overflow:hidden;transform:scale(.8) translateY(20px);transition:all var(--transition-base) cubic-bezier(.4,0,.2,1);position:relative}.modal-content:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(139,92,246,.8),transparent);animation:modalGlow 3s linear infinite}@keyframes modalGlow{0%,to{transform:translate(-100%)}50%{transform:translate(100%)}}.modal:not(.hidden) .modal-content{transform:scale(1) translateY(0)}.modal-header{padding:24px 28px;border-bottom:1px solid rgba(139,92,246,.2);display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,rgba(139,92,246,.1),transparent)}.modal-header h2{margin:0;background:linear-gradient(135deg,var(--primary-color),var(--accent-color));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:24px;font-weight:700;letter-spacing:1px}.close-btn{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:var(--text-color);font-size:24px;cursor:pointer;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all var(--transition-fast) ease}.close-btn:hover{background:#ef444433;border-color:#ef444466;transform:rotate(90deg) scale(1.1);color:#ef4444}.modal-body{padding:25px;max-height:60vh;overflow-y:auto}.help-section{margin-bottom:25px}.help-section:last-child{margin-bottom:0}.help-section h3{background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0 0 16px;font-size:18px;font-weight:600;display:flex;align-items:center;gap:10px}.help-section h3:before{content:"▶";color:var(--accent-color);font-size:12px;animation:arrowPulse 2s ease-in-out infinite}@keyframes arrowPulse{0%,to{transform:translate(0)}50%{transform:translate(3px)}}.help-section p{margin:0 0 10px;line-height:1.6;color:#ffffffe6}.help-section ul,.help-section ol{margin:10px 0;padding-left:20px;color:#ffffffe6}.help-section li{margin:8px 0;line-height:1.5}.help-section li strong{color:var(--secondary-color)}.bg-decoration{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}.grid-lines{position:absolute;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(rgba(139,92,246,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(139,92,246,.05) 1px,transparent 1px);background-size:50px 50px;animation:gridMove 20s linear infinite}@keyframes gridMove{0%{transform:translate(0)}to{transform:translate(50px,50px)}}.floating-particles{position:absolute;top:0;left:0;width:100%;height:100%}.particle{position:absolute;width:4px;height:4px;background:linear-gradient(135deg,var(--primary-color),var(--accent-color));border-radius:50%;opacity:.6;animation:float 15s infinite ease-in-out;box-shadow:0 0 10px currentColor}.particle:nth-child(1){top:10%;left:20%;animation-delay:0s;animation-duration:13s}.particle:nth-child(2){top:80%;left:80%;animation-delay:2s;animation-duration:17s}.particle:nth-child(3){top:40%;left:60%;animation-delay:4s;animation-duration:20s}.particle:nth-child(4){top:60%;left:30%;animation-delay:6s;animation-duration:15s}.particle:nth-child(5){top:30%;left:90%;animation-delay:8s;animation-duration:18s}@keyframes float{0%,to{transform:translateY(0) translate(0)}25%{transform:translateY(-30px) translate(20px)}50%{transform:translateY(20px) translate(-10px)}75%{transform:translateY(-10px) translate(30px)}}.panel-header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.panel-icon{font-size:24px;filter:drop-shadow(0 0 10px rgba(139,92,246,.5));animation:iconFloat 3s ease-in-out infinite}@keyframes iconFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.btn-group{display:flex;flex-direction:column;gap:8px}.control-btn{display:flex;align-items:center;justify-content:center;gap:10px}.btn-icon{font-size:18px;display:inline-flex;align-items:center;justify-content:center;filter:drop-shadow(0 0 5px rgba(255,255,255,.5))}.btn-text{flex:1;text-align:center}.danger-btn:not(:disabled){background:linear-gradient(135deg,#ef4444,#f87171)!important}.status-content{display:flex;flex-direction:column;gap:8px}.status-content strong{font-size:16px;color:var(--text-color)}.status-message{margin:0;font-size:13px;color:var(--text-secondary);opacity:.9}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px;padding-top:16px;border-top:1px solid rgba(139,92,246,.2)}.stat-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px;background:linear-gradient(135deg,#ffffff08,#ffffff03);border-radius:12px;border:1px solid rgba(139,92,246,.1);transition:all var(--transition-fast)}.stat-item:hover{background:linear-gradient(135deg,#8b5cf61a,#8b5cf60d);border-color:#8b5cf64d;transform:translateY(-2px)}.stat-icon{font-size:20px;filter:drop-shadow(0 0 8px currentColor)}.stat-value{font-size:24px;font-weight:700;background:linear-gradient(135deg,var(--primary-color),var(--accent-color));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:statPulse 2s ease-in-out infinite}@keyframes statPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.stat-label{font-size:12px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.modal-glow{position:absolute;top:-100px;left:50%;transform:translate(-50%);width:200px;height:200px;background:radial-gradient(circle,rgba(139,92,246,.3),transparent);filter:blur(60px);animation:modalGlowPulse 4s ease-in-out infinite}@keyframes modalGlowPulse{0%,to{opacity:.5}50%{opacity:1}}.modal-title{display:flex;align-items:center;gap:12px}.modal-icon{font-size:28px;animation:modalIconRotate 10s linear infinite}@keyframes modalIconRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.help-list{list-style:none;padding:0}.help-list li{display:flex;align-items:flex-start;gap:12px;padding:12px;margin:8px 0;background:#8b5cf60d;border-radius:8px;border-left:3px solid var(--primary-color);transition:all var(--transition-fast)}.help-list li:hover{background:#8b5cf61a;transform:translate(5px)}.list-icon{color:var(--accent-color);font-size:16px;margin-top:2px}.section-icon{display:inline-block;margin-right:8px;animation:sectionIconBounce 2s ease-in-out infinite}@keyframes sectionIconBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}.process-list{list-style:none;padding:0;counter-reset:step-counter}.process-list li{display:flex;align-items:center;gap:12px;margin:8px 0;background:linear-gradient(135deg,rgba(255,255,255,.02),transparent);border-radius:8px;position:relative;padding:10px 10px 10px 16px;transition:all var(--transition-fast)}.process-list li:hover{background:#8b5cf614;transform:translate(5px)}.step-number{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));color:#fff;border-radius:50%;font-size:12px;font-weight:700;flex-shrink:0}.help-footer{margin-top:24px;padding-top:16px;border-top:1px solid rgba(139,92,246,.2);text-align:center}.help-footer p{margin:0;color:var(--text-secondary);font-size:13px}.help-footer em{color:var(--accent-color);font-style:normal}