/* The workbench inherits the interactive site's poster tokens. */
.circuit-atelier *{box-sizing:border-box}
.circuit-atelier{font-size:16px;line-height:1.6}
.circuit-atelier [hidden]{display:none!important}
.circuit-atelier button,.circuit-atelier input,.circuit-atelier textarea{font:inherit}
.circuit-atelier button{cursor:pointer;border:2px solid var(--line);border-radius:var(--radius-sm);background:var(--panel-strong);color:var(--text);padding:7px 11px;font-size:.875rem;font-weight:700;line-height:1.45;transition:transform .12s,background .12s;}
.circuit-atelier button:hover:not(:disabled){background:var(--accent-soft);transform:translateY(-1px)}
.circuit-atelier button:active:not(:disabled){transform:translateY(1px)}
.circuit-atelier button:disabled{opacity:.42;cursor:not-allowed}
.circuit-atelier button.poster-btn-primary{background:var(--accent);color:var(--panel-strong)}
.circuit-atelier button.poster-btn-primary:hover{background:var(--accent-dark)}
.circuit-atelier .atelier-hero{padding:24px max(24px,calc((100vw - 1472px)/2));display:flex;align-items:center;justify-content:space-between;gap:24px}
.atelier-hero h1{font-size:clamp(1.8rem,3vw,2.7rem)}
.atelier-hero .lede{margin:10px 0 0;font-size:1rem}
.time-note{max-width:440px;font-size:.875rem;display:grid;gap:5px}
.time-note b{color:var(--green)}
.time-note small{font-size:.75rem;color:var(--muted-soft);line-height:1.6}
main.ex-main.atelier-main{max-width:95rem;padding:20px 24px 32px}
.workbook-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;font-size:.875rem;font-weight:700}
.top-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#save-state{font-size:.75rem;color:var(--muted);font-weight:400}
#journey{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin:0 0 24px}
#journey button{position:relative;display:flex;align-items:center;gap:9px;text-align:left;background:var(--panel);min-height:65px;padding:9px;box-shadow:var(--shadow-sm)}
#journey button b{font-size:.875rem;display:block;line-height:1.35}
#journey button small{display:block;font-size:.75rem;font-weight:400;color:var(--muted);margin-top:3px}
#journey .step-number{display:grid;place-items:center;min-width:28px;height:28px;border:2px solid var(--line);border-radius:50%;background:var(--panel-strong);font-family:var(--font-mono)}
#journey button.active{background:var(--accent);color:var(--panel-strong)}
#journey button.active small{color:var(--accent-soft)}
#journey button.active .step-number{background:var(--green);color:var(--text)}
#journey button.done:not(.active){background:var(--accent-soft)}
#journey .step-check{position:absolute;right:5px;top:1px;color:var(--text);font-size:.75rem;border-radius:50%;background:var(--green);width:18px;text-align:center}
.workspace{display:grid;grid-template-columns:290px minmax(0,1fr);gap:20px;align-items:start}
.guide{display:grid;gap:20px;min-width:0}
.guide .poster-panel{padding:18px}
.section-label{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.8125rem;font-weight:700}
.section-label>small{font-size:.75rem;font-weight:400;color:var(--muted)}
.brief h2{font-size:1.35rem;line-height:1.5;letter-spacing:-.03em;margin:16px 0 10px}
.brief>p{font-size:.9375rem;line-height:1.85;color:var(--muted);margin:0 0 14px}
.circuit-atelier .text-button{border:0;padding:5px 0;background:transparent;color:var(--accent);text-align:left;box-shadow:none}
.circuit-atelier summary{cursor:pointer;font-weight:700;font-size:.875rem;padding:12px 0}
#specification{border-top:2px solid var(--line);margin-top:15px}
#specification summary>span{display:block;font-weight:400;font-size:.75rem;color:var(--muted);margin-left:16px}
.spec-scroll{max-height:300px;overflow:auto;border:1px solid var(--line);border-radius:var(--radius-sm)}
.truth{width:100%;border-collapse:collapse;font-family:var(--font-mono);font-size:.8125rem;text-align:center;white-space:nowrap}
.truth th{position:sticky;top:0;background:var(--panel);z-index:1}
.truth td,.truth th{padding:6px 4px;border-bottom:1px solid var(--muted-soft);font-weight:400}
.truth th{font-weight:700}
.truth tr.current{background:var(--accent-soft);color:var(--accent-dark)}
.truth tr.current td:first-child{box-shadow:inset 4px 0 0 var(--accent)}
.truth .split{border-left:2px solid var(--line)}
.truth button{border:0;padding:0 6px;background:transparent;font-family:var(--font-mono);font-size:inherit;min-height:30px;min-width:28px}
.truth tbody tr{cursor:pointer}
.modal-note{font-size:.75rem;color:var(--muted);line-height:1.65}
.spec-rule{font-size:.875rem;color:var(--muted)}
.spec-rule code{display:block;color:var(--text);padding:8px 0}
.spec-pages{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 0;font-size:.75rem;text-align:center}
.spec-pages button{min-width:40px;min-height:36px}
.spec-pages span{line-height:1.6}
.hint-area{margin-top:10px;border-top:1px solid var(--muted-soft);padding-top:8px}
#hint-text{font-size:.875rem;margin:8px 0 0}
.collection-note{font-size:.8125rem;color:var(--muted);margin:10px 0 14px}
#collection{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.part-stamp{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:82px;border:2px dashed var(--muted-soft);border-radius:var(--radius);font-size:.75rem;line-height:1.5}
.part-stamp b{font-family:var(--font-mono);font-size:1rem}
.part-stamp small{font-size:.75rem;font-weight:400}
.circuit-atelier .part-stamp.made{background:var(--green);border:2px solid var(--line);box-shadow:0 3px 0 var(--line);padding:6px 2px}
.part-stamp.empty{color:var(--muted);background:var(--panel)}
.bench{min-width:0;overflow:hidden;background:var(--panel-strong);border:2px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.reuse-bridge{padding:12px 18px;background:var(--accent-soft);border-bottom:2px solid var(--line);display:grid;grid-template-columns:1fr auto;column-gap:15px;align-items:center}
.bridge-label{font-size:.875rem;font-weight:700}
.reuse-bridge>div{display:flex;align-items:center;gap:14px;grid-column:2;grid-row:1/3;font-family:var(--font-mono)}
.reuse-bridge p{margin:3px 0 0;font-size:.8125rem;color:var(--muted)}
.bridge-part{display:inline-block;padding:7px 11px;border:2px dashed var(--line);border-radius:var(--radius-sm);background:var(--panel-strong)}
.bridge-part.own{border-style:solid;background:var(--green);box-shadow:0 3px 0 var(--line)}
.reuse-bridge>div>strong{font-size:1.3rem}
.bench-toolbar{padding:12px 15px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line)}
.drawing-title{display:flex;align-items:baseline;gap:10px}
.drawing-title strong{font-size:1rem}
#part-count{font-size:.75rem;color:var(--muted)}
.tools{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.tools button{padding:5px 8px;font-size:.8125rem;min-height:34px}
.parts{padding:12px 15px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--panel);border-bottom:2px solid var(--line)}
.parts>.section-label{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
#palette{display:flex;flex-wrap:wrap;gap:8px;flex:1}
.circuit-atelier .part{position:relative;display:grid;grid-template-columns:38px 1fr;align-items:center;gap:0 8px;text-align:left;min-width:107px;padding:7px 10px;background:var(--panel-strong);box-shadow:0 3px 0 var(--line)}
.part svg{width:38px;height:31px;grid-row:1/3;fill:none;stroke:var(--line);stroke-width:3}
.part strong{font-size:.875rem}
.part small{font-size:.75rem;font-weight:400;color:var(--muted)}
.circuit-atelier .part.selected{background:var(--accent-soft);border-color:var(--accent)}
.circuit-atelier .part.reference{border-style:dashed}
.module-tag{position:absolute;right:3px;top:-9px;font-size:.75rem;background:var(--green);border:1px solid var(--line);padding:0 3px;line-height:1.4}
.part.reference .module-tag{background:var(--panel)}
.extra-parts{position:relative;max-width:180px}
.extra-parts summary{font-size:.8125rem;padding:6px 0}
.extra-parts p{font-size:.75rem;color:var(--muted)}
#io-palette{display:grid;grid-template-columns:1fr 1fr;gap:5px}
#io-palette .part{display:block;min-width:0;font-size:.8125rem;padding:6px}
#module-help:empty{display:none}
#module-help{flex-basis:100%;display:flex;gap:12px;align-items:center}
#module-help button{border-style:dashed;font-size:.8125rem}
#module-help p{font-size:.8125rem;color:var(--muted);margin:0}
.canvas-wrap{height:clamp(390px,36vw,560px);overflow:auto;background:var(--panel-strong);position:relative;overscroll-behavior:contain}
#canvas{display:block;width:100%;height:100%;min-width:850px;touch-action:pan-x pan-y}
#canvas.placing{cursor:crosshair}
.node-shape,.module-body{fill:var(--panel-strong);stroke:var(--line);stroke-width:2.5;stroke-linejoin:round}
.module-body{fill:var(--accent-soft)}
.module-body.reference{fill:var(--panel);stroke-dasharray:8 5}
.module-rule{stroke:var(--line);stroke-width:1}
.node-label,.gate-caption{font-size:19px;fill:var(--text);font-family:var(--font-mono);font-weight:700;pointer-events:none}
.module-name{font-family:var(--font-mono);font-size:23px;font-weight:700;fill:var(--text);pointer-events:none}
.module-provenance{font-size:15px;fill:var(--muted);pointer-events:none}
.port-text{font-size:18px;fill:var(--text);font-family:var(--font-mono);pointer-events:none}
.part-body{cursor:grab;touch-action:none}
.part-body:active{cursor:grabbing}
.selection{fill:transparent;stroke:none;pointer-events:none}
.node.selected .selection{stroke:var(--accent);stroke-width:3;stroke-dasharray:7 5}
.pin{cursor:crosshair;touch-action:none}
.pin .target{fill:transparent;stroke:none}
.pin .ring{fill:transparent;stroke:transparent;stroke-width:4;pointer-events:none}
.pin .visible{fill:var(--panel-strong);stroke:var(--line);stroke-width:2;pointer-events:none}
.pin[data-value="0"] .visible{fill:var(--muted-soft)}
.pin[data-value="1"] .visible{fill:var(--accent)}
.pin[data-value="?"] .visible{stroke:var(--red);stroke-dasharray:3 2}
.pin:hover .ring,.pin.pending .ring{stroke:var(--accent);fill:var(--accent-soft)}
.pin.pending .visible{fill:var(--accent)}
.pin.can-connect .ring{stroke:var(--green);stroke-width:3}
.wire-line{fill:none;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;pointer-events:none;vector-effect:non-scaling-stroke}
.wire[data-value="0"] .wire-line{stroke:var(--muted-soft)}
.wire[data-value="1"] .wire-line{stroke:var(--accent);stroke-width:4}
.wire[data-value="?"] .wire-line{stroke:var(--red);stroke-dasharray:6 5}
.wire-halo{fill:none;stroke:var(--panel-strong);stroke-width:8;pointer-events:none;vector-effect:non-scaling-stroke}
.wire-hit{fill:none;stroke:transparent;stroke-width:16;cursor:pointer;vector-effect:non-scaling-stroke}
.wire.selected .wire-line{stroke:var(--red);stroke-width:4}
#pending-wire{fill:none;stroke:var(--accent);stroke-width:2;stroke-dasharray:6 5;vector-effect:non-scaling-stroke}
.signal-button rect{fill:var(--panel);stroke:var(--line);stroke-width:2}
.signal-button[data-value="1"] rect{fill:var(--accent)}
.signal-button text{font-size:26px;font-weight:700;fill:var(--text);pointer-events:none}
.signal-button[data-value="1"] text{fill:var(--panel-strong)}
.signal-button[data-toggle]{cursor:pointer}
.out-value{font-size:27px;font-weight:700;fill:var(--text);font-family:var(--font-mono);pointer-events:none}
.canvas-note-large{font-size:28px;font-weight:700;fill:var(--muted)}
.canvas-note{font-size:20px;fill:var(--muted)}
.canvas-status{position:sticky;bottom:0;z-index:3;padding:12px 15px;border-top:2px solid var(--line);background:var(--panel);font-size:.875rem}
.instruction-row{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:32px}
#cancel-wire{flex:none;background:var(--red-soft)}
.legend{display:flex;gap:18px;margin-top:7px;color:var(--muted);font-size:.75rem}
.legend span{display:flex;align-items:center;gap:6px}
.legend i{display:inline-block;width:22px;border-top:2.5px solid var(--muted-soft)}
.legend .one{border-color:var(--accent);border-width:4px}
.legend .unknown{border-color:var(--red);border-style:dashed}
.inspector{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 15px;border-top:1px solid var(--muted-soft);font-size:.875rem}
.inspector-title{font-size:.8125rem;font-weight:700}
.inspector p{color:var(--muted);margin:0;font-size:.8125rem;flex:1;min-width:150px}
.inspector input{width:90px;border:1px solid var(--line);border-radius:var(--radius-sm);padding:6px}
.circuit-atelier .danger{background:var(--red-soft)}
.experiment{border-top:2px solid var(--line);padding:18px;background:var(--panel-strong)}
.experiment-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.experiment-head h3{font-size:1.05rem;margin:0}
.cases{display:flex;gap:6px;flex-wrap:wrap}
.cases button{font-size:.8125rem;background:var(--panel);padding:5px 8px}
#live-readout{display:flex;align-items:center;flex-wrap:wrap;gap:18px;padding:17px 0}
.reading{display:flex;align-items:center;gap:8px;font-family:var(--font-mono)}
.reading label{font-size:.875rem;font-weight:700}
.reading strong{font-size:1.4rem}
.read-bits{display:flex;gap:3px}
.reading small{font-size:.8125rem;color:var(--muted)}
.read-bit{min-width:32px;padding:4px!important}
.circuit-atelier .read-bit.on{background:var(--accent);color:var(--panel-strong)}
.read-divider{height:30px;border-left:2px solid var(--line)}
.result{background:var(--panel);border:2px solid var(--line);border-radius:var(--radius);padding:15px;font-size:.9375rem}
.result p{margin:5px 0;line-height:1.8}
.result.good{background:var(--accent-soft)}
.result.bad{background:var(--red-soft)}
.result-number{display:inline-block;background:var(--green);border:2px solid var(--line);border-radius:var(--radius-sm);padding:4px 9px;font-family:var(--font-mono);font-weight:700;margin:0 0 8px;transform:rotate(-2deg)}
.made-part{display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.made-part>b{font-family:var(--font-mono);font-size:1.4rem;background:var(--green);border:2px solid var(--line);padding:9px;border-radius:var(--radius);box-shadow:0 4px 0 var(--line)}
.made-part>span{flex:1;min-width:160px}
.reference-note{font-size:.8125rem;color:var(--muted);border-top:1px dashed var(--line);padding-top:6px}
.check-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.circuit-atelier .make-part{background:var(--green);box-shadow:0 4px 0 var(--line);font-size:1rem}
.circuit-atelier .make-part:hover{background:var(--green)}
.reflection{padding:0 18px 16px;border-top:2px solid var(--line);background:var(--panel)}
.reflection label{font-size:.875rem;display:block;margin:8px 0}
.reflection textarea{display:block;width:100%;resize:vertical;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--panel-strong);padding:10px;font-size:.9375rem}
.reflection p,.save-note{color:var(--muted);font-size:.8125rem}
.save-note{margin:24px 0 0;text-align:center}
#toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,20px);opacity:0;pointer-events:none;max-width:min(620px,calc(100% - 30px));width:max-content;background:var(--panel-strong);border:2px solid var(--line);border-radius:var(--radius);padding:12px 18px;box-shadow:var(--shadow);z-index:100;font-size:.9375rem;transition:opacity .15s,transform .15s}
#toast.show{opacity:1;transform:translate(-50%,0)}
dialog{color:var(--text);background:var(--panel-strong);border:2px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;max-width:1000px;width:calc(100% - 40px);max-height:90vh;overflow:auto}
dialog::backdrop{background:rgba(17,17,17,.5)}
.modal-header{display:flex;justify-content:space-between;align-items:start;gap:15px;border-bottom:2px solid var(--line);padding-bottom:15px;margin-bottom:15px}
.modal-header h2{margin:0;font-size:1.5rem}
#modal-close{font-size:1.3rem;min-width:42px}
#modal-body>svg{display:block;width:100%;min-height:230px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm)}
#modal-body>p{font-size:.9375rem}
.modal-actions{margin-top:20px;display:flex;gap:10px}
.modal-module{cursor:pointer}
.modal-module:hover .module-body{fill:var(--green)}
.error-table-wrap{max-height:60vh;overflow:auto}
.error-table-wrap td{padding:10px}
.error-table-wrap button{white-space:normal}
@media(min-width:1600px){.canvas-wrap{height:560px}}
@media(max-width:1150px){.workspace{grid-template-columns:250px minmax(0,1fr);gap:15px}main.ex-main.atelier-main{padding:16px}.guide .poster-panel{padding:14px}.reuse-bridge{grid-template-columns:1fr}.reuse-bridge>div{grid-column:1;grid-row:auto;margin:7px 0}.time-note{max-width:360px}#journey{gap:6px}#journey button{gap:6px;padding:7px}#journey button b{font-size:.8125rem}.canvas-wrap{height:460px}}
@media(max-width:1100px){.workspace{grid-template-columns:1fr}.guide{grid-template-columns:minmax(0,1fr) 260px;align-items:start}.brief h2{margin-top:10px}.brief>p{margin-bottom:8px}#specification{margin-top:8px}.spec-scroll{max-height:170px}.guide .collection{height:100%}.time-note{max-width:320px}.atelier-hero .lede{font-size:.9375rem}#journey{display:flex;overflow-x:auto;padding-bottom:8px}#journey button{flex:0 0 150px}.canvas-wrap{height:460px}.brief h2{font-size:1.25rem}.circuit-atelier .atelier-hero{padding:20px}}
@media(max-width:600px){.circuit-atelier .atelier-hero{display:block;padding:20px 16px}.time-note{max-width:none;margin-top:14px}.time-note b{display:none}.workbook-bar{flex-wrap:wrap;margin-bottom:12px}.workbook-bar>span{font-size:.8125rem}.top-actions{width:100%;justify-content:flex-end}.top-actions #save-state{margin-right:auto}.guide{grid-template-columns:1fr}.guide .collection{height:auto}.collection-note{margin-bottom:10px}#collection{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}.part-stamp{min-height:68px}.part-stamp b{font-size:.8125rem}.part-stamp span,.part-stamp small{font-size:.75rem}.circuit-atelier .part-stamp.made{padding:4px 0}main.ex-main.atelier-main{padding:14px 12px}.canvas-wrap{height:430px}#canvas{min-width:1000px}.reuse-bridge{padding:12px}.bench-toolbar,.parts{padding:10px}.drawing-title{width:100%;justify-content:space-between}.tools{gap:4px}.tools button{font-size:.75rem}.parts>.section-label{width:100%;flex-direction:row}.circuit-atelier .part{min-width:102px;flex:1;padding:6px}.extra-parts{max-width:none;width:100%}.canvas-status,.inspector{padding:12px}.instruction-row{align-items:flex-start}.experiment{padding:14px}.read-divider{display:none}#live-readout{gap:14px}.reading{gap:6px}.reflection{padding:0 14px 14px}.reuse-bridge>div{gap:10px}.bridge-part{padding:5px 8px}#module-help{flex-direction:column;align-items:flex-start;gap:6px}dialog{padding:16px;width:calc(100% - 20px)}.modal-header h2{font-size:1.2rem}.truth{font-size:.8125rem}.ex-footer{font-size:.75rem}}
@media(prefers-reduced-motion:reduce){.circuit-atelier *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

.mobile-pan{display:none}@media(max-width:600px){.mobile-pan{display:block;margin:0;padding:7px 12px;background:var(--panel);font-size:.75rem;color:var(--muted);border-bottom:1px solid var(--line)}}