*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#0d1117;color:#c9d1d9}#root{height:100%}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#21262d}::-webkit-scrollbar-thumb{background:#484f58;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#6e7681}::selection{background:#388bfd66}.header{display:flex;justify-content:space-between;align-items:center;padding:3px 10px;background:linear-gradient(135deg,#1a1a2e,#16213e);border-bottom:1px solid #2d3748}.header-left{display:flex;align-items:center;gap:6px}.hot100-link{display:inline-flex;align-items:center;padding:1px 5px;font-size:10px;font-weight:600;color:#fff;background:linear-gradient(135deg,#ff6b6b,#ffa116);border-radius:0;text-decoration:none;transition:all .2s;white-space:nowrap}.hot100-link:hover{transform:translateY(-1px);box-shadow:0 4px 12px #ffa11666}.title-link{text-decoration:none;color:inherit;transition:opacity .2s}.title-link:hover{opacity:.8}.title{margin:0;font-size:13px;font-weight:500;color:#ffa116;letter-spacing:0px}.github-link{display:flex;align-items:center;justify-content:center;color:#a0aec0;transition:color .2s,transform .2s;padding:4px;border-radius:4px}.github-link:hover{color:#fff;transform:scale(1.1)}.data-input-container{padding:8px 20px;background:#1e2a3a;border-bottom:1px solid #2d3748}.input-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.input-label{color:#a0aec0;font-size:13px;white-space:nowrap}.data-input{flex:1;min-width:0;padding:6px 12px;font-size:13px;font-family:Monaco,Menlo,monospace;background:#0d1117;border:1px solid #30363d;border-radius:4px;color:#c9d1d9;outline:none;transition:border-color .2s}.data-input:focus{border-color:#58a6ff}.data-input.input-error{border-color:#f85149}.random-btn{padding:6px 12px;font-size:12px;background:#238636;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background .2s;white-space:nowrap;flex-shrink:0}.random-btn:hover{background:#2ea043}.input-separator{width:1px;height:16px;background:#30363d;flex-shrink:0}.error-message{margin-top:4px;font-size:12px;color:#f85149}.examples-label{color:#8b949e;font-size:12px;white-space:nowrap;flex-shrink:0}.example-btn{padding:2px 8px;font-size:11px;background:#21262d;color:#8b949e;border:1px solid #30363d;border-radius:12px;cursor:pointer;transition:all .2s;flex-shrink:0}.example-btn:hover{background:#30363d;color:#c9d1d9;border-color:#8b949e}.tree-visualization{flex:1;background:linear-gradient(180deg,#0d1117,#161b22);border-radius:8px;position:relative;overflow:hidden;min-height:200px}.tree-visualization svg{width:100%;height:100%;cursor:grab}.tree-visualization svg:active{cursor:grabbing}.zoom-controls{position:absolute;bottom:80px;right:10px;display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px;background:#1e2a3af2;border-radius:6px;border:1px solid #30363d;z-index:20}.zoom-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:#21262d;color:#c9d1d9;border:1px solid #30363d;border-radius:4px;cursor:pointer;font-size:16px;font-weight:700;transition:all .2s}.zoom-btn:hover{background:#30363d;border-color:#8b949e}.zoom-btn:active{background:#484f58}.zoom-btn.reset-btn{font-size:14px;margin-top:4px}.zoom-level{font-size:10px;color:#8b949e;padding:2px 0}.tree-stats-panel{position:absolute;top:10px;left:10px;display:flex;gap:12px;padding:8px 12px;background:#1e2a3af2;border-radius:6px;border:1px solid #30363d;z-index:10}.stat-item{display:flex;flex-direction:column;align-items:center;gap:2px}.stat-label{font-size:10px;color:#8b949e;text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:16px;font-weight:600;color:#c9d1d9}.stat-value.visited{color:#3fb950}.tree-legend{position:absolute;top:10px;right:10px;display:flex;gap:12px;padding:6px 10px;background:#1e2a3af2;border-radius:6px;border:1px solid #30363d;z-index:10}.legend-item{display:flex;align-items:center;gap:4px;font-size:11px;color:#8b949e}.legend-dot{width:10px;height:10px;border-radius:50%}.legend-dot.current{background:#ffa116;box-shadow:0 0 4px #ffa11699}.legend-dot.on-stack{background:#58a6ff}.legend-dot.visited{background:#3fb950}.legend-dot.unvisited{background:#1e2a3a;border:1px solid #4a5568}.step-info{position:absolute;bottom:10px;left:10px;right:90px;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;background:#1e2a3af2;border-radius:6px;border:1px solid #30363d;min-width:0;overflow:hidden}.step-info-left{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0;overflow:hidden}.step-description{color:#c9d1d9;font-size:13px;font-weight:500;min-width:0;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.progress-info{display:flex;align-items:center;gap:8px}.progress-label{font-size:11px;color:#8b949e}.mini-progress-bar{width:80px;height:4px;background:#21262d;border-radius:2px;overflow:hidden}.mini-progress-fill{height:100%;background:linear-gradient(90deg,#238636,#3fb950);transition:width .3s ease}.progress-percent{font-size:11px;color:#3fb950;font-weight:500;min-width:32px}.step-info-right{display:flex;align-items:center}.depth-info{display:flex;gap:16px}.depth-item{display:flex;flex-direction:column;align-items:center;gap:2px}.depth-label{font-size:10px;color:#8b949e;text-transform:uppercase}.depth-value{font-size:20px;font-weight:700}.depth-value.current-depth{color:#58a6ff}.depth-value.max-depth{color:#ffa116}.node-current{filter:drop-shadow(0 0 12px rgba(255,161,22,.9))}.node-pending{stroke-dasharray:5 3;animation:dash-rotate 1.2s linear infinite}.comparing-pulse{animation:compare-pulse .5s ease-in-out infinite alternate}.step-info .depth-value.current-depth{color:#58a6ff;text-shadow:0 0 8px rgba(88,166,255,.4)}.step-info .depth-value.max-depth{color:#ffa116;text-shadow:0 0 8px rgba(255,161,22,.4)}.tree-stats-panel{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.stat-value{font-family:SF Mono,Monaco,Menlo,monospace}.step-description{line-height:1.5;letter-spacing:.2px}.mini-progress-fill{box-shadow:0 0 6px #3fb95066}.node-glow{animation:glow-pulse 1.5s ease-in-out infinite}.return-value{animation:slide-in .4s ease-out}.edge-call,.edge-return{transition:opacity .3s ease,stroke-width .3s ease}@keyframes frame-enter{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes glow-pulse{0%,to{opacity:.3;r:28}50%{opacity:.6;r:32}}@keyframes slide-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes dash-rotate{to{stroke-dashoffset:-8}}@keyframes compare-pulse{0%{opacity:.6;transform:scale(.95)}to{opacity:1;transform:scale(1.05)}}.complexity-info{display:flex;align-items:center;gap:16px;padding:8px 12px;background:#58a6ff14;border-bottom:1px solid #30363d}.complexity-item{display:flex;align-items:center;gap:6px}.complexity-label{font-size:11px;color:#8b949e}.complexity-value{font-size:12px;font-weight:600;color:#58a6ff;font-family:Monaco,Menlo,monospace}.complexity-hint{font-size:10px;color:#6e7681;margin-left:auto}.variables-panel{border-top:1px solid #30363d;padding:8px 12px;background:#161b22}.panel-title{font-size:11px;color:#8b949e;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}.variables-grid{display:flex;flex-wrap:wrap;gap:6px}.variable-card{display:flex;align-items:center;gap:6px;padding:4px 8px;background:#21262d;border-radius:4px;border:1px solid #30363d}.variable-name{font-size:11px;color:#79c0ff;font-family:Monaco,Menlo,monospace}.variable-val{font-size:11px;color:#3fb950;font-weight:600;font-family:Monaco,Menlo,monospace;transition:color .3s ease}@keyframes flash{0%{background:#388bfd4d}to{background:#21262d}}.variable-card.updating{animation:flash .3s ease}@keyframes shimmer{0%,to{opacity:.4}50%{opacity:1}}.variable-card.loading .variable-val{animation:shimmer 1.5s ease-in-out infinite;color:#58a6ff}.call-stack{border-top:1px solid #30363d;padding:8px 12px;background:#161b22;max-height:140px;overflow-y:auto}.call-stack-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.call-stack-title{color:#8b949e;font-size:11px;text-transform:uppercase;letter-spacing:.5px}.stack-depth{font-size:11px;color:#ffa116;font-weight:500}.call-stack-items{display:flex;flex-direction:column;gap:4px}.stack-frame{display:flex;align-items:center;gap:6px;padding:5px 8px;background:#21262d;border-radius:4px;font-size:11px;font-family:Monaco,Menlo,monospace;border:1px solid transparent;min-width:0}.stack-frame.current-frame{background:#ffa1161a;border-color:#ffa116}.frame-index{width:16px;height:16px;display:flex;align-items:center;justify-content:center;background:#30363d;border-radius:3px;font-size:10px;color:#8b949e}.current-frame .frame-index{background:#ffa116;color:#000}.frame-func{color:#d2a8ff}.frame-args{color:#8b949e;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.frame-node-val{color:#79c0ff;font-weight:500}.frame-indicator{margin-left:auto;font-size:10px;color:#ffa116}.empty-stack{text-align:center;color:#6e7681;font-size:11px;padding:8px}@keyframes pulse{0%,to{box-shadow:0 0 #ffa11666}50%{box-shadow:0 0 0 4px #ffa1161a}}.stack-frame.current-frame{animation:pulse 2s ease-in-out infinite}.algorithm-hint{border-top:1px solid #30363d;padding:8px 12px;background:#23863614}.hint-title{font-size:11px;color:#3fb950;margin-bottom:4px}.hint-content{font-size:12px;color:#8b949e;line-height:1.4}.code-display{width:460px;min-width:320px;max-width:50vw;flex-shrink:0;background:#0d1117;border-radius:6px;border:1px solid #30363d;display:flex;flex-direction:column;overflow:hidden}.code-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:#161b22;border-bottom:1px solid #30363d}.code-title{color:#c9d1d9;font-size:13px;font-weight:500}.code-badge{padding:2px 8px;font-size:11px;background:#238636;color:#fff;border-radius:10px}.code-content{flex:1;min-height:0;overflow-y:auto;padding:6px 0}.code-pre{margin:0;font-family:Monaco,Menlo,Consolas,monospace;font-size:12px;line-height:1.6}.code-line{display:flex;align-items:center;padding:2px 12px;transition:background .2s}.code-line.highlighted{background:#ffa11626;border-left:3px solid #ffa116;padding-left:9px}.line-number{width:24px;color:#484f58;text-align:right;margin-right:12px;-webkit-user-select:none;user-select:none;flex-shrink:0}.line-content{flex:1;color:#c9d1d9;white-space:pre}.variable-value{margin-left:12px;padding:2px 8px;background:#388bfd26;border-radius:4px;font-size:11px;display:flex;align-items:center;gap:4px;flex-shrink:0}.var-name{color:#79c0ff}.var-equals{color:#8b949e}.var-val{color:#a5d6ff;font-weight:500}.keyword{color:#ff7b72}.type{color:#ffa657}.function{color:#d2a8ff}.variable{color:#79c0ff}.number{color:#a5d6ff}@keyframes line-highlight-in{0%{background:#ffa11600}30%{background:#ffa11659}to{background:#ffa11626}}@keyframes line-number-glow{0%{color:#ffa116;text-shadow:0 0 6px rgba(255,161,22,.8)}to{color:#484f58;text-shadow:none}}.code-line{transition:background .3s ease,border-color .3s ease,opacity .3s ease}.code-line.highlighted{animation:line-highlight-in .4s ease forwards}.code-line.highlighted .line-number{animation:line-number-glow .6s ease forwards}@keyframes line-step{0%{transform:translate(0)}30%{transform:translate(4px)}to{transform:translate(0)}}.code-line.step-forward{animation:line-step .35s ease}@keyframes value-change{0%{transform:translateY(-2px);color:#ffa116}60%{transform:translateY(0);color:#ffa116}to{transform:translateY(0);color:#3fb950}}.variable-value.flash-update{animation:value-change .5s ease}@keyframes value-appear{0%{opacity:0;transform:translateY(4px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.variable-value.first-appear{animation:value-appear .35s ease-out}@keyframes indicator-slide{0%{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}.code-line.highlighted:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#ffa116;border-radius:0 2px 2px 0;animation:indicator-slide .3s ease-out;box-shadow:0 0 8px #ffa11699}.code-line{position:relative}.code-line.highlighted.depth-1{background:#58a6ff26;border-left-color:#58a6ff}.code-line.highlighted.depth-2{background:#d2a8ff26;border-left-color:#d2a8ff}.code-line.highlighted.depth-3{background:#3fb95026;border-left-color:#3fb950}@keyframes flash-highlight{0%{background:#ffa1164d}to{background:#ffa11626}}.code-line.flashing{animation:flash-highlight .5s ease}.control-panel{padding:5px 45px 5px 10px;background:#1e2a3a;border-top:1px solid #2d3748}.controls-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.control-buttons{display:flex;gap:5px}.control-btn{display:flex;align-items:center;gap:3px;padding:3px 7px;font-size:10px;background:#21262d;color:#c9d1d9;border:1px solid #30363d;border-radius:4px;cursor:pointer;transition:all .2s}.control-btn:hover:not(:disabled){background:#30363d;border-color:#8b949e}.control-btn:disabled{opacity:.5;cursor:not-allowed}.control-btn.play-btn{background:#238636;border-color:#238636}.control-btn.play-btn:hover{background:#2ea043;border-color:#2ea043}.control-btn.reset-btn{background:#1f6feb;border-color:#1f6feb}.control-btn.reset-btn:hover:not(:disabled){background:#388bfd;border-color:#388bfd}.btn-icon{font-size:10px}.btn-text{font-weight:500}.shortcut{padding:1px 3px;font-size:8px;background:#0000004d;border-radius:2px;color:#8b949e}.speed-control{display:flex;align-items:center;gap:6px}.speed-label{color:#8b949e;font-size:10px}.speed-select{padding:3px 6px;font-size:10px;background:#21262d;color:#c9d1d9;border:1px solid #30363d;border-radius:3px;cursor:pointer}.step-counter{color:#8b949e;font-size:10px;font-family:Monaco,Menlo,monospace}.progress-container{position:relative;height:4px;background:#21262d;border-radius:2px;overflow:hidden}.progress-bar{position:absolute;top:0;left:0;height:100%;background:linear-gradient(90deg,#238636,#3fb950);border-radius:2px;transition:width .2s}.progress-slider{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0}.progress-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:#fff;border-radius:50%;cursor:pointer}.wechat-float{position:fixed;bottom:20px;right:20px;z-index:1000}.float-button{display:flex;flex-direction:column;align-items:center;justify-content:center;width:60px;height:60px;background:linear-gradient(135deg,#07c160,#06ad56);border-radius:50%;color:#fff;cursor:pointer;box-shadow:0 4px 12px #07c16066;transition:transform .2s,box-shadow .2s}.float-button:hover{transform:scale(1.1);box-shadow:0 6px 16px #07c16080}.float-text{font-size:10px;margin-top:2px;font-weight:500}.qrcode-popup{position:absolute;bottom:70px;right:0;background:#fff;border-radius:12px;box-shadow:0 8px 24px #0003;padding:16px;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.popup-arrow{position:absolute;bottom:-8px;right:24px;width:16px;height:16px;background:#fff;transform:rotate(45deg);box-shadow:4px 4px 8px #0000001a}.popup-content{position:relative;z-index:1;text-align:center}.qrcode-image{width:180px;height:auto;border-radius:8px;display:block}.popup-tip{margin:12px 0 0;font-size:12px;color:#666;line-height:1.5}.app{display:flex;flex-direction:column;height:100vh;height:100dvh;background:#0d1117;color:#c9d1d9;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.main-content{flex:1;display:flex;gap:12px;padding:10px;overflow:hidden;min-height:0}