/* Projekt 3 – signalgesteuerter Materialfluss */
.io-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:12px 0}.io-item{border:1px solid var(--line);border-radius:11px;background:#fff;padding:11px}.io-item code{display:inline-flex;border-radius:7px;background:#253039;color:#fff;padding:3px 7px;font-weight:800;font-size:.75rem}.io-item b{display:block;font-size:.78rem;margin-top:7px}.io-item span{display:block;font-size:.7rem;color:var(--muted);margin-top:3px}.io-item.value{border-top:4px solid #397da5}.io-item.valid{border-top:4px solid #4f8c65}.io-item.state{border-top:4px solid var(--orange)}
.handshake{display:grid;grid-template-columns:repeat(5,minmax(100px,1fr));gap:8px;margin:13px 0}.handshake-step{position:relative;border:1px solid var(--line);border-radius:10px;background:#fff;padding:10px;min-height:86px}.handshake-step::after{content:'→';position:absolute;right:-13px;top:30px;color:var(--orange);font-weight:900;z-index:2}.handshake-step:last-child::after{display:none}.handshake-step b{display:block;font-size:.72rem;color:var(--steel)}.handshake-step span{display:block;font-size:.67rem;color:var(--muted);margin-top:4px}.handshake-step.active{background:var(--orange-soft);border-color:#efb57f}.handshake-step.valid{background:var(--green-soft);border-color:#b9dbc9}
.signal-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}.signal-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}.signal-card h4{margin:0;padding:10px 12px;background:var(--surface-2);border-bottom:1px solid var(--line);font-size:.82rem}.signal-card .signal-body{padding:12px}.signal-card .signal-body p{margin:.35rem 0}.signal-card.blue{border-color:#a9cce0}.signal-card.blue h4{background:var(--blue-soft);color:var(--blue)}.signal-card.green{border-color:#b9dbc9}.signal-card.green h4{background:var(--green-soft);color:var(--green)}
.decision-tree{display:grid;grid-template-columns:1fr;gap:10px;margin:14px 0}.decision-node{border:1px solid var(--line);border-radius:11px;background:#fff;padding:11px 13px}.decision-node.question{border-left:5px solid var(--orange);background:#fffaf5}.decision-branches{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-left:22px}.decision-branch{border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--surface-2)}.decision-branch.good{border-color:#b9dbc9;background:var(--green-soft)}.decision-branch.bad{border-color:#e7b4ae;background:var(--red-soft)}.decision-branch b{display:block;font-size:.77rem}.decision-branch span{display:block;font-size:.7rem;color:var(--muted);margin-top:2px}
.state-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}.state-lamp{border:1px solid var(--line);border-radius:10px;padding:10px;background:#fff}.state-lamp i{display:block;width:14px;height:14px;border-radius:50%;margin-bottom:7px;box-shadow:0 0 0 4px rgba(0,0,0,.04)}.state-lamp b{display:block;font-size:.74rem}.state-lamp span{display:block;font-size:.67rem;color:var(--muted);margin-top:3px}.state-lamp.wait i{background:#e9a323}.state-lamp.run i{background:#3a8f60}.state-lamp.bad i{background:#b84d42}.state-lamp.full i{background:#7c5bb3}
.program-map{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:12px 0}.program-box{border:1px solid var(--line);border-radius:10px;background:#fff;padding:10px}.program-box code{font-size:.75rem;font-weight:800;color:#34434c}.program-box span{display:block;font-size:.68rem;color:var(--muted);margin-top:4px}.program-box.call{border-top:4px solid var(--orange)}
.test-matrix td:first-child{font-weight:800}.test-pass{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 7px;background:var(--green-soft);color:var(--green);font-size:.65rem;font-weight:800}.test-fail{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 7px;background:var(--red-soft);color:var(--red);font-size:.65rem;font-weight:800}
.expert-panel{border:1px solid #d4c2ea;border-left:5px solid #7c5bb3;border-radius:0 12px 12px 0;background:#f7f1ff;padding:13px 15px;margin:12px 0}.expert-panel .info-label{color:#69479c}.pseudo-code{border:1px dashed #b8a0d6;background:#fff;border-radius:10px;padding:12px;margin:10px 0}.pseudo-code pre{margin:0;white-space:pre-wrap;font-size:.76rem;color:#39454d}.raster-grid{display:grid;grid-template-columns:repeat(3,58px);grid-template-rows:repeat(2,58px);gap:9px;justify-content:center;margin:16px auto}.raster-cell{display:grid;place-items:center;border:2px dashed #8e72b4;border-radius:9px;background:#fff;color:#69479c;font-size:.68rem;font-weight:800}.raster-cell.base{border-style:solid;background:#eee3fb}
.level-hidden{display:none!important}.visible-only-expert{display:none}.level-experte .visible-only-expert{display:block}
.note-chain{display:grid;gap:7px;margin:10px 0}.note-chain>div{display:grid;grid-template-columns:28px 1fr;gap:9px;align-items:start;border:1px solid var(--line);border-radius:9px;padding:9px;background:#fff}.note-chain b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--orange);color:#fff;font-size:.68rem}.note-chain span{font-size:.76rem;color:#52606a}
@media(max-width:1100px){.handshake{grid-template-columns:repeat(3,1fr)}.handshake-step:nth-child(3)::after{display:none}.io-grid{grid-template-columns:repeat(2,1fr)}.program-map{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.io-grid,.signal-pair,.decision-branches,.state-row,.program-map{grid-template-columns:1fr}.handshake{grid-template-columns:1fr}.handshake-step::after{content:'↓';right:auto;left:50%;top:auto;bottom:-17px}.handshake-step:last-child::after{display:none}.decision-branches{margin-left:0}}
.milestone-card{border:1px solid #b9dbc9;border-left:5px solid var(--green);border-radius:0 12px 12px 0;background:var(--green-soft);padding:14px 16px;margin:12px 0}.milestone-card h3{margin:3px 0 8px}.milestone-card ul{margin-bottom:8px}.mile-flag{font-size:.68rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:var(--green)}
