:root{--bg-page: #ffffff;--bg-surface: #ffffff;--bg-light-blue: #f4f8ff;--bg-highlight-blue: #eaf2ff;--bg-pale-indigo: #eef2ff;--navy-heading: #0f2942;--text-primary: #1e293b;--text-secondary: #475569;--blue-primary: #1d4ed8;--blue-primary-hover: #1e40af;--blue-border: #bfdbfe;--border-subtle: #dbe3ee;--green-bg: #ecfdf5;--green-text: #065f46;--green-border: #a7f3d0;--red-bg: #fef2f2;--red-text: #991b1b;--red-border: #fecaca;--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", Consolas, "Courier New", monospace}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;background-color:var(--bg-page);color:var(--text-primary);font-family:var(--font-sans);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}.container{width:100%;max-width:1140px;margin:0 auto;padding:0 1.25rem}.site-header{background-color:var(--bg-light-blue);border-bottom:1px solid var(--blue-border);padding:1.75rem 0 1.5rem}.header-inner{text-align:center}.header-kicker{display:inline-block;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--blue-primary);background-color:#fff;border:1px solid var(--blue-border);padding:.2rem .65rem;border-radius:4px;margin-bottom:.5rem}.site-title{margin:.2rem 0;font-size:2rem;color:var(--navy-heading);letter-spacing:-.02em}.site-subtitle{margin:.25rem 0;font-size:1.05rem;color:var(--text-secondary)}.site-author{margin:.2rem 0 .9rem;font-size:.875rem;color:var(--text-secondary)}.scope-notice-banner{max-width:760px;margin:0 auto 1.15rem;padding:.6rem 1rem;background-color:#fff;border:1px solid var(--blue-border);border-left:4px solid var(--blue-primary);border-radius:6px;font-size:.88rem;color:var(--navy-heading);text-align:left}.algorithm-mode-selector{display:inline-flex;flex-wrap:wrap;gap:.65rem;justify-content:center}.mode-tab-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:var(--font-sans);font-size:.98rem;font-weight:600;padding:.65rem 1.35rem;border-radius:6px;border:1.5px solid var(--blue-primary);background-color:#fff;color:var(--blue-primary);cursor:pointer;transition:background-color .15s ease,color .15s ease}.mode-tab-btn:hover{background-color:var(--bg-highlight-blue)}.mode-tab-btn.active{background-color:var(--blue-primary);color:#fff}.mode-tab-btn:focus-visible,.btn:focus-visible,.bit-width-btn:focus-visible,.preset-btn:focus-visible,.form-input:focus-visible,.step-scrubber-input:focus-visible,.table-scroll-container:focus-visible{outline:3px solid #3b82f6;outline-offset:2px}.main-content{padding-top:1.5rem;padding-bottom:2.5rem;display:flex;flex-direction:column;gap:1.25rem}.simulator-workspace{display:flex;flex-direction:column;gap:1.25rem}.card{background-color:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:8px;padding:1.25rem 1.5rem}.section-title{margin:0;font-size:1.25rem;color:var(--navy-heading)}.subsection-title{margin:0;font-size:1.12rem;color:var(--navy-heading)}.section-subtitle{margin:.25rem 0 0;font-size:.9rem;color:var(--text-secondary)}.intro-header-row,.section-header-row,.register-header-row,.result-header-row,.trace-header-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap}.intro-body{margin-top:1rem;display:flex;flex-direction:column;gap:1rem}.intro-two-col,.why-two-algorithms-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.intro-card-block,.algo-concept-box{background-color:var(--bg-light-blue);border:1px solid var(--blue-border);border-radius:6px;padding:1rem 1.15rem}.intro-card-block h3,.algo-concept-box h3{margin:0 0 .5rem;font-size:1.02rem;color:var(--navy-heading)}.intro-card-block p,.algo-concept-box p{margin:.4rem 0;font-size:.92rem}.concept-formula{margin:.4rem 0;padding:.45rem .75rem;background-color:#fff;border:1px solid var(--border-subtle);border-radius:4px;font-family:var(--font-mono);font-size:.88rem;color:var(--navy-heading);overflow-x:auto}.register-glossary{margin:0;display:flex;flex-direction:column;gap:.5rem}.glossary-item dt{font-weight:700;font-size:.9rem;color:var(--navy-heading)}.glossary-item dd{margin:.1rem 0 0;font-size:.86rem;color:var(--text-secondary)}.algo-concept-box ul{margin:.4rem 0;padding-left:1.25rem;font-size:.9rem}.algo-hence{margin-top:.55rem!important;padding-top:.45rem;border-top:1px solid var(--blue-border);color:var(--navy-heading)}.unsigned-scope-badge{background-color:var(--bg-highlight-blue);color:var(--blue-primary);border:1px solid var(--blue-border);font-size:.82rem;font-weight:600;padding:.3rem .7rem;border-radius:4px}.input-form{margin-top:1rem;display:flex;flex-direction:column;gap:1rem}.input-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.form-group{display:flex;flex-direction:column;gap:.35rem}.form-label{font-size:.9rem;font-weight:600;color:var(--navy-heading)}.form-input{font-family:var(--font-mono);font-size:1rem;padding:.55rem .75rem;border:1px solid var(--border-subtle);border-radius:6px;color:var(--navy-heading);background-color:#fff}.form-input.input-has-error{border-color:var(--red-text);background-color:var(--red-bg)}.input-helper{font-size:.8rem;color:var(--text-secondary)}.bit-width-group{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}.bit-width-btn{font-family:var(--font-sans);font-size:.9rem;font-weight:600;padding:.55rem .5rem;border:1px solid var(--blue-primary);background-color:#fff;color:var(--blue-primary);border-radius:6px;cursor:pointer}.bit-width-btn:hover{background-color:var(--bg-highlight-blue)}.bit-width-btn.active{background-color:var(--blue-primary);color:#fff}.preset-and-actions-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;padding-top:.5rem;border-top:1px solid var(--border-subtle)}.presets-bar{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}.presets-label{font-size:.88rem;font-weight:600;color:var(--navy-heading)}.preset-buttons{display:flex;flex-wrap:wrap;gap:.4rem}.preset-btn{font-family:var(--font-mono);font-size:.85rem;font-weight:600;padding:.35rem .7rem;border-radius:4px;border:1px solid var(--blue-border);background-color:var(--bg-light-blue);color:var(--navy-heading);cursor:pointer}.preset-btn:hover{background-color:var(--bg-highlight-blue)}.preset-btn.active{background-color:var(--blue-primary);border-color:var(--blue-primary);color:#fff}.action-buttons{display:flex;gap:.6rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:var(--font-sans);font-size:.92rem;font-weight:600;padding:.55rem 1.05rem;border-radius:6px;border:1px solid transparent;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.btn:disabled{opacity:.48;cursor:not-allowed}.btn-primary{background-color:var(--blue-primary);color:#fff;border-color:var(--blue-primary)}.btn-primary:hover:not(:disabled){background-color:var(--blue-primary-hover)}.btn-secondary{background-color:var(--bg-light-blue);color:var(--navy-heading);border-color:var(--blue-border)}.btn-secondary:hover:not(:disabled){background-color:var(--bg-highlight-blue)}.btn-outline{background-color:#fff;color:var(--blue-primary);border-color:var(--blue-primary)}.btn-outline:hover:not(:disabled),.btn-outline.active{background-color:var(--bg-highlight-blue)}.btn-sm{font-size:.82rem;padding:.35rem .75rem}.btn-control{background-color:#fff;color:var(--navy-heading);border-color:var(--border-subtle)}.btn-control:hover:not(:disabled){background-color:var(--bg-light-blue);border-color:var(--blue-primary)}.btn-control.btn-primary{background-color:var(--blue-primary);color:#fff;border-color:var(--blue-primary)}.btn-control.btn-primary:hover:not(:disabled){background-color:var(--blue-primary-hover)}.btn-autoplay{border-color:var(--blue-primary);color:var(--blue-primary)}.btn-pause{background-color:var(--bg-highlight-blue);border-color:var(--blue-primary);color:var(--navy-heading)}.validation-error-box{margin-top:1rem;padding:.85rem 1rem;background-color:var(--red-bg);border:1px solid var(--red-border);border-left:4px solid var(--red-text);border-radius:6px;color:var(--red-text)}.validation-error-title{font-weight:700;font-size:.95rem;margin-bottom:.25rem}.validation-error-text{margin:0;white-space:pre-line;font-size:.9rem}.initial-setup-summary{margin-top:1rem;padding:.7rem .9rem;background-color:var(--bg-light-blue);border:1px solid var(--blue-border);border-radius:6px;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}.setup-chip{display:flex;align-items:center;gap:.4rem;font-size:.86rem}.setup-chip-label{color:var(--text-secondary);font-weight:600}.mono-value{font-family:var(--font-mono);font-weight:700;color:var(--navy-heading)}.setup-chip-dec{color:var(--text-secondary)}.simulation-controls{background-color:var(--bg-light-blue);border-color:var(--blue-border)}.controls-progress-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;margin-bottom:.6rem}.progress-titles{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem}.progress-cycle-pill{background-color:var(--blue-primary);color:#fff;font-size:.82rem;font-weight:700;padding:.22rem .65rem;border-radius:4px}.progress-step-title{font-weight:700;font-size:1.02rem;color:var(--navy-heading)}.progress-step-counter{font-size:.88rem;color:var(--text-secondary)}.progress-bar-track{width:100%;height:8px;background-color:#dbeafe;border-radius:4px;overflow:hidden;margin-bottom:.9rem}.progress-bar-fill{height:100%;background-color:var(--blue-primary);transition:width .2s ease}.controls-button-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem}.controls-primary-group,.controls-secondary-group{display:flex;flex-wrap:wrap;gap:.5rem}.step-scrubber-row{margin-top:.85rem;display:flex;align-items:center;gap:.75rem}.scrubber-label{font-size:.82rem;font-weight:600;color:var(--text-secondary);white-space:nowrap}.step-scrubber-input{width:100%;accent-color:var(--blue-primary);cursor:pointer}.register-badges{display:flex;flex-wrap:wrap;gap:.5rem}.badge{font-size:.8rem;font-weight:700;padding:.25rem .65rem;border-radius:4px}.badge-cycle{background-color:var(--bg-highlight-blue);color:var(--blue-primary);border:1px solid var(--blue-border)}.badge-positive,.tag-positive{background-color:var(--green-bg);color:var(--green-text);border:1px solid var(--green-border)}.badge-negative,.tag-negative{background-color:var(--red-bg);color:var(--red-text);border:1px solid var(--red-border)}.sign-text-tag{display:inline-block;font-size:.75rem;font-weight:700;padding:.15rem .45rem;border-radius:4px;letter-spacing:.02em}.register-table-wrapper{margin-top:.85rem;overflow-x:auto}.register-box-table{width:100%;border-collapse:collapse;border:1px solid var(--blue-border)}.register-box-table th{background-color:var(--bg-light-blue);border:1px solid var(--blue-border);padding:.6rem .75rem;text-align:center}.reg-col-title{display:block;font-size:1.05rem;font-weight:700;color:var(--navy-heading)}.reg-col-sub{display:block;font-size:.76rem;font-weight:500;color:var(--text-secondary)}.reg-cell{border:1px solid var(--blue-border);padding:.85rem .75rem;text-align:center;vertical-align:middle;background-color:#fff}.reg-cell-highlight{background-color:var(--bg-highlight-blue)}.binary-bits-display{font-family:var(--font-mono);font-size:1.35rem;font-weight:700;color:var(--navy-heading);display:inline-flex;align-items:center;gap:.22rem;letter-spacing:.05em}.sign-bit-pill{display:inline-block;padding:.08rem .38rem;border-radius:4px;border:1.5px solid transparent}.sign-bit-positive{background-color:var(--green-bg);color:var(--green-text);border-color:var(--green-border)}.sign-bit-negative{background-color:var(--red-bg);color:var(--red-text);border-color:var(--red-border)}.sign-bit-emphasized{box-shadow:0 0 0 2px var(--blue-primary)}.q0-bit-pill{display:inline-block;padding:.08rem .38rem;border-radius:4px;background-color:var(--bg-light-blue);border:1.5px solid var(--blue-border);color:var(--blue-primary)}.q0-bit-active{background-color:var(--blue-primary);border-color:var(--blue-primary);color:#fff}.reg-meta-row{margin-top:.45rem;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.4rem;font-size:.8rem;color:var(--text-secondary)}.q0-badge-decided{font-family:var(--font-mono);font-size:1.05rem;font-weight:700;color:var(--blue-primary);background-color:var(--bg-highlight-blue);border:1px solid var(--blue-border);padding:.25rem .6rem;border-radius:4px}.q0-badge-pending{font-size:.85rem;color:var(--text-secondary)}.count-number{font-family:var(--font-mono);font-size:1.4rem;font-weight:700;color:var(--navy-heading)}.step-explanation-header{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:.75rem}.step-kicker{display:block;font-size:.8rem;font-weight:700;text-transform:uppercase;color:var(--blue-primary);letter-spacing:.04em}.step-main-title{margin:.15rem 0 0;font-size:1.2rem;color:var(--navy-heading)}.step-decision-badges{display:flex;align-items:center;flex-wrap:wrap;gap:.45rem}.q0-decision-pill,.restored-pill{font-family:var(--font-mono);font-size:.78rem;font-weight:700;padding:.2rem .55rem;border-radius:4px;background-color:var(--bg-highlight-blue);color:var(--blue-primary);border:1px solid var(--blue-border)}.teacher-explanation-quote{margin:.9rem 0;padding:.85rem 1.1rem;background-color:var(--bg-light-blue);border-left:4px solid var(--blue-primary);border-radius:4px;color:var(--navy-heading);font-size:.98rem}.teacher-explanation-quote p{margin:0}.step-bullet-list{margin:.5rem 0 .9rem;padding-left:1.35rem;color:var(--text-primary);font-size:.92rem}.step-bullet-list li{margin-bottom:.28rem}.teaching-visual-box{margin-top:1rem;background-color:var(--bg-pale-indigo);border:1px solid var(--blue-border);border-radius:6px;padding:1rem 1.15rem}.visual-box-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;margin-bottom:.85rem}.visual-box-tag{font-weight:700;font-size:.9rem;color:var(--navy-heading)}.visual-box-summary{font-size:.85rem;color:var(--text-secondary)}.shift-diagram{display:flex;flex-direction:column;align-items:center;gap:.55rem;background-color:#fff;border:1px solid var(--border-subtle);border-radius:6px;padding:.9rem 1rem}.shift-state-block{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;justify-content:center}.shift-state-caption{font-size:.85rem;font-weight:600;color:var(--text-secondary);min-width:90px}.shift-registers-pair{display:inline-flex;align-items:center;gap:.65rem;font-family:var(--font-mono)}.shift-reg-col{display:flex;flex-direction:column;align-items:center}.shift-reg-label{font-size:.75rem;font-weight:700;color:var(--text-secondary)}.shift-binary-code{font-size:1.2rem;font-weight:700;color:var(--navy-heading);letter-spacing:.08em}.shift-pipe{font-size:1.3rem;color:var(--blue-primary);font-weight:700}.bit-crossing{background-color:var(--blue-primary);color:#fff;padding:.05rem .3rem;border-radius:3px}.bit-vacated{background-color:var(--bg-highlight-blue);border:1px dashed var(--blue-primary);color:var(--blue-primary);padding:.05rem .3rem;border-radius:3px}.bit-discarded{opacity:.55;text-decoration:line-through}.shift-arrow-block{display:flex;align-items:center;gap:.65rem;color:var(--blue-primary);font-weight:700;font-size:.88rem}.shift-arrow-detail{font-weight:500;color:var(--text-secondary)}.visual-box-note{margin:.75rem 0 0;font-size:.88rem;color:var(--text-primary)}.arithmetic-columns{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}.vertical-math-card{background-color:#fff;border:1px solid var(--border-subtle);border-radius:6px;padding:.85rem 1rem}.vertical-math-caption{font-size:.8rem;font-weight:700;color:var(--text-secondary);text-transform:uppercase;margin-bottom:.5rem}.vertical-math-grid{font-family:var(--font-mono);display:inline-flex;flex-direction:column;gap:.25rem}.math-row{display:grid;grid-template-columns:56px auto auto;align-items:center;gap:.75rem}.math-label{font-weight:700;color:var(--text-secondary)}.math-bits{font-size:1.15rem;font-weight:700;color:var(--navy-heading);letter-spacing:.08em}.math-dec{font-size:.82rem;color:var(--text-secondary)}.math-divider{color:var(--text-secondary);letter-spacing:.05em}.math-result-row .math-label{color:var(--blue-primary)}.math-msb-negative{background-color:var(--red-bg);color:var(--red-text);border:1px solid var(--red-border);padding:0 .22rem;border-radius:3px}.math-msb-positive{background-color:var(--green-bg);color:var(--green-text);border:1px solid var(--green-border);padding:0 .22rem;border-radius:3px}.result-view-complete{border-color:var(--blue-primary);background-color:var(--bg-light-blue)}.completion-pill{background-color:var(--green-bg);color:var(--green-text);border:1px solid var(--green-border);font-size:.8rem;font-weight:700;padding:.25rem .65rem;border-radius:4px}.result-cards-grid{margin-top:.9rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}.result-metric-box{background-color:#fff;border:1px solid var(--blue-border);border-radius:6px;padding:.85rem 1rem}.result-metric-label{display:block;font-size:.8rem;font-weight:700;text-transform:uppercase;color:var(--text-secondary);margin-bottom:.35rem}.result-metric-value{display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap}.mono-large{font-family:var(--font-mono);font-size:1.3rem;font-weight:700;color:var(--navy-heading)}.equals-sign{color:var(--text-secondary)}.decimal-large{font-size:1.25rem;color:var(--blue-primary)}.result-statement-text{font-size:1.12rem;color:var(--navy-heading)}.final-correction-callout{margin-top:.85rem;padding:.7rem .95rem;background-color:#fff;border:1px solid var(--blue-border);border-left:4px solid var(--blue-primary);border-radius:4px;font-size:.9rem}.verification-panel{margin-top:.9rem;background-color:#fff;border:1px solid var(--border-subtle);border-radius:6px;padding:.9rem 1rem}.verification-checks-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.verification-formula-label{display:block;font-size:.8rem;font-weight:700;color:var(--text-secondary)}.verification-formula{font-size:.9rem;font-weight:600;color:var(--navy-heading);margin:.15rem 0}.verification-equation code{font-family:var(--font-mono);font-size:.98rem;font-weight:700;color:var(--blue-primary)}.verified-badge-banner{margin-top:.8rem;padding:.5rem .85rem;background-color:var(--green-bg);border:1px solid var(--green-border);color:var(--green-text);font-weight:700;font-size:.9rem;border-radius:4px;text-align:center}.trace-count-badge{background-color:var(--bg-light-blue);border:1px solid var(--blue-border);color:var(--navy-heading);font-size:.8rem;font-weight:700;padding:.25rem .65rem;border-radius:4px}.table-scroll-container{margin-top:.85rem;width:100%;overflow-x:auto;border:1px solid var(--blue-border);border-radius:6px}.trace-table,.comparison-table{width:100%;border-collapse:collapse;font-size:.88rem}.trace-table th,.comparison-table th{background-color:var(--blue-primary);color:#fff;font-weight:700;text-align:left;padding:.65rem .75rem;white-space:nowrap}.trace-table td,.comparison-table td{padding:.6rem .75rem;border-top:1px solid var(--border-subtle);white-space:nowrap}.comparison-table td{white-space:normal}.comparison-table tbody tr:nth-child(2n){background-color:var(--bg-light-blue)}.trace-row{cursor:pointer}.trace-row:hover{background-color:var(--bg-light-blue)}.trace-row-active{background-color:var(--bg-highlight-blue)!important}.trace-cycle-cell{font-weight:700;color:var(--navy-heading)}.trace-table code{font-family:var(--font-mono);font-weight:600;color:var(--navy-heading)}.trace-final-code{font-weight:700!important;color:var(--blue-primary)!important}.trace-dec-sub{font-size:.78rem;color:var(--text-secondary)}.trace-q0{font-family:var(--font-mono);font-size:.95rem;color:var(--blue-primary)}.trace-restored-yes{color:var(--blue-primary);font-weight:600}.trace-restored-no{color:var(--text-secondary)}.all-microsteps-panel{margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--border-subtle)}.all-steps-heading{margin:0 0 .75rem;color:var(--navy-heading);font-size:1rem}.all-steps-list{display:flex;flex-direction:column;gap:.65rem}.all-step-item{padding:.75rem .95rem;border:1px solid var(--border-subtle);border-radius:6px;background-color:#fff;cursor:pointer}.all-step-item:hover{background-color:var(--bg-light-blue)}.all-step-item-active{background-color:var(--bg-highlight-blue);border-color:var(--blue-primary)}.all-step-item-top{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:.35rem}.all-step-badge{font-size:.76rem;font-weight:700;background-color:var(--bg-light-blue);border:1px solid var(--blue-border);color:var(--blue-primary);padding:.12rem .45rem;border-radius:4px}.all-step-title{font-size:.92rem;color:var(--navy-heading)}.all-step-registers{display:flex;flex-wrap:wrap;gap:.85rem;font-size:.84rem;color:var(--text-secondary);margin-bottom:.3rem}.all-step-registers code{font-family:var(--font-mono);font-weight:700;color:var(--navy-heading)}.all-step-desc{margin:0;font-size:.88rem;color:var(--text-primary)}.site-footer{border-top:1px solid var(--border-subtle);background-color:var(--bg-light-blue);padding:1.15rem 0;text-align:center;font-size:.86rem;color:var(--text-secondary)}@media(max-width:900px){.intro-two-col,.why-two-algorithms-grid,.input-grid,.result-cards-grid,.verification-checks-grid{grid-template-columns:1fr}}@media(max-width:640px){.container{padding:0 .85rem}.card{padding:1rem}.site-title{font-size:1.55rem}.algorithm-mode-selector{width:100%;flex-direction:column}.mode-tab-btn,.controls-primary-group,.controls-secondary-group,.action-buttons{width:100%}.controls-primary-group .btn,.controls-secondary-group .btn,.action-buttons .btn{flex:1 1 calc(50% - .5rem);text-align:center}.binary-bits-display{font-size:1.1rem}}