*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;font-family:IBM Plex Mono,Courier New,monospace;background:#fff;color:#000;-webkit-font-smoothing:antialiased}body{overflow:hidden}.app{display:flex;flex-direction:column;height:100vh;width:100vw;overflow:hidden;background:#fff}.top-bar{display:flex;align-items:center;justify-content:space-between;padding:8px 24px;border-bottom:2px solid #000;flex-shrink:0;gap:16px}.app-title{font-size:15px;font-weight:700;letter-spacing:4px;white-space:nowrap}.mode-toggle-area{display:flex;align-items:center;gap:16px}.mode-toggle-label{font-size:10px;font-weight:700;letter-spacing:2px;opacity:.5}.mode-toggle{display:flex;border:2px solid #000;cursor:pointer;-webkit-user-select:none;user-select:none}.mode-option{padding:6px 18px;font-size:11px;font-weight:700;letter-spacing:2px;transition:background .15s,color .15s}.mode-option.active{background:#000;color:#fff}.mode-option:not(.active){background:#fff;color:#000}.cin-area{margin-left:8px}.main-area{flex:1;display:flex;align-items:center;justify-content:center;min-height:0}.input-column{flex-shrink:0;display:flex;flex-direction:column;justify-content:center;padding:12px 16px 12px 24px;gap:24px}.input-block{display:flex;flex-direction:column;gap:4px}.input-switches{display:flex;flex-direction:column;gap:6px}.input-row{display:flex;align-items:center;gap:0}.wire-line{width:70px;height:2px;background:#000;position:relative}.wire-line:after{content:"▶";position:absolute;right:-2px;top:50%;transform:translateY(-50%);font-size:8px;line-height:1;color:#000}.input-decimal{font-size:11px;font-weight:700;letter-spacing:1px;margin-top:4px;padding-left:4px;opacity:.6}.center-column{display:flex;align-items:center;justify-content:center;padding:8px 0;min-width:0}.alu-schematic{display:flex;flex-direction:column;align-items:center;gap:8px}.alu-enclosure{border:3px solid #000;padding:16px;display:flex;align-items:center;gap:0;position:relative;background:#f8f8f8}.alu-input-arrows{display:flex;flex-direction:column;gap:24px;margin-right:6px}.arrow-group{display:flex;flex-direction:column;gap:6px}.arrow-line{display:flex;align-items:center;height:10px}.arrow-line:before{content:"";display:inline-block;width:14px;height:2px;background:#000}.arrow-line .arrow-tip{font-size:9px;color:#000;line-height:1;margin-left:-1px}.alu-units{display:flex;flex-direction:column;gap:16px;position:relative}.alu-unit-box{border:2px solid #999;border-radius:8px;padding:20px 32px;text-align:center;background:#e8e8e8;transition:all .2s ease;position:relative;min-width:180px}.alu-unit-box.active{border-color:#000;border-width:3px;background:#d0d0d0;box-shadow:inset 0 0 0 1px #000}.alu-unit-box:not(.active){opacity:.45}.unit-label{font-size:13px;font-weight:700;letter-spacing:2px}.s-input-arrows{display:flex;justify-content:space-around;margin-top:8px;padding:0 16px}.s-arrow-line{display:flex;flex-direction:column;align-items:center}.arrow-tip-up,.arrow-tip-down{font-size:12px;color:#000;line-height:1}.unit-to-mux{display:flex;flex-direction:column;gap:80px;align-items:center;justify-content:center;margin:0 4px}.unit-output-line{display:flex;align-items:center;height:2px;width:30px;background:#999;position:relative;transition:background .2s}.unit-output-line.active{background:#000;height:3px}.unit-output-line .arrow-tip{position:absolute;right:-2px;font-size:10px;line-height:1;color:inherit}.unit-output-line.active .arrow-tip{color:#000}.mux-section{display:flex;flex-direction:column;align-items:center;gap:4px;position:relative}.mode-arrow{display:flex;flex-direction:column;align-items:center;gap:0}.mode-label-inline{font-size:9px;font-weight:700;letter-spacing:1px;opacity:.5}.mux-box{border:2px solid #000;padding:30px 14px;writing-mode:vertical-lr;text-orientation:mixed;font-size:12px;font-weight:700;letter-spacing:3px;background:#eee;display:flex;align-items:center;justify-content:center}.mux-label{transform:rotate(180deg)}.mux-output-arrow{display:none}.operation-badge{border:2px solid #000;padding:6px 20px;display:flex;align-items:center;gap:10px;background:#000;color:#fff}.op-label{font-size:10px;font-weight:700;letter-spacing:1px;opacity:.6}.op-text{font-size:13px;font-weight:700;letter-spacing:1px}.output-column{flex-shrink:0;display:flex;align-items:center;justify-content:flex-start;padding:12px 24px 12px 0;gap:0}.output-wire-line{width:30px;height:3px;background:#000;flex-shrink:0;position:relative}.output-wire-line:after{content:"▶";position:absolute;right:-2px;top:50%;transform:translateY(-50%);font-size:8px;color:#000}.output-panel{display:flex;flex-direction:column;gap:8px}.output-section{display:flex;flex-direction:column;gap:6px}.output-title{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;border-bottom:1px solid #000;padding-bottom:4px}.output-leds{display:flex;gap:8px;align-items:center}.output-separator{width:1px;height:30px;background:#ccc;margin:0 4px}.output-values{display:flex;flex-direction:column;gap:2px;font-size:10px;font-weight:700;letter-spacing:1px;opacity:.6}.bottom-bar{border-top:2px solid #000;padding:8px 24px;display:flex;justify-content:center;flex-shrink:0}.control-panel{display:flex;flex-direction:column;align-items:center;gap:4px}.control-switches{display:flex;gap:12px}.control-value{font-size:11px;font-weight:700;letter-spacing:1px;opacity:.6}.radio-switch{display:flex;align-items:center;gap:4px;cursor:pointer;-webkit-user-select:none;user-select:none}.radio-value{font-size:11px;font-weight:700;width:14px;text-align:center}.radio-btn{width:38px;height:38px;border-radius:50%;border:3px solid #000;display:flex;align-items:center;justify-content:center;font-family:inherit;font-size:8px;font-weight:700;letter-spacing:1px;cursor:pointer;transition:all .12s ease;padding:0}.radio-btn.off{background:#e0e0e0;color:#666;border-color:#888}.radio-btn.on{background:#000;color:#fff;border-color:#000;box-shadow:0 0 8px #0006}.radio-btn:hover{transform:scale(1.08)}.radio-label{font-size:10px;font-weight:700;letter-spacing:1px;min-width:20px}.led-container{display:flex;flex-direction:column;align-items:center;gap:2px}.led-label{font-size:8px;font-weight:700;letter-spacing:1px;opacity:.5}.led-circle{width:22px;height:22px;border-radius:50%;border:2px solid #000;transition:background-color .15s ease}.led-circle.on{background-color:#000}.led-circle.off{background-color:#fff}.led-value{font-size:10px;font-weight:700}