:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--primary-color: #3498db;--primary-dark: #2980b9;--secondary-color: #2ecc71;--secondary-dark: #27ae60;--highlight-color: #f39c12;--highlight-dark: #e67e22;--danger-color: #e74c3c;--text-color: #2c3e50;--light-text: #ecf0f1;--background-color: #f8f9fa;--panel-background: #ffffff;--border-color: #e0e0e0;--shadow: 0 4px 6px rgba(0, 0, 0, .1);--border-radius: 8px;--transition: all .3s ease}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;color:var(--text-color);background-color:var(--background-color)}h4{margin-bottom:15px;font-weight:600;color:var(--primary-dark);font-size:1.1rem}button{background-color:var(--primary-color);color:#fff;border:none;padding:8px 16px;border-radius:var(--border-radius);cursor:pointer;font-weight:500;transition:var(--transition);margin-right:10px;margin-bottom:10px}button:hover{background-color:var(--primary-dark)}button:disabled{background-color:#ccc;cursor:not-allowed}.app{display:flex;flex-direction:column;min-height:100vh;padding:20px;background-color:var(--background-color)}.app header{text-align:center;margin-bottom:20px}.app header h1{color:var(--primary-dark);margin-bottom:8px;font-size:1.8rem}.app header p{color:var(--text-color);margin-bottom:5px}.app header .author{font-style:italic;color:var(--highlight-dark);font-weight:500;margin-top:8px}.app-container{display:flex;flex:1;gap:20px}.left-panel,.right-panel{border-radius:var(--border-radius);background-color:var(--panel-background);box-shadow:var(--shadow);padding:20px;overflow:auto}.left-panel{flex:1;margin-right:20px;display:flex;flex-direction:column;min-width:400px}.left-panel .node-count-control{margin-top:15px;padding:15px;background-color:#f8f9fa;border-radius:8px;box-shadow:0 2px 4px #0000001a}.left-panel .node-count-control .node-count-button{background-color:#4a6fa5;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-weight:500;transition:background-color .2s}.left-panel .node-count-control .node-count-button:hover{background-color:#3a5a80}.left-panel .node-count-control .current-node-count{margin-top:10px;font-weight:500;color:#555}.left-panel .node-count-control .node-count-input-container{margin-top:12px;display:flex;flex-wrap:wrap;align-items:center;gap:10px}.left-panel .node-count-control .node-count-input-container .node-count-input{padding:6px 10px;border:1px solid #ccc;border-radius:4px;width:80px;font-size:14px}.left-panel .node-count-control .node-count-input-container .node-count-submit{background-color:#28a745;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer}.left-panel .node-count-control .node-count-input-container .node-count-submit:disabled{background-color:#6c757d;cursor:not-allowed}.left-panel .node-count-control .node-count-input-container .node-count-submit:hover:not(:disabled){background-color:#218838}.left-panel .node-count-control .node-count-input-container .node-count-hint{width:100%;margin:5px 0 0;font-size:12px;color:#6c757d}.left-panel .traceback-mode{background-color:#f0f9f4;border:1px solid rgba(46,204,113,.3)}.left-panel .traceback-mode .mode-indicator{display:inline-block;padding:4px 10px;background-color:var(--secondary-color);color:#fff;font-weight:700;border-radius:var(--border-radius);margin-right:15px;margin-bottom:10px}.left-panel .traceback-mode .mns-sets-controls{margin:15px 0;border:1px solid #e0e0e0;border-radius:4px;padding:10px;background-color:#f9f9f9}.left-panel .traceback-mode .mns-sets-controls .mns-sets-info{margin-bottom:10px;text-align:center;font-weight:700}.left-panel .traceback-mode .mns-sets-controls .mns-sets-buttons{display:flex;justify-content:space-between;gap:10px}.left-panel .traceback-mode .mns-sets-controls .mns-sets-buttons button{flex:1;padding:5px;font-size:.9em}.left-panel .traceback-mode .mns-sets-controls .mns-sets-buttons button.toggle-all-mns-sets{background-color:#673ab7;color:#fff}.left-panel .traceback-mode .mns-sets-controls .mns-sets-buttons button.toggle-all-mns-sets:hover{background-color:#512e90}.right-panel{flex:2;min-width:300px;display:flex;flex-direction:column;gap:20px}.visualization-panel,.state-table-panel,.controls-panel{padding:15px;border-radius:var(--border-radius);background-color:var(--panel-background);box-shadow:0 2px 4px #0000000d}.visualization-panel{flex-grow:1;display:flex;flex-direction:column}.visualization-panel svg{flex-grow:1;border-radius:var(--border-radius);background-color:#f9f9f9}.visualization-panel .current-step-info{margin-top:15px;padding:15px;background-color:#f5f5f5;border-radius:var(--border-radius);border-left:4px solid var(--highlight-color)}.visualization-panel .current-step-info h5{margin-top:15px;margin-bottom:10px;color:var(--text-color);font-size:1rem}.visualization-panel .current-step-info.traceback-info{border-left:4px solid var(--secondary-color);background-color:#f0f9f4}.visualization-panel .current-step-info.traceback-info h5{color:var(--secondary-dark)}.visualization-panel .current-step-info.traceback-info .all-mns-sets{margin:10px 0;max-height:150px;overflow-y:auto;border:1px solid #e0e0e0;border-radius:4px;padding:8px;background-color:#f5f5f5}.visualization-panel .current-step-info.traceback-info .all-mns-sets .mns-set{padding:5px;margin-bottom:5px;border-radius:3px}.visualization-panel .current-step-info.traceback-info .all-mns-sets .mns-set:last-child{margin-bottom:0}.visualization-panel .current-step-info.traceback-info .all-mns-sets .mns-set.current-mns-set{background-color:#e8f5e9;border-left:3px solid #4caf50;font-weight:700}.visualization-panel .current-step-info.traceback-info .all-mns-sets .mns-set.traceback-current-line{height:4px;background:#f39c12}.visualization-panel .current-step-info.traceback-info .all-mns-sets .mns-set.traceback-line{height:3px;background:#27ae60}.visualization-panel .traceback-mode{background-color:#f0f9f4;border:1px solid rgba(46,204,113,.3)}.visualization-panel .traceback-mode .mode-indicator{display:inline-block;padding:4px 10px;background-color:var(--secondary-color);color:#fff;font-weight:700;border-radius:var(--border-radius);margin-right:15px;margin-bottom:10px}.visualization-panel .traceback-mode .end-traceback{background-color:var(--secondary-dark)}.visualization-panel .traceback-mode .end-traceback:hover{background-color:#1e8449}.controls-panel{display:flex;flex-direction:column}.controls-panel .buttons-container{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.controls-panel .step-buttons{display:flex;border-radius:var(--border-radius);overflow:hidden;box-shadow:0 1px 3px #0000001a}.controls-panel .step-buttons button{margin:0;border-radius:0}.controls-panel .step-buttons .prev-step{background-color:var(--primary-color);border-top-right-radius:0;border-bottom-right-radius:0;border-right:1px solid rgba(255,255,255,.2)}.controls-panel .step-buttons .prev-step:hover{background-color:var(--primary-dark)}.controls-panel .step-buttons .prev-step:disabled{background-color:#ccc;cursor:not-allowed}.controls-panel .step-buttons .next-step{background-color:var(--secondary-color);border-top-left-radius:0;border-bottom-left-radius:0}.controls-panel .step-buttons .next-step:hover{background-color:var(--secondary-dark)}.controls-panel .step-buttons .next-step:disabled{background-color:#ccc;cursor:not-allowed}.controls-panel button.calculate-all{background-color:var(--highlight-color);font-weight:700}.controls-panel button.calculate-all:hover{background-color:var(--highlight-dark)}.controls-panel button.calculate-all:disabled{background-color:#ccc;font-weight:400}.controls-panel button.reset{background-color:var(--danger-color)}.controls-panel button.reset:hover{background-color:#c0392b}.state-table-panel{flex-grow:1}.state-table-panel .calculation-info{margin:15px 0;padding:12px;background-color:#f5f5f5;border-radius:var(--border-radius);border-left:4px solid var(--primary-color);font-size:.9rem}.state-table-panel .calculation-info .formula{font-family:monospace;background-color:#e8e8e8;padding:4px 8px;border-radius:4px;margin:5px 0}.state-table-panel{display:flex;flex-direction:column}.state-table-panel .calculation-info{background-color:#f8f9fa;border-radius:var(--border-radius);padding:15px;margin-bottom:20px;box-shadow:0 2px 4px #0000000d;border-left:4px solid var(--primary-color)}.state-table-panel .calculation-info h5{color:var(--primary-dark);margin-bottom:10px;font-size:1rem}.state-table-panel .calculation-info p{margin:8px 0;line-height:1.5}.state-table-panel .calculation-info .formula{font-family:Consolas,Monaco,monospace;background-color:#e9ecef;border-radius:4px;padding:8px 12px;margin:10px 0;font-size:.95rem;color:#333;display:inline-block;line-height:1.6}.state-table-panel .calculation-info .value-box{display:inline-block;padding:2px 8px;border-radius:4px;margin:0 2px;font-weight:700}.state-table-panel .calculation-info .value-box.value1{background-color:#3498db33;border:1px solid rgba(52,152,219,.5);color:#2980b9}.state-table-panel .calculation-info .value-box.value2{background-color:#2ecc7133;border:1px solid rgba(46,204,113,.5);color:#27ae60}.state-table-panel .calculation-info .source-cells{margin-top:12px;padding:8px;background-color:#f8f9fa;border-radius:4px;font-size:.9rem}.state-table-panel .calculation-info .source-cells .cell-reference{color:#666;margin-right:6px;margin-left:6px}.state-table-panel .table-container{overflow:auto;max-height:400px;flex-grow:1;border-radius:var(--border-radius);box-shadow:0 2px 8px #00000014}.state-table-panel table{border-collapse:separate;border-spacing:0;width:100%;margin-top:10px;font-size:.9rem;table-layout:fixed;border-radius:var(--border-radius);overflow:hidden}.state-table-panel table th,.state-table-panel table td{border:1px solid #e0e0e0;padding:8px 10px;text-align:center;min-width:40px;transition:background-color .2s ease}.state-table-panel table th{background-color:#f1f3f5;font-weight:600;color:#495057}.state-table-panel table thead th:first-child,.state-table-panel table tbody th:first-child{position:sticky;left:0;background-color:#e9ecef;z-index:1;box-shadow:2px 0 5px #0000000d}.state-table-panel table thead th{position:sticky;top:0;background-color:#e9ecef;z-index:2;box-shadow:0 2px 5px #0000000d}.state-table-panel table thead th:first-child{z-index:3}.state-table-panel table tbody tr:nth-child(2n){background-color:#f8f9fa}.state-table-panel table tbody tr:hover{background-color:#f1f3f5}.state-table-panel table td.highlighted{background-color:#fff3cd;font-weight:700;color:#856404;box-shadow:inset 0 0 0 2px #ffeeba;animation:pulse 1.5s infinite}.state-table-panel table td.source-cell{font-weight:700}.state-table-panel table td.source-cell.value1{background-color:#3498db33;border:1px solid rgba(52,152,219,.5);color:#2980b9}.state-table-panel table td.source-cell.value2{background-color:#2ecc7133;border:1px solid rgba(46,204,113,.5);color:#27ae60}.state-table-panel table td.traceback-current{background-color:#f39c12;font-weight:700;color:#fff;box-shadow:inset 0 0 0 2px #e67e22;animation:pulse-traceback 1.5s infinite}.state-table-panel table td.traceback-visited{background-color:#2ecc7166;font-weight:700;color:#27ae60;border:1px solid rgba(46,204,113,.7)}@keyframes pulse-traceback{0%{box-shadow:inset 0 0 0 2px #e67e22}50%{box-shadow:inset 0 0 0 3px #d35400}to{box-shadow:inset 0 0 0 2px #e67e22}}@keyframes pulse{0%{box-shadow:inset 0 0 0 2px #ffeeba}50%{box-shadow:inset 0 0 0 2px #ffc107}to{box-shadow:inset 0 0 0 2px #ffeeba}}
