/* Laboratório de arquitetura (aba Arquitetura do Treinador KCNA) */
.arch{display:flex;flex-direction:column;gap:10px;outline:none;width:min(1560px,calc(100vw - 32px));margin-left:calc(50% - min(1560px,calc(100vw - 32px)) / 2)}
.arch-bar{display:flex;gap:6px;flex-wrap:wrap;align-items:center;padding-bottom:10px;border-bottom:1px solid var(--rule)}
.arch-bar .btn[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.arch-sel{display:inline-flex;gap:6px;align-items:center;font-size:.86rem;color:var(--ink-2)}
.arch-sel select{padding:5px 8px;font-size:.86rem}
.arch-sep{width:1px;height:22px;background:var(--rule);margin:0 4px}
.arch-import{cursor:pointer}
.arch-main{display:grid;grid-template-columns:200px minmax(0,1fr) 270px;gap:12px;height:max(460px,calc(100vh - 300px))}
.arch-pal{overflow:auto;display:flex;flex-direction:column;gap:6px;padding-right:4px}
.arch-pal input{width:100%;font:inherit;font-size:.86rem;color:var(--ink);background:var(--sheet);border:1px solid var(--rule);border-radius:8px;padding:6px 9px}
.pal-cat summary{cursor:pointer;font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;font-weight:600;color:var(--ink-2);padding:6px 2px;list-style:none}
.pal-cat summary::-webkit-details-marker{display:none}
.pal-cat summary::before{content:"▸ ";color:var(--ink-3)}
.pal-cat[open] summary::before{content:"▾ "}
.pal-items{display:flex;flex-direction:column;gap:4px;margin-bottom:6px}
.pal-item{display:flex;align-items:center;gap:8px;text-align:left;width:100%;border:1px solid var(--rule);background:var(--sheet);border-radius:8px;padding:5px 8px;cursor:grab;font-size:.84rem;color:var(--ink)}
.pal-item:hover{border-color:var(--ink-3)}
.pal-item .ic{flex:none;min-width:30px;height:22px;border-radius:5px;display:grid;place-items:center;font:700 .62rem var(--f-mono);color:#fff;background:var(--dc,var(--ink-3))}
.pal-item .ic.grp{background:transparent;color:var(--ink-2);border:1.5px dashed var(--ink-3);font-size:.8rem}
[data-d="ink"]{--dc:var(--ink-3)}
.arch-canvas{position:relative;border:1px solid var(--rule);border-radius:12px;background:var(--paper);overflow:hidden;min-width:0}
.arch-canvas svg{width:100%;height:100%;display:block;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
.arch-canvas svg:active{cursor:grabbing}
.arch-hint{position:absolute;left:10px;bottom:8px;font-size:.76rem;color:var(--ink-3);background:color-mix(in srgb,var(--paper) 85%,transparent);padding:2px 8px;border-radius:6px;pointer-events:none}
.ar-group rect:first-child{fill:color-mix(in srgb,var(--sheet) 55%,transparent);stroke:var(--ink-3);stroke-dasharray:6 5;stroke-width:1.5;cursor:move}
.ar-group.sel rect:first-child{stroke:var(--accent);stroke-width:2}
.ar-group.down rect:first-child{stroke:var(--bad);fill:color-mix(in srgb,var(--bad) 7%,transparent)}
.ar-group .gl{font:600 14px var(--f-body);fill:var(--ink-2);pointer-events:none}
.ar-group.down .gl{fill:var(--bad)}
.ar-group .rz{fill:var(--rule);cursor:nwse-resize;opacity:.8}
.ar-node{cursor:move}
.ar-node .card{fill:var(--sheet);stroke:var(--rule);stroke-width:1.5;transition:stroke .15s}
.ar-node:hover .card{stroke:var(--ink-3)}
.ar-node.sel .card{stroke:var(--accent);stroke-width:2.5}
.ar-node.conn .card{stroke:var(--orch);stroke-width:2.5;stroke-dasharray:5 4}
.ar-node .badge{fill:var(--dc)}
.ar-node .ab{font:700 11px var(--f-mono);fill:#fff;text-anchor:middle;pointer-events:none}
:root[data-theme="dark"] .ar-node .ab,.ar-node .ab{fill:var(--sheet)}
.ar-node .nm{font:600 13px var(--f-body);fill:var(--ink);pointer-events:none}
.ar-node .lb{font:11px var(--f-mono);fill:var(--ink-2);pointer-events:none}
.ar-node .port{fill:var(--sheet);stroke:var(--ink-3);stroke-width:1.5;cursor:crosshair;opacity:0;transition:opacity .15s}
.ar-node:hover .port,.ar-node.sel .port{opacity:1}
.ar-node.dying{opacity:.45}
.ar-node.dying .card{stroke:var(--bad);stroke-width:2.5}
.ar-node .x{font:700 16px var(--f-body);fill:var(--bad)}
.ar-node.born .card{stroke:var(--ok);stroke-width:3}
.ar-e{cursor:pointer}
.ar-e .ln{stroke:var(--ink-3);stroke-width:1.6;fill:none}
.ar-e .hit{stroke:transparent;stroke-width:14;fill:none}
.ar-e.sel .ln{stroke:var(--accent);stroke-width:2.4}
.ar-e .el{font:11px var(--f-body);fill:var(--ink-2);text-anchor:middle;paint-order:stroke;stroke:var(--paper);stroke-width:4px;pointer-events:none}
.tmp{stroke:var(--accent);stroke-width:2;stroke-dasharray:6 4;fill:none;pointer-events:none}
.arch-info{overflow:auto;border:1px solid var(--rule);border-radius:12px;background:var(--sheet);padding:14px;display:flex;flex-direction:column;gap:10px;font-size:.92rem}
.arch-info h3{font-size:1.1rem}
.arch-info p{line-height:1.5}
.ar-lbl{display:flex;flex-direction:column;gap:4px;font-size:.78rem;color:var(--ink-2)}
.ar-lbl input{font:inherit;font-size:.9rem;color:var(--ink);background:var(--paper);border:1px solid var(--rule);border-radius:7px;padding:6px 8px}
.ar-links{display:flex;flex-direction:column;gap:3px;font-size:.86rem}
.ar-tpls{display:flex;flex-direction:column;gap:8px}
.ar-tpl{display:flex;flex-direction:column;gap:2px;text-align:left;border:1px solid var(--rule);background:var(--paper);border-radius:9px;padding:9px 11px;cursor:pointer;color:var(--ink)}
.ar-tpl:hover{border-color:var(--ink-3)}
.ar-tpl span{font-size:.82rem;color:var(--ink-2)}
.arch-log{display:flex;flex-direction:column;gap:4px;font-size:.86rem;border-top:1px solid var(--rule);padding-top:8px;min-height:2.4em}
.arch-log .bad{color:var(--bad)} .arch-log .ok{color:var(--ok)}
.btn.danger{color:var(--bad)}
@media (max-width:1000px){
  .arch-main{grid-template-columns:minmax(0,1fr);height:auto}
  .arch-pal{max-height:220px;order:2}
  .arch-canvas{height:62vh;order:1}
  .arch-info{order:3}
}