:root{font-family:Inter,"Microsoft YaHei",system-ui,sans-serif;color:#e8eef4;background:#0a1118;--line:#2b3e4e;--panel:#111c26;--panel2:#172632;--accent:#3ebcf5;--stage-w:1520px;--stage-h:1900px;--wire-w:140px;--face-w:344px;--row-pitch:42px;--cap-left:157px;--cap-top:51px;--cap-bottom:14px;--link-x:125px;--link-y:10px;--link-open-shift:30px;--number-x:3px;--number-y:16px;--number-size:9px;--jumper-x:366px;--jumper-r-x:326px;--code-size:22px;--code-y:9px}*{box-sizing:border-box}body{margin:0}.bar{height:66px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid var(--line);background:#0d1720}.bar h1{margin:0;font-size:17px}.bar p{margin:4px 0 0;color:#91a4b4;font-size:11px}.sim-link,.actions button,.import-label{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:6px 9px;border:1px solid var(--line);border-radius:5px;background:var(--panel2);color:inherit;text-decoration:none;font-size:11px;cursor:pointer}.layout{display:grid;grid-template-columns:292px minmax(480px,1fr) 280px;height:calc(100vh - 66px);min-width:1000px}.controls,.readout{overflow:auto;background:#0e1821}.controls{border-right:1px solid var(--line);padding:12px}.readout{border-left:1px solid var(--line);padding:12px}.control-group{padding:0 0 12px;margin-bottom:12px;border-bottom:1px solid var(--line)}.control-group h2,.readout h2{margin:0 0 8px;font-size:12px}.control{display:grid;grid-template-columns:1fr 58px;gap:7px;align-items:center;margin:8px 0}.control label{font-size:10px;color:#b7c7d3}.control input[type=number]{width:58px;padding:5px;border:1px solid #385064;border-radius:4px;background:#091118;color:#f2f6f9;font-size:10px}.control input[type=range]{grid-column:1/3;width:100%;accent-color:var(--accent)}.actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.import-label{position:relative;overflow:hidden}.import-label input{position:absolute;inset:0;opacity:0;cursor:pointer}.preview-panel{min-width:0;display:flex;flex-direction:column;background:#081017}.preview-head{height:40px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid var(--line);font-size:11px}.preview-head span{color:#75d6a0}.preview-viewport{flex:1;overflow:auto;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:24px 24px;padding:16px}#stageWrap{position:relative;transform-origin:top left}#stage{position:absolute;left:0;top:0;width:var(--stage-w);height:var(--stage-h);transform:scale(.5);transform-origin:top left}.mock-module{position:absolute;width:170px;padding:8px;border:1px solid #3a5061;border-radius:5px;background:#14232e;color:#b8cad7;font-size:10px}.mock-module strong{display:block;color:#fff;margin-bottom:5px}.mock-module i{display:block;height:8px;margin:4px 0;background:#263c4a}.mock-source{left:var(--source-x);top:var(--source-y)}.mock-component{left:var(--component-x);top:var(--component-y)}.mock-device{left:var(--device-x);top:var(--device-y)}.preview-block{position:absolute;width:calc(var(--face-w) + var(--wire-w) + var(--wire-w));border:1px solid #425968;background:#111c25}.preview-block.a{left:var(--block-a-x);top:var(--block-a-y)}.preview-block.b{left:var(--block-b-x);top:var(--block-b-y)}.preview-title{height:26px;padding:7px 9px;border-bottom:1px solid #425968;font-size:10px;font-weight:700}.preview-assembly{position:relative;width:calc(var(--face-w) + var(--wire-w) + var(--wire-w));padding:var(--cap-top) 0 var(--cap-bottom)}.preview-cap{position:absolute;left:var(--cap-left);width:310px;pointer-events:none;z-index:3}.preview-cap.top{top:0;height:51px}.preview-cap.bottom{position:relative;height:14px;display:block}.preview-code{position:absolute;z-index:4;top:var(--code-y);left:var(--cap-left);width:310px;text-align:center;color:#f7f9fb;font-size:var(--code-size);font-weight:700;line-height:1}.preview-row{display:grid;grid-template-columns:var(--wire-w) var(--face-w) var(--wire-w);height:var(--row-pitch);position:relative}.preview-face{position:relative;height:47px}.preview-face>img{display:block;width:var(--face-w);height:47px}.preview-wire{position:relative;height:47px}.preview-wire>img{position:absolute;top:12px;width:var(--wire-w)}.preview-wire.left>img{left:0}.preview-wire.right>img{right:0}.preview-wire b{position:absolute;top:17px;z-index:3;max-width:83px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#2d3133;font-size:7px}.preview-wire.left b{left:34px}.preview-wire.right b{right:34px}.preview-number{position:absolute;top:var(--number-y);z-index:4;width:17px;text-align:center;color:#172025;font-size:var(--number-size);font-weight:800}.preview-number.left{left:var(--number-x)}.preview-number.right{right:var(--number-x)}.preview-link{position:absolute;left:var(--link-x);top:var(--link-y);width:94px;height:26px}.preview-link img{width:94px;height:26px}.preview-link.open{transform:translateX(var(--link-open-shift));filter:drop-shadow(-4px 0 0 #ff6871)}.preview-link.open:after{content:"";position:absolute;left:-25px;top:11px;width:19px;height:3px;background:#ff6871}.preview-jumper{position:absolute;left:var(--jumper-x);width:36px;height:85px;z-index:9}.preview-jumper.r{left:var(--jumper-r-x)}.preview-jumper img{position:absolute;width:36px;left:0}.preview-jumper img:first-child{top:0;height:32px}.preview-jumper img:last-child{bottom:0;height:38px}.readout pre{margin:0;white-space:pre-wrap;word-break:break-word;color:#adc2d0;font:10px/1.55 ui-monospace,Consolas,monospace}@media(max-width:860px){.bar{height:auto;min-height:60px;padding:9px 12px}.bar p{display:none}.layout{display:flex;flex-direction:column;min-width:0;height:auto}.controls,.readout{border:0}.preview-panel{height:650px}.readout{min-height:260px}}
.preview-actions{display:flex;align-items:center;gap:4px}.preview-actions button{min-width:26px;height:25px;border:1px solid var(--line);border-radius:4px;background:var(--panel2);color:inherit;font-size:12px;cursor:pointer}.preview-actions output{min-width:39px;text-align:center;color:#a9bdcb;font-size:10px}.preview-viewport{overflow:hidden;cursor:grab;touch-action:none}.preview-viewport.panning{cursor:grabbing}#stageWrap{width:100%;height:100%;min-width:100%;min-height:100%}#stage{transform-origin:0 0}
.preview-wire b{z-index:3;width:94px;overflow:hidden;color:#2d3133;font-size:var(--wire-label-size,7px);font-weight:700;line-height:1.06;white-space:nowrap}.preview-wire b span{display:block;overflow:hidden;text-overflow:ellipsis}.preview-wire.left b{left:var(--wire-label-left-x,34px);top:var(--wire-label-left-y,17px);text-align:left}.preview-wire.right b{right:var(--wire-label-right-x,34px);top:var(--wire-label-right-y,17px);text-align:right}.preview-wire.inserted>img{opacity:0!important}.preview-row-index{position:absolute;left:calc(var(--wire-w) - 16px);top:11px;z-index:12;width:15px;color:#77d5ff;font-size:9px;font-weight:700;text-align:center;pointer-events:none}.jumper-layer-label{position:absolute;left:40px;z-index:12;width:38px;padding:1px 2px;background:rgba(5,17,25,.86);color:#8bdeff;font-size:8px;line-height:1;text-align:center;white-space:nowrap;pointer-events:none}.jumper-layer-label.top-label{top:0}.jumper-layer-label.bottom-label{transform:translateY(4px)}
.preview-wire.inserted.left>img,.preview-wire.inserted.left>b{transform:translate(var(--wire-insert-left-x,0px),var(--wire-insert-left-y,0px))}.preview-wire.inserted.right>img,.preview-wire.inserted.right>b{transform:translate(var(--wire-insert-right-x,0px),var(--wire-insert-right-y,0px))}.preview-wire.pulled.left>img,.preview-wire.pulled.left>b{transform:translate(var(--wire-pull-left-x,0px),var(--wire-pull-left-y,0px))}.preview-wire.pulled.right>img,.preview-wire.pulled.right>b{transform:translate(var(--wire-pull-right-x,0px),var(--wire-pull-right-y,0px))}
.preview-jumper-group{position:absolute;left:var(--jumper-x);z-index:9;width:36px;pointer-events:none}.preview-jumper-group.r{left:var(--jumper-r-x)}.preview-jumper-group img{position:absolute;left:0;width:36px}.preview-jumper-group .top{height:32px;transform:translate(var(--jumper-top-x,0px),var(--jumper-top-y,0px))}.preview-jumper-group .middle{height:43px;transform:translate(var(--jumper-middle-x,0px),var(--jumper-middle-y,0px))}.preview-jumper-group .bottom{height:38px;transform:translate(var(--jumper-bottom-x,0px),var(--jumper-bottom-y,0px))}.preview-assembly{background:#edf0ef}.preview-face{z-index:3}.preview-wire{z-index:1}.preview-wire b{width:84px;text-align:center;line-height:1;white-space:nowrap}.preview-wire.left b{left:var(--wire-label-left-x,28px);top:var(--wire-label-left-y,16px)}.preview-wire.right b{right:var(--wire-label-right-x,28px);top:var(--wire-label-right-y,16px)}.preview-wire.inserted>img{opacity:1!important}