:root{--bg:#f5f7fa;--card:#fff;--text:#20242a;--muted:#69717d;--border:#dbe1e8;--accent:#2f6fed;--accentSoft:#eaf1ff;--good:#eaf7ef;--watch:#fff6dc;--alert:#fff0f0;--stage0:#f1f3f5;--stage1:#e7eefb;--stage2:#e9edf8;--stage3:#edf4e9;--stage4:#fbf2e3;--stage5:#f5e9ee}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif}.shell{max-width:1450px;margin:auto;padding:22px}.topbar{display:flex;justify-content:space-between;gap:20px;align-items:end}.eyebrow{font-size:12px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}h1{font-size:25px;margin:5px 0 0}.header-actions{display:flex;gap:8px;align-items:center}.tabs,.subtabs{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px;border-bottom:1px solid var(--border);padding-bottom:8px}.tab,.subtab{border:0;background:transparent;padding:10px 14px;border-radius:9px;color:var(--muted);cursor:pointer}.tab.active,.subtab.active{background:var(--accentSoft);color:var(--text);font-weight:700}.page{padding-top:18px}.hidden{display:none!important}.card,.metric-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px}.hero-grid{display:grid;grid-template-columns:2fr 1fr;gap:12px}.hero{display:flex;justify-content:space-between;align-items:center;min-width:0}.hero-title{font-size:21px;font-weight:700;overflow-wrap:anywhere}.hero-time{display:flex;flex-direction:column;text-align:right;white-space:nowrap}.hero-time strong{font-size:28px}.muted{color:var(--muted);font-size:13px}.top-mini{margin-top:5px}.section-title{font-weight:750;font-size:17px;margin:20px 0 10px}.section-title.compact{margin:0 0 10px}.section-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}.stage-ribbon{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.stage{padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--card)}.stage.active{outline:2px solid var(--accent);outline-offset:1px}.stage small{display:block;color:var(--muted);margin-top:3px}.metrics-grid{display:grid;gap:12px;margin-top:12px}.metrics-grid.four{grid-template-columns:repeat(4,1fr)}.metrics-grid.two{grid-template-columns:repeat(2,1fr)}.metric-card span{font-size:12px;color:var(--muted)}.metric-card strong{font-size:23px;display:block;margin-top:5px;font-variant-numeric:tabular-nums}.metric-card small{display:block;color:var(--muted);margin-top:4px}.metric-card.good{background:var(--good)}.metric-card.watch{background:var(--watch)}.metric-card.alert{background:var(--alert)}.split{display:grid;gap:12px;margin-top:12px}.split.two-one{grid-template-columns:2fr 1fr}.advisory-list,.setting-list,.analysis-list{display:grid;gap:8px}.advice{border:1px solid var(--border);border-radius:9px;padding:10px}.advice.good{background:var(--good)}.advice.watch{background:var(--watch)}.advice.alert{background:var(--alert)}.form-grid{display:grid;gap:10px}.form-grid.four{grid-template-columns:repeat(4,1fr)}.form-grid.three{grid-template-columns:repeat(3,1fr)}label{font-size:13px;color:var(--text)}input,select,textarea{width:100%;margin-top:5px;border:1px solid var(--border);border-radius:8px;padding:10px;background:#fff;color:var(--text)}input:focus,select:focus,textarea:focus{outline:2px solid #aac5ff;border-color:var(--accent)}textarea{resize:vertical}.button-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:13px}.button-row.tight{margin-top:8px}.btn{border:1px solid var(--border);border-radius:9px;padding:10px 14px;cursor:pointer}.btn.primary{background:var(--accent);color:white;border-color:var(--accent)}.btn.secondary{background:#fff}.btn.small{padding:7px 10px;font-size:12px}.btn.danger{background:#fff5f5;border-color:#efcaca;color:#8f3131}.top-gap{margin-top:14px}.block-label{display:block}.check-grid{display:flex;flex-wrap:wrap;gap:10px 18px}.check-grid.compact{gap:7px 12px}.check-grid label{display:inline-flex;align-items:center;gap:7px}.check-grid input,.check-label input,.switch-line input{width:auto;margin:0}.check-label{display:flex;align-items:center;gap:8px;margin-top:24px}.switch-line{display:flex;align-items:center;gap:9px;margin:4px 0 8px}.inline-label{display:flex;align-items:center;gap:8px}.inline-label select{width:auto;margin:0}.chart-wrap{margin-top:12px;overflow-x:auto;border:1px solid var(--border);border-radius:10px;background:#fff}.chart-wrap svg{width:100%;min-width:720px;display:block}.overview-chart svg{min-width:760px}.legend{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px;font-size:12px;color:var(--muted)}.legend-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:4px}.stage-legend{border:1px solid var(--border);border-radius:4px;width:16px;height:10px;display:inline-block;margin-right:4px}.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:10px}table{width:100%;border-collapse:collapse;min-width:900px;background:white}th,td{padding:9px 10px;border-bottom:1px solid var(--border);font-size:12px;text-align:left;vertical-align:top}th{background:#f8fafc;color:var(--muted);position:sticky;top:0}.badge{display:inline-block;padding:3px 8px;border-radius:999px;font-size:11px}.badge.HOLD{background:var(--good)}.badge.WATCH,.badge.ADJUST{background:var(--watch)}.badge.ALERT{background:var(--alert)}
.operation-help{border:1px solid var(--border);border-radius:10px;padding:12px;background:#f8fafc}.operation-help p{margin:.35rem 0;color:#657080;font-size:.9rem}.operation-preview{border:1px dashed #aeb8c5;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:5px}.operation-preview strong{font-size:.95rem;line-height:1.5}.prediction-control{min-width:0}.prediction-control select{margin-top:5px}.prediction-create{display:grid;grid-template-columns:auto minmax(240px,1fr) 1.4fr;align-items:end;gap:12px;border:1px solid var(--border);border-radius:12px;padding:12px;background:#f8fafc}.batch-preview{border:1px dashed #aeb8c5;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:4px}.batch-preview strong{font-size:19px;overflow-wrap:anywhere}.batch-preview small{color:var(--muted)}.custom-fields{display:grid;gap:8px;margin-top:9px}.custom-row{display:grid;grid-template-columns:1fr 1.4fr auto auto;gap:8px;align-items:end;border:1px solid var(--border);border-radius:10px;padding:10px;background:#fafbfd}.custom-row .check-label{margin:0 0 8px}.feed-bottle-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.feed-card{border:1px solid var(--border);border-radius:12px;padding:12px;background:#fff;min-width:0}.feed-card h3{margin:0 0 8px;font-size:15px}.feed-card .feed-status{font-size:12px;color:var(--muted);min-height:18px;margin-bottom:5px}.feed-card .btn{width:100%;margin-top:9px}.bottle-change-panel{border:1px solid #b9c8e8;background:#f7faff;border-radius:12px;padding:13px}.model-status{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;background:#f0f3f7;font-size:12px}.model-status.on{background:var(--good)}
@media(max-width:1100px){.feed-bottle-grid{grid-template-columns:repeat(3,1fr)}.prediction-create{grid-template-columns:1fr 1fr}.prediction-create .muted{grid-column:1/-1}}
@media(max-width:900px){.metrics-grid.four,.form-grid.four{grid-template-columns:repeat(2,1fr)}.split.two-one,.hero-grid{grid-template-columns:1fr}.stage-ribbon{grid-template-columns:repeat(3,1fr)}.feed-bottle-grid{grid-template-columns:repeat(2,1fr)}.custom-row{grid-template-columns:1fr 1fr}.custom-row .check-label{margin:0}.prediction-create{grid-template-columns:1fr}}
@media(max-width:560px){.shell{padding:12px}.topbar{align-items:stretch;flex-direction:column}.header-actions{flex-direction:column}.metrics-grid.four,.metrics-grid.two,.form-grid.four,.form-grid.three{grid-template-columns:1fr}.stage-ribbon{grid-template-columns:repeat(2,1fr)}.hero{align-items:flex-start;gap:12px}.hero-time strong{font-size:22px}.feed-bottle-grid,.custom-row{grid-template-columns:1fr}.check-label{margin-top:0}.section-heading-row{align-items:stretch}}

/* R6 lifecycle, slider, stage-in-chart and compact material-entry refinements */
.status-badge{display:inline-flex;align-items:center;justify-content:center;width:max-content;padding:4px 9px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid var(--border);background:#f2f4f6;color:#59616c}.status-badge.running{background:#e7f7ec;color:#24663c;border-color:#b9dfc4}.status-badge.created{background:#fff4d8;color:#7d5a00;border-color:#ecd590}.status-badge.stopped{background:#f0f2f4;color:#68717c;border-color:#d8dde3}.hero-time .status-badge{margin-top:7px;margin-left:auto}.lifecycle-card{border-left:4px solid var(--accent)}.btn.start{background:#27784a;color:#fff;border-color:#27784a;font-weight:700;min-width:104px}.btn.stop{background:#9c3d3d;color:#fff;border-color:#9c3d3d;font-weight:700;min-width:104px}
.toggle{display:inline-flex;align-items:center;cursor:pointer;margin:0;user-select:none}.toggle>input{position:absolute;opacity:0;pointer-events:none}.toggle-track{width:48px;height:27px;border-radius:999px;background:#c8ced6;border:1px solid #b8c0ca;display:inline-flex;align-items:center;padding:2px;transition:.18s ease}.toggle-thumb{width:21px;height:21px;border-radius:50%;background:white;box-shadow:0 1px 3px rgba(0,0,0,.22);transform:translateX(0);transition:.18s ease}.toggle input:checked+.toggle-track{background:var(--accent);border-color:var(--accent)}.toggle input:checked+.toggle-track .toggle-thumb{transform:translateX(21px)}.toggle input:focus-visible+.toggle-track{outline:3px solid #aac5ff;outline-offset:2px}.prediction-create-switch{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:150px}.prediction-control #predictionStatus{margin-top:8px}
.stage-chart-legend{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0 2px}.stage-chip{--stage-color:#eee;display:inline-grid;grid-template-columns:10px auto;grid-template-rows:auto auto;column-gap:6px;align-items:center;border:1px solid var(--border);border-radius:9px;padding:5px 8px;background:color-mix(in srgb,var(--stage-color) 78%,white);font-size:11px}.stage-chip i{grid-row:1/3;width:10px;height:26px;border-radius:5px;background:var(--stage-color);border:1px solid rgba(0,0,0,.06)}.stage-chip b{font-size:12px;line-height:1.05}.stage-chip small{color:var(--muted);line-height:1.05}.stage-chip.active{outline:2px solid var(--accent);outline-offset:1px}.process-chart-card{padding-bottom:12px}
.inventory-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:#f8fafc}.inventory-toolbar p{margin:4px 0 0;color:var(--muted);font-size:12px}.compact-feed-grid{grid-template-columns:repeat(5,minmax(0,1fr));align-items:start}.feed-card.compact{padding:10px}.feed-card.compact h3{font-size:14px;margin:0}.feed-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.feed-card-head .btn{width:auto;margin:0;white-space:nowrap}.feed-weight-row label{display:block}.feed-change-inline{margin-top:9px;padding-top:9px;border-top:1px solid var(--border)}.feed-change-title{font-size:12px;font-weight:750;margin-bottom:7px}.mini-grid{display:grid;gap:7px}.mini-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.feed-change-inline label{font-size:11px}.feed-change-inline input{padding:8px;font-size:13px}.feed-card.expanded{grid-column:span 2;border-color:#aebfe5;background:#fbfcff}.event-time-row{align-items:end}
@media(max-width:1200px){.compact-feed-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.feed-card.expanded{grid-column:span 2}}
@media(max-width:800px){.compact-feed-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feed-card.expanded{grid-column:span 2}.inventory-toolbar{align-items:stretch;flex-direction:column}.inventory-toolbar .btn{width:100%}.stage-chart-legend{gap:5px}.stage-chip{padding:5px 7px}}
@media(max-width:560px){.compact-feed-grid{grid-template-columns:1fr}.feed-card.expanded{grid-column:span 1}.mini-grid.two{grid-template-columns:1fr}.stage-chip{grid-template-columns:8px auto}.stage-chip i{width:8px}.prediction-create-switch{width:100%}}

/* R7: top-right batch creation, automatic code-tagging, linked operation reasons */
.field-hint{display:block;margin-top:5px;color:var(--muted);font-size:11px;line-height:1.35}
.custom-row{grid-template-columns:1fr 1.4fr auto}
#newBatchTopBtn{white-space:nowrap;font-weight:700}
#opReason:disabled{background:#f2f4f7;color:#8a929d;cursor:not-allowed}
@media(max-width:900px){.custom-row{grid-template-columns:1fr 1fr auto}}
@media(max-width:560px){.custom-row{grid-template-columns:1fr}.header-actions #newBatchTopBtn{width:100%}}

/* R8: post-run export, multi-batch trend comparison and explicit y-axis ranges */
.trend-selector{border:1px solid var(--border);border-radius:10px;padding:11px;background:#fafbfd}.trend-selector-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.batch-check-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:9px}.batch-check-item{display:flex;align-items:flex-start;gap:8px;border:1px solid var(--border);border-radius:9px;padding:8px;background:#fff;min-width:0}.batch-check-item input{width:auto;margin:2px 0 0}.batch-check-item span{min-width:0;overflow-wrap:anywhere}.batch-check-item small{display:block;color:var(--muted);margin-top:2px}.trend-chart-layout{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:12px;align-items:stretch;margin-top:12px}.trend-chart-layout .chart-wrap{margin-top:0}.axis-range-panel{border:1px solid var(--border);border-radius:10px;background:#fff;padding:11px;min-width:0}.axis-range-title{font-size:13px;font-weight:750;margin-bottom:8px}.axis-range-list{display:grid;gap:8px}.axis-range-item{border:1px solid var(--border);border-radius:8px;padding:8px;background:#fafbfd}.axis-range-head{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700}.axis-range-item strong{display:block;margin-top:4px;font-size:13px;font-variant-numeric:tabular-nums}.axis-range-item small{display:block;color:var(--muted);margin-top:2px;line-height:1.35}.axis-swatch{width:11px;height:11px;border-radius:50%;display:inline-block;flex:0 0 auto}.legend-line{display:inline-block;width:24px;height:0;border-top:2px solid currentColor;margin-right:5px;vertical-align:middle}.export-panel{display:flex;align-items:center;justify-content:space-between;gap:16px;border-left:4px solid #27784a}.export-panel .btn{white-space:nowrap}.axis-note{font-size:11px;color:var(--muted)}
@media(max-width:980px){.batch-check-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.trend-chart-layout{grid-template-columns:1fr}.axis-range-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.batch-check-grid,.axis-range-list{grid-template-columns:1fr}.trend-selector-head,.export-panel{align-items:stretch;flex-direction:column}.trend-selector-head .button-row{margin-top:0}.export-panel .btn{width:100%}}
