:root{color-scheme:light;--ink:#172033;--muted:#627087;--line:#d9e0e9;--bg:#f5f7fa;--paper:#fff;--blue:#256fd5;--blue-soft:#edf4ff;--green:#14785a;--green-soft:#e8f6f0;--orange:#d87515;--orange-soft:#fff3e4;--red:#b43b4d;--navy:#14243d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}button,input,select{font:inherit}button{touch-action:manipulation}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #8ab9f4;outline-offset:2px}.lg-app{width:min(1120px,calc(100% - 30px));margin:auto;padding:22px 0 50px}.lg-top{display:flex;justify-content:space-between;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.lg-top a{color:var(--ink);text-decoration:none}.lg-top span{color:var(--muted)}.lg-hero{display:grid;grid-template-columns:1fr auto;align-items:end;gap:30px;padding:44px 0 30px}.lg-kicker,.lg-step-label,.lg-tool-label{margin:0;color:var(--blue);font-size:.72rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.lg-hero h1{margin:4px 0 9px;font-size:clamp(2.7rem,7vw,5.4rem);line-height:.96;letter-spacing:-.06em}.lg-hero p:last-child{margin:0;color:var(--muted);font-size:1.08rem}.lg-hero-visual{display:flex;align-items:center}.lg-hero-visual i{width:36px;height:2px;background:#9eb3cf}.lg-gate-icon{display:block;width:72px;height:54px}.lg-hero-visual .lg-gate-icon{width:78px;height:60px;padding:4px;border:1px solid var(--line);border-radius:13px;background:#fff}.lg-progress{height:7px;overflow:hidden;border-radius:9px;background:#e0e6ee}.lg-progress span{display:block;height:100%;background:var(--blue);transition:width .25s}.lg-progress-text{margin:6px 0 0;color:var(--muted);font-size:.75rem;text-align:right}.lg-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:24px 0 16px}.lg-nav button{min-height:49px;display:grid;grid-template-columns:30px 1fr;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.lg-nav span{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;background:#edf1f5;font-size:.72rem;font-weight:900}.lg-nav strong{font-size:.8rem}.lg-nav button.active{border-color:#83ade3;background:var(--blue-soft)}.lg-nav button.active span{background:var(--blue);color:#fff}.lg-nav button.done span{background:var(--green);color:#fff}.lg-station{padding:clamp(20px,4vw,36px);border:1px solid var(--line);border-radius:17px;background:#fff}.lg-station-head{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(270px,.75fr);gap:30px;padding-bottom:25px;border-bottom:1px solid var(--line)}.lg-station-head h2{margin:4px 0 7px;font-size:clamp(1.8rem,4vw,2.6rem);letter-spacing:-.04em}.lg-station-head p{margin:0;color:var(--muted)}.lg-station-head aside{padding:15px 17px;border-radius:12px;background:#f3f5f8}.lg-station-head aside strong{font-size:.82rem}.lg-station-head ul{margin:7px 0 0;padding-left:18px;color:#526078;font-size:.8rem}.lg-tool{margin-top:22px;padding:20px;border:1px solid var(--line);border-radius:14px;background:#fafbfd}.lg-tool-head{display:flex;justify-content:space-between;align-items:start;gap:15px;margin-bottom:16px}.lg-tool-head h3,.lg-question h3{margin:3px 0;font-size:1.2rem}.lg-tool-head p{margin:0;color:var(--muted)}.lg-button{min-height:41px;padding:8px 14px;border:1px solid var(--blue);border-radius:9px;background:var(--blue);color:white;font-weight:800;cursor:pointer}.lg-button.secondary{border-color:#bdcad9;background:#fff;color:#324a68}.lg-button:disabled{opacity:.5;cursor:default}.lg-feedback{min-height:24px;margin:13px 0 0;color:var(--muted);font-size:.86rem}.lg-feedback.good{color:var(--green);font-weight:800}.lg-feedback.bad{color:var(--red);font-weight:750}.lg-success{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;margin-top:18px;padding:12px;border:1px solid #9bcab8;border-radius:12px;background:var(--green-soft)}.lg-success>span{width:40px;height:40px;display:grid;place-items:center;border-radius:9px;background:var(--green);color:#fff;font-weight:900}.lg-success strong,.lg-success p{display:block;margin:0}.lg-success p{color:#46675c;font-size:.8rem}.lg-switches{display:flex;justify-content:center;gap:18px;margin:20px 0}.lg-signal{width:120px;padding:13px;border:1px solid var(--line);border-radius:12px;background:#fff;text-align:center}.lg-signal span,.lg-signal strong{display:block}.lg-signal strong{font:900 2rem ui-monospace,monospace}.lg-signal button{width:100%;margin-top:8px;padding:7px;border:1px solid #bac8d9;border-radius:8px;background:#f1f4f8;cursor:pointer}.lg-signal.on{border-color:#7cabdf;background:var(--blue-soft)}.lg-signal.on strong{color:var(--blue)}.lg-target{padding:11px;border-left:3px solid var(--orange);background:var(--orange-soft);text-align:center;font-weight:750}.lg-gate-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:20px}.lg-gate-card{padding:13px;border:1px solid var(--line);border-radius:12px;text-align:center}.lg-gate-card .lg-gate-icon{margin:auto}.lg-gate-card h3{margin:5px 0 2px}.lg-gate-card p{margin:0;color:var(--muted);font-size:.75rem}.lg-simulator{display:grid;grid-template-columns:1fr 130px 1fr;align-items:center;gap:16px;max-width:650px;margin:18px auto}.lg-simulator .lg-gate-icon{width:125px;height:85px}.lg-output{padding:15px;border:1px solid var(--line);border-radius:12px;text-align:center}.lg-output strong{display:block;font:900 2.2rem ui-monospace,monospace}.lg-question{margin-top:17px;padding-top:16px;border-top:1px solid var(--line)}.lg-choices{display:flex;flex-wrap:wrap;gap:8px;margin-top:11px}.lg-choices button{min-height:42px;padding:8px 14px;border:1px solid #bdcad9;border-radius:9px;background:#fff;color:var(--ink);font-weight:800;cursor:pointer}.lg-choices button:hover{border-color:var(--blue);background:var(--blue-soft)}.lg-table{width:100%;margin-top:14px;border-collapse:collapse;text-align:center}.lg-table th,.lg-table td{padding:9px;border:1px solid var(--line)}.lg-table th{background:#f1f4f8;font-size:.78rem}.lg-table button{width:48px;height:34px;border:1px solid #b9c8d9;border-radius:7px;background:#fff;font-weight:900;cursor:pointer}.lg-table button.set{background:var(--blue-soft);color:var(--blue)}.lg-gate-tokenbox{display:flex;flex-wrap:wrap;gap:8px;padding:10px;border:1px dashed #aebed2;border-radius:11px;background:#fff}.lg-gate-token{display:flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid #becbda;border-radius:9px;background:#fff;cursor:grab;font-weight:800}.lg-gate-token .lg-gate-icon{width:46px;height:34px}.lg-gate-token.selected{border-color:var(--blue);background:var(--blue-soft)}.lg-circuit{display:grid;grid-template-columns:90px 1fr 75px 1fr 90px;align-items:center;gap:12px;min-width:720px;padding:22px}.lg-circuit-wrap{margin-top:13px;overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:#fff}.lg-inputs{display:grid;gap:10px}.lg-inputs button{height:43px;border:1px solid #bdcad9;border-radius:9px;background:#f1f4f8;font-weight:850;cursor:pointer}.lg-wire{height:2px;background:#a9b8ca}.lg-socket{min-height:120px;display:grid;place-items:center;padding:10px;border:2px dashed #a9bbd1;border-radius:13px;background:#fafbfd;cursor:pointer}.lg-socket.filled{border-style:solid;border-color:#78b99f;background:var(--green-soft)}.lg-socket .lg-gate-icon{width:100px;height:72px}.lg-socket small{display:block;color:var(--muted)}.lg-result{padding:14px;border:1px solid var(--line);border-radius:11px;text-align:center}.lg-result strong{display:block;font:900 2rem ui-monospace,monospace}.lg-adder{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:16px}.lg-adder-branch{padding:15px;border:1px solid var(--line);border-radius:12px;background:#fff}.lg-adder-branch h4{margin:0 0 9px}.lg-adder-branch .lg-socket{min-height:105px}.lg-adder-result{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px}.lg-adder-result div{padding:12px;border-radius:9px;background:var(--blue-soft);text-align:center}.lg-adder-result strong{display:block;font:900 1.6rem ui-monospace,monospace}.lg-equation{padding:13px;border-radius:10px;background:var(--navy);color:#e9f2ff;text-align:center;font:700 .9rem ui-monospace,monospace}.lg-final{max-width:720px;margin:25px auto 0;padding:28px;border:1px solid #9bcab8;border-radius:15px;background:var(--green-soft);text-align:center}.lg-final>span{width:72px;height:72px;display:grid;place-items:center;margin:auto;border-radius:50%;background:var(--green);color:#fff;font-weight:900}.lg-final h3{margin:10px 0 3px;font-size:1.6rem}.lg-footer{padding:24px;text-align:center;color:var(--muted);font-size:.76rem}
@media(max-width:800px){.lg-hero{grid-template-columns:1fr}.lg-hero-visual{display:none}.lg-station-head{grid-template-columns:1fr;gap:17px}.lg-gate-grid{grid-template-columns:1fr 1fr}.lg-adder{grid-template-columns:1fr}.lg-simulator{grid-template-columns:1fr}.lg-simulator .lg-gate-icon{margin:auto}.lg-output{max-width:180px;margin:auto}}
@media(max-width:550px){.lg-app{width:calc(100% - 18px);padding-top:12px}.lg-hero{padding:30px 0 22px}.lg-nav{grid-template-columns:1fr 1fr}.lg-nav strong{font-size:.69rem}.lg-station{padding:17px 12px}.lg-tool{padding:14px 10px}.lg-tool-head{display:block}.lg-tool-head .lg-button{margin-top:9px}.lg-gate-grid{grid-template-columns:1fr}.lg-success{grid-template-columns:40px 1fr}.lg-success .lg-button{grid-column:1/-1}.lg-switches{gap:8px}.lg-signal{width:105px}.lg-choices{display:grid}.lg-choices button{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.lg-circuit{grid-template-columns:120px 35px 140px 35px 90px 75px 35px 140px 35px 90px;gap:9px;min-width:900px}.lg-inputs .lg-signal{width:100%}

/* Freie Schaltungswerkbank */
.lg-builder-station{width:min(1320px,calc(100vw - 30px));margin-left:50%;transform:translateX(-50%)}
.lg-lab{display:grid;grid-template-columns:180px minmax(0,1fr);gap:14px;margin-top:22px}
.lg-palette{padding:12px;border:1px solid #cfd8e5;border-radius:14px;background:#f6f8fb}
.lg-palette-group{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:14px}
.lg-palette-group small{grid-column:1/-1;color:var(--muted);font-size:.66rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.lg-part{min-width:0;min-height:68px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:6px 4px;border:1px solid #bcc9d9;border-radius:9px;background:#fff;color:var(--ink);cursor:grab}
.lg-part:hover,.lg-part.selected{border-color:var(--blue);background:var(--blue-soft)}
.lg-part:active{cursor:grabbing}.lg-part>span{height:38px;display:grid;place-items:center}.lg-part strong{font-size:.7rem}
.lg-part .lg-gate-icon{width:52px;height:38px}.lg-mini-switch{width:34px;height:28px;display:grid;place-items:center;border:2px solid #40516a;border-radius:6px;background:#edf1f5;font:900 .85rem ui-monospace,monospace;font-style:normal}
.lg-mini-led{width:25px;height:25px;border:3px solid #40516a;border-radius:50%;background:#dfe5ed}
.lg-palette-help{padding:10px;border-top:1px solid var(--line);color:#526078;font-size:.7rem}.lg-palette-help strong{color:var(--ink)}.lg-palette-help ol{margin:5px 0 0;padding-left:17px}
.lg-workbench{min-width:0;border:1px solid #cfd8e5;border-radius:14px;background:#fff;overflow:hidden}
.lg-workbench-bar{min-height:56px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px;border-bottom:1px solid #cfd8e5;background:#f6f8fb}
.lg-workbench-bar strong,.lg-workbench-bar span{display:block}.lg-workbench-bar span{color:var(--muted);font-size:.7rem}.lg-workbench-bar>div:last-child{display:flex;gap:6px}
.lg-workbench-bar button{padding:6px 9px;border:1px solid #b8c6d7;border-radius:7px;background:#fff;color:#34465e;font-size:.72rem;font-weight:800;cursor:pointer}.lg-workbench-bar button:disabled{opacity:.45;cursor:default}
.lg-canvas-scroll{overflow:auto;background-color:#f9fbfd;background-image:radial-gradient(#c7d2df 1px,transparent 1px);background-size:18px 18px}
.lg-canvas{position:relative;width:100%;min-width:820px;height:510px;overflow:hidden;outline:none;touch-action:none}
.lg-empty{position:absolute;inset:0;display:grid;place-content:center;gap:4px;color:#8190a4;text-align:center;pointer-events:none}.lg-empty.hidden{display:none}.lg-empty span{font-size:2.3rem}.lg-empty strong{color:#617087}.lg-empty small{font-size:.72rem}
.lg-wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.lg-wires path{fill:none;stroke:#718096;stroke-width:4;stroke-linecap:round}.lg-wires path.on{stroke:#f09b24;filter:drop-shadow(0 0 3px #ffc96d)}.lg-wires [data-preview-wire]{stroke:var(--blue);stroke-width:3;stroke-dasharray:7 6;opacity:0}.lg-wires [data-preview-wire].visible{opacity:1}
.lg-node{position:absolute;width:142px;height:112px;border:2px solid #aebccc;border-radius:12px;background:#fff;box-shadow:0 7px 20px #22344f18;user-select:none}.lg-node.selected{border-color:var(--blue);box-shadow:0 0 0 3px #8ab9f455,0 7px 20px #22344f18}
.lg-node-input,.lg-node-output{width:118px;height:86px}.lg-node-grip{height:22px;display:grid;place-items:center;border-bottom:1px solid #e0e5ec;background:#f1f4f8;color:#8090a4;font-size:.75rem;letter-spacing:2px;cursor:move;border-radius:10px 10px 0 0;touch-action:none}
.lg-node-body{height:calc(100% - 22px);display:flex;flex-direction:column;align-items:center;justify-content:center}.lg-node-body>.lg-gate-icon{width:90px;height:57px}.lg-node-body>strong{margin-top:-7px;font-size:.7rem}
.lg-node-switch{width:78px;height:48px;display:flex;align-items:center;justify-content:space-around;border:1px solid #aebccc;border-radius:8px;background:#e8edf3;color:var(--ink);cursor:pointer}.lg-node-switch span{font-weight:900}.lg-node-switch strong{width:27px;height:27px;display:grid;place-items:center;border-radius:5px;background:#fff;font:900 1rem ui-monospace,monospace}.lg-node-switch.on{border-color:#d8891d;background:#fff0d8}.lg-node-switch.on strong{background:#f09b24;color:#fff}
.lg-node-output{display:flex;align-items:center;gap:9px}.lg-node-output span{font-weight:900}.lg-node-output strong{width:35px;height:35px;display:grid;place-items:center;border:3px solid #8391a3;border-radius:50%;background:#dbe2ea;font:900 1.1rem ui-monospace,monospace}.lg-node-output.on strong{border-color:#d98b1f;background:#ffb536;color:#402500;box-shadow:0 0 12px #f5a623aa}
.lg-port{position:absolute;z-index:4;width:20px;height:20px;padding:0;border:3px solid #fff;border-radius:50%;background:#66768b;box-shadow:0 0 0 2px #66768b;cursor:crosshair}.lg-port:hover,.lg-port:focus-visible{background:var(--blue);box-shadow:0 0 0 3px #8ab9f4}.lg-port-out{right:-11px;top:calc(50% + 1px)}.lg-port-out.on{background:#f09b24;box-shadow:0 0 0 2px #f09b24}.lg-port-in{left:-11px}.lg-node:not(.lg-node-not):not(.lg-node-output) .lg-port-in:nth-of-type(1){top:42px}.lg-node:not(.lg-node-not):not(.lg-node-output) .lg-port-in:nth-of-type(2){top:78px}.lg-node-not .lg-port-in,.lg-node-output .lg-port-in{top:calc(50% + 1px)}
.lg-lab-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border-top:1px solid #cfd8e5}.lg-lab-actions>span{color:var(--muted);font-size:.72rem}.lg-workbench>.lg-feedback{padding:0 12px 12px;margin-top:0}
@media(max-width:800px){.lg-builder-station{width:calc(100vw - 18px)}.lg-lab{grid-template-columns:1fr}.lg-palette{display:grid;grid-template-columns:1fr 2fr;gap:10px}.lg-palette-group{margin:0}.lg-palette-help{display:none}.lg-canvas{height:460px}.lg-lab-actions{align-items:flex-start;flex-direction:column}}
@media(max-width:550px){.lg-palette{display:block}.lg-palette-group{grid-template-columns:repeat(4,1fr);margin-bottom:8px}.lg-palette-group:first-child{grid-template-columns:repeat(2,1fr)}.lg-workbench-bar{align-items:flex-start;flex-direction:column}.lg-lab-actions .lg-button{width:100%}.lg-canvas{min-width:760px}}

/* Kompakte 0/1-Schalter und überarbeitete Einführung */
.lg-binary-note{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:20px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#f8fafc;color:var(--muted);font-size:.83rem}.lg-binary-note span{display:flex;align-items:center;gap:7px}.lg-binary-note strong{width:31px;height:31px;display:grid;place-items:center;border-radius:7px;background:#e6ebf1;color:var(--ink);font:900 1rem ui-monospace,monospace}.lg-binary-note span:last-child strong{background:#fff0d8;color:#9a5708}.lg-binary-note i{font-style:normal;font-weight:800;color:#8290a2}
.lg-signal .lg-binary-toggle{position:relative;width:48px;height:26px;display:block;margin:8px auto 0;padding:0;border:0;border-radius:20px;background:#c6d0dc;cursor:pointer}.lg-signal .lg-binary-toggle i{position:absolute;left:4px;top:4px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #1f2b3b44;transition:transform .18s}.lg-signal.on .lg-binary-toggle{background:var(--blue)}.lg-signal.on .lg-binary-toggle i{transform:translateX(22px)}
.lg-simulator .lg-switches{flex-direction:column;align-items:center;margin:0}.lg-simulator .lg-signal{width:118px;padding:9px}.lg-simulator .lg-signal>strong{font-size:1.55rem}
.lg-hint-row{display:flex;align-items:center;gap:12px;margin-top:18px;padding:12px;border:1px solid #efd39d;border-radius:12px;background:#fff9ec}.lg-hint-row p{margin:0;color:#675330;font-size:.84rem}.lg-hint-row .lg-button{white-space:nowrap}
@media(max-width:550px){.lg-binary-note{gap:8px;font-size:.72rem}.lg-binary-note i{font-size:0}.lg-binary-note i::after{content:'→';font-size:1rem}.lg-hint-row{align-items:flex-start;flex-direction:column}.lg-hint-row .lg-button{width:auto}.lg-simulator .lg-switches{flex-direction:column}.lg-simulator .lg-signal{width:112px}}
