@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@400;500;600;700&display=swap');
:root{--bg:#121315;--panel:#1b1c20;--line:#35363c;--text:#ededf0;--muted:#a5a5ad;--accent:#ff8c32;--orange:#ff8c32;--cyan:#9cc9df;--lime:#ff8c32}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:13px Inter,system-ui,sans-serif}button,input,select{font:inherit}button{cursor:pointer;color:inherit;background:#232429;border:1px solid var(--line);border-radius:4px;padding:8px 11px}button:hover{background:#303137;border-color:#777780}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button:disabled{opacity:.35;cursor:default}header{height:52px;display:flex;justify-content:space-between;align-items:center;padding:0 20px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:9px;color:var(--text);font-size:16px;font-weight:600;text-decoration:none}.brand-icon{font-size:25px;color:var(--accent)}.header-right{display:flex;align-items:center;gap:20px;font-size:11px;color:var(--muted)}.header-right button{padding:6px 12px;font-size:11px}.app{display:grid;grid-template-columns:216px minmax(0,1fr)}.sidebar{padding:22px 16px;border-right:1px solid var(--line);min-height:calc(100dvh - 52px)}h1{font-size:16px;margin:0 0 25px;font-weight:600}label,.eyebrow{display:block;color:var(--muted);font:10px 'IBM Plex Mono',monospace;letter-spacing:.5px}label{margin:20px 0 9px}select,.quantity{width:100%;padding:10px;background:#232429;border:1px solid #41424a;border-radius:4px;color:var(--text);font-size:11px}.quantity{display:flex;align-items:center;gap:6px}.quantity input{min-width:0;width:90px;background:transparent;border:0;outline:none;color:var(--text);font-size:25px;font-weight:500}.quantity span{font-size:10px;color:var(--muted)}.presets{display:flex;gap:5px;margin-top:7px}.presets button{flex:1;padding:6px 0;font-size:10px}.presets .active,.layouts .active{border-color:var(--accent);background:#38271d;color:#ffae72}.layouts{display:grid;gap:7px}.layouts button{text-align:left;padding:10px}.layouts strong{display:block;font-size:11px;font-weight:500}.layouts small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.primary{width:100%;margin-top:16px;background:var(--accent);color:#21160e;border:0;padding:11px;font-size:11px;font-weight:600}.primary:hover{background:#ffa764;color:#21160e}#form-error{font-size:11px;color:#ffad78}.supply{border-top:1px solid var(--line);margin-top:22px;padding-top:18px}.supply>div:not(.eyebrow){display:flex;justify-content:space-between;font-size:10px;padding-top:15px}.supply strong{font:10px 'IBM Plex Mono',monospace;color:var(--text)}.supply p,details p{font-size:10px;line-height:1.7;color:var(--muted)}details{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}summary{font-size:10px;cursor:pointer;color:var(--muted)}a{color:var(--cyan)}main{min-width:0;padding:12px 16px 8px}.plan-heading{display:none}.metrics{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px;padding:3px 2px}.metrics>div{display:flex;align-items:center;gap:8px}.metrics span{font-size:9px;color:var(--muted)}.metrics strong{font-size:12px;font-weight:500;white-space:nowrap}.metrics small{display:none}.workspace{border:1px solid var(--line);border-radius:5px;overflow:hidden;background:#151619}.canvas-toolbar{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border-bottom:1px solid var(--line);background:#1c1d21;gap:8px}.tabs,.view-controls{display:flex;align-items:center;gap:5px}.tabs button{font-size:11px;padding:7px 10px;background:transparent;border-color:transparent;color:var(--muted)}.tabs button.active{background:#3c291e;color:#ffae72;border-color:#6d4428}.view-controls{font:10px 'IBM Plex Mono',monospace}.view-controls button{font-size:10px;padding:6px 8px}#fullscreen{margin-left:7px;color:var(--text);display:flex;align-items:center;gap:5px}.canvas-wrap{height:calc(100dvh - 312px);min-height:460px;overflow:auto;display:flex;align-items:flex-start;justify-content:flex-start;background:#151619}svg{display:block;flex-shrink:0;min-width:100%;min-height:100%;font-family:'IBM Plex Mono',monospace}.canvas-footer{padding:9px 12px;display:flex;justify-content:space-between;gap:10px;color:var(--muted);font:9px 'IBM Plex Mono',monospace;border-top:1px solid var(--line);background:#1c1d21}.legend{display:inline-block;width:7px;height:7px;border-radius:1px;margin:0 5px 0 14px}.legend:first-child{margin-left:0}.legend.ore{background:#f6a15d}.legend.ingot{background:var(--cyan)}.legend.plate{background:var(--accent)}.legend.power{background:#b6a3de}.bottom-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(230px,1fr);gap:12px;margin-top:12px}.build-panel,.inspector{border:1px solid var(--line);background:var(--panel);border-radius:5px;padding:13px 15px;min-width:0}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-heading>span{font:10px 'IBM Plex Mono',monospace;color:var(--muted)}h3{margin:0;font-size:13px;font-weight:500}.steps{display:flex;gap:6px;margin:12px 0}.steps button{flex:1;padding:5px 0;font:10px 'IBM Plex Mono',monospace}.steps button.active{border-color:var(--accent);background:#38271d;color:#ffae72}.steps button.done{background:#38322b}.step-detail h4{font-size:11px;font-weight:500;margin:0 0 5px}.step-detail p{font-size:10px;line-height:1.65;color:#b6b6bf;margin:0;min-height:32px}.step-actions{display:flex;justify-content:space-between;gap:5px;margin-top:10px}.step-actions button{padding:6px 8px;font-size:10px}#complete{color:#ffae72}.inspector{max-height:224px;overflow:auto}.inspector h3{margin:10px 0}.inspector .hint{font-size:10px;line-height:1.65;color:var(--muted);margin:6px 0}.property{display:flex;justify-content:space-between;gap:10px;font-size:10px;border-top:1px solid #303137;padding:7px 0}.property span{color:var(--muted)}.property strong{font:10px 'IBM Plex Mono',monospace;text-align:right}.validation{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:7px 1px;color:#91919b}.validation p{font-size:9px;margin:0}.validation button{border:0;background:none;font-size:9px;padding:3px 0;white-space:nowrap}.machine{cursor:pointer;outline:none}.machine:hover .body,.machine:focus .body{stroke:#fff;stroke-width:.3}.selected .body{stroke:#ffb680;stroke-width:.4;filter:drop-shadow(0 0 .5px #ff8c32)}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#34353b;border:1px solid #62626b;color:#fff;padding:10px 18px;border-radius:4px;opacity:0;pointer-events:none;transition:opacity .2s;font-size:11px;z-index:100}#toast.show{opacity:1}
main:fullscreen,main:-webkit-full-screen,body.fullscreen-fallback main{background:var(--bg);width:100%;height:100dvh;display:flex;flex-direction:column;padding:10px;overflow:hidden}main:fullscreen .metrics,main:-webkit-full-screen .metrics,body.fullscreen-fallback .metrics,main:fullscreen .validation,main:-webkit-full-screen .validation,body.fullscreen-fallback .validation{display:none}main:fullscreen .workspace,main:-webkit-full-screen .workspace,body.fullscreen-fallback .workspace{flex:1;min-height:0;display:flex;flex-direction:column}main:fullscreen .canvas-wrap,main:-webkit-full-screen .canvas-wrap,body.fullscreen-fallback .canvas-wrap{flex:1;height:auto;min-height:0}main:fullscreen .bottom-grid,main:-webkit-full-screen .bottom-grid,body.fullscreen-fallback .bottom-grid{flex-shrink:0}main:fullscreen .inspector,main:-webkit-full-screen .inspector,body.fullscreen-fallback .inspector{max-height:190px}body.fullscreen-fallback{overflow:hidden}body.fullscreen-fallback header,body.fullscreen-fallback .sidebar{display:none}body.fullscreen-fallback .app{display:block}body.fullscreen-fallback main{position:fixed;inset:0;z-index:50}
@media(min-width:1600px){.canvas-wrap{min-height:540px}.sidebar{padding:24px 18px}.app{grid-template-columns:230px minmax(0,1fr)}.step-detail p{font-size:12px}.step-detail h4{font-size:12px}.build-panel,.inspector{padding:15px 18px}}
@media(max-width:1050px){.metrics span{display:none}.canvas-toolbar{flex-wrap:wrap}.view-controls{margin-left:auto}.canvas-wrap{min-height:430px}.bottom-grid{grid-template-columns:minmax(0,1.4fr) minmax(190px,1fr)}#fullscreen span{font-size:9px}.canvas-footer{font-size:8px}.prototype-label{display:none}}
@media(max-width:720px){header{padding:0 14px}.app{display:block}.sidebar{min-height:0;border-right:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;padding:14px}.sidebar h1{grid-column:1/-1;margin:0}.sidebar>label{margin:0;align-self:end}.sidebar>label[for="product"]{grid-column:1}.sidebar select{grid-column:1}.sidebar>label[for="target"]{grid-column:2;grid-row:2}.quantity{grid-column:2;grid-row:3;padding:5px 10px}.quantity input{font-size:20px}.presets{grid-column:2;margin:0}.sidebar>label:not([for]){grid-column:1;grid-row:4;align-self:center}.layouts{grid-column:1;grid-row:5;display:flex}.layouts button{flex:1;padding:8px}.layouts small{display:none}.primary{grid-column:2;grid-row:5;margin:0}.supply,details{display:none}#form-error{grid-column:1/-1;margin:0}main{padding:10px}.metrics{gap:8px}.metrics strong{font-size:10px}.canvas-wrap{height:60dvh;min-height:390px}.bottom-grid{grid-template-columns:1fr}.inspector{max-height:180px}.canvas-footer{flex-wrap:wrap}main:fullscreen .inspector,body.fullscreen-fallback .inspector{display:none}.tabs button{padding:6px}.view-controls{gap:4px}#fullscreen{margin-left:3px}}
@media print{header,.sidebar,.view-controls,.step-actions,.validation{display:none}.app{display:block}main{padding:0}.canvas-wrap{height:auto!important;overflow:visible;min-height:0}svg{width:100%!important;height:auto!important}.bottom-grid{break-inside:avoid}body{-webkit-print-color-adjust:exact;print-color-adjust:exact}.canvas-toolbar{display:none}}

.machine-detail{display:flex;align-items:center;gap:15px;min-height:150px}.machine-photo{width:120px;flex-shrink:0;text-align:center}.machine-photo img{display:block;width:120px;height:120px;object-fit:contain}.machine-photo small{font-size:9px;color:var(--muted)}.machine-settings{flex:1;min-width:0}.machine-settings h3{margin:0 0 12px;font-size:13px}.machine-settings h3 span,.inspector h3>span{color:var(--muted);font-size:10px;margin-left:6px}.empty-selection{padding:25px 0}.inspector{max-height:240px}.bottom-grid{grid-template-columns:minmax(0,1.4fr) minmax(320px,1fr)}@media(max-width:1050px){.bottom-grid{grid-template-columns:1fr}.inspector{max-height:none}.machine-detail{min-height:140px}.machine-photo,.machine-photo img{width:130px}.machine-photo img{height:130px}}@media(min-width:1051px){main:fullscreen .machine-photo,main:fullscreen .machine-photo img,body.fullscreen-fallback .machine-photo,body.fullscreen-fallback .machine-photo img{width:100px}main:fullscreen .machine-photo img,body.fullscreen-fallback .machine-photo img{height:100px}}@media(max-width:720px){main:fullscreen .inspector,body.fullscreen-fallback .inspector{display:block;max-height:160px}.machine-photo,.machine-photo img{width:90px}.machine-photo img{height:90px}.machine-detail{min-height:110px}.bottom-grid{grid-template-columns:1fr}}

.selected .body{stroke:#ffb680;stroke-width:.32;filter:none}.canvas-footer{color:#a5a5ad}.machine .body{transition:stroke .12s}.machine-photo small{display:none}

.drawing-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 1px 10px}.drawing-header>div{display:flex;align-items:baseline;gap:14px}.drawing-header strong{font-size:13px;font-weight:500}.drawing-header span{font-size:10px;color:var(--muted)}.drawing-header a{font-size:9px;color:#e9ad7b;text-decoration:none;border:1px solid #61452f;border-radius:4px;padding:5px 7px}.geometry-note{font-size:9px;line-height:1.5;color:#b7a392;margin:8px 0 0;border-top:1px solid var(--line);padding-top:7px}.canvas-wrap{height:calc(100dvh - 342px)}main:fullscreen .drawing-header,main:-webkit-full-screen .drawing-header,body.fullscreen-fallback .drawing-header{display:none}.machine .body{fill:#27282e;stroke-width:.17}.machine-photo img{filter:drop-shadow(0 5px 7px #0005)}@media(max-width:720px){.drawing-header{align-items:flex-start}.drawing-header>div{display:block}.drawing-header span{display:block;margin-top:4px}.drawing-header a{max-width:125px;line-height:1.5}.canvas-wrap{height:60dvh}}
[hidden]{display:none!important}#advanced-controls,#advanced-view{display:none}.advanced-mode #advanced-controls,.advanced-mode #advanced-view{display:block}.advanced-mode #iron-controls,.advanced-mode #iron-view{display:none}.connection-summary{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:4px 0 12px}.flow-card{text-align:left;background:#1c1e23;border:1px solid #4b4540;border-radius:7px;padding:16px;min-width:0}.flow-card.input{border-top:3px solid #f6a15d}.flow-card.output{border-top:3px solid #8ed5b4}.port-label{display:block;font:11px 'IBM Plex Mono',monospace;letter-spacing:.5px;color:#f6a15d;margin-bottom:10px}.output .port-label{color:#8ed5b4}.flow-card h3{font-size:17px;font-weight:600;margin:0 0 6px}.flow-card>strong{display:block;font:22px 'IBM Plex Mono',monospace}.flow-card p{font-size:12px;line-height:1.6;color:#c3c3cc;margin:8px 0 0}.focus-link{display:block;font-size:11px;color:#dedee5;margin-top:12px}.boundary-note{font-size:12px;line-height:1.6;color:#b9bac3;margin:12px 0 18px}.canvas-wrap{height:560px;min-height:420px}#advanced-target{width:100%;background:#232429;border:1px solid #41424a;color:#fff;border-radius:4px;padding:12px;font-size:24px}.scope-help{font-size:11px;line-height:1.7;color:#aeb1bd}#advanced-error,#advanced-status{color:#ffb479;font-size:12px;line-height:1.5}.advanced-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 0}.advanced-heading h1{font-size:25px;margin:8px 0}.advanced-heading p{color:#b9bac3;font-size:12px}.plan-notice{border-left:3px solid #e4ad72;background:#28231e;color:#dec3a7;padding:12px 16px;line-height:1.6;font-size:12px}#advanced-view h2{font-size:17px;margin:26px 0 14px}.input-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.stage-card{background:#1b1d22;border:1px solid #383b43;border-radius:7px;padding:18px;margin:0 0 14px;scroll-margin-top:20px}.stage-top{display:flex;align-items:center;gap:13px}.stage-id{background:#34343e;color:#c4c6da;border-radius:5px;padding:9px;font:12px 'IBM Plex Mono',monospace}.stage-top h3{font-size:16px;font-weight:600}.stage-top p{font-size:12px;color:#b7bac8;margin:5px 0}.stage-top>strong{margin-left:auto;white-space:nowrap;font:16px 'IBM Plex Mono',monospace;color:#a9d9be}.stage-flow{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:18px}.stage-flow>div{border-top:1px solid #383b43;padding-top:14px}.stage-flow p{display:flex;justify-content:space-between;gap:12px;font-size:12px}.stage-flow b{font-weight:400}.stage-flow strong{font:12px 'IBM Plex Mono',monospace;white-space:nowrap}.stage-card details p,.recipe-source p{font-size:12px}.stage-card summary,.recipe-source summary{font-size:12px}.recipe-source{margin:24px 0}.recipe-source a{font-size:12px}#advanced-output .flow-card{max-width:600px}.advanced-mode main{max-width:1500px}.advanced-mode .sidebar{min-height:100vh}
@media(max-width:720px){.sidebar{display:block}.sidebar label{margin:15px 0 8px}.sidebar h1{margin-bottom:12px}.sidebar select{font-size:13px}#iron-controls .layouts{display:flex;margin-top:8px}#iron-controls .quantity{margin:8px 0}#iron-controls .primary{margin-top:12px}.connection-summary{grid-template-columns:1fr}.flow-card{padding:14px}.flow-card>strong{font-size:22px}.advanced-heading{display:block}.advanced-heading button{margin:6px 0}.stage-top{flex-wrap:wrap}.stage-flow{grid-template-columns:1fr;gap:6px}.input-grid{grid-template-columns:1fr 1fr}.input-grid .flow-card>strong{font-size:18px}.canvas-wrap{height:480px}.stage-card{padding:14px}}
@media(max-width:420px){.input-grid{grid-template-columns:1fr}}
@media print{#advanced-controls{display:none}.flow-card,.stage-card{break-inside:avoid}.connection-summary{grid-template-columns:1fr 1fr}}
main:fullscreen #iron-view,main:-webkit-full-screen #iron-view,body.fullscreen-fallback #iron-view{display:flex;flex-direction:column;flex:1;min-height:0}main:fullscreen .connection-summary,main:fullscreen .boundary-note,main:-webkit-full-screen .connection-summary,main:-webkit-full-screen .boundary-note,body.fullscreen-fallback .connection-summary,body.fullscreen-fallback .boundary-note{display:none}
