/* Only the scheme inside the existing production page is restyled. */
.scheme-scroll { overflow: visible; padding: 0; background: #f2f6f2; }
.scheme-scroll [hidden] { display: none !important; }
.scheme-tree-tools { display: flex; align-items: center; gap: 13px; flex-wrap: wrap; padding: 14px 20px; border-bottom: 1px solid #dce8df; background: #fff; }
.scheme-tree-tools label { color: #486653; font-size: 12px; font-weight: 700; white-space: nowrap; }
.scheme-tree-tools input { flex: 1 1 290px; max-width: 520px; min-width: 160px; min-height: 39px; padding: 8px 11px; border: 1px solid #cad9cc; border-radius: 8px; background: #fff; color: #173c35; font-size: 13px; }
.scheme-tree-tools input:focus-visible, .scheme-tree-tools button:focus-visible, .scheme-tree-node:focus-visible, .scheme-tree-result:focus-visible { outline: 3px solid #a8c88c; outline-offset: 2px; }
.scheme-tree-tools button { margin-left: auto; padding: 8px 11px; border: 1px solid #bbd0be; border-radius: 7px; background: #f2f8ef; color: #315d3b; font-size: 11px; font-weight: 700; cursor: pointer; }
.scheme-tree-tools button:hover { background: #e6f1e1; }
.scheme-tree-results { display: flex; flex-wrap: wrap; gap: 7px; padding: 10px 20px; border-bottom: 1px solid #dce8df; background: #fff; }
.scheme-tree-result { padding: 6px 9px; border: 1px solid #cfdfcf; border-radius: 6px; background: #f7fbf5; color: #315742; font-size: 11px; cursor: pointer; }
.scheme-tree-result:hover { background: #eaf3e7; }
.scheme-tree-result small { display: block; margin-top: 2px; color: #718675; font-size: 10px; }
.scheme-tree-viewport { max-height: 720px; min-height: 360px; overflow: auto; background: #fbfcf9; scrollbar-color: #9db4a4 #eef3ed; scrollbar-width: thin; }
.scheme-tree-viewport:focus-visible { outline: 3px solid #c4e0a6; outline-offset: -3px; }
.scheme-tree-canvas { position: relative; min-width: 1120px; min-height: 360px; background: radial-gradient(#e7eee7 .75px, transparent .75px) 0 0 / 18px 18px, #fbfcf9; transition: width .48s cubic-bezier(.22,.8,.25,1), height .48s cubic-bezier(.22,.8,.25,1); }
.scheme-scroll .scheme-tree-canvas > img { display: block; width: max(100%, 1120px); height: auto; margin: 0 auto; }
.scheme-tree-heading { position: absolute; top: 19px; width: 224px; color: #627d67; font-size: 10px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; white-space: nowrap; }
.scheme-tree-lines { position: absolute; inset: 0; z-index: 0; overflow: visible; pointer-events: none; }
.scheme-tree-line { fill: none; stroke: #b6cbb9; stroke-width: 1.5; opacity: .77; marker-end: url(#scheme-arrow); }
.scheme-tree-line.product { stroke: #a4bbca; }
.scheme-tree-line.active { stroke: #437c5b; stroke-width: 2.4; opacity: .95; marker-end: url(#scheme-arrow-active); }
.scheme-tree-node { position: absolute; z-index: 1; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 2px; width: 224px; height: 46px; padding: 5px 10px; overflow: hidden; border: 1px solid #d5e1d4; border-radius: 7px; background: #f9fcf7; color: #264934; text-align: left; box-shadow: 0 1px 3px #173a2610; cursor: pointer; }
.scheme-tree-node strong, .scheme-tree-node small { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.scheme-tree-node strong { font-size: 11px; line-height: 1.2; }
.scheme-tree-node small { color: #718676; font-size: 9px; line-height: 1.2; }
.scheme-tree-node.source { background: #e4eee1; border-color: #9fc29d; }
.scheme-tree-node.operation { background: #dbece0; border-color: #8db89b; }
.scheme-tree-node.material { background: #f2f8ea; border-color: #c8d9b7; }
.scheme-tree-node.product { background: #eaf2f8; border-color: #acc9d8; }
.scheme-tree-node.grade { background: #f0f8f2; border-color: #bcd6c0; }
.scheme-tree-node.grade.bc { background: #fff5e9; border-color: #e5cba9; }
.scheme-tree-node.repair { background: #fff0dd; border-color: #d8ad75; }
.scheme-tree-node.reject { background: #fff0ee; border-color: #d9aba4; }
.scheme-tree-node.selected { z-index: 2; outline: 2px solid #5d945b; outline-offset: 1px; border-color: #376e4a; background: #e0efdf; }
.scheme-tree-node.reject.selected { border-color: #ae544d; background: #ffe5e1; }
.scheme-tree-node:hover { filter: brightness(.97); }
.scheme-tree-detail { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; padding: 13px 20px; border-top: 1px solid #dce8df; background: #f9fbf7; color: #476857; font-size: 12px; }
.scheme-tree-detail strong { color: #244833; font-size: 13px; }
.scheme-tree-detail em { color: #738b77; font-style: normal; }
.scheme-tree-detail .scheme-detail-links { display: flex; flex-wrap: wrap; gap: 5px; width: 100%; }
.scheme-tree-detail .scheme-detail-links button { padding: 5px 7px; border: 1px solid #d5e3d3; border-radius: 5px; background: #fff; color: #365a40; font-size: 10px; cursor: pointer; }
.scheme-tree-detail .scheme-detail-links button:hover { background: #eaf4e7; }
@media (max-width: 640px) { .scheme-tree-tools { padding: 11px 14px; } .scheme-tree-tools button { margin-left: 0; } .scheme-tree-viewport { max-height: 570px; } .scheme-tree-detail { padding: 12px 14px; } }
@media (prefers-reduced-motion: reduce) { .scheme-tree-canvas { transition: none; } }