.planner-shell{display:grid;grid-template-columns:300px minmax(0,1fr) 310px;gap:16px;align-items:start}
.planner-panel{background:#101a31;border:1px solid var(--line);border-radius:16px;padding:14px}
.planner-panel h3{margin-top:0}
.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tool-btn,.mode-btn{border:1px solid var(--line);background:#17213b;color:var(--ink);border-radius:10px;padding:9px;text-align:left;cursor:pointer;font:inherit}
.tool-btn:hover,.mode-btn:hover,.tool-btn.active,.mode-btn.active{border-color:#53e0c2;background:#1d314e}
.tool-btn b{display:block;font-size:12px}
.tool-btn span{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.control-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}
.control-row.three{grid-template-columns:1fr 1fr 1fr}
.control-row button,.control-row select,.control-row input,.wide-action,.wide-control{width:100%;border:1px solid var(--line);border-radius:10px;background:#0d1428;color:var(--ink);padding:9px;font:inherit}
.wide-control{display:block;margin:8px 0}
.wide-action{cursor:pointer;margin:2px 0 10px;text-align:center}
.wide-action:hover{border-color:#53e0c2;background:#1d314e}
.board-wrap{overflow:auto;padding:14px;background:#081021;border:1px solid var(--line);border-radius:18px;min-height:620px}
.plan-status{margin-top:12px;display:grid;gap:8px}
.status-block{border:1px solid rgba(255,255,255,.12);border-radius:12px;background:#101a31;padding:10px;color:#dce8ff}
.status-block.ok{border-color:rgba(83,224,194,.4)}
.status-block.warn{border-color:rgba(255,209,102,.6);background:#2b2617;color:#ffeac2}
.status-block b{display:block;color:#eef3ff;margin-bottom:6px}
.status-block div{display:flex;justify-content:space-between;gap:10px;border-top:1px solid rgba(255,255,255,.08);padding-top:5px;margin-top:5px}
.status-block span{color:#aebbd7}
.planner-board{position:relative;margin:auto;border:2px solid #5f789f;border-radius:12px;background-color:#0b1328;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
.planner-board:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(to right,rgba(159,213,255,.14) 1px,transparent 1px),linear-gradient(to bottom,rgba(159,213,255,.14) 1px,transparent 1px),linear-gradient(to right,rgba(83,224,194,.34) 2px,transparent 2px),linear-gradient(to bottom,rgba(83,224,194,.34) 2px,transparent 2px);background-size:var(--meter) var(--meter),var(--meter) var(--meter),calc(var(--meter)*8) calc(var(--meter)*8),calc(var(--meter)*8) calc(var(--meter)*8)}
.placeable{position:absolute;border:2px solid #8fb7e8;border-radius:8px;background:linear-gradient(180deg,#20395f,#14253f);color:#f3f8ff;font-weight:800;font-size:11px;display:flex;align-items:center;justify-content:center;text-align:center;padding:4px;cursor:grab;z-index:2;overflow:hidden;touch-action:none;user-select:none}
.placeable:active{cursor:grabbing}
.placeable.machine-constructor,.placeable.machine-smelter{border-color:#93f591;background:linear-gradient(180deg,#244f38,#173224)}
.placeable.machine-foundry{border-color:#ffb86b;background:linear-gradient(180deg,#5a3820,#2d1d12)}
.placeable.machine-assembler{border-color:#9fd5ff;background:linear-gradient(180deg,#25466d,#152a45)}
.placeable.machine-manufacturer{border-color:#d5a6ff;background:linear-gradient(180deg,#4b2e68,#27183a)}
.placeable.machine-refinery,.placeable.machine-blender,.placeable.machine-packager{border-color:#53e0c2;background:linear-gradient(180deg,#235c58,#143432)}
.placeable.logistics{border-color:#ffd166;background:#3b2c1f;color:#ffeac2}
.placeable.input-port{border-color:#ffd166;background:#2b2617;color:#ffeac2}
.placeable.belt{height:auto;background:#ffd166;color:#2b2104;border-color:#ffe49a}
.placeable.pipe{height:auto;background:#4bd6ff;color:#041d26;border-color:#98ecff}
.placeable.route{border-radius:999px;padding:0;min-width:8px;min-height:8px}
.placeable.invalid{border-color:#ff6b6b;background:#4a1d24}
.placeable.selected{outline:3px solid #53e0c2;outline-offset:2px}
.placeable.auto-build{box-shadow:inset 0 0 0 2px rgba(83,224,194,.35),0 0 12px rgba(83,224,194,.18)}
.placeable.auto-route{box-shadow:inset 0 0 0 2px rgba(255,209,102,.45),0 0 10px rgba(255,209,102,.16)}
.placeable-content{position:relative;z-index:2;line-height:1.1;text-shadow:0 1px 2px rgba(0,0,0,.8);pointer-events:none;width:100%;overflow:hidden}
.machine-kind,.machine-title,.machine-rate,.machine-inputs{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.machine-kind{font-size:8px;color:#aebbd7;text-transform:uppercase;letter-spacing:.3px;margin-bottom:2px}
.machine-title{font-size:10px}
.machine-rate{font-size:9px;color:#ffe49a;margin-top:2px}
.machine-inputs{font-size:8px;color:#dce8ff;margin-top:2px;font-weight:700}
.placeable.logistics .placeable-content{font-size:9px;align-self:flex-end;margin-bottom:1px}
.flow-symbol{position:absolute;inset:3px;z-index:1;pointer-events:none;transform-origin:50% 50%;opacity:.96}
.flow-symbol > line,.flow-symbol > path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.port-dot{position:absolute;width:10px;height:10px;border-radius:999px;background:#53e0c2;border:1px solid #d9fff8;transform:translate(-5px,-5px);z-index:4;pointer-events:none}
.ghost{position:absolute;pointer-events:none;opacity:.72;border:2px dashed #53e0c2;border-radius:999px;z-index:5;background:rgba(83,224,194,.18)}
.floor-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.floor-tab{border:1px solid var(--line);background:#17213b;color:var(--ink);border-radius:999px;padding:7px 10px;cursor:pointer}
.floor-tab.active{border-color:#53e0c2;background:#1d314e}
.stat-list{display:grid;gap:8px}
.stat-list div{display:flex;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:5px;color:#dce8ff}
.calc-output{display:grid;gap:8px;margin:10px 0 16px}
.calc-output div{border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:8px;background:#0d1428;color:#dce8ff}
.calc-output b{color:#eef3ff}
.calc-output span{color:#aebbd7}
.external-supply{display:grid;gap:8px;margin:8px 0 12px}
.inline-toggle{display:flex;align-items:center;gap:8px;margin:8px 0 10px;color:#dce8ff;font-size:12px;font-weight:800}
.inline-toggle input{width:auto}
.alt-recipe-list{display:grid;gap:6px;max-height:240px;overflow:auto;margin:8px 0 12px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#0d1428;padding:8px}
.alt-recipe-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:start;border-bottom:1px solid rgba(255,255,255,.06);padding:6px 0;color:#dce8ff}
.alt-recipe-row:last-child{border-bottom:0}
.alt-recipe-row input{margin-top:3px}
.alt-recipe-row b{display:block;color:#eef3ff;font-size:12px}
.alt-recipe-row span{display:block;color:#aebbd7;font-size:11px;margin-top:2px}
.supply-row{display:grid;grid-template-columns:auto minmax(0,1fr) 82px;gap:8px;align-items:center;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#0d1428;padding:8px;color:#dce8ff}
.supply-row input[type="checkbox"]{width:auto}
.supply-row input[type="number"]{width:100%;border:1px solid var(--line);border-radius:8px;background:#081021;color:var(--ink);padding:6px;font:inherit}
.supply-name b{display:block;color:#eef3ff}
.supply-name span{display:block;color:#aebbd7;font-size:11px;margin-top:2px}
.line-suggestions{display:grid;gap:8px;margin:8px 0 16px}
.line-step{border:1px solid rgba(83,224,194,.18);border-radius:10px;background:#0d1428;padding:8px;color:#dce8ff}
.line-step.warn{border-color:rgba(255,209,102,.6);background:#2b2617;color:#ffeac2}
.line-step b{color:#eef3ff}
.line-step span{display:block;color:#aebbd7;font-size:12px;margin-top:3px}
.line-step select{width:100%;margin-top:6px;border:1px solid var(--line);border-radius:8px;background:#081021;color:var(--ink);padding:6px;font:inherit}
.planner-chat-log{display:grid;gap:8px;max-height:260px;overflow:auto;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#0d1428;padding:8px;margin:8px 0}
.planner-chat-log:empty:before{content:"Noch keine Nachrichten.";color:#aebbd7;font-size:12px}
.chat-message{border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:8px;color:#dce8ff;background:#101a31}
.chat-message b{display:block;color:#eef3ff;font-size:11px;text-transform:uppercase;margin-bottom:4px}
.chat-message.user{border-color:rgba(83,224,194,.28)}
.chat-message.assistant{border-color:rgba(255,209,102,.24)}
.chat-message.error{border-color:rgba(255,107,107,.45);background:#2b171d;color:#ffd7df}
.planner-chat-input{width:100%;min-height:74px;resize:vertical;border:1px solid var(--line);border-radius:10px;background:#0d1428;color:var(--ink);padding:9px;font:inherit}
.need-tree{display:grid;gap:6px;margin:8px 0 14px}
.need-node{border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#0d1428;color:#dce8ff;padding:7px}
.need-node.root{border-color:rgba(83,224,194,.35);background:#10233a}
.need-node label{display:flex;align-items:flex-start;gap:8px}
.need-node input{margin-top:3px}
.need-node b{display:block;color:#eef3ff}
.need-node small,.need-node span span{display:block;color:#aebbd7;font-size:11px;margin-top:2px}
.need-branch{margin-top:7px}
.need-branch summary{cursor:pointer;color:#aebbd7;font-size:11px;font-weight:800;list-style:none}
.need-branch summary::-webkit-details-marker{display:none}
.need-branch summary:before{content:"+";display:inline-grid;place-items:center;width:16px;height:16px;margin-right:6px;border:1px solid rgba(255,255,255,.16);border-radius:4px;color:#53e0c2}
.need-branch[open] > summary:before{content:"-"}
.need-branch .need-node{margin-top:6px}
.need-node.depth-1{margin-left:0}
.need-node.depth-2{margin-left:14px}
.need-node.depth-3{margin-left:28px}
.need-node.depth-4{margin-left:42px}
.need-node.depth-5{margin-left:56px}
.need-node.depth-6{margin-left:70px}
.building-io{display:grid;gap:10px;margin:8px 0 16px}
.io-block{border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#0d1428;padding:8px;color:#dce8ff}
.io-block b{display:block;color:#eef3ff;margin-bottom:6px}
.io-block div{display:flex;justify-content:space-between;gap:10px;border-top:1px solid rgba(255,255,255,.06);padding-top:5px;margin-top:5px}
.io-block span{color:#aebbd7}
.context-menu{position:fixed;z-index:50;min-width:220px;max-width:280px;border:1px solid var(--line);border-radius:10px;background:#101a31;box-shadow:0 18px 46px rgba(0,0,0,.42);padding:6px;display:none}
.context-menu.open{display:block}
.context-title{color:#aebbd7;font-size:12px;font-weight:800;padding:7px 8px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:4px}
.context-menu button{display:block;width:100%;border:0;background:transparent;color:#eef3ff;text-align:left;border-radius:8px;padding:8px;font:inherit;cursor:pointer}
.context-menu button:hover,.context-menu button.active{background:#1d314e;color:#fff}
.warning-list{padding-left:18px;color:#ffeac2}
textarea.plan-json{width:100%;min-height:120px;border:1px solid var(--line);border-radius:12px;background:#0d1428;color:var(--ink);padding:10px;font:12px Consolas,monospace}
@media(max-width:1200px){.planner-shell{grid-template-columns:1fr}.board-wrap{min-height:520px}}