*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#e0e0e0;background:#1a1a2e;flex-direction:column;height:100dvh;font-family:system-ui,sans-serif;display:flex}#app{flex-direction:column;height:100%;display:flex}header{background:#16213e;border-bottom:1px solid #0f3460;padding:.75rem 1.25rem}header h1{letter-spacing:.05em;font-size:1.1rem;font-weight:600}main{flex:1;min-height:0;display:flex;overflow:hidden}#editor-pane{flex:0 0 var(--editor-basis,50%);flex-direction:column;min-width:0;display:flex;overflow:hidden}#editor{flex:1;min-height:0;overflow:auto}#gutter{cursor:col-resize;touch-action:none;background:#0f3460;flex:0 0 6px}#gutter:hover{background:#1e5a96}.toolbar{background:#16213e;border-bottom:1px solid #0f3460;align-items:center;gap:.5rem;padding:.4rem .6rem;display:flex}.toolbar label{color:#a0a0b0;font-size:.8rem}.toolbar button,.toolbar input,.toolbar select{font:inherit;color:#e0e0e0;cursor:pointer;background:#0f3460;border:1px solid #1e5a96;border-radius:4px;padding:.25rem .7rem;font-size:.8rem}.toolbar button:hover:not(:disabled),.toolbar input:hover,.toolbar input:focus,.toolbar select:hover{background:#1e5a96}.toolbar button:disabled{opacity:.35;cursor:default}#step-input{cursor:text;width:4.8rem}#step-label{color:#a0a0b0;white-space:nowrap;min-width:3.2rem;font-size:.8rem}#step-sep{background:#1e5a96;flex:0 0 1px;height:1rem;margin:0 .2rem}.toolbar-check{cursor:pointer;user-select:none;align-items:center;gap:.3rem;display:flex}.toolbar-check input[type=checkbox]{cursor:pointer;accent-color:#7dd3fc;width:.85rem;height:.85rem}#error{color:#f87171;white-space:pre-wrap;background:#3d1515;padding:.5rem .75rem;font-family:monospace;font-size:.85rem}#diagram-pane{background:#0d0d1a;flex-direction:column;flex:1 1 0;min-width:0;display:flex;overflow:hidden}#diagram-scroll{flex:1 1 0;min-height:5rem;padding:1.5rem;overflow:auto}#diagram{display:block}#diagram text.diagram-label{fill:#a0a0b0;letter-spacing:0;text-transform:uppercase;font-size:11px;font-weight:600}#diagram text.stack-frame-label{fill:#c0d8f0;letter-spacing:0;font-size:11px}#diagram text.stack-frame-ref{fill:#e0e0e0;letter-spacing:0;font-family:monospace;font-size:12px}#diagram rect.stack-frame-box{fill:#0f346038;stroke:#1e5a96;stroke-width:1px;rx:4}#diagram line{stroke:#7dd3fc;stroke-width:2px;stroke-linecap:round}#diagram line.highlight{stroke:#fbbf24;stroke-width:3.5px}#diagram line.binder-bar{stroke:#7dd3fc;stroke-width:2px;stroke-dasharray:4 3;stroke-linecap:round}#diagram line.link-arrow{stroke:#7dd3fc;stroke-width:1.5px;stroke-linecap:round;opacity:.7}#diagram path.link-arrow{fill:none;stroke:#7dd3fc;stroke-width:1.5px;stroke-linecap:round;opacity:.7}#diagram line.stack-link-arrow{stroke:#fbbf24;stroke-width:1.5px;stroke-linecap:round;stroke-dasharray:4 3;opacity:.8}#diagram .arrow-head{fill:#7dd3fc;opacity:.7}#pretty-gutter{cursor:row-resize;touch-action:none;background:#0f3460;flex:0 0 6px}#pretty-gutter:hover{background:#1e5a96}#pretty-print{flex:0 0 var(--pretty-basis,120px);color:#c0d8f0;white-space:pre-wrap;word-break:break-all;border-top:1px solid #0f3460;min-height:2.5rem;margin:0;padding:.6rem 1rem;font-family:monospace;font-size:.8rem;line-height:1.6;overflow:auto}#pretty-print span.highlight{color:#0d0d1a;background:#fbbf24;border-radius:2px}@media (width<=700px){body{height:auto;min-height:100dvh}#app{height:auto}main{flex-direction:column;overflow:visible}#gutter{display:none}#editor-pane{border-bottom:1px solid #0f3460;flex:none;overflow:visible}#editor{flex:none;min-height:8rem;overflow:visible}#diagram-pane{flex:none;overflow:visible}#diagram-scroll{overflow:auto visible}#pretty-gutter{display:none}#pretty-print{border-top:1px solid #0f3460;flex:none;max-height:12rem}}