.algorithm-area-tabs > .el-tabs__header { position: sticky; top: 64px; z-index: 18; }
.algorithm-area-tabs > .el-tabs__content { overflow: visible; }
.algorithm-metric-strip { grid-template-columns: repeat(6, minmax(115px, 1fr)); }
.model-management-workspace { min-width: 0; }

.model-toolbar { min-height: 58px; margin-bottom: 14px; padding: 10px 12px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.model-toolbar > .el-input { width: min(300px, 100%); }
.model-toolbar > .el-select { width: 165px; }
.model-toolbar > .el-alert { width: auto; min-width: min(560px, 100%); flex: 1; }
.toolbar-note { color: #64748b; font-size: 12px; }
.toolbar-field { display: flex; align-items: center; gap: 8px; }
.toolbar-field > span { color: #64748b; font-size: 12px; white-space: nowrap; }
.toolbar-field .el-select { width: 210px; }

.model-overview-metrics, .evaluation-metrics, .release-overview-strip { margin-bottom: 14px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid #dce4ed; border-radius: 6px; overflow: hidden; background: #fff; }
.model-overview-metrics > div, .evaluation-metrics > div, .release-overview-strip > div { min-height: 88px; padding: 14px 16px; border-right: 1px solid #e2e8f0; }
.model-overview-metrics > div:last-child, .evaluation-metrics > div:last-child, .release-overview-strip > div:last-child { border-right: 0; }
.model-overview-metrics strong, .model-overview-metrics span, .model-overview-metrics small,
.evaluation-metrics strong, .evaluation-metrics span, .evaluation-metrics small,
.release-overview-strip strong, .release-overview-strip span, .release-overview-strip small { display: block; }
.model-overview-metrics strong, .evaluation-metrics strong, .release-overview-strip strong { color: #17365d; font-size: 23px; }
.model-overview-metrics span, .evaluation-metrics span, .release-overview-strip span { margin-top: 7px; color: #475569; font-size: 12px; font-weight: 700; }
.model-overview-metrics small, .evaluation-metrics small, .release-overview-strip small { margin-top: 4px; color: #94a3b8; font-size: 10px; }

.model-name-button { width: 100%; padding: 0; display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 10px; border: 0; background: transparent; color: #1d2733; cursor: pointer; text-align: left; }
.model-name-button:hover strong { color: #0f6b65; }
.model-name-button span strong, .model-name-button span small { display: block; }
.model-name-button span strong { color: #17365d; font-size: 14px; }
.model-name-button span small { margin-top: 5px; color: #64748b; font: 11px Consolas, monospace; }
.model-type-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 5px; color: #fff; font-size: 21px; }
.model-type-icon.detection { background: #1f5d8f; }
.model-type-icon.segmentation { background: #0f766e; }
.model-type-icon.thermal { background: #b23a48; }
.model-type-icon.pointcloud { background: #5f6b7a; }
.model-type-icon.change { background: #b66a12; }
.modality-tag, .scene-tags .el-tag { margin: 2px 4px 2px 0; }

.model-context-header { min-height: 82px; margin-bottom: 14px; padding: 12px; display: grid; grid-template-columns: 34px 46px minmax(230px, 1fr) auto auto auto; align-items: center; gap: 12px; border: 1px solid #cfdbe8; border-radius: 6px; background: #fff; }
.back-model-list { width: 32px !important; height: 32px !important; }
.model-context-title span, .model-context-title strong, .model-context-title small { display: block; }
.model-context-title span { color: #64748b; font: 10px Consolas, monospace; }
.model-context-title strong { margin-top: 2px; color: #17365d; font-size: 17px; }
.model-context-title small { margin-top: 4px; color: #64748b; font-size: 11px; }
.model-context-facts { display: grid; grid-template-columns: repeat(3, minmax(100px, auto)); }
.model-context-facts > span { min-width: 110px; padding: 4px 14px; border-left: 1px solid #e2e8f0; }
.model-context-facts small, .model-context-facts strong { display: block; }
.model-context-facts small { color: #94a3b8; font-size: 10px; }
.model-context-facts strong { margin-top: 5px; color: #334155; font-size: 12px; }

.model-detail-tabs > .el-tabs__header { margin-bottom: 14px; padding-inline: 12px; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.model-detail-tabs > .el-tabs__content { overflow: visible; }
.model-detail-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(380px, .92fr); gap: 14px; }
.model-capability-panel, .model-production-panel, .recent-model-activity > section { min-width: 0; padding: 16px; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.model-capability-panel > header, .model-production-panel > header, .recent-model-activity section > header,
.artifact-detail-section > header, .evaluation-chart-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.model-capability-panel > header strong, .model-production-panel > header strong, .recent-model-activity section > header strong { color: #17365d; font-size: 15px; }
.model-capability-panel > header span { color: #64748b; font-size: 11px; }
.model-capability-panel > p { min-height: 42px; margin: 14px 0; color: #475569; font-size: 13px; line-height: 1.7; }
.model-capability-panel > dl { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid #e5edf5; }
.model-capability-panel > dl > div { min-height: 62px; padding: 10px; border-right: 1px solid #e5edf5; border-bottom: 1px solid #e5edf5; }
.model-capability-panel dt, .production-runtime dt { color: #94a3b8; font-size: 10px; }
.model-capability-panel dd, .production-runtime dd { margin: 6px 0 0; color: #334155; font-size: 12px; font-weight: 700; }
.model-capability-panel h3 { margin: 16px 0 8px; color: #475569; font-size: 12px; }
.production-metric-grid { margin-top: 14px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.production-metric-grid > div { min-height: 76px; padding: 12px; border: 1px solid #e2e8f0; background: #f8fafc; }
.production-metric-grid span, .production-metric-grid strong { display: block; }
.production-metric-grid span { color: #64748b; font-size: 11px; }
.production-metric-grid strong { margin-top: 8px; color: #0f766e; font-size: 22px; }
.production-runtime { margin: 12px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.production-runtime > div { min-width: 0; padding: 10px; border-bottom: 1px solid #e5edf5; }
.hash-value { overflow: hidden; color: #475569 !important; font: 10px/1.45 Consolas, monospace !important; text-overflow: ellipsis; word-break: break-all; }
.recent-model-activity { margin-top: 14px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.version-flow { margin-top: 16px; display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; }
.version-flow > div { position: relative; min-height: 74px; padding: 10px; border-left: 3px solid #94a3b8; background: #f8fafc; }
.version-flow > div.production { border-color: #15803d; }
.version-flow > div.candidate { border-color: #d97706; }
.version-flow strong, .version-flow span, .version-flow small { display: block; }
.version-flow strong { color: #17365d; }
.version-flow span { margin-top: 4px; color: #64748b; font-size: 10px; }
.version-flow small { margin-top: 5px; color: #94a3b8; font-size: 10px; }

.artifact-version-head, .evaluation-detail-head { margin-bottom: 18px; display: flex; align-items: center; gap: 12px; }
.artifact-version-head span strong, .artifact-version-head span small, .evaluation-detail-head span strong, .evaluation-detail-head span small { display: block; }
.artifact-version-head span strong, .evaluation-detail-head span strong { color: #17365d; font-size: 17px; }
.artifact-version-head span small, .evaluation-detail-head span small { margin-top: 4px; color: #64748b; }
.artifact-detail-section { margin-bottom: 14px; padding: 14px; border: 1px solid #dce4ed; border-radius: 6px; }
.artifact-detail-section dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.artifact-detail-section dl > div { min-width: 0; padding: 9px; border-bottom: 1px solid #edf2f7; }
.artifact-detail-section dt { color: #94a3b8; font-size: 10px; }
.artifact-detail-section dd { margin: 5px 0 0; color: #334155; font-size: 11px; word-break: break-word; }
.artifact-detail-section h3 { margin: 16px 0 8px; color: #475569; font-size: 12px; }
.artifact-checks { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.artifact-checks span { display: flex; align-items: center; gap: 6px; color: #475569; font-size: 12px; }
.artifact-checks .pass { color: #15803d; }
.artifact-checks .fail { color: #b91c1c; }

.parameter-toolbar { position: sticky; top: 124px; z-index: 12; }
.parameter-layout { min-height: 660px; display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 14px; align-items: start; }
.parameter-profile-list, .parameter-form-panel { min-width: 0; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.parameter-profile-list > header, .parameter-form-head { min-height: 54px; padding: 11px 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid #e2e8f0; }
.parameter-profile-list > header strong, .parameter-form-head strong { color: #17365d; font-size: 14px; }
.parameter-profile-list > header span { color: #64748b; font-size: 11px; }
.profile-row-button { width: 100%; min-height: 54px; padding: 6px 8px; border: 1px solid transparent; border-radius: 4px; background: transparent; cursor: pointer; text-align: left; }
.profile-row-button:hover, .profile-row-button.active { border-color: #7c9ab8; background: #f2f7fb; }
.profile-row-button strong, .profile-row-button span { display: block; }
.profile-row-button strong { color: #334155; font-size: 12px; }
.profile-row-button span { margin-top: 5px; color: #94a3b8; font-size: 10px; }
.parameter-form-panel { min-height: 660px; padding-bottom: 16px; }
.parameter-form-head { padding-inline: 18px; }
.parameter-form-head > div:first-child strong, .parameter-form-head > div:first-child span { display: block; }
.parameter-form-head > div:first-child span { margin-top: 4px; color: #64748b; font-size: 11px; }
.parameter-validation-alert { width: auto; margin: 14px 18px 0; }
.parameter-section { margin: 14px 18px 0; border: 1px solid #e2e8f0; }
.parameter-section > header { min-height: 42px; padding: 9px 12px; display: flex; align-items: center; justify-content: space-between; background: #f8fafc; }
.parameter-section > header strong { color: #334155; font-size: 13px; }
.parameter-section > header span { color: #94a3b8; font-size: 10px; }
.parameter-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.parameter-field { min-width: 0; min-height: 92px; padding: 12px; display: grid; grid-template-columns: minmax(118px, .42fr) minmax(180px, .58fr); align-items: center; gap: 12px; border-top: 1px solid #edf2f7; border-right: 1px solid #edf2f7; }
.parameter-label span, .parameter-label small { display: block; }
.parameter-label span { color: #334155; font-size: 12px; font-weight: 700; }
.parameter-label small { margin-top: 5px; color: #94a3b8; font: 9px Consolas, monospace; word-break: break-all; }
.parameter-control { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.parameter-control .el-slider { min-width: 90px; flex: 1; }
.parameter-control .el-input-number { width: 126px; }
.parameter-control > .el-select, .parameter-control > .el-input { width: 100%; }
.field-error { grid-column: 1 / -1; margin: 0; color: #b91c1c; font-size: 11px; }
.advanced-parameter-json { margin: 14px 18px 0; }
.advanced-parameter-json summary { padding: 10px 12px; border: 1px solid #e2e8f0; color: #475569; cursor: pointer; font-size: 12px; }
.advanced-parameter-json .el-textarea { margin-top: 8px; }
.advanced-parameter-json textarea { font: 11px/1.55 Consolas, monospace; }
.changed-value { display: block; padding: 4px 6px; color: #334155; font-size: 11px; white-space: normal; word-break: break-all; }
.changed-value:not(:empty) { background: #fff7ed; color: #9a3412; }

.test-config-strip { margin-bottom: 14px; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.test-type-control { min-height: 58px; padding: 9px 12px; display: flex; align-items: center; gap: 16px; border-bottom: 1px solid #e2e8f0; }
.test-type-control > span { color: #475569; font-size: 12px; font-weight: 700; }
.test-config-fields { padding: 12px; display: grid; grid-template-columns: minmax(220px, 1fr) repeat(2, minmax(210px, .72fr)); gap: 12px; }
.test-config-fields label > span { display: block; margin-bottom: 6px; color: #64748b; font-size: 10px; }
.test-config-fields .el-input, .test-config-fields .el-select { width: 100%; }
.test-input-tabs > .el-tabs__header { margin: 0; padding-inline: 12px; border: 1px solid #dce4ed; border-radius: 6px 6px 0 0; background: #fff; }
.test-input-tabs > .el-tabs__content { border: 1px solid #dce4ed; border-top: 0; border-radius: 0 0 6px 6px; background: #fff; }
.tab-label { display: inline-flex; align-items: center; gap: 7px; }
.tab-label b { min-width: 20px; height: 20px; padding: 0 5px; display: grid; place-items: center; border-radius: 10px; background: #e8eef5; color: #475569; font-size: 10px; }
.sample-selector-layout { min-height: 510px; display: grid; grid-template-columns: minmax(0, 1fr) 300px; }
.sample-browser { min-width: 0; padding: 12px; border-right: 1px solid #e2e8f0; }
.sample-filter-bar { margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
.sample-filter-bar .el-input { width: min(300px, 100%); }
.sample-filter-bar .el-select { width: 145px; }
.sample-name-cell { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: 8px; }
.sample-name-preview { width: 100%; padding: 0; border: 0; background: transparent; cursor: pointer; text-align: left; }
.sample-name-preview:hover strong { color: #1f5f99; }
.sample-name-cell span strong, .sample-name-cell span small { display: block; }
.sample-name-cell span strong { color: #334155; font-size: 12px; }
.sample-name-cell span small { margin-top: 4px; color: #94a3b8; font-size: 10px; }
.sample-modality { width: 24px; height: 24px; border-radius: 4px; background: #1f5d8f; }
.sample-modality.video { background: #0f766e; }
.sample-modality.thermal { background: #b23a48; }
.sample-modality.pointcloud { background: #5f6b7a; }
.sample-modality.raster { background: #b66a12; }
.difficulty-tag { margin: 2px 3px 2px 0; }
.selected-input-tray { min-width: 0; padding: 12px; background: #f8fafc; }
.selected-input-tray > header, .upload-session-panel > header, .result-item-list > header, .execution-events > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.selected-input-tray > header strong, .upload-session-panel > header strong, .result-item-list > header strong, .execution-events > header strong { color: #17365d; font-size: 13px; }
.selected-input-tray > header span, .result-item-list > header span, .execution-events > header span { color: #64748b; font-size: 10px; }
.selected-input-list { height: 320px; margin-top: 10px; display: grid; align-content: start; gap: 6px; overflow: auto; }
.selected-input-item, .result-item-list > button { width: 100%; min-height: 54px; padding: 7px; display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 8px; border: 1px solid #dce4ed; border-radius: 4px; background: #fff; color: #334155; text-align: left; }
.selected-input-item:hover, .result-item-list > button:hover, .result-item-list > button.active { border-color: #6f91b3; background: #f4f8fb; }
.selected-input-preview { min-width: 0; padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; text-align: left; }
.selected-input-preview strong, .selected-input-preview small, .result-item-list > button span strong, .result-item-list > button span small { display: block; }
.selected-input-preview strong, .result-item-list > button span strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.selected-input-preview small, .result-item-list > button span small { margin-top: 4px; color: #94a3b8; font-size: 9px; }
.selected-input-actions { display: flex; gap: 4px; }
.input-statistics { margin: 10px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); }
.input-statistics > div { padding: 8px 4px; text-align: center; }
.input-statistics dt { color: #94a3b8; font-size: 9px; }
.input-statistics dd { margin: 5px 0 0; color: #334155; font-size: 11px; font-weight: 700; }

.upload-test-layout { min-height: 470px; padding: 18px; display: grid; grid-template-columns: minmax(420px, 1fr) 360px; gap: 18px; }
.test-upload-dropzone .el-upload, .test-upload-dropzone .el-upload-dragger { width: 100%; }
.test-upload-dropzone .el-upload-dragger { min-height: 310px; display: grid; place-content: center; }
.test-upload-dropzone .el-icon--upload { color: #1f5d8f; font-size: 52px; }
.test-upload-dropzone .el-upload-list { max-height: 170px; overflow: auto; }
.upload-session-panel { min-width: 0; padding: 14px; border: 1px solid #dce4ed; background: #f8fafc; }
.upload-session-panel dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.upload-session-panel dl > div { min-width: 0; padding: 9px; border-bottom: 1px solid #e2e8f0; }
.upload-session-panel dt { color: #94a3b8; font-size: 9px; }
.upload-session-panel dd { margin: 4px 0 0; overflow: hidden; color: #334155; font-size: 11px; font-weight: 700; text-overflow: ellipsis; }
.uploaded-file-list { max-height: 220px; margin: 10px 0; padding: 0; display: grid; gap: 6px; overflow: auto; list-style: none; }
.uploaded-file-list li { padding: 7px; display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; align-items: center; gap: 7px; border: 1px solid #dce4ed; background: #fff; }
.uploaded-file-list li > button { min-width: 0; padding: 0; border: 0; background: transparent; color: #334155; cursor: pointer; text-align: left; }
.uploaded-file-list strong, .uploaded-file-list small { display: block; }
.uploaded-file-list strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.uploaded-file-list small { margin-top: 3px; color: #94a3b8; font-size: 9px; }
.uploaded-file-actions { display: flex; align-items: center; gap: 6px; }
.upload-session-panel > .el-button { width: 100%; margin-top: 10px; }

.test-budget-bar { min-height: 78px; margin-top: 14px; padding: 10px 12px; display: flex; align-items: center; gap: 10px; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.test-budget-bar > div { min-width: 88px; padding-right: 12px; border-right: 1px solid #e2e8f0; }
.test-budget-bar > div span, .test-budget-bar > div strong { display: block; }
.test-budget-bar > div span { color: #94a3b8; font-size: 9px; }
.test-budget-bar > div strong { margin-top: 5px; color: #334155; font-size: 12px; }
.test-budget-bar > p { margin: 0; display: flex; align-items: center; gap: 6px; color: #64748b; font-size: 11px; }
.test-budget-bar > p.valid { color: #15803d; }
.test-budget-bar > p.invalid { color: #b91c1c; }

.running-test-header { min-height: 62px; margin-bottom: 12px; padding: 10px 12px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.running-test-header > div:first-child { min-width: 0; display: flex; align-items: center; gap: 10px; }
.running-test-header span strong, .running-test-header span small { display: block; }
.running-test-header span strong { color: #17365d; }
.running-test-header span small { margin-top: 4px; color: #64748b; font: 10px Consolas, monospace; }
.test-step-track { margin: 12px 0; display: grid; grid-template-columns: repeat(8, minmax(105px, 1fr)); gap: 6px; overflow-x: auto; }
.test-step-track > div { min-height: 64px; padding: 8px; display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: center; gap: 7px; border: 1px solid #dce4ed; border-radius: 5px; background: #fff; }
.test-step-track > div > i { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: #e2e8f0; color: #64748b; font-size: 10px; font-style: normal; }
.test-step-track > div span strong, .test-step-track > div span small { display: block; }
.test-step-track > div span strong { color: #475569; font-size: 11px; }
.test-step-track > div span small { height: 24px; margin-top: 4px; overflow: hidden; color: #94a3b8; font-size: 8px; line-height: 1.4; }
.test-step-track > div.completed { border-color: #a7d7bd; background: #f0fdf4; }
.test-step-track > div.completed > i { background: #15803d; color: #fff; }
.test-step-track > div.active { border-color: #6f91b3; box-shadow: inset 0 0 0 1px #6f91b3; }
.test-step-track > div.active > i { background: #1f5d8f; color: #fff; }
.test-step-track > div.failed { border-color: #e6a7ad; background: #fff1f2; }
.test-step-track > div.failed > i { background: #b91c1c; color: #fff; }
.execution-monitor { min-height: 520px; display: grid; grid-template-columns: minmax(380px, .85fr) minmax(430px, 1.15fr); gap: 14px; }
.execution-current, .execution-events { min-width: 0; padding: 16px; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.processing-visual { position: relative; height: 300px; margin-bottom: 18px; overflow: hidden; border: 1px solid #cbd7e3; background: #0b1726; }
.processing-visual::before, .processing-visual::after { content: ""; position: absolute; left: 50%; bottom: -20%; width: 8px; height: 140%; transform-origin: bottom; background: #dce6ed; }
.processing-visual::before { transform: rotate(18deg); }
.processing-visual::after { transform: rotate(-18deg); }
.processing-visual span { position: absolute; z-index: 2; width: 72px; height: 72px; border: 1px solid #40b3a2; animation: process-scan 2.2s infinite; }
.processing-visual span:nth-child(1) { left: 22%; top: 28%; }
.processing-visual span:nth-child(2) { left: 58%; top: 42%; animation-delay: .5s; }
.processing-visual span:nth-child(3) { left: 44%; top: 16%; animation-delay: 1s; }
.processing-visual i { position: absolute; inset: 0; background: repeating-linear-gradient(0deg, transparent 0 26px, rgba(64,179,162,.08) 27px 28px); }
@keyframes process-scan { 0%, 100% { box-shadow: 0 0 0 rgba(64,179,162,0); } 50% { box-shadow: 0 0 18px rgba(64,179,162,.65); } }
.execution-current > strong, .execution-current > p { display: block; text-align: center; }
.execution-current > strong { color: #17365d; font-size: 15px; }
.execution-current > p { margin: 6px 0; color: #64748b; font-size: 11px; }
.execution-current > dl { display: grid; grid-template-columns: repeat(3, 1fr); }
.execution-current > dl div { padding: 9px; text-align: center; }
.execution-current dt { color: #94a3b8; font-size: 9px; }
.execution-current dd { margin: 4px 0 0; color: #334155; font-size: 11px; font-weight: 700; }
.execution-events ol { max-height: 470px; margin: 12px 0 0; padding: 0; overflow: auto; list-style: none; }
.execution-events li { min-height: 54px; display: grid; grid-template-columns: 65px 10px minmax(0, 1fr); align-items: center; gap: 8px; border-bottom: 1px solid #edf2f7; }
.execution-events time { color: #94a3b8; font: 9px Consolas, monospace; }
.execution-events li > i { width: 8px; height: 8px; border-radius: 50%; background: #1f5d8f; }
.execution-events li > i.completed { background: #15803d; }
.execution-events li > i.warning { background: #d97706; }
.execution-events li > i.failed { background: #b91c1c; }
.execution-events li strong, .execution-events li small { display: block; }
.execution-events li strong { color: #334155; font-size: 11px; }
.execution-events li small { margin-top: 4px; color: #94a3b8; font-size: 9px; }

.test-summary-strip { margin: 12px 0; display: grid; gap: 8px; }
.test-summary-item { min-height: 80px; padding: 10px 12px; display: grid; grid-template-columns: auto minmax(180px, .7fr) minmax(360px, 1.3fr); align-items: center; gap: 12px; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.test-summary-item > span strong, .test-summary-item > span small { display: block; }
.test-summary-item > span strong { color: #17365d; font-size: 13px; }
.test-summary-item > span small { margin-top: 5px; color: #64748b; font-size: 10px; }
.test-summary-item dl { margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); }
.test-summary-item dl > div { padding: 5px 8px; border-left: 1px solid #e2e8f0; }
.test-summary-item dt { color: #94a3b8; font-size: 9px; }
.test-summary-item dd { margin: 4px 0 0; color: #334155; font-size: 12px; font-weight: 700; }
.test-result-layout { min-height: 660px; display: grid; grid-template-columns: 280px minmax(460px, 1fr) 330px; border: 1px solid #dce4ed; border-radius: 6px; overflow: hidden; background: #fff; }
.result-item-list { min-width: 0; padding: 10px; border-right: 1px solid #dce4ed; background: #f8fafc; }
.result-list-filters { padding: 8px 0; }
.result-item-list > button { margin-bottom: 6px; }
.result-detail-panel { min-width: 0; padding: 12px; border-left: 1px solid #dce4ed; }
.result-metric-list, .result-runtime-list { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.result-metric-list > div, .result-runtime-list > div { min-width: 0; padding: 9px; border-bottom: 1px solid #edf2f7; }
.result-metric-list dt, .result-runtime-list dt { color: #94a3b8; font-size: 9px; }
.result-metric-list dd, .result-runtime-list dd { margin: 5px 0 0; color: #334155; font-size: 11px; font-weight: 700; word-break: break-word; }
.result-feedback-actions { margin-top: 16px; padding-top: 12px; border-top: 1px solid #e2e8f0; }
.result-feedback-actions > strong { display: block; margin-bottom: 8px; color: #475569; font-size: 11px; }
.result-feedback-actions .el-button-group { display: flex; }
.result-feedback-actions .el-button { min-width: 0; flex: 1; }

.model-result-viewer { min-width: 0; min-height: 660px; display: grid; grid-template-rows: 52px minmax(0, 1fr) 38px; background: #fff; }
.result-viewer-toolbar { padding: 8px 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid #dce4ed; }
.result-viewer-toolbar > div:first-child strong, .result-viewer-toolbar > div:first-child span { display: block; }
.result-viewer-toolbar > div:first-child strong { overflow: hidden; color: #17365d; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.result-viewer-toolbar > div:first-child span { margin-top: 3px; color: #94a3b8; font-size: 9px; }
.result-layer-controls { display: flex; align-items: center; gap: 8px; }
.result-layer-controls .el-checkbox { margin-right: 0; }
.result-viewer-footer { padding: 0 12px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid #dce4ed; color: #64748b; font-size: 9px; }
.image-result-canvas, .thermal-result-canvas, .raster-result-canvas { position: relative; min-height: 560px; overflow: hidden; background: #e7eef3; }
.image-result-canvas > img { width: 100%; height: 100%; object-fit: contain; background: #111827; }
.synthetic-rail-scene { position: absolute; inset: 0; overflow: hidden; background: #dbe7ef; }
.scene-sky { position: absolute; inset: 0 0 52%; background: #b9d2e1; }
.scene-ground { position: absolute; inset: 48% 0 0; background: #789175; }
.scene-rail { position: absolute; bottom: -12%; width: 8px; height: 82%; transform-origin: bottom; background: #36454f; box-shadow: 14px 0 0 #a7adb0; }
.rail-left { left: 42%; transform: rotate(9deg); }
.rail-right { right: 42%; transform: rotate(-9deg); }
.scene-catenary { position: absolute; left: 62%; top: 16%; width: 5px; height: 58%; background: #4b5563; }
.scene-catenary::before { content: ""; position: absolute; left: -180px; top: 12px; width: 230px; height: 3px; background: #4b5563; }
.prediction-box { position: absolute; z-index: 3; padding: 0; border: 2px solid #e11d48; background: rgba(225,29,72,.08); cursor: pointer; }
.prediction-box span { position: absolute; left: -2px; top: -22px; padding: 3px 6px; background: #e11d48; color: #fff; font-size: 9px; white-space: nowrap; }
.ground-truth-box { position: absolute; z-index: 2; left: 23%; top: 21%; width: 22%; height: 32%; border: 2px dashed #0f766e; }
.ground-truth-box span { position: absolute; left: 0; bottom: -20px; padding: 2px 5px; background: #0f766e; color: #fff; font-size: 9px; }
.mask-layer { position: absolute; z-index: 3; inset: 0; width: 100%; height: 100%; }
.mask-layer polygon { fill: rgba(15,118,110,.42); stroke: #0f766e; stroke-width: .6; vector-effect: non-scaling-stroke; }
.thermal-result-canvas { background: #202736; }
.thermal-equipment { position: absolute; left: 20%; right: 20%; top: 17%; bottom: 12%; display: flex; align-items: flex-end; justify-content: space-around; border-bottom: 18px solid #3a4657; }
.thermal-equipment > span { width: 15%; height: 58%; border: 5px solid #748194; background: #4d5969; }
.thermal-equipment > span:nth-child(2) { height: 78%; background: #7d4350; }
.thermal-equipment > i { position: absolute; left: 18%; right: 18%; top: 18%; height: 12px; background: #566275; }
.thermal-hotspot { position: absolute; z-index: 3; width: 88px; height: 88px; transform: translate(-50%, -50%); border: 1px solid #ffdd55; border-radius: 50%; background: rgba(202,36,45,.54); color: #fff; cursor: pointer; }
.thermal-hotspot::before, .thermal-hotspot::after { content: ""; position: absolute; left: 50%; top: 50%; background: #ffdd55; transform: translate(-50%, -50%); }
.thermal-hotspot::before { width: 108px; height: 1px; }
.thermal-hotspot::after { width: 1px; height: 108px; }
.thermal-hotspot strong, .thermal-hotspot small { position: relative; z-index: 2; display: block; }
.thermal-hotspot strong { font-size: 15px; }
.thermal-hotspot small { margin-top: 3px; font-size: 9px; }
.thermal-scale { position: absolute; right: 18px; top: 18px; bottom: 18px; display: grid; grid-template-rows: auto 1fr auto; gap: 5px; color: #fff; font-size: 9px; }
.thermal-scale i { width: 15px; background: linear-gradient(0deg, #263b8f, #39b9c3, #f2d347, #d82935); }
.raster-result-canvas { background: #d8e4db; }
.raster-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(71,85,105,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(71,85,105,.12) 1px, transparent 1px); background-size: 42px 42px; }
.rail-corridor { position: absolute; left: 47%; top: -10%; width: 28px; height: 120%; transform: rotate(14deg); border-inline: 5px solid #475569; background: #94a3b8; }
.change-region { position: absolute; z-index: 3; border: 2px solid #b91c1c; background: rgba(185,28,28,.22); }
.change-region span { position: absolute; left: 0; top: -21px; padding: 3px 5px; background: #b91c1c; color: #fff; font-size: 9px; white-space: nowrap; }
.raster-legend { position: absolute; left: 12px; bottom: 12px; padding: 7px 9px; display: flex; align-items: center; gap: 6px; border: 1px solid #cbd5e1; background: rgba(255,255,255,.92); color: #475569; font-size: 9px; }
.raster-legend i { width: 14px; height: 8px; background: #b91c1c; }
.raster-legend span { margin-left: 12px; }

.pointcloud-viewer { position: relative; min-height: 560px; display: grid; grid-template-rows: 42px minmax(0, 1fr); background: #0b1726; }
.pointcloud-toolbar { padding: 5px 8px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; border-bottom: 1px solid #1e3a55; background: #10263b; }
.pointcloud-toolbar > span { margin-right: auto; display: flex; align-items: center; gap: 6px; color: #c8d7e8; font-size: 9px; }
.pointcloud-toolbar > span i { width: 7px; height: 7px; border-radius: 50%; background: #40b3a2; }
.pointcloud-canvas { min-width: 0; min-height: 510px; }
.pointcloud-canvas canvas { display: block; width: 100%; height: 100%; }
.pointcloud-axis { position: absolute; left: 10px; bottom: 10px; display: flex; gap: 6px; font: 9px Consolas, monospace; }
.pointcloud-axis span { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; color: #fff; }
.axis-x { background: #b91c1c; }.axis-y { background: #15803d; }.axis-z { background: #1d4ed8; }

.evaluation-chart-panel { margin-bottom: 14px; padding: 12px; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.evaluation-chart-panel > header div strong, .evaluation-chart-panel > header div span { display: block; }
.evaluation-chart-panel > header div strong { color: #17365d; font-size: 14px; }
.evaluation-chart-panel > header div span { margin-top: 4px; color: #64748b; font-size: 10px; }
.metric-chart-wrap { position: relative; min-height: 330px; }
.metric-comparison-chart { width: 100%; height: 330px; }
.metric-chart-wrap > .el-empty { position: absolute; inset: 0; }
.entity-link { padding: 0; border: 0; background: transparent; cursor: pointer; text-align: left; }
.entity-link strong, .entity-link small { display: block; }
.entity-link strong { color: #17365d; font-size: 12px; }
.entity-link:hover strong { color: #0f766e; }
.entity-link small { margin-top: 4px; color: #94a3b8; font-size: 9px; }
.success-count { color: #15803d; font-weight: 700; }
.failure-count { color: #b91c1c; font-weight: 700; }
.summary-detail-list { display: grid; gap: 12px; }
.summary-detail-list > section { padding: 14px; border: 1px solid #dce4ed; border-radius: 6px; }
.summary-detail-list section > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.summary-detail-list header div strong, .summary-detail-list header div span { display: block; }
.summary-detail-list header div strong { color: #17365d; font-size: 14px; }
.summary-detail-list header div span { margin-top: 4px; color: #64748b; font-size: 10px; }
.summary-detail-list section > dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); border: 1px solid #edf2f7; }
.summary-detail-list section > dl > div { padding: 9px; border-right: 1px solid #edf2f7; }
.summary-detail-list dt { color: #94a3b8; font-size: 9px; }
.summary-detail-list dd { margin: 5px 0 0; color: #334155; font-size: 13px; font-weight: 700; }
.summary-detail-list dl small { display: block; margin-top: 3px; font-size: 9px; }
.positive { color: #15803d; }.negative { color: #b91c1c; }
.summary-detail-list .el-table { margin-top: 12px; }

.runtime-deployment-panel { min-width: 0; }
.active-runtime-band { min-height: 92px; padding: 14px 16px; display: grid; grid-template-columns: minmax(180px, .65fr) minmax(650px, 2fr) auto; align-items: center; gap: 18px; border: 1px solid #b9d8cf; border-left: 4px solid #0f766e; border-radius: 6px; background: #f3faf8; }
.active-runtime-state { min-width: 0; display: flex; align-items: center; gap: 10px; }
.runtime-live-dot { width: 10px; height: 10px; border-radius: 50%; background: #15803d; box-shadow: 0 0 0 4px rgba(21,128,61,.12); }
.active-runtime-state span:last-child { min-width: 0; }
.active-runtime-state small, .active-runtime-state strong { display: block; }
.active-runtime-state small { color: #64748b; font-size: 9px; }
.active-runtime-state strong { margin-top: 5px; overflow: hidden; color: #17365d; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.active-runtime-band > dl { margin: 0; display: grid; grid-template-columns: repeat(6, minmax(90px, 1fr)); }
.active-runtime-band > dl div { min-width: 0; padding: 4px 12px; border-left: 1px solid #d5e8e2; }
.active-runtime-band dt { color: #64748b; font-size: 9px; }
.active-runtime-band dd { margin: 5px 0 0; overflow: hidden; color: #334155; font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.active-runtime-actions { display: flex; align-items: center; gap: 8px; }
.runtime-readiness-alert { margin-top: 10px; }
.runtime-readiness-alert p { margin: 4px 0; color: #5f4b20; font-size: 11px; line-height: 1.55; }
.missing-artifact-list { display: grid; gap: 5px; margin: 7px 0; }
.missing-artifact-list code { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(300px, 1fr); gap: 12px; padding: 6px 8px; border: 1px solid #ead7a2; border-radius: 4px; background: #fffdf5; color: #7c4a03; font-size: 10px; word-break: break-all; }
.missing-artifact-list small { color: #64748b; font-family: Consolas, monospace; }
.runtime-toolbar { margin-top: 12px; }
.runtime-deployment-table { border: 1px solid #dce4ed; border-radius: 6px; overflow: hidden; background: #fff; }
.runtime-name-cell strong, .runtime-name-cell small { display: block; }
.runtime-name-cell strong { color: #17365d; font-size: 12px; }
.runtime-name-cell small { margin-top: 4px; color: #94a3b8; font: 9px Consolas, monospace; }
.runtime-endpoint { font: 10px Consolas, monospace; color: #334155; word-break: break-all; }
.runtime-config-form { display: grid; gap: 14px; }
.runtime-form-section { padding: 14px; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.runtime-form-section > header { margin-bottom: 13px; padding-bottom: 10px; display: flex; align-items: baseline; justify-content: space-between; gap: 14px; border-bottom: 1px solid #edf2f7; }
.runtime-form-section > header strong { color: #17365d; font-size: 13px; }
.runtime-form-section > header span { color: #64748b; font-size: 9px; text-align: right; }
.runtime-form-grid, .runtime-path-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 14px; }
.runtime-resource-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.runtime-form-section .el-form-item { margin-bottom: 12px; }
.runtime-form-section .el-select, .runtime-form-section .el-input-number, .runtime-form-section .el-segmented { width: 100%; }
.runtime-policy-row { display: grid; grid-template-columns: minmax(260px, 1fr) 180px; align-items: end; gap: 14px; }
.runtime-policy-row .el-form-item:last-child { padding: 0 10px; }

.model-release-timeline { margin-top: 14px; padding: 18px 22px; border: 1px solid #dce4ed; border-radius: 6px; background: #fff; }
.model-release-timeline p, .audit-timeline-wide p { margin: 5px 0; color: #64748b; font-size: 11px; }
.audit-timeline-wide small { color: #94a3b8; }

@media (max-width: 1500px) {
  .algorithm-metric-strip { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
  .model-context-header { grid-template-columns: 34px 42px minmax(210px, 1fr) auto auto; }
  .model-context-facts { display: none; }
  .test-result-layout { grid-template-columns: 250px minmax(430px, 1fr); }
  .result-detail-panel { grid-column: 1 / -1; border-top: 1px solid #dce4ed; border-left: 0; }
  .result-metric-list, .result-runtime-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .active-runtime-band { grid-template-columns: minmax(180px, .7fr) minmax(0, 2fr); }
  .active-runtime-actions { grid-column: 1 / -1; justify-self: end; }
}

@media (max-width: 1200px) {
  .model-detail-grid, .recent-model-activity, .execution-monitor { grid-template-columns: 1fr; }
  .parameter-layout { grid-template-columns: 280px minmax(0, 1fr); }
  .parameter-fields { grid-template-columns: 1fr; }
  .sample-selector-layout { grid-template-columns: minmax(0, 1fr) 270px; }
  .upload-test-layout { grid-template-columns: 1fr; }
  .test-config-fields { grid-template-columns: 1fr 1fr; }
  .test-config-fields label:first-child { grid-column: 1 / -1; }
  .test-budget-bar { align-items: stretch; flex-wrap: wrap; }
  .test-budget-bar > p { flex-basis: 100%; }
  .runtime-resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .model-overview-metrics, .evaluation-metrics, .release-overview-strip { grid-template-columns: repeat(2, 1fr); }
  .model-overview-metrics > div:nth-child(2), .evaluation-metrics > div:nth-child(2), .release-overview-strip > div:nth-child(2) { border-right: 0; }
  .model-context-header { grid-template-columns: 34px 40px minmax(0, 1fr) auto; }
  .model-context-header > .el-button:last-child { grid-column: 3 / -1; width: 100%; }
  .parameter-layout { grid-template-columns: 1fr; }
  .parameter-profile-list .el-table { height: auto !important; }
  .sample-selector-layout { grid-template-columns: 1fr; }
  .sample-browser { border-right: 0; border-bottom: 1px solid #e2e8f0; }
  .selected-input-list { height: auto; max-height: 280px; }
  .test-result-layout { grid-template-columns: 1fr; }
  .result-item-list { max-height: 300px; overflow: auto; border-right: 0; border-bottom: 1px solid #dce4ed; }
  .result-detail-panel { grid-column: auto; }
  .test-summary-item { grid-template-columns: auto minmax(0, 1fr); }
  .test-summary-item dl { grid-column: 1 / -1; }
  .active-runtime-band { grid-template-columns: 1fr; }
  .active-runtime-band > dl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .active-runtime-band > dl div:first-child { border-left: 0; }
  .active-runtime-actions { grid-column: auto; justify-self: stretch; }
  .active-runtime-actions .el-button { flex: 1; }
  .missing-artifact-list code { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .algorithm-metric-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .model-toolbar > .el-input, .model-toolbar > .el-select, .toolbar-field, .toolbar-field .el-select { width: 100%; }
  .model-toolbar .filter-spacer { display: none; }
  .model-context-header { grid-template-columns: 34px 36px minmax(0, 1fr); }
  .model-context-header > .el-tag { grid-column: 2 / -1; justify-self: start; }
  .model-context-header > .el-button:last-child { grid-column: 1 / -1; }
  .model-capability-panel > dl, .production-metric-grid, .production-runtime { grid-template-columns: repeat(2, 1fr); }
  .artifact-detail-section dl, .artifact-checks { grid-template-columns: 1fr; }
  .test-type-control { align-items: stretch; flex-direction: column; }
  .test-type-control .el-radio-group { display: grid; grid-template-columns: 1fr 1fr; }
  .test-type-control .el-radio-button { width: 100%; }
  .test-type-control .el-radio-button__inner { width: 100%; }
  .test-config-fields { grid-template-columns: 1fr; }
  .test-config-fields label:first-child { grid-column: auto; }
  .sample-filter-bar { align-items: stretch; flex-direction: column; }
  .sample-filter-bar .el-input, .sample-filter-bar .el-select { width: 100%; }
  .upload-test-layout { min-height: 0; padding: 10px; }
  .test-upload-dropzone .el-upload-dragger { min-height: 220px; }
  .running-test-header { align-items: stretch; flex-direction: column; }
  .test-summary-item { grid-template-columns: 1fr; }
  .test-summary-item dl { grid-column: auto; grid-template-columns: repeat(2, 1fr); }
  .result-metric-list, .result-runtime-list { grid-template-columns: repeat(2, 1fr); }
  .image-result-canvas, .thermal-result-canvas, .raster-result-canvas, .pointcloud-viewer { min-height: 430px; }
  .pointcloud-canvas { min-height: 380px; }
  .result-layer-controls .el-checkbox { display: none; }
  .active-runtime-band > dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .active-runtime-band > dl div:nth-child(odd) { border-left: 0; }
  .runtime-form-grid, .runtime-path-grid, .runtime-resource-grid, .runtime-policy-row { grid-template-columns: 1fr; }
}
