.suite-plugin-overview { padding-block: 0 24px; }
.mic-section-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-bottom: 22px; border-bottom: 1px solid #293c48; }
.mic-section-head small { color: #78cdbb; font: 11px var(--display); letter-spacing: 0; }
.mic-section-head h2 { font-size: 23px; line-height: 1.4; margin: 8px 0 0; letter-spacing: 0; }
.mic-section-head > span { color: var(--muted); font-size: 12px; line-height: 1.7; }
.suite-plugin-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-top: 18px; }
.suite-plugin { display: grid; grid-template-columns: 32px minmax(0, 1fr) 34px; align-items: center; gap: 18px; padding: 20px 24px; background: #0c1720; border: 1px solid #2a3b48; border-left: 3px solid #78cdbb; border-radius: 6px; }
.suite-plugin:nth-child(2) { border-left-color: #88cce8; }.suite-plugin:nth-child(3) { border-left-color: #e8c47c; }.suite-plugin:nth-child(4) { border-left-color: #df99aa; }
.suite-plugin > svg { width: 24px; height: 24px; color: #97c9cd; }
.suite-plugin h3 { margin: 0; font: 500 18px var(--display); }.suite-plugin h3 small { margin-left: 10px; font-size: 11px; color: var(--muted); }
.suite-plugin p { margin: 8px 0; line-height: 1.8; font-size: 13px; color: #c0d0da; }.suite-plugin div > span { font-size: 11px; color: #829ba8; }
.suite-example-heading { padding-block: 18px 0; border-top: 1px solid #293c48; }
.suite-example-heading h2 { margin: 0; font-size: 23px; line-height: 1.4; letter-spacing: 0; }
.suite-feature[id] { scroll-margin-top: 140px; }
.mic-technical { display: grid; gap: 28px; padding-block: 0 32px; }
.mic-tech-card { min-width: 0; padding: 28px; border: 1px solid #2a3b48; border-radius: 8px; background: #0c1720; }
.mic-intro-card { border-color: #31534f; background: linear-gradient(120deg, #0c1c20, #0c1720 68%); }
.mic-intro-visual { min-width: 0; min-height: 300px; display: grid; place-items: center; border: 1px solid #28444b; background: #09131c; overflow: hidden; }
.mic-intro-visual img { display: block; width: 100%; height: 100%; max-height: 340px; object-fit: contain; }
.mic-intro-copy { min-width: 0; }
.mic-intro-card .mic-section-head { border-bottom-color: #34544f; }
.mic-intro-card .mic-section-head h2 { font-size: 27px; }
.mic-intro-card .mic-tech-lead { max-width: none; margin: 22px 0 24px; color: #d1e2e3; font-size: 16px; line-height: 1.9; }
.mic-intro-points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.mic-intro-points > div { min-width: 0; padding: 16px; border: 1px solid #2c4a4b; background: rgba(17, 38, 40, .72); }
.mic-intro-points b { display: block; color: #83cfbb; font-size: 14px; font-weight: 500; }
.mic-intro-points span { display: block; margin-top: 7px; color: #a9c4c6; font-size: 12px; line-height: 1.8; }
.mic-intro-card { display: grid; grid-template-columns: minmax(320px, .9fr) minmax(0, 1.1fr); gap: 28px; align-items: stretch; }
.manager-closing { padding-block: 32px 28px; }
.mic-intro-bottom { padding-block: 0 24px; }
.mic-tech-lead { color: #b8cbd6; font-size: 14px; line-height: 1.9; margin: 22px 0; max-width: 1100px; }
.mic-layer-list { list-style: none; padding: 0; margin: 0; }
.mic-layer-list li { display: grid; grid-template-columns: 28px minmax(0, 1fr) 150px; gap: 18px; align-items: center; padding: 20px 0; border-bottom: 1px solid #273943; }
.mic-layer-list li > svg { color: #7ad5b9; width: 22px; height: 22px; }.mic-layer-list li:nth-child(3n+2) > svg { color: #89c7e1; }.mic-layer-list li:nth-child(3n) > svg { color: #e5be78; }
.mic-layer-list h3 { font-size: 15px; margin: 0 0 7px; font-weight: 500; }.mic-layer-list h3 code { font: 11px var(--display); color: #8cabb9; margin-left: 12px; }
.mic-layer-list p { margin: 0; color: #a6bdc9; line-height: 1.85; font-size: 13px; }.mic-layer-list li > span { color: #88a6b5; font-size: 11px; text-align: right; }
.mic-tech-note { display: flex; gap: 12px; align-items: flex-start; padding: 16px 0 0; color: #b9ad90; }.mic-tech-note > svg { flex: 0 0 18px; margin-top: 3px; }.mic-tech-note p { margin: 0; font-size: 12px; line-height: 1.9; }
.mic-package-strip { display: flex; align-items: center; gap: 16px; padding: 22px 0; border-bottom: 1px solid #293c48; }.mic-package-strip > svg { width: 28px; height: 28px; color: #7ad5b9; flex-shrink: 0; }.mic-package-strip b { font-size: 14px; font-weight: 500; }.mic-package-strip p { color: var(--muted); margin: 8px 0 0; line-height: 1.8; font-size: 12px; }
.mic-deploy-target { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 28px; padding: 28px 0; border-bottom: 1px solid #293c48; align-items: center; }
.mic-deploy-target img { width: 100%; height: 180px; object-fit: contain; background: #101b23; border-radius: 4px; }.mic-deploy-target h3 { font-size: 18px; margin: 0 0 12px; font-weight: 500; }.mic-deploy-target p { color: #b2c7d2; font-size: 13px; line-height: 1.9; margin: 0 0 16px; }
.mic-deploy-target dl { margin: 0; }.mic-deploy-target dl div { display: grid; grid-template-columns: 80px 1fr; gap: 12px; font-size: 12px; line-height: 1.9; padding: 6px 0; }.mic-deploy-target dt { color: #87a5b4; }.mic-deploy-target dd { margin: 0; }
.mic-soc-mark { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; height: 180px; background: #102623; color: #83cfbb; border: 1px solid #365c52; border-radius: 4px; }.mic-soc-mark > svg { width: 40px; height: 40px; }.mic-soc-mark b { font: 500 24px var(--display); }.mic-soc-mark span { text-align: center; font: 11px/1.6 var(--display); }
.mic-io-chain { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 24px 0; border-block: 1px solid #293c48; }.mic-io-chain > div { flex: 1; display: grid; gap: 10px; min-width: 0; }.mic-io-chain > div > svg { color: #8ccbd8; width: 24px; height: 24px; }.mic-io-chain b { font-size: 13px; font-weight: 500; }.mic-io-chain span { color: #89a5b4; font-size: 11px; }.mic-io-chain > svg { color: #5a7d8c; flex-shrink: 0; }
.mic-control-steps { list-style: none; padding: 0; margin: 22px 0 0; }.mic-control-steps li { display: grid; grid-template-columns: 150px 1fr; gap: 20px; padding: 14px 0; border-bottom: 1px solid #293c48; }.mic-control-steps b { font-size: 12px; color: #8dd3bc; font-weight: 500; }.mic-control-steps p { margin: 0; font-size: 13px; line-height: 1.8; color: #b2c7d2; }
.mic-tech-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
.mic-tech-card .suite-contracts { font-size: 12px; line-height: 1.8; }.mic-tech-card .suite-contracts th { white-space: nowrap; }
@media (max-width: 760px) {
    .mic-section-head { align-items: flex-start; flex-direction: column; gap: 12px; }.mic-section-head h2 { font-size: 20px; }
    .suite-plugin-list { grid-template-columns: 1fr; }.suite-plugin { padding: 16px; gap: 12px; grid-template-columns: 24px minmax(0, 1fr) 30px; }.suite-plugin h3 { font-size: 16px; }
    .mic-tech-card { padding: 18px; }.mic-intro-card { grid-template-columns: 1fr; gap: 20px; }.mic-intro-visual { min-height: 0; height: 220px; }.mic-intro-card .mic-section-head h2 { font-size: 20px; }.mic-intro-card .mic-tech-lead { font-size: 14px; }.mic-intro-points { grid-template-columns: 1fr; }.mic-layer-list li { grid-template-columns: 24px minmax(0, 1fr); gap: 12px; }.mic-layer-list li > span { grid-column: 2; text-align: left; }.mic-layer-list h3 code { display: block; margin: 6px 0 0; }
    .mic-deploy-target { grid-template-columns: minmax(0, 1fr); gap: 20px; }.mic-deploy-target img, .mic-soc-mark { max-width: 240px; }.mic-deploy-target dl div { grid-template-columns: 65px 1fr; }
    .mic-io-chain { flex-direction: column; align-items: flex-start; }.mic-io-chain > div { width: 100%; grid-template-columns: 28px minmax(0, 1fr); }.mic-io-chain span { grid-column: 2; }.mic-io-chain > svg { transform: rotate(90deg); margin-left: 5px; }
    .mic-control-steps li { grid-template-columns: 1fr; gap: 8px; }.mic-tech-card .suite-contracts { min-width: 650px; }
}
#suite .page-hero { padding-block: 48px 28px; }
#suite .suite-page-hero { display: block; }
#suite .suite-page-hero-copy { min-width: 0; }
#suite .suite-page-hero-media { position: relative; min-width: 0; margin: 0; border: 1px solid #37444a; background: #0d1318; overflow: hidden; }
#suite .suite-page-hero-media img { display: block; width: 100%; aspect-ratio: 16 / 8; object-fit: cover; filter: saturate(.8) contrast(1.05); }
#suite .suite-page-hero-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4, 9, 13, .84) 0%, rgba(4, 9, 13, .48) 38%, transparent 72%); pointer-events: none; }
#suite .suite-page-hero-copy { position: absolute; z-index: 1; left: 34px; bottom: 34px; width: min(720px, calc(100% - 68px)); }
#suite .suite-page-hero-copy h1 { text-shadow: 0 2px 18px rgba(0, 0, 0, .65); }
#suite .suite-page-hero-copy > p:last-child { color: #d3e0e4; text-shadow: 0 1px 12px rgba(0, 0, 0, .8); }
#suite .page-hero h1 { font-size: 32px; line-height: 1.35; letter-spacing: 0; }
#suite .page-hero > p:last-child { max-width: min(1180px, 100%); font-size: 14px; line-height: 1.9; }
#suite .suite-workbench { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; padding-block: 12px 32px; }
.suite-workbench .suite-feature { min-width: 0; border: 1px solid #2a3b48; border-radius: 8px; background: #0c1720; padding: 28px; overflow: hidden; }
.suite-workbench .suite-feature > header { padding-bottom: 22px; margin-bottom: 0; border-bottom: 1px solid #293c48; }
.suite-workbench .suite-feature h2 { font-size: 23px; letter-spacing: 0; }
.suite-workbench .suite-feature > header p { font-size: 12px; margin-top: 7px; }
.suite-workbench .suite-feature small { letter-spacing: 0; }
.suite-module-meta { margin-left: auto; text-align: right; display: flex; flex-direction: column; gap: 7px; font-size: 11px; color: var(--muted); }
.suite-module-meta b { color: #78d6b9; font-weight: 500; }
.suite-workbench .designer .module-letter { color: #88cce8; border-color: #407c93; background: #132b37; }
.suite-workbench .ai-module .module-letter { color: #e8c47c; border-color: #85734c; background: #2c291e; }
.suite-workbench .manager-module .module-letter { color: #df99aa; border-color: #895969; background: #2c2029; }
.suite-workbench .feature-points { margin-block: 20px 0; padding-top: 14px; border-top: 1px solid #293c48; display: flex; flex-wrap: wrap; gap: 12px 32px; }
.suite-workbench .feature-points li { margin: 0; font-size: 12px; }
.suite-workbench .engineering { grid-column: 1 / -1; }
[data-behavior-workbench] { min-width: 0; background: #0b131b; color: var(--text); font-size: 12px; }
[data-behavior-workbench] small { letter-spacing: 0; }
.bt-toolbar, .bt-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.bt-toolbar b { display: block; font-family: var(--display); font-size: 14px; }
.bt-toolbar small { display: block; color: var(--muted); margin-top: 5px; }
.bt-actions { display: flex; gap: 5px; }
.bt-actions button, .bt-actions a { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #34454e; border-radius: 4px; background: #18242b; color: #bfddd9; }
.bt-controls { justify-content: flex-start; background: #111d24; }
.bt-controls label { display: flex; align-items: center; gap: 8px; color: var(--muted); }
.bt-controls select, .bt-controls button { border: 1px solid #34454e; color: var(--text); background: #18242b; border-radius: 3px; padding: 5px 8px; font-size: 11px; }
.bt-controls input { width: 150px; accent-color: #40d59b; }
.bt-controls output { width: 60px; font-variant-numeric: tabular-nums; color: var(--green); }
.bt-workspace { display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; }
.bt-viewport { height: 660px; overflow: hidden; background: #0c161c; }
.bt-flow { width: 100%; height: 100%; }
.bt-flow .react-flow__handle { width: 7px; height: 7px; background: #8cb7bb; border: 1px solid #15242c; }
.bt-flow .react-flow__attribution { background: #142129; }.bt-flow .react-flow__attribution a { color: #95afb8; }
.bt-flow .react-flow__node { cursor: grab; }
.bt-load-error { padding: 24px; color: var(--amber); }
.bt-node-wrap { position: relative; flex-shrink: 0; }
.bt-node { display: grid; grid-template-rows: 14px 18px 12px; gap: 4px; width: 166px; height: 70px; padding: 8px 10px; border: 1px solid #3a505b; border-radius: 4px; text-align: left; background: #15242c; color: #e6eef0; }
.bt-node small { color: #82bad0; font: 10px/14px var(--display); }
.bt-node-type { display: flex; align-items: center; gap: 5px; }
.bt-node-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.bt-node-icon svg { width: 12px; height: 12px; }
.bt-node b { font-size: 12px; line-height: 18px; font-weight: 500; white-space: nowrap; }
.bt-node span { font: 9px/12px var(--display); color: #8dabb5; }
.bt-node .bt-node-icon { color: #82bad0; }
.bt-node-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.bt-node em { font: 9px/12px var(--display); color: #8ca1ac; }
.bt-node[data-state="RUNNING"] { border-color: #e0b364; background: #2b2b23; }
.bt-node[data-state="RUNNING"] em { color: #e0b364; }
.bt-node[data-state="SUCCESS"] em { color: #66d6ae; }
.bt-node[data-state="FAILURE"] em { color: #f28d85; }
.bt-node[aria-pressed="true"] { outline: 2px solid #59b9d4; outline-offset: 2px; }
.bt-expand { position: absolute; right: -9px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; padding: 2px; display: grid; place-items: center; z-index: 1; border: 1px solid #59737b; border-radius: 50%; background: #16252b; color: #c3e4df; }
.bt-expand svg { width: 10px; height: 10px; }
.bt-inspector { padding: 22px; border-top: 1px solid var(--line); background: #101e27; }
.bt-inspector h3 small { color: #829da9; font: 10px var(--display); margin-left: 10px; }
.bt-inspector [data-inspector] { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 10px 24px; }
.bt-inspector [data-inspector] > code { grid-column: 1; align-self: end; }
.bt-inspector [data-inspector] > h4 { grid-column: 1; grid-row: 2; margin-top: 0; }
.bt-inspector [data-inspector] > dl { grid-column: 2; grid-row: 1 / span 3; display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 10px 16px; margin: 0; }
.bt-inspector h3, .bt-runtime h3 { font-size: 12px; margin: 0 0 12px; }
.bt-inspector code { color: #69c6d6; font-size: 11px; }
.bt-inspector h4 { margin: 10px 0 18px; font-size: 14px; }
.bt-inspector dt { color: #8a9da8; font-size: 11px; margin: 0; line-height: 1.7; }
.bt-inspector dd { margin: 0; line-height: 1.7; overflow-wrap: anywhere; }
.bt-runtime { display: grid; grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--line); }
.bt-runtime section { min-width: 0; padding: 22px; }
.bt-runtime section + section { border-top: 1px solid var(--line); }
.bt-runtime h3 span, .bt-runtime h3 small { color: #69c6b0; font-size: 10px; margin-left: 10px; }
.bt-runtime dl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 36px; }
.bt-runtime dl div { display: flex; justify-content: space-between; gap: 8px; min-width: 0; padding: 10px 0; border-bottom: 1px solid #20323c; }
.bt-runtime dt { color: #8ba2ac; font: 10px var(--display); overflow-wrap: anywhere; }
.bt-runtime dd { margin: 0; font-size: 11px; white-space: nowrap; }
.bt-runtime p { margin: 8px 0; line-height: 1.6; font-size: 11px; }
.bt-runtime time { color: #84a6b4; margin-right: 10px; font-variant-numeric: tabular-nums; }
.suite-hmi { border-bottom: 1px solid #34464b; background: #101e24; }
.suite-hmi header, .suite-quality header { padding: 12px 16px; display: flex; justify-content: space-between; gap: 10px; border-bottom: 1px solid var(--line); font-size: 12px; }
.suite-hmi header span, .suite-quality header span { color: var(--green); }
.suite-hmi-values { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; padding: 28px 20px; }
.suite-hmi-values > div + div { border-left: 1px solid #34464b; padding-left: 20px; }
.suite-hmi-values small { display: block; margin-bottom: 7px; }
.suite-hmi-values b { font: 500 21px var(--display); }
.suite-table-scroll { overflow: auto; }
.suite-contracts { width: 100%; border-collapse: collapse; font-size: 11px; text-align: left; }
.suite-contracts caption { text-align: left; margin: 22px 0 12px; color: var(--muted); }
.suite-contracts th, .suite-contracts td { padding: 10px 8px; border-bottom: 1px solid var(--line); }
.suite-contracts th { color: var(--muted); font-weight: 400; }
.suite-quality dl { margin: 0; }
.suite-quality dl div { display: grid; grid-template-columns: 85px 1fr; gap: 14px; border-bottom: 1px solid var(--line); padding: 14px 0; font-size: 12px; line-height: 1.7; }
.suite-quality dt { color: var(--muted); }.suite-quality dd { margin: 0; }
.suite-section-heading { margin: 24px 0 12px; font-size: 13px; font-weight: 500; color: #c4d9e3; }
.suite-gates { margin: 0; padding: 0; list-style: none; counter-reset: gate; }
.suite-gates li { counter-increment: gate; display: grid; grid-template-columns: 30px minmax(0, 1fr) 80px; gap: 14px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line); }
.suite-gates li::before { content: '0' counter(gate); color: #819eac; font: 12px var(--display); }
.suite-gates b { display: block; font-size: 12px; font-weight: 500; }.suite-gates p { font-size: 12px; margin: 5px 0 0; color: var(--muted); line-height: 1.7; }
.suite-gates em { justify-self: end; font-size: 11px; font-style: normal; color: #e3bc72; }
.suite-workbench .manager-module > button { margin-top: 22px; }
.lab-app:has([data-lab-panel="workflow"].active) { height: auto; min-height: 900px; }
.lab-view[data-lab-panel="workflow"] { height: auto; }
.lab-view .bt-workspace { grid-template-columns: minmax(0, 1fr); }
.lab-view .bt-runtime { grid-template-columns: 1fr; }.lab-view .bt-runtime section + section { border-left: 0; border-top: 1px solid var(--line); }
@media (max-width: 900px) {
    .bt-workspace, .lab-view .bt-workspace { grid-template-columns: minmax(0, 1fr); }
    .bt-inspector [data-inspector] { display: block; }.bt-inspector [data-inspector] > dl { margin-top: 20px; }
    .bt-runtime { grid-template-columns: 1fr; }.bt-runtime section + section { border-left: 0; border-top: 1px solid var(--line); }
}
@media (max-width: 600px) {
    #suite .suite-page-hero-media img { aspect-ratio: 16 / 9; }.suite-page-hero-media::after { background: linear-gradient(0deg, rgba(4, 9, 13, .86) 0%, rgba(4, 9, 13, .3) 70%, transparent 100%); }.suite-page-hero-copy { left: 18px!important; bottom: 20px!important; width: calc(100% - 36px)!important; }
    #suite .suite-workbench { gap: 18px; }.suite-workbench .suite-feature { padding: 14px; }.suite-workbench .suite-feature > header { flex-wrap: wrap; gap: 12px; }
    .suite-module-meta { margin-left: 0; text-align: left; flex-direction: row; flex-wrap: wrap; width: 100%; }
    #suite .page-hero h1 { font-size: 26px; }.suite-workbench .suite-feature h2 { font-size: 19px; }
    .bt-viewport { height: 460px; }.bt-toolbar, .bt-controls { padding: 10px; }.bt-inspector { padding: 16px; }
    .bt-runtime dl { grid-template-columns: 1fr; }.bt-runtime section { padding: 12px; }
    .bt-controls label { flex-wrap: wrap; }.bt-controls input { width: 120px; }
    .suite-hmi-values { grid-template-columns: 1fr 1fr; padding: 20px 12px; }.suite-hmi-values > div + div { border: 0; padding-left: 0; }
    .suite-hmi-values b { font-size: 17px; }.suite-quality dl div { grid-template-columns: 70px 1fr; }
    .suite-gates li { grid-template-columns: 22px minmax(0, 1fr); }.suite-gates em { grid-column: 2; justify-self: start; }
}