.code-editor{display:flex;flex-direction:column;background:var(--dark-alt);border:1px solid var(--dark-border);border-radius:6px;overflow:hidden}.editor-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;background:var(--dark);border-bottom:1px solid var(--dark-border)}.editor-header label{font-weight:600;color:var(--primary)}.example-selector{display:flex;align-items:center;gap:.5rem}.example-selector label{font-size:.85rem;color:var(--text-muted);font-weight:400}.example-selector select{background:var(--dark-alt);color:var(--text);border:1px solid var(--dark-border);border-radius:4px;padding:.25rem .5rem;font-size:.85rem;cursor:pointer}.example-selector select:hover{border-color:var(--primary)}.code-textarea{width:100%;min-height:300px;max-height:500px;padding:1rem;background:var(--code-bg);color:var(--text);border:none;font-family:Consolas,Monaco,Courier New,monospace;font-size:.9rem;line-height:1.6;resize:vertical;outline:none}.code-textarea::placeholder{color:var(--text-muted)}.code-textarea:focus{outline:2px solid var(--primary);outline-offset:-2px}.controls{background:var(--dark-alt);border:1px solid var(--dark-border);border-radius:6px;padding:1rem}.control-group{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}.btn{padding:.5rem 1rem;border:1px solid var(--dark-border);border-radius:4px;background:var(--dark);color:var(--text);font-size:.9rem;cursor:pointer;transition:all .2s;white-space:nowrap}.btn:hover:not(:disabled){background:var(--dark-alt);border-color:var(--primary);transform:translateY(-1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:600}.btn-primary:hover:not(:disabled){background:#0098ff;border-color:#0098ff}.btn-secondary{background:var(--dark-border)}.playback-speed{display:flex;flex-direction:column;gap:.5rem}.playback-speed label{font-size:.85rem;color:var(--text-muted)}.playback-speed input[type=range]{width:100%;height:6px;border-radius:3px;background:var(--dark);outline:none;-webkit-appearance:none}.playback-speed input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--primary);cursor:pointer}.playback-speed input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--primary);cursor:pointer;border:none}.call-stack{max-height:500px;overflow-y:auto}.call-stack.empty{display:flex;align-items:center;justify-content:center;min-height:150px}.empty-message{color:var(--text-muted);font-style:italic}.stack-frame{background:#264f7833;border:2px solid var(--stack);border-radius:6px;padding:.75rem}.frame-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid var(--stack)}.frame-name{font-weight:600;font-size:1.05rem;color:#7ec8ff}.frame-badge{background:var(--stack);color:#fff;padding:.15rem .5rem;border-radius:12px;font-size:.75rem}.frame-section{margin-top:.5rem}.section-title{font-size:.85rem;color:var(--text-muted);margin-bottom:.25rem;text-transform:uppercase;letter-spacing:.5px}.variable{display:flex;justify-content:space-between;padding:.25rem 0;font-family:Consolas,monospace;font-size:.9rem}.var-name{color:#9cdcfe}.var-value{color:#ce9178;font-weight:500}.frame-footer{margin-top:.5rem;padding-top:.5rem;border-top:1px solid rgba(38,79,120,.3);color:var(--text-muted);font-size:.8rem}.heap-memory{max-height:500px;overflow-y:auto}.heap-memory.empty{display:flex;align-items:center;justify-content:center;min-height:150px}.heap-stats{display:flex;justify-content:space-between;padding:.5rem;background:#3a6ea51a;border-radius:4px;margin-bottom:1rem;font-size:.85rem;color:var(--text-muted)}.heap-objects{display:grid;gap:.75rem}.heap-object{background:#3a6ea533;border:2px solid var(--heap);border-radius:6px;padding:.75rem}.heap-object.marked{border-color:var(--secondary);box-shadow:0 0 8px #5cb85c4d}.heap-object-function{border-color:#c586c0}.heap-object-array{border-color:#4ec9b0}.object-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--heap)}.object-id{font-family:Consolas,monospace;color:#4fc1ff;font-weight:600}.object-type{background:var(--heap);color:#fff;padding:.15rem .5rem;border-radius:12px;font-size:.75rem;text-transform:uppercase}.gc-badge{background:var(--secondary);color:#fff;padding:.15rem .5rem;border-radius:12px;font-size:.7rem}.object-properties{font-family:Consolas,monospace;font-size:.9rem}.property{display:flex;justify-content:space-between;padding:.25rem 0}.prop-key{color:#9cdcfe}.prop-value{color:#ce9178}.object-footer{margin-top:.5rem;padding-top:.5rem;border-top:1px solid rgba(58,110,165,.3);color:var(--text-muted);font-size:.8rem}.object-meta{margin-top:.5rem;font-size:.75rem;color:var(--text-muted)}.lexical-environments{max-height:500px;overflow-y:auto}.lexical-environments.empty{display:flex;align-items:center;justify-content:center;min-height:150px}.env-stats{display:flex;gap:1rem;padding:.5rem;background:#5a7c591a;border-radius:4px;margin-bottom:1rem;font-size:.85rem;color:var(--text-muted)}.env-tree{font-family:Consolas,monospace}.env-tree-node{margin-bottom:.5rem}.environment{background:#5a7c5933;border:2px solid var(--env);border-radius:6px;padding:.75rem;margin-bottom:.5rem}.environment.retained{border-color:var(--secondary);box-shadow:0 0 8px #5cb85c33}.env-global{border-color:gold}.env-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--env)}.env-id{color:#4ec9b0;font-weight:600}.env-type{background:var(--env);color:#fff;padding:.15rem .5rem;border-radius:12px;font-size:.75rem;text-transform:uppercase}.retained-badge{background:var(--secondary);color:#fff;padding:.15rem .5rem;border-radius:12px;font-size:.7rem}.env-bindings{font-size:.9rem}.binding{display:flex;justify-content:space-between;padding:.25rem 0}.binding-name{color:#9cdcfe}.binding-value{color:#ce9178}.env-footer{margin-top:.5rem;padding-top:.5rem;border-top:1px solid rgba(90,124,89,.3);color:var(--text-muted);font-size:.8rem}.event-loop{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.event-loop-status{background:#8b5a8b1a;border-radius:4px;padding:.75rem;margin-bottom:1rem}.status-item{display:flex;justify-content:space-between;align-items:center}.status-label{font-weight:600;color:var(--text-muted)}.status-value{padding:.25rem .75rem;border-radius:12px;font-size:.85rem;font-weight:600}.status-value.empty{background:#5cb85c33;color:#5cb85c}.status-value.active{background:#d9534f33;color:#ff6b6b}.queues{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}.queue-section{background:var(--dark);border-radius:6px;padding:.75rem}.queue-section h3{font-size:1rem;margin-bottom:.5rem;color:var(--primary)}.queue-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid var(--dark-border)}.queue-info small{color:var(--text-muted);font-size:.8rem}.queue-count{background:var(--dark-border);padding:.15rem .5rem;border-radius:12px;font-size:.75rem;font-weight:600}.queue-empty{text-align:center;color:var(--text-muted);padding:1rem;font-style:italic}.task-list{display:flex;flex-direction:column;gap:.5rem}.task-item{display:flex;align-items:center;gap:.5rem;padding:.5rem;border-radius:4px;border-left:3px solid}.task-item.microtask{background:#ffc1071a;border-left-color:#ffc107}.task-item.macrotask{background:#007bff1a;border-left-color:#007bff}.task-badge{background:var(--dark-border);color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;flex-shrink:0}.task-details{flex:1}.task-type{font-weight:600;margin-bottom:.15rem}.task-details small{color:var(--text-muted);font-size:.75rem}.event-loop-explanation{background:#8b5a8b1a;border-radius:4px;padding:.75rem;font-size:.85rem}.event-loop-explanation strong{color:var(--primary);display:block;margin-bottom:.5rem}.event-loop-explanation ol{margin-left:1.5rem;color:var(--text)}.event-loop-explanation li{margin:.25rem 0}:root{--primary: #007acc;--secondary: #5cb85c;--danger: #d9534f;--dark: #1e1e1e;--dark-alt: #252526;--dark-border: #3e3e42;--text: #cccccc;--text-muted: #858585;--bg: #1e1e1e;--bg-alt: #252526;--code-bg: #1e1e1e;--stack: #264f78;--heap: #3a6ea5;--env: #5a7c59;--event: #8b5a8b}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg);color:var(--text)}code,pre{font-family:Consolas,Monaco,Courier New,monospace}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background:var(--dark-alt);border-bottom:2px solid var(--primary);padding:1.5rem 2rem;text-align:center}.app-header h1{font-size:2rem;margin-bottom:.5rem;color:var(--primary)}.app-header .subtitle{color:var(--text-muted);font-size:.95rem}.app-content{display:grid;grid-template-columns:500px 1fr;gap:1rem;padding:1rem;flex:1;overflow:hidden}.left-panel{display:flex;flex-direction:column;gap:1rem;overflow-y:auto;padding-right:.5rem}.right-panel{overflow-y:auto;padding-left:.5rem}.error-message{background:#d9534f33;border:1px solid var(--danger);border-radius:4px;padding:1rem;color:#ff6b6b}.current-step-info{background:var(--dark-alt);border:1px solid var(--dark-border);border-radius:6px;padding:1rem}.step-counter{font-size:.85rem;color:var(--text-muted);margin-bottom:.5rem}.step-action{font-size:1.1rem;margin-bottom:.5rem;color:var(--primary)}.step-explanation{color:var(--text);line-height:1.5}.visualization-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:1rem;margin-bottom:1rem}.viz-section{background:var(--dark-alt);border:1px solid var(--dark-border);border-radius:6px;padding:1rem;overflow:hidden}.viz-section h2{font-size:1.2rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--dark-border);color:var(--primary)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;padding:3rem}.empty-state h2{font-size:1.8rem;margin-bottom:1.5rem;color:var(--text-muted)}.empty-state p{margin-bottom:1rem;color:var(--text-muted)}.empty-state ul{list-style:none;text-align:left}.empty-state li{margin:.5rem 0;color:var(--text)}.gc-hints{grid-column:1 / -1}.gc-hints-list{display:flex;flex-direction:column;gap:.5rem}.gc-hint{padding:.75rem;border-radius:4px;border-left:3px solid}.gc-hint-retained{background:#5cb85c1a;border-left-color:var(--secondary)}.gc-hint-collectible{background:#ffc1071a;border-left-color:#ffc107}.gc-hint-collected{background:#6c757d1a;border-left-color:#6c757d}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--dark)}::-webkit-scrollbar-thumb{background:var(--dark-border);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#555}@media (max-width: 1200px){.app-content,.visualization-grid{grid-template-columns:1fr}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}#root{width:100%;min-height:100vh}button{font-family:inherit}